/* Shared interactions */
.nav a::after {
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .28s ease;
}

.nav a:hover::after,
.nav a[aria-current="page"]::after {
  transform: scaleX(1);
  transform-origin: left;
}

.brand-logo {
  transition: transform .32s cubic-bezier(.2, .8, .2, 1);
}

.brand:hover .brand-logo {
  transform: scale(1.06);
}

.btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: transform .24s cubic-bezier(.2, .8, .2, 1), box-shadow .24s ease, background .24s ease;
}

.btn::after {
  position: absolute;
  z-index: -1;
  top: -80%;
  left: -45%;
  width: 30%;
  height: 260%;
  transform: translateX(-180%) rotate(22deg);
  background: rgba(255, 255, 255, .25);
  content: "";
  transition: transform .6s ease;
}

.btn:hover::after {
  transform: translateX(640%) rotate(22deg);
}

.btn:active {
  transform: translateY(1px) scale(.97);
}

.btn:focus-visible,
.gallery-open:focus-visible,
.filter-btn:focus-visible {
  outline: 3px solid rgba(36, 121, 184, .55);
  outline-offset: 3px;
}

.whatsapp-float {
  animation: whatsapp-breathe 3.8s ease-in-out 1.5s infinite;
}

.whatsapp-float:hover {
  animation-play-state: paused;
}

@keyframes whatsapp-breathe {

  0%,
  82%,
  100% {
    box-shadow: 0 9px 28px rgba(11, 157, 114, .3), 0 0 0 0 rgba(11, 157, 114, .2);
  }

  90% {
    box-shadow: 0 9px 28px rgba(11, 157, 114, .3), 0 0 0 10px rgba(11, 157, 114, 0);
  }
}

/* Home page */
body[data-page="home"] .hero-home>img {
  animation: hero-drift 18s ease-in-out both;
}

@keyframes hero-drift {
  from {
    transform: scale(1.075);
  }

  to {
    transform: scale(1);
  }
}

body[data-page="home"] .hero-content>* {
  animation: hero-copy-in .65s cubic-bezier(.2, .7, .2, 1) both;
}

body[data-page="home"] .hero-content>*:nth-child(1) {
  animation-delay: .08s;
}

body[data-page="home"] .hero-content>*:nth-child(2) {
  animation-delay: .18s;
}

body[data-page="home"] .hero-content>*:nth-child(3) {
  animation-delay: .3s;
}

body[data-page="home"] .hero-content>*:nth-child(4) {
  animation-delay: .42s;
}

body[data-page="home"] .hero-content>*:nth-child(5) {
  animation-delay: .54s;
}

@keyframes hero-copy-in {
  from {
    transform: translateY(17px);
    opacity: 0;
    filter: blur(3px);
  }

  to {
    transform: translateY(0);
    opacity: 1;
    filter: blur(0);
  }
}

body[data-page="home"] .hero-content .eyebrow {
  animation-name: eyebrow-settle;
}

@keyframes eyebrow-settle {
  from {
    transform: translateY(9px);
    opacity: 0;
    letter-spacing: .25em;
  }

  to {
    transform: none;
    opacity: 1;
    letter-spacing: .16em;
  }
}

body[data-page="home"] .hero-actions .btn:first-child {
  animation: button-arrive .55s .48s both;
}

body[data-page="home"] .hero-actions .btn:last-child {
  animation: button-arrive .55s .6s both;
}

@keyframes button-arrive {
  from {
    transform: translateY(12px) scale(.96);
    opacity: 0;
  }

  to {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}

body[data-page="home"] .hero-note span {
  animation: note-pop .45s both;
}

body[data-page="home"] .hero-note span:nth-child(1) {
  animation-delay: .55s;
}

body[data-page="home"] .hero-note span:nth-child(2) {
  animation-delay: .68s;
}

body[data-page="home"] .hero-note span:nth-child(3) {
  animation-delay: .81s;
}

@keyframes note-pop {
  from {
    transform: translateY(8px);
    opacity: 0;
  }

  to {
    transform: none;
    opacity: 1;
  }
}

body[data-page="home"] .quick-book {
  animation: booking-arrive .65s .22s cubic-bezier(.2, .8, .2, 1) both;
}

@keyframes booking-arrive {
  from {
    transform: translateY(22px);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

body[data-page="home"] .quick-book .form-field input {
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body[data-page="home"] .quick-book .form-field input:focus {
  transform: translateY(-2px);
  box-shadow: 0 7px 17px rgba(36, 121, 184, .12), 0 0 0 3px rgba(36, 121, 184, .1);
}

body[data-page="home"] .stat {
  transition: transform .25s ease, background .25s ease;
}

body[data-page="home"] .stat:hover {
  transform: translateY(-4px);
  border-radius: 12px;
  background: var(--pale);
}

body[data-page="home"] .stat-icon {
  display: inline-block;
  transition: transform .3s ease;
}

body[data-page="home"] .stat:hover .stat-icon {
  transform: translateY(-3px) rotate(-8deg) scale(1.12);
}

body[data-page="home"] .service-card {
  transition: transform .32s cubic-bezier(.2, .8, .2, 1), box-shadow .32s ease, border-color .32s ease;
}

body[data-page="home"] .service-card:hover {
  border-color: rgba(7, 154, 135, .45);
}

body[data-page="home"] .service-card .card-image img {
  transition: transform .8s cubic-bezier(.2, .7, .2, 1), filter .4s ease;
}

body[data-page="home"] .service-card:hover .card-image img {
  transform: scale(1.08);
  filter: saturate(1.12);
}

body[data-page="home"] .service-card .icon {
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), background .25s ease;
}

body[data-page="home"] .service-card:hover .icon {
  transform: rotate(-9deg) scale(1.1);
  background: #d8f4ed;
}

body[data-page="home"] .split-image img:first-child {
  animation: image-float 7s ease-in-out infinite alternate;
}

body[data-page="home"] .split-image img:last-child {
  animation: image-float 6s ease-in-out -2s infinite alternate-reverse;
}

@keyframes image-float {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-8px);
  }
}

body[data-page="home"] .check-list li {
  transition: transform .22s ease, color .22s ease;
}

body[data-page="home"] .check-list li:hover {
  transform: translateX(5px);
  color: var(--teal-dark);
}

body[data-page="home"] .check-list li::before {
  transition: transform .25s ease, background .25s ease;
}

body[data-page="home"] .check-list li:hover::before {
  transform: rotate(12deg) scale(1.12);
  background: #c8f0e6;
}

body[data-page="home"] .destination-tile img {
  transition: transform .75s cubic-bezier(.2, .7, .2, 1), filter .4s ease;
}

body[data-page="home"] .destination-tile:hover img {
  transform: scale(1.075);
  filter: saturate(1.12);
}

body[data-page="home"] .destination-tile div {
  transition: transform .35s ease;
}

body[data-page="home"] .destination-tile:hover div {
  transform: translateY(-5px);
}

body[data-page="home"] .destination-tile h3 {
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 5px;
  transition: text-decoration-color .25s ease;
}

body[data-page="home"] .destination-tile:hover h3 {
  text-decoration-color: #76e0cd;
}

/* About page */
body[data-page="about"] .about-photo>img {
  animation: about-photo-reveal .9s cubic-bezier(.2, .7, .2, 1) both;
}

@keyframes about-photo-reveal {
  from {
    clip-path: inset(14% 12% 14% 12% round 40%);
    transform: scale(1.04);
    opacity: .5;
  }

  to {
    clip-path: inset(0 0 0 0 round 46% 46% 22px 22px);
    transform: scale(1);
    opacity: 1;
  }
}

body[data-page="about"] .photo-caption {
  animation: caption-pop .55s .45s cubic-bezier(.2, .8, .2, 1) both;
  transition: transform .25s ease, box-shadow .25s ease;
}

body[data-page="about"] .photo-caption:hover {
  transform: translateY(-4px) rotate(-1deg);
  box-shadow: 0 18px 35px rgba(18, 52, 90, .18);
}

@keyframes caption-pop {
  from {
    transform: translateY(12px) scale(.96);
    opacity: 0;
  }

  to {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}

body[data-page="about"] .value-card:nth-child(1) {
  transition-delay: .04s;
}

body[data-page="about"] .value-card:nth-child(2) {
  transition-delay: .12s;
}

body[data-page="about"] .value-card:nth-child(3) {
  transition-delay: .2s;
}

body[data-page="about"] .value-card .icon {
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), color .25s ease, background .25s ease;
}

body[data-page="about"] .value-card:hover .icon {
  transform: translateY(-4px) rotate(8deg);
  background: var(--teal);
  color: white;
}

/* Services page */
body[data-page="services"] .service-nav a {
  position: relative;
  overflow: hidden;
  transition: color .2s ease, background .2s ease, padding-left .2s ease;
}

body[data-page="services"] .service-nav a::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  transform: scaleY(0);
  background: var(--teal);
  content: "";
  transition: transform .2s ease;
}

body[data-page="services"] .service-nav a:hover {
  padding-left: 18px;
}

body[data-page="services"] .service-nav a:hover::before {
  transform: scaleY(1);
}

body[data-page="services"] .service-detail-image img {
  transition: transform .7s cubic-bezier(.2, .7, .2, 1), filter .35s ease;
}

body[data-page="services"] .service-detail:hover .service-detail-image img {
  transform: scale(1.055);
  filter: saturate(1.12);
}

body[data-page="services"] .service-detail:nth-child(odd).is-visible {
  animation: service-enter-left .65s cubic-bezier(.2, .7, .2, 1) both;
}

body[data-page="services"] .service-detail:nth-child(even).is-visible {
  animation: service-enter-right .65s cubic-bezier(.2, .7, .2, 1) both;
}

@keyframes service-enter-left {
  from {
    transform: translateX(-14px);
    opacity: .55;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes service-enter-right {
  from {
    transform: translateX(14px);
    opacity: .55;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

body[data-page="services"] .service-detail li {
  transition: color .2s ease, transform .2s ease;
}

body[data-page="services"] .service-detail li:hover {
  transform: translateX(3px);
  color: var(--navy);
}

/* Destinations page */
body[data-page="destinations"] .filter-btn {
  transition: color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease;
}

body[data-page="destinations"] .filter-btn:hover {
  transform: translateY(-2px);
}

body[data-page="destinations"] .filter-btn[aria-pressed="true"] {
  animation: filter-select .32s cubic-bezier(.2, .8, .2, 1);
  box-shadow: 0 6px 15px rgba(18, 52, 90, .16);
}

@keyframes filter-select {
  50% {
    transform: scale(1.06);
  }
}

body[data-page="destinations"] .destination-card {
  transition: transform .3s ease, box-shadow .3s ease, opacity .3s ease;
}

body[data-page="destinations"] .destination-card:hover {
  transform: translateY(-6px) rotate(.15deg);
}

body[data-page="destinations"] .gallery-open {
  overflow: hidden;
}

body[data-page="destinations"] .gallery-open img {
  transition: transform .65s cubic-bezier(.2, .7, .2, 1), filter .35s ease;
}

body[data-page="destinations"] .gallery-open:hover img {
  transform: scale(1.08);
  filter: saturate(1.14);
}

body[data-page="destinations"] .destination-card .tag {
  transition: transform .2s ease, background .2s ease;
}

body[data-page="destinations"] .destination-card:hover .tag {
  transform: translateY(-2px);
  background: #d9f2eb;
}

body[data-page="destinations"] .lightbox[open] {
  animation: lightbox-enter .28s cubic-bezier(.2, .8, .2, 1) both;
}

@keyframes lightbox-enter {
  from {
    transform: scale(.95);
    opacity: 0;
  }

  to {
    transform: scale(1);
    opacity: 1;
  }
}

/* Map & Tours page */
body[data-page="map-tours"] .map-frame {
  animation: map-enter .7s .12s cubic-bezier(.2, .7, .2, 1) both;
  transition: box-shadow .3s ease, border-color .3s ease;
}

body[data-page="map-tours"] .map-frame:hover {
  border-color: rgba(7, 154, 135, .55);
  box-shadow: 0 20px 48px rgba(18, 52, 90, .17);
}

@keyframes map-enter {
  from {
    transform: translateY(14px) scale(.99);
    opacity: 0;
  }

  to {
    transform: none;
    opacity: 1;
  }
}

body[data-page="map-tours"] .itinerary {
  transition: transform .3s ease, box-shadow .3s ease;
}

body[data-page="map-tours"] .itinerary:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow);
}

body[data-page="map-tours"] .itinerary .step {
  transition: transform .3s ease, background .3s ease;
}

body[data-page="map-tours"] .itinerary:hover .step {
  transform: rotate(12deg) scale(1.08);
  background: var(--navy);
}

/* Contact page */
body[data-page="contact"] .contact-item {
  transition: transform .22s ease, border-color .22s ease;
}

body[data-page="contact"] .contact-item:hover {
  transform: translateX(4px);
  border-color: rgba(7, 154, 135, .4);
}

body[data-page="contact"] .contact-item .icon {
  transition: transform .28s ease, background .28s ease, color .28s ease;
}

body[data-page="contact"] .contact-item:hover .icon {
  transform: rotate(-8deg) scale(1.08);
  background: var(--teal);
  color: white;
}

body[data-page="contact"] .contact-form {
  animation: form-arrive .6s .1s cubic-bezier(.2, .7, .2, 1) both;
}

@keyframes form-arrive {
  from {
    transform: translateY(15px);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

body[data-page="contact"] .form-field input,
body[data-page="contact"] .form-field textarea,
body[data-page="contact"] .form-field select {
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

body[data-page="contact"] .form-field:focus-within label {
  color: var(--teal-dark);
  transition: color .2s ease;
}

@media (prefers-reduced-motion: reduce) {

  .whatsapp-float,
  body[data-page] .hero-home>img,
  body[data-page] .hero-content>*,
  body[data-page] .hero-actions .btn,
  body[data-page] .hero-note span,
  body[data-page] .quick-book,
  body[data-page] .about-photo>img,
  body[data-page] .photo-caption,
  body[data-page] .map-frame,
  body[data-page] .contact-form,
  body[data-page] .service-detail.is-visible,
  body[data-page] .lightbox[open],
  body[data-page] .filter-btn[aria-pressed="true"] {
    animation: none !important;
  }

  body[data-page] .split-image img:first-child,
  body[data-page] .split-image img:last-child {
    animation: none !important;
  }
}