/* Shared Contact and B2B composition. The banner owns the desktop-only photo reveal. */
@layer contact-pages {
  :is(body[data-page="contact"], body[data-page="agencies"]) {
    --enquiry-ink: #173a4f;
    --enquiry-gold: #8a642f;
  }
  :is(.contact-page, .agencies-page) .page-banner {
    height: clamp(520px, 68svh, 720px) !important;
  }
  :is(.contact-page, .agencies-page) .page-banner__shade {
    background: linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.38) 55%, rgba(0,0,0,.32)) !important;
  }
  :is(.contact-page, .agencies-page) .page-banner__title {
    max-width: 19ch !important;
    font-size: clamp(48px, 4.6vw, 68px) !important;
    line-height: 1.07 !important;
    text-wrap: balance !important;
  }
  :is(.contact-page, .agencies-page) .page-banner__eyebrow {
    font-size: 16px !important;
    letter-spacing: .04em !important;
    text-transform: none !important;
  }
  :is(.contact-page, .agencies-page) .page-banner__copy { gap: 18px !important; }
  :is(.contact-page, .agencies-page) .page-banner-transition { display: none !important; }
  .enquiry-section {
    display: block !important;
    position: relative !important;
    width: min(1120px, calc(100% - 96px)) !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
    padding: 80px 0 !important;
    background: var(--paper, #f5f5f7) !important;
    color: var(--enquiry-ink) !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  .enquiry-section *, .enquiry-section *::before, .enquiry-section *::after { box-sizing: border-box !important; }
  .enquiry-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) !important;
    gap: clamp(48px, 7vw, 100px) !important;
    align-items: start !important;
  }
  .enquiry-story, .enquiry-details, .enquiry-method, .enquiry-method__meta {
    position: static !important;
    min-width: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    text-align: start !important;
  }
  .enquiry-story h2 {
    max-width: 18ch !important;
    margin: 0 0 24px !important;
    color: var(--enquiry-ink) !important;
    -webkit-text-fill-color: var(--enquiry-ink) !important;
    font: 400 40px/1.15 Georgia, "Times New Roman", serif !important;
    letter-spacing: -.025em !important;
    text-transform: none !important;
    text-wrap: balance !important;
  }
  .enquiry-section p {
    width: auto !important;
    max-width: none !important;
    margin: 0 0 18px !important;
    color: var(--enquiry-ink) !important;
    -webkit-text-fill-color: var(--enquiry-ink) !important;
    font: 400 17px/1.75 Arial, Helvetica, sans-serif !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-align: start !important;
    text-align-last: auto !important;
  }
  .enquiry-section .enquiry-kicker, .enquiry-method__label {
    display: block !important;
    margin: 0 0 10px !important;
    color: var(--enquiry-gold) !important;
    -webkit-text-fill-color: var(--enquiry-gold) !important;
    font: 600 16px/1.4 Arial, Helvetica, sans-serif !important;
    letter-spacing: .025em !important;
    text-transform: none !important;
  }
  .enquiry-details { display: flex !important; flex-direction: column !important; gap: 24px !important; }
  .enquiry-method {
    display: flex !important;
    flex-direction: column !important;
    padding-bottom: 24px !important;
    border-bottom: 1px solid #dedfdc !important;
  }
  .enquiry-method__meta { display: contents !important; }
  .enquiry-method__label { order: 0 !important; }
  .enquiry-method__value {
    display: inline-block !important;
    align-self: flex-start !important;
    order: 1 !important;
    max-width: 100% !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    color: var(--enquiry-ink) !important;
    -webkit-text-fill-color: var(--enquiry-ink) !important;
    font: 400 clamp(20px, 1.8vw, 25px)/1.4 Arial, Helvetica, sans-serif !important;
    letter-spacing: -.025em !important;
    text-decoration: none !important;
    overflow-wrap: anywhere !important;
    direction: ltr !important;
    text-align: start !important;
  }
  .enquiry-method p { order: 2 !important; margin: 0 !important; font-size: 15px !important; line-height: 1.6 !important; }
  .enquiry-method--whatsapp { border: 0 !important; padding: 0 !important; }
  .enquiry-method--whatsapp .enquiry-button { order: 3 !important; margin-top: 16px !important; }
  .enquiry-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: flex-start !important;
    width: fit-content !important;
    max-width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 12px 22px !important;
    border: 1px solid #fff !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #173a4f !important;
    -webkit-text-fill-color: #173a4f !important;
    font: 600 15px/1.4 Arial, Helvetica, sans-serif !important;
    text-decoration: none !important;
    text-transform: none !important;
    text-align: center !important;
    letter-spacing: normal !important;
    box-shadow: none !important;
    transform: none !important;
  }
  .enquiry-button::before, .enquiry-button::after { content: none !important; }
  .enquiry-socials { display: flex !important; gap: 12px !important; margin: 0 !important; }
  .enquiry-socials a {
    display: grid !important; place-items: center !important;
    width: 40px !important; height: 40px !important;
    color: var(--enquiry-ink) !important;
    border: 1px solid #dedfdc !important; border-radius: 50% !important;
  }
  .enquiry-socials svg { width: 18px !important; height: 18px !important; fill: currentColor; stroke: currentColor; stroke-width: 1.6; }
  .enquiry-section a:focus-visible { outline: 2px solid var(--enquiry-ink) !important; outline-offset: 4px !important; }
  @media (hover: hover) and (pointer: fine) {
    .enquiry-button:hover { background: #fff !important; border-color: #fff !important; color: #173a4f !important; -webkit-text-fill-color: #173a4f !important; }
    .enquiry-socials a:hover { background: #e9e5da !important; border-color: #8a642f !important; }
    .enquiry-method__value:hover { text-decoration: underline !important; text-underline-offset: 5px !important; }
  }
  @media (max-width: 959px) {
    :is(.contact-page, .agencies-page) .page-banner { height: clamp(380px, 62svh, 520px) !important; }
    :is(.contact-page, .agencies-page) .page-banner__title { font-size: clamp(36px, 9.4vw, 48px) !important; max-width: 20ch !important; }
    :is(.contact-page, .agencies-page) .page-banner__copy { gap: 14px !important; }
    :is(.contact-page, .agencies-page) .page-banner__image { position: absolute !important; inset: 0 !important; height: 100% !important; }
    .agencies-page .page-banner__image { object-position: 70% center !important; }
    .enquiry-section { width: calc(100% - 40px) !important; max-width: 580px !important; padding: 40px 0 !important; }
    .enquiry-layout { grid-template-columns: minmax(0, 1fr) !important; gap: 28px !important; }
    .enquiry-story h2 { max-width: 22ch !important; margin: 0 auto 20px !important; font-size: 30px !important; text-align: center !important; }
    .enquiry-section p { font-size: 16px !important; line-height: 1.65 !important; text-align: start !important; }
    .enquiry-section p.aq-mobile-copy-one-line { text-align: center !important; }
    .enquiry-section .enquiry-kicker, .enquiry-method__label { text-align: center !important; }
    .enquiry-details { gap: 20px !important; }
    .enquiry-method { align-items: center !important; padding-bottom: 20px !important; text-align: center !important; }
    .enquiry-method__value { align-self: center !important; text-align: center !important; font-size: 22px !important; }
    .enquiry-method p { font-size: 15px !important; text-align: center !important; text-wrap: balance !important; }
    .enquiry-button { align-self: center !important; }
    .enquiry-socials { justify-content: center !important; }
    .enquiry-method--whatsapp { padding-bottom: 0 !important; }
  }
}

/* Desktop footer: navigation left, brand centered, destinations in the former contact column. */
@layer contact-pages {
  @media (min-width: 960px) {
    :is(body[data-page="contact"], body[data-page="agencies"]) .prefooter-nav__inner {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) 250px minmax(0, 1fr) !important;
      grid-template-rows: auto auto !important;
      align-items: center !important;
      gap: 16px 28px !important;
      padding-top: 28px !important;
      border-top: 1px solid #dedfdc !important;
    }
    :is(body[data-page="contact"], body[data-page="agencies"]) .prefooter-nav__links {
      position: static !important;
      display: flex !important;
      flex-wrap: wrap !important;
      justify-content: flex-start !important;
      grid-column: 1 !important;
      grid-row: 1 !important;
      width: 100% !important;
      margin: 0 !important;
      transform: none !important;
    }
    :is(body[data-page="contact"], body[data-page="agencies"]) .prefooter-nav__logo {
      position: static !important;
      grid-column: 2 !important;
      grid-row: 1 !important;
      align-self: center !important;
      justify-self: center !important;
      margin: 0 auto !important;
      transform: none !important;
    }
    :is(body[data-page="contact"], body[data-page="agencies"]) .prefooter-nav__payments {
      display: block !important;
      position: static !important;
      grid-column: 2 !important;
      grid-row: 2 !important;
      justify-self: center !important;
      width: 250px !important;
      margin: 0 auto !important;
      transform: none !important;
    }
    :is(body[data-page="contact"], body[data-page="agencies"]) .prefooter-nav__destinations {
      position: static !important;
      grid-column: 3 !important;
      grid-row: 1 !important;
      justify-content: flex-end !important;
      width: 100% !important;
      margin: 0 !important;
      padding: 0 !important;
      font-size: 12px !important;
      line-height: 1.5 !important;
      text-align: end !important;
      opacity: 1 !important;
      transform: none !important;
    }
    :is(body[data-page="contact"], body[data-page="agencies"]) .prefooter-nav__destinations > span {
      width: 100% !important;
      font-size: 12px !important;
    }
  }
}

/* The photo stays behind the whole page; content scrolls over it until the footer. */
@layer contact-pages {
  :is(body[data-page="contact"], body[data-page="agencies"]) {
    --enquiry-ink: #fff;
    --enquiry-gold: #ead7aa;
  }
  :is(.contact-page, .agencies-page) {
    position: relative !important;
    isolation: isolate !important;
    clip-path: inset(0) !important;
    background: transparent !important;
  }
  :is(.contact-page, .agencies-page)::before {
    content: "" !important;
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    height: 100lvh !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background: linear-gradient(rgba(0, 0, 0, .19), rgba(0, 0, 0, .24)), var(--enquiry-photo) center / cover no-repeat !important;
    filter: brightness(.95) contrast(1.1) saturate(.94) !important;
  }
  .contact-page { --enquiry-photo: url("assets/contact-desert.webp?v=asset-q85-20260928"); }
  .agencies-page { --enquiry-photo: url("assets/agencies-coast.webp?v=asset-q85-20260928"); }
  :is(.contact-page, .agencies-page) .page-banner {
    height: 100vh !important;
    height: 100svh !important;
    background: transparent !important;
    clip-path: none !important;
    isolation: auto !important;
  }
  :is(.contact-page, .agencies-page) :is(.page-banner__image, .page-banner__shade) { display: none !important; }
  .enquiry-section { background: transparent !important; padding-block: 88px 112px !important; }
  .enquiry-method { border-bottom-color: rgba(255, 255, 255, .32) !important; }
  .enquiry-socials a { border-color: rgba(255, 255, 255, .5) !important; }
  .enquiry-button { border-color: rgba(255, 255, 255, .5) !important; }
  :is(body[data-page="contact"], body[data-page="agencies"]) :is(nav.prefooter-nav, footer.site-footer) {
    position: relative !important;
    z-index: 1 !important;
    background: var(--paper, #f5f5f7) !important;
  }
  @media (hover: hover) and (pointer: fine) {
    .enquiry-socials a:hover { color: #173a4f !important; }
  }
  @media (max-width: 959px) {
    .agencies-page::before { background-position: 70% center !important; }
    .enquiry-section { padding-block: 48px 64px !important; }
  }
  @media (prefers-reduced-motion: reduce) {
    :is(.contact-page, .agencies-page)::before { position: absolute !important; height: 100% !important; }
  }
}
