/* Package price grid — season x group size x tier.
   Panels are all in the DOM; the tabs only toggle .is-on. */
.pg{--pg-navy:#0D1F3C;--pg-blue:#2563EB;--pg-gold:#B8860B;--pg-line:#E5E7EB;
    --pg-ink:#111827;--pg-soft:#6B7280;--pg-wash:#F9FAFB;
    max-width:1100px;margin:28px auto;padding:0 16px;color:var(--pg-ink);
    font-family:var(--gt-font-sans,'Plus Jakarta Sans',-apple-system,sans-serif);
    -webkit-font-smoothing:antialiased;
    /* The tab bar is sticky at 64/80px; without this an anchor jump to
       #package-pricing lands with the heading tucked underneath it. */
    scroll-margin-top:120px;}
.pg *{box-sizing:border-box;}
.pg-h{font-size:clamp(1.15rem,4vw,1.5rem);font-weight:700;letter-spacing:-0.015em;color:var(--pg-navy);margin:0 0 14px;}
.pg-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

.pg-tabs{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:16px;}
.pg-tab{background:#fff;border:1.5px solid var(--pg-line);border-radius:10px;padding:11px 18px;
        font-size:.9rem;font-weight:600;color:var(--pg-soft);cursor:pointer;min-height:46px;
        transition:all .18s;letter-spacing:-0.01em;}
.pg-tab:hover{border-color:#93B4F5;}
.pg-tab.is-on{border-color:var(--pg-blue);background:#EFF6FF;color:var(--pg-blue);}

.pg-box{border:1px solid var(--pg-line);border-radius:16px;padding:14px;background:#fff;}
@media(min-width:768px){.pg-box{padding:18px;}}
/* Grid, not flex: a flex row sizes each tab to its own text, so "Off-Season
   (Rest of the year)" ended up visibly shorter than the peak tab and left a gap
   at the end of the row. auto-fit keeps them equal however many seasons the
   config declares, and grid stretch keeps them the same HEIGHT when one label
   wraps to two lines and the other does not. */
.pg-seasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));
            gap:9px;margin-bottom:14px;align-items:stretch;}
.pg-season{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;
           text-align:center;background:var(--pg-wash);border:1.5px solid var(--pg-line);
           border-radius:10px;padding:10px 16px;font-size:.86rem;color:var(--pg-soft);cursor:pointer;
           min-height:46px;width:100%;transition:all .18s;}
.pg-season strong{color:inherit;font-weight:700;}
.pg-season.is-on{border-color:var(--pg-blue);background:#EFF6FF;color:var(--pg-blue);}
.pg-months{font-size:.78rem;opacity:.85;}

.pg-panel{display:none;}
.pg-panel.is-on{display:block;}
.pg-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.pg-tbl{width:100%;border-collapse:collapse;min-width:560px;}
.pg-cap{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
.pg-tbl th,.pg-tbl td{border:1px solid var(--pg-line);padding:13px 14px;text-align:center;vertical-align:middle;}
.pg-tbl tbody th[scope=row]{text-align:left;font-weight:700;color:var(--pg-ink);background:#fff;font-size:.88rem;}
.pg-sub{display:block;font-weight:500;font-size:.72rem;color:var(--pg-soft);}
.pg-th{background:var(--pg-wash);}
.pg-th--pop{background:#EFF6FF;}
.pg-tier{display:block;font-weight:700;font-size:.98rem;color:var(--pg-ink);letter-spacing:-0.01em;}
.pg-pop{display:inline-block;background:#DCFCE7;color:#166534;font-size:.62rem;font-weight:700;
        padding:2px 8px;border-radius:50px;margin-top:4px;letter-spacing:0.04em;}
.pg-blurb{display:block;font-size:.75rem;color:var(--pg-soft);font-weight:500;margin-top:3px;}
.pg-td--pop{background:#FAFCFF;}
.pg-total{display:block;font-size:1.15rem;font-weight:700;color:var(--pg-ink);font-variant-numeric:tabular-nums lining-nums;letter-spacing:-0.015em;}
.pg-save{display:block;font-size:.74rem;font-weight:700;color:#15803D;margin-top:3px;}
.pg-pp{font-size:1rem;font-weight:700;color:var(--pg-ink);font-variant-numeric:tabular-nums lining-nums;}
.pg-ppu{display:none;}
.pg-na{color:var(--pg-soft);font-size:.82rem;}
.pg-inc span{display:inline-block;font-size:.78rem;color:var(--pg-soft);margin:0 5px;white-space:nowrap;}
.pg-cta{background:var(--pg-blue);color:#fff;border:none;border-radius:9px;padding:11px 20px;
        font-size:.86rem;font-weight:700;cursor:pointer;min-height:46px;width:100%;transition:background .18s;letter-spacing:-0.01em;}
.pg-cta:hover{background:#1D4ED8;}
.pg-cta--pop{background:var(--pg-navy);}
.pg-cta--pop:hover{background:var(--pg-gold);}
.pg-note{display:flex;gap:8px;align-items:flex-start;background:var(--pg-wash);border:1px solid var(--pg-line);
         border-radius:10px;padding:11px 14px;margin:14px 0 0;font-size:.79rem;color:var(--pg-soft);line-height:1.6;}

/* ---------------------------------------------------------------------------
   Phones. The table used to carry min-width:520px, which on a 360px viewport
   guaranteed a horizontal scroll: the row-label column pushed Luxury off the
   right edge and the labels themselves were cut off on the left.

   The fix is to drop the row-label COLUMN rather than shrink everything. The
   three tier columns then divide the full width, and each row reads on its own:
   the big number is the total, the one marked "per person" is per person,
   "3 star" is the hotel. The row headers move out of the visual flow with the
   absolute+clip technique rather than display:none, so a screen reader still
   announces "Total Package" for the cell it is on.
   --------------------------------------------------------------------------- */
@media(max-width:640px){
  .pg{padding:0 12px;}
  .pg-h{margin-bottom:8px;font-size:1rem;}

  /* Group-size tabs on one row instead of wrapping to two — the table needs
     that vertical space. */
  .pg-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:12px;}
  .pg-tab{padding:8px 4px;font-size:.74rem;min-height:38px;text-align:center;}

  /* Season name on line one, window on line two: reads better in a narrow
     column and keeps the two tabs the same height. */
  .pg-seasons{gap:6px;margin-bottom:10px;}
  .pg-season{gap:5px;padding:6px 10px;font-size:.78rem;min-height:0;}
  .pg-season .pg-months{flex-basis:100%;}   /* icon + name on line 1, window on line 2 */
  .pg-months{font-size:.65rem;line-height:1.3;}

  .pg-box{padding:10px;}

  /* No sideways scroll, ever. */
  .pg-scroll{overflow-x:visible;}
  .pg-tbl{min-width:0;width:100%;table-layout:fixed;}

  /* Row labels: off-screen, still in the accessibility tree. An absolutely
     positioned cell leaves the table's layout, so the remaining three cells
     share the full width. */
  .pg-tbl thead th:first-child,
  .pg-tbl tbody th[scope=row]{width:0;padding:0;border:0;font-size:0;line-height:0;overflow:hidden;}
  .pg-tbl tbody th[scope=row] .pg-sub{font-size:0;}

  .pg-tbl th,.pg-tbl td{padding:7px 4px;}
  .pg-tier{font-size:.74rem;line-height:1.2;}
  .pg-blurb{display:none;}          /* "Best Balance of Comfort & Value" — no room, no loss */
  .pg-pop{font-size:.55rem;padding:1px 5px;margin-top:3px;}
  .pg-total{font-size:.95rem;}
  .pg-save{font-size:.6rem;margin-top:2px;line-height:1.25;}
  .pg-pp{font-size:.84rem;}
  .pg-ppu{display:block;font-size:.58rem;font-weight:600;color:var(--pg-soft);}
  .pg-na{font-size:.72rem;}
  .pg-inc span{display:block;font-size:.63rem;margin:1px 0;line-height:1.3;white-space:normal;}
  .pg-cta{padding:9px 4px;font-size:.72rem;min-height:40px;border-radius:8px;}
  .pg-note{padding:7px 9px;font-size:.63rem;margin-top:8px;line-height:1.4;}
}

/* Very narrow phones. One more notch down so nothing clips. */
@media(max-width:360px){
  .pg-tbl th,.pg-tbl td{padding:6px 2px;}
  .pg-tier{font-size:.7rem;}
  .pg-total{font-size:.85rem;}
  .pg-cta{font-size:.65rem;padding:8px 2px;}
}