/* ==========================================================================
   LU TRAVEL HA GIANG — sub-page styles
   Loaded only on sub-pages, after style.css. Reuses every token and component
   from style.css; this file adds the pieces the homepage doesn't need.
   ========================================================================== */

/* ---------- header: solid variant (no hero to sit on top of) ---------- */
.hdr--solid{position:sticky;background:#150D0A}
.hdr--solid .hdr__in::before{
  background:rgba(28,12,8,.92);border-color:rgba(255,235,207,.1);
}
.nav__list > li > a[aria-current=page],.nav__btn.is-current{opacity:1;color:var(--amber)}
.nav__list > li > a[aria-current=page]::after,.nav__btn.is-current::after{
  content:"";display:block;position:absolute;inset:auto 13px 4px;height:2px;background:var(--amber);
}
.nav__list > li{position:relative}

/* ---------- page hero ---------- */
.phero{position:relative;padding:clamp(48px,6vw,86px) 0 clamp(40px,5vw,64px);
  background:var(--dark);color:var(--cream);overflow:hidden;isolation:isolate}
.phero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.55}
.phero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(to right,rgba(20,10,6,.94) 0%,rgba(20,10,6,.6) 55%,rgba(20,10,6,.35) 100%),
    radial-gradient(70% 60% at 80% 10%,rgba(242,138,0,.2),transparent 70%);
}
.phero__in{position:relative;max-width:760px}
.phero h1{
  font:600 clamp(34px,5vw,60px)/1.02 var(--h-font);letter-spacing:-.03em;
  margin:0 0 16px;text-transform:uppercase;text-wrap:balance;
}
.phero__lede{font-size:clamp(16px,1.5vw,19px);line-height:1.7;color:rgba(255,235,207,.8);margin:0;max-width:60ch}
.phero__meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.phero__meta span{
  display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:var(--r);
  background:rgba(255,235,207,.1);border:1px solid rgba(255,235,207,.2);
  font:800 12px/1 var(--sub-font);letter-spacing:.06em;
}
.phero__meta b{color:var(--lime)}

/* breadcrumb */
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 20px;
  font:800 11.5px/1 var(--sub-font);letter-spacing:.14em;text-transform:uppercase}
.crumb a{color:rgba(255,235,207,.62);transition:color .2s}
.crumb a:hover{color:var(--orange)}
.crumb span{color:var(--amber)}
.crumb svg{width:12px;height:12px;opacity:.4;flex:0 0 auto}

/* ---------- generic section helpers ---------- */
.pad{padding:clamp(56px,7vw,104px) 0}
.pad--sm{padding:clamp(40px,5vw,68px) 0}
.bg-paper{background:var(--paper)}
.bg-cream{background:var(--cream)}
.bg-dark{background:var(--dark);color:var(--cream)}
.bg-forest{background:var(--forest);color:var(--cream)}
.bg-ink{background:var(--ink);color:var(--cream)}
.shead{max-width:62ch;margin-bottom:clamp(28px,3.5vw,44px)}
.shead--c{margin-inline:auto;text-align:center}
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,64px);align-items:center}
.two--wide{grid-template-columns:1.15fr .85fr}
.two--art img{width:100%;border-radius:var(--r)}

/* ---------- prose (Terms, Blog article, long copy) ---------- */
.prose{max-width:72ch;font-size:16.5px;line-height:1.78}
.prose > * + *{margin-top:1.1em}
.prose h2{font:600 clamp(24px,2.6vw,34px)/1.15 var(--h-font);letter-spacing:-.02em;margin-top:2em}
.prose h3{font:800 clamp(18px,1.9vw,22px)/1.3 var(--sub-font);margin-top:1.7em}
.prose ul,.prose ol{padding-left:1.3em;display:grid;gap:.5em}
.prose ul li{list-style:disc}
.prose ol li{list-style:decimal}
.prose a{color:var(--orange);text-decoration:underline;text-underline-offset:3px}
.prose strong{font-family:var(--sub-font);font-weight:800}
.prose blockquote{
  margin-inline:0;padding:20px 24px;border-left:4px solid var(--orange);
  background:rgba(255,101,3,.06);font-size:17.5px;
}
.prose blockquote p{margin:0}
.prose figure{margin:2em 0}
.prose figure img{width:100%;border-radius:var(--r)}
.prose figcaption{margin-top:10px;font-size:13.5px;color:var(--ink-soft)}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}

/* ---------- sticky in-page nav (Terms) ---------- */
.withside{display:grid;grid-template-columns:250px 1fr;gap:clamp(30px,4vw,64px);align-items:start}
.sidenav{position:sticky;top:110px}
.sidenav p{font:800 11.5px/1 var(--sub-font);letter-spacing:.16em;text-transform:uppercase;
  color:var(--amber);margin:0 0 14px}
/* no markers: the Terms section titles carry their own numbers */
.sidenav ol{display:grid;gap:2px;list-style:none;margin:0;padding:0}
.sidenav a{
  display:block;padding:9px 12px;border-left:2px solid var(--line);
  font-size:14.5px;color:var(--ink-soft);transition:all .22s var(--ease);
}
.sidenav a:hover{border-color:var(--orange);color:var(--ink);background:rgba(255,101,3,.05)}
.sidenav a.is-on{border-color:var(--orange);color:var(--orange);font-weight:600}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line)}
.stat{background:var(--paper);padding:clamp(22px,2.6vw,34px)}
.bg-dark .stat,.bg-forest .stat{background:transparent}
.stat b{display:block;font:600 clamp(30px,3.6vw,46px)/1 var(--h-font);letter-spacing:-.03em;color:var(--orange)}
.stat span{display:block;margin-top:8px;font:800 12px/1.4 var(--sub-font);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-soft)}
.bg-dark .stat span,.bg-forest .stat span{color:rgba(255,235,207,.6)}

/* ---------- cards grid (team, values, contact, destinations) ---------- */
.cards{display:grid;gap:clamp(16px,2vw,26px)}
.cards--2{grid-template-columns:repeat(2,1fr)}
.cards--3{grid-template-columns:repeat(3,1fr)}
.cards--4{grid-template-columns:repeat(4,1fr)}
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:clamp(20px,2.4vw,30px);
  transition:transform .3s var(--ease),box-shadow .3s,border-color .3s;
}
.bg-dark .card,.bg-forest .card,.bg-ink .card{
  background:rgba(255,235,207,.05);border-color:rgba(255,235,207,.14);
}
.card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -22px rgba(20,8,4,.4);border-color:var(--orange)}
.card__ico{
  display:grid;place-items:center;width:52px;height:52px;margin-bottom:16px;
  border-radius:var(--r);background:var(--cream);color:var(--orange);
}
.bg-dark .card__ico,.bg-forest .card__ico,.bg-ink .card__ico{
  background:rgba(255,101,3,.14);color:var(--amber);
}
.card__ico svg{width:26px;height:26px}
.card h3{font:800 18px/1.32 var(--sub-font);margin:0 0 8px}
.card p{margin:0;font-size:15px;line-height:1.65;color:var(--ink-soft)}
.bg-dark .card p,.bg-forest .card p,.bg-ink .card p{color:rgba(255,235,207,.7)}
.card a.link{margin-top:12px;display:inline-block}

/* photo card (team / destination) */
.pcard{border-radius:var(--r);overflow:hidden;background:#fff;border:1px solid var(--line)}
.pcard__img{position:relative;display:block;overflow:hidden}
.pcard__img img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .7s var(--ease)}
.pcard:hover .pcard__img img{transform:scale(1.05)}
.pcard__tag{
  position:absolute;top:12px;left:12px;padding:7px 13px;border-radius:var(--r);
  background:var(--orange);color:#fff;font:800 11px/1 var(--sub-font);letter-spacing:.1em;
}
.pcard__body{padding:20px}
.pcard__body h3{font:800 18px/1.3 var(--sub-font);margin:0 0 8px}
.pcard__body p{margin:0 0 12px;font-size:14.5px;line-height:1.6;color:var(--ink-soft)}
.pcard__role{font:800 12px/1 var(--sub-font);letter-spacing:.12em;text-transform:uppercase;color:var(--amber)}

/* ---------- filter chips ---------- */
.filters{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:clamp(24px,3vw,38px)}
.chip{
  padding:11px 20px;border:2px solid rgba(58,5,4,.16);border-radius:var(--r);
  font:800 12.5px/1 var(--sub-font);letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-soft);transition:all .25s var(--ease);
}
.chip:hover{border-color:var(--orange);color:var(--orange)}
.chip.is-on{background:var(--orange);border-color:var(--orange);color:#fff}
.chip b{opacity:.6;margin-left:6px;font-weight:800}
/* chips sitting on a dark band need the inverse borders */
.bg-ink .chip,.bg-dark .chip,.bg-forest .chip{
  border-color:rgba(255,235,207,.26);color:rgba(255,235,207,.74);
}
.bg-ink .chip:hover,.bg-dark .chip:hover,.bg-forest .chip:hover{border-color:var(--orange);color:var(--amber)}
.bg-ink .chip.is-on,.bg-dark .chip.is-on,.bg-forest .chip.is-on{
  background:var(--orange);border-color:var(--orange);color:#fff;
}

/* ---------- tour grid (reuses .tour from style.css) ---------- */
.tourgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.2vw,28px)}
.tourgrid .tour{min-height:420px}
.tour[hidden]{display:none}
.tour__link{position:absolute;inset:0;z-index:3}
.tour__link span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.tour__body{position:relative;z-index:4;pointer-events:none}
.tour__body a,.tour__body button{pointer-events:auto}

/* ---------- compare table ---------- */
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff}
table.cmp{width:100%;border-collapse:collapse;min-width:720px;font-size:14.5px}
table.cmp th,table.cmp td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--line)}
table.cmp thead th{
  background:var(--dark);color:var(--cream);
  font:800 12px/1.35 var(--sub-font);letter-spacing:.08em;text-transform:uppercase;
  position:sticky;top:0;
}
table.cmp tbody th{font:800 14px/1.4 var(--sub-font);color:var(--ink);background:rgba(58,5,4,.03);white-space:nowrap}
table.cmp tbody tr:last-child th,table.cmp tbody tr:last-child td{border-bottom:0}
table.cmp .yes{color:var(--olive);font-weight:800}
table.cmp .no{color:#b3543f}
table.cmp .pr{font:600 20px/1 var(--h-font);color:var(--orange)}

/* ---------- tour detail ---------- */
.tdetail{display:grid;grid-template-columns:1fr 366px;gap:clamp(30px,4vw,56px);align-items:start}
.tdetail__side{position:sticky;top:104px}
.bookcard{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  box-shadow:0 24px 50px -30px rgba(20,8,4,.35);
}
.bookcard__top{padding:24px;background:var(--dark);color:var(--cream)}
.bookcard__price{display:flex;align-items:flex-end;gap:10px;margin:0}
.bookcard__price b{font:600 42px/1 var(--h-font);letter-spacing:-.03em;color:#fff}
.bookcard__price span{font-size:14px;color:rgba(255,235,207,.66);padding-bottom:5px}
.bookcard__note{margin:10px 0 0;font-size:13.5px;color:rgba(255,235,207,.66)}
.bookcard__body{padding:22px 24px 26px;display:grid;gap:14px}
.bookcard ul{display:grid;gap:10px;font-size:14.5px}
.bookcard ul li{display:flex;gap:10px;align-items:flex-start}
.bookcard ul svg{width:17px;height:17px;flex:0 0 auto;margin-top:3px;color:var(--olive)}
.bookcard__pay{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:14px;
  border-top:1px solid var(--line);font-size:12.5px;color:var(--ink-soft);
}
.bookcard__pay b{font-family:var(--sub-font);font-weight:800;color:var(--ink)}

/* highlights */
.hl{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.hl li{display:flex;gap:13px;align-items:flex-start;font-size:15.5px;line-height:1.6}
.hl svg{width:20px;height:20px;flex:0 0 auto;margin-top:3px;color:var(--orange)}

/* itinerary */
.itin{display:grid;gap:12px;counter-reset:day}
.day{border:1px solid var(--line);border-radius:var(--r);background:#fff;overflow:hidden}
.day.is-open{border-color:var(--orange)}
.day__q{
  display:flex;align-items:center;gap:18px;width:100%;padding:20px 22px;text-align:left;
}
.day__n{
  flex:0 0 auto;display:grid;place-items:center;width:46px;height:46px;border-radius:var(--r);
  background:var(--cream);color:var(--orange);
  font:800 12px/1.15 var(--sub-font);letter-spacing:.04em;text-align:center;
  transition:background .3s,color .3s;
}
.day.is-open .day__n{background:var(--orange);color:#fff}
.day__t{flex:1;min-width:0}
.day__t b{display:block;font:800 17px/1.3 var(--sub-font)}
.day__t i{display:block;font-style:normal;margin-top:3px;font-size:13.5px;color:var(--ink-soft)}
.day__ico{
  flex:0 0 auto;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;
  border:1.5px solid var(--line);transition:transform .35s var(--ease),border-color .3s,color .3s;
}
.day__ico svg{width:16px;height:16px}
.day.is-open .day__ico{transform:rotate(180deg);border-color:var(--orange);color:var(--orange)}
.day__a{height:0;overflow:hidden;transition:height .4s var(--ease)}
.day__inner{padding:0 22px 24px 86px}
.day__inner p{margin:0 0 1em;font-size:15.5px;line-height:1.7;color:var(--ink-soft)}
.day__inner p:last-child{margin-bottom:0}
.day__stops{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 16px}
.day__stops span{
  padding:6px 12px;border-radius:var(--r);background:var(--cream);
  font:800 11.5px/1 var(--sub-font);letter-spacing:.05em;color:#7a4b1e;
}
.day__facts{display:flex;flex-wrap:wrap;gap:18px;padding-top:14px;border-top:1px solid var(--line);
  font-size:13.5px;color:var(--ink-soft)}
.day__facts b{font-family:var(--sub-font);font-weight:800;color:var(--ink)}

/* included / not included */
.incl{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2.6vw,36px)}
.incl h3{display:flex;align-items:center;gap:10px;font:800 16px/1 var(--sub-font);
  letter-spacing:.04em;text-transform:uppercase;margin:0 0 16px}
.incl h3 svg{width:22px;height:22px}
.incl ul{display:grid;gap:10px;font-size:15px;line-height:1.6}
.incl li{display:flex;gap:11px;align-items:flex-start}
.incl li svg{width:17px;height:17px;flex:0 0 auto;margin-top:3px}
.incl--yes h3,.incl--yes li svg{color:var(--olive)}
.incl--no h3,.incl--no li svg{color:#b3543f}

/* gallery */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.gal a{display:block;border-radius:var(--r);overflow:hidden}
.gal a:first-child{grid-column:span 2;grid-row:span 2}
.gal img{width:100%;height:100%;aspect-ratio:1;object-fit:cover;transition:transform .6s var(--ease)}
.gal a:first-child img{aspect-ratio:1}
.gal a:hover img{transform:scale(1.06)}

/* ---------- blog ----------
   Named .bfeat, not .feat — style.css already uses .feat for the homepage
   "why choose us" rows and the two would fight if both sheets ever load. */
.bfeat{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(24px,3vw,44px);align-items:center;
  padding-bottom:clamp(34px,4vw,54px);margin-bottom:clamp(34px,4vw,54px);
  border-bottom:1px solid rgba(255,235,207,.14)}
.bfeat__img{display:block;border-radius:var(--r);overflow:hidden}
.bfeat__img img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .7s var(--ease)}
.bfeat:hover .bfeat__img img{transform:scale(1.04)}
.bfeat h2{font:600 clamp(26px,3vw,40px)/1.12 var(--h-font);letter-spacing:-.025em;margin:14px 0 14px}
.bfeat h2 a:hover{color:var(--amber)}
.bfeat p{font-size:16px;line-height:1.7;color:rgba(255,235,207,.7)}
.pill{display:inline-block;padding:7px 14px;border-radius:var(--r);background:var(--orange);color:#fff;
  font:800 11px/1 var(--sub-font);letter-spacing:.1em}

.pager{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:clamp(36px,4vw,56px)}
.pager a,.pager span{
  display:grid;place-items:center;min-width:44px;height:44px;padding:0 12px;border-radius:var(--r);
  border:1px solid rgba(255,235,207,.2);font:800 14px/1 var(--sub-font);
  color:rgba(255,235,207,.7);transition:all .22s var(--ease);
}
.pager a:hover{border-color:var(--orange);background:var(--orange);color:#fff}
.pager .is-on{background:var(--orange);border-color:var(--orange);color:#fff}
.pager .off{opacity:.32;pointer-events:none}

/* article */
.art{max-width:none}
.art__head{max-width:760px;margin-inline:auto;text-align:center}
.art__meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;margin:0 0 8px;
  font-size:13.5px;color:rgba(255,235,207,.6)}
.art__hero{margin:clamp(26px,3vw,42px) 0 0;border-radius:var(--r);overflow:hidden}
.art__hero img{width:100%;aspect-ratio:16/8;object-fit:cover}
.art__body{max-width:72ch;margin-inline:auto}
.share{display:flex;align-items:center;gap:12px;margin-top:clamp(30px,3.5vw,48px);
  padding-top:24px;border-top:1px solid var(--line)}
.share p{margin:0;font:800 12px/1 var(--sub-font);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.share a{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r);
  border:1px solid var(--line);color:var(--ink);transition:all .22s var(--ease)}
.share svg{width:19px;height:19px}
.share a:hover{background:var(--orange);border-color:var(--orange);color:#fff}

/* ---------- destinations ---------- */
.dgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px)}
.dtile{position:relative;display:block;border-radius:var(--r);overflow:hidden;min-height:330px;
  background:var(--dark);isolation:isolate}
.dtile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;
  transition:transform .8s var(--ease)}
.dtile:hover img{transform:scale(1.07)}
.dtile::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(to top,rgba(10,6,3,.94) 6%,rgba(10,6,3,.5) 52%,rgba(10,6,3,.15) 100%)}
.dtile__body{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;
  padding:24px;color:#fff}
.dtile__n{font:800 11px/1 var(--sub-font);letter-spacing:.16em;color:var(--lime);margin:0 0 8px}
.dtile h3{font:600 22px/1.2 var(--h-font);letter-spacing:-.02em;margin:0 0 8px}
.dtile p{margin:0;font-size:14px;line-height:1.6;color:rgba(255,255,255,.8)}
.dtile__go{margin-top:14px;font:800 12px/1 var(--sub-font);letter-spacing:.1em;
  text-transform:uppercase;color:var(--amber)}

/* ---------- contact ---------- */
.cinfo{display:grid;gap:2px;background:var(--line)}
.cinfo li{background:#fff;padding:24px;display:flex;gap:16px;align-items:flex-start}
.cinfo__ico{flex:0 0 auto;display:grid;place-items:center;width:46px;height:46px;border-radius:var(--r);
  background:var(--cream);color:var(--orange)}
.cinfo__ico svg{width:22px;height:22px}
.cinfo b{display:block;font:800 12px/1 var(--sub-font);letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-soft);margin-bottom:6px}
.cinfo p{margin:0;font-size:16px;line-height:1.55}
.cinfo a{color:var(--ink)}
.cinfo a:hover{color:var(--orange)}
.formbox{background:#fff;border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(24px,3vw,40px)}

/* ---------- CTA band ---------- */
.cta{position:relative;overflow:hidden;isolation:isolate;text-align:center;
  padding:clamp(56px,7vw,96px) 0;background:var(--dark);color:var(--cream)}
.cta img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.4}
.cta::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(70% 70% at 50% 50%,rgba(20,10,6,.7),rgba(20,10,6,.94))}
.cta h2{font:600 clamp(30px,4vw,52px)/1.05 var(--h-font);letter-spacing:-.03em;margin:0 0 16px;
  text-transform:uppercase}
.cta p{max-width:56ch;margin:0 auto 28px;color:rgba(255,235,207,.8);font-size:17px}
.cta__btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}

/* ---------- notice (draft-content flag for the client) ---------- */
.notice{
  display:flex;gap:14px;align-items:flex-start;padding:18px 20px;border-radius:var(--r);
  background:rgba(242,138,0,.12);border-left:4px solid var(--amber);font-size:14.5px;line-height:1.6;
}
.notice svg{width:22px;height:22px;flex:0 0 auto;color:var(--amber);margin-top:1px}
.notice b{font-family:var(--sub-font);font-weight:800}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1100px){
  .tdetail{grid-template-columns:1fr}
  .tdetail__side{position:static}
  .bookcard{max-width:520px}
  .withside{grid-template-columns:1fr}
  .sidenav{position:static;padding-bottom:8px}
  .sidenav ol{display:flex;flex-wrap:wrap;gap:6px}
  .sidenav a{border-left:0;border:1px solid var(--line);border-radius:var(--r);padding:9px 14px}
}
@media (max-width:1024px){
  .nav__list > li > a[aria-current=page]::after{inset:auto auto 8px 4px;width:24px}
  .cards--4{grid-template-columns:repeat(2,1fr)}
  .dgrid,.cards--3{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .bfeat{grid-template-columns:1fr}
  .two,.two--wide{grid-template-columns:1fr}
  .gal{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:760px){
  /* the compare table has to scroll sideways on a phone — pin the row labels so
     you never lose track of which row you are reading, and show that it moves */
  .tablewrap{position:relative}
  .tablewrap::after{
    content:"Swipe to compare \2192";
    display:block;padding:10px 14px;border-top:1px solid var(--line);
    font:800 11px/1 var(--sub-font);letter-spacing:.14em;text-transform:uppercase;
    color:var(--amber);background:var(--cream);position:sticky;left:0;
  }
  table.cmp{min-width:620px}
  table.cmp th,table.cmp td{padding:12px 14px}
  table.cmp tbody th{position:sticky;left:0;z-index:1;
    box-shadow:1px 0 0 var(--line);background:#fdf9f0}
  table.cmp thead th:first-child{position:sticky;left:0;z-index:2}

  .tourgrid,.dgrid,.cards--2,.cards--3,.cards--4,.incl,.hl{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .gal{grid-template-columns:repeat(2,1fr)}
  .gal a:first-child{grid-column:span 2;grid-row:auto}
  .day__q{gap:13px;padding:16px 16px}
  .day__inner{padding:0 16px 20px 16px}
  .day__n{width:40px;height:40px;font-size:11px}
  .phero{padding-top:36px}
  .cinfo li{padding:18px}
}