/* =========================================================
   ATD PREMIUM DESIGN SYSTEM
   File: premium-tour.css
   Load AFTER:
   /main.css
   /international-collection.css
   /international-tour.css

   Safe approach:
   - No HTML structure changes required
   - Targets only body.tour-premium and body.collection-page
   - Remove this stylesheet link to return to the previous design
========================================================= */

:root {
  --atd-ink: #141210;
  --atd-muted: #5f5a52;
  --atd-paper: #fffdf8;
  --atd-paper-2: #f6efe3;
  --atd-border: rgba(123, 92, 48, 0.16);
  --atd-red: #e60023;
  --atd-gold: #b88a3b;
  --atd-shadow: 0 22px 55px rgba(0, 0, 0, 0.09);
  --atd-shadow-hover: 0 34px 78px rgba(0, 0, 0, 0.16);
  --atd-radius: 28px;
}

/* =========================================================
   01. PAGE SURFACE
========================================================= */

body.tour-premium,
body.collection-page {
  background: linear-gradient(180deg, #ffffff 0%, #fbf8f1 100%);
}

body.tour-premium .section-white,
body.collection-page .section-white {
  background: linear-gradient(180deg, #ffffff 0%, #fffdf8 100%);
}

body.tour-premium .section-soft,
body.collection-page .section-soft {
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.96), transparent 34%),
    linear-gradient(135deg, #f7f2e9 0%, #efe7da 100%);
}

body.tour-premium .section,
body.tour-premium .price-section,
body.collection-page .section {
  position: relative;
  overflow: hidden;
}

/* =========================================================
   02. PREMIUM HERO POLISH
========================================================= */

body.tour-premium .hero,
body.collection-page .hero {
  isolation: isolate;
}

body.tour-premium .hero::after,
body.collection-page .hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 48%, rgba(0,0,0,.04), transparent 36%),
    linear-gradient(
      180deg,
      rgba(0,0,0,.10) 0%,
      rgba(0,0,0,.04) 42%,
      rgba(0,0,0,.34) 100%
    );
}

body.tour-premium .hero-content,
body.collection-page .hero-content {
  z-index: 2;
  text-shadow: 0 12px 34px rgba(0,0,0,.36);
}

body.tour-premium .hero h1,
body.tour-premium .hero h2,
body.collection-page .hero h1,
body.collection-page .hero h2 {
  letter-spacing: -1.5px;
  text-wrap: balance;
}

body.tour-premium .hero p,
body.collection-page .hero p {
  text-wrap: balance;
}

/* =========================================================
   03. PREMIUM TYPOGRAPHY
========================================================= */

body.tour-premium .section-title h2,
body.tour-premium .section-intro h2,
body.tour-premium .price-title h2,
body.tour-premium .overview-text h3,
body.collection-page .section-intro h2 {
  letter-spacing: -0.9px;
  text-wrap: balance;
}

body.tour-premium .section-title p,
body.tour-premium .section-intro p,
body.tour-premium .price-title p,
body.collection-page .section-intro p,
body.tour-premium .day-content p,
body.tour-premium .info-card li,
body.tour-premium .highlight-card p {
  color: var(--atd-muted);
}

/* =========================================================
   04. PAPER CARD SYSTEM
========================================================= */

body.tour-premium .overview-text,
body.tour-premium .journey-card,
body.tour-premium .info-card,
body.tour-premium .day-card,
body.tour-premium .pricing-card,
body.tour-premium .price-box,
body.tour-premium .highlight-card,
body.tour-premium .fact-box,
body.collection-page .highlight-box,
body.collection-page .package-card,
body.collection-page .card,
body.collection-page .feature-card {
  background:
    linear-gradient(145deg, rgba(255,255,255,.96), rgba(250,245,235,.96));
  border: 1px solid var(--atd-border);
  box-shadow:
    var(--atd-shadow),
    inset 0 1px 0 rgba(255,255,255,.85);
}

body.tour-premium .overview-text {
  border-radius: var(--atd-radius);
  padding: 42px;
}

body.tour-premium .day-content {
  background: transparent !important;
}

/* =========================================================
   05. IMAGES
========================================================= */

body.tour-premium .overview-image img {
  box-shadow:
    0 30px 70px rgba(0,0,0,.18),
    0 8px 18px rgba(0,0,0,.08);
  border: 1px solid rgba(255,255,255,.65);
}

body.tour-premium .day-card > img,
body.tour-premium .day-card img,
body.collection-page .package-card > img,
body.collection-page .card > img {
  filter: saturate(1.04) contrast(1.02);
}

/* =========================================================
   06. FACTS
========================================================= */

body.tour-premium .fact-box h4 {
  color: var(--atd-gold);
}

body.tour-premium .fact-box p {
  color: var(--atd-ink);
}

/* =========================================================
   07. JOURNEY FLOW
========================================================= */

body.tour-premium .journey-card {
  border-radius: var(--atd-radius);
  padding: 42px;
}

body.tour-premium .journey-stop {
  background:
    linear-gradient(145deg, rgba(255,255,255,.96), rgba(247,240,228,.96));
  border: 1px solid rgba(123,92,48,.16);
  box-shadow:
    0 16px 34px rgba(0,0,0,.08),
    inset 0 1px 0 rgba(255,255,255,.8);
}

body.tour-premium .journey-stop .nights {
  background: var(--atd-ink);
}

/* =========================================================
   08. DAY BY DAY
========================================================= */

body.tour-premium .day-list {
  gap: 38px;
}

body.tour-premium .day-card {
  border-radius: var(--atd-radius);
  overflow: hidden;
}

body.tour-premium .day-label {
  background: rgba(230,0,35,.08);
  color: var(--atd-red);
  border: 1px solid rgba(230,0,35,.14);
  letter-spacing: .5px;
  text-transform: uppercase;
}

/* =========================================================
   09. PRICING
========================================================= */

body.tour-premium .price-section {
  background:
    radial-gradient(circle at 80% 0%, rgba(255,255,255,.9), transparent 30%),
    linear-gradient(180deg, #fffdf8 0%, #f7f1e7 100%);
}

body.tour-premium .price-value,
body.tour-premium .price-value-amount {
  color: var(--atd-red);
}

body.tour-premium .price-note {
  background:
    linear-gradient(145deg, rgba(255,255,255,.88), rgba(246,240,230,.88));
  border: 1px solid var(--atd-border);
  box-shadow: 0 14px 34px rgba(0,0,0,.06);
}

/* =========================================================
   10. COLLECTION PAGES
========================================================= */

body.collection-page .package-card,
body.collection-page .card {
  border-radius: 26px;
  overflow: hidden;
}

body.collection-page .package-label {
  background: var(--atd-ink);
  color: #fff;
}

body.collection-page .package-body h3,
body.collection-page .card-body h3 {
  letter-spacing: -0.35px;
}

body.collection-page .package-subtitle,
body.collection-page .card-meta,
body.collection-page .package-points {
  color: var(--atd-muted);
}

/* =========================================================
   11. BUTTONS
========================================================= */

body.tour-premium .btn-primary,
body.collection-page .btn-primary,
body.tour-premium .cta-btn.red,
body.collection-page .cta-btn.red,
body.tour-premium .card-btn,
body.collection-page .card-btn {
  background:
    linear-gradient(135deg, #e60023 0%, #b8001b 100%);
  box-shadow: 0 14px 30px rgba(230,0,35,.22);
}

body.tour-premium .btn-light,
body.collection-page .btn-light,
body.collection-page .card-btn.light {
  background: rgba(255,255,255,.92);
  color: var(--atd-ink);
  border: 1px solid rgba(255,255,255,.55);
}

/* =========================================================
   12. CTA BAND
========================================================= */

body.tour-premium .cta-band,
body.collection-page .cta-band {
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.14), transparent 28%),
    linear-gradient(135deg, #c9001f 0%, #910015 100%);
  position: relative;
  overflow: hidden;
}

body.tour-premium .cta-band::before,
body.collection-page .cta-band::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .12;
  pointer-events: none;
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255,255,255,.12) 1px, transparent 1px);
  background-size: 26px 26px;
}

body.tour-premium .cta-band .container,
body.collection-page .cta-band .container {
  position: relative;
  z-index: 1;
}

/* =========================================================
   13. HOVER / MOTION
========================================================= */

@media (prefers-reduced-motion: no-preference) {
  body.tour-premium .day-card,
  body.tour-premium .fact-box,
  body.tour-premium .price-box,
  body.tour-premium .highlight-card,
  body.tour-premium .info-card,
  body.collection-page .package-card,
  body.collection-page .card,
  body.collection-page .highlight-box {
    transition:
      transform .28s ease,
      box-shadow .28s ease,
      border-color .28s ease,
      filter .28s ease;
  }

  body.tour-premium .day-card:hover,
  body.tour-premium .fact-box:hover,
  body.tour-premium .price-box:hover,
  body.tour-premium .highlight-card:hover,
  body.tour-premium .info-card:hover,
  body.collection-page .package-card:hover,
  body.collection-page .card:hover,
  body.collection-page .highlight-box:hover {
    transform: translateY(-5px);
    box-shadow: var(--atd-shadow-hover);
    border-color: rgba(184,138,59,.24);
  }
}

/* =========================================================
   14. MOBILE
========================================================= */

@media (max-width: 980px) {
  body.tour-premium .overview-text {
    padding: 34px;
  }

  body.tour-premium .journey-card {
    padding: 32px;
  }
}

@media (max-width: 768px) {
  body.tour-premium .overview-text,
  body.tour-premium .journey-card,
  body.tour-premium .info-card {
    padding: 26px;
    border-radius: 24px;
  }

  body.tour-premium .day-card {
    border-radius: 24px;
  }

  body.tour-premium .day-content {
    padding: 26px !important;
  }

  body.tour-premium .section-soft,
  body.collection-page .section-soft {
    background: #f7f2e9;
  }
}

/* =========================================================
   PAPER TEXTURE BALANCED PREMIUM VERSION
========================================================= */

body.tour-premium,
body.collection-page {
  background: #f8f7f4 !important;
}

body.tour-premium .section-white,
body.collection-page .section-white,
body.tour-premium .price-section {
  background: #fffdf8 !important;
}

body.tour-premium .section-soft,
body.collection-page .section-soft {
  background:
    linear-gradient(rgba(255,255,255,.08), rgba(255,255,255,.08)),
    url("/images/backgrounds/paper-texture.webp") !important;
  background-size: 950px auto !important;
  background-repeat: repeat !important;
  background-position: center top !important;
}

/* Cards stay premium, not too textured */
body.tour-premium .overview-text,
body.tour-premium .day-card,
body.tour-premium .info-card,
body.tour-premium .journey-card,
body.tour-premium .pricing-card,
body.tour-premium .price-box,
body.tour-premium .highlight-card,
body.tour-premium .fact-box,
body.collection-page .package-card,
body.collection-page .card,
body.collection-page .highlight-box {
  background: rgba(255,253,248,.96) !important;
  border: 1px solid rgba(60,45,25,.09) !important;
  box-shadow:
    0 22px 55px rgba(0,0,0,.08),
    inset 0 1px 0 rgba(255,255,255,.9) !important;
}

/* =========================================================
   ATD PAPER TEXTURE FINAL PATCH
   Put this at the END of premium-tour.css
   Upload texture to:
   /images/backgrounds/atd-premium-paper-texture.webp
========================================================= */

body.tour-premium,
body.collection-page {
  background: #f8f7f4 !important;
}

/* Use paper only on soft sections, not everywhere */
body.tour-premium .section-soft,
body.collection-page .section-soft {
  background:
    linear-gradient(rgba(250,249,246,.72), rgba(250,249,246,.72)),
    url("/images/backgrounds/atd-premium-paper-texture.webp") !important;
  background-size: 900px auto !important;
  background-repeat: repeat !important;
  background-position: center top !important;
}

/* Keep white sections clean and premium */
body.tour-premium .section-white,
body.collection-page .section-white,
body.tour-premium .price-section {
  background: #fffdf8 !important;
}

/* Cards should be clean ivory, not textured */
body.tour-premium .overview-text,
body.tour-premium .day-card,
body.tour-premium .info-card,
body.tour-premium .journey-card,
body.tour-premium .pricing-card,
body.tour-premium .price-box,
body.tour-premium .highlight-card,
body.tour-premium .fact-box,
body.collection-page .package-card,
body.collection-page .card,
body.collection-page .highlight-box {
  background: rgba(255,253,248,.97) !important;
  border: 1px solid rgba(60,45,25,.08) !important;
  box-shadow:
    0 24px 60px rgba(0,0,0,.075),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}

body.tour-premium .fact-box h4 {
  color: #9a6b2f !important;
}

@media (max-width: 768px) {
  body.tour-premium .section-soft,
  body.collection-page .section-soft {
    background:
      linear-gradient(rgba(250,249,246,.82), rgba(250,249,246,.82)),
      url("/images/backgrounds/atd-premium-paper-texture.webp") !important;
    background-size: 700px auto !important;
  }
}

/* CTA Band - Black Primary Button */

body.tour-premium .cta-band .btn-primary,
body.tour-premium .cta-band .cta-btn.red,
body.collection-page .cta-band .btn-primary,
body.collection-page .cta-band .cta-btn.red {

    background: linear-gradient(135deg, #1d1d1d 0%, #000000 100%) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255,255,255,.18);

    box-shadow:
        0 18px 40px rgba(0,0,0,.35) !important;
}

body.tour-premium .cta-band .btn-primary:hover,
body.tour-premium .cta-band .cta-btn.red:hover,
body.collection-page .cta-band .btn-primary:hover,
body.collection-page .cta-band .cta-btn.red:hover {

    background: linear-gradient(135deg, #2b2b2b 0%, #111111 100%) !important;

    transform: translateY(-2px);

    box-shadow:
        0 22px 48px rgba(0,0,0,.42) !important;
}

/* =========================================================
   JOURNEY FLOW NIGHT BADGE ALIGNMENT
   Keeps all night badges visually aligned
========================================================= */

/* =========================================================
   JOURNEY FLOW NIGHT BADGE ALIGNMENT - BALANCED
========================================================= */

body.tour-premium .journey-stop {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  min-height: 220px !important;
  padding: 28px 24px 24px !important;
}

body.tour-premium .journey-stop .nights {
  margin-top: auto !important;
  align-self: center !important;
}

/* For very short journey flows, avoid oversized boxes */
body.tour-premium .journey-flow:has(.journey-stop:nth-child(3):last-child) .journey-stop {
  min-height: 210px !important;
}

/* For longer flows, keep enough height for text alignment */
body.tour-premium .journey-flow:has(.journey-stop:nth-child(5)) .journey-stop {
  min-height: 260px !important;
}
/* =========================================================
   COLLECTION / LANDING CARDS - EDITORIAL LUXURY UPGRADE
   Applies to all international tour landing pages
========================================================= */

body.collection-page .cards {
  align-items: stretch !important;
  gap: 28px !important;
}

body.collection-page .package-card,
body.collection-page .card {
  border-radius: 30px !important;
  overflow: hidden !important;
  background: #fffef9 !important;
  border: 1px solid rgba(35, 28, 18, .08) !important;
  box-shadow:
    0 28px 70px rgba(0,0,0,.10),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
}

body.collection-page .package-card > img,
body.collection-page .card > img {
  width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  object-fit: cover !important;
  display: block !important;
  filter: saturate(1.04) contrast(1.03) !important;
}

body.collection-page .package-body,
body.collection-page .card-body {
  padding: 24px 24px 22px !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  min-height: 250px !important;
}

body.collection-page .package-label {
  margin-left: auto !important;
  margin-right: auto !important;
}

body.collection-page .package-body h3,
body.collection-page .card-body h3 {
  text-align: center !important;
  font-size: 23px !important;
  line-height: 1.25 !important;
  margin-bottom: 10px !important;
  min-height: auto !important;
}

body.collection-page .package-subtitle,
body.collection-page .card-meta,
body.collection-page .package-points {
  text-align: center !important;
  max-width: 92% !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  margin-bottom: 18px !important;
  min-height: auto !important;
}

body.collection-page .package-points div {
  text-align: center !important;
}

body.collection-page .package-actions,
body.collection-page .card-body > .card-btn {
  margin-top: auto !important;
}

body.collection-page .package-actions {
  width: 100% !important;
  align-items: center !important;
}

body.collection-page .card-btn,
body.collection-page .package-actions .card-btn {
  width: 100% !important;
  max-width: 260px !important;
  min-height: 44px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #1d1d1d 0%, #000 100%) !important;
  color: #fff !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.24) !important;
}

body.collection-page .card-btn.light,
body.collection-page .package-actions .card-btn.light {
  background: #f3f1ec !important;
  color: #111 !important;
  box-shadow: none !important;
  border: 1px solid rgba(0,0,0,.08) !important;
}

body.collection-page .package-card:hover,
body.collection-page .card:hover {
  transform: translateY(-6px) !important;
  box-shadow:
    0 34px 82px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
}

/* =========================================================
   GLOBAL PREMIUM CARD BUTTON FIX
   Makes landing/package card buttons black instead of blue
========================================================= */

.card-btn,
.package-actions .card-btn,
.collection-page .card-btn,
.collection-page .package-actions .card-btn,
.tour-premium .card-btn,
.tour-premium .package-actions .card-btn {
  background: linear-gradient(135deg, #1d1d1d 0%, #000000 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.24) !important;
}

.card-btn:hover,
.package-actions .card-btn:hover,
.collection-page .card-btn:hover,
.tour-premium .card-btn:hover {
  background: linear-gradient(135deg, #2b2b2b 0%, #111111 100%) !important;
  transform: translateY(-2px);
  box-shadow: 0 18px 38px rgba(0,0,0,.32) !important;
}

.card-btn.light,
.package-actions .card-btn.light,
.collection-page .card-btn.light,
.tour-premium .card-btn.light {
  background: #f3f1ec !important;
  color: #111 !important;
  box-shadow: none !important;
  border: 1px solid rgba(0,0,0,.08) !important;
}
body.collection-page .card-btn,
body.collection-page .package-actions .card-btn,
body.tour-premium .card-btn,
body.tour-premium .package-actions .card-btn {
  background: linear-gradient(135deg, #1d1d1d 0%, #000000 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.24) !important;
}

/* =========================================================
   END OF ATD PREMIUM DESIGN SYSTEM
========================================================= */
