/* land-trip.css: shared by every land trip page.
   Loaded before each page's own <style>; a page can override anything here.
   Edit here and every page in the family follows. */

/* RETRO PATCH: stitched-edge treatment, like an embroidered badge border */
.pricing-card, .cabin-tile, .proof-chip, .roster-full-card, .flight-card, .amenity-group, .stop-card{
  outline:1.5px dashed rgba(21,34,48,0.3);
  outline-offset:-6px;
  }
/* HERO */
.hero{position:relative;background-position:center 30%;background-size:cover;background-repeat:no-repeat;color:var(--white);padding:56px 0 40px}
.fact{padding:0 18px;border-left:1px solid var(--line-on-dark);}
.fact .value{font-weight:700;margin-top:3px;color:var(--white)}
.subnav-inner{display:flex;gap:4px;overflow-x:auto;padding:0;}
.stop-photo{flex:0 0 35%;width:35%;min-height:110px;border-radius:0;border:none;font-size:11px;}

@media (max-width:560px){
  .stop-photo{flex:0 0 auto;width:100%;aspect-ratio:16/8;min-height:0;}
}
.cabin-tile .cname{font-family:'Libre Baskerville',serif;font-weight:700}

.cabin-tile.sold-out .cname{opacity:.5;}
/* ===================== LAND TRIP TEMPLATE ===================== */
/* Every color on the page comes from the trip's THEME (set in the data). These rules
     replace the few colors the base template had hard-coded. */
.badge{background:color-mix(in srgb, var(--green) 18%, transparent);border-color:color-mix(in srgb, var(--green) 50%, transparent);color:var(--green-soft);}
.subnav{background:color-mix(in srgb, var(--white) 94%, transparent);}
.subnav a:hover, .subnav a.active{border-bottom-color:var(--green-dark);}
.fact .label{color:color-mix(in srgb, var(--white) 55%, var(--dark));}
.hero p.lede, section.dark-section .section-head p{color:color-mix(in srgb, var(--white) 82%, var(--dark));}
.overview p.lede, .faq-item .faq-a, .stop-desc{color:color-mix(in srgb, var(--dark) 82%, var(--white));}
.gn-link{color:color-mix(in srgb, var(--white) 75%, var(--dark));}
.gn-logo .gn-sans{color:var(--green);}
.stop:before{border-color:var(--green-dark);}
.rf-stat .r-num{color:var(--green-dark);}
.itin-note .in-icon{color:var(--gold-ink);}
.hero{background-color:var(--dark);}
.hero .hero-photo-label{position:absolute;top:14px;right:18px;font-size:11px;color:rgba(255,255,255,0.6);}
.hero p.lede{margin:0 0 4px;}
section[id]{scroll-margin-top:60px;}
/* departure switch in the hero (quiet, same look as the outline button) */
.hero-cta.dep-switch{align-items:stretch;gap:10px;margin-top:28px;}
.hp-field{
  position:relative;display:flex;flex-direction:column;justify-content:center;min-width:250px;
  padding:6px 38px 6px 14px;border:1.5px solid rgba(255,255,255,0.4);border-radius:4px;
  background:rgba(21,34,48,0.42);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);cursor:pointer;
  }
.hp-field:hover{border-color:var(--white);}
.hp-field:after{
  content:"";position:absolute;right:15px;top:50%;margin-top:-2px;pointer-events:none;
  border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid rgba(255,255,255,0.75);
  }
.hp-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--gold);line-height:1.3;}
.hero-cta .btn{display:inline-flex;align-items:center;}
@media (max-width:640px){
  .hp-field{flex:1 1 100%;min-width:0;}
  .hero-cta.dep-switch .btn{flex:1 1 100%;justify-content:center;}
}
/* CUSTOM DROPDOWN (replaces the browser's own option list on every segment picker) */
.cs{position:relative;display:block;min-width:0;}
.cs-native{position:absolute !important;opacity:0;pointer-events:none;width:1px !important;height:1px !important;}
.cs-btn{all:unset;box-sizing:border-box;display:block;width:100%;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:'Titillium Web',sans-serif;font-weight:700;color:var(--white);line-height:1.35}
.cs.flip .cs-list{left:auto;right:-15px;}
.cs-list{display:none;position:absolute;z-index:400;left:-15px;top:calc(100% + 8px);min-width:270px;margin:0;padding:4px;list-style:none;
  background:var(--white);border:1px solid var(--line);border-radius:4px;box-shadow:0 8px 24px rgba(10,18,26,0.18);}
.cs.open .cs-list{display:block;}
/* whatever holds an open list is lifted above later content (hero mountain edge, cards, etc.) */
.cs-host-open{position:relative;z-index:500 !important;}

.cs-opt{display:flex;align-items:center;gap:10px;border-radius:4px;cursor:pointer;outline:none;font-family:'Titillium Web',sans-serif;font-weight:600;color:var(--dark);white-space:nowrap}
.cs-opt:hover, .cs-opt:focus{background:var(--paper);}
.cs-opt[aria-selected="true"]{font-weight:700;}
.cs-opt .o-status{margin-left:auto;font-size:11.5px;font-weight:700;color:var(--muted);}
.cs-opt .o-status.soldout{color:var(--sunset-1);}
/* small "Showing:" pickers inside sections */
.mini-picker{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:-14px 0 24px;padding:10px 14px;
  background:var(--white);border:1.5px solid color-mix(in srgb, var(--gold) 55%, var(--white));border-radius:4px;font-size:14px;font-weight:700;}
.mini-picker .mp-label{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--gold-ink);}
.mini-picker .cs{display:inline-block;}
.mini-picker .cs-btn{
  font-size:14px;color:var(--dark);padding:7px 32px 7px 12px;border:2px solid var(--line);border-radius:4px;background:var(--white);position:relative;
  }
.mini-picker .cs-btn:after{
  content:"";position:absolute;right:12px;top:50%;margin-top:-2px;
  border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid var(--muted);
  }
.mini-picker .cs-btn:hover{border-color:var(--gold);}
.mini-picker .cs-list{left:0;top:calc(100% + 4px);}
.subnav-inner.subnav-split{overflow:visible;gap:12px;}
.subnav-links{display:flex;gap:4px;overflow-x:auto;flex:1;min-width:0;scrollbar-width:none;}
.subnav-links::-webkit-scrollbar{display:none;}
.subnav a.subnav-dep, .subnav a.subnav-dep:hover{flex:0 0 auto;white-space:nowrap;align-self:center;padding:6px 14px;border:none;border-radius:4px;
  background:var(--dark);color:var(--white);font-weight:700;font-size:13px;}
.subnav a.subnav-dep .chg{color:var(--gold);margin-left:6px;}
@media (max-width:600px){
  .subnav a.subnav-dep .dep-text{display:none;}
  .subnav a.subnav-dep .chg{margin-left:0;}
}
.fb-join{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 18px;margin-top:6px;font-size:14.5px;color:rgba(255,255,255,0.82);}
.fb-join:empty{display:none;}
.fb-join .btn{padding:10px 20px;font-size:14px;}
/* highlight cards */
.hl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px;}
.hl-card{background:var(--white);border:1px solid var(--line);border-radius:4px;overflow:hidden;}
.hl-card .photo-slot{aspect-ratio:16/10;border:none;border-radius:0;}
.hl-card h4{margin:14px 16px 4px}
.hl-card p{color:#4a4e55;margin:0 16px 16px}
@media (max-width:860px){
  .hl-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:560px){
  .hl-grid{grid-template-columns:1fr;}
}
/* itinerary note (sample / preview) */
.itin-note{display:flex;gap:12px;align-items:flex-start;background:color-mix(in srgb, var(--gold) 12%, var(--white));border:1px solid color-mix(in srgb, var(--gold) 45%, white);border-radius:4px;padding:12px 16px;margin:-8px 0 22px;color:var(--dark)}
.itin-note .in-icon{flex:0 0 auto;font-weight:800;}
.stop-meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--muted);margin:4px 0 6px;font-weight:600;}
.stop-desc{font-size:14px;color:#3c4048;margin:0;}
/* itinerary photos */
#itinBody .stop-photo{flex:0 0 32%;width:32%;min-height:150px;}
#itinBody .stop-photo span{color:var(--muted);}
@media (max-width:700px){
  #itinBody .stop-photo{width:100%;flex-basis:auto;aspect-ratio:16/9;min-height:0;}
}

/* stays */



/* food */




/* cost */
.cost-card{background:var(--white);border:1px solid var(--line);border-radius:4px;padding:28px;box-shadow:0 8px 30px rgba(36,40,48,0.06);}
.trav-row{display:flex;align-items:center;gap:14px;margin-bottom:22px;flex-wrap:wrap;}
.stepper{display:inline-flex;align-items:center;border:2px solid var(--line);border-radius:4px;overflow:hidden;}
.stepper button{background:none;border:none;width:40px;height:38px;font-weight:700;cursor:pointer;color:var(--dark)}
.stepper button:hover{background:var(--paper);}
.stepper span{min-width:34px;text-align:center;font-weight:700;}
.pay-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px;}
.pay-step{background:var(--paper);border-radius:4px;padding:12px 14px;color:var(--muted)}
.pay-step strong{display:block;color:var(--dark);font-size:15px;}
.late-note{margin-top:14px;background:var(--sunset-tint);border-radius:4px;padding:10px 14px;color:var(--dark)}
@media (max-width:700px){
  .pay-steps{grid-template-columns:1fr;}
}
/* terms */
#rosterCard, #rosterCard h3{color:var(--dark);}
.roster-full-placeholder h3{color:var(--dark);}
.faq-text ul{margin:8px 0;padding-left:20px;}
.faq-policy p{margin:0 0 8px;}
.hero .hero-photo-label{display:none;}


/* ITINERARY PHOTOS: the photo fills the space next to the text instead of
   setting the card's height, so every day card stays the size of its text
   (at least 180px tall on desktop) whatever the photo's shape. */
.stop-photo{position:relative;overflow:hidden;}
.stop-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
#itinBody .stop-photo{min-height:180px;}
@media (max-width:760px){ #itinBody .stop-photo{min-height:0;aspect-ratio:16/9;} }
/* the trip photo next to the overview text fills its box */
.overview-media img{width:100%;height:100%;object-fit:cover;display:block;}

/* photo credits for stock photos (free licenses need the author named) */
.photo-credits{margin-top:18px;font-size:12px;color:var(--muted);}
.photo-credits summary{cursor:pointer;display:inline-block;}
.photo-credits p{margin:8px 0 4px;}
.photo-credits ul{margin:0;padding-left:18px;line-height:1.6;}
.photo-credits a{color:inherit;}
