/* Trail location and itinerary pages: the page shell, the two-column body
   with its dark side panels, and the itinerary's own extras. Shared pieces
   (the hero, the panels, the feature cards, the stats) live in
   dea-modules.css; the route map is in itinerary-map.css. */
/* Hello Elementor caps .site-main at 1140 and narrower below through
   body:not([class*="elementor-page-"]) .site-main; the modules set their own
   1280 column, so this outranks it. */
body main.site-main.dea-listing-main { max-width: none; width: auto; margin: 0; padding: 0; }

.dea-tl {
  box-sizing: border-box;
  max-width: calc(var(--dea-max) + var(--dea-gutter) * 2);
  margin: 0 auto;
  padding: var(--dea-page-gap) var(--dea-gutter) 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--dea-page-gap);
}

/* ---------------- body grid ---------------- */
.dea-tl__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
@media (min-width: 1024px) {
  .dea-tl__grid { grid-template-columns: minmax(0, 1fr) 392px; gap: 48px; align-items: start; }
  .dea-tl__grid--single { grid-template-columns: minmax(0, 1fr); }
}
.dea-tl__main { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
.dea-tl__side { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-content: start; }

.dea-tl__h3, .dea-mod .dea-tl__h3 { margin: 0; font: var(--dea-type-h3); letter-spacing: var(--dea-track-head); color: var(--dea-text-heading); }

/* ---------------- intro ---------------- */
.dea-tl__introwrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.dea-tl__intro { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; font: var(--dea-type-body-md); color: var(--dea-text-body); }
.dea-tl__intro p { margin: 0; }
.dea-tl__intro > p:first-child { font: var(--dea-type-body-lg); }
.dea-tl__intro em, .dea-tl__intro i { font-style: italic; }

/* ---------------- must dos ---------------- */
.dea-tl__mustdos { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.dea-tl__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; }
.dea-tl__list > li { display: grid; gap: 4px; padding-left: 20px; border-left: 1px solid var(--dea-border-default); }
.dea-tl__itemname { font: var(--dea-type-title-sm); letter-spacing: var(--dea-track-title); color: var(--dea-text-strong); }
.dea-tl__itemname a { color: inherit; text-decoration: none; }
.dea-tl__itemname a:hover { color: var(--dea-text-link); }
.dea-aside .dea-tl__itemname { color: inherit; }
.dea-tl__itemtext { font: var(--dea-type-body-md); color: var(--dea-text-body); }

/* ---------------- map, in the main column ---------------- */
.dea-tl__map { aspect-ratio: 840 / 360; border-radius: var(--dea-radius-lg); }
@media (max-width: 1023px) { .dea-tl__map { aspect-ratio: 2 / 1; } }
@media (max-width: 767px) { .dea-tl__map { aspect-ratio: 343 / 260; } }

/* ---------------- drives through here ---------------- */
.dea-tl__itins { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.dea-tl__itinlist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
@media (max-width: 767px) { .dea-tl__itinlist { grid-template-columns: minmax(0, 1fr); gap: 16px; } }

/* ---------------- side panels ---------------- */
.dea-tl__acclist { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.dea-tl__acclist li { display: grid; gap: 2px; }
.dea-tl__itemnote { font: var(--dea-type-body-sm); font-style: italic; opacity: .85; }
.dea-tl__note { font: var(--dea-type-body-sm); }
.dea-tl__note p { margin: 0 0 8px; }
.dea-tl__note p:last-child { margin-bottom: 0; }
.dea-tl__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.dea-tl__extlink { color: var(--dea-text-accent); font: var(--dea-type-cta-md); text-decoration: none; }
.dea-tl__extlink:hover { text-decoration: underline; }

.dea-tl__back { margin: 0; }

/* ---------------- itinerary extras ---------------- */
.dea-it__glance {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 20px 48px;
  padding: 24px 32px;
  border-radius: var(--dea-radius-lg);
  background: var(--dea-bg-tint);
}
.dea-it__stats { display: flex; flex-wrap: wrap; gap: 24px 48px; }
@media (max-width: 767px) {
  .dea-it__glance { padding: 20px 24px; }
  .dea-it__stats { flex-direction: column; gap: 16px; }
}

.dea-it__about { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
.dea-it__intro { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; max-width: 880px; font: var(--dea-type-body-md); color: var(--dea-text-body); }
.dea-it__intro p { margin: 0; }
.dea-it__intro > p:first-child { font: var(--dea-type-body-lg); }
.dea-it__panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
@media (max-width: 767px) { .dea-it__panels { grid-template-columns: minmax(0, 1fr); gap: 16px; } }