body {line-height: 1; font-family: "normalidad-text", sans-serif; font-weight: 300; color: #111434;}
h1, h2 {line-height: 1; font-family: "normalidad-text", sans-serif; font-weight: 400; font-size: 15px; text-transform: uppercase; position: relative; padding-left: 40px; display: block; margin-bottom: 0.5vw;}
h1::before, h2::before {content: "///"; display: block; font-family: "normalidad-text", sans-serif; font-weight: 400; font-size: 15px; position: absolute; left: 10px; top: 0px;}
h3 {font-family: "normalidad-text", sans-serif; font-weight: 700; font-size: 2.9vw; line-height: 1.2;}
h4 {line-height: 1; font-family: "normalidad-text", sans-serif; font-weight: 700;}
h5 {line-height: 1;}
p {font-size: 20px; line-height: 1.6; margin-bottom: 20px;}
p a {color: inherit; transition: 0.5s;}
p a:hover {color: #78BEF2;}
p:last-child {margin-bottom: 0!important;}

/* General */
.no-scroll {height: 100dvh; overflow-y: hidden;}

.social-links {display:flex}
.social-links a {padding:0 !important}
.social-links img {height: 20px; width:auto; margin-right: 15px;}

.button {padding: 20px 35px!important; color: #191C2F!important; background: #fff; transition: 0.5s; border-radius: 50vw; display: inline-block; text-transform: uppercase; font-family: "normalidad-wide", sans-serif; box-sizing: border-box; border: 1px solid #fff; cursor: pointer;}
.button.blue {background: #212439; color: #fff!important; border: 1px solid #212439;}

.button.outline {border: 1px solid #212439;}
.button.outline:hover,.button.outline.active {background: #212439; color: #fff!important;}

.button:hover {background: #212439; color: #fff!important;}
.button.blue:hover {background: #fff; color: #191C2F!important;}

.button.facebook {padding-right: 60px!important; position: relative;}
.button.facebook::after {content: ''; display: block; background: #212439; position: absolute; top: 50%; transform: translateY(-50%); right: 30px; width: 11px; height: 20px; mask-image: url('/img/facebook.svg'); mask-repeat:no-repeat; mask-size:contain; transition: 0.5s;}
.button.facebook:hover::after {background: #fff;}

.button.blue.facebook::after {background: #fff;}
.button.blue.facebook:hover::after {background: #212439;}

.content {margin: 5vw 0;}

.content-lrg {margin: 9vw 0;}
.content-lrg h3 {margin-bottom: 1vw; line-height: 1.1;}
.content-lrg ul {margin: 1.5vw 0 2vw; border-top: 1px solid #10143420; border-bottom: 1px solid #10143420; list-style: none;}
.content-lrg ul li {font-size: 1vw; line-height: 1.6;margin-bottom: 5px;}
.content-lrg ul li:first-child {margin-top: 1.5vw;}
.content-lrg ul li:last-child {margin-bottom: 1.5vw;}

.accommodation .content-lrg ul li, .accommodation .content-lrg p {max-width: 600px;}
.content-lrg .button-row p {font-family: "normalidad-wide", sans-serif; font-size: 15px; line-height: 1.2;}

.content.padding {padding: 5vw 0; margin: 0;}
.content.padding.under-banner {padding: 0 0 5vw; margin: 0;}

.padding-sml {padding: 5vw 0;}
.padding-lrg {padding: 7vw 0;}

/* Header */

header {position: fixed; top: 0px; width: 100%; z-index: 999; border-bottom: 1px solid #fff2; background: #21243900; backdrop-filter: blur(0px); -webkit-backdrop-filter: blur(0px); transition: 0.3s ease;}
header.sticky {background: #21243930;  backdrop-filter: blur(30px); -webkit-backdrop-filter: blur(30px)}

header .flex-row {align-items: flex-start;}
header .left {display:flex; align-content: flex-start}
header .left, header .right {flex: 1;}
header .left div, header .right a {color: #fff; text-transform: uppercase; font-size: 15px; font-family: "normalidad-wide", sans-serif; font-weight: 300; padding: 35px 20px; transition: 0.3s ease;}
header .right {display: flex; justify-content: flex-end; gap:20px; align-items: center; margin-right: 35px;}
header .left .menu {padding: 35px 70px 35px 35px; display: inline-block; position: relative; cursor: pointer; z-index: 1; transition: 0.3s ease;}
header .left .menu::after {content: ""; display: block; height: 100%; width: 1px;background: #fff2; left: 156px; position: absolute; top: 0px; z-index: -1;}
header .left .menu p {position: relative; overflow: hidden; margin: 0; line-height: 1;}
header .left .menu p span {display: block;}
header .left .menu p span:nth-child(2) {display: none;}
header .logo {margin: auto; position: absolute; left: 50%; transform: translateX(-50%); transition: 0.3s ease; z-index: 1;}
header .logo img {width: 100%; max-width: 487px; height: 250px; transition: 0.3s ease;}

header.sticky .left div, header.sticky .right a, header.inner .left div, header.inner .right a {padding: 40px 20px;}
header.sticky .logo img, header.inner .logo img {max-width: 241px; height: 100px;}
header.sticky .left .menu, header.inner .left .menu {padding: 40px 70px 40px 35px;}

.breadcrumbs {position: relative; width: 100%; box-sizing: border-box; padding: 20px 35px; border-top: 1px solid #fff2; color: #fff3; z-index: -1;}
.breadcrumbs a {color: #fff3; font-size: 12px; text-transform: uppercase;}
.breadcrumbs a:last-child {color: #fff;}

.hamburger {position: absolute;width: 22px; height: 10px; top: 49%; transform: translateY(-50%); right: 35px; padding: 0!important;}
.hamburger::before, .hamburger::after {content: ""; display: block; position: absolute; width: 100%; height: 1px; background: #fff; transition: 0.3s ease; transform: rotate(0deg);}
.hamburger::before {top: 0px; width: 22px;}
.hamburger::after {bottom: 0px; width: 11px;}

.active .hamburger::before {width: 14px; transform: rotate(45deg); top: 4px;}
.active .hamburger::after {width: 14px; transform: rotate(-45deg); bottom: 5px;}

.active.menu::after {opacity: 0;}
.active.menu p span {display: none!important;}
.active.menu p span:nth-child(2) {display: block!important;}

.nav {display: grid; grid-template-columns: 1fr 1fr; background: #212439; height: 100dvh !important; opacity: 1; top: 0px; left: 0px; transform: none; margin-top: 0px; border: 0; position: fixed; z-index: 0; max-height: 0dvh; padding: 0 !important; width: 100vw; max-width: 100%; transition: 0.5s; overflow: hidden;}
.nav.active {max-height: 100dvh;}

.nav article {display: flex; justify-content: center; flex-direction: column; align-items: flex-start; margin: auto 5vw;}
.nav article ul {margin: 0 auto 2vw; list-style: none; width: 100%;}
.nav article ul li {position: relative; left: -100%; transition: 0.7s ease;}
.nav article ul li a {display: inline-block; color: #fff; font-family: "normalidad-wide", sans-serif; font-weight: 700; font-size: 3vw; line-height: 1.2; position: relative; transition: 0.3s ease;}
.nav article ul li a:hover {color: #78BEF2;}
.nav article ul li a::after {content: "///"; display: block; font-family: "normalidad-text", sans-serif; font-weight: 300; font-size: 35px; position: absolute; right: -60px; top: 50%; transform: translateY(-50%); opacity: 0; transition: 0.3s ease; color: #fff;}
.nav article ul li a:hover::after {opacity: 1;}
.nav article .button {position: relative; left: -100%; transition: 0.7s ease;}

.active.nav .flex-row {top: 0; transition: 0.5s;}
.active.nav article {left: 0; transition-delay: 0.5s; transition: 0.5s;}
.active.nav article li:first-child {left: 0; transition-delay: 0.3s;}
.active.nav article li:nth-child(2) {left: 0; transition-delay: 0.4s;}
.active.nav article li:nth-child(3) {left: 0; transition-delay: 0.5s;}
.active.nav article li:nth-child(4) {left: 0; transition-delay: 0.6s;}
.active.nav article li:nth-child(5) {left: 0; transition-delay: 0.7s;}
.active.nav article li:nth-child(6) {left: 0; transition-delay: 0.8s;}
.active.nav article .button {left: 0; transition-delay: 0.9s;}

.nav > .button {position: absolute; left: 50%; transform: translateX(-50%); white-space: nowrap; bottom: -100px; opacity: 0; transform: 0.5s ease;}
.active.nav > .button  {bottom: 30px; opacity: 1; transition-delay: 1s;}

.home-banner {background: #212439; height: 100dvh; position: relative;}
.home-banner article {position: absolute; left: 4vw;  bottom: 0; color: #fff; z-index: 1;}
.home-banner article h2 {padding: 0; font-family: "normalidad-wide", sans-serif; font-weight: 700; font-size: 5.5vw; max-width: 65vw; line-height: 5.5vw; margin-bottom: 2vw;}
.home-banner article h2::before {display: none;}
.home-banner figure {height: 100%; position: relative;}
.home-banner figure::before {content: ""; display: block; position: absolute; width: 100%; bottom: 0; height: 200px; background: linear-gradient(0deg, rgba(33,36,57,1) 0%, rgba(33,36,57,0) 100%);}

.inner-banner {position: relative; background: #212439; color: #fff;}
.inner-banner figure {height: 100dvh;}
.inner-banner article {display: grid; grid-template-columns: 1fr auto; grid-gap: 5vw; box-sizing: border-box; padding: 12vw 4vw 3vw; align-items: flex-end;}
.inner-banner article h1 {padding: 0; font-family: "normalidad-wide", sans-serif; font-weight: 700; font-size: 7vw; max-width: 85vw; line-height: 6.5vw; margin-bottom: 0;}
.inner-banner article h1::before {display: none;}
.inner-banner article p {margin-bottom: 15px!important; max-width: 560px;}

.inner-banner figure + article {padding: 0; grid-template-columns: 1fr; grid-gap: 0; width: 95vw; position: absolute; top: 65%; left: 50%; transform: translate(-50%,-50%); text-align: center;}
.inner-banner figure + article h1 {padding: 0!important; margin-bottom: 4vw; line-height: 1; font-family: "normalidad-text", sans-serif; font-weight: 400; font-size: 15px; text-transform: uppercase; position: relative; padding-left: 40px; display: block; margin: 0 auto 3vw;}
.inner-banner figure + article h1::before {left: 50%; transform: translateX(-50%); top: -40px; display: block;}
.inner-banner figure + article h2 {padding: 0; font-family: "normalidad-wide", sans-serif; font-weight: 700; font-size: 7vw; max-width: 85vw; line-height: 6.5vw; margin: 0 auto  2vw;}
.inner-banner figure + article h2::before {display: none;}

.inner-banner.adventures figure {position: relative;}
.inner-banner.adventures figure::after {content: ""; display: block; position: absolute; width: 100%; top: 0; height: 200px; background: linear-gradient(180deg, rgba(33,36,57,1) 0%, rgba(33,36,57,0) 100%);}
.inner-banner.adventures figure + article {top: 50%;}
.inner-banner.adventures figure + article h3 {position: relative; font-size: 45px;}
.inner-banner.adventures figure + article h3 span {position: absolute; font-size: 15px;  left: 50%; transform: translateX(-50%); bottom: -20px;}

.merchandise .inner-banner h6 {font-size: 15px; text-transform: uppercase; padding-left: 10px; margin-bottom: 10px; display: block;}
.merchandise .inner-banner article p {max-width: 460px; margin-bottom: 20px!important}

.terms .inner-banner article h1 {font-size: 40px; text-align:center;}
.terms .wrapper-lrg article {margin: 0 auto; max-width: 800px;}

.wrapper {width: 80%; max-width: 1500px; margin: 0 auto;}
.wrapper-sml {width: 80%; max-width: 1300px; margin: 0 auto;}
.wrapper-lrg {margin: 0 4vw; width: auto; box-sizing: border-box;}

.grid {display: grid; grid-template-columns: 1fr 1fr; grid-gap: 5vw; align-items: center;}
.grid-3 {display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 35px;}
.grid-4 {display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 40px;}
.grid.no-gap {grid-gap: 5vw 3vw;}

.grid-features {display: grid; grid-template-columns: 320px 1fr; grid-gap: 8vw;}

figure.desktop {display: block;}
figure.mobile {display: none;}
figure.mobile video {width: 100%; height: 100%; object-fit: cover;}

.border-top {border-top: 1px solid #fff3;}

.dark-bg {background: #212439; color: #fff;}

.dark-bg .grid-left {padding-left: 4vw; display: grid; grid-template-columns: 2fr 3fr; grid-gap: 5vw;}
.dark-bg .grid-left div figure {margin-top: 5vw;}
.dark-bg .grid-left > figure {height: 100%; position: relative;}
.dark-bg .grid-left > figure::after {content: ""; display: block; position: absolute; width: 100%; bottom: 0; height: 200px; background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); z-index: 1; opacity: 0.5;}
.dark-bg .grid-right {padding-right: 4vw; display: grid; grid-template-columns: 3fr 2fr; grid-gap: 5vw;}
.dark-bg .grid-right div article {margin-left: 4vw; max-width: 42vw;}
.dark-bg .grid-right div figure {margin-bottom: 5vw; max-height: 73vh; height: 100%;}
.dark-bg .grid-right > figure {height: 100%; position: relative;}
.dark-bg .grid-right > figure::after {content: ""; display: block; position: absolute; width: 100%; bottom: 0; height: 200px; background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); z-index: 1; opacity: 0.5;}
.imagesSwiper, .imagesSwiper2  {height: 100%; position: absolute; top: 0; width: 100%;}
.imagesSwiper .swiper-slide, .imagesSwiper2 .swiper-slide {opacity: 0!important; transition: 0.7s ease;}
.imagesSwiper .swiper-slide-active, .imagesSwiper2 .swiper-slide-active {opacity: 1!important;}
.dark-bg h3 {max-width: 45vw; margin-bottom: 2vw;}

.custom-navigation {display: flex;}
.custom-prev, .custom-next {position: relative; height: 80px; width: 80px; box-sizing: border-box; border: 1px solid #fff;}
.custom-prev::after, .custom-next::after {content: ""; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: #fff; mask-image: url('/img/arrow.svg'); mask-size:contain; mask-repeat:no-repeat; width: 7px; height: 14px;}
.custom-prev::after {transform: translate(-50%,-50%) rotate(180deg);}
.custom-prev {border-right: 0;}
.swiper + .custom-navigation {position: absolute; bottom: 45px; left: 40px; z-index: 2; }

.text-slider {background: #111434; color: #fff; padding: 25px 0;}
.text-slider .swiper-wrapper {transition-timing-function: linear;}
.text-slider .swiper-wrapper .swiper-slide {width: auto;}
.text-slider .swiper-wrapper .swiper-slide p {font-family: "normalidad-wide", sans-serif; font-weight: 300; font-size: 15px; text-transform: uppercase; box-sizing: border-box; padding: 0 20px 0 40px; position: relative;}
.text-slider .swiper-wrapper .swiper-slide p::before {content: "///"; display: block; font-family: "normalidad-text", sans-serif; font-weight: 400; font-size: 15px; position: absolute; left: 0px; top: 0px;}

.adventures .content-left {padding: 4vw 0 4vw 4vw;}
.adventures .adventure-item {position: relative; overflow: hidden; height: 90dvh; background: #212439;}
.adventures .adventure-item figure {overflow: hidden; box-sizing: border-box; width: 100%; height: 100%; padding: 0; position: relative; transition: 0.3s ease;}
.adventures .adventure-item img {position: relative; z-index: 1;}
.adventures .adventure-item img.background + img {position: absolute; z-index: 2; bottom: 0px; transition: 0.3s ease; width: 100%; object-fit: cover; padding: 0; box-sizing: border-box; left: 0px;}
.adventures .adventure-item figure h3 {font-family: "normalidad-ultraextended", sans-serif; font-weight: 900; position: absolute; top: 30px; left: 30px; z-index: 1; color: #fff; text-transform: uppercase; transition: 0.3s ease; font-size: 3.5vw; line-height: 1; max-width: 25vw;}

.adventures .adventure-item .location {position: absolute; color: #fff; right: 1.8vw; bottom: 6vw; writing-mode: vertical-lr; text-transform: uppercase; white-space: nowrap; font-family: "normalidad-wide", sans-serif; font-weight: 700; font-size: 1.7vw; z-index: 2;}
.adventures .adventure-item .location span {position: absolute; font-size: 10px; font-weight: 100; bottom: 0px; right: 35px;}

.adventures .adventure-item article {position: absolute; bottom: 0px; height: 4vw; background: #111434; border-top: 1px solid #fff2; width: 100%;}
.adventures .adventure-item article .swiper {z-index: 4; top: 50%; transform: translateY(-50%);}
.adventures .adventure-item article .swiper-wrapper {transition-timing-function: linear;}
.adventures .adventure-item article .swiper-slide {width: auto!important; background: none; height: auto;}
.adventures .adventure-item article .swiper-slide p { font-family: "normalidad-wide", sans-serif; font-weight: 300; font-size: 15px; text-transform: uppercase; box-sizing: border-box; padding: 0 20px 0 40px; position: relative; color: #fff;}
.adventures .adventure-item article .swiper-slide p::after {content: "///"; display: block; font-family: "normalidad-text", sans-serif; font-weight: 400; font-size: 15px; position: absolute; left: 0px; top: 0px; color: #fff;}

.adventures .grid-3 .adventure-item {background: #111434;}
.adventures .grid-3 .adventure-item article {border:0;}

.adventures .grid-3 .adventure-item, .adventures .grid-3 .adventure-item figure, .adventures .grid-3 .adventure-item figure img.background + img {padding: 0;}
.adventures .grid-3 .adventure-item figure h3 {top: 40px; left: 35px; font-size: 3.5vw;}
.adventures .grid-3 .adventure-item figure h3 small {font-size: 2.8vw}
.adventures .grid-3 .adventure-item .location {z-index: 2; writing-mode: lr; right: 2.5vw; bottom: 4vw; max-width: 24vw; white-space: wrap; text-align: right; transition: 0.3s ease;}
.adventures .grid-3 .adventure-item .location span {right: 0px; top: -25px; font-size: 15px;}

.adventures .adventure-item:hover figure h3 {top: 60px; left: 60px;}
.adventures .adventure-item:hover figure { padding: 30px 5vw 6vw 30px;}
.adventures .adventure-item:hover figure img.background + img {padding: 30px 5vw 6vw 30px;}
.adventures .grid-3 .adventure-item:hover figure {padding: 40px 40px 80px;}
.adventures .grid-3 .adventure-item:hover figure h3 {font-size: 2.9vw; line-height: 1; top: 80px; left: 75px; max-width: 20vw;}
.adventures .grid-3 .adventure-item:hover figure img.background + img, .adventures .grid-3 .adventure-item:hover figure img.background + img {padding: 40px 40px 80px;}
.adventures .grid-3 .adventure-item:hover .location {right: 3.5vw; bottom: 5vw;}

.adventures h3 {font-size: 4.5vw; font-family: "normalidad-wide", sans-serif; line-height: 1;font-weight: 700; margin-bottom: 2vw; text-transform: uppercase;}
.adventures .flex-row {padding-right: 5vw;}
.adventures .custom-navigation {margin-top: 3vw;}
.adventures .custom-prev, .adventures .custom-next {border: 1px solid #ddd;}
.adventures .custom-prev::after, .adventures .custom-next::after {background: #11143430; transition: 0.5s ease;}
.adventures .custom-prev:hover::after, .adventures .custom-next:hover::after {background: #111434;}
.adventures .custom-prev {border-right: 0;}
.adventures .swiper-scrollbar {left: auto; bottom: 35px; width: 75vw; right: 5vw; height: 1px; background: #DDDDDD;}
.adventures .swiper-scrollbar-drag {background: #111434}

.dark-bg.no-padding {padding: 0px;}

.filter-wrapper {margin: 0 4vw; border-top: 1px solid #fff3; box-sizing: border-box; width: auto; padding: 30px 0 4vw;}

.filter.button {background: #fff3; color: #fff!important; border:1px solid transparent; margin-right: 10px;}
.filter.button.active {background: #fff!important; border:1px solid #fff; color: #191C2F !important;}

.content-banner {position: relative;}
.content-banner figure {height: 90dvh;}
.content-banner .overlay {position: absolute; left: 50%; transform: translateX(-50%); bottom: 3vw; color: #fff; width: 100%; box-sizing: border-box; padding: 0 4vw;}
.content-banner .overlay h3 {font-size: 4.5vw; font-family: "normalidad-wide", sans-serif; font-weight: 700; text-transform: uppercase; line-height: 1;}
.content-banner .overlay .button {margin-bottom: 10px;}
.content-banner .overlay .flex-row {align-items: flex-end;}

.center-content h3 {margin: 1.5vw 0; font-size: 4.5vw; font-family: "normalidad-wide", sans-serif; font-weight: 700; text-transform: uppercase; line-height: 1;}

.gallerySwiper {margin: 4vw 4vw 0;}
.gallerySwiper .swiper-slide {height: 0; position: relative; padding-bottom: 35%;}
.gallerySwiper .swiper-slide img {height: 100%; width: 100%; object-fit: cover; position: absolute;}
.gallerySwiper .custom-navigation {margin-top: 3vw; justify-content: center;}
.gallerySwiper .custom-prev, .gallerySwiper .custom-next {border: 1px solid #ddd;}
.gallerySwiper .custom-prev::after, .gallerySwiper .custom-next::after {background: #11143430; transition: 0.5s ease;}
.gallerySwiper .custom-prev:hover::after, .gallerySwiper .custom-next:hover::after {background: #111434;}
.gallerySwiper .custom-prev {border-right: 0;}

.about .intro article p {max-width: 710px; margin: 0 auto 20px;}
.about .intro .grid {align-items: flex-start;}
.about .content-lrg .grid article {max-width: 37vw; margin: 0 auto;}
.about .grid figure {position: relative; height: 0; padding-bottom: 120%; margin: 0 auto; max-width: 660px; width: 100%;}
.about .grid figure img {position: absolute;}

.grid-features article.list span {font-family: "normalidad-wide", sans-serif; font-weight: 100; color: #fff; font-size: 15px; line-height: 1.5; text-transform: uppercase;}
.grid-features article.list > span { margin-bottom: 15px; display: block;}
.grid-features article.list p {padding: 15px 0 0; border-top: 1px solid #fff2; font-size: 14px;}
.grid-features article.list p span {color: #fff6; font-size: 12px; display: block; margin-bottom: 5px}
.grid-features article h3 {margin-bottom: 1vw; line-height: 1.1;}
.grid-features .button-row {margin-top: 2vw;}
.grid-features .button-row a {cursor: pointer;}

.button-row {display: flex; align-items: center; gap: 25px;}
.button-row p {margin: 0;}

.content-left-inner { margin: 8vw 0 8vw 8vw;}
.content-left-inner article h3 {font-family: "normalidad-wide", sans-serif; font-weight: 700; text-transform: uppercase; font-size: 4.5vw; line-height: 1; margin-bottom: 20px;}
.content-left-inner figure {position: relative; width: 100%; height: 0; padding-bottom: 100%;}
.content-left-inner figure .swiper  {position: absolute; width: 100%; height: 100%;}
.content-left-inner .grid {align-items: flex-start;}
.content-left-inner .button-row {gap: 10px; margin-bottom: 40px;}
.content-left-inner .button-row .button {font-size: 15px; padding: 15px 30px!important}

.accordion-container > div { display: none; }
.accordion-container > div.active { display: block; }

.accordion {box-sizing: border-box; width: 100%; cursor: pointer; position: relative; padding: 35px 35px 35px 0; transition: 0.5s;  border-top: 1px solid #10143420; max-width: 720px;}
.accordion p {font-weight: 500; position: relative; line-height: 1; width: 100%; display: block; margin: 0; font-size: 30px;}
.accordion > p::before, .accordion > p::after {content: ""; display: block; position: absolute; top: 45%; right: 0px; transform: translateY(-50%) rotate(0); height: 20px; width: 3px; background: #383838; border-radius: 20px; transition: 0.5s ease;}
.accordion > p::after {transform: translateY(-50%) rotate(90deg);}
.accordion .panel {max-height: 0px; overflow: hidden; transition: 0.5s ease; height: auto;}
.accordion .panel p {max-width: 1000px; font-family: inherit; font-size: 20px; font-weight: 300; line-height: 1.5; width: 90%; margin-bottom: 10px;}
.accordion .panel li {font-weight: 300; font-size: 18px; line-height: 1.6; margin-bottom: 10px; display: block; position: relative; padding-left: 25px; box-sizing: border-box;}
.accordion .panel ul {list-style: none; margin: 20px 0;}
.accordion .panel li::before {position: absolute; left: 0; top: 11px; width: 8px; height: 8px; border-radius: 50vw; content: ""; display: block; background: #212439;}
.accordion .panel li :last-child {margin-bottom: 0px;}
.accordion .panel p:first-child {margin-top: 20px;}
.accordion .panel p:last-child {margin-bottom: 0px;}
.accordion.open > p::before {transform: translateY(-50%) rotate(135deg);}
.accordion.open > p::after {transform: translateY(-50%) rotate(220deg);}
.accordion.open .panel {max-height: 1000px;}
.accordion:last-child {margin-bottom: 0px; border-bottom: 1px solid #10143420;}

.img {position: relative; height: 0; padding-bottom: 100%;}
.img a {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.img a img {width: 100%; height: 100%; object-fit: cover;}
.grid-4 video {display: block; position: relative; width: 100%;}

.product-grid {display: grid; grid-template-columns: repeat(4,1fr); margin: 30px; grid-gap: 30px;}

.product-tile {display: block; box-sizing: border-box; border: 1px solid #fff; transition: 0.3s;}
.product-tile article {padding: 15px; font-family: "normalidad-wide", sans-serif; font-size: 15px; border-top: 1px solid #fff; box-sizing: border-box; transition: 0.3s;}
.product-tile article p.title {margin-bottom: 15px; font-size: 25px; position: relative; display: inline-block;}
.product-tile article p.title::after {content: "///"; display: block; font-family: "normalidad-text", sans-serif; font-weight: 400; font-size: 20px; position: absolute; right: -50px; top: 50%; transform: translateY(-50%);}
.product-tile article .price {text-align: right;}
.product-tile article .price p {margin-bottom: 10px; line-height: 1;}
.product-tile article .price p:last-child {margin-bottom: 0;}
.product-tile article .price.sale p:first-child {position: relative; display: inline-block;}
.product-tile article .price.sale p:first-child::before {content: ''; display: block; position: absolute; top: 50%; transform: translateY(-50%); width: 100%; height: 1px; background: #000;}
.product-tile article .price.sale p:last-child {color: red;}

.product-tile figure {position: relative; height: 0; padding-bottom: 100%; overflow: hidden;}
.product-tile figure img {position: absolute; left: 0; transition: 0.3s;}
.product-tile figure a:nth-child(2) img {left: 100%;}

.product-tile:hover {border: 1px solid #212439;}
.product-tile:hover article {border-top: 1px solid #212439;}
.product-tile:hover figure img {left: -100%;}
.product-tile:hover figure a:nth-child(2) img {left: 0;}
.product-tile figure a:only-child img {left: 0;}

#fancybox-title {display: none!important;}

footer {background: #212439; color: #fff;}
footer .footer-top {padding: 5vw 0 2vw; margin: 0 4vw; border-bottom: 1px solid #fff1; align-items: flex-end;}
footer .footer-top .button {margin-bottom: 15px;}
footer .footer-top h3 {font-size: 4.5vw; font-family: "normalidad-wide", sans-serif; font-weight: 700; text-transform: uppercase; line-height: 1; max-width: 45vw;}
footer .grid-4 {padding: 3vw 4vw; display: flex; justify-content: space-between;}
footer .grid-4 p {font-size: 1.2vw; line-height: 1.5vw;}
footer .grid-4 > div {position: relative;}
footer .grid-4 > div::after {content: "///"; display: block; font-family: "normalidad-text", sans-serif; font-weight: 400; font-size: 15px; position: absolute; right: -6vw; top: 50%; transform: translateY(-50%);}
footer .grid-4 > div:last-child::after {display: none;}
footer .copyright {padding: 25px 40px; border-top: 1px solid #fff1; color: #fff3;}
footer .copyright p {font-size: 13px;}

@-moz-document url-prefix() {
  h1, h2 {margin-bottom: 2vw;}
  .button {padding: 22px 30px 20px!important;}
}
