/* Andes Tours: layout and components. Colors and fonts come from variables that each skin
   (assets/skins/*.css) sets, so the four sites share this file and still look different.
   Selectors start with .atb and are specific enough to beat Hello Elementor's resets
   (pink buttons, grey inputs) and Elementor's global kit styles. */
.atb, #site-header, #site-footer {
  --atb-bg: #F7F7F5; --atb-paper: #FFFFFF; --atb-sand: #ECEAE4; --atb-ink: #1E2226; --atb-ink-2: #3A4148;
  --atb-accent: #2F6E5B; --atb-accent-dark: #245647; --atb-accent-soft: #E3EFEA; --atb-gold: #D6A13E;
  --atb-ok: #2F6E5B; --atb-no: #A3420F; --atb-muted: #646B72; --atb-line: #E1E3E2; --atb-r: 16px;
  --atb-shadow: 0 1px 2px rgb(0 0 0 / .05), 0 12px 30px rgb(0 0 0 / .08);
  --atb-f-head: Georgia, serif; --atb-f-body: system-ui, sans-serif;
  color: var(--atb-ink); font-family: var(--atb-f-body); font-size: 17px; line-height: 1.65;
}
.atb *, .atb *::before, .atb *::after { box-sizing: border-box; }
.atb [hidden] { display: none !important; }
.atb img { max-width: 100%; height: auto; display: block; }
.atb p { margin: 0; }
.atb h1, .atb h2, .atb h3 { font-family: var(--atb-f-head); font-weight: 600; color: var(--atb-ink); line-height: 1.15; letter-spacing: -.01em; margin: 0; }
.atb a { color: inherit; text-decoration: none; }
.atb .atb-wrap { max-width: 1180px; margin: 0 auto; padding: 0 22px; }

/* Tour page */
.atb-tp { background: var(--atb-bg); padding-bottom: 72px; }
.atb .atb-crumbs { font-size: .88rem; color: var(--atb-muted); padding-top: 26px; }
.atb .atb-crumbs a:hover { color: var(--atb-accent); }
.atb .atb-title { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.2rem); margin: 12px 0 14px; max-width: 22ch; }
.atb .atb-chips { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 0; padding: 0; }
.atb .atb-chips li { background: var(--atb-paper); border: 1px solid var(--atb-line); border-radius: 999px; padding: 6px 14px; font-size: .88rem; font-weight: 700; color: var(--atb-ink-2); }
/* Tour photos: a slider (the strip, arrows and dots are styled with the cards below); a tap opens the lightbox */
.atb .atb-gallery { position: relative; margin: 28px 0 8px; height: clamp(260px, 40vw, 520px); border-radius: 18px; overflow: hidden; background: var(--atb-sand); }
.atb .atb-gallery .atb-track > a { position: relative; cursor: zoom-in; }
.atb .atb-gallery img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.atb .atb-gallery .atb-car-btn, .atb .atb-gallery .atb-car-btn:hover, .atb .atb-gallery .atb-car-btn:focus { width: 46px; height: 46px; font-size: 30px; }
.atb .atb-gallery .atb-car-prev { left: 16px; }
.atb .atb-gallery .atb-car-next { right: 16px; }
.atb .atb-gallery .atb-dots { bottom: 16px; }

.atb .atb-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 52px; align-items: start; margin-top: 36px; }
.atb .atb-main { display: grid; gap: 44px; min-width: 0; }
.atb .atb-main h2 { font-size: 1.7rem; margin-bottom: 16px; }
.atb .atb-lead { font-size: 1.12rem; color: var(--atb-ink-2); margin-bottom: 12px; }
.atb .atb-content { color: var(--atb-muted); }
.atb .atb-content > * { margin: 0 0 14px; }
@media (max-width: 980px) { .atb .atb-grid { grid-template-columns: minmax(0, 1fr); gap: 36px; } }

/* Itinerary like Ecuador Ascents: no numbers, a pin on a dotted line, the title, then the full program */
.atb .atb-itin { display: grid; }
.atb .atb-itin-intro { margin-bottom: 8px; }
.atb details.atb-step { position: relative; padding-left: 64px; border-bottom: 1px solid var(--atb-line); }
.atb details.atb-step::before { content: ""; position: absolute; left: 21px; top: 0; bottom: 0; border-left: 2px dashed var(--atb-line); }
.atb details.atb-step:first-child::before { top: 34px; }
.atb details.atb-step:last-child::before { bottom: calc(100% - 34px); }
.atb details.atb-step:only-child::before { display: none; }
.atb details.atb-step summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 22px 0; }
.atb details.atb-step summary::-webkit-details-marker { display: none; }
.atb .atb-pin { position: absolute; left: 0; top: 13px; width: 44px; height: 44px; border-radius: 50%; background: var(--atb-accent); color: #fff; display: grid; place-items: center; }
.atb .atb-pin svg { width: 22px; height: 22px; }
.atb details.atb-step summary b { font-family: var(--atb-f-head); font-size: 1.15rem; color: var(--atb-ink); font-weight: 600; line-height: 1.3; }
.atb details.atb-step summary i { flex: none; width: 10px; height: 10px; border-right: 2px solid var(--atb-accent); border-bottom: 2px solid var(--atb-accent); transform: rotate(45deg); margin-right: 6px; transition: transform .2s; }
.atb details.atb-step[open] summary i { transform: rotate(225deg); }
.atb .atb-step-txt { padding: 0 0 22px; color: var(--atb-muted); }
.atb .atb-step-txt > * { margin: 0 0 12px; }
.atb .atb-step-txt > :last-child { margin-bottom: 0; }
.atb .atb-step-txt strong, .atb .atb-step-txt b { color: var(--atb-ink); }
.atb .atb-step-txt ul, .atb .atb-step-txt ol { padding-left: 1.2em; }

/* Tour page: a menu of its sections under the site header (Home, Overview, Itinerary, Price, Included, FAQs) */
.atb .atb-tnav { position: sticky; top: 0; z-index: 40; background: var(--atb-paper); border-bottom: 1px solid var(--atb-line); }
.admin-bar .atb .atb-tnav { top: 32px; }
@media (max-width: 782px) { .admin-bar .atb .atb-tnav { top: 0; } }
.atb .atb-tnav .atb-wrap { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.atb .atb-tnav .atb-wrap::-webkit-scrollbar { display: none; }
.atb .atb-tnav a { flex: none; padding: 14px; font-weight: 800; color: var(--atb-ink-2); border-bottom: 3px solid transparent; white-space: nowrap; }
.atb .atb-tnav a:hover, .atb .atb-tnav a.on { color: var(--atb-accent); border-bottom-color: var(--atb-accent); }
.atb .atb-tnav .atb-tnav-home { color: var(--atb-muted); }
@media (max-width: 600px) { .atb .atb-tnav a { padding: 12px 10px; font-size: .92rem; } }
.atb-tp [id] { scroll-margin-top: 80px; }

.atb .atb-inc { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.atb .atb-inc h3 { font-size: 1.1rem; margin-bottom: 12px; }
.atb .atb-inc ul, .atb .atb-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.atb .atb-inc li { display: flex; gap: 10px; color: var(--atb-ink-2); font-weight: 600; line-height: 1.4; }
.atb .atb-yes li::before { content: "✓"; color: var(--atb-ok); font-weight: 900; }
.atb .atb-no li::before { content: "✕"; color: var(--atb-no); font-weight: 900; }
@media (max-width: 560px) { .atb .atb-inc { grid-template-columns: minmax(0, 1fr); } }
.atb .atb-know { display: grid; gap: 14px; margin: 0; }
.atb .atb-know dt { font-weight: 800; color: var(--atb-ink); }
.atb .atb-know dd { margin: 2px 0 0; color: var(--atb-muted); }
.atb .atb-steps { counter-reset: s; gap: 14px; }
.atb .atb-steps li { counter-increment: s; display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start; color: var(--atb-muted); }
.atb .atb-steps li > span { padding-top: 4px; }
.atb .atb-steps li::before { content: counter(s); width: 34px; height: 34px; border-radius: 50%; background: var(--atb-accent-soft); color: var(--atb-accent-dark); display: grid; place-items: center; font-weight: 800; }
.atb .atb-steps b { color: var(--atb-ink); }
.atb details.atb-qa { background: var(--atb-paper); border: 1px solid var(--atb-line); border-radius: 14px; margin-bottom: 12px; overflow: hidden; }
.atb details.atb-qa summary { list-style: none; cursor: pointer; padding: 18px 56px 18px 22px; font-weight: 800; color: var(--atb-ink); position: relative; }
.atb details.atb-qa summary::-webkit-details-marker { display: none; }
.atb details.atb-qa summary::after { content: "+"; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%; background: var(--atb-sand); color: var(--atb-ink-2); display: grid; place-items: center; font-size: 1.2rem; font-weight: 700; }
.atb details.atb-qa[open] summary::after { content: "−"; background: var(--atb-accent); color: #fff; }
.atb .atb-ans { padding: 0 22px 20px; color: var(--atb-muted); }

/* Request box */
.atb .atb-book { position: sticky; top: 72px; background: var(--atb-paper); border-radius: 20px; box-shadow: var(--atb-shadow); padding: 24px; display: grid; gap: 16px; border-top: 6px solid var(--atb-accent); min-width: 0; }
.atb .atb-now { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.atb .atb-amt { font-family: var(--atb-f-head); font-weight: 700; font-size: 2.2rem; line-height: 1; color: var(--atb-ink); }
.atb .atb-head { font-size: 1.7rem; }
.atb .atb-per, .atb .atb-sub { color: var(--atb-muted); }
.atb .atb-sub { font-size: .92rem; margin-top: 4px; }
.atb .atb-tiers-head, .atb .atb-tiers button { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1.05fr); gap: 8px; align-items: center; }
.atb .atb-tiers-head { padding: 0 14px 4px; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--atb-muted); }
.atb .atb-tiers-head span:last-child, .atb .atb-tiers .atb-t-total { text-align: right; }
.atb .atb-tiers { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.atb .atb-tiers button, .atb .atb-tiers button:hover, .atb .atb-tiers button:focus { width: 100%; padding: 11px 14px; border-radius: 12px; border: 1px solid var(--atb-line); background: #fff; font: inherit; color: var(--atb-ink); cursor: pointer; text-align: left; box-shadow: none; text-transform: none; letter-spacing: 0; }
.atb .atb-tiers .atb-t-pp { font-weight: 800; }
.atb .atb-tiers .atb-t-total { color: var(--atb-muted); white-space: nowrap; }
.atb .atb-tiers button.on, .atb .atb-tiers button.on:hover { border-color: var(--atb-accent); background: var(--atb-accent-soft); box-shadow: 0 0 0 1px var(--atb-accent) inset; }
.atb .atb-fields { display: grid; gap: 14px; margin: 0; }
.atb .atb-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.atb .atb-lbl { font-weight: 800; color: var(--atb-ink-2); }
.atb .atb-stepper { display: flex; align-items: center; border: 1px solid var(--atb-line); border-radius: 12px; overflow: hidden; background: #fff; }
.atb .atb-stepper button, .atb .atb-stepper button:hover, .atb .atb-stepper button:focus { width: 44px; height: 44px; padding: 0; border: 0; border-radius: 0; background: var(--atb-bg); font-size: 1.3rem; font-weight: 700; color: var(--atb-ink-2); cursor: pointer; line-height: 1; box-shadow: none; }
.atb .atb-stepper button:disabled { opacity: .35; cursor: default; }
.atb .atb-stepper output { width: 52px; text-align: center; font-weight: 800; }
.atb .atb-field label { display: block; font-size: .85rem; font-weight: 800; color: var(--atb-ink-2); margin: 0 0 6px; }
.atb .atb-opt { font-weight: 600; color: var(--atb-muted); }
.atb .atb-field input, .atb .atb-field select, .atb .atb-field textarea { width: 100%; min-height: 50px; border: 1px solid var(--atb-line); border-radius: 12px; padding: 12px 14px; font: inherit; font-size: 16px; background: #fff; color: var(--atb-ink); box-shadow: none; outline: none; }
.atb .atb-field textarea { min-height: 80px; resize: vertical; }
.atb .atb-field input:focus, .atb .atb-field select:focus, .atb .atb-field textarea:focus { border-color: var(--atb-accent); box-shadow: 0 0 0 3px var(--atb-accent-soft); }
.atb #atbDate + input { cursor: pointer; }
.atb .atb-total { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px dashed var(--atb-line); padding-top: 14px; color: var(--atb-muted); }
.atb .atb-total strong { font-family: var(--atb-f-head); font-size: 1.5rem; color: var(--atb-ink); }
.atb .atb-cta, .atb .atb-cta:hover, .atb .atb-cta:focus, .atb .atb-cta:visited { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; padding: 12px 20px; border: 0; border-radius: 999px; background: var(--atb-accent); color: #fff; font: inherit; font-weight: 800; font-size: 1rem; cursor: pointer; text-decoration: none; text-transform: none; letter-spacing: 0; box-shadow: none; }
.atb .atb-cta:hover { background: var(--atb-accent-dark); }
.atb .atb-cta:disabled { opacity: .7; cursor: wait; }
.atb .atb-fine { font-size: .82rem; color: var(--atb-muted); text-align: center; line-height: 1.5; }
.atb .atb-err { color: var(--atb-no); font-weight: 700; font-size: .92rem; }
.atb .atb-back, .atb .atb-back:hover, .atb .atb-back:focus, .atb .atb-link, .atb .atb-link:hover, .atb .atb-link:focus { justify-self: start; background: none; border: 0; padding: 0; color: var(--atb-accent); font: inherit; font-weight: 700; font-size: .92rem; cursor: pointer; box-shadow: none; text-transform: none; }
.atb .atb-summary { background: var(--atb-bg); border-radius: 12px; padding: 12px 14px; display: grid; gap: 2px; }
.atb .atb-summary b { color: var(--atb-ink); }
.atb .atb-summary span { color: var(--atb-muted); font-size: .92rem; }
.atb .atb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.atb .atb-sent { display: grid; gap: 12px; justify-items: center; text-align: center; }
.atb .atb-sent-mark { width: 56px; height: 56px; border-radius: 50%; background: var(--atb-accent-soft); color: var(--atb-accent-dark); display: grid; place-items: center; font-size: 1.6rem; font-weight: 800; }
.atb .atb-sent h3 { font-size: 1.35rem; }
.atb .atb-sent p { color: var(--atb-muted); }
.atb .atb-btn-wa, .atb .atb-btn-wa:hover, .atb .atb-btn-wa:visited, .atb-btn-wa, .atb-btn-wa:hover, .atb-btn-wa:visited { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 11px 20px; border-radius: 999px; background: #1F8F53; color: #fff; font-weight: 800; text-decoration: none; }
@media (max-width: 980px) { .atb .atb-book { position: static; } }

/* [atb_form] on Contact Us or any page */
.atb.atb-form-sc { padding: 8px 0 32px; }
.atb.atb-form-sc .atb-book { position: static; max-width: 520px; margin: 0 auto; }

/* Tour cards ([atb_tours] and "More tours") */
.atb .atb-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.atb .atb-card { background: var(--atb-paper); border-radius: var(--atb-r); overflow: hidden; box-shadow: var(--atb-shadow); display: flex; flex-direction: column; color: var(--atb-ink); min-width: 0; transition: transform .2s; }
.atb .atb-card:hover { transform: translateY(-4px); }
.atb a.atb-card-body, .atb a.atb-card-body:hover, .atb a.atb-card-body:visited { color: var(--atb-ink); text-decoration: none; }
.atb .atb-card-ph { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--atb-sand); }
/* The card's photos: a strip that scrolls sideways (swipe), with arrows and dots */
.atb .atb-track { display: flex; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.atb .atb-track::-webkit-scrollbar { display: none; }
.atb .atb-track > a { flex: 0 0 100%; height: 100%; scroll-snap-align: start; display: block; }
.atb .atb-card-ph img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.atb .atb-car-btn, .atb .atb-car-btn:hover, .atb .atb-car-btn:focus { position: absolute; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; min-height: 0; padding: 0; border: 0; border-radius: 50%; background: rgb(255 255 255 / .92); color: var(--atb-ink); font: 400 24px/1 var(--atb-f-body); display: grid; place-items: center; cursor: pointer; box-shadow: 0 1px 5px rgb(0 0 0 / .25); }
.atb .atb-car-btn:hover { background: #fff; }
.atb .atb-car-btn:focus-visible { outline: 2px solid var(--atb-accent); outline-offset: 2px; }
.atb .atb-car-prev { left: 10px; }
.atb .atb-car-next { right: 10px; }
.atb .atb-dots { position: absolute; left: 0; right: 0; bottom: 12px; display: flex; justify-content: center; gap: 7px; }
.atb .atb-dots button, .atb .atb-dots button:hover, .atb .atb-dots button:focus { width: 8px; height: 8px; min-height: 0; padding: 0; border: 0; border-radius: 50%; background: rgb(255 255 255 / .6); cursor: pointer; box-shadow: 0 0 3px rgb(0 0 0 / .4); }
.atb .atb-dots button.on { background: #fff; transform: scale(1.25); }
.atb .atb-tag { position: absolute; left: 14px; top: 14px; background: var(--atb-paper); color: var(--atb-ink-2); font-size: .74rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 6px 12px; border-radius: 999px; }
.atb .atb-card-body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.atb .atb-card-title { font-family: var(--atb-f-head); font-weight: 600; font-size: 1.32rem; line-height: 1.2; color: var(--atb-ink); }
.atb .atb-card-dur { font-size: .85rem; font-weight: 700; color: var(--atb-accent); }
.atb .atb-card-text { color: var(--atb-muted); font-size: .96rem; }
.atb .atb-card-foot { margin-top: auto; padding-top: 14px; border-top: 1px dashed var(--atb-line); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.atb .atb-card-price { font-size: .9rem; color: var(--atb-muted); }
.atb .atb-card-price b { font-family: var(--atb-f-head); font-size: 1.25rem; color: var(--atb-ink); }
.atb .atb-card-go { font-weight: 800; color: var(--atb-accent); white-space: nowrap; }
@media (max-width: 960px) { .atb .atb-cards { grid-template-columns: minmax(0, 1fr); max-width: 560px; } }
.atb-tp .atb-more { padding-top: 72px; }
.atb-tp .atb-more h2 { font-size: 1.9rem; margin-bottom: 26px; }

/* Lightbox */
.atb-lb { border: 0; padding: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100vw; height: 100vh; }
.atb-lb::backdrop { background: rgb(15 12 10 / .9); }
.atb-lb[open] { display: grid; place-items: center; }
.atb-lb figure { margin: 0; max-width: min(1100px, 92vw); }
.atb-lb img { max-height: 82vh; width: auto; max-width: 100%; border-radius: 10px; margin: 0 auto; }
.atb-lb figcaption { display: flex; justify-content: space-between; gap: 16px; color: #eee; font-size: .9rem; padding-top: 10px; }
.atb-lb .atb-lb-btn, .atb-lb .atb-lb-btn:hover, .atb-lb .atb-lb-btn:focus { position: fixed; width: 48px; height: 48px; border-radius: 50%; border: 0; padding: 0; background: rgb(255 255 255 / .15); color: #fff; font-size: 1.8rem; line-height: 1; cursor: pointer; }
.atb-lb .atb-lb-close { top: 16px; right: 16px; }
.atb-lb .atb-lb-prev { left: 16px; top: 50%; }
.atb-lb .atb-lb-next { right: 16px; top: 50%; }

/* Phone bar on tour pages */
.atb .atb-bar { display: none; }
@media (max-width: 980px) {
  .atb .atb-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--atb-paper); border-top: 1px solid var(--atb-line); padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); transition: transform .2s; }
  .atb .atb-bar.atb-bar-off { transform: translateY(110%); }
  .atb .atb-bar .atb-cta { width: auto; min-height: 46px; padding: 10px 20px; }
  .atb .atb-bar-price { font-size: .86rem; color: var(--atb-muted); line-height: 1.3; }
  .atb .atb-bar-price b { font-family: var(--atb-f-head); font-size: 1.15rem; color: var(--atb-ink); }
  .atb-tp { padding-bottom: 110px; }
}

/* Floating WhatsApp button, every page */
/* body a: beats the Elementor kit's link color (.elementor-kit-N a), which painted the icon */
body a.atb-wa-float, body a.atb-wa-float:hover, body a.atb-wa-float:visited { position: fixed; right: 18px; bottom: 18px; z-index: 95; width: 58px; height: 58px; border-radius: 50%; background: #1F8F53; color: #fff; display: grid; place-items: center; box-shadow: 0 8px 24px rgb(0 0 0 / .25); text-decoration: none; }
@media (max-width: 980px) { .single-tour .atb-wa-float { bottom: 84px; } }

/* Date picker and phone field in the site's colors */
body .flatpickr-calendar { border-radius: 14px; box-shadow: 0 10px 28px rgb(0 0 0 / .14); border: 1px solid #E6E2DA; }
body .flatpickr-calendar .flatpickr-current-month { white-space: nowrap; font-size: 118%; font-weight: 700; }
body .flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months { display: inline-block; width: auto; font-weight: 700; border: 0; background: transparent; }
body .flatpickr-calendar .flatpickr-current-month input.cur-year { font-weight: 700; border: 0; background: transparent; }
body .flatpickr-calendar .flatpickr-current-month .numInputWrapper { width: 6.5ch; }
body .flatpickr-calendar .flatpickr-day { border-radius: 8px; }
.atb .iti { width: 100%; }
.atb .iti__selected-country, .atb .iti__selected-country:hover { background: transparent; border: 0; padding: 0 8px 0 12px; color: var(--atb-ink); box-shadow: none; }
/* Hello Elementor makes every button inline-block, which pushed the dial code ("+1") under the field. */
.atb .iti__selected-country { display: flex !important; align-items: center; height: 100%; }
.atb .iti__selected-country-primary { display: flex; align-items: center; }
.atb .iti__selected-dial-code { margin-left: 6px; color: var(--atb-ink); }
@media (max-width: 420px) {
  .atb .atb-tiers button, .atb .atb-tiers button:hover, .atb .atb-tiers button:focus { padding: 10px 11px; font-size: .92rem; }
  .atb .atb-tiers-head { padding: 0 11px 4px; }
  .atb .atb-tiers .atb-t-total { font-size: .84rem; }
  .atb .atb-book { padding: 22px 18px; }
  .atb .atb-book { padding-top: 28px; }
}

/* Extras in the request box: a label like "Date" and the choices as buttons in the form's own type */
.atb .atb-extras { display: grid; gap: 12px; }
.atb .atb-extra { margin: 0; }
.atb .atb-xlbl { display: block; font-size: .85rem; font-weight: 800; color: var(--atb-ink-2); margin: 0 0 6px; }
.atb .atb-xseg { display: grid; gap: 6px; }
.atb .atb-xseg.n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.atb .atb-xseg.n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.atb .atb-xseg button, .atb .atb-xseg button:hover, .atb .atb-xseg button:focus { display: grid; align-content: center; justify-items: center; gap: 1px; min-height: 52px; padding: 8px 6px; border: 1px solid var(--atb-line); border-radius: 12px; background: #fff; color: var(--atb-ink); font: inherit; font-size: .95rem; font-weight: 700; line-height: 1.2; text-align: center; text-transform: none; letter-spacing: 0; cursor: pointer; box-shadow: none; }
.atb .atb-xseg button small { font-size: .82rem; font-weight: 600; color: var(--atb-muted); }
.atb .atb-xseg button[aria-checked="true"], .atb .atb-xseg button[aria-checked="true"]:hover { border-color: var(--atb-accent); background: var(--atb-accent-soft); box-shadow: 0 0 0 1px var(--atb-accent) inset; }
.atb .atb-xseg button[aria-checked="true"] small { color: var(--atb-accent-dark); }
.atb .atb-xseg button:focus-visible { outline: 2px solid var(--atb-accent); outline-offset: 2px; }
.atb .atb-summary span + span { margin-top: 2px; }
.atb .atb-pin svg { width: 22px; height: 22px; }

/* Extras, pop-up style: a field like Date that opens the form's own window with the choices */
.atb .atb-xfield, .atb .atb-xfield:hover, .atb .atb-xfield:focus { width: 100%; min-height: 50px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; border: 1px solid var(--atb-line); border-radius: 12px; background: #fff; color: var(--atb-ink); font: inherit; font-size: 16px; font-weight: 400; text-align: left; text-transform: none; letter-spacing: 0; cursor: pointer; box-shadow: none; }
.atb .atb-xfield::after { content: ""; flex: none; width: 8px; height: 8px; border-right: 2px solid var(--atb-muted); border-bottom: 2px solid var(--atb-muted); transform: translateY(-2px) rotate(45deg); }
.atb .atb-xfield.on { border-color: var(--atb-accent); }
.atb-xpop { position: absolute; z-index: 99999; background: #fff; border: 1px solid var(--atb-line); border-radius: 14px; box-shadow: 0 10px 28px rgb(0 0 0 / .14); padding: 8px; }
.atb-xpop[hidden] { display: none !important; }
.atb-xpop .atb-xseg, .atb-xpop .atb-xseg.n2, .atb-xpop .atb-xseg.n3 { grid-template-columns: minmax(0, 1fr); gap: 4px; }
.atb-xpop .atb-xseg button, .atb-xpop .atb-xseg button:hover, .atb-xpop .atb-xseg button:focus { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 48px; padding: 10px 14px; border: 1px solid transparent; text-align: left; }
.atb-xpop .atb-xseg button:hover { background: var(--atb-accent-soft); }
.atb-xpop .atb-xseg button[aria-checked="true"] { border-color: var(--atb-accent); background: var(--atb-accent-soft); box-shadow: none; }

/* Taxi addresses under the one way / round trip choice */
.atb .atb-xaddr { display: grid; gap: 10px; margin-top: 10px; padding: 12px; border-radius: 12px; background: var(--atb-bg); }
.atb .atb-xaddr[hidden], .atb .atb-xaddr .atb-xto[hidden] { display: none !important; }

/* The horse icon's eye and mane are cut out in the circle's color */
.atb .atb-pin .atb-cut { fill: var(--atb-accent); }
.atb .atb-pin .atb-cut-line { fill: none; stroke: var(--atb-accent); stroke-width: .9; stroke-linecap: round; }
.atb .atb-pin svg:has(.atb-cut) { width: 26px; height: 26px; }

/* Country search in the phone field (on phones it opens full screen, outside the form): the icon kept on the left,
   and the clear button, a <button>, no longer painted by Hello Elementor's button style. */
.iti .iti__search-input, .iti--container .iti__search-input { border: 0; border-bottom: 1px solid #E6DED3; border-radius: 0; padding: 12px 40px 12px 38px; box-shadow: none; background: #fff; font-size: 16px; line-height: 1.3; color: #2B2B2B; width: 100%; }
.iti .iti__search-input:focus, .iti--container .iti__search-input:focus { outline: none; box-shadow: none; border-bottom: 2px solid var(--atb-iti-focus, #646B72); }
.iti .iti__search-icon, .iti--container .iti__search-icon { left: 12px; }
body .iti .iti__search-clear, body .iti .iti__search-clear:hover, body .iti .iti__search-clear:focus, body .iti--container .iti__search-clear, body .iti--container .iti__search-clear:hover, body .iti--container .iti__search-clear:focus { position: absolute; right: 8px; width: 28px; height: 28px; min-height: 0; padding: 4px; margin: 0; border: 0; border-radius: 6px; background: transparent; box-shadow: none; display: flex; align-items: center; justify-content: center; color: #6E6E6E; }
body .iti .iti__search-clear.iti__hide, body .iti--container .iti__search-clear.iti__hide { display: none; }
.iti .iti__country, .iti--container .iti__country { padding: 10px 14px; }

/* ---------- Site header and footer ----------
   Hello Elementor's own: the menus are in Appearance › Menus ("Header" and "Footer"), the texts in Elementor ›
   Site Settings › Header and Footer, and the site name in Settings › General. Here they get the skin's look.
   A menu item with the CSS class atb-cta shows as a button. Ids beat Hello's and the kit's class selectors. */
#site-header { position: relative; z-index: 50; max-width: none; margin: 0; padding: 0; background: rgb(255 255 255 / .96); border-bottom: 1px solid var(--atb-line); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
/* Sticky on every page but the tour pages, which have their own sticky menu (Overview, Itinerary...) */
body:not(.single-tour) #site-header { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); }
#site-header .header-inner { max-width: 1180px; width: 100%; min-height: 72px; margin: 0 auto; padding: 0 22px; display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; gap: 20px; }
#site-header .site-branding { flex-direction: row; align-items: center; gap: 12px; min-width: 0; }
#site-header .site-title { margin: 0; font-family: var(--atb-f-head); font-size: 1.12rem; font-weight: 700; line-height: 1.1; }
#site-header .site-title a { display: flex; align-items: center; gap: 12px; color: var(--atb-ink); text-decoration: none; }
#site-header .site-description { margin: 0; font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--atb-accent); }
#site-header .site-logo img { max-height: 56px; width: auto; }
#site-header .site-navigation ul.menu { margin: 0; align-items: center; gap: 2px; }
#site-header .site-navigation ul.menu li a { padding: 10px 12px; font-family: var(--atb-f-body); font-size: .98rem; font-weight: 700; color: var(--atb-ink-2); text-decoration: none; }
#site-header .site-navigation ul.menu li a:hover, #site-header .site-navigation ul.menu li.current-menu-item > a { color: var(--atb-accent); }
#site-header .site-navigation ul.menu li.atb-cta { margin-left: 12px; }
#site-header .site-navigation ul.menu li.atb-cta > a, #site-header .site-navigation-dropdown ul.menu li.atb-cta > a { padding: 10px 20px; border-radius: 999px; background: var(--atb-accent); color: #fff; }
#site-header .site-navigation ul.menu li.atb-cta > a:hover, #site-header .site-navigation-dropdown ul.menu li.atb-cta > a:hover { background: var(--atb-accent-dark); color: #fff; }
#site-header .site-navigation-toggle-holder { padding: 0; flex: none; }
#site-header .site-navigation-toggle, #site-header .site-navigation-toggle:hover, #site-header .site-navigation-toggle:focus { width: 46px; height: 46px; padding: 0; border: 0; border-radius: 12px; background: var(--atb-sand); color: var(--atb-ink); box-shadow: none; }
#site-header .site-navigation-toggle:focus-visible { outline: 2px solid var(--atb-accent); outline-offset: 2px; }
#site-header .site-navigation-dropdown { margin: 0; }
#site-header .site-navigation-dropdown ul.menu { padding: 6px 0 16px; background: var(--atb-paper); border-bottom: 1px solid var(--atb-line); box-shadow: 0 14px 24px rgb(0 0 0 / .08); }
#site-header .site-navigation-dropdown ul.menu li a { padding: 14px 22px; background: none; box-shadow: none; font-family: var(--atb-f-body); font-size: 1.02rem; font-weight: 700; color: var(--atb-ink); text-decoration: none; }
#site-header .site-navigation-dropdown ul.menu li.current-menu-item > a { background: var(--atb-accent-soft); color: var(--atb-accent-dark); }
#site-header .site-navigation-dropdown ul.menu li.atb-cta { padding: 10px 22px 0; }
#site-header .site-navigation-dropdown ul.menu li.atb-cta > a { text-align: center; padding: 14px 20px; }
@media (max-width: 600px) {
  #site-header .header-inner { min-height: 62px; padding: 0 16px; gap: 12px; }
  #site-header .site-title { font-size: 1rem; }
  #site-header .site-title a { gap: 10px; }
  #site-header .site-description { display: none; }
}

#site-footer { max-width: none; margin: 0; padding: 0; background: var(--atb-foot, var(--atb-sand)); color: var(--atb-muted); border-top: 1px solid var(--atb-line); font-size: .95rem; }
/* Centered: name and tagline, the menu in a row, then the copyright (Diego, 2026-10-23) */
#site-footer .footer-inner { max-width: 1180px; width: 100%; margin: 0 auto; padding: 52px 22px 26px; display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; gap: 22px; text-align: center; }
#site-footer .site-branding { display: grid; gap: 8px; width: auto; justify-content: center; justify-items: center; text-align: center; }
#site-footer .site-title { margin: 0; font-family: var(--atb-f-head); font-size: 1.15rem; font-weight: 700; }
#site-footer .site-title a { color: var(--atb-ink); text-decoration: none; }
#site-footer .site-description { margin: 0; max-width: 46ch; }
#site-footer .site-navigation { display: block; width: auto; text-align: center; }
#site-footer .site-navigation ul.menu { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 28px; margin: 0; padding: 0; }
#site-footer .site-navigation ul.menu li { display: block; }
#site-footer .site-navigation ul.menu li a { padding: 4px 0; font-weight: 700; color: var(--atb-ink-2); text-decoration: none; }
#site-footer .site-navigation ul.menu li a:hover { color: var(--atb-accent); }
#site-footer .copyright { display: block; width: 100%; text-align: center; padding-top: 18px; border-top: 1px solid var(--atb-line); font-size: .85rem; }
#site-footer .copyright a { color: inherit; }
@media (max-width: 700px) {
  #site-footer .footer-inner { padding: 40px 16px 24px; }
  #site-footer .site-navigation ul.menu { gap: 2px 20px; }
}

/* ---------- Elementor pages ----------
   CSS classes set on containers in Elementor (Advanced › CSS Classes). */
/* atb-hero: on phones the photo sits above the text instead of behind it (the design's phone layout). The
   container's background image is drawn at full width in the top part, and the text starts below it. */
@media (max-width: 767px) {
  .elementor .atb-hero { min-height: 0 !important; background-size: 100% auto !important; background-position: center top !important; background-repeat: no-repeat !important; background-color: var(--atb-hero-phone, #3B2B21) !important; padding-top: calc(56.25% + 28px) !important; }
  .elementor .atb-hero::before, .elementor .atb-hero > .elementor-background-overlay { display: none !important; }
}
/* Hello Elementor makes buttons nowrap: long tour names in the tour field and its window wrap instead of widening the form */
.atb .atb-xfield, .atb .atb-xfield:hover, .atb .atb-xfield:focus, .atb-xpop .atb-xseg button, .atb-xpop .atb-xseg button:hover, .atb-xpop .atb-xseg button:focus { white-space: normal; max-width: 100%; line-height: 1.3; }
.atb .atb-xfield span { min-width: 0; text-align: left; }

/* Footer in columns (Ajustes): name and tagline, the Footer menu titled with its name, Contact; then the copyright */
.atb-foot-cols #site-footer .footer-inner { grid-template-columns: minmax(0, 1.4fr) minmax(0, 2fr); justify-items: stretch; align-items: start; gap: 28px 48px; text-align: left; }
.atb-foot-cols #site-footer .site-branding { justify-content: start; justify-items: start; text-align: left; }
.atb-foot-cols #site-footer .site-navigation { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 40px; width: 100%; text-align: left; }
.atb-foot-cols #site-footer .atb-foot-col h4 { margin: 0 0 12px; font-family: var(--atb-f-head); font-size: 1.05rem; font-weight: 700; color: var(--atb-ink); }
.atb-foot-cols #site-footer .atb-foot-col ul { display: grid; justify-content: start; gap: 8px; margin: 0; padding: 0; list-style: none; }
.atb-foot-cols #site-footer .atb-foot-col ul.menu li a, .atb-foot-cols #site-footer .atb-foot-contact a { padding: 0; font-weight: 400; color: var(--atb-muted); text-decoration: none; }
.atb-foot-cols #site-footer .atb-foot-col ul.menu li a:hover, .atb-foot-cols #site-footer .atb-foot-contact a:hover { color: var(--atb-accent); }
.atb-foot-cols #site-footer .copyright { grid-column: 1 / -1; text-align: left; }
@media (max-width: 760px) {
  .atb-foot-cols #site-footer .footer-inner, .atb-foot-cols #site-footer .site-navigation { grid-template-columns: minmax(0, 1fr); }
}

/* Home cover: Elementor's background slideshow (Background › Slideshow on a container with the class
   atb-hero-slider) with arrows and dots added by slider.js */
.elementor .atb-hero-nav { position: absolute; inset: 0; z-index: 5; pointer-events: none; }
.elementor .atb-hero-nav > * { pointer-events: auto; }
body .atb-hero-nav .atb-car-btn, body .atb-hero-nav .atb-car-btn:hover, body .atb-hero-nav .atb-car-btn:focus { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; min-height: 0; padding: 0; border: 0; border-radius: 50%; background: rgb(255 255 255 / .9); color: #222; font: 400 30px/1 system-ui, sans-serif; display: grid; place-items: center; cursor: pointer; box-shadow: 0 2px 8px rgb(0 0 0 / .25); }
body .atb-hero-nav .atb-car-btn:hover { background: #fff; }
.atb-hero-nav .atb-car-prev { left: 16px; }
.atb-hero-nav .atb-car-next { right: 16px; }
.elementor .atb-hero-nav .atb-dots { position: absolute; left: 0; right: 0; bottom: 18px; display: flex; justify-content: center; gap: 8px; pointer-events: none; }
.elementor .atb-hero-nav .atb-dots button { pointer-events: auto; }
body .atb-hero-nav .atb-dots button, body .atb-hero-nav .atb-dots button:hover, body .atb-hero-nav .atb-dots button:focus { width: 9px; height: 9px; min-height: 0; padding: 0; border: 0; border-radius: 50%; background: rgb(255 255 255 / .6); cursor: pointer; box-shadow: 0 0 3px rgb(0 0 0 / .45); }
body .atb-hero-nav .atb-dots button.on { background: #fff; transform: scale(1.3); }
@media (max-width: 767px) {
  /* atb-hero on phones: the slideshow and its controls fill the photo area above the text */
  .elementor .atb-hero > .elementor-background-slideshow, .elementor .atb-hero .atb-hero-nav { bottom: auto !important; height: 56.25vw !important; }
  body .atb-hero-nav .atb-car-btn, body .atb-hero-nav .atb-car-btn:hover, body .atb-hero-nav .atb-car-btn:focus { width: 38px; height: 38px; font-size: 24px; }
}

/* [atb_extras]: the extras from Ajustes as cards */
.atb .atb-xcards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px; }
.atb .atb-xcard { display: flex; flex-direction: column; gap: 10px; padding: 24px; background: var(--atb-paper); border: 1px solid var(--atb-line); border-radius: var(--atb-r); }
.atb .atb-xicon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: var(--atb-r); background: var(--atb-accent-soft); color: var(--atb-accent); }
.atb .atb-xicon svg { width: 26px; height: 26px; }
.atb .atb-xcard b { font-family: var(--atb-f-head); font-size: 1.15rem; color: var(--atb-ink); }
.atb .atb-xprice { font-family: var(--atb-f-head); font-weight: 800; font-size: 1.5rem; color: var(--atb-ink); }
.atb .atb-xprice small { font-family: var(--atb-f-body); font-weight: 500; font-size: .85rem; color: var(--atb-muted); }
@media (max-width: 480px) { .atb .atb-xcards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .atb .atb-xcard { padding: 18px; } }

/* A cover with a wave at the bottom (atb-hero-wave): the dots sit above the wave */
body .elementor .atb-hero-wave .atb-hero-nav .atb-dots { bottom: 74px; }
@media (max-width: 767px) { body .elementor .atb-hero-wave .atb-hero-nav .atb-dots { bottom: 16px; } }

/* Slider arrows and dots a little transparent, so the photo shows through (Diego, 2026-10-24): cover, cards and tour photos */
body .atb .atb-car-btn, body .atb .atb-car-btn:focus, body .atb-hero-nav .atb-car-btn, body .atb-hero-nav .atb-car-btn:focus { background: rgb(255 255 255 / .55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); box-shadow: 0 1px 4px rgb(0 0 0 / .18); }
body .atb .atb-car-btn:hover, body .atb-hero-nav .atb-car-btn:hover { background: rgb(255 255 255 / .85); }
body .atb .atb-dots button, body .atb .atb-dots button:hover, body .atb .atb-dots button:focus, body .atb-hero-nav .atb-dots button, body .atb-hero-nav .atb-dots button:hover, body .atb-hero-nav .atb-dots button:focus { background: rgb(255 255 255 / .45); box-shadow: 0 0 2px rgb(0 0 0 / .3); }
body .atb .atb-dots button.on, body .atb-hero-nav .atb-dots button.on { background: rgb(255 255 255 / .9); }
