* { box-sizing: border-box; }

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica Neue, sans-serif;
  color: #334155;
  margin: 0;
}

a { text-decoration: none; }

/* --------------------------------------------------------------------
   Header row: logo | nav | contact button -> horizontal flex layout
   -------------------------------------------------------------------- */
.elementor-location-header .elementor-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  max-width: 1240px;
  margin: 0 auto;
  padding: 16px 24px;
  gap: 16px;
}

.elementor-location-header .elementor-column {
  display: block;
  min-width: 0;
}

.elementor-location-header .elementor-column.elementor-col-33:first-child {
  flex: 0 0 auto;
}
.elementor-location-header .elementor-column.elementor-col-33:nth-child(2) {
  flex: 1 1 auto;
}
.elementor-location-header .elementor-column.elementor-col-33:last-child {
  flex: 0 0 auto;
}

.elementor-widget-wrap { display: block; }

/* --------------------------------------------------------------------
   Nav menu (jeg-elementor-kit) -> horizontal menu, hide mobile bits
   -------------------------------------------------------------------- */
.jkit-nav-menu .jkit-hamburger-menu {
  display: none;
  background: none;
  border: none;
  font-size: 22px;
  color: #1e293b;
  cursor: pointer;
  padding: 8px;
}

.jkit-nav-identity-panel,
.jkit-nav-menu .jkit-close-menu {
  display: none;
}

.jkit-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.4);
  z-index: 998;
}

.jkit-menu-wrapper,
.jkit-menu-container {
  width: 100%;
}

.jkit-menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 4px 22px;
}

.jkit-menu .menu-item { display: flex; }

.jkit-menu .menu-link {
  display: inline-block;
  padding: 8px 2px;
  color: #1e293b;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .02em;
  white-space: nowrap;
}

.jkit-menu .menu-link:hover,
.jkit-menu .current-menu-item .menu-link {
  color: #046bd2;
}

/* --------------------------------------------------------------------
   Buttons (CONTACT / GET QUOTE)
   -------------------------------------------------------------------- */
.elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #046bd2;
  color: #fff !important;
  padding: 12px 26px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 14px;
  border: none;
  cursor: pointer;
  white-space: nowrap;
}

.elementor-button:hover { background: #045cb4; }

/* --------------------------------------------------------------------
   Hero heading area
   -------------------------------------------------------------------- */
.elementor-top-section .elementor-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 24px;
}

.jkit-heading.align-center { text-align: center; }

.heading-title {
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.3;
  color: #1e293b;
  margin: 0 0 16px;
}

.heading-title .style-color { color: #046bd2; }

/* --------------------------------------------------------------------
   Booking / quote form -> FROM | TO | DATE | PASSENGER | GET QUOTE row
   -------------------------------------------------------------------- */
.elementor-form-fields-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 12px;
  max-width: 1000px;
  margin: 32px auto 0;
  padding: 0 24px;
}

.elementor-form-fields-wrapper > div {
  flex: 1 1 180px;
}

.elementor-form-fields-wrapper .e-form__buttons {
  flex: 0 0 auto;
}

.elementor-field,
.elementor-form input[type="text"],
.elementor-form input[type="date"],
.elementor-form input[type="number"] {
  width: 100%;
  height: 48px;
  padding: 0 14px;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  font-size: 14px;
  color: #334155;
  background: #fff;
}

.elementor-form .elementor-field-label.elementor-screen-only {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.elementor-form-fields-wrapper .e-form__buttons button.elementor-button {
  width: 100%;
  height: 48px;
  background: #64748b;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.elementor-form-fields-wrapper .e-form__buttons button.elementor-button:hover {
  background: #475569;
}

/* --------------------------------------------------------------------
   Generic content sections (destinations / intro copy)
   -------------------------------------------------------------------- */
.elementor-section .elementor-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px 24px;
  align-items: flex-start;
}

.elementor-section .elementor-column {
  min-width: 0;
  align-self: flex-start;
}

@media (min-width: 768px) {
  .elementor-section .elementor-container {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
  }
  .elementor-section .elementor-column.elementor-col-50 {
    flex: 1 1 calc(50% - 16px);
  }
}

h1, h2, h3, h4 { color: #1e293b; font-weight: 600; }
p { line-height: 1.7; }

/* --------------------------------------------------------------------
   Consistent spacing rhythm between sections/widgets.
   Without the page's real generated CSS (post-11.css, loaded from the
   live server) every section falls back to browser defaults, which is
   why gaps look random/too big or too small.
   -------------------------------------------------------------------- */
.elementor-section {
  margin-bottom: 8px;
}

.elementor-widget-wrap > .elementor-element {
  margin-bottom: 18px;
}
.elementor-widget-wrap > .elementor-element:last-child {
  margin-bottom: 0;
}

/* --------------------------------------------------------------------
   Images: cap the reserved box so a failed/slow-loading image doesn't
   leave a huge blank area (browsers reserve space based on the
   width/height attributes in the HTML, e.g. 1200x628, even if the
   image itself never loads).
   -------------------------------------------------------------------- */
img {
  max-width: 100%;
  height: auto;
  display: block;
}

img:not([src]), img[src=""] {
  display: none;
}

.wp-post-image,
.attachment-full {
  max-height: 280px;
  object-fit: cover;
  width: 100%;
}

/* --------------------------------------------------------------------
   Elementor fade-in animations rely on JS (frontend.min.js) to remove
   the "elementor-invisible" class once an element enters the viewport.
   Without that JS the content stays at opacity:0 forever (invisible).
   This forces every such element to show up regardless of JS state.
   -------------------------------------------------------------------- */
.elementor-invisible {
  opacity: 1 !important;
  animation: none !important;
  transform: none !important;
}

/* --------------------------------------------------------------------
   Responsive: stack header + form on small screens
   -------------------------------------------------------------------- */
@media (max-width: 900px) {
  .elementor-location-header .elementor-container {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
  }

  .jkit-nav-menu .jkit-hamburger-menu {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    order: 2;
  }

  /* Column widths on mobile: logo left, hamburger right, contact button wraps below */
  .elementor-location-header .elementor-column.elementor-col-33:nth-child(2) {
    order: 3;
    flex: 1 1 100%;
  }

  /* Menu hidden by default on mobile, opened via .jkit-menu-open (toggled by custom-fix.js) */
  .jkit-menu-wrapper {
    display: none;
    width: 100%;
  }
  .jkit-nav-menu.jkit-menu-open .jkit-menu-wrapper {
    display: block;
  }
  .jkit-nav-menu.jkit-menu-open .jkit-overlay {
    display: block;
  }

  .jkit-menu {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    padding: 8px 0;
  }
  .jkit-menu .menu-link {
    display: block;
    width: 100%;
    padding: 12px 4px;
    border-bottom: 1px solid #eef2f6;
  }

  .elementor-form-fields-wrapper {
    flex-direction: column;
  }
}