/* =====================================================================
   Premium design layer — loaded on every page after the page's own sheets
   (before mobile.css). Restyles the shared building blocks so every page
   matches the Tours landing page: Plus Jakarta Sans, immersive photo
   heroes, glass search cards, orange CTAs, soft-lift cards and sticky
   offsets that clear the fixed header. Markup and behaviour are untouched.
   ===================================================================== */

:root {
  --pm-blue: #1e5fb8;
  --pm-blue-dark: #123f80;
  --pm-blue-deep: #0c2d5e;
  --pm-sky: #eaf3ff;
  --pm-sky-2: #f5f9ff;
  --pm-orange: #f26a1b;
  --pm-orange-dark: #d9560c;
  --pm-ink: #0f1f38;
  --pm-text: #3a4a63;
  --pm-muted: #6b7a92;
  --pm-line: #e2ebf7;
  --pm-radius: 22px;
  --pm-shadow: 0 10px 30px rgba(18, 63, 128, 0.10);
  --pm-shadow-lg: 0 24px 60px rgba(18, 63, 128, 0.18);
  --pm-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* ---------- Typography ---------- */
body {
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--pm-text);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4,
.section-heading h2,
.td-section-title, .sd-section-title, .vd-section-title, .cd-section-title, .cp-section-title {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  color: var(--pm-ink);
  letter-spacing: -0.02em;
}

::selection { background: rgba(242, 106, 27, 0.2); }

/* ---------- Section headings ---------- */
.section-heading h2 {
  font-size: clamp(1.8rem, 3.2vw, 2.6rem);
  font-weight: 800;
  line-height: 1.15;
}
.section-heading p { color: var(--pm-muted); font-size: 1.02rem; }

.section-eyebrow,
.cp-eyebrow,
.hotel-dest-eyebrow,
.vp-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase;
  color: var(--pm-orange) !important;
}
.section-eyebrow::before,
.cp-eyebrow::before {
  content: "";
  width: 22px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.section-view-all {
  font-weight: 700;
  color: var(--pm-blue);
}
.section-view-all:hover { color: var(--pm-blue-dark); }

/* ---------- Product heroes (Hotels, Sightseeing, Visa, Cruise, Destinations) ----------
   Same shell as before (photo + white tail under the search card), but the
   photo now reads through a deep-blue scrim with white type, like Tours. */
.flight-hero,
.hotel-hero,
.tour-hero,
.sightseeing-hero,
.visa-hero,
.cruise-hero,
.destinations-hero {
  color: #fff;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0) 0, #ffffff 200px),
    linear-gradient(180deg, rgba(8, 30, 66, 0.62) 0%, rgba(8, 30, 66, 0.36) 42%, rgba(8, 30, 66, 0.5) 100%),
    radial-gradient(90% 70% at 0% 100%, rgba(30, 95, 184, 0.5), transparent 60%),
    var(--hero-photo, none);
  background-position: left 0 bottom 0, 0 0, 0 0, var(--hero-photo-pos, center 50%);
  background-size: 100% var(--hero-tail), auto, auto, cover;
  background-repeat: no-repeat;
}
.flight-hero::before,
.flight-hero::after { display: none; }

.flight-hero-title {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 800;
  font-size: clamp(2.4rem, 5.4vw, 4.4rem);
  line-height: 1.05;
  letter-spacing: -0.035em;
  color: #fff;
  text-shadow: 0 6px 30px rgba(0, 0, 0, 0.3);
}
.flight-hero-title em {
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 500;
  font-style: italic;
  color: #ffb27a;
}
.flight-hero-subtitle {
  color: rgba(255, 255, 255, 0.92);
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.3);
}

.ph-label { color: #ffd2b5 !important; }
.ph-label-line { background: #ffd2b5 !important; }

.hero-badge {
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  background: rgba(255, 255, 255, 0.14) !important;
  color: #fff !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.hero-stats {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.35);
  box-shadow: 0 14px 36px rgba(5, 25, 60, 0.25);
}
.hero-stat { border-right-color: rgba(255, 255, 255, 0.2); }
.hero-stat .icon { color: #ffb27a; }
.hero-stat strong { color: #fff; }
.hero-stat span { color: rgba(255, 255, 255, 0.8); }

/* ---------- Search cards ---------- */
.flight-search-card,
.hotel-search-card,
.sightseeing-search-card,
.visa-search-card,
.cruise-search-card {
  border: 1px solid rgba(255, 255, 255, 0.7) !important;
  border-radius: 24px !important;
  box-shadow:
    0 0 0 8px rgba(255, 255, 255, 0.35),
    0 30px 70px rgba(5, 25, 60, 0.22) !important;
}

.field-box {
  border-radius: 14px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.field-box:hover { border-color: rgba(30, 95, 184, 0.35); }
.field-box:focus-within { border-color: var(--pm-blue); box-shadow: 0 0 0 4px rgba(30, 95, 184, 0.12); }
.field-label { letter-spacing: 0.06em; }

/* ---------- Buttons ---------- */
.search-btn,
.visa-search-btn,
.visa-form-submit,
.td-sidebar-btn,
.sd-sidebar-btn,
.vd-sidebar-btn,
.cd-sidebar-btn,
.route-cta,
.tcard-btn-primary,
.cp-btn:not(.cp-btn--ghost),
.vp-cta,
.pax-apply {
  background: linear-gradient(135deg, #ff8a3d, var(--pm-orange)) !important;
  border-color: transparent !important;
  color: #fff !important;
  border-radius: 14px !important;
  font-weight: 700 !important;
  box-shadow: 0 10px 24px rgba(242, 106, 27, 0.32) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
}
.search-btn:hover,
.visa-search-btn:hover,
.visa-form-submit:hover,
.td-sidebar-btn:hover,
.sd-sidebar-btn:hover,
.vd-sidebar-btn:hover,
.cd-sidebar-btn:hover,
.route-cta:hover,
.tcard-btn-primary:hover,
.cp-btn:not(.cp-btn--ghost):hover,
.vp-cta:hover,
.pax-apply:hover {
  background: linear-gradient(135deg, var(--pm-orange), var(--pm-orange-dark)) !important;
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(242, 106, 27, 0.42) !important;
  color: #fff !important;
}

.tcard-btn-outline,
.vd-sidebar-btn-secondary {
  border-radius: 14px !important;
  border: 1.5px solid var(--pm-blue) !important;
  color: var(--pm-blue) !important;
  background: #fff !important;
  font-weight: 700 !important;
  transition: background 0.2s ease, color 0.2s ease !important;
}
.tcard-btn-outline:hover,
.vd-sidebar-btn-secondary:hover { background: var(--pm-blue) !important; color: #fff !important; }

/* ---------- Shared card language ----------
   One radius, one shadow, one hover lift across every product card. */
.route-card,
.hotel-dest-card,
.dest-guide-card,
.dest-theme-card,
.why-us-card,
.testimonial-card,
.tcard,
.vp-card,
.vd-type-card,
.vd-download-card,
.cp-quick-card,
.cp-branch,
.featured-tour-card,
.tour-theme-item,
.tour-season-spot {
  border-radius: var(--pm-radius) !important;
  transition: transform 0.35s var(--pm-ease), box-shadow 0.35s var(--pm-ease), border-color 0.35s ease !important;
}

.route-card,
.hotel-dest-card,
.dest-guide-card,
.why-us-card,
.testimonial-card,
.tcard,
.vd-type-card,
.vd-download-card,
.cp-quick-card,
.cp-branch {
  border: 1px solid var(--pm-line) !important;
  box-shadow: var(--pm-shadow) !important;
  overflow: hidden;
}

.route-card:hover,
.hotel-dest-card:hover,
.dest-guide-card:hover,
.dest-theme-card:hover,
.why-us-card:hover,
.testimonial-card:hover,
.tcard:hover,
.vp-card:hover,
.vd-type-card:hover,
.vd-download-card:hover,
.cp-quick-card:hover,
.featured-tour-card:hover,
.tour-theme-item:hover,
.tour-season-spot:hover {
  transform: translateY(-6px);
  box-shadow: var(--pm-shadow-lg) !important;
  border-color: transparent !important;
}

/* Image zoom inside cards */
.route-card img,
.hotel-dest-card img,
.hotel-dest-img,
.dest-guide-card img,
.tcard-photo,
.tcard-media img,
.tour-theme-item img,
.tour-season-spot img,
.sd-gallery-img,
.cp-gallery-img {
  transition: transform 0.8s var(--pm-ease) !important;
}
.route-card:hover img,
.hotel-dest-card:hover img,
.hotel-dest-card:hover .hotel-dest-img,
.dest-guide-card:hover img,
.tcard:hover .tcard-photo,
.tcard:hover .tcard-media img,
.tour-theme-item:hover img,
.tour-season-spot:hover img,
.sd-gallery-img:hover,
.cp-gallery-img:hover {
  transform: scale(1.06);
}

/* Why-us / process icons get the gradient tile */
.why-us-icon,
.whb-icon,
.td-fact-icon,
.sd-highlight-icon,
.cp-quick-icon,
.cp-branch-icon,
.vd-download-icon {
  border-radius: 16px !important;
  background: linear-gradient(135deg, var(--pm-blue), #3b9cf0) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(30, 95, 184, 0.25);
}
.why-us-icon .icon,
.whb-icon .icon,
.td-fact-icon .icon,
.sd-highlight-icon .icon,
.cp-quick-icon .icon,
.cp-branch-icon .icon,
.vd-download-icon .icon,
.why-us-icon svg,
.whb-icon svg,
.cp-quick-icon svg { color: #fff !important; stroke: currentColor; }

.visa-step-num {
  background: linear-gradient(135deg, var(--pm-orange), #ff9d5c) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(242, 106, 27, 0.3);
}

/* ---------- Section rhythm ---------- */
.routes-section,
.why-us-section,
.whb-section,
.hotel-dest-section,
.dest-guide-section,
.sightseeing-types-section,
.sightseeing-process-section,
.visa-types-section,
.visa-process-section,
.cruise-types-section,
.vp-section,
.testimonials-section {
  padding-top: clamp(36px, 4vw, 56px) !important;
  padding-bottom: clamp(28px, 3vw, 44px) !important;
}

.visa-process-section,
.sightseeing-process-section {
  background: linear-gradient(180deg, var(--pm-sky-2), #fff);
}

/* ---------- Consultation / enquiry blocks (Visa, Sightseeing, Cruise, Tours) ---------- */
.visa-consultation-section { padding: clamp(36px, 4vw, 56px) 0 !important; }
.visa-consultation-card {
  overflow: hidden;
  border: 0 !important;
  border-radius: 28px !important;
  background:
    radial-gradient(50% 80% at 100% 0%, rgba(59, 156, 240, 0.35), transparent 60%),
    linear-gradient(135deg, var(--pm-blue-deep), var(--pm-blue-dark)) !important;
  box-shadow: var(--pm-shadow-lg) !important;
}
.visa-consultation-intro,
.visa-consultation-intro h2,
.visa-consultation-intro p,
.visa-consultation-points li { color: #fff !important; }
.visa-consultation-intro p { opacity: 0.88; }
.visa-consultation-points .icon { color: #8fe3b0 !important; }
.visa-consultation-form {
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.25) !important;
}
.visa-form-field input,
.visa-form-field select,
.visa-form-field textarea {
  border-radius: 12px !important;
  border: 1.5px solid var(--pm-line) !important;
  background: var(--pm-sky-2) !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.visa-form-field input:focus,
.visa-form-field select:focus,
.visa-form-field textarea:focus {
  outline: 0;
  border-color: var(--pm-blue) !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(30, 95, 184, 0.12);
}

/* ---------- Listing pages (Tours / Sightseeing / Cruise results) ---------- */
.lst-hero {
  background:
    radial-gradient(60% 120% at 0% 0%, rgba(59, 156, 240, 0.45), transparent 60%),
    radial-gradient(50% 120% at 100% 100%, rgba(242, 106, 27, 0.25), transparent 60%),
    linear-gradient(135deg, var(--pm-blue-deep), var(--pm-blue)) !important;
  padding-bottom: 3rem !important;
}
.lst-hero-title {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(1.9rem, 3.6vw, 2.8rem) !important;
  letter-spacing: -0.03em;
  color: #fff !important;
}
.lst-hero-sub { color: rgba(255, 255, 255, 0.85) !important; }

.lst-filters {
  border: 1px solid var(--pm-line) !important;
  border-radius: var(--pm-radius) !important;
  box-shadow: var(--pm-shadow) !important;
  background: #fff;
}
.lst-sortbar {
  border: 1px solid var(--pm-line) !important;
  border-radius: 16px !important;
  box-shadow: 0 6px 18px rgba(18, 63, 128, 0.06) !important;
}
.lst-stab.active {
  background: var(--pm-blue) !important;
  color: #fff !important;
  border-radius: 10px;
}
.lst-range-fill { background: linear-gradient(90deg, var(--pm-blue), #3b9cf0) !important; }

.tcard-title { font-weight: 800 !important; letter-spacing: -0.02em; color: var(--pm-ink) !important; }
.tcard-price { color: var(--pm-ink) !important; font-weight: 800 !important; }
.tcard-off,
.tcard-badge {
  background: var(--pm-orange) !important;
  color: #fff !important;
  border-radius: 999px !important;
}
.tcard-chip { border-radius: 8px !important; background: var(--pm-sky) !important; color: var(--pm-blue) !important; border: 0 !important; }

/* ---------- Detail pages (Tour / Sightseeing / Destination / Visa / Cruise) ---------- */
.td-hero,
.sd-hero,
.cd-hero,
.vd-hero { min-height: 480px; height: auto !important; }
.td-hero-inner,
.sd-hero-inner,
.cd-hero-inner,
.vd-hero-inner { padding-top: calc(var(--nav-h) + 60px); min-height: 480px; }

.td-hero-title,
.sd-hero-title,
.cd-hero-title,
.vd-hero-title {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(2.2rem, 4.6vw, 3.6rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em;
  color: #fff !important;
}
.td-hero-line,
.sd-hero-line,
.cd-hero-line,
.vd-hero-line { color: #ffb27a !important; letter-spacing: 0.14em !important; }
.td-hero-overlay,
.sd-hero-overlay,
.cd-hero-overlay,
.vd-hero-overlay {
  background:
    linear-gradient(180deg, rgba(8, 30, 66, 0.45) 0%, rgba(8, 30, 66, 0.35) 45%, rgba(8, 30, 66, 0.9) 100%),
    radial-gradient(80% 70% at 0% 100%, rgba(30, 95, 184, 0.45), transparent 60%) !important;
}

/* Sticky tab bars and sidebars cleared below the fixed header. */
.td-subnav,
.sd-subnav,
.cd-subnav,
.vd-subnav {
  top: calc(var(--site-header-h) + 8px) !important;
  border-radius: 18px !important;
  border: 1px solid var(--pm-line) !important;
  box-shadow: 0 10px 28px rgba(18, 63, 128, 0.08) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  background: rgba(255, 255, 255, 0.94) !important;
}
.td-subnav a.active,
.sd-subnav a.active,
.cd-subnav a.active,
.vd-subnav a.active { color: var(--pm-blue) !important; border-bottom-color: var(--pm-orange) !important; }

.td-sidebar,
.sd-sidebar,
.cd-sidebar,
.vd-sidebar { top: calc(var(--site-header-h) + 16px) !important; }

.td-sidebar-card,
.sd-sidebar-card,
.cd-sidebar-card,
.vd-sidebar-card {
  border: 1px solid var(--pm-line) !important;
  border-radius: 24px !important;
  box-shadow: var(--pm-shadow-lg) !important;
  overflow: hidden;
}
.td-sidebar-price-value,
.sd-sidebar-price-value,
.cd-sidebar-price-value,
.vd-sidebar-price-value {
  font-weight: 800 !important;
  letter-spacing: -0.02em;
  color: var(--pm-ink) !important;
}

.td-page-bg,
.sd-page-bg,
.vd-page-bg,
.cd-page-bg { background: linear-gradient(180deg, var(--pm-sky-2), #fff 600px) !important; }

.td-section,
.sd-section,
.vd-section,
.cd-section {
  border-radius: var(--pm-radius) !important;
}
.td-section-title,
.sd-section-title,
.vd-section-title,
.cd-section-title {
  font-weight: 800 !important;
  font-size: clamp(1.4rem, 2.4vw, 1.8rem) !important;
}

.sd-gallery-img,
.cp-gallery-img { border-radius: 18px !important; overflow: hidden; }

/* ---------- Content pages (About, Contact, legal, blog) ---------- */
.cp-hero {
  background:
    radial-gradient(60% 120% at 0% 0%, rgba(59, 156, 240, 0.45), transparent 60%),
    radial-gradient(50% 120% at 100% 100%, rgba(242, 106, 27, 0.22), transparent 60%),
    linear-gradient(135deg, var(--pm-blue-deep), var(--pm-blue)) !important;
}
.cp-hero-overlay {
  background: linear-gradient(180deg, rgba(8, 30, 66, 0.4), rgba(8, 30, 66, 0.75)) !important;
}
.cp-hero-inner { padding-top: calc(var(--nav-h) + 40px) !important; }
.cp-hero-title {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(2.2rem, 4.6vw, 3.6rem) !important;
  letter-spacing: -0.035em;
  color: #fff !important;
}
.cp-hero-sub { color: rgba(255, 255, 255, 0.88) !important; }
.cp-section-title { font-weight: 800 !important; }
.cp-prose { line-height: 1.8; }
.cp-cta {
  border-radius: 28px !important;
  background:
    radial-gradient(50% 120% at 100% 0%, rgba(242, 106, 27, 0.3), transparent 60%),
    linear-gradient(135deg, var(--pm-blue-deep), var(--pm-blue)) !important;
  box-shadow: var(--pm-shadow-lg);
}
.cp-btn--ghost {
  border-radius: 14px !important;
  border: 1.5px solid rgba(255, 255, 255, 0.7) !important;
  color: #fff !important;
  background: rgba(255, 255, 255, 0.1) !important;
}
.cp-btn--ghost:hover { background: #fff !important; color: var(--pm-blue) !important; }
/* The contents nav on legal pages */
.cp-toc,
[class*="cp-"][style*="sticky"] { top: calc(var(--site-header-h) + 16px) !important; }

/* ---------- Services (Explore) ---------- */
.svc-hero {
  background:
    radial-gradient(60% 120% at 0% 0%, rgba(59, 156, 240, 0.45), transparent 60%),
    radial-gradient(50% 120% at 100% 100%, rgba(242, 106, 27, 0.22), transparent 60%),
    linear-gradient(135deg, var(--pm-blue-deep), var(--pm-blue)) !important;
  padding-top: calc(var(--nav-h) + 48px) !important;
}

/* ---------- Testimonials ---------- */
.testimonial-card { background: #fff !important; }
.testimonial-stars .icon { color: #f5a623 !important; fill: #f5a623; }
.testimonials-nav-btn,
.routes-nav-btn {
  border-radius: 50% !important;
  border: 1px solid var(--pm-line) !important;
  background: #fff !important;
  color: var(--pm-ink) !important;
  box-shadow: var(--pm-shadow);
  transition: all 0.2s ease;
}
.testimonials-nav-btn:hover,
.routes-nav-btn:hover { background: var(--pm-blue) !important; color: #fff !important; border-color: var(--pm-blue) !important; }

/* ---------- Footer: tie it to the new palette ---------- */
.site-footer {
  background:
    radial-gradient(50% 80% at 100% 0%, rgba(59, 156, 240, 0.25), transparent 60%),
    linear-gradient(180deg, var(--pm-blue-deep), #081f44) !important;
}

/* ---------- Scroll reveal (class added by premium.js only, so no-JS stays visible) ---------- */
.pm-reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.8s ease, transform 0.8s var(--pm-ease); }
.pm-reveal.pm-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .pm-reveal { opacity: 1; transform: none; transition: none; }
  .route-card:hover, .hotel-dest-card:hover, .tcard:hover, .why-us-card:hover { transform: none; }
}

@media (max-width: 991.98px) {
  .td-hero, .sd-hero, .cd-hero, .vd-hero,
  .td-hero-inner, .sd-hero-inner, .cd-hero-inner, .vd-hero-inner { min-height: 400px; }
  .td-hero-inner, .sd-hero-inner, .cd-hero-inner, .vd-hero-inner { padding-top: calc(var(--nav-h) + 36px); }
}

/* Honeypot field for bots (Views/Shared/_FormGuard.cshtml): off-screen, not display:none,
   so naive bots still see and fill it. */
.fg-hp { position: absolute !important; left: -10000px !important; top: auto; width: 1px; height: 1px; overflow: hidden; }
