/* Activity detail follows the approved Surya baseline; existing header/footer stay intact. */
html:has(.activity-page) { scroll-behavior: auto; }
.activity-page { background: var(--paper); }
.activity-page [hidden] { display: none !important; }
.activity-page button, .activity-page summary { -webkit-user-select: none; user-select: none; }
.activity-page :is(h1,h2,h3,p,figure) { margin: 0; }
.activity-page :is(h1,h2,h3) { overflow-wrap: anywhere; }
.activity-main { max-width: 1280px; margin: auto; padding: 12px clamp(16px,7.2vw,64px) 36px; }
.activity-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: var(--muted); font-size: 12px; margin-bottom: 6px; }
.activity-breadcrumb a { display: inline-flex; align-items: center; min-height: 28px; }
.activity-page h1 { font: 400 clamp(42px,5vw,64px)/1.08 var(--font-display); max-width: 22ch; text-wrap: balance; }
.activity-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; color: var(--muted); padding: 6px 0 12px; font-size: 14px; }
.activity-ratings { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 24px; padding-left: 20px; border-left: 1px solid var(--steel); }
.activity-rating { display: inline-flex; align-items: baseline; gap: 8px; min-height: 44px; padding: 10px 0; color: var(--slate-deep); text-decoration: none; }
.activity-rating strong { font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.activity-rating-scale { font-size: 13px; color: var(--muted); font-weight: 400; }
.activity-rating-source { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.activity-rating:hover .activity-rating-source { text-decoration-thickness: 2px; }
.activity-rating:focus-visible { outline: 3px solid var(--slate-deep); outline-offset: 4px; }
.activity-columns { display: grid; grid-template-columns: minmax(0,1.72fr) minmax(0,1fr); grid-template-areas: "overview booking"; gap: 28px; align-items: start; }
.activity-overview { grid-area: overview; min-width: 0; }
.activity-route-summary { scroll-margin-top: 20px; }
.activity-overview > .activity-route-summary { margin-top: 36px; }
.activity-opening { grid-area: opening; }
.activity-columns > .activity-booking, .activity-columns > [aria-hidden="true"] { grid-area: booking; }
.activity-columns > .activity-route-summary { grid-area: route; margin-top: 8px; }
.activity-columns > *, .activity-section > *, .activity-plan > * { min-width: 0; }
.activity-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; background: var(--slate-deep); color: var(--paper); padding: 18px 20px; margin: 0; }
.activity-facts dt { font-size: 12px; color: #d3dfe0; }
.activity-facts dd { font: 400 clamp(19px,2.25vw,28px)/1.2 var(--font-display); margin: 4px 0 0; }
.activity-package-guide { margin-top: 24px; }
.activity-page h2 { font: 400 clamp(30px,3.4vw,42px)/1.12 var(--font-display); text-wrap: balance; }
.activity-package-guide h2 { font-size: 26px; }
.activity-guide-rows { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 14px; }
.activity-guide-rows > div { padding: 18px; background: var(--ground); }
.activity-guide-rows h3 { font-size: 16px; margin-bottom: 6px; }
.activity-guide-rows p { font-size: 14px; line-height: 1.55; color: var(--muted); }
.activity-note { font-size: 12px; color: var(--muted); line-height: 1.6; max-width: 75ch; padding-top: 18px; }
.activity-booking h2 { font-size: clamp(28px,3.1vw,38px); margin-bottom: 16px; }
.activity-booking-stage { border: 0; padding: 0; margin: 0; min-width: 0; }
.activity-booking label { display: block; font-size: 14px; font-weight: 750; line-height: 1.4; }
.activity-booking :is(input, textarea) { width: 100%; min-width: 0; min-height: 48px; padding: 10px 12px; margin-top: 8px; border: 1px solid var(--slate-deep); border-radius: 0; background: var(--paper); color: var(--slate-deep); font: 400 16px/1.5 var(--font-body); }
.activity-booking input { color-scheme: light; }
.activity-booking input::placeholder { color: var(--muted); opacity: 1; }
.activity-booking :is(input, select, textarea):focus-visible { outline: 3px solid var(--slate-deep); outline-offset: 3px; }
.activity-booking [aria-invalid="true"] { border-color: var(--owner-error, #7b2f1c); }
.activity-date-control { margin-top: 12px; }
.activity-booking .activity-date-control label { font-size: 18px; }
.activity-booking .activity-booking-stage .activity-error { color: var(--owner-error, #7b2f1c); font-size: 13px; line-height: 1.5; margin-top: 6px; }
.activity-contact label { margin-top: 18px; }
.activity-contact textarea { resize: vertical; }
.activity-back { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0; margin-bottom: 8px; border: 0; background: transparent; color: var(--slate-deep); font: 750 14px/1.4 var(--font-body); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.activity-back:hover { text-decoration-thickness: 2px; }
.activity-back:focus-visible { outline: 3px solid var(--slate-deep); outline-offset: 4px; }
.activity-booking-status { color: var(--muted); font-size: 13px; line-height: 1.5; margin-top: 10px; }
.activity-message-panel { border-top: 1px solid var(--steel); margin-top: 18px; padding-top: 4px; }
.activity-message-panel summary { min-height: 44px; padding: 12px 0; font-size: 14px; font-weight: 750; cursor: pointer; }
.activity-message-panel textarea { min-height: 220px; resize: vertical; }
.activity-message-panel > p { color: var(--muted); font-size: 13px; line-height: 1.6; margin-top: 8px; }
.activity-message-actions { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 8px; }
.activity-message-actions :is(a, button) { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; background: transparent; color: var(--slate-deep); font: 750 14px/1.4 var(--font-body); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.activity-message-actions :is(a, button):hover { text-decoration-thickness: 2px; }
.activity-message-actions :is(a, button):focus-visible, .activity-message-panel summary:focus-visible { outline: 3px solid var(--slate-deep); outline-offset: 4px; }
.activity-booking .ride-options { border: 0; margin: 0; padding: 0; min-width: 0; }
.activity-booking .ride-options > legend { font: 700 14px/1.4 var(--font-body); padding: 0 0 10px; }
.activity-booking .package-heading { padding: 12px 0 8px; border: 0; display: block; background: transparent; }
.activity-booking .package-heading h3 { font: 750 16px/1.4 var(--font-body); }
.activity-booking .package-heading p { max-width: none; text-align: left; color: var(--muted); font-size: 12px; line-height: 1.5; margin-top: 4px; }
.activity-booking .package-heading--second { margin-top: 10px; }
.activity-booking .ride-option { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px 12px; min-height: 76px; padding: 10px 12px; border: 0; border-top: 1px solid var(--steel); background: transparent; color: var(--slate-deep); }
.activity-booking .ride-option[data-selected="true"] { background: var(--orange); }
.activity-booking .ride-option__name { font: 750 16px/1.3 var(--font-body); }
.activity-booking .ride-option__name small { display: inline; font-size: 12px; font-weight: 400; margin-left: 5px; }
.activity-booking .ride-option__price { grid-column: 1; grid-row: 2; text-align: left; white-space: normal; font: 700 14px/1.4 var(--font-body); }
.activity-booking .ride-option__price small { display: inline; color: inherit; font-size: 12px; font-weight: 400; }
.activity-booking .ride-quantity { grid-column: 2; grid-row: 1 / 3; width: auto; align-self: center; justify-self: end; display: grid; grid-template-columns: 44px 30px 44px; border: 1px solid var(--slate-deep); gap: 0; }
.activity-booking .ride-quantity button { width: 44px; min-height: 48px; border: 0; background: transparent; color: inherit; font-size: 22px; }
.activity-booking .ride-quantity output { min-width: 0; display: grid; place-items: center; padding: 0; font-size: 14px; font-weight: 750; font-variant-numeric: tabular-nums; }
.activity-booking button:disabled { opacity: .4; cursor: default; }
.activity-booking .ride-selection-note { display: block; padding: 14px 0; margin: 0; border: 0; }
.activity-booking .ride-selection-note strong { font: 750 14px/1.4 var(--font-body); }
.activity-booking .ride-selection-note p, .activity-booking .pickup-control p { text-align: left; font-size: 12px; line-height: 1.5; color: var(--muted); margin-top: 6px; }
.activity-booking .start-time-control { margin: 26px 0; }
.activity-booking .start-time-control label { display: block; font-size: 18px; line-height: 1.4; font-weight: 750; }
.activity-booking .start-time-control p { font-size: 13px; line-height: 1.5; color: var(--muted); }
.activity-booking .start-time-control .start-time-zone { margin-top: 4px; }
.activity-booking .start-time-control .start-time-note { margin-top: 8px; }
.activity-booking .start-time-control select:focus-visible { outline: 3px solid var(--slate-deep); outline-offset: 3px; }
.activity-booking .pickup-control { margin: 0; padding: 0; border: 0; }
.activity-booking .pickup-control label { display: block; font-size: 14px; font-weight: 700; }
.activity-booking select { width: 100%; min-width: 0; min-height: 48px; padding: 10px 12px; border: 1px solid var(--slate-deep); border-radius: 0; background: var(--paper); color: var(--slate-deep); font-size: 16px; margin-top: 8px; }
.activity-booking .fare-panel { position: static; margin: 24px 0 0; padding: 20px; background: var(--slate-deep); color: var(--paper); }
.activity-booking .fare-panel h3 { font: 750 15px/1.4 var(--font-body); }
.activity-booking .fare-panel__selection { margin: 8px 0 0; font-size: 12px; color: #d3dfe0; }
.activity-booking .fare-lines { margin: 16px 0 0; padding-top: 12px; }
.activity-booking .fare-lines > div { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: baseline; gap: 8px 16px; margin: 0; padding: 0 0 12px; border: 0; font-size: 12px; }
.activity-booking .fare-lines dt { color: #d3dfe0; line-height: 1.5; }
.activity-booking .fare-lines dd { margin: 0; font: 750 12px/1.5 var(--font-body); white-space: nowrap; font-variant-numeric: tabular-nums; }
.activity-booking .fare-total { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px; margin-top: 4px; padding: 16px 0 0; border-top: 1px solid var(--steel); }
.activity-booking .fare-total span { font-size: 13px; }
.activity-booking .fare-total strong { font: 400 28px/1.1 var(--font-display); }
.activity-booking .fare-panel__caveat { margin: 16px 0 0; font-size: 12px; line-height: 1.6; color: #d3dfe0; }
.activity-booking .fare-panel__status { margin: 12px 0 0; font-size: 12px; line-height: 1.6; color: #d3dfe0; }
.activity-booking .booking-preview-link { display: flex; align-items: center; justify-content: space-between; min-height: 48px; width: 100%; margin-top: 20px; padding: 12px 14px; border: 0; background: var(--orange); color: var(--slate-deep); font-size: 15px; font-weight: 750; }
.activity-booking button.booking-preview-link { cursor: pointer; text-align: left; font-family: var(--font-body); }
.activity-booking .booking-preview-link:hover { background: #f9864d; }
.activity-booking .booking-preview-link:focus-visible { outline: 3px solid var(--paper); outline-offset: 3px; }
.activity-section, .activity-plan, .activity-preparation { margin-top: 48px; }
.activity-section > p, .activity-faq-intro p { font-size: 14px; line-height: 1.6; color: var(--muted); margin-top: 10px; max-width: 65ch; }
.activity-track-stops { list-style: none; margin: 24px 0 0; padding: 0; }
.activity-track-stop { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 20px; min-width: 0; padding-bottom: 24px; }
.activity-track-stop:last-child { padding-bottom: 0; }
.activity-track-number { display: block; position: relative; color: var(--slate-deep); font: 400 24px/1.25 var(--font-display); font-variant-numeric: tabular-nums; }
.activity-track-stop:not(:last-child) .activity-track-number::after { content: ""; position: absolute; left: 6px; top: 36px; bottom: -8px; width: 1px; background: var(--steel); }
.activity-track-name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; }
.activity-track-name h3 { font: 750 18px/1.4 var(--font-body); }
.activity-track-copy p { color: var(--muted); font-size: 14px; line-height: 1.6; margin-top: 6px; }
.activity-track-premium { color: var(--slate-deep); font-size: 12px; font-weight: 650; line-height: 1.6; text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.activity-inclusions { background: var(--ground); padding: 28px 24px; }
.activity-inclusion-groups { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 40px; margin-top: 20px; }
.activity-inclusion-groups h3 { font: 750 16px/1.5 var(--font-body); }
.activity-inclusion-groups ul { padding-left: 20px; margin: 8px 0 0; }
.activity-inclusion-groups li { color: var(--muted); font-size: 14px; line-height: 1.6; margin-top: 6px; }
.activity-preparation { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 48px; padding: 36px 24px; background: var(--slate-deep); color: var(--paper); }
.activity-preparation h2 { font-size: clamp(28px,2.7vw,34px); margin-bottom: 20px; }
.activity-notes { margin: 0; }
.activity-notes > div + div { margin-top: 16px; }
.activity-notes dt { font-size: 14px; line-height: 1.4; font-weight: 750; }
.activity-notes dd { margin: 4px 0 0; color: #d3dfe0; font-size: 14px; line-height: 1.6; max-width: 65ch; }
.activity-plan { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 40px; align-items: start; }
.activity-location h3 { font-size: 16px; margin-top: 18px; }
.activity-location address { font-style: normal; font-size: 14px; line-height: 1.6; color: var(--muted); margin-top: 8px; }
.activity-location a, .activity-faq-help { display: inline-flex; align-items: center; min-height: 44px; gap: 8px; text-decoration: underline; font-size: 14px; font-weight: 650; margin: 6px 0 16px; }
.activity-location .place-section__map { width: 100%; height: 280px; margin: 0; border: 0; background: var(--ground); }
.activity-faq-list { border-top: 1px solid var(--steel); margin-top: 8px; }
.activity-faq-list details { border-bottom: 1px solid var(--steel); }
.activity-faq-list summary { padding: 14px 6px 14px 0; min-height: 48px; font-size: 15px; line-height: 1.45; font-weight: 750; cursor: pointer; overflow-wrap: anywhere; }
.activity-faq-list summary::marker { font-size: .75em; }
.activity-faq-list summary:hover { background: var(--ground); }
.activity-faq-answer { padding: 0 6px 16px 18px; max-width: 65ch; }
.activity-faq-answer p { font-size: 14px; line-height: 1.6; color: var(--muted); }
.activity-faq-answer a { text-decoration: underline; }
.activity-arrow { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; flex: none; }
.activity-related-grid { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); gap: 24px; margin-top: 20px; align-items: stretch; }
.activity-related-trip { border: 1px solid var(--steel); min-width: 0; display: flex; flex-direction: column; }
.activity-related-trip img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.activity-related-copy { padding: 20px; flex: 1; display: flex; flex-direction: column; }
.activity-related-copy > p { font-size: 13px; line-height: 1.6; color: var(--muted); }
.activity-related-copy h3 { font: 400 28px/1.18 var(--font-display); margin: 10px 0; }
.activity-related-copy .activity-related-bottom { margin-top: auto; padding-top: 20px; }
.activity-related-price { font-size: 18px; font-weight: 750; }
.activity-related-price small { font-size: 12px; font-weight: 400; }
.activity-related-action { display: flex; min-height: 48px; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid var(--steel); padding: 10px 14px; font-size: 14px; font-weight: 750; margin-top: 12px; }
.activity-related-lead .activity-related-action { background: var(--orange); border-color: var(--orange); }
.activity-related-side { display: grid; gap: 16px; }
.activity-related-side .activity-related-trip { display: grid; grid-template-columns: minmax(0,.75fr) minmax(0,1fr); }
.activity-related-side img { height: 100%; aspect-ratio: auto; }
.activity-related-side .activity-related-copy { padding: 16px; }
.activity-related-side h3 { font-size: 25px; }
.activity-page a:hover { text-decoration-thickness: 2px; }
.activity-page :focus-visible { outline: 3px solid var(--slate-deep); outline-offset: 3px; }
.activity-page .fare-panel :focus-visible, .activity-preparation :focus-visible { outline-color: var(--paper); }
@media (max-width: 1100px) {
  .activity-related-grid { grid-template-columns: minmax(0,1fr); }
  .activity-related-side { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
  .activity-related-side .activity-related-trip { display: flex; }
  .activity-related-side img { height: auto; aspect-ratio: 3 / 2; }
}
@media (max-width: 1023px) {
  .activity-columns { grid-template-areas: "overview" "booking"; }
  html[data-route-layout] .activity-columns { grid-template-areas: "opening" "booking" "route"; }
  html[data-route-layout] .activity-overview { display: contents; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .activity-columns { grid-template-columns: minmax(0,1fr); }
  .activity-booking { max-width: 640px; }
}
@media (max-width: 767px) {
  .activity-main { padding: 18px 20px 36px; }
  .activity-page h1 { font-size: clamp(38px,7.5vw,54px); }
  .activity-meta { display: block; padding: 10px 0 16px; }
  .activity-ratings { padding-left: 0; border-left: 0; gap: 0 20px; }
  .activity-columns { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .activity-booking h2 { font-size: 34px; }
  .activity-section, .activity-plan, .activity-preparation { margin-top: 36px; }
  .activity-track-stop { grid-template-columns: 24px minmax(0,1fr); gap: 16px; }
  .activity-inclusions { padding: 28px 20px; }
  .activity-inclusion-groups { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .activity-preparation { grid-template-columns: minmax(0,1fr); gap: 32px; padding: 28px 20px; }
  .activity-preparation > section + section { border-top: 1px solid var(--steel); padding-top: 28px; }
  .activity-plan { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .activity-location .place-section__map { height: 250px; }
  .activity-related-side { grid-template-columns: minmax(0,1fr); }
  .activity-booking .ride-quantity { grid-template-columns: 44px 30px 44px; }
  .activity-booking .ride-quantity button { width: 44px; min-height: 48px; }
}
@media (max-width: 380px) {
  .activity-main { padding-inline: 16px; }
  .activity-facts { padding: 16px 12px; gap: 12px; }
  .activity-facts dd { font-size: 18px; overflow-wrap: anywhere; }
  .activity-guide-rows { grid-template-columns: minmax(0,1fr); }
  .activity-booking .ride-option__name small { display: block; margin-left: 0; }
  .activity-booking .ride-option__price { white-space: nowrap; }
  .activity-booking .ride-option__price small { display: block; }
  .activity-booking .fare-panel { padding: 16px; }
  .activity-booking .fare-lines > div { grid-template-columns: minmax(0,1fr); gap: 4px; }
  .activity-booking .fare-lines dd { text-align: left; }
}