:root { --blue: #145bc0; --deep: #123a77; --green: #27ba59; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { font-family: Arial, "Segoe UI", sans-serif; background: #0871cf; color: var(--deep); }
button, a { font: inherit; }

.site-shell {
  min-height: 100svh; padding: 34px 22px; overflow: hidden; position: relative;
  display: grid; place-items: center;
  background: linear-gradient(rgba(5, 73, 161, .13), rgba(5, 132, 215, .08)), url('/assets/travel-sky-background.png') center/cover fixed;
  isolation: isolate;
}
.site-shell::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at 50% 48%, rgba(255,255,255,.18), transparent 42%); }
.sky-glow { position: absolute; inset: 0; z-index: -1; background: linear-gradient(115deg, transparent 30%, rgba(255,255,255,.12) 47%, transparent 61%); animation: shimmer 10s ease-in-out infinite; }

.maintenance-card {
  width: min(710px, 94vw); min-height: 820px; padding: 31px 62px 21px; position: relative; z-index: 2;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  border: 2px solid rgba(255,255,255,.86); border-radius: 32px;
  background: linear-gradient(145deg, rgba(255,255,255,.91), rgba(244,251,255,.82));
  box-shadow: 0 28px 80px rgba(0,43,112,.3), inset 0 1px 1px rgba(255,255,255,.9);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  animation: card-in .85s cubic-bezier(.2,.8,.2,1) both;
}
.logo-wrap { width: min(260px, 64vw); height: 250px; display: grid; place-items: center; }
.logo-wrap img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; filter: drop-shadow(0 10px 16px rgba(21,72,145,.12)); }
.route-divider { width: 76%; display: flex; align-items: center; gap: 12px; margin: 0 0 14px; color: var(--blue); }
.route-divider span { height: 1px; flex: 1; background: linear-gradient(to var(--side, right), transparent, #8fb9eb); }
.route-divider span:last-child { --side: left; }
.route-divider svg { width: 28px; height: 28px; fill: currentColor; transform: rotate(-12deg); }
.eyebrow { margin: 0 0 5px; color: #4780c4; font-size: 14px; font-weight: 700; letter-spacing: .08em; }
h1 { margin: 0; color: #143c7b; font-size: clamp(34px, 5vw, 48px); line-height: 1.18; letter-spacing: -.025em; }
.title-line { width: 74px; height: 4px; margin: 17px 0 19px; border-radius: 5px; background: linear-gradient(90deg, #4eb8f2, #126bd1); }
.message { font-size: clamp(17px, 2vw, 20px); line-height: 1.7; max-width: 560px; color: #244877; }
.message p { margin: 0 0 14px; }
.message .thanks { margin-top: 19px; padding-top: 18px; border-top: 1px dashed #9bbce2; font-weight: 600; }
.contact-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 18px 0 25px; direction: ltr; }
.contact-button { min-height: 62px; padding: 0 19px; border-radius: 999px; display: flex; align-items: center; justify-content: center; gap: 11px; font-weight: 700; font-size: 17px; text-decoration: none; transition: transform .2s, box-shadow .2s, filter .2s; }
.contact-button:hover { transform: translateY(-3px); filter: brightness(1.03); }
.contact-button:focus-visible, .language-switch:focus-visible { outline: 4px solid rgba(255,255,255,.95); outline-offset: 4px; }
.contact-button svg { width: 25px; height: 25px; fill: currentColor; flex: none; }
.mail-button { color: #1465c6; background: white; box-shadow: 0 8px 20px rgba(32,86,157,.18); border: 1px solid #d5e4f7; }
.whatsapp-button { color: white; background: linear-gradient(135deg, #2fcc62, #20a94d); box-shadow: 0 10px 24px rgba(30,165,75,.27); }
footer { margin-top: auto; color: #5e83b6; font-size: 14px; }

.language-switch { position: fixed; z-index: 5; inset-block-start: 25px; inset-inline-start: 28px; border: 1px solid rgba(255,255,255,.68); color: white; background: rgba(5,69,151,.55); box-shadow: 0 7px 20px rgba(0,40,100,.18); backdrop-filter: blur(8px); border-radius: 999px; padding: 10px 17px; display: flex; align-items: center; gap: 8px; cursor: pointer; transition: background .2s, transform .2s; }
.language-switch:hover { background: rgba(5,69,151,.78); transform: translateY(-2px); }
.globe-icon { font-size: 23px; line-height: .6; }

.flying-plane { position: absolute; z-index: 1; top: 15%; left: -180px; width: 126px; color: rgba(255,255,255,.92); filter: drop-shadow(0 8px 8px rgba(0,61,139,.22)); animation: fly-across 19s linear infinite; }
.flying-plane svg { width: 100%; fill: currentColor; transform: rotate(-7deg); }
.flying-plane span { position: absolute; right: 99px; top: 46px; width: 120px; border-top: 2px dashed rgba(255,255,255,.75); }
.moving-cloud { position: absolute; z-index: 0; width: 130px; height: 42px; border-radius: 50px; background: rgba(255,255,255,.35); filter: blur(.3px); animation: cloud-drift 28s linear infinite; }
.moving-cloud::before, .moving-cloud::after { content: ""; position: absolute; background: inherit; border-radius: 50%; }
.moving-cloud::before { width: 64px; height: 64px; left: 24px; bottom: 10px; }
.moving-cloud::after { width: 48px; height: 48px; left: 70px; bottom: 7px; }
.cloud-one { top: 22%; left: -180px; animation-delay: -4s; }
.cloud-two { top: 58%; left: -220px; transform: scale(.72); opacity: .55; animation-delay: -17s; animation-duration: 34s; }
.cloud-three { top: 42%; left: -200px; transform: scale(1.2); opacity: .28; animation-delay: -25s; animation-duration: 40s; }

@keyframes card-in { from { opacity: 0; transform: translateY(24px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes shimmer { 0%,100% { transform: translateX(-25%); opacity:.45; } 50% { transform: translateX(25%); opacity:1; } }
@keyframes fly-across { 0% { transform: translate(-5vw, 70px) rotate(2deg); } 42% { transform: translate(52vw, -25px) rotate(-3deg); } 100% { transform: translate(calc(100vw + 350px), 15px) rotate(1deg); } }
@keyframes cloud-drift { from { left: -230px; } to { left: calc(100vw + 250px); } }

@media (max-width: 680px) {
  .site-shell { padding: 72px 14px 22px; background-attachment: scroll; }
  .maintenance-card { min-height: auto; padding: 24px 22px 20px; border-radius: 26px; }
  .logo-wrap { height: 205px; }
  .route-divider { margin-top: -2px; }
  .contact-actions { grid-template-columns: 1fr; gap: 12px; margin-top: 12px; }
  .contact-button { min-height: 56px; }
  .language-switch { inset-block-start: 16px; inset-inline-start: 16px; }
  .flying-plane { top: 8%; width: 90px; opacity: .8; }
}
@media (max-height: 850px) and (min-width: 681px) {
  .site-shell { padding-block: 20px; }
  .maintenance-card { min-height: 760px; padding-top: 20px; }
  .logo-wrap { height: 215px; }
  .message { line-height: 1.55; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}
