/* Velaré Voyages — homepage About/logo background V7 (2026-09-01)
   Compact full-image aircraft panel with smaller, centered logo and mobile fixes. */

.custom-travel-section {
  padding-block: clamp(44px, 4.5vw, 64px) !important;
}

.custom-travel-grid {
  min-height: 0 !important;
  align-items: stretch !important;
}

.custom-travel-logo {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid !important;
  place-items: center !important;
  min-height: 0 !important;
  aspect-ratio: 3 / 2;
  padding: clamp(18px, 2vw, 28px) !important;
  box-sizing: border-box;
  background: #020203 !important;
  border-right-color: rgba(255,255,255,.06) !important;
}

/* Full aircraft image — same 3:2 ratio as the panel, so it stays fully visible. */
.custom-travel-logo::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  aspect-ratio: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background-image: url('../images/home-about-plane-bg.png') !important;
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  filter: blur(2px) brightness(.88) saturate(.98) !important;
  transform: none !important;
  transform-origin: center center !important;
  opacity: 1 !important;
  z-index: 0 !important;
  animation: none !important;
  pointer-events: none !important;
}

/* Very light flat overlay only for logo readability. */
.custom-travel-logo::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  aspect-ratio: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: rgba(0,0,0,.055) !important;
  filter: none !important;
  transform: none !important;
  opacity: 1 !important;
  z-index: 1 !important;
  animation: none !important;
  pointer-events: none !important;
}

/* Smaller logo so the branded jet remains the main visual. */
.custom-travel-logo img {
  position: relative;
  z-index: 2;
  display: block !important;
  width: min(38%, 220px) !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  align-self: center !important;
  justify-self: center !important;
  animation: none !important;
  transform: none !important;
  will-change: auto !important;
  filter: drop-shadow(0 14px 30px rgba(0,0,0,.68)) !important;
}

.custom-travel-copy {
  align-self: stretch !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  box-sizing: border-box;
  padding: clamp(30px, 3.5vw, 50px) !important;
}

.custom-travel-copy h2 {
  margin-bottom: 14px !important;
  font-size: clamp(2.35rem, 3.2vw, 3.55rem) !important;
}

.custom-travel-copy > p:not(.eyebrow) {
  margin-top: 0;
  margin-bottom: 13px;
}

.custom-travel-copy .service-line {
  margin-top: 7px !important;
  margin-bottom: 20px !important;
}

@media (max-width: 720px) {
  .custom-travel-section {
    padding-block: 38px !important;
  }

  .custom-travel-grid {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    gap: 0 !important;
  }

  .custom-travel-logo {
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 3 / 2;
    padding: 14px !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
  }

  .custom-travel-logo::before {
    inset: 0 !important;
    background-size: contain !important;
    background-position: center center !important;
    filter: blur(1.5px) brightness(.9) saturate(.98) !important;
    transform: none !important;
  }

  .custom-travel-logo::after {
    background: rgba(0,0,0,.045) !important;
  }

  .custom-travel-logo img {
    width: min(34vw, 135px) !important;
  }

  .custom-travel-copy {
    width: 100% !important;
    padding: 26px 20px !important;
    border-top: 0 !important;
  }

  .custom-travel-copy h2 {
    margin-bottom: 12px !important;
    font-size: clamp(2rem, 10vw, 2.75rem) !important;
  }

  .custom-travel-copy .service-line {
    margin-bottom: 18px !important;
  }
}

@media (max-width: 460px) {
  .custom-travel-section {
    padding-block: 30px !important;
  }

  .custom-travel-logo {
    padding: 12px !important;
  }

  .custom-travel-logo img {
    width: min(32vw, 118px) !important;
  }

  .custom-travel-copy {
    padding: 24px 18px !important;
  }

  .custom-travel-copy h2 {
    font-size: clamp(1.9rem, 9.5vw, 2.45rem) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .custom-travel-logo,
  .custom-travel-logo::before,
  .custom-travel-logo::after,
  .custom-travel-logo img {
    animation: none !important;
  }
}
