/* GuavaXP Packages — front-end (inherits theme fonts) */
.gxPkg{ color: var(--gx-ink); }
.gxPkg *{ box-sizing:border-box; }

.gxPkg__wrap{ max-width:1120px; margin:0 auto; padding:0 14px; }

/* Full-bleed helper */
.gxPkg__bleed{
  position:relative;
  left:50%;
  right:50%;
  width:100vw;
  margin-left:-50vw;
  margin-right:-50vw;
}

/* =========================
   HERO (Desktop background)
========================= */
.gxPkg__hero{
  position:relative;
  min-height:410px;
  background-size:cover;
  background-position:50% 50%;
  background-repeat:no-repeat;
  background-color:#111; /* fallback */
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}

/* Desktop overlay gradient */
.gxPkg__hero::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.78) 0%, rgba(0,0,0,.30) 55%, rgba(0,0,0,.10) 100%);
  pointer-events:none;
}

.gxPkg__heroTop{
  position:relative;
  padding:68px 0 22px;
}
.gxPkg__heroTop--left{ text-align:left; }
.gxPkg__heroTop--left .gxPkg__kicker{ justify-content:flex-start; }

.gxPkg__kicker{
  display:flex;
  align-items:center;
  gap:12px;
  color:rgba(255,255,255,.85);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:12px;
}
.gxPkg__kLine{ width:56px; height:2px; background:var(--gx-accent); }

.gxPkg__title{
  position:relative;
  margin:14px 0 8px;
  color:#fff;
  font-weight:800;
  font-size:clamp(32px, 4.6vw, 60px);
  line-height:1.06;
}
.gxPkg__subtitle{
  position:relative;
  margin:0;
  color:rgba(255,255,255,.84);
  max-width:760px;
  font-size:16px;
  line-height:1.5;
}

/* =========================
   HERO (Mobile uses <img>)
========================= */
.gxPkg__heroMedia{ display:none; }
.gxPkg__heroTextDesktop{ display:block; }

@media (max-width:980px){
  /* Disable background-image on mobile to avoid double images */
  .gxPkg__hero{
    background-image:none !important;
    min-height:auto;
  }
  .gxPkg__hero::before{ display:none; }

  .gxPkg__heroMedia{
    display:block;
    position:relative;
    width:100%;
    height:38vh;
    min-height:240px;
    max-height:340px;
    overflow:hidden;
    background:#111;
  }

  /* Fix “blue strip” + remove inline image gaps */
  .gxPkg__heroMedia img{
    display:block;
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:50% 60%;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
  }

  .gxPkg__heroOverlay{
    position:absolute;
    left:0; right:0; bottom:0;
    padding:14px 0 16px;
    background:linear-gradient(to top, rgba(0,0,0,.82), rgba(0,0,0,0));
  }

  .gxPkg__heroTextDesktop{ display:none; }

  /* smaller typography on phones */
  .gxPkg__title{
    font-size:clamp(26px, 7vw, 38px);
    margin:10px 0 6px;
  }
  .gxPkg__subtitle{ font-size:14px; }
}

/* =========================
   SNAPSHOT BAR
========================= */
.gxPkg__bar{
  position:relative;
  background:var(--gx-primary);
  border-top:1px solid rgba(255,255,255,.12);
}

.gxPkg__barGrid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr)) 260px;
  gap:0;
  align-items:center;
  min-height:92px;
}

.gxPkg__barItem{
  padding:14px 16px;
  border-right:1px solid rgba(255,255,255,.14);
}
.gxPkg__barLabel{
  color:rgba(255,255,255,.72);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:12px;
  margin-bottom:8px;
}
.gxPkg__barValue{
  color:#fff;
  font-weight:800;
  font-size:20px;
  line-height:1.15;
  margin-bottom:4px;
}
.gxPkg__barSub{ color:rgba(255,255,255,.72); font-size:13px; }

.gxPkg__barCTA{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
}

/* Fix: button background must fully cover text */
.gxPkg__barBtn{
  width:100%;
  max-width:240px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;

  background:var(--gx-accent);
  color:#111;
  border:1px solid rgba(0,0,0,.20);
  text-decoration:none;

  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;

  padding:12px 14px;
  font-size:14px;
  line-height:1.1;

  white-space:nowrap;
}
.gxPkg__barBtn:hover{ filter:brightness(.98); }

@media (max-width:980px){
  .gxPkg__barGrid{ grid-template-columns:1fr; min-height:auto; }
  .gxPkg__barItem{
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.12);
    padding:12px 14px;
  }
  .gxPkg__barCTA{ padding:12px 14px; }
  .gxPkg__barBtn{ max-width:100%; }
}

/* =========================
   TABS (table style, no rounding)
========================= */
.gxPkg__tabsWrap{
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:0;
  border:1px solid rgba(0,0,0,.14);
  background:#fff;
}

.gxPkg__tab{
  appearance:none;
  border:0;
  border-radius:0;
  background:#f3f4f6;
  color:rgba(0,0,0,.62);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  padding:14px 12px;
  cursor:pointer;
  line-height:1.1;
}
.gxPkg__tab + .gxPkg__tab{ border-left:1px solid rgba(0,0,0,.14); }
.gxPkg__tab.is-active{ background:#0b2239; color:#fff; }

@media (max-width:980px){
  .gxPkg__tabsWrap{ grid-template-columns:repeat(3, minmax(0,1fr)); margin-top:16px; }
  .gxPkg__tab{
    padding:12px 8px;
    font-size:12px;
    letter-spacing:.06em;
    white-space:nowrap;
  }
}
@media (max-width:420px){
  .gxPkg__tab{ font-size:11px; padding:12px 6px; }
}

/* =========================
   PANELS + TEXT
========================= */
.gxPkg__panel{ display:none; padding:18px 0 30px; }
.gxPkg__panel.is-active{ display:block; }

.gxPkg__h2{ margin:0 0 14px; font-size:26px; }
.gxPkg__h3{ margin:0 0 10px; font-size:16px; }

.gxPkg__bullets{
  margin:0;
  padding-left:20px;
  font-size:18px;
  line-height:1.75;
}
.gxPkg__bullets li{ margin:10px 0; }
.gxPkg__bullets b{ font-weight:900; }

.gxPkg__card{
  border:1px solid var(--gx-line);
  background:#fff;
  padding:14px;
}

/* Highlights: true 2-column split (6/6 or 7/6) */
.gxPkg__hl2col{
  display:block; /* mobile = stacked */
}

@media (min-width: 980px){
  .gxPkg__hl2col{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items:start;
  }
  .gxPkg__hl2col .gxPkg__hlCol{
    margin:0;
  }
}

/* =========================
   ITINERARY (table style, minimal lines)
========================= */
.gxPkg__itinTbl{
  border-top:1px solid rgba(0,0,0,.12);
  border-bottom:1px solid rgba(0,0,0,.12);
  background:#fff;
}
.gxPkg__itinRow{ border-top:1px solid rgba(0,0,0,.12); }

.gxPkg__itinHead{
  display:grid;
  grid-template-columns:140px 1fr 56px;
  gap:14px;
  align-items:center;
  padding:18px 14px;
  cursor:pointer;
  user-select:none;
}

.gxPkg__itinDay{ font-weight:900; font-size:20px; line-height:1.1; }
.gxPkg__itinTitle{ font-weight:900; font-size:20px; line-height:1.2; }
.gxPkg__itinSub{
  margin-top:6px;
  color:var(--gx-muted);
  font-size:15px;
  line-height:1.5;
}

.gxPkg__itinRight{ display:flex; justify-content:flex-end; }

.gxPkg__itinCaret{
  width:12px; height:12px;
  border-right:2px solid rgba(0,0,0,.55);
  border-bottom:2px solid rgba(0,0,0,.55);
  transform:rotate(45deg);
}
.gxPkg__itinRow.is-open .gxPkg__itinCaret{ transform:rotate(-135deg); }

.gxPkg__itinBody{ padding:0 14px 18px; }

.gxPkg__itinHero{
  display:block;
  border:1px solid rgba(0,0,0,.12);
  background:#f3f4f6;
  overflow:hidden;
}
.gxPkg__itinHero img{
  display:block;
  width:100%;
  height:180px;
  object-fit:cover;
}

.gxPkg__itinMetaRow{
  margin-top:12px;
  display:grid;
  grid-template-columns:1fr 1fr 160px;
  gap:12px;
  align-items:start;
  font-size:14px;
}

.gxPkg__itinThumb{
  display:block;
  border:1px solid rgba(0,0,0,.12);
  background:#f3f4f6;
  overflow:hidden;
}
.gxPkg__itinThumb img{
  display:block;
  width:100%;
  height:90px;
  object-fit:cover;
}

@media (max-width:980px){
  .gxPkg__itinHead{
    grid-template-columns:120px 1fr 44px;
    padding:16px 12px;
  }
  .gxPkg__itinTitle{ font-size:18px; }
  .gxPkg__itinHero img{ height:160px; }
  .gxPkg__itinMetaRow{ grid-template-columns:1fr; }
  .gxPkg__itinThumb img{ height:140px; }
}

/* Booking */
.gxPkg__booking{
  border:1px solid var(--gx-line);
  background:#fff;
  padding:14px;
}

/* FAQ (table-style accordion, clean spacing, no rounding) */
.gxPkg__faqTbl{
  border-top:1px solid var(--gx-line);
  border-bottom:1px solid var(--gx-line);
  background:#fff;
}

.gxPkg__faqRow{
  border-top:1px solid var(--gx-line);
  background:#fff;
  transition:background .18s ease;
}
.gxPkg__faqRow:hover{ background:#f8fafc; }
.gxPkg__faqRow.is-open{ background:#f3f4f6; }

.gxPkg__faqHead{
  display:grid;
  grid-template-columns: 1fr 56px;
  gap:12px;
  align-items:center;
  padding:16px 14px; /* FIX: horizontal padding */
  cursor:pointer;
  user-select:none;
}

.gxPkg__faqQ{
  font-weight:900;
  color:var(--gx-ink);
  line-height:1.25;
  font-size:18px;
}

.gxPkg__faqIcon{
  width:44px;
  height:44px;
  border:1px solid var(--gx-line);
  display:flex;
  align-items:center;
  justify-content:center;
  justify-self:end;
  background:#fff;
}

.gxPkg__faqIcon:before{
  content:"";
  width:10px;height:10px;
  border-right:2px solid rgba(0,0,0,.55);
  border-bottom:2px solid rgba(0,0,0,.55);
  transform:rotate(45deg);
  transition:transform .18s ease;
}

.gxPkg__faqRow.is-open .gxPkg__faqIcon:before{
  transform:rotate(-135deg);
}

.gxPkg__faqBody{
  padding:0 14px 16px; /* FIX: horizontal padding */
  color:rgba(0,0,0,.78);
  line-height:1.7;
  font-size:16px;
}