/*Start Reset CSS*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';	content: none;}
table {border-collapse: collapse;	border-spacing: 0;}
/*End Reset CSS*/

/* Start root */  
:root{ 
--border-radius-001: 10px;
--border-radius-002: 50%;

--color-000000: #000000;
--color-333333: #333333;
--color-767067: #767067;
--color-e8aa23: #e8aa23;
--color-ffffff: #ffffff;
/* Start Colors Base */
--color-transparent: transparent;
--color-f1f1f1: #f1f1f1;
--color-888888: #888888;
--color-555555: #555555;
/* End Colors Base */

--height-navbar: 65px;
--max-width-001: 4000px;
--max-width-002: 2000px;
--max-width-003: 1600px;
--max-width-004: 1250px;
--max-width-005: 700px;
--max-width-006: 1450px;
--max-width-007: 850px;
--max-width-008: 1000px;

--z-index-001: 99;
--z-index-002: 50;
--z-index-003: 30;

/* Start Font/text values */
--font-family-Nunito-Sans: 'Nunito sans';
--font-family-Alegreya: 'Alegreya';
--font-style-normal: normal;
--font-style-italic: italic;
--font-weight-normal: normal;
--font-weight-regular: 400;
--font-weight-semi-bold: 600;
--font-weight-extra-bold: 800;
--font-size-06: 6px;
--font-size-07: 7px;
--font-size-08: 8px;
--font-size-09: 9px;
--font-size-10: 10px;
--font-size-11: 11px;
--font-size-12: 12px;
--font-size-13: 13px;
--font-size-14: 14px;
--font-size-15: 15px;
--font-size-16: 16px;
--font-size-17: 17px;
--font-size-18: 18px;
--font-size-19: 19px;
--font-size-20: 20px;
--font-size-21: 21px;
--font-size-22: 22px;
--font-size-23: 23px;
--font-size-24: 24px;
--font-size-25: 25px;
--font-size-27: 27px;
--font-size-30: 30px;
--font-size-32: 32px;
--font-size-33: 33px;
--font-size-35: 35px;
--font-size-38: 38px;
--font-size-40: 40px;
--font-size-42: 42px;
--font-size-45: 45px;
--font-size-47: 47px;

--line-height-00: 0px;
--line-height-05: 5px;
--line-height-10: 10px;
--line-height-13: 13px;
--line-height-15: 15px;
--line-height-16: 16px;
--line-height-17: 17px;
--line-height-19: 19px;
--line-height-20: 20px;
--line-height-23: 23px;
--line-height-25: 25px;
--line-height-28: 28px;
--line-height-30: 30px;
--line-height-32: 32px;
--line-height-35: 35px;
--line-height-40: 40px;
--line-height-42: 42px;
--line-height-44: 44px;
--line-height-45: 45px;
--line-height-50: 50px;
--line-height-54: 54px;
--line-height-60: 60px;

--text-underline: underline;

--text-align-start: start;
--text-align-left: left;
--text-align-right: right;
--text-align-center: center;
--text-align-justify: justify;

--text-uppercase: uppercase;
}
/* End Font/text values */

/* Scrollbar width */
::-webkit-scrollbar {width: 10px;}

/* Scrollbar Track */
::-webkit-scrollbar-track {background: var(--color-f1f1f1);}
 
/* Scrollbar Handle */
::-webkit-scrollbar-thumb {background: var(--color-888888); border-radius: 10px;}

/* Scrollbar Handle on hover */
::-webkit-scrollbar-thumb:hover {background: var(--color-555555);}
/* End root */  

/* Start Body */  
body,html {overflow-x: hidden; width: 100%; max-width: var(--max-width-001);}

body {overflow-y: hidden; font-family: var(--font-family-Nunito-Sans);}

h1, h2 {
  font-size: var(--font-size-40);
  font-style: var(--font-style-normal);
  font-weight: var(--font-weight-extra-bold);
  line-height: var(--line-height-40);
  color: var(--color-e8aa23);
}

.other-h1 h1 {
  font-size: var(--font-size-30);
  font-style: var(--font-style-normal);
  font-weight: var(--font-weight-extra-bold);
  color: var(--color-e8aa23);
}

h3 {
  font-size: var(--font-size-23);
  font-weight: var(--font-weight-semi-bold);
  line-height: var(--line-height-30);
  color: var(--color-e8aa23);
}

p {
  font-size: var(--font-size-18);
  font-style: var(--font-style-normal);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-25);
  color: var(--color-000000);
}

.other-p p {
  font-size: var(--font-size-20);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-28);
  text-align: center;
}

a {
  font-weight: var(--font-weight-extra-bold);
  font-size: var(--font-size-17);
  text-decoration: none;
  color: var(--color-ffffff);
}
/* End Body */

/* Start Generic */
.displayFlexRow {display: flex; flex-direction: row;}
.displayFlexColumn {display: flex; flex-direction: column;}
/* End Generic */

/* Start Header */
#header {
  display: flex;
  position: fixed;
  align-items: center;
  top: 0;
  transform: translateY(-100%);
  transition: transform 0.6s ease-in-out;
  width: 100vw;
  max-width: var(--max-width-001);
  height: var(--height-navbar);
  padding: 0% 3%;
  background-color: var(--color-ffffff);
  z-index: var(--z-index-001);
}
#header.is-open {transform: translateY(0);}
#logo img {width: 160px; margin-top: 4px; filter: invert(73%) sepia(83%) saturate(887%) hue-rotate(343deg) brightness(96%) contrast(89%);}
#header__menu {display: flex; width: 100%;}
.header__menu__nav {display: flex; justify-content: flex-end; width: 100%; margin-top: 4px;} 
.header__menu__nav span {color: var(--color-e8aa23);}
.header__menu__nav li {display: flex; flex-wrap: wrap; align-content: center; height: 14px;}
.header__menu__nav li a {font-size: var(--font-size-17); padding: 2px 25px; font-weight: var(--font-weight-semi-bold); color: var(--color-000000); transition-duration: .15s;}
.header__menu__nav li .header__menu__nav-social {padding: 2px 10px;}
.header__menu-underline {
  background-image: linear-gradient(var(--color-000000), var(--color-000000));
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: 0% 2px;
  transition: background-size 300ms ease-in-out;
}
.header__menu-underline:hover {background-size: 80% 2px; color: var(--color-000000);}

.header__menu-underline-span {
  background-image: linear-gradient(var(--color-e8aa23), var(--color-e8aa23));
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: 0% 2px;
  transition: background-size 300ms ease-in-out;
}
.header__menu-underline-span:hover {background-size: 80% 2px; color: var(--color-e8aa23);}

.hamburger {display: none; margin-top: -15px;}
.header-background {background-color: var(--color-ffffff); opacity: 0.85;} /* headerScroll.js customization*/
/* End Header */

/**********************************************************************************************************************************/
/**********************************************************************************************************************************/
/* Start glb1 */
/**********************************************************************************************************************************/
/**********************************************************************************************************************************/
/* Start Instagram Section */
#glb1 {align-items: center; background-color: var(--color-e8aa23);}

#glb1-box {
  width: 100%;
  max-width: var(--max-width-004);
  flex-direction: column;
  padding: 6% 6%;
}

#glb1-top {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
  margin-bottom: 48px;
}

#glb1-handle {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
}

#glb1-handle svg {width: 20px; height: 20px; fill: var(--color-000000);}

#glb1-handle span {
  font-size: var(--font-size-15);
  font-weight: var(--font-weight-extra-bold);
  color: var(--color-000000);
  letter-spacing: 1px;
}

#glb1-top h1 {
  font-size: var(--font-size-40);
  font-weight: var(--font-weight-extra-bold);
  color: var(--color-000000);
  text-transform: uppercase;
  letter-spacing: -1px;
  line-height: var(--line-height-40);
  margin-bottom: 14px;
}

#glb1-top p {
  font-size: var(--font-size-17);
  color: var(--color-333333);
  line-height: var(--line-height-28);
  max-width: 560px;
}

#glb1-top .buttom {
  background-color: var(--color-ffffff);
  color: var(--color-000000);
  white-space: nowrap;
}

#glb1-top .buttom:hover {background-color: var(--color-f1f1f1);}

#glb1-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 100px;
}

.glb1-tile {
  width: 100%;
  position: relative;
  aspect-ratio: 9 / 16;
  background-color: #c8901e;
  border-radius: var(--border-radius-001);
  overflow: hidden;
  cursor: pointer;
}

.glb1-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 0.85;
  transition: opacity 0.25s, transform 0.3s;
}

.glb1-tile:hover img {opacity: 1; transform: scale(1.04);}

.glb1-tile__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  transition: background 0.25s;
}

.glb1-tile:hover .glb1-tile__overlay {background: rgba(0, 0, 0, 0.28);}

.glb1-tile__badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(0, 0, 0, 0.55);
  border-radius: 4px;
  padding: 3px 8px;
  display: flex;
  align-items: center;
  gap: 5px;
}

.glb1-tile__badge svg {width: 12px; height: 12px; fill: var(--color-ffffff);}

.glb1-tile__badge span {
  font-size: var(--font-size-11);
  font-weight: var(--font-weight-extra-bold);
  color: var(--color-ffffff);
  letter-spacing: 1px;
  text-transform: uppercase;
}

.glb1-tile__play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.glb1-tile__play-circle {
  width: 48px;
  height: 48px;
  border-radius: var(--border-radius-002);
  background: rgba(232, 170, 35, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s;
}

.glb1-tile:hover .glb1-tile__play-circle {transform: scale(1.12);}

.glb1-tile__play-circle svg {
  width: 18px;
  height: 18px;
  fill: var(--color-000000);
  margin-left: 3px;
}
/* End Instagram Section */
/**********************************************************************************************************************************/
/**********************************************************************************************************************************/
/* End glb1 */
/**********************************************************************************************************************************/
/**********************************************************************************************************************************/

/* Start Footer */
#footer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100vw;
  max-width: var(--max-width-001);
  background: var(--color-333333) 0% 0% no-repeat padding-box;
  padding: 5% 6% 0% 6%;
  color: var(--color-000000);
}

#footer h2 {font-style: var(--font-style-normal); font-weight: var(--font-weight-semi-bold); font-size: var(--font-size-20); line-height: var(--line-height-30); color: var(--color-e8aa23); text-align: var(--text-align-left); margin-bottom: 5px;}

#footer p {
  font-size: var(--font-size-15);
  transition: .4s;
  font-style: var(--font-style-normal);
  text-align: var(--text-align-left);
  color: var(--color-ffffff);
  z-index: var(--z-index-002);
}

#footer__header {display: flex; justify-content: space-between; width: 100%;}

#footer__logo {width: 200px; margin-bottom: 15px;}

.footer__box {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  width: 100%;
}

.footer__row {display: flex; flex-wrap: nowrap; width: 100%; max-width: var(--max-width-003); justify-content: space-between;}
.footer__row-box {display: flex; flex-wrap: wrap; justify-content: flex-end;}
.footer__dot {display: flex; flex-direction: column; align-items: flex-start; width: 235px; height: 170px; padding: 0px;}
.footer__dot img {width: 18px; height: 18px; margin-right: 10px; z-index: var(--z-index-002);}

.footer__dot a {
  display: flex;
  align-items: normal;
  height: 27px;
  transition: .1s;
  font-style: var(--font-style-normal);
  font-weight: var(--font-weight-normal);
  font-size: var(--font-size-15);
  line-height: var(--line-height-23);
  text-align: var(--text-align-left);
  color: var(--color-ffffff);
  z-index: var(--z-index-002);
}

.footer__dot a:hover {
  font-weight: var(--font-weight-semi-bold);
  color: var(--color-ffffff);
  filter: brightness(0) saturate(100%) invert(73%) sepia(83%) saturate(887%) hue-rotate(343deg) brightness(96%) contrast(89%);
}

.footer__dot p {margin-bottom: 10px;}

.footer__dot-social {display: flex;}
.footer__dot-social a {margin-right: 10px;}
.footer__dot-intro {width: 250px; margin-right: 25px;}
.footer__dot-intro p {margin-bottom: 20px;}

.footer__arrow {display: flex; justify-content: flex-end;}
.footer__arrow img {width: 50px; height: 50px; z-index: var(--z-index-002);}
.footer__arrow img:hover {filter: drop-shadow(0 0 3px var(--color-ffffff));}

.footer__bottom {display: flex; justify-content: flex-end; align-items: center; width: 100%; margin-bottom: 25px;}
.footer__policy {display: flex; flex-direction: row; align-items: center; width: 360px; height: auto; padding-bottom: 20px;}
.footer__policy a {align-items: center; height: 19px;}
.footer__policy-border{border-left: 3px solid var(--color-e8aa23); border-right: 3px solid var(--color-e8aa23); margin: 0px 10px; padding: 0px 10px;}
/* End Footer */

/* Start Copyright */
#copyright {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: var(--max-width-001);
  height: 60px;
  position: absolute;
  background: var(--color-333333) 0% 0% no-repeat padding-box;
  z-index: var(--z-index-001);
}

#copyright a {font-size: var(--font-size-13); font-style: var(--font-style-normal); font-weight: var(--font-weight-light); color: var(--color-ffffff);}
#copyright span {font-size: var(--font-size-13); font-style: var(--font-style-normal); font-weight: var(--font-weight-light); color: var(--color-ffffff);}
#copyright__fuki {text-decoration-line: var(--text-underline); text-underline-offset: 3px;}

.copyright-hlp {margin-top: -1px; color: var(--color-ffffff); background: var(--color-182220) 0% 0% no-repeat padding-box;}
.copyright-hlp a {color: var(--color-ffffff);}
.copyright-hlp span {color: var(--color-ffffff);}
/* End Copyright */

/**********************************************************************************************************************************/
/**********************************************************************************************************************************/
/* Start Helpers*/
.buttom {display: inline-block; width: fit-content; background-color: var(--color-000000); padding: 10px 25px 8px 25px; border-radius: var(--border-radius-001); transition: all 0.12s}
.buttom:hover {background-color: var(--color-e8aa23);}
.buttonLink {display: flex; align-items: center; height: 20px; color: var(--color-182220);}
.buttonLink a {font-weight: var(--font-weight-semi-bold); font-size: var(--font-size-18); line-height: var(--line-height-28);}
.buttonLink img {width: 41px; height: 16px; margin-top: -2px; margin-left: 20px;}
/* End Helpers*/

/* Start for JavaScript */
.anchor{text-anchor: none;} /* smoothScroll.js */
.noScrollY {overflow-y: hidden;} /* headerScroll.js - menuMobile.js */

/* Start Show.js */
.show-hidden {opacity: 0; transition: 1s ease;}
.show-hiddenb {opacity: 0; filter: blur(5px); transition: 1s ease;}
.show-bottom {opacity: 0; filter: blur(5px); transform: translateY(50%); transition: 1s ease;}
.show-left {opacity: 0; filter: blur(5px); transform: translateX(-100%); transition: 1s ease;}
.show-right {opacity: 0; filter: blur(5px); transform: translateX(100%); transition: 0.7s ease-out;}
.show {opacity: 1; filter: blur(0); transform: translateX(0); transform: translateY(0);}
.delay1 {transition-delay: 0.5s}
.delay2 {transition-delay: 1s}
/* End Show.js */
/* End for JavaScript */

/* Start Animation */
.arrowDX:hover img {animation: hoverArrowDX 1s infinite 0.1s;}
@keyframes hoverArrowDX {0% {transform: translateX(0px);} 50% {transform: translateX(10px);} 100% {transform: translateX(0px);}}
/* End Animation */

/* Start Border-box */
/* Permette di resettare il padding degli elementi applicando questo all'interno degli elementi e non all'esterno [metterlo alla fine]*/
*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
/* End Border-box */
/**********************************************************************************************************************************/
/**********************************************************************************************************************************/
/* Start Mobile */
/* Start Weight */
@media screen and (max-width: 1400px){
  /* Global 1 */
  #glb1-grid {gap: 80px;}
}

@media screen and (max-width: 1150px){
  /* Global 1 */
  #glb1-grid {gap: 60px;}
}

@media screen and (max-width: 1050px){
  /* Footer */
  #footer {padding: 5% 4% 0% 4%;}
}

@media screen and (max-width: 950px){
  /* Footer */
  .footer__policy {width: 360px;}
}

@media screen and (max-width: 929px){
  /* Start menù mobile */
    .header__menu__nav {
      flex-direction:column;
      justify-content: center;
      margin-top: 0px;
      top: 0px;
      right: -100%;
      height: 100vh;
      opacity: 0.95;
      border-left: 5px solid var(--color-e8aa23);
      background: var(--color-333333);
      transition: all 1s cubic-bezier(.215, .61, .355, 1);
      position: absolute;
      overflow-y: auto;
      z-index: var(--z-index-001);
    }
    .header__menu__nav li {width: 50%; height: 60px; justify-content: center;}
    .header__menu__nav li a {padding: 15px; font-size: var(--font-size-24); font-weight: var(--font-weight-semi-bold); color: var(--color-ffffff);}
    .header__menu-underline:hover {background-size: 0% 0px; color: var(--color-f1f1f1);}
    .menu--open {right: -50%;}
    .hamburger {display: block; position: absolute; top: 36px; right: 30px; width: 30px; height: 30px; z-index: var(--z-index-001);}
    .hamburger span {display: block; width: 100%; height: 3px; margin-bottom: 5px; background-color: var(--color-555555); transition: all ease-in-out 0.4s; border-radius: 4px;}
    .header-background {opacity: 0.9;} /* headerScroll.js customization*/
    .header__menu__nav-social img {width: 30px; filter: invert(73%) sepia(83%) saturate(887%) hue-rotate(343deg) brightness(96%) contrast(89%);}
  /* End menù mobile */
}

@media screen and (max-width: 850px){
  /* Global 1 */
  #glb1-grid {gap: 30px;}
}

@media screen and (max-width: 820px){
  /* Footer */
  .footer__bottom {justify-content: center; margin-top: 0px; margin-bottom: 0px;}
  .footer__policy {justify-content: center; margin-right: 0px;}

  /* Copyright */
  #copyright {margin-top: 0px;}
}

@media screen and (max-width: 780px){
  h1, h2 {font-size: var(--font-size-35); line-height: var(--line-height-35);}
  h3 {font-size: var(--font-size-25); line-height: var(--line-height-28);}
  p {font-size: var(--font-size-17); line-height: var(--line-height-23);}
  a {font-size: var(--font-size-15); line-height: var(--line-height-18);}
  .buttom {padding: 7px 20px 7px 20px;}

  /* Footer */
  .footer__row {flex-direction: column; align-items: flex-start;}
  .footer__row-box {justify-content: flex-start;}
  .footer__dot-intro {margin-right: 0px;}
  #footer h2 {line-height: var(--line-height-28);}
}

@media screen and (max-width: 680px) {
  /* Global 1 */
  #glb1-grid {width: 100%; max-width: 350px; grid-template-columns: 1fr;}
  #glb1-top {flex-direction: column; align-items: flex-start;}
  #glb1-box {align-items: center; padding: 20% 6%;}
}

@media screen and (max-width: 550px){
  /* Footer */
  .footer__row-box {flex-direction: column; flex-wrap: nowrap;}
  .footer__row-box .footer__dot {height: auto;}
  .footer__mrg1 {margin-bottom: 20px;}
  .footer__mrg2 {margin-bottom: 65px;}
  .footer__mrg3 {margin-bottom: 50px;}
}

@media screen and (max-width: 400px){
  /* Header */
  .menu--open {right: 0%;}
  .header__menu__nav {align-items: center; border-left: none;}

  /* Footer */
  .footer__bottom {align-items: center; padding: 0% 3% 0% 3%;}
  .footer__policy {flex-direction: column; align-items: center; width: 140px; margin-bottom: 25px;}
  .footer__policy span {display: flex; width: 35px; border: 1px solid var(--color-e8aa23); margin: 7px 0px;}
  .footer__policy-border {border-left: none; border-right: none; margin: 0px; padding: 0px;}
}
/* End Weight */
/* End Mobile */