/* ============================================================
   LUXURY UNLOCKED — 3D / 2N MASAI MARA SAFARI
   FULL ZIP SOURCE-PARITY STYLESHEET

   SOURCE OF TRUTH
   ------------------------------------------------------------
   base.css
   page-package-detail.jsx
   pkg-data.jsx
   package-3d2n.html

   Existing PHP content and image URLs are preserved.
   ============================================================ */


/* ============================================================
   01. EXACT ZIP TOKENS
   ============================================================ */

:root{
  --paper:#FAF7F0;
  --paper-2:#F1EADC;
  --paper-3:#EAE1CF;
  --ink:#211C15;
  --ink-soft:#463F34;
  --muted:#8A7F6E;
  --line:rgba(33,28,21,.16);
  --line-soft:rgba(33,28,21,.08);
  --accent:#C49A4C;
  --accent-deep:#6E4E18;
  --dark:#1C1813;
  --dark-2:#252017;
  --on-dark:#F2EBDC;
  --on-dark-muted:#A99E89;
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Jost',system-ui,-apple-system,sans-serif;
  --maxw:1300px;
  --gut:clamp(20px,5.2vw,72px);
  --ease:cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box}

html{
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  scroll-behavior:smooth;
}

body.tour-details-page{
  margin:0 !important;
  background:var(--paper) !important;
  color:var(--ink) !important;
  font-family:var(--sans) !important;
  font-weight:300 !important;
  font-size:17px !important;
  line-height:1.75 !important;
  letter-spacing:.005em !important;
  overflow-x:hidden !important;
}

body.tour-details-page .main{
  background:var(--paper) !important;
  color:var(--ink) !important;
}

body.tour-details-page img{display:block;max-width:100%}
body.tour-details-page a{color:inherit;text-decoration:none}
body.tour-details-page button{font-family:inherit;cursor:pointer}
body.tour-details-page ::selection{background:var(--accent);color:#fff}

body.tour-details-page h1,
body.tour-details-page h2,
body.tour-details-page h3,
body.tour-details-page h4{
  font-family:var(--serif) !important;
  font-weight:400 !important;
  margin:0;
  line-height:1.04 !important;
  letter-spacing:-.01em !important;
}


/* ============================================================
   02. SHARED ZIP LAYOUT / TYPE
   ============================================================ */

body.tour-details-page .container{
  width:100%;
  max-width:var(--maxw) !important;
  margin:0 auto !important;
  padding-left:var(--gut) !important;
  padding-right:var(--gut) !important;
}

body.tour-details-page .section{
  padding-block:clamp(72px,11vh,150px) !important;
}

body.tour-details-page .section-label{
  font-family:var(--sans) !important;
  font-weight:500 !important;
  font-size:11.5px !important;
  line-height:1.4 !important;
  letter-spacing:.34em !important;
  text-transform:uppercase !important;
  color:var(--accent-deep) !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:.9em !important;
  margin:0 !important;
}

body.tour-details-page .section-label::before{
  content:"";
  width:26px;
  height:1px;
  background:var(--accent);
  opacity:.7;
}

body.tour-details-page .section-heading{
  font-family:var(--serif) !important;
  font-weight:300 !important;
  letter-spacing:-.015em !important;
  line-height:1.04 !important;
  color:var(--ink) !important;
}

body.tour-details-page .section-description{
  font-family:var(--sans) !important;
  font-size:clamp(1.05rem,1.5vw,1.32rem) !important;
  line-height:1.7 !important;
  font-weight:300 !important;
  color:var(--ink-soft) !important;
}

body.tour-details-page .section-header-center{
  max-width:none !important;
  margin:0 0 46px !important;
  text-align:left !important;
}


/* ============================================================
   03. HERO — EXACT ZIP page-hero
   ============================================================ */

body.tour-details-page .hero-section-modern{
  position:relative !important;
  min-height:62vh !important;
  height:auto !important;

  display:flex !important;
  align-items:flex-end !important;
  justify-content:flex-start !important;

  margin:0 !important;
  padding:0 !important;

  overflow:hidden !important;

  background-color:var(--dark) !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  color:var(--on-dark) !important;
}

body.tour-details-page .hero-overlay{
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;

  background:
    linear-gradient(
      to top,
      rgba(13,10,7,.92),
      rgba(13,10,7,.5) 55%,
      rgba(13,10,7,.62)
    ) !important;
}

body.tour-details-page .hero-section-modern > .container{
  position:relative !important;
  z-index:2 !important;

  width:100% !important;

  padding-top:clamp(140px,20vh,200px) !important;
  padding-bottom:clamp(44px,7vh,80px) !important;
}

body.tour-details-page .hero-content-modern{
  max-width:none !important;
  padding:0 !important;
  margin:0 !important;

  text-align:left !important;
  color:var(--on-dark) !important;

  animation:none !important;
}

body.tour-details-page .hero-title-modern{
  max-width:18ch !important;

  margin:0 !important;

  font-family:var(--serif) !important;
  font-size:clamp(2.6rem,6vw,5.4rem) !important;
  font-weight:300 !important;
  line-height:.98 !important;
  letter-spacing:-.02em !important;

  color:#fff !important;

  text-shadow:0 2px 30px rgba(0,0,0,.45) !important;

  animation:none !important;
}

body.tour-details-page .hero-subtitle{
  max-width:50ch !important;
  margin:22px 0 0 !important;

  font-family:var(--sans) !important;
  font-size:clamp(1.05rem,1.5vw,1.3rem) !important;
  font-weight:300 !important;
  line-height:1.75 !important;

  color:rgba(255,253,248,.92) !important;

  text-shadow:0 1px 16px rgba(0,0,0,.5) !important;

  animation:none !important;
}

/* Current hero features mapped exactly to pd-chips */
body.tour-details-page .hero-features{
  display:flex !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  justify-content:flex-start !important;

  margin-top:28px !important;

  animation:none !important;
}

body.tour-details-page .hero-features span{
  display:inline-flex !important;
  align-items:center !important;

  padding:9px 16px !important;

  border:1px solid rgba(242,235,220,.4) !important;
  border-radius:0 !important;

  background:transparent !important;
  color:#fff !important;

  backdrop-filter:blur(4px);

  font-family:var(--sans) !important;
  font-size:11px !important;
  font-weight:300 !important;
  line-height:1.4 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
}

body.tour-details-page .hero-features i{
  display:none !important;
}


/* ============================================================
   04. OVERVIEW — EXACT pd-overview
   ============================================================ */

body.tour-details-page .safari-overview-section{
  background:var(--paper) !important;
  color:var(--ink) !important;
}

body.tour-details-page .safari-overview-section .row{
  display:grid !important;
  grid-template-columns:1.15fr .85fr !important;
  gap:clamp(36px,5vw,72px) !important;
  align-items:start !important;

  margin:0 !important;
}

body.tour-details-page .safari-overview-section .row > [class*="col-"]{
  width:auto !important;
  max-width:none !important;
  padding:0 !important;
}

body.tour-details-page .overview-content-box{
  width:100%;
}

body.tour-details-page .overview-content-box .section-heading{
  font-size:clamp(1.8rem,3.2vw,2.6rem) !important;
  margin:18px 0 22px !important;
  max-width:18ch !important;
}

body.tour-details-page .lead-text{
  max-width:68ch !important;

  margin:0 0 1.2em !important;

  font-family:var(--sans) !important;
  font-size:17px !important;
  font-weight:300 !important;
  line-height:1.8 !important;

  color:var(--ink-soft) !important;
}

body.tour-details-page .lead-text a{
  color:var(--accent-deep) !important;
  border-bottom:1px solid var(--line) !important;
  padding-bottom:1px !important;
}

body.tour-details-page .lead-text a:hover{
  border-color:var(--accent-deep) !important;
}


/* ============================================================
   05. HIGHLIGHTS — EXACT pd-highlights / pd-hl
   ============================================================ */

body.tour-details-page .highlights-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:16px !important;

  margin-top:34px !important;
}

body.tour-details-page .highlight-card{
  display:flex !important;
  gap:14px !important;
  align-items:flex-start !important;

  padding:20px !important;

  border:1px solid var(--line-soft) !important;
  border-radius:0 !important;

  background:var(--paper) !important;

  box-shadow:none !important;

  transform:none !important;

  transition:none !important;
}

body.tour-details-page .highlight-card:hover{
  transform:none !important;
  box-shadow:none !important;
}

body.tour-details-page .highlight-card > i{
  flex-shrink:0 !important;
  margin-top:2px !important;

  color:var(--accent-deep) !important;
  font-size:22px !important;
}

body.tour-details-page .highlight-card h4{
  margin:0 0 3px !important;

  font-family:var(--serif) !important;
  font-size:1.05rem !important;
  font-weight:500 !important;
  line-height:1.1 !important;

  color:var(--ink) !important;
}

body.tour-details-page .highlight-card p{
  margin:0 !important;

  font-family:var(--sans) !important;
  font-size:13.5px !important;
  font-weight:300 !important;
  line-height:1.5 !important;

  color:var(--muted) !important;
}


/* ============================================================
   06. PRICING — EXACT pd-price
   ============================================================ */

body.tour-details-page .pricing-card-modern{
  position:sticky !important;
  top:100px !important;

  padding:32px !important;

  background:var(--paper-2) !important;

  border:1px solid var(--line) !important;
  border-radius:0 !important;

  box-shadow:none !important;

  color:var(--ink) !important;
}

body.tour-details-page .pricing-header{
  text-align:left !important;

  padding:0 !important;
  margin:0 !important;

  border:0 !important;
}

body.tour-details-page .price-label{
  display:block !important;

  margin:0 !important;

  font-family:var(--sans) !important;
  font-size:11px !important;
  font-weight:300 !important;
  line-height:1.4 !important;
  letter-spacing:.2em !important;
  text-transform:uppercase !important;

  color:var(--muted) !important;
}

body.tour-details-page .price-display{
  display:block !important;
}

body.tour-details-page .price-amount{
  display:block !important;

  margin:6px 0 4px !important;

  font-family:var(--serif) !important;
  font-size:2.6rem !important;
  font-weight:300 !important;
  line-height:1 !important;

  color:var(--ink) !important;
}

body.tour-details-page .price-note{
  display:block !important;

  margin-bottom:24px !important;

  font-family:var(--sans) !important;
  font-size:13px !important;
  font-weight:300 !important;

  color:var(--muted) !important;
}

body.tour-details-page .pricing-includes h4{
  margin:0 0 14px !important;

  font-family:var(--sans) !important;
  font-size:11px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;

  color:var(--accent-deep) !important;
}

body.tour-details-page .pricing-includes ul{
  display:grid !important;
  gap:10px !important;

  list-style:none !important;

  padding:0 !important;
  margin:0 0 24px !important;
}

body.tour-details-page .pricing-includes li{
  position:relative !important;

  display:block !important;

  padding:0 0 0 22px !important;

  border:0 !important;

  font-family:var(--sans) !important;
  font-size:14px !important;
  font-weight:300 !important;
  line-height:1.5 !important;

  color:var(--ink-soft) !important;
}

body.tour-details-page .pricing-includes li::before{
  content:"" !important;

  position:absolute !important;
  left:0 !important;
  top:9px !important;

  width:10px !important;
  height:1px !important;

  background:var(--accent) !important;
}

body.tour-details-page .pricing-includes li i{
  display:none !important;
}


/* ============================================================
   07. ZIP BUTTON SYSTEM
   ============================================================ */

body.tour-details-page .btn-reserve-modern,
body.tour-details-page .btn-primary-cta,
body.tour-details-page .btn-secondary-cta,
body.tour-details-page .banner-links a{
  --bd:var(--ink);

  position:relative !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:.85em !important;

  padding:1.05em 1.9em !important;

  overflow:hidden !important;

  background:transparent !important;
  color:var(--ink) !important;

  border:1px solid var(--bd) !important;
  border-radius:0 !important;

  font-family:var(--sans) !important;
  font-size:12px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.2em !important;
  text-transform:uppercase !important;

  box-shadow:none !important;

  transform:none !important;

  transition:
    color .5s var(--ease),
    border-color .5s var(--ease) !important;

  isolation:isolate;
}

body.tour-details-page .btn-reserve-modern{
  width:100% !important;

  background:var(--ink) !important;
  color:var(--paper) !important;

  --bd:var(--ink);
}

body.tour-details-page .btn-reserve-modern::after,
body.tour-details-page .btn-primary-cta::after,
body.tour-details-page .btn-secondary-cta::after,
body.tour-details-page .banner-links a::after{
  content:"" !important;

  position:absolute !important;
  inset:0 !important;
  z-index:-1 !important;

  background:var(--ink) !important;

  transform:scaleX(0) !important;
  transform-origin:right !important;

  transition:transform .55s var(--ease) !important;
}

body.tour-details-page .btn-reserve-modern::after{
  background:var(--accent-deep) !important;
}

body.tour-details-page .btn-reserve-modern:hover::after,
body.tour-details-page .btn-primary-cta:hover::after,
body.tour-details-page .btn-secondary-cta:hover::after,
body.tour-details-page .banner-links a:hover::after{
  transform:scaleX(1) !important;
  transform-origin:left !important;
}

body.tour-details-page .btn-reserve-modern:hover{
  color:#fff !important;
  border-color:var(--accent-deep) !important;

  transform:none !important;
  box-shadow:none !important;
}


/* ============================================================
   08. TRUST BADGES — EXACT pd-badges
   ============================================================ */

body.tour-details-page .trust-badges{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:8px !important;

  margin-top:18px !important;
  padding-top:18px !important;

  border-top:1px solid var(--line-soft) !important;
}

body.tour-details-page .trust-badges span{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;

  font-family:var(--sans) !important;
  font-size:12.5px !important;
  font-weight:300 !important;

  color:var(--muted) !important;
}

body.tour-details-page .trust-badges i{
  color:var(--muted) !important;
  font-size:13px !important;
}

body.tour-details-page .comparison-note{
  margin-top:18px !important;
  padding:18px 0 0 !important;

  background:transparent !important;

  border-top:1px solid var(--line-soft) !important;
  border-radius:0 !important;

  text-align:left !important;
}

body.tour-details-page .comparison-note p{
  display:block !important;

  margin:0 !important;

  font-family:var(--sans) !important;
  font-size:13px !important;
  font-weight:300 !important;
  line-height:1.6 !important;

  color:var(--muted) !important;
}

body.tour-details-page .comparison-note i{display:none !important}

body.tour-details-page .comparison-note a{
  color:var(--accent-deep) !important;
  border-bottom:1px solid var(--line) !important;
  font-weight:400 !important;
}


/* ============================================================
   09. ITINERARY — EXACT dark timeline
   ============================================================ */

body.tour-details-page .itinerary-section{
  background:var(--dark) !important;
  color:var(--on-dark) !important;
}

body.tour-details-page .itinerary-section .section-header-center{
  margin-bottom:0 !important;
}

body.tour-details-page .itinerary-section .section-label{
  color:var(--accent) !important;
}

body.tour-details-page .itinerary-section .section-label::before{
  background:var(--accent) !important;
}

body.tour-details-page .itinerary-section .section-heading{
  margin-top:16px !important;
  margin-bottom:0 !important;

  font-size:clamp(1.9rem,3.6vw,3rem) !important;
  font-weight:300 !important;

  color:#fff !important;
}

body.tour-details-page .itinerary-section .section-description{
  max-width:60ch !important;
  margin:18px 0 0 !important;

  color:var(--on-dark-muted) !important;
}

body.tour-details-page .itinerary-timeline{
  position:relative !important;

  max-width:820px !important;

  margin:46px 0 0 !important;
}

body.tour-details-page .itinerary-timeline::before{
  display:none !important;
}

body.tour-details-page .itinerary-day{
  position:relative !important;

  display:block !important;

  margin:0 0 0 6px !important;
  padding:0 0 8px 38px !important;

  border-left:1px solid rgba(242,235,220,.18) !important;
}

body.tour-details-page .itinerary-day:last-child{
  border-left-color:transparent !important;
}

body.tour-details-page .itinerary-day::before{
  content:"" !important;

  position:absolute !important;
  left:-6px !important;
  top:2px !important;

  width:11px !important;
  height:11px !important;

  border-radius:50% !important;

  background:var(--accent) !important;

  box-shadow:0 0 0 4px var(--dark) !important;
}

body.tour-details-page .day-marker{
  display:inline !important;
  position:static !important;
}

body.tour-details-page .day-number{
  display:inline !important;

  width:auto !important;
  height:auto !important;

  padding:0 !important;

  background:transparent !important;

  border-radius:0 !important;

  box-shadow:none !important;

  font-family:var(--serif) !important;
  font-size:1rem !important;
  font-style:italic !important;
  font-weight:400 !important;

  color:var(--accent) !important;
}

body.tour-details-page .day-number::before{
  content:"Day ";
}

body.tour-details-page .day-content{
  padding:0 0 40px !important;

  background:transparent !important;

  border:0 !important;
  border-radius:0 !important;

  box-shadow:none !important;

  transform:none !important;

  transition:none !important;
}

body.tour-details-page .day-content:hover{
  background:transparent !important;
  border-color:transparent !important;
  transform:none !important;
}

body.tour-details-page .day-header{
  display:inline !important;

  margin:0 !important;
}

body.tour-details-page .day-header > div{
  display:inline !important;
}

body.tour-details-page .route-badge{
  display:inline !important;

  margin-left:12px !important;
  padding:0 !important;

  background:transparent !important;

  border:0 !important;
  border-radius:0 !important;

  font-family:var(--sans) !important;
  font-size:11px !important;
  font-weight:300 !important;
  line-height:1.4 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;

  color:var(--on-dark-muted) !important;
}

body.tour-details-page .day-header h3{
  display:block !important;

  margin:8px 0 10px !important;

  font-family:var(--serif) !important;
  font-size:1.5rem !important;
  font-weight:400 !important;
  line-height:1.04 !important;

  color:#fff !important;
}

body.tour-details-page .day-description{
  margin:0 0 14px !important;

  font-family:var(--sans) !important;
  font-size:15.5px !important;
  font-weight:300 !important;
  line-height:1.7 !important;

  color:var(--on-dark-muted) !important;
}

body.tour-details-page .day-tags{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
}

body.tour-details-page .tag{
  padding:6px 12px !important;

  background:transparent !important;
  color:var(--on-dark) !important;

  border:1px solid rgba(242,235,220,.2) !important;
  border-radius:0 !important;

  font-family:var(--sans) !important;
  font-size:11px !important;
  font-weight:300 !important;
  line-height:1.4 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}

body.tour-details-page .day-enhancements{
  margin:0 0 14px !important;
  padding:0 !important;

  background:transparent !important;

  border:0 !important;
  border-radius:0 !important;
}

body.tour-details-page .day-enhancements h4{
  margin:0 0 10px !important;

  font-family:var(--sans) !important;
  font-size:11px !important;
  font-weight:500 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;

  color:var(--accent) !important;
}

body.tour-details-page .enhancement-links{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
}

body.tour-details-page .enhancement-link{
  padding:6px 12px !important;

  background:transparent !important;
  color:var(--on-dark) !important;

  border:1px solid rgba(242,235,220,.2) !important;
  border-radius:0 !important;

  font-family:var(--sans) !important;
  font-size:11px !important;
  font-weight:300 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;

  transform:none !important;
}

body.tour-details-page .enhancement-link:hover{
  background:transparent !important;
  color:var(--accent) !important;
  border-color:var(--accent) !important;

  transform:none !important;
}

body.tour-details-page .enhancement-link i{
  display:none !important;
}


/* ============================================================
   10. LONGER TRIPS BANNER
   Extra content retained; mapped to ZIP bordered-card language.
   ============================================================ */

body.tour-details-page .longer-trips-banner{
  max-width:820px !important;

  margin:40px 0 0 !important;
  padding:30px 26px !important;

  background:transparent !important;

  border:1px solid rgba(242,235,220,.2) !important;
  border-radius:0 !important;

  text-align:left !important;

  box-shadow:none !important;
}

body.tour-details-page .banner-content h4{
  margin:0 0 8px !important;

  font-family:var(--serif) !important;
  font-size:1.3rem !important;
  font-weight:400 !important;

  color:#fff !important;
}

body.tour-details-page .banner-content p{
  margin:0 0 16px !important;

  font-family:var(--sans) !important;
  font-size:14px !important;
  font-weight:300 !important;
  line-height:1.6 !important;

  color:var(--on-dark-muted) !important;
}

body.tour-details-page .banner-links{
  display:flex !important;
  justify-content:flex-start !important;
  gap:10px !important;
  flex-wrap:wrap !important;
}

body.tour-details-page .banner-links a{
  --bd:rgba(242,235,220,.5);

  color:var(--on-dark) !important;
  border-color:var(--bd) !important;
}

body.tour-details-page .banner-links a::after{
  background:var(--on-dark) !important;
}

body.tour-details-page .banner-links a:hover{
  color:var(--dark) !important;
  border-color:var(--on-dark) !important;
}


/* ============================================================
   11. GALLERY
   Extra section retained; expressed in exact ZIP figure language.
   ============================================================ */

body.tour-details-page .gallery-section{
  background:var(--paper) !important;
  color:var(--ink) !important;
}

body.tour-details-page .gallery-section .section-label{
  color:var(--accent-deep) !important;
}

body.tour-details-page .gallery-section .section-heading{
  margin-top:18px !important;
  font-size:clamp(2.1rem,4.6vw,4rem) !important;
  color:var(--ink) !important;
}

body.tour-details-page .gallery-masonry{
  display:grid !important;
  grid-template-columns:1.2fr .8fr .8fr !important;
  grid-template-rows:repeat(2,minmax(230px,1fr)) !important;
  gap:14px !important;

  margin-top:46px !important;
}

body.tour-details-page .gallery-item{
  position:relative !important;
  min-height:0 !important;

  overflow:hidden !important;

  background:var(--paper-3) !important;

  border-radius:0 !important;
}

body.tour-details-page .gallery-large{
  grid-column:1 !important;
  grid-row:1 / span 2 !important;

  min-height:0 !important;
}

body.tour-details-page .gallery-item a{
  display:block !important;
  width:100% !important;
  height:100% !important;
}

body.tour-details-page .gallery-item img{
  width:100% !important;
  height:100% !important;

  object-fit:cover !important;

  transform:scale(1) !important;

  transition:transform 1.4s var(--ease) !important;
}

body.tour-details-page .gallery-item:hover img{
  transform:scale(1.05) !important;
}

body.tour-details-page .gallery-overlay{
  position:absolute !important;
  inset:0 !important;

  background:linear-gradient(to top,rgba(12,10,7,.25),transparent 55%) !important;

  opacity:1 !important;

  pointer-events:none !important;
}


/* ============================================================
   12. ADD-ON EXPERIENCES — EXACT dark pd-cards
   ============================================================ */

body.tour-details-page .experiences-section{
  background:var(--dark) !important;
  color:var(--on-dark) !important;
}

body.tour-details-page .experiences-section .section-label{
  color:var(--accent) !important;
}

body.tour-details-page .experiences-section .section-label::before{
  background:var(--accent) !important;
}

body.tour-details-page .experiences-section .section-heading{
  margin-top:16px !important;
  margin-bottom:6px !important;

  font-size:clamp(1.8rem,3.2vw,2.6rem) !important;

  color:#fff !important;
}

body.tour-details-page .experiences-section .section-description{
  color:var(--on-dark-muted) !important;
}

body.tour-details-page .experiences-grid{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:18px !important;

  margin-top:44px !important;
}

body.tour-details-page .experience-card{
  display:block !important;

  padding:30px 26px !important;

  background:transparent !important;

  border:1px solid rgba(242,235,220,.2) !important;
  border-radius:0 !important;

  text-align:left !important;

  box-shadow:none !important;

  transform:none !important;

  transition:
    border-color .4s,
    transform .4s !important;
}

body.tour-details-page .experience-card:hover{
  background:transparent !important;

  border-color:var(--accent) !important;

  transform:translateY(-4px) !important;

  box-shadow:none !important;
}

body.tour-details-page .experience-icon{
  display:none !important;
}

body.tour-details-page .experience-card h4{
  margin:0 0 8px !important;

  font-family:var(--serif) !important;
  font-size:1.3rem !important;
  font-weight:400 !important;

  color:#fff !important;
}

body.tour-details-page .experience-card p{
  margin:0 !important;

  font-family:var(--sans) !important;
  font-size:14px !important;
  font-weight:300 !important;
  line-height:1.6 !important;

  color:var(--on-dark-muted) !important;
}


/* ============================================================
   13. ACCOMMODATION — EXACT paper-2 pd-cards
   ============================================================ */

body.tour-details-page .accommodation-section{
  background:var(--paper-2) !important;
  color:var(--ink) !important;
}

body.tour-details-page .accommodation-section .section-heading{
  margin-top:18px !important;

  font-size:clamp(2.1rem,4.6vw,4rem) !important;

  color:var(--ink) !important;
}

body.tour-details-page .accommodation-section .section-description{
  color:var(--ink-soft) !important;
}

body.tour-details-page .lodge-cards{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:18px !important;

  margin-top:44px !important;
}

body.tour-details-page .lodge-card{
  position:relative !important;

  display:block !important;

  padding:30px 26px !important;

  background:transparent !important;

  border:1px solid var(--line) !important;
  border-radius:0 !important;

  box-shadow:none !important;

  transform:none !important;

  transition:
    border-color .4s,
    transform .4s !important;
}

body.tour-details-page .lodge-card::before{
  display:none !important;
}

body.tour-details-page .lodge-card:hover{
  border-color:var(--accent) !important;

  transform:translateY(-4px) !important;

  box-shadow:none !important;
}

body.tour-details-page .lodge-badge{
  display:inline !important;

  margin:0 !important;
  padding:0 !important;

  background:transparent !important;
  color:var(--accent-deep) !important;

  border-radius:0 !important;

  font-family:var(--sans) !important;
  font-size:10.5px !important;
  font-weight:300 !important;
  line-height:1.4 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
}

body.tour-details-page .lodge-card h4{
  margin:10px 0 8px !important;

  font-family:var(--serif) !important;
  font-size:1.3rem !important;
  font-weight:400 !important;

  color:var(--ink) !important;
}

body.tour-details-page .lodge-card p{
  margin:0 0 16px !important;

  font-family:var(--sans) !important;
  font-size:14px !important;
  font-weight:300 !important;
  line-height:1.6 !important;

  color:var(--ink-soft) !important;
}

body.tour-details-page .view-details{
  position:relative !important;

  display:inline-flex !important;
  align-items:center !important;
  gap:.7em !important;

  padding-bottom:4px !important;

  font-family:var(--sans) !important;
  font-size:12.5px !important;
  font-weight:500 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;

  color:var(--ink) !important;
}

body.tour-details-page .view-details::after{
  content:"" !important;

  position:absolute !important;
  left:0 !important;
  bottom:0 !important;

  width:100% !important;
  height:1px !important;

  background:currentColor !important;

  transform:scaleX(1) !important;
  transform-origin:left !important;

  transition:transform .45s var(--ease) !important;
}

body.tour-details-page .lodge-card:hover .view-details::after{
  transform:scaleX(0) !important;
  transform-origin:right !important;
}

body.tour-details-page .view-details i{
  transition:transform .45s var(--ease) !important;
}

body.tour-details-page .lodge-card:hover .view-details i{
  transform:translateX(5px) !important;
}

body.tour-details-page .lodge-comparison-link{
  margin-top:40px !important;
  padding:0 !important;

  background:transparent !important;

  border-radius:0 !important;

  text-align:left !important;
}

body.tour-details-page .lodge-comparison-link p{
  display:block !important;

  margin:0 !important;

  font-family:var(--sans) !important;
  font-size:14px !important;
  font-weight:300 !important;
  line-height:1.6 !important;

  color:var(--ink-soft) !important;
}

body.tour-details-page .lodge-comparison-link i{
  display:none !important;
}

body.tour-details-page .lodge-comparison-link a{
  color:var(--accent-deep) !important;
  border-bottom:1px solid var(--line) !important;
}


/* ============================================================
   14. PLANNING — ZIP "Best time & who it's for"
   ============================================================ */

body.tour-details-page .planning-section{
  background:var(--paper) !important;
  color:var(--ink) !important;
}

body.tour-details-page .planning-section .section-heading{
  margin-top:18px !important;
  margin-bottom:30px !important;

  font-size:clamp(2.1rem,4.6vw,4rem) !important;

  color:var(--ink) !important;
}

body.tour-details-page .planning-section .section-description{
  color:var(--ink-soft) !important;
}

body.tour-details-page .planning-simple{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:clamp(28px,4vw,56px) !important;

  max-width:none !important;

  margin-top:8px !important;
}

body.tour-details-page .planning-block{
  padding:0 !important;
}

body.tour-details-page .planning-title{
  margin:0 0 16px !important;

  font-family:var(--sans) !important;
  font-size:12px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.2em !important;
  text-transform:uppercase !important;

  color:var(--accent-deep) !important;
}

body.tour-details-page .planning-text{
  margin:0 0 12px !important;

  font-family:var(--sans) !important;
  font-size:16px !important;
  font-weight:300 !important;
  line-height:1.6 !important;

  color:var(--ink-soft) !important;
}

body.tour-details-page .planning-list{
  display:grid !important;
  gap:11px !important;

  list-style:none !important;

  padding:0 !important;
  margin:0 0 1.4em !important;
}

body.tour-details-page .planning-list li{
  position:relative !important;

  padding-left:26px !important;

  font-family:var(--sans) !important;
  font-size:16px !important;
  font-weight:300 !important;
  line-height:1.6 !important;

  color:var(--ink-soft) !important;
}

body.tour-details-page .planning-list li::before{
  content:"" !important;

  position:absolute !important;
  left:0 !important;
  top:11px !important;

  width:11px !important;
  height:1px !important;

  background:var(--accent) !important;
}

body.tour-details-page .planning-link{
  position:relative !important;

  display:inline-flex !important;
  align-items:center !important;
  gap:.7em !important;

  padding-bottom:4px !important;

  font-family:var(--sans) !important;
  font-size:12.5px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;

  color:var(--ink) !important;
}

body.tour-details-page .planning-link::after{
  content:"" !important;

  position:absolute !important;
  left:0 !important;
  bottom:0 !important;

  width:100% !important;
  height:1px !important;

  background:currentColor !important;

  transform:scaleX(1) !important;
  transform-origin:left !important;

  transition:transform .45s var(--ease) !important;
}

body.tour-details-page .planning-link:hover::after{
  transform:scaleX(0) !important;
  transform-origin:right !important;
}

body.tour-details-page .planning-links-row{
  display:block !important;
  margin-top:10px !important;
}


/* ============================================================
   15. FAQ — EXACT pd-faq
   ============================================================ */

body.tour-details-page .luxury-faq-section{
  padding-block:clamp(72px,11vh,150px) !important;

  background:var(--paper-2) !important;
  color:var(--ink) !important;
}

body.tour-details-page .faq-header{
  text-align:center !important;
}

body.tour-details-page .faq-header h2{
  margin:0 !important;

  font-family:var(--serif) !important;
  font-size:clamp(2.1rem,4.6vw,4rem) !important;
  font-weight:300 !important;
  line-height:1.04 !important;
  letter-spacing:-.015em !important;

  color:var(--ink) !important;
}

body.tour-details-page .faq-wrapper{
  max-width:840px !important;

  margin:40px auto 0 !important;
}

body.tour-details-page .faq-item{
  border:0 !important;
  border-top:1px solid var(--line) !important;
  border-radius:0 !important;

  background:transparent !important;

  box-shadow:none !important;
}

body.tour-details-page .faq-item:last-child{
  border-bottom:1px solid var(--line) !important;
}

body.tour-details-page .faq-question{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;

  width:100% !important;

  padding:24px 0 !important;

  background:none !important;

  border:0 !important;

  text-align:left !important;
}

body.tour-details-page .faq-question h3{
  margin:0 !important;

  font-family:var(--serif) !important;
  font-size:clamp(1.15rem,1.7vw,1.4rem) !important;
  font-weight:400 !important;
  line-height:1.2 !important;

  color:var(--ink) !important;
}

body.tour-details-page .faq-question i{
  flex-shrink:0 !important;

  width:24px !important;
  height:24px !important;

  font-size:0 !important;

  position:relative !important;
}

body.tour-details-page .faq-question i::before,
body.tour-details-page .faq-question i::after{
  content:"" !important;

  position:absolute !important;
  left:50% !important;
  top:50% !important;

  background:var(--accent-deep) !important;
}

body.tour-details-page .faq-question i::before{
  width:13px !important;
  height:1.5px !important;

  transform:translate(-50%,-50%) !important;
}

body.tour-details-page .faq-question i::after{
  width:1.5px !important;
  height:13px !important;

  transform:translate(-50%,-50%) !important;

  transition:transform .4s var(--ease) !important;
}

body.tour-details-page .faq-item.active .faq-question i::after,
body.tour-details-page .faq-item.open .faq-question i::after{
  transform:translate(-50%,-50%) scaleY(0) !important;
}

body.tour-details-page .faq-answer{
  background:transparent !important;
  color:var(--ink-soft) !important;
}

body.tour-details-page .faq-answer p,
body.tour-details-page .faq-answer li{
  font-family:var(--sans) !important;
  font-size:15.5px !important;
  font-weight:300 !important;
  line-height:1.7 !important;

  color:var(--ink-soft) !important;
}

body.tour-details-page .faq-answer p{
  margin:0 0 24px !important;
}

body.tour-details-page .faq-answer a{
  color:var(--accent-deep) !important;
  border-bottom:1px solid var(--line) !important;
}


/* ============================================================
   16. CTA — EXACT cta-band
   ============================================================ */

body.tour-details-page .cta-section{
  padding-block:clamp(72px,11vh,150px) !important;

  background:var(--dark) !important;
  color:var(--on-dark) !important;

  text-align:center !important;
}

body.tour-details-page .cta-box{
  background:transparent !important;

  border-radius:0 !important;

  box-shadow:none !important;

  overflow:visible !important;
}

body.tour-details-page .cta-content{
  padding:0 !important;

  text-align:center !important;
}

body.tour-details-page .cta-content h2{
  max-width:18ch !important;

  margin:18px auto 0 !important;

  font-family:var(--serif) !important;
  font-size:clamp(2rem,4vw,3.4rem) !important;
  font-weight:300 !important;
  line-height:1.04 !important;
  letter-spacing:-.01em !important;

  color:#fff !important;
}

body.tour-details-page .cta-content > p{
  max-width:60ch !important;

  margin:22px auto 34px !important;

  font-family:var(--sans) !important;
  font-size:clamp(1.05rem,1.5vw,1.32rem) !important;
  font-weight:300 !important;
  line-height:1.7 !important;

  color:var(--on-dark-muted) !important;
}

body.tour-details-page .cta-buttons{
  display:flex !important;
  justify-content:center !important;
  gap:14px !important;
  flex-wrap:wrap !important;

  margin:28px 0 0 !important;
}

body.tour-details-page .btn-primary-cta,
body.tour-details-page .btn-secondary-cta{
  --bd:rgba(242,235,220,.5);

  color:var(--on-dark) !important;
  border-color:var(--bd) !important;
}

body.tour-details-page .btn-primary-cta::after,
body.tour-details-page .btn-secondary-cta::after{
  background:var(--on-dark) !important;
}

body.tour-details-page .btn-primary-cta:hover,
body.tour-details-page .btn-secondary-cta:hover{
  color:var(--dark) !important;
  border-color:var(--on-dark) !important;

  transform:none !important;
  box-shadow:none !important;
}

body.tour-details-page .btn-secondary-cta{
  border-color:transparent !important;
}

body.tour-details-page .btn-primary-cta i,
body.tour-details-page .btn-secondary-cta i{
  display:none !important;
}

body.tour-details-page .departure-cities{
  margin-top:30px !important;
  padding:0 !important;

  border:0 !important;
}

body.tour-details-page .cities-label{
  display:block !important;

  margin-bottom:4px !important;

  font-family:var(--sans) !important;
  font-size:11px !important;
  font-weight:300 !important;
  line-height:1.4 !important;
  letter-spacing:.2em !important;
  text-transform:uppercase !important;

  color:var(--on-dark-muted) !important;
}

body.tour-details-page .cities-links{
  display:flex !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  justify-content:center !important;

  margin-top:20px !important;
}

body.tour-details-page .cities-links a{
  padding:10px 18px !important;

  background:transparent !important;
  color:var(--on-dark) !important;

  border:1px solid rgba(242,235,220,.3) !important;
  border-radius:40px !important;

  font-family:var(--sans) !important;
  font-size:13px !important;
  font-weight:300 !important;
  line-height:1.4 !important;
  letter-spacing:.04em !important;

  transform:none !important;

  transition:all .35s var(--ease) !important;
}

body.tour-details-page .cities-links a:hover{
  background:var(--accent-deep) !important;
  color:var(--on-dark) !important;

  border-color:var(--accent-deep) !important;

  transform:none !important;
}


/* ============================================================
   17. CSS-ONLY ZIP MOTION
   No external JS required.

   Motion values copied from ZIP Reveal:
   opacity: 0 -> 1
   transform: translateY(26px) -> none
   opacity duration: 1s
   transform duration: 1.1s
   easing: var(--ease)
   ============================================================ */

@keyframes lu-pd-opacity{
  from{opacity:0}
  to{opacity:1}
}

@keyframes lu-pd-rise{
  from{transform:translateY(26px)}
  to{transform:none}
}


/* ------------------------------------------------------------
   HERO LOAD ANIMATION
   Same motion language as ZIP Reveal
   ------------------------------------------------------------ */

body.tour-details-page .hero-title-modern{
  animation:
    lu-pd-opacity 1s var(--ease) both,
    lu-pd-rise 1.1s var(--ease) both !important;
}

body.tour-details-page .hero-subtitle{
  animation:
    lu-pd-opacity 1s var(--ease) .08s both,
    lu-pd-rise 1.1s var(--ease) .08s both !important;
}

body.tour-details-page .hero-features{
  animation:
    lu-pd-opacity 1s var(--ease) .16s both,
    lu-pd-rise 1.1s var(--ease) .16s both !important;
}


/* ------------------------------------------------------------
   SCROLL REVEALS
   CSS-only equivalent for modern browsers.
   ------------------------------------------------------------ */

@supports (animation-timeline:view()){

  body.tour-details-page .overview-content-box .section-label,
  body.tour-details-page .overview-content-box .section-heading,
  body.tour-details-page .overview-content-box .lead-text,
  body.tour-details-page .highlight-card,
  body.tour-details-page .pricing-card-modern,

  body.tour-details-page .itinerary-section .section-label,
  body.tour-details-page .itinerary-section .section-heading,
  body.tour-details-page .itinerary-section .section-description,
  body.tour-details-page .itinerary-day,
  body.tour-details-page .longer-trips-banner,

  body.tour-details-page .gallery-section .section-label,
  body.tour-details-page .gallery-section .section-heading,
  body.tour-details-page .gallery-item,

  body.tour-details-page .experiences-section .section-label,
  body.tour-details-page .experiences-section .section-heading,
  body.tour-details-page .experiences-section .section-description,
  body.tour-details-page .experience-card,

  body.tour-details-page .accommodation-section .section-label,
  body.tour-details-page .accommodation-section .section-heading,
  body.tour-details-page .accommodation-section .section-description,
  body.tour-details-page .lodge-card,

  body.tour-details-page .planning-section .section-label,
  body.tour-details-page .planning-section .section-heading,
  body.tour-details-page .planning-section .section-description,
  body.tour-details-page .planning-block,

  body.tour-details-page .faq-header,
  body.tour-details-page .faq-item,

  body.tour-details-page .cta-content h2,
  body.tour-details-page .cta-content > p,
  body.tour-details-page .cta-buttons,
  body.tour-details-page .departure-cities{
    animation-name:lu-pd-opacity,lu-pd-rise !important;
    animation-duration:1s,1.1s !important;
    animation-timing-function:var(--ease),var(--ease) !important;
    animation-fill-mode:both,both !important;

    animation-timeline:view(),view() !important;
    animation-range:entry 0% cover 22%,entry 0% cover 22% !important;
  }


  /* Stagger cards/items using the same 80ms rhythm. */
  body.tour-details-page .highlight-card:nth-child(2),
  body.tour-details-page .gallery-item:nth-child(2),
  body.tour-details-page .experience-card:nth-child(2),
  body.tour-details-page .lodge-card:nth-child(2),
  body.tour-details-page .planning-block:nth-child(2){
    animation-range:entry 4% cover 26%,entry 4% cover 26% !important;
  }

  body.tour-details-page .highlight-card:nth-child(3),
  body.tour-details-page .gallery-item:nth-child(3),
  body.tour-details-page .experience-card:nth-child(3),
  body.tour-details-page .lodge-card:nth-child(3),
  body.tour-details-page .planning-block:nth-child(3){
    animation-range:entry 8% cover 30%,entry 8% cover 30% !important;
  }

  body.tour-details-page .highlight-card:nth-child(4),
  body.tour-details-page .gallery-item:nth-child(4),
  body.tour-details-page .experience-card:nth-child(4),
  body.tour-details-page .planning-block:nth-child(4){
    animation-range:entry 12% cover 34%,entry 12% cover 34% !important;
  }
}


/* ------------------------------------------------------------
   FALLBACK FOR BROWSERS WITHOUT VIEW TIMELINES
   Keep content fully visible; hero still animates on load.
   ------------------------------------------------------------ */

@supports not (animation-timeline:view()){
  body.tour-details-page .overview-content-box,
  body.tour-details-page .pricing-card-modern,
  body.tour-details-page .itinerary-day,
  body.tour-details-page .gallery-item,
  body.tour-details-page .experience-card,
  body.tour-details-page .lodge-card,
  body.tour-details-page .planning-block,
  body.tour-details-page .faq-item,
  body.tour-details-page .cta-content{
    opacity:1 !important;
    transform:none !important;
  }
}


/* ============================================================
   18. RESPONSIVE — SOURCE BREAKPOINTS
   ============================================================ */

@media(max-width:900px){

  body.tour-details-page .safari-overview-section .row{
    grid-template-columns:1fr !important;
  }

  body.tour-details-page .pricing-card-modern{
    position:static !important;
  }

  body.tour-details-page .highlights-grid{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:860px){

  body.tour-details-page .experiences-grid,
  body.tour-details-page .lodge-cards{
    grid-template-columns:1fr !important;
  }

  body.tour-details-page .planning-simple{
    grid-template-columns:1fr !important;
  }

  body.tour-details-page .gallery-masonry{
    grid-template-columns:1fr 1fr !important;
    grid-template-rows:auto !important;
  }

  body.tour-details-page .gallery-large{
    grid-column:1 / -1 !important;
    grid-row:auto !important;
    aspect-ratio:16/8 !important;
  }

  body.tour-details-page .gallery-item{
    aspect-ratio:4/3 !important;
  }
}

@media(max-width:600px){

  body.tour-details-page .gallery-masonry{
    grid-template-columns:1fr !important;
  }

  body.tour-details-page .gallery-large,
  body.tour-details-page .gallery-item{
    grid-column:auto !important;
    aspect-ratio:4/3 !important;
  }

  body.tour-details-page .hero-features{
    gap:8px !important;
  }

  body.tour-details-page .hero-features span{
    padding:8px 12px !important;
    font-size:10px !important;
  }

  body.tour-details-page .cta-buttons{
    align-items:center !important;
  }
}


/* ============================================================
   19. REDUCED MOTION
   ============================================================ */

@media(prefers-reduced-motion:reduce){

  body.tour-details-page .hero-title-modern,
  body.tour-details-page .hero-subtitle,
  body.tour-details-page .hero-features{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
  }



  html{scroll-behavior:auto}

  body.tour-details-page *,
  body.tour-details-page *::before,
  body.tour-details-page *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}




/* ============================================================
   EXPLORE NORWAY TOUR PACKAGES
   EXACT ZIP PACKAGE-CARD SYSTEM
   Source: page-packages.jsx + base.css
   ============================================================ */

body.tour-details-page .blog-packages-section{
  width:100% !important;

  margin:0 !important;
  padding-block:clamp(72px,11vh,150px) !important;

  background:var(--paper) !important;
  color:var(--ink) !important;
}

body.tour-details-page .blog-packages-section > .container{
  width:100% !important;
  max-width:var(--maxw) !important;

  margin:0 auto !important;
  padding-inline:var(--gut) !important;
}


/* ------------------------------------------------------------
   EXPLORE MORE — exact ZIP .eyebrow
   ------------------------------------------------------------ */

body.tour-details-page .blog-packages-title::before{
  content:"EXPLORE MORE" !important;

  display:inline-flex !important;
  align-items:center !important;
  gap:.9em !important;

  width:auto !important;

  margin:0 0 18px !important;

  font-family:var(--sans) !important;
  font-size:11.5px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.34em !important;
  text-transform:uppercase !important;

  color:var(--accent-deep) !important;
}

/* exact eyebrow line */
body.tour-details-page .blog-packages-title{
  position:relative !important;

  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;

  max-width:22ch !important;

  margin:0 !important;

  font-family:var(--serif) !important;
  font-size:clamp(2.1rem,4.6vw,4rem) !important;
  font-weight:300 !important;
  line-height:1.04 !important;
  letter-spacing:-.015em !important;

  text-align:left !important;
  text-transform:none !important;

  color:var(--ink) !important;
}

body.tour-details-page .blog-packages-title::after{
  content:"" !important;

  position:absolute !important;
  left:0 !important;
  top:8px !important;

  width:26px !important;
  height:1px !important;

  background:var(--accent) !important;

  opacity:.7 !important;

  transform:translateX(0) !important;
}

/*
  Keep the eyebrow text aligned exactly after the 26px rule.
  The pseudo text receives equivalent visual indentation.
*/
body.tour-details-page .blog-packages-title::before{
  padding-left:40px !important;
}


/* ------------------------------------------------------------
   GRID — exact ZIP .pkg-grid
   ------------------------------------------------------------ */

body.tour-details-page .blog-packages-grid{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;

  gap:24px !important;

  width:100% !important;
  max-width:none !important;

  margin:46px 0 0 !important;
  padding:0 !important;

  align-items:stretch !important;
}


/* ------------------------------------------------------------
   CARD — exact ZIP .pkg
   ------------------------------------------------------------ */

body.tour-details-page .blog-package-card{
  position:relative !important;

  display:flex !important;
  flex-direction:column !important;

  width:100% !important;
  min-width:0 !important;
  height:100% !important;

  margin:0 !important;
  padding:0 !important;

  overflow:hidden !important;

  background:var(--paper) !important;

  border:1px solid var(--line-soft) !important;
  border-radius:0 !important;

  box-shadow:none !important;

  transform:translateY(0) !important;

  transition:
    transform .5s var(--ease),
    box-shadow .5s var(--ease) !important;
}

body.tour-details-page .blog-package-card:hover{
  border-color:var(--line-soft) !important;

  transform:translateY(-5px) !important;

  box-shadow:
    0 30px 60px -34px rgba(33,28,21,.45) !important;
}


/* ------------------------------------------------------------
   IMAGE — exact ZIP .pkg-fig
   Supports an image wrapper OR a direct card image.
   Existing content/images are not modified.
   ------------------------------------------------------------ */

body.tour-details-page .blog-package-card .blog-package-image,
body.tour-details-page .blog-package-card .package-image,
body.tour-details-page .blog-package-card .pkg-fig{
  position:relative !important;

  display:block !important;

  width:100% !important;
  aspect-ratio:3 / 2 !important;

  overflow:hidden !important;

  background:var(--paper-3) !important;
}

body.tour-details-page .blog-package-card .blog-package-image img,
body.tour-details-page .blog-package-card .package-image img,
body.tour-details-page .blog-package-card .pkg-fig img{
  display:block !important;

  width:100% !important;
  height:100% !important;

  object-fit:cover !important;
  object-position:center !important;

  transform:scale(1) !important;

  transition:transform 1.3s var(--ease) !important;
}

body.tour-details-page .blog-package-card:hover .blog-package-image img,
body.tour-details-page .blog-package-card:hover .package-image img,
body.tour-details-page .blog-package-card:hover .pkg-fig img{
  transform:scale(1.06) !important;
}


/* Direct-image fallback */
body.tour-details-page .blog-package-card > img{
  display:block !important;

  width:100% !important;
  aspect-ratio:3 / 2 !important;

  object-fit:cover !important;
  object-position:center !important;

  background:var(--paper-3) !important;

  transform:scale(1) !important;

  transition:transform 1.3s var(--ease) !important;
}

body.tour-details-page .blog-package-card:hover > img{
  transform:scale(1.06) !important;
}


/* ------------------------------------------------------------
   CARD BODY
   Existing markup may not have .pkg-body, therefore padding is
   mapped safely to current text elements without changing HTML.
   ------------------------------------------------------------ */

body.tour-details-page .blog-package-card .blog-package-content,
body.tour-details-page .blog-package-card .package-content,
body.tour-details-page .blog-package-card .pkg-body{
  display:flex !important;
  flex:1 !important;
  flex-direction:column !important;

  padding:24px !important;
}

/* If current markup has no content wrapper, use matching inset. */
body.tour-details-page .blog-package-card > h3{
  margin:24px 24px 0 !important;
}

body.tour-details-page .blog-package-card > p{
  margin-left:24px !important;
  margin-right:24px !important;
}

body.tour-details-page .blog-package-card > a:last-child{
  margin-left:24px !important;
  margin-right:24px !important;
  margin-bottom:24px !important;
}


/* ------------------------------------------------------------
   TITLE — exact ZIP .pkg-body h3
   ------------------------------------------------------------ */

body.tour-details-page .blog-package-card h3{
  margin-top:0 !important;
  margin-bottom:0 !important;

  font-family:var(--serif) !important;
  font-size:1.45rem !important;
  font-style:normal !important;
  font-weight:400 !important;
  line-height:1.1 !important;
  letter-spacing:-.01em !important;

  text-transform:none !important;

  color:var(--ink) !important;
}


/* ------------------------------------------------------------
   SUPPORTING TEXT
   Styled using ZIP package body text language.
   ------------------------------------------------------------ */

body.tour-details-page .blog-package-card p{
  flex:1 1 auto !important;

  margin-top:9px !important;
  margin-bottom:22px !important;

  font-family:var(--sans) !important;
  font-size:14px !important;
  font-weight:300 !important;
  line-height:1.65 !important;

  color:var(--ink-soft) !important;
}


/* Existing list content, if present — exact ZIP package bullets */
body.tour-details-page .blog-package-card ul{
  display:grid !important;
  gap:8px !important;
  flex:1 !important;

  list-style:none !important;

  margin:0 24px 22px !important;
  padding:0 !important;
}

body.tour-details-page .blog-package-card ul li{
  position:relative !important;

  padding-left:20px !important;

  font-family:var(--sans) !important;
  font-size:14px !important;
  font-weight:300 !important;
  line-height:1.55 !important;

  color:var(--ink-soft) !important;
}

body.tour-details-page .blog-package-card ul li::before{
  content:"" !important;

  position:absolute !important;
  left:0 !important;
  top:9px !important;

  width:9px !important;
  height:1px !important;

  background:var(--accent) !important;
}


/* ------------------------------------------------------------
   LINK — exact ZIP LinkU
   ------------------------------------------------------------ */

body.tour-details-page .blog-package-card a:not(.blog-package-image):not(.package-image):not(.pkg-fig){
  position:relative !important;

  display:inline-flex !important;
  align-items:center !important;
  gap:.7em !important;

  align-self:flex-start !important;
  width:fit-content !important;

  margin-top:auto !important;
  padding-bottom:4px !important;

  background:transparent !important;
  color:var(--ink) !important;

  border:0 !important;
  border-radius:0 !important;

  font-family:var(--sans) !important;
  font-size:12.5px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;

  transform:none !important;

  transition:none !important;
}

body.tour-details-page .blog-package-card a:not(.blog-package-image):not(.package-image):not(.pkg-fig)::after{
  content:"" !important;

  position:absolute !important;
  left:0 !important;
  bottom:0 !important;

  width:100% !important;
  height:1px !important;

  background:currentColor !important;

  transform:scaleX(1) !important;
  transform-origin:left !important;

  transition:transform .45s var(--ease) !important;
}

body.tour-details-page .blog-package-card a:not(.blog-package-image):not(.package-image):not(.pkg-fig):hover::after{
  transform:scaleX(0) !important;
  transform-origin:right !important;
}


/* ------------------------------------------------------------
   EXACT ZIP RESPONSIVE PACKAGE GRID
   ------------------------------------------------------------ */

@media(max-width:980px){
  body.tour-details-page .blog-packages-grid{
    grid-template-columns:repeat(2,1fr) !important;
  }
}

@media(max-width:640px){
  body.tour-details-page .blog-packages-grid{
    grid-template-columns:1fr !important;
  }
}


/* ------------------------------------------------------------
   ZIP-SMOOTH REVEAL MOTION FOR THIS SECTION
   Uses the exact source motion values:
   opacity 1s, transform 1.1s, translateY(26px), var(--ease)
   ------------------------------------------------------------ */

@supports (animation-timeline:view()){

  body.tour-details-page .blog-packages-title,
  body.tour-details-page .blog-package-card{
    animation-name:lu-pd-opacity,lu-pd-rise !important;
    animation-duration:1s,1.1s !important;
    animation-timing-function:var(--ease),var(--ease) !important;
    animation-fill-mode:both,both !important;

    animation-timeline:view(),view() !important;
    animation-range:entry 0% cover 22%,entry 0% cover 22% !important;
  }

  body.tour-details-page .blog-package-card:nth-child(2){
    animation-range:entry 4% cover 26%,entry 4% cover 26% !important;
  }

  body.tour-details-page .blog-package-card:nth-child(3){
    animation-range:entry 8% cover 30%,entry 8% cover 30% !important;
  }
}


/* ============================================================
   ZIP MOTION CONSISTENCY AUDIT
   Only timing/easing normalization — no layout/style changes.

   Values are copied from base.css/page-packages.jsx:
   reveal:      1s / 1.1s var(--ease)
   button fill: .55s var(--ease)
   link line:   .45s var(--ease)
   card hover:  .5s var(--ease)
   card image:  1.3s var(--ease)
   ============================================================ */

/* Existing editorial card transitions */
body.tour-details-page .highlight-card,
body.tour-details-page .experience-card,
body.tour-details-page .lodge-card{
  transition-timing-function:var(--ease) !important;
}

/* Existing interactive links */
body.tour-details-page .planning-link::after,
body.tour-details-page .view-details::after,
body.tour-details-page .view-details i{
  transition-timing-function:var(--ease) !important;
}

/* Existing gallery remains on ZIP figure timing */
body.tour-details-page .gallery-item img{
  transition:transform 1.4s var(--ease) !important;
}

@media(prefers-reduced-motion:reduce){
  body.tour-details-page .blog-packages-title,
  body.tour-details-page .blog-package-card{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
  }
}

/* ============================================================
   ONLY CHANGE 02 — FAQ
   Title case, answer alignment, same reveal motion.
   ============================================================ */

/*
   Existing text is left untouched.
   CSS forces sentence case and then restores the first character.
*/
body.tour-details-page .luxury-faq-section .faq-header h2{
  text-transform:lowercase !important;
}

body.tour-details-page .luxury-faq-section .faq-header h2::first-letter{
  text-transform:uppercase !important;
}

/* Question and answer start on exactly the same horizontal edge */
body.tour-details-page .luxury-faq-section .faq-question{
  padding-left:0 !important;
  padding-right:0 !important;
}

body.tour-details-page .luxury-faq-section .faq-answer{
  margin:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;

  text-align:left !important;
}

body.tour-details-page .luxury-faq-section .faq-answer > *,
body.tour-details-page .luxury-faq-section .faq-answer p,
body.tour-details-page .luxury-faq-section .faq-answer ul,
body.tour-details-page .luxury-faq-section .faq-answer ol{
  max-width:none !important;

  margin-left:0 !important;
  margin-right:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;

  text-align:left !important;
}

/* Lists retain bullets while staying aligned with the question edge */
body.tour-details-page .luxury-faq-section .faq-answer ul,
body.tour-details-page .luxury-faq-section .faq-answer ol{
  list-style-position:inside !important;
}

/* Preserve the exact same section reveal values already used on this page */
@supports (animation-timeline:view()){
  body.tour-details-page .luxury-faq-section .faq-header,
  body.tour-details-page .luxury-faq-section .faq-item{
    animation-name:lu-pd-opacity,lu-pd-rise !important;
    animation-duration:1s,1.1s !important;
    animation-timing-function:var(--ease),var(--ease) !important;
    animation-fill-mode:both,both !important;

    animation-timeline:view(),view() !important;
    animation-range:entry 0% cover 22%,entry 0% cover 22% !important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.tour-details-page .blog-packages-title,
  body.tour-details-page .blog-package-card,
  body.tour-details-page .luxury-faq-section .faq-header,
  body.tour-details-page .luxury-faq-section .faq-item{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
  }
}


/* ============================================================
   DEFINITIVE FIX — EXPLORE NORWAY TOUR PACKAGES
   Actual page selectors mapped to ZIP .pkg card system.
   ============================================================ */

/* Standard ZIP section spacing */
body.tour-details-page .related-packages-section{
  width:100% !important;

  margin:0 !important;
  padding-block:clamp(72px,11vh,150px) !important;
  padding-inline:0 !important;

  background:var(--paper) !important;
  color:var(--ink) !important;
}

body.tour-details-page .related-packages-section > .container{
  width:100% !important;
  max-width:var(--maxw) !important;

  margin:0 auto !important;
  padding-inline:var(--gut) !important;
}


/* ------------------------------------------------------------
   HEADER — ZIP editorial alignment
   ------------------------------------------------------------ */

body.tour-details-page .related-packages-section .section-header-center{
  max-width:none !important;

  margin:0 0 46px !important;

  text-align:left !important;
}

/* Existing label or visual EXPLORE MORE */
body.tour-details-page .related-packages-section .section-label{
  display:inline-flex !important;
  align-items:center !important;
  gap:.9em !important;

  margin:0 0 18px !important;

  font-family:var(--sans) !important;
  font-size:11.5px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.34em !important;
  text-transform:uppercase !important;

  color:var(--accent-deep) !important;
}

body.tour-details-page .related-packages-section .section-label::before{
  content:"" !important;

  width:26px !important;
  height:1px !important;

  background:var(--accent) !important;

  opacity:.7 !important;
}

/* If no explicit label exists, place EXPLORE MORE above the heading. */
body.tour-details-page .related-packages-section .section-heading::before{
  content:"EXPLORE MORE" !important;

  display:flex !important;
  align-items:center !important;
  gap:.9em !important;

  width:max-content !important;

  margin:0 0 18px !important;

  font-family:var(--sans) !important;
  font-size:11.5px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.34em !important;
  text-transform:uppercase !important;

  color:var(--accent-deep) !important;
}

body.tour-details-page .related-packages-section .section-heading{
  max-width:22ch !important;

  margin:0 0 12px !important;

  font-family:var(--serif) !important;
  font-size:clamp(2.1rem,4.6vw,4rem) !important;
  font-weight:300 !important;
  line-height:1.04 !important;
  letter-spacing:-.015em !important;

  text-align:left !important;
  text-transform:none !important;

  color:var(--ink) !important;
}

body.tour-details-page .related-packages-section .section-description{
  max-width:68ch !important;

  margin:0 !important;

  font-family:var(--sans) !important;
  font-size:17px !important;
  font-weight:300 !important;
  line-height:1.75 !important;
  letter-spacing:.005em !important;

  text-align:left !important;

  color:var(--ink-soft) !important;
}


/* ------------------------------------------------------------
   ACTUAL GRID WRAPPER
   Bootstrap .row is converted to ZIP .pkg-grid.
   ------------------------------------------------------------ */

body.tour-details-page .related-packages-section .row.g-4,
body.tour-details-page .related-packages-section .related-packages-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;

  gap:24px !important;

  margin:46px 0 0 !important;
  padding:0 !important;
}

body.tour-details-page .related-packages-section .row.g-4 > [class*="col-"]{
  display:block !important;

  width:auto !important;
  max-width:none !important;

  margin:0 !important;
  padding:0 !important;
}


/* ------------------------------------------------------------
   ACTUAL CARD — exact ZIP .pkg
   ------------------------------------------------------------ */

body.tour-details-page .related-package-card,
body.tour-details-page .related-packages-section .package-card{
  position:relative !important;

  display:flex !important;
  flex-direction:column !important;

  width:100% !important;
  height:100% !important;
  min-height:0 !important;

  margin:0 !important;
  padding:0 !important;

  overflow:hidden !important;

  background:var(--paper) !important;

  border:1px solid var(--line-soft) !important;
  border-radius:0 !important;

  box-shadow:none !important;

  transform:translateY(0) !important;

  transition:
    transform .5s var(--ease),
    box-shadow .5s var(--ease) !important;
}

body.tour-details-page .related-package-card:hover,
body.tour-details-page .related-packages-section .package-card:hover{
  border-color:var(--line-soft) !important;

  transform:translateY(-5px) !important;

  box-shadow:
    0 30px 60px -34px rgba(33,28,21,.45) !important;
}


/* ------------------------------------------------------------
   IMAGE — exact ZIP .pkg-fig
   ------------------------------------------------------------ */

body.tour-details-page .related-package-image,
body.tour-details-page .related-packages-section .package-image{
  position:relative !important;

  width:100% !important;
  height:auto !important;
  aspect-ratio:3 / 2 !important;

  overflow:hidden !important;

  background:var(--paper-3) !important;
}

body.tour-details-page .related-package-image img,
body.tour-details-page .related-packages-section .package-image img{
  display:block !important;

  width:100% !important;
  height:100% !important;

  object-fit:cover !important;
  object-position:center !important;

  transform:scale(1) !important;

  transition:transform 1.3s var(--ease) !important;
}

body.tour-details-page .related-package-card:hover .related-package-image img,
body.tour-details-page .related-packages-section .package-card:hover .package-image img{
  transform:scale(1.06) !important;
}


/* ------------------------------------------------------------
   BADGE — exact ZIP .pkg-badge
   ------------------------------------------------------------ */

body.tour-details-page .related-package-label,
body.tour-details-page .related-packages-section .package-badge{
  position:absolute !important;

  top:14px !important;
  left:14px !important;
  bottom:auto !important;
  z-index:3 !important;

  display:inline-flex !important;

  margin:0 !important;
  padding:7px 13px !important;

  background:rgba(28,24,19,.82) !important;
  color:#fff !important;

  border:0 !important;
  border-radius:0 !important;

  backdrop-filter:blur(4px) !important;

  font-family:var(--sans) !important;
  font-size:10.5px !important;
  font-weight:300 !important;
  line-height:1.4 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
}


/* ------------------------------------------------------------
   BODY — exact ZIP .pkg-body
   ------------------------------------------------------------ */

body.tour-details-page .related-package-content,
body.tour-details-page .related-packages-section .package-content{
  position:static !important;

  display:flex !important;
  flex:1 1 auto !important;
  flex-direction:column !important;

  width:100% !important;

  padding:24px !important;

  background:transparent !important;
}


/* Title */
body.tour-details-page .related-package-content h3,
body.tour-details-page .related-packages-section .package-title{
  margin:0 !important;

  font-family:var(--serif) !important;
  font-size:1.45rem !important;
  font-weight:400 !important;
  line-height:1.1 !important;
  letter-spacing:-.01em !important;

  text-transform:none !important;

  color:var(--ink) !important;
}


/* Route — exact .pkg-route */
body.tour-details-page .related-packages-section .package-route{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:6px !important;

  margin:9px 0 16px !important;

  font-family:var(--sans) !important;
  font-size:12px !important;
  font-weight:300 !important;
  line-height:1.4 !important;
  letter-spacing:.1em !important;
  text-transform:uppercase !important;

  color:var(--accent-deep) !important;
}

body.tour-details-page .related-packages-section .package-route i{
  font-size:9px !important;
  color:var(--muted) !important;
}


/* Activities — exact ZIP package bullets */
body.tour-details-page .related-packages-section .package-activities{
  display:grid !important;
  gap:8px !important;
  flex:1 1 auto !important;

  margin:0 0 22px !important;
  padding:0 !important;
}

body.tour-details-page .related-packages-section .activity-item{
  position:relative !important;

  display:block !important;

  padding-left:20px !important;

  font-family:var(--sans) !important;
  font-size:14px !important;
  font-weight:300 !important;
  line-height:1.55 !important;

  color:var(--ink-soft) !important;
}

body.tour-details-page .related-packages-section .activity-item::before{
  content:"" !important;

  position:absolute !important;
  left:0 !important;
  top:9px !important;

  width:9px !important;
  height:1px !important;

  background:var(--accent) !important;
}

body.tour-details-page .related-packages-section .activity-item i{
  display:none !important;
}


/* ------------------------------------------------------------
   VIEW DETAILS — exact ZIP LinkU
   Removes Bootstrap full-width button appearance.
   ------------------------------------------------------------ */

body.tour-details-page .related-packages-section .package-content > a.btn,
body.tour-details-page .related-package-link{
  position:relative !important;

  display:inline-flex !important;
  align-items:center !important;
  gap:.7em !important;
  align-self:flex-start !important;

  width:auto !important;

  margin:0 !important;
  padding:0 0 4px !important;

  background:transparent !important;
  color:var(--ink) !important;

  border:0 !important;
  border-radius:0 !important;

  box-shadow:none !important;

  font-family:var(--sans) !important;
  font-size:12.5px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;

  transform:none !important;

  transition:none !important;
}

body.tour-details-page .related-packages-section .package-content > a.btn::before,
body.tour-details-page .related-package-link::before{
  display:none !important;
}

body.tour-details-page .related-packages-section .package-content > a.btn::after,
body.tour-details-page .related-package-link::after{
  content:"" !important;

  position:absolute !important;
  left:0 !important;
  right:auto !important;
  top:auto !important;
  bottom:0 !important;
  z-index:auto !important;

  width:100% !important;
  height:1px !important;

  background:currentColor !important;

  transform:scaleX(1) !important;
  transform-origin:left !important;

  transition:transform .45s var(--ease) !important;
}

body.tour-details-page .related-packages-section .package-content > a.btn:hover,
body.tour-details-page .related-package-link:hover{
  background:transparent !important;
  color:var(--ink) !important;

  border:0 !important;

  transform:none !important;
  box-shadow:none !important;
}

body.tour-details-page .related-packages-section .package-content > a.btn:hover::after,
body.tour-details-page .related-package-link:hover::after{
  transform:scaleX(0) !important;
  transform-origin:right !important;
}


/* ------------------------------------------------------------
   RESPONSIVE — exact ZIP package listing breakpoints
   ------------------------------------------------------------ */

@media(max-width:980px){
  body.tour-details-page .related-packages-section .row.g-4,
  body.tour-details-page .related-packages-section .related-packages-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media(max-width:640px){
  body.tour-details-page .related-packages-section .row.g-4,
  body.tour-details-page .related-packages-section .related-packages-grid{
    grid-template-columns:1fr !important;
  }
}


/* ============================================================
   EXACT ZIP CARD MOTION — OTHER SCREENSHOT CARDS
   No layout/content changes; animation only.
   Source: page-package-detail.jsx .pd-card
   ============================================================ */

/* Premium Add-on Experiences */
body.tour-details-page .experiences-section .experience-card{
  transform:translateY(0) !important;

  transition:
    border-color .4s var(--ease),
    transform .4s var(--ease) !important;
}

body.tour-details-page .experiences-section .experience-card:hover{
  border-color:var(--accent) !important;

  transform:translateY(-4px) !important;

  box-shadow:none !important;
}


/* Hand-Picked Luxury Lodges & Camps */
body.tour-details-page .accommodation-section .lodge-card{
  transform:translateY(0) !important;

  transition:
    border-color .4s var(--ease),
    transform .4s var(--ease) !important;
}

body.tour-details-page .accommodation-section .lodge-card:hover{
  border-color:var(--accent) !important;

  transform:translateY(-4px) !important;

  box-shadow:none !important;
}


/* LinkU motion inside lodge cards */
body.tour-details-page .accommodation-section .view-details::after{
  transition:transform .45s var(--ease) !important;
}

body.tour-details-page .accommodation-section .view-details i{
  transition:transform .45s var(--ease) !important;
}

body.tour-details-page .accommodation-section .lodge-card:hover .view-details i{
  transform:translateX(5px) !important;
}


/* ============================================================
   REVEAL MOTION — same motion language as ZIP
   CSS-only because this PHP page has no Reveal JS component.
   ============================================================ */

@supports(animation-timeline:view()){

  body.tour-details-page .related-packages-section .section-header-center,
  body.tour-details-page .related-packages-section .related-package-card,
  body.tour-details-page .related-packages-section .package-card,
  body.tour-details-page .experiences-section .experience-card,
  body.tour-details-page .accommodation-section .lodge-card{
    animation-name:lu-pd-opacity,lu-pd-rise !important;
    animation-duration:1s,1.1s !important;
    animation-timing-function:var(--ease),var(--ease) !important;
    animation-fill-mode:both,both !important;

    animation-timeline:view(),view() !important;
    animation-range:entry 0% cover 22%,entry 0% cover 22% !important;
  }
}

@media(prefers-reduced-motion:reduce){

  body.tour-details-page .related-package-card,
  body.tour-details-page .related-packages-section .package-card,
  body.tour-details-page .experiences-section .experience-card,
  body.tour-details-page .accommodation-section .lodge-card{
    animation:none !important;
    transition:none !important;
    transform:none !important;
  }

  body.tour-details-page .related-package-image img,
  body.tour-details-page .related-packages-section .package-image img{
    transition:none !important;
    transform:none !important;
  }
}


/* ============================================================
   FINAL CARD MOTION POLISH
   ------------------------------------------------------------
   1. Remove duplicate generated EXPLORE MORE
   2. Prevent scroll-reveal transform from fighting hover transform
   3. Preserve exact ZIP package-card hover values
   4. Add correct internal card text spacing
   5. Apply the same smooth, non-conflicting motion logic to
      package, experience and lodge cards
   ============================================================ */


/* ============================================================
   01. REMOVE DUPLICATE "EXPLORE MORE"
   The real .section-label already exists in the HTML.
   ============================================================ */

body.tour-details-page
.related-packages-section
.section-heading::before{
  content:none !important;
  display:none !important;
}


/* Keep only the real ZIP-style eyebrow */
body.tour-details-page
.related-packages-section
.section-label{
  display:inline-flex !important;
  align-items:center !important;
  gap:.9em !important;

  margin:0 0 18px !important;

  font-family:var(--sans) !important;
  font-size:11.5px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.34em !important;
  text-transform:uppercase !important;

  color:var(--accent-deep) !important;
}

body.tour-details-page
.related-packages-section
.section-label::before{
  content:"" !important;

  width:26px !important;
  height:1px !important;

  background:var(--accent) !important;

  opacity:.7 !important;
}


/* ============================================================
   02. PACKAGE CARD — EXACT ZIP HOVER, WITHOUT TRANSFORM CONFLICT
   ============================================================ */

/*
   The card itself must NOT carry the scroll reveal transform.
   Its transform is reserved exclusively for the ZIP hover:
   translateY(0) -> translateY(-5px)
*/
body.tour-details-page .related-package-card,
body.tour-details-page .related-packages-section .package-card{
  animation:none !important;

  transform:translate3d(0,0,0) !important;

  transition:
    transform .5s var(--ease),
    box-shadow .5s var(--ease) !important;

  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

body.tour-details-page .related-package-card:hover,
body.tour-details-page .related-packages-section .package-card:hover{
  transform:translate3d(0,-5px,0) !important;

  box-shadow:
    0 30px 60px -34px rgba(33,28,21,.45) !important;
}


/* Exact ZIP image motion */
body.tour-details-page .related-package-image img,
body.tour-details-page .related-packages-section .package-image img{
  transform:scale(1) translateZ(0) !important;

  transition:transform 1.3s var(--ease) !important;

  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

body.tour-details-page
.related-package-card:hover
.related-package-image img,
body.tour-details-page
.related-packages-section
.package-card:hover
.package-image img{
  transform:scale(1.06) translateZ(0) !important;
}


/* ============================================================
   03. PACKAGE CARD INTERNAL SPACING
   Match ZIP .pkg-body rhythm.
   ============================================================ */

body.tour-details-page .related-package-content,
body.tour-details-page .related-packages-section .package-content{
  display:flex !important;
  flex:1 1 auto !important;
  flex-direction:column !important;

  gap:0 !important;

  padding:24px !important;
}


/* Badge is on image; title starts cleanly in body */
body.tour-details-page .related-package-content h3,
body.tour-details-page .related-packages-section .package-title{
  margin:0 !important;
}


/* Route/meta spacing below title */
body.tour-details-page .related-packages-section .package-route,
body.tour-details-page .related-package-content .related-package-route{
  margin:9px 0 16px !important;
}


/* Generic supporting paragraph spacing */
body.tour-details-page .related-package-content p,
body.tour-details-page .related-packages-section .package-content p{
  margin:9px 0 18px !important;

  line-height:1.65 !important;
}


/* Activities/list spacing */
body.tour-details-page .related-packages-section .package-activities,
body.tour-details-page .related-package-content ul{
  margin:0 0 22px !important;
}


/* View/details link sits clearly below preceding text */
body.tour-details-page
.related-packages-section
.package-content > a.btn,
body.tour-details-page .related-package-link{
  margin-top:auto !important;
}


/* ============================================================
   04. REVEAL ANIMATION FOR PACKAGE CARDS
   Animate the Bootstrap column wrapper, NOT the card.
   This mirrors the ZIP's separate Reveal wrapper + inner .pkg.
   ============================================================ */

@supports(animation-timeline:view()){

  body.tour-details-page
  .related-packages-section
  .row.g-4 > [class*="col-"]{
    animation-name:lu-pd-opacity,lu-pd-rise !important;
    animation-duration:1s,1.1s !important;
    animation-timing-function:var(--ease),var(--ease) !important;
    animation-fill-mode:both,both !important;

    animation-timeline:view(),view() !important;
    animation-range:
      entry 0% cover 22%,
      entry 0% cover 22% !important;
  }

  body.tour-details-page
  .related-packages-section
  .row.g-4 > [class*="col-"]:nth-child(2){
    animation-range:
      entry 4% cover 26%,
      entry 4% cover 26% !important;
  }

  body.tour-details-page
  .related-packages-section
  .row.g-4 > [class*="col-"]:nth-child(3){
    animation-range:
      entry 8% cover 30%,
      entry 8% cover 30% !important;
  }
}


/* ============================================================
   05. PREMIUM ADD-ON EXPERIENCE CARDS
   Exact ZIP pd-card hover behavior.
   Remove transform-based reveal from the card itself.
   ============================================================ */

body.tour-details-page
.experiences-section
.experience-card{
  animation:none !important;

  transform:translate3d(0,0,0) !important;

  transition:
    border-color .4s var(--ease),
    transform .4s var(--ease) !important;

  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

body.tour-details-page
.experiences-section
.experience-card:hover{
  border-color:var(--accent) !important;

  transform:translate3d(0,-4px,0) !important;

  box-shadow:none !important;
}


/* Add subtle body spacing without changing design */
body.tour-details-page
.experiences-section
.experience-card h4{
  margin:0 0 10px !important;
}

body.tour-details-page
.experiences-section
.experience-card p{
  margin:0 !important;
}


/* ============================================================
   06. LODGE CARDS
   Exact ZIP pd-card hover behavior.
   ============================================================ */

body.tour-details-page
.accommodation-section
.lodge-card{
  animation:none !important;

  transform:translate3d(0,0,0) !important;

  transition:
    border-color .4s var(--ease),
    transform .4s var(--ease) !important;

  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

body.tour-details-page
.accommodation-section
.lodge-card:hover{
  border-color:var(--accent) !important;

  transform:translate3d(0,-4px,0) !important;

  box-shadow:none !important;
}


/* Exact internal rhythm */
body.tour-details-page
.accommodation-section
.lodge-badge{
  margin-bottom:10px !important;
}

body.tour-details-page
.accommodation-section
.lodge-card h4{
  margin:0 0 10px !important;
}

body.tour-details-page
.accommodation-section
.lodge-card p{
  margin:0 0 18px !important;
}


/* Exact LinkU motion remains independent from card transform */
body.tour-details-page
.accommodation-section
.view-details::after{
  transition:transform .45s var(--ease) !important;
}

body.tour-details-page
.accommodation-section
.view-details i{
  transform:translateX(0) !important;

  transition:transform .45s var(--ease) !important;
}

body.tour-details-page
.accommodation-section
.lodge-card:hover
.view-details i{
  transform:translateX(5px) !important;
}


/* ============================================================
   07. CSS-ONLY REVEAL FOR EXPERIENCE + LODGE GRIDS
   Opacity-only on the card avoids fighting the hover transform.
   ============================================================ */

@supports(animation-timeline:view()){

  body.tour-details-page
  .experiences-section
  .experience-card,
  body.tour-details-page
  .accommodation-section
  .lodge-card{
    animation-name:lu-card-fade-only !important;
    animation-duration:1s !important;
    animation-timing-function:var(--ease) !important;
    animation-fill-mode:both !important;

    animation-timeline:view() !important;
    animation-range:entry 0% cover 22% !important;
  }
}

@keyframes lu-card-fade-only{
  from{opacity:0}
  to{opacity:1}
}


/* ============================================================
   08. REDUCED MOTION
   ============================================================ */

@media(prefers-reduced-motion:reduce){

  body.tour-details-page
  .related-packages-section
  .row.g-4 > [class*="col-"],
  body.tour-details-page
  .related-package-card,
  body.tour-details-page
  .related-packages-section
  .package-card,
  body.tour-details-page
  .experiences-section
  .experience-card,
  body.tour-details-page
  .accommodation-section
  .lodge-card{
    animation:none !important;
    transition:none !important;
  }

  body.tour-details-page .related-package-image img,
  body.tour-details-page .related-packages-section .package-image img{
    transition:none !important;
  }
}