/* View layouts and interactions. Carousel styles belong to the next delivery. */
.catalog-filter-toggle { display: none; }
.catalog-filter-content[hidden] { display: none; }
.terrain-card-open { margin-top: 18px; min-height: 44px; width: 100%; }
.terrain-video-label { position: absolute; bottom: 10px; left: 10px; padding: 5px 10px; border-radius: 20px; background: var(--navy); color: white; font-size: 12px; }
.thumb-video { display: grid; place-items: center; height: 100%; color: var(--navy); font-size: 20px; }
.terrain-modal .gallery-main video { object-fit: contain; background: var(--navy); }
.terrain-modal .thumb { padding: 4px; }
.terrain-modal-head .modal-close { min-width: 44px; min-height: 44px; }
.terrain-modal-head > div:not(.window-controls) { padding-top: 0; }
.terrain-modal .tab[aria-selected="true"] { background: var(--navy); color: var(--ivory); }
.terrain-modal :focus-visible, .catalog-main :focus-visible, .filters :focus-visible,
.site-header :focus-visible, .timeline :focus-visible, .faq :focus-visible {
  outline: 3px solid var(--gold); outline-offset: 3px;
}
.terrain-modal .tab { min-height: 44px; }

@media (max-width: 980px) {
  :root { --mobile-gutter: clamp(16px, 4.5vw, 28px); }
  .site-header { top: 0; }
  .site-header .bar { min-height: 72px; padding: 10px var(--mobile-gutter); gap: 12px; }
  .site-header .brand { min-width: 0; flex: 1; font-size: clamp(14px, 3.7vw, 19px); line-height: 1.25; }
  .site-header .brand span { margin-top: 5px; max-width: 30ch; font-size: 11px; line-height: 1.35; font-weight: 500; }
  .site-header .menu-toggle { width: 46px; height: 46px; flex: 0 0 46px; }
  .site-header .nav { top: calc(100% + 8px); left: var(--mobile-gutter); right: var(--mobile-gutter); max-height: calc(100dvh - 110px); overflow-y: auto; padding: 8px; }
  .site-header .nav a { min-height: 48px; justify-content: flex-start; border-radius: 8px; }
  .site-header .nav a[aria-current="page"] { background: var(--navy); color: var(--ivory); }
  .wrap.elementor-page-content { padding: 0 var(--mobile-gutter) 32px; }
  .elementor-page-content .elementor-widget-container { min-width: 0; }
  .elementor-page-content .section { margin-top: 24px; margin-bottom: 24px; }
  .elementor-page-content :is(.home-intro, .value-split, .offer-layout, .company-hero, .faq-layout) { grid-template-columns: minmax(0, 1fr); }
  .elementor-page-content :is(p, h1, h2, h3, a, .chip) { overflow-wrap: anywhere; }
  .elementor-page-content :is(.media-card, .value-media-placeholder, .offer-visual, .company-hero-media, .ts-story-hero-media, .ts-story-image) img { width: 100%; height: 100%; object-fit: cover; }
  .elementor-page-content :is(.actions .btn, .value-copy .btn, .ts-story-cta .btn, .faq-help .btn) { display: flex; align-items: center; justify-content: center; min-height: 48px; text-align: center; line-height: 1.4; }

  /* Inicio: an uninterrupted reading order, with the image supporting the copy. */
  #home { box-shadow: none; background: transparent; border-radius: 0; }
  #home .home-intro { padding: 0; gap: 24px; }
  #home .intro-card { padding: 28px 22px; border-radius: 20px; }
  #home .eyebrow { color: var(--teal); font-size: 11px; line-height: 1.5; }
  #home .intro-card :is(h1, h2) { margin: 14px 0 18px; color: var(--navy); font-size: clamp(27px, 6.6vw, 40px); line-height: 1.13; letter-spacing: -.025em; }
  #home .intro-card p { font-size: 16px; line-height: 1.7; }
  #home .actions { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 24px 0 0; }
  #home .media-card { aspect-ratio: 4 / 3; max-height: 440px; border-radius: 20px; }
  .elementor-page-content .value-section { margin: 40px calc(-1 * var(--mobile-gutter)); border-radius: 0; }
  .value-section .content { padding: 40px var(--mobile-gutter); }
  .value-split { gap: 28px; }
  .value-copy h2 { font-size: clamp(28px, 6.5vw, 38px); line-height: 1.15; }
  .value-copy h2 span { font-size: clamp(34px, 8vw, 48px); line-height: 1.12; margin-top: 6px; }
  .value-copy p { font-size: 16px; line-height: 1.7; }
  .value-copy .btn { margin-top: 24px; }
  .value-media-placeholder { aspect-ratio: 4 / 3; border-radius: 18px; }
  .offer-section .head { padding: 28px 22px 8px; }
  .offer-section .head :is(h1, h2) { font-size: 30px; line-height: 1.12; }
  .offer-section .head p { font-size: 15px; line-height: 1.6; }
  .offer-layout { padding: 8px 22px 24px; gap: 28px; }
  .offer-card { grid-template-columns: 40px minmax(0, 1fr); gap: 14px; align-items: start; padding: 22px 0; }
  .offer-icon { display: block; font-size: 16px; padding-top: 4px; }
  .offer-icon:before { display: none; }
  .offer-card h3 { font-size: 21px; line-height: 1.25; }
  .offer-card p { font-size: 15px; line-height: 1.65; }
  .offer-visual { aspect-ratio: 4 / 3; width: 100%; max-width: 520px; }

  /* Empresa: compact history controls and clear sections. */
  .elementor-page-content .company-section { margin: 0 calc(-1 * var(--mobile-gutter)); }
  .company-hero, .company-hero-media { clip-path: none; }
  .company-hero { min-height: 0; }
  .company-hero-copy { padding: 36px var(--mobile-gutter); order: 0; }
  .company-hero-copy :is(h1, h2) { font-size: clamp(34px, 8vw, 48px); line-height: 1.08; }
  .company-hero-copy p { font-size: 16px; line-height: 1.7; }
  .company-hero-media { order: 1; height: 280px; min-height: 0; }
  .company-section .timeline { grid-template-columns: minmax(0, 1fr); gap: 26px; padding: 36px var(--mobile-gutter); }
  .company-section .timeline-list { display: flex; overflow-x: auto; gap: 8px; padding: 4px 2px 12px; scroll-snap-type: x proximity; }
  .company-section .timeline-list button { flex: 0 0 168px; min-height: 60px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; font-size: 14px; scroll-snap-align: start; }
  .company-section .timeline-list button.active { background: var(--navy); color: var(--ivory); border-color: var(--navy); }
  .company-section .panel { min-height: 0; }
  .company-section .panel h3 { font-size: 28px; line-height: 1.2; }
  .company-section .panel p { font-size: 16px; line-height: 1.7; }
  .company-section .company-principles { grid-template-columns: minmax(0, 1fr); clip-path: none; padding: 36px var(--mobile-gutter); gap: 24px; }
  .company-section .company-principles > .company-principles-heading { font-size: 32px; line-height: 1.15; }
  .company-section .principle-card { grid-template-columns: 48px minmax(0, 1fr); gap: 16px; padding: 0; }
  .company-section .principle-card:not(:last-child):after { display: none; }
  .company-section .principle-card .eyebrow { width: 48px; height: 48px; grid-row: 1 / span 2; }
  .company-section .principle-card h3 { font-size: 22px; line-height: 1.2; }
  .company-section .principle-card p { grid-column: 2; margin: 0; font-size: 16px; line-height: 1.65; }

  /* Catálogo: filters are available without burying the results. */
  body.has-terrain-background { background-attachment: scroll; }
  .elementor-page-content #catalogo { margin: 0 calc(-1 * var(--mobile-gutter)); padding: 0 var(--mobile-gutter) 24px; border-radius: 0; }
  #catalogo .head { margin: 0 calc(-1 * var(--mobile-gutter)); padding: 36px var(--mobile-gutter) 62px; clip-path: none; background: linear-gradient(130deg, var(--navy), var(--teal)); }
  #catalogo .head :is(h1, h2) { font-size: clamp(34px, 8vw, 48px); white-space: normal; line-height: 1.08; margin-bottom: 16px; }
  #catalogo .head p { font-size: 16px; line-height: 1.65; }
  .catalog { margin-top: -28px; }
  .catalog-results { display: block; border-radius: 18px; }
  .filters { padding: 0; margin: 0; background: transparent; }
  .filters h3 { display: none; }
  .filters .catalog-filter-toggle { display: flex; justify-content: space-between; align-items: center; width: 100%; min-height: 56px; margin: 0; padding: 14px 18px; border: 0; border-radius: 0; color: var(--navy); background: var(--paper); text-align: left; }
  .catalog-filter-toggle:after { content: '+'; font-size: 24px; font-weight: 400; }
  .catalog-filter-toggle[aria-expanded="true"]:after { content: '−'; }
  .catalog-filter-content { padding: 0 18px 20px; }
  .filters .filter-group { padding: 16px 0; }
  .filters .filter-group:last-child { padding-bottom: 16px; }
  .filters label { display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 2px 0; font-size: 16px; }
  .filters input[type="checkbox"] { width: 20px; height: 20px; margin: 0; flex: 0 0 20px; }
  .filters #clearFilters { min-height: 46px; margin-top: 18px; }
  .catalog-main { padding: 20px 14px 16px; }
  .catalog-top { gap: 12px; margin-bottom: 20px; }
  .catalog-top strong { font-size: 15px; }
  .catalog-top select { font-size: 16px; min-height: 46px; width: 100%; }
  #terrainGrid { gap: 18px; }
  #terrainGrid .card { min-width: 0; padding: 8px; cursor: default; }
  #terrainGrid .img { aspect-ratio: 3 / 2; }
  #terrainGrid .body { padding: 6px 10px 12px; }
  #terrainGrid .body h3 { font-size: 24px; line-height: 1.2; }
  #terrainGrid .terrain-zone, #terrainGrid .terrain-area { font-size: 15px; }
  #terrainGrid .chip { font-size: 12px; min-height: 28px; padding: 4px 8px; }
  .terrain-card-open { display: flex; justify-content: space-between; align-items: center; min-height: 48px; background: var(--navy); color: var(--ivory); border-color: var(--navy); }
  .terrain-card-open:after { content: '↗'; font-size: 20px; }

  /* Terrain detail uses the phone viewport, with one scrolling surface. */
  .terrain-modal { padding: 0; overflow: hidden; }
  .terrain-modal.open { display: block; }
  .terrain-modal-card { width: 100%; height: 100dvh; max-height: none; margin: 0; border: 0; border-radius: 0; scrollbar-gutter: auto; overscroll-behavior: contain; }
  .terrain-modal-head { position: sticky; top: 0; z-index: 2; padding: max(16px, env(safe-area-inset-top)) var(--mobile-gutter) 16px; gap: 12px; align-items: center; }
  .terrain-modal-head h2 { font-size: 25px; line-height: 1.15; }
  .terrain-modal-head p { display: none; }
  .terrain-modal-head .eyebrow { font-size: 10px; }
  .terrain-modal-head .modal-close { width: 46px; height: 46px; }
  .terrain-modal .detail { grid-template-columns: minmax(0, 1fr); padding: 20px var(--mobile-gutter) max(28px, env(safe-area-inset-bottom)); gap: 24px; }
  .terrain-modal .detail > div { min-width: 0; }
  .terrain-modal .side { order: 0; padding: 18px; }
  .terrain-modal .gallery-main { height: auto; aspect-ratio: 4 / 3; }
  .terrain-modal .thumbs { display: flex; overflow-x: auto; gap: 10px; padding: 4px; }
  .terrain-modal .thumb { flex: 0 0 64px; height: 56px; }
  .terrain-modal .tabs { display: grid; grid-template-columns: 1fr 1fr; overflow: visible; gap: 8px; }
  .terrain-modal .tab { padding: 12px 8px; font-size: 14px; }
  .terrain-modal #tabContent { font-size: 16px; line-height: 1.7; }
  .terrain-modal .side h3 { font-size: 25px; }

  /* FAQ and Todos Santos: comfortable reading, no desktop offsets. */
  .elementor-page-content #faq { margin: 0 calc(-1 * var(--mobile-gutter)); background-attachment: scroll; }
  #faq .head { padding: 36px var(--mobile-gutter) 18px; }
  #faq .head :is(h1, h2) { font-size: clamp(34px, 8vw, 46px); line-height: 1.1; }
  .faq-layout { padding: 10px var(--mobile-gutter) 32px; gap: 24px; }
  .faq summary { padding: 20px 18px; font-family: inherit; font-size: 17px; line-height: 1.5; align-items: flex-start; }
  .faq summary:before { margin-top: 7px; }
  .faq details .muted { padding: 0 18px 22px; font-size: 16px; line-height: 1.7; }
  .faq-help { padding: 26px 22px; }
  .ts-story-hero { grid-template-columns: 1fr; min-height: 0; }
  .ts-story-hero-copy { order: 0; padding: 32px 22px; }
  .ts-story-hero-media { order: 1; min-height: 0; height: 280px; }
  .ts-story-hero h1 { font-size: clamp(34px, 8vw, 48px); line-height: 1.1; }
  .ts-story-lead { font-size: 17px; line-height: 1.7; margin-top: 20px; }
  .ts-story-flow { display: flex; flex-direction: column; padding: 32px 0; gap: 20px; }
  .ts-story-copy, .ts-story-image { width: 100%; margin: 0; }
  .ts-story-copy { padding: 28px 22px; border-radius: 18px; }
  .ts-story-copy h2 { font-size: 28px; line-height: 1.2; }
  .ts-story-copy p { font-size: 16px; line-height: 1.75; }
  .ts-story-number { margin-bottom: 16px; }
  .ts-story-image { height: 260px; border-radius: 18px; }
  .ts-story-copy-one { order: 1; } .ts-story-image-one { order: 2; }
  .ts-story-copy-two { order: 3; } .ts-story-image-two { order: 4; } .ts-story-copy-three { order: 5; }
  .ts-story-cta { padding: 34px 22px; flex-direction: column; gap: 24px; align-items: stretch; background: linear-gradient(125deg, var(--navy), var(--teal)); }
  .ts-story-cta h2 { font-size: 32px; line-height: 1.15; }
  .ts-story-cta p:not(.eyebrow) { font-size: 16px; line-height: 1.65; }
  .footer .inner { grid-template-columns: minmax(0, 1fr); padding: 34px var(--mobile-gutter); gap: 28px; }
  .footer .footer-brand { order: 0; }
  .footer .inner > div:nth-child(3) { min-width: 0; justify-self: stretch; }
  .footer a:not(.alliance-logo) { display: flex; align-items: center; min-height: 44px; margin: 0; }
  .footer .alliance-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 340px; justify-content: start; gap: 16px; }
  .footer .alliance-logo { width: 100%; min-width: 0; }
  .footer .alliance-logo img { max-width: 100%; }
}

@media (max-width: 560px) { #terrainGrid { grid-template-columns: minmax(0, 1fr); } }
@media (hover: none) {
  #terrainGrid .card:hover { transform: none; background: var(--paper); color: var(--navy); }
  #terrainGrid .card:hover :is(h3, .terrain-zone, .terrain-area, .chip) { color: var(--navy); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .site-header *, .terrain-modal *, .catalog-main *, .faq * { transition: none; }
}
.terrain-page-link { display: block; margin-top: 16px; text-align: center; }
.terrain-page h1 { color: var(--navy); font-size: clamp(32px, 5vw, 54px); }
.terrain-page h2 { margin-top: 28px; color: var(--navy); }
.terrain-page-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 20px; }
.terrain-page-gallery img, .terrain-page-gallery video { display: block; width: 100%; height: auto; max-height: 600px; object-fit: contain; }
.terrain-page dd { margin: 0 0 12px; }
.terrain-page dt { font-weight: 700; }

.company-principles-heading { margin: 0 0 6px; }
.timeline-panel h2 { font-size: 1.17em; }