/*!
 * DSL Adventures — hub and destination pages (page-templates/dsl-hub.php, inc/hubs.php).
 * One stylesheet shared by every hub and destination page. Components come from
 * dsl-design-system.css (tour card, destination card, accordion, CTA blocks, buttons); this file
 * only arranges them and adds the few hub pieces (comparison table, decision cards, facts, notes).
 * Elementor containers carry these classes with padding 0 and gap 0, so spacing comes from the
 * design tokens (same convention as dsl-home.css).
 */

/* ---------- 00. Elementor shells ---------- */
.dsl-hub .e-con{min-width:0}
.dsl-hub .e-con{flex-wrap:nowrap}
.dsl-hub .elementor-widget{margin-block:0}
.dsl-hub .dsl-section-head{width:100%}
.dsl-hub .dsl-section-head .dsl-el-lead{max-width:680px}
.dsl-hub-stack{display:flex;flex-direction:column;gap:var(--dsl-space-md)}
.dsl-hub-stack>.elementor-widget{width:100%}
.dsl-hub-split{display:grid;gap:clamp(28px,1.25rem + 3vw,64px);align-items:start}
@media (min-width:1025px){.dsl-hub-split{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}}
.dsl-hub-split>.elementor-widget,.dsl-hub-split>.e-con{width:100%}
.dsl-hub-flow{display:flex;flex-direction:column;gap:14px;max-width:72ch}
.dsl-hub-flow>.elementor-widget{width:100%}
.dsl-hub-flow>.dsl-hub-h3:not(:first-child){margin-top:18px}
.dsl-hub-h3 .elementor-heading-title{font-size:var(--dsl-fs-h4);line-height:1.3}
.dsl-hub-wide{max-width:none}
.dsl-hub-flow .dsl-section-head{margin-bottom:6px}
@media (min-width:1025px){.dsl-hub-split--even{grid-template-columns:repeat(2,minmax(0,1fr))}}
.dsl-hub-points{display:grid;gap:var(--dsl-space-md);grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));margin:0;padding:0;list-style:none}
.dsl-hub-points>li{display:grid;gap:8px;align-content:start;padding:2px 0 2px 18px;border-left:3px solid var(--dsl-accent)}
.dsl-hub-points h3{margin:0;font-size:var(--dsl-fs-h5);line-height:1.3}
.dsl-hub-points p{margin:0;color:var(--dsl-text-muted);line-height:1.55}

/* ---------- 01. Hero ---------- */
.dsl-hub-hero{position:relative;isolation:isolate;display:flex;min-height:clamp(460px,58vw,620px);color:#fff;overflow:hidden;background:var(--dsl-primary)}
.dsl-hub-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.dsl-hub-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(6,24,31,.9) 0%,rgba(6,24,31,.55) 48%,rgba(6,24,31,.3) 100%)}
.dsl-hub-hero::before{content:"";position:absolute;inset:0 0 auto;height:140px;z-index:-1;background:linear-gradient(rgba(6,24,31,.55),rgba(6,24,31,0))}
.dsl-hub-hero__inner{display:flex;flex-direction:column;justify-content:space-between;gap:clamp(40px,2rem + 4vw,96px);padding-block:clamp(14px,.6rem + 1vw,24px) clamp(36px,1.5rem + 3.5vw,80px)}
.dsl-hub-hero__body{display:grid;gap:16px;max-width:780px}
.dsl-hub-hero__body>*{margin:0}
.dsl-hub-hero__title{color:#fff}
.dsl-hub-hero__lead{font-size:var(--dsl-fs-lead);line-height:1.55;color:rgba(255,255,255,.92);max-width:60ch;text-wrap:pretty}
.dsl-hub-hero__actions{margin-top:8px;--dsl-cluster-gap:12px}
.dsl-hub-hero .dsl-breadcrumb ol,.dsl-hub-hero .dsl-breadcrumb a{color:rgba(255,255,255,.86)}
.dsl-hub-hero .dsl-breadcrumb a:hover{color:#fff}
.dsl-hub-hero .dsl-breadcrumb [aria-current="page"]{color:#fff}
.dsl-hub-hero--plain{min-height:0}
@media (min-width:1025px){.dsl-hub-hero::after{background:linear-gradient(90deg,rgba(6,24,31,.86) 0%,rgba(6,24,31,.58) 46%,rgba(6,24,31,.14) 100%)}}
@media (max-width:479.98px){.dsl-hub-hero__actions .dsl-btn{width:100%;white-space:normal}}

/* ---------- 02. Prose (Elementor text editor with class dsl-hub-prose) ---------- */
.dsl-hub-prose{max-width:72ch;color:var(--dsl-text)}
.dsl-hub-prose p{margin:0 0 1em}
.dsl-hub-prose>:last-child,.dsl-hub-prose .elementor-widget-container>:last-child{margin-bottom:0}
.dsl-hub-prose h3{margin:1.5em 0 .5em;font-size:var(--dsl-fs-h4)}
.dsl-hub-prose h3:first-child{margin-top:0}
.dsl-hub-prose ul{display:grid;gap:10px;margin:0 0 1em;padding:0;list-style:none}
.dsl-hub-prose ul>li{position:relative;padding-left:26px}
.dsl-hub-prose ul>li::before{content:"";position:absolute;left:3px;top:.6em;width:9px;height:9px;border-radius:2px;background:var(--dsl-accent)}
.dsl-hub-prose strong{color:var(--dsl-secondary)}
.dsl-hub-prose a,.dsl-hub-note a,.dsl-hub-choice p a,.dsl-compare td a,.dsl-hub-faq a{color:var(--dsl-primary);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;text-decoration-color:color-mix(in srgb,var(--dsl-primary) 45%,transparent)}
.dsl-hub-prose a:hover,.dsl-hub-note a:hover,.dsl-hub-choice p a:hover,.dsl-compare td a:hover,.dsl-hub-faq a:hover{color:var(--dsl-secondary);text-decoration-thickness:2px;text-decoration-color:currentColor}

/* ---------- 03. Tour lists ([dsl_tours], approved tour card) ---------- */
.dsl-hub-tours{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--dsl-space-md);margin:0;padding:0;list-style:none}
.dsl-hub-tours>li{min-width:0}
@media (min-width:600px){.dsl-hub-tours{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1025px){.dsl-hub-tours--grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1280px){.dsl-hub-tours--four{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- 04. Comparison table ([dsl_tour_compare]) ---------- */
.dsl-compare{width:100%}
.dsl-compare__table{width:100%;border-collapse:separate;border-spacing:0;font-size:.96875rem;line-height:1.5;background:var(--dsl-surface);border:1px solid var(--dsl-border);border-radius:var(--dsl-radius-lg);overflow:hidden}
.dsl-compare__caption{caption-side:top;margin-bottom:14px;text-align:left;font-family:var(--dsl-font-head);font-size:var(--dsl-fs-h4);font-weight:700;line-height:1.3;color:var(--dsl-secondary)}
.dsl-compare th,.dsl-compare td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--dsl-border)}
.dsl-compare thead th{background:var(--dsl-cream);font-family:var(--dsl-font-head);font-size:.78125rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--dsl-secondary);white-space:nowrap}
.dsl-compare tbody tr:last-child>*{border-bottom:0}
.dsl-compare tbody th{font-family:var(--dsl-font-head);font-weight:700;min-width:150px}
.dsl-compare tbody th a{color:var(--dsl-primary);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.dsl-compare tbody th a:hover{color:var(--dsl-secondary);text-decoration-thickness:2px}
.dsl-compare .dsl-compare__fact{white-space:nowrap}
/* Below desktop every row becomes a card with labeled values (no horizontal scroll). */
@media (max-width:1024.98px){
  .dsl-compare__table,.dsl-compare__table caption,.dsl-compare tbody,.dsl-compare tr,.dsl-compare th,.dsl-compare td{display:block}
  .dsl-compare__table{border:0;border-radius:0;background:none;overflow:visible}
  .dsl-compare thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .dsl-compare tbody{display:grid;gap:14px}
  .dsl-compare tbody tr{padding:4px 18px 6px;background:var(--dsl-surface);border:1px solid var(--dsl-border);border-radius:var(--dsl-radius-lg);box-shadow:var(--dsl-shadow-sm)}
  .dsl-compare tbody th{min-width:0;padding:14px 0 12px;font-size:1.0625rem;border-bottom:1px solid var(--dsl-border)}
  .dsl-compare td,.dsl-compare .dsl-compare__fact{display:grid;grid-template-columns:minmax(92px,32%) minmax(0,1fr);gap:12px;padding:10px 0;white-space:normal;border-bottom:1px dashed var(--dsl-border)}
  .dsl-compare td::before{content:attr(data-label);padding-top:2px;font-family:var(--dsl-font-head);font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dsl-text-muted)}
  .dsl-compare tbody tr>td:last-child{border-bottom:0}
  .dsl-section--cream .dsl-compare tbody tr,.dsl-section--alt .dsl-compare tbody tr{background:#fff}
}
@media (max-width:399.98px){.dsl-compare td,.dsl-compare .dsl-compare__fact{grid-template-columns:minmax(0,1fr);gap:2px}}

/* ---------- 05. Decision cards, facts and notes (HTML widgets) ---------- */
.dsl-hub-choices{display:grid;gap:var(--dsl-space-md);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));margin:0;padding:0;list-style:none}
.dsl-hub-choice{display:flex;flex-direction:column;gap:12px;padding:clamp(20px,1rem + 1vw,28px);background:var(--dsl-surface);border:1px solid var(--dsl-border);border-radius:var(--dsl-radius-lg);box-shadow:var(--dsl-shadow-sm)}
.dsl-hub-choice>*{margin:0}
.dsl-hub-choice__kicker{font-family:var(--dsl-font-head);font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--dsl-clay)}
.dsl-hub-choice__title{font-size:var(--dsl-fs-h4);line-height:1.3}
.dsl-hub-choice ul{display:grid;gap:8px;padding:0;list-style:none}
.dsl-hub-choice li{position:relative;padding-left:26px;line-height:1.5}
.dsl-hub-choice li::before{content:"";position:absolute;left:3px;top:.42em;width:11px;height:6px;border-left:2px solid var(--dsl-primary);border-bottom:2px solid var(--dsl-primary);transform:rotate(-45deg)}
.dsl-hub-choice .dsl-btn{margin-top:auto;align-self:flex-start;max-width:100%;white-space:normal;text-align:left}
.dsl-hub-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:12px;margin:0;padding:0}
.dsl-hub-facts>div{padding:16px 18px;background:var(--dsl-surface);border:1px solid var(--dsl-border);border-radius:var(--dsl-radius-lg)}
.dsl-hub-facts dt{margin:0 0 6px;font-family:var(--dsl-font-head);font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--dsl-clay)}
.dsl-hub-facts dd{margin:0;font-weight:600;line-height:1.4;color:var(--dsl-secondary)}
.dsl-hub-facts dd span{display:block;margin-top:4px;font-size:.875rem;font-weight:400;color:var(--dsl-text-muted)}
.dsl-hub-note{display:grid;gap:6px;max-width:72ch;padding:16px 20px;background:var(--dsl-cream);border-left:3px solid var(--dsl-accent);border-radius:0 var(--dsl-radius-md) var(--dsl-radius-md) 0;font-size:.96875rem;line-height:1.55}
.dsl-hub-note>*{margin:0}
.dsl-hub-note strong{color:var(--dsl-secondary)}
.dsl-section--cream .dsl-hub-note{background:#fff}

/* ---------- 06. FAQ ([dsl_faq]) and compact CTA ([dsl_plan_cta]) ---------- */
.dsl-hub-faq{max-width:880px}
.dsl-hub-faq__q{margin:0;font-family:var(--dsl-font-head);font-size:1.0625rem;font-weight:600;line-height:1.35;color:inherit}
.dsl-hub-faq .dsl-accordion__content p{margin:0 0 .8em;max-width:70ch}
.dsl-hub-faq .dsl-accordion__content p:last-child{margin-bottom:0}
.dsl-hub-cta{width:100%}
.dsl-hub-cta h3{margin:0}
@media (min-width:1025px){.dsl-hub-cta .dsl-cluster{flex:none;flex-wrap:nowrap}}

/* ---------- 07. Destination cards ([dsl_dest_cards]) ---------- */
.dsl-hub-dest{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--dsl-space-sm);margin:0;padding:0;list-style:none}
.dsl-hub-dest>li{min-width:0}
.dsl-hub-dest .dsl-dest-card{height:100%}
@media (max-width:599.98px){.dsl-hub-dest--pair,.dsl-hub-dest--three{grid-template-columns:minmax(0,1fr)}.dsl-hub-dest--pair .dsl-dest-card,.dsl-hub-dest--three .dsl-dest-card{aspect-ratio:4/3}}
@media (min-width:600px){.dsl-hub-dest--pair .dsl-dest-card{aspect-ratio:4/5}}
@media (min-width:768px){.dsl-hub-dest{gap:var(--dsl-space-md)}.dsl-hub-dest--pair .dsl-dest-card{aspect-ratio:16/11}}
@media (min-width:1025px){.dsl-hub-dest--three{grid-template-columns:repeat(3,minmax(0,1fr))}.dsl-hub-dest--grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:600px) and (max-width:1024.98px){.dsl-hub-dest--three>li:last-child{grid-column:1 / -1}.dsl-hub-dest--three>li:last-child .dsl-dest-card{aspect-ratio:16/7}}

/* ---------- 08. Closing band ---------- */
.dsl-hub-plan p{text-wrap:pretty}
.dsl-hub-plan__actions{justify-content:center}
@media (max-width:479.98px){.dsl-hub-plan__actions .dsl-btn{width:100%;white-space:normal}}
/* Travel Guides row (template-parts/hub/guides.php) */
.dsl-hub-guides .dsl-guide-rail{margin:0;padding-left:0;list-style:none}