:root {
  --shell-navy: #0a1935;
  --shell-surface: #f7fbff;
  --shell-blue: #2563eb;
  --shell-blue-deep: #1744b8;
  --shell-ink: #0f172a;
  --shell-muted: #5f6b85;
  --shell-border: rgba(37, 99, 235, 0.14);
  --shell-shadow: 0 24px 70px rgba(15, 23, 42, 0.08);
  --shell-shadow-hover: 0 30px 82px rgba(15, 23, 42, 0.15);
}

body.page-home,
body.page-tours,
body.page-activities,
body.page-flights,
body.page-contact,
body.page-login,
body.page-about,
body.page-influencer,
body.page-itinerary {
  background:
    radial-gradient(circle at 8% 0%, rgba(37, 99, 235, 0.12), transparent 28%),
    radial-gradient(circle at 92% 4%, rgba(37, 99, 235, 0.11), transparent 32%),
    linear-gradient(180deg, #fbfdff 0%, #f4f8ff 34%, #ffffff 100%);
}

.site-shell-topbar {
  position: fixed;
  inset: 0 0 auto;
  z-index: 120;
  height: 36px;
  background: linear-gradient(90deg, rgba(10, 25, 53, 0.98), rgba(17, 52, 128, 0.98));
  color: #dbe7ff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  overflow: hidden;
}

.site-shell-topbar::after {
  content: '';
  position: absolute;
  inset: 0;
  width: 42%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.12), transparent);
  transform: translateX(-120%);
  animation: shellTopbarSweep 7s ease-in-out infinite;
  pointer-events: none;
}

.site-shell-topbar .site-shell-wrap {
  max-width: 1240px;
  height: 100%;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.site-shell-topbar .site-shell-links,
.site-shell-topbar .site-shell-market {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  white-space: nowrap;
}

.site-shell-topbar a,
.site-shell-topbar span {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.site-shell-topbar a {
  color: inherit;
}

.site-shell-topbar .dot {
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.45);
}

body.page-home nav,
body.page-tours nav,
body.page-activities nav,
body.page-flights nav,
body.page-contact nav,
body.page-login nav,
body.page-about nav,
body.page-influencer nav,
body.page-itinerary nav {
  top: 36px;
}

body.page-home,
body.page-tours,
body.page-activities,
body.page-flights,
body.page-contact,
body.page-login,
body.page-about,
body.page-influencer,
body.page-itinerary {
  padding-top: 132px;
}

.shell-section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.09);
  color: var(--shell-blue-deep);
  border: 1px solid rgba(37, 99, 235, 0.16);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.site-shell-statbar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 24px 0 0;
}

.site-shell-statbar article {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--shell-border);
  background: rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  padding: 16px 18px;
  box-shadow: var(--shell-shadow);
  transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease;
}

.site-shell-statbar article::after {
  content: '';
  position: absolute;
  inset: auto 16px 0;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: linear-gradient(90deg, var(--shell-blue-deep), #7dd3fc);
  opacity: 0.7;
}

.site-shell-statbar article:hover,
.site-shell-context-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shell-shadow-hover);
  border-color: rgba(37, 99, 235, 0.28);
}

.site-shell-statbar span {
  display: block;
  color: var(--shell-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.site-shell-statbar strong {
  display: block;
  margin-top: 10px;
  color: var(--shell-ink);
  font-size: 26px;
  line-height: 1;
}

.site-shell-sticky-cta {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 180;
  display: grid;
  gap: 10px;
}

.site-shell-sticky-cta a,
.site-shell-sticky-cta button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 184px;
  min-height: 48px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.18);
  font-size: 13px;
  font-weight: 800;
}

.site-shell-sticky-cta .primary {
  background: linear-gradient(135deg, var(--shell-blue-deep), var(--shell-blue));
  color: #fff;
}

.site-shell-sticky-cta .secondary {
  background: rgba(255, 255, 255, 0.96);
  color: var(--shell-blue-deep);
}

.shell-price-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.08);
  border: 1px solid rgba(37, 99, 235, 0.12);
  color: var(--shell-blue-deep);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.shell-price-source {
  margin-top: 8px;
  color: var(--shell-muted);
  font-size: 12px;
}

.shell-price-source strong {
  color: var(--shell-ink);
}

body.page-home #home-hero .hero-stage,
body.page-tours #view-home > header,
body.page-activities #view-home > header,
body.page-flights #view-home > header {
  box-shadow: 0 34px 90px rgba(15, 23, 42, 0.16);
}

body.page-home .hero-editorial-panel,
body.page-tours .hero-search-shell,
body.page-activities .hero-search-shell,
body.page-flights .hero-search-shell {
  background:
    linear-gradient(180deg, rgba(7, 22, 49, 0.74) 0%, rgba(8, 25, 60, 0.58) 100%);
  backdrop-filter: blur(18px);
}

body.page-home .hero-editorial-panel .hero-search-shell {
  background: rgba(255, 255, 255, 0.98);
}

body.page-home .trust-strip,
body.page-tours .trust-strip,
body.page-activities .trust-strip,
body.page-flights .trust-strip {
  box-shadow: var(--shell-shadow);
  border: 1px solid var(--shell-border);
}

body.page-home #inventory-grid > button,
body.page-home #dest-grid > button > div,
body.page-tours #inventory-grid > button,
body.page-tours #dest-grid > button > div,
body.page-activities #inventory-grid > button,
body.page-activities #dest-grid > button > div,
body.page-flights #inventory-grid > button,
body.page-flights #dest-grid > button > div {
  border-radius: 24px;
  border: 1px solid var(--shell-border);
  box-shadow: var(--shell-shadow);
  transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease;
}

body.page-home #inventory-grid > button:hover,
body.page-tours #inventory-grid > button:hover,
body.page-activities #inventory-grid > button:hover,
body.page-flights #inventory-grid > button:hover {
  transform: translateY(-5px);
  box-shadow: var(--shell-shadow-hover);
  border-color: rgba(37, 99, 235, 0.26);
}

body.page-home #inventory-grid img,
body.page-home #dest-grid img,
body.page-tours #inventory-grid img,
body.page-tours #dest-grid img,
body.page-activities #inventory-grid img,
body.page-activities #dest-grid img,
body.page-flights #inventory-grid img,
body.page-flights #dest-grid img {
  transition: transform 520ms ease, filter 520ms ease;
}

body.page-home #inventory-grid > button:hover img,
body.page-home #dest-grid > button:hover img,
body.page-tours #inventory-grid > button:hover img,
body.page-tours #dest-grid > button:hover img,
body.page-activities #inventory-grid > button:hover img,
body.page-activities #dest-grid > button:hover img,
body.page-flights #inventory-grid > button:hover img,
body.page-flights #dest-grid > button:hover img {
  transform: scale(1.045);
  filter: saturate(1.06) contrast(1.02);
}

.site-shell-context-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 28px auto 0;
  max-width: 1200px;
  padding: 0 24px;
}

.site-shell-context-card {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  border: 1px solid var(--shell-border);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(244, 248, 255, 0.96) 100%);
  box-shadow: var(--shell-shadow);
  padding: 18px;
  transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease;
}

.site-shell-context-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.1), transparent 34%);
  opacity: 0;
  transition: opacity 260ms ease;
  pointer-events: none;
}

.site-shell-context-card:hover::after {
  opacity: 1;
}

.site-shell-context-card span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--shell-blue-deep);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.site-shell-context-card strong {
  display: block;
  margin-top: 12px;
  color: var(--shell-ink);
  font-size: 18px;
  line-height: 1.35;
}

.site-shell-context-card p {
  margin: 12px 0 0;
  color: var(--shell-muted);
  font-size: 13px;
  line-height: 1.7;
}

body.page-about .about-shell,
body.page-contact .contact-shell,
body.page-login .login-shell,
body.page-influencer .influencer-shell {
  border: 1px solid var(--shell-border);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shell-shadow);
  border-radius: 28px;
}

.glider-motion-item {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 520ms ease, transform 520ms ease;
  transition-delay: calc(var(--motion-index, 0) * 55ms);
}

.glider-motion-item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.site-shell-sticky-cta {
  animation: shellCtaBreathe 4.8s ease-in-out infinite;
}

@keyframes shellTopbarSweep {
  0%, 42% { transform: translateX(-120%); opacity: 0; }
  52% { opacity: 1; }
  72%, 100% { transform: translateX(260%); opacity: 0; }
}

@keyframes shellCtaBreathe {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

@media (max-width: 1024px) {
  .site-shell-statbar,
  .site-shell-context-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .site-shell-topbar {
    height: auto;
    min-height: 38px;
  }

  .site-shell-topbar .site-shell-wrap {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
    padding: 8px 18px;
  }

  body.page-home nav,
  body.page-tours nav,
  body.page-activities nav,
  body.page-flights nav,
  body.page-contact nav,
  body.page-login nav,
  body.page-about nav,
  body.page-influencer nav,
  body.page-itinerary nav {
    top: 54px;
  }

  body.page-home,
  body.page-tours,
  body.page-activities,
  body.page-flights,
  body.page-contact,
  body.page-login,
  body.page-about,
  body.page-influencer,
  body.page-itinerary {
    padding-top: 152px;
  }

  .site-shell-statbar,
  .site-shell-context-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .site-shell-sticky-cta {
    left: 14px;
    right: 14px;
    bottom: 14px;
  }

  .site-shell-sticky-cta a,
  .site-shell-sticky-cta button {
    width: 100%;
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }

  .glider-motion-item {
    opacity: 1;
    transform: none;
  }
}