/* Present the original logo files without their large empty canvas margins. */
.brand-stage {
  padding:38px 24px 20px;
  text-align:center;
  position:relative
}

.brand-signature {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:48px;
  max-width:880px;
  margin:auto;
  padding:30px 50px;
  border:1px solid #ffffffeb;
  border-radius:40px;
  background:linear-gradient(120deg,#ffffffc9,#fffdf778);
  box-shadow:inset 0 2px 0 #fff,0 18px 50px #214b3c0b;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px)
}

.brand-mark {
  display:block;
  position:relative;
  overflow:hidden;
  flex:none;
  mix-blend-mode:multiply;
  transition:transform .4s ease;
  width:290px
}

.brand-mark img {
  position:absolute;
  max-width:none;
  height:auto!important;
  border-radius:0!important;
  display:block;
  pointer-events:none
}

.brand-enjoy {
  aspect-ratio:790/290
}

.brand-enjoy img {
  width:126.5823%!important;
  left:-10.1266%;
  top:-126.2%
}

.brand-corales {
  aspect-ratio:880/340
}

.brand-corales img {
  width:127.8409%!important;
  left:-12.5%;
  top:-83.82%
}

.brand-signature a:hover {
  transform:translateY(-4px)
}

.brand-signature a:focus-visible {
  outline:3px solid #2e6e78;
  outline-offset:7px
}

.brand-divider {
  width:1px;
  height:74px;
  background:linear-gradient(transparent,#a9b9a6,transparent);
  flex:none
}

.brand-destination {
  display:flex;
  gap:18px;
  justify-content:center;
  align-items:center;
  color:#476356;
  font-size:10px;
  font-weight:600;
  letter-spacing:.28em;
  margin-top:18px
}

.brand-destination span {
  color:#cf725b;
  font-size:16px
}

.branded-site nav {
  position:sticky;
  top:12px;
  left:auto;
  width:calc(100% - 48px);
  max-width:1000px;
  margin:0 auto;
  border:1px solid #ffffffd9;
  border-radius:100px;
  background:#fffdf0cf!important;
  backdrop-filter:blur(24px) saturate(1.5);
  -webkit-backdrop-filter:blur(24px) saturate(1.5);
  box-shadow:inset 0 1px 1px white,0 10px 35px #124d3810;
  z-index:50
}

.branded-site nav>div {
  justify-content:center;
  gap:40px;
  padding:15px 24px;
  min-height:66px
}

.branded-site nav a.bg-primary {
  border-radius:100px
}

.nav-destination {
  font-size:9px;
  font-weight:700;
  letter-spacing:.08em;
  color:#2e6e78
}

.branded-site #mobile-menu {
  top:86px;
  left:12px;
  width:calc(100% - 24px);
  border-radius:24px;
  background:#fffdf5f5;
  border:1px solid #fff;
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px)
}

.branded-site:not(.home-tropical)>main {
  padding-top:60px
}

.branded-site .tropical-hero {
  padding-top:70px;
  padding-bottom:80px;
  min-height:620px
}

.branded-site .footer-brand {
  width:280px;
  margin:0 auto 28px
}

@media(max-width:1000px) {
  .brand-signature {
    gap:32px;
    padding:26px 34px;
    max-width:750px
  }
  .brand-mark {
    width:250px
  }
  .branded-site nav>div {
    gap:24px
  }
}

@media(max-width:767px) {
  .brand-stage {
    padding:22px 16px 16px
  }
  .brand-signature {
    gap:16px;
    padding:20px 12px;
    border-radius:26px;
    max-width:510px
  }
  .brand-mark {
    width:calc((100vw - 94px)/2);
    max-width:200px
  }
  .brand-divider {
    height:46px
  }
  .brand-destination {
    font-size:8px;
    letter-spacing:.19em;
    margin-top:12px;
    gap:13px
  }
  .branded-site nav {
    top:10px;
    width:calc(100% - 24px)
  }
  .branded-site nav>div {
    justify-content:space-between;
    gap:8px;
    padding:10px 16px;
    min-height:58px
  }
  .branded-site .tropical-hero {
    padding-top:44px;
    padding-bottom:50px;
    min-height:0
  }
  .branded-site:not(.home-tropical)>main {
    padding-top:38px
  }
  .branded-site .footer-brand {
    width:260px;
    max-width:100%
  }
}

@media(prefers-reduced-motion:reduce) {
  .brand-mark {
    transition:none
  }
  .brand-signature a:hover {
    transform:none
  }
}

@supports not (backdrop-filter:blur(10px)) {
  .brand-signature,.branded-site nav {
    background:#fffdf3!important
  }
}

.branded-site nav>#mobile-menu {
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  width:100%;
  padding:0;
  min-height:0
}