/* Shared navigation, footer and narrow-screen content layouts. */
html { overflow-x: visible; }
#site-nav .nav-inner { min-height: 64px; gap: 1.3rem; }
#site-nav .nav-logo { letter-spacing: .03em; }
#site-nav .nav-item { position: static; }
#site-nav .nav-links { justify-content: center; gap: .15rem; }
#site-nav .nav-links > .nav-item > .nav-link { min-height: 44px; padding: .65rem .6rem; font-size: .88rem; letter-spacing: 0; gap: .4rem; }
#site-nav .nav-tools { gap: .75rem; }
#site-nav .nav-cta { min-height: 44px; border-radius: .35rem; padding-inline: .8rem; font-size: .84rem; }
#site-nav .nav-dropdown { left: 50%; right: auto; top: 100%; width: min(35rem,calc(100vw - 3rem)); grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.5rem; padding: 1.35rem; border-radius: 0 0 .6rem .6rem; transform: translate(-50%,6px); max-height: calc(100dvh - 80px); overflow-y: auto; }
#site-nav .nav-columns-3 { width: min(49rem,calc(100vw - 3rem)); grid-template-columns: repeat(3,minmax(0,1fr)); }
#site-nav .nav-columns-1 { width: min(22rem,calc(100vw - 3rem)); grid-template-columns: minmax(0,1fr); }
#site-nav .dropdown-open > .nav-dropdown { transform: translate(-50%,0); }
.nav-section { min-width: 0; }
.nav-section-title { color: #646d78; font-weight: 700; font-size: .74rem; letter-spacing: .04em; border-bottom: 1px solid #e4e7eb; padding: 0 .45rem .65rem; margin-bottom: .4rem; line-height: 1.4; }
#site-nav .nav-section a { min-height: 44px; display: flex; align-items: center; padding: .6rem .45rem; font-size: .93rem; line-height: 1.35; overflow-wrap: anywhere; }
#site-nav :is(a,button):focus-visible { outline: 3px solid var(--coral-on-dark); outline-offset: 3px; }
#site-footer { padding: 3rem clamp(1rem,3vw,2rem) 1.6rem; }
.footer-shell { max-width: 76rem; margin-inline: auto; }
.footer-intro { display: flex; justify-content: space-between; align-items: center; gap: 2rem; padding-bottom: 1.8rem; border-bottom: 1px solid #ffffff26; margin-bottom: 1.8rem; }
#site-footer .footer-brand { min-width: 0; }
#site-footer .footer-logo { display: inline-block; min-height: 44px; color: #fff; margin-bottom: .1rem; font-size: 1.4rem; }
#site-footer .footer-logo span { color: var(--coral-on-dark); }
#site-footer .footer-brand p { max-width: 65ch; font-weight: 400; font-size: .94rem; color: #cbd2dd; }
.footer-search { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .65rem 1rem; border: 1px solid #ffffff66; border-radius: .35rem; color: #fff; white-space: normal; text-align: center; font-size: .9rem; flex-shrink: 0; }
#site-footer .footer-inner { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 2rem; margin: 0 0 1.8rem; }
#site-footer h2 { color: #fff; font: 700 1rem/1.4 'Source Sans 3',system-ui,sans-serif; letter-spacing: 0; margin: 0 0 .8rem; }
#site-footer .footer-col li { margin-bottom: .2rem; }
#site-footer :is(.footer-col,.footer-directory) a { display: inline-flex; align-items: center; min-height: 38px; color: #cbd2dd; font-size: .9rem; font-weight: 400; line-height: 1.5; }
#site-footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: .2em; }
#site-footer :is(a,summary):focus-visible { outline: 3px solid var(--coral-on-dark); outline-offset: 3px; }
.footer-directory { border-top: 1px solid #ffffff26; padding-block: 1rem; }
.footer-directory summary { width: fit-content; max-width: 100%; min-height: 44px; color: #fff; font-size: .93rem; padding-block: .55rem; cursor: pointer; }
.footer-directory-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 2rem; margin-block: 1rem; }
#site-footer .footer-bottom { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem 2rem; padding-top: 1.4rem; font-size: .8rem; color: #aeb9c9; }
.footer-bottom > p:first-child { max-width: 70ch; }
#site-footer .footer-made { flex-shrink: 0; color: #d7dde6; }
#main :where(section,article,aside,nav,div,ul,ol,dl,p,li,figure,form) { min-width: 0; overflow-wrap: anywhere; }
#main :is(h2,h3)[id] { scroll-margin-top: 6rem; }
#main .klook-widget-scale-inner { max-width: none; }
@media (max-width: 1100px) {
  #site-nav .nav-inner { min-height: 58px; }
  #site-nav .nav-toggle { flex-direction: row; gap: .55rem; }
  #site-nav .nav-menu-caption { font-size: .82rem; font-weight: 600; }
  #site-nav .nav-menu { top: 58px; max-height: calc(100dvh - 58px); border-radius: 0; padding: .7rem 1rem 1rem; }
  #site-nav .nav-links { align-items: stretch; gap: .15rem; }
  #site-nav .nav-links > .nav-item > .nav-link { min-height: 48px; padding: .75rem .6rem; font-size: 1rem; }
  #site-nav .nav-dropdown { position: static; width: 100%; left: auto; right: auto; max-height: none; display: none; grid-template-columns: minmax(0,1fr); transform: none; border: 0; border-radius: .35rem; padding: .65rem .7rem; gap: 1rem; overflow: visible; }
  #site-nav .dropdown-open > .nav-dropdown { display: grid; transform: none; }
  #site-nav .nav-section-title { color: #bfcadb; border-bottom-color: #ffffff26; font-size: .78rem; }
  #site-nav .nav-section a { font-size: .95rem; color: #edf1f6; min-height: 44px; }
  #site-nav .nav-section a.active { color: var(--coral-on-dark); }
  #site-nav .nav-tools { gap: .8rem; }
  .footer-directory-grid { gap: 1.5rem; }
}
@media (max-width: 760px) {
  #site-footer .footer-inner { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.8rem; }
  .footer-intro { align-items: start; }
  #site-footer .footer-bottom { flex-direction: column; gap: .6rem; }
}
@media (max-width: 600px) {
  #main :where(section,article,aside,nav,div,ul,ol,dl,p,li,figure,form) { max-width: 100%; }
  #site-nav .nav-inner { gap: .5rem; padding-inline: .75rem; }
  #site-nav .nav-logo { font-size: min(1.3rem,24px); }
  #main .breadcrumb ol { flex-wrap: wrap; overflow: visible; }
  #main .breadcrumb li { flex: 0 1 auto; }
  #main .quicklinks-inner { flex-wrap: wrap; overflow: visible; }
  #main .forecast-toolbar { flex-wrap: wrap; overflow: visible; }
  #main .search-filters { flex-wrap: wrap; overflow: visible; margin-inline: 0; padding-inline: 0; }
  #main :is(.klook-banner-module,.klook-activity-offers,.klook-car-module) { grid-template-columns: minmax(0,1fr); }
  .footer-intro { flex-direction: column; gap: 1rem; }
  #site-footer .footer-inner, .footer-directory-grid { grid-template-columns: minmax(0,1fr); gap: 1.4rem; }
  #site-footer .footer-col + .footer-col { padding-top: 1.2rem; border-top: 1px solid #ffffff1a; }
  #site-footer :is(.footer-col,.footer-directory) a { min-height: 44px; }
  /* Content columns become one vertical reading order. Icon-and-label rows remain intact. */
  #main :is(.planner-grid,.states-grid,.cities-grid,.cities-grid-4,.steps-grid,.route-map-grid,.city-area-grid,.slang-grid,.emergency-number-grid,.en-state-grid,.en-extras-grid,.cv-tips-grid,.gallery-grid,.contributor-photos,.dest-picker,.weather-region-grid,.weather-extreme-grid,.weather-packing-grid,.forecast-intro,.forecast-grid,.forecast-days,.fuel-grid,.carrier-grid,.starlink-grid,.acc-types-grid,.incl-grid,.utility-grid,.rs-block,.proscons-grid,.editorial-action-grid,.editorial-destination-grid,.editorial-related-links,.area-comparison,.hp-start-grid,.hp-destination-grid,.hp-practical-grid,.hp-duration,.hp-next) { grid-template-columns: minmax(0,1fr); }
  #main .forecast-days-hint { display: none; }
  #main .forecast-days { display: grid; grid-auto-flow: row; grid-auto-columns: auto; overflow: visible; }
  #main :is(.editorial-toc ul,.editorial-sources ul,.visa-guide #official-sources ul) { columns: 1; }
  #main :is(.cb-toc ul,.cb-side ul,.visa-toc ul) { grid-template-columns: minmax(0,1fr); }
  #main .area-card dl { grid-template-columns: minmax(0,1fr); }
  #main :is(.rules-table-wrap,.planning-table-wrap,.editorial-table-wrap,.visa-table-wrap) { max-width: 100%; overflow: visible; border: 0; background: transparent; }
  #main table.responsive-table { display: block; position: relative; min-width: 0; width: 100%; max-width: 100%; table-layout: auto; border: 0; background: transparent; }
  #main .responsive-table caption { display: block; width: 100%; text-align: left; }
  #main .responsive-table thead { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  #main .responsive-table tbody { display: block; width: 100%; }
  #main .responsive-table tbody tr { display: block; margin-bottom: 1rem; padding: .85rem 1rem; border: 1px solid var(--border); border-radius: .4rem; background: #fff; }
  #main .responsive-table tbody :is(th,td) { display: block; width: 100%; max-width: 100%; min-width: 0; text-align: left; border: 0; padding: .6rem 0; white-space: normal; overflow-wrap: anywhere; background: transparent; }
  #main .responsive-table tbody :is(th,td) + :is(th,td) { border-top: 1px solid #e6e2db; }
  #main .responsive-table tbody :is(th,td)::before { content: attr(data-label); display: block; color: #5a5a5a; font: 600 .78rem/1.4 'Source Sans 3',system-ui,sans-serif; margin-bottom: .25rem; }
  #main :is(.table-scroll-hint,.visa-table-hint) { display: none; }
}
@media (prefers-reduced-motion: reduce) { #site-nav .nav-dropdown { transition: none; } }
