/* -------------------------
   Scroll Indicator
------------------------- */
.scroll-indicator {width:25px; height:58px; border-radius:12px; border:1px solid var(--neutral-100); display:block; position:relative; background-color:#00000050; transition:background-color 0.3s ease-out;} 
.scroll-indicator::after {content:''; animation:bounce 2s infinite; width:16px; height:16px; background:url(/images/icon-arrow.svg) no-repeat 50% 100%; background-size:contain; position:absolute; bottom:.25rem; left:50%; transform:translateX(-50%); pointer-events:none;}
.scroll-indicator:hover {background-color:#ffffff50;}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translate(-50%, 0);
  }
  40% {
    transform: translate(-50%, -10px);
  }
  60% {
    transform: translate(-50%, -5px);
  }
}


/* -------------------------
   Hero
------------------------- */
.hero-description {font-size:34px; margin-bottom:40px; line-height:1.1;}
.section-hero {height:calc(100dvh); min-height:700px; display:flex; justify-content:space-between; position:relative; overflow-x:clip; flex-direction:column; color:var(--neutral-100);}
.section-hero .container {position:relative; flex:1; display:flex; justify-content:space-between; flex-direction:column;}
.section-hero::before {content:''; position: absolute; width:100%; top:0; left:0; height:20dvh; background:#000000; background:linear-gradient(180deg,rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0) 100%);}
.section-hero::after {content:''; position: absolute; width:100%; bottom:0; left:0; height:20dvh; background:#000000; background:linear-gradient(0deg,rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0) 100%);}
.title-overlay {position:absolute; top:0; left:0; width:100vw; height:100%; background:var(--neutral-900); opacity:0.3; left:calc(-50vw + 50%); z-index:2;}

.hero-titles {position:relative; z-index:3; max-width:600px; top:200px; text-shadow:1px 2px 5px rgba(0, 0, 0, 0.7);}
.caption {padding-bottom:1rem; position:relative; z-index:3; font-size:0.9rem; text-align:right;}
.hero-img {position:absolute; width:100%; height:100%; object-fit:cover; z-index:1;}


/* -------------------------
   Reception
------------------------- */
.section-reception {background:var(--primary-300); color:var(--neutral-100); overflow:hidden;}
.section-reception .container {position:relative; isolation:isolate;}
.section-reception .img-reception {height:100%; object-position:30% 50%;}
.section-reception .level-2-title {color:#B9B3AB;letter-spacing:.25rem;}
.section-reception .level-2-title span {color:#EEECE9;}
.section-reception-text-container {background:var(--primary-300); background:var(--primary-300); height:100%; padding:1.5rem;}
.section-reception .col-lg-4 {position:relative;}
.section-reception .col-lg-4::before {content:''; position:absolute; z-index:-1; top:0; left:-1.5rem; width:120vw; height:calc(200%);}

@media (min-width:992px) {
  .section-reception .col-lg-4::before {left:0; width:50vw; top:-50%; background:var(--neutral-400) url(/images/pattern-overlay-primary-400.svg) no-repeat 30% 0; background-size:480px;}
  .section-reception-text-container {margin-left:-0.75rem; margin-right:-0.75rem;}
  .section-reception .col-lg-4 {transform:translateX(-.75rem);}
}

