/* Reserve the full flag/dial-code area so national numbers never sit beneath it. */
.contact #enquire .iti input[type="tel"] {
  padding-left: 132px !important;
}

.contact #enquire .iti input[name="phone"] {
  padding-left: 132px !important;
  color: #f4f1ea !important;
  -webkit-text-fill-color: #f4f1ea !important;
  caret-color: #d6b16e;
  background: transparent !important;
  opacity: 1 !important;
  position: relative;
  z-index: 1;
}

/* Keep the enquiry target clear of the fixed navigation when opened directly. */
.contact #enquire {
  scroll-margin-top: 160px;
}

.contact #enquire .iti__selected-country {
  min-width: 116px;
  justify-content: flex-start;
  gap: 7px;
  position: relative;
  z-index: 2;
  width: 116px;
  box-sizing: border-box;
}

.contact #enquire .iti__country-container {
  width: 116px;
  max-width: 116px;
}

.contact #enquire input[name="name"] {
  min-width: 0;
  font-size: 14px;
}

/* Chrome/Edge autofill uses a pale native background. The phone field keeps
   light text for the dark form, so without this override its value appears
   blank even though it is present. Keep every enquiry field visually
   consistent and readable in normal, autofilled and focused states. */
.contact #enquire input:-webkit-autofill,
.contact #enquire input:-webkit-autofill:hover,
.contact #enquire input:-webkit-autofill:focus,
.contact #enquire textarea:-webkit-autofill,
.contact #enquire select:-webkit-autofill {
  -webkit-text-fill-color: #f4f1ea !important;
  caret-color: #d6b16e !important;
  -webkit-box-shadow: 0 0 0 1000px #101512 inset !important;
  box-shadow: 0 0 0 1000px #101512 inset !important;
  border-color: rgba(214, 177, 110, .5) !important;
  transition: background-color 9999s ease-out 0s;
}

.contact #enquire .iti input[name="phone"],
.contact #enquire .iti input[name="phone"]:focus,
.contact #enquire .iti input[name="phone"]:active {
  color: #f4f1ea !important;
  -webkit-text-fill-color: #f4f1ea !important;
  caret-color: #d6b16e !important;
  opacity: 1 !important;
  visibility: visible !important;
  text-shadow: none !important;
}

.contact #enquire .iti input[name="phone"]::selection {
  color: #101512;
  background: #d6b16e;
}

.contact #enquire .field-row {
  grid-template-columns: minmax(0, .92fr) minmax(310px, 1.08fr);
  gap: clamp(20px, 2vw, 34px);
}

/* Maintain navigation clearance at every desktop height and zoom level. */
@media (min-width: 901px) {
  .hero-content {
    top: clamp(122px, 15vh, 160px);
    width: min(760px, 64vw);
    max-width: none;
    padding: clamp(24px, 2.3vw, 38px);
    box-sizing: border-box;
    transform: translate(var(--hero-x, 0), var(--hero-y, 0));
  }

  .hero-content h1 {
    font-size: clamp(62px, 5.35vw, 102px);
  }

  .hero-content .round-link {
    left: calc(100% + 36px);
    bottom: 58px;
  }
}

.contact #enquire .iti__selected-dial-code {
  white-space: nowrap;
}

/* Compact the cinematic hero when browser chrome leaves a short viewport. */
@media (min-width: 901px) and (max-height: 900px) {
  .hero-content {
    top: clamp(122px, 15vh, 150px);
    width: min(760px, 64vw);
    max-width: none;
    padding: 22px 34px 26px;
    box-sizing: border-box;
    transform: translate(var(--hero-x, 0), var(--hero-y, 0));
  }

  .hero-mark {
    width: 155px;
    max-height: 58px;
    margin-bottom: 9px;
  }

  .hero-content h1 {
    margin: 14px 0;
    font-size: clamp(62px, 5.35vw, 96px);
    line-height: .88;
  }

  .hero-content .hero-copy {
    max-width: 610px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 1.55;
  }

  .hero-content .round-link {
    left: calc(100% + 36px);
    bottom: 86px;
    width: 118px;
    height: 118px;
  }

  .hero .slide-meta {
    right: 5vw;
    bottom: 30px;
  }

  .hero .premium-scroll {
    bottom: 18px;
  }
}

@media (min-width: 901px) and (max-width: 1250px) and (max-height: 900px) {
  .hero-content {
    width: min(690px, 70vw);
  }

  .hero-content .round-link {
    left: auto;
    right: -130px;
  }
}

@media (max-width: 680px) {
  .contact #enquire .iti input[type="tel"] {
    padding-left: 124px !important;
  }

  .contact #enquire .iti input[name="phone"] {
    padding-left: 124px !important;
  }

  .contact #enquire .iti__selected-country {
    min-width: 108px;
    width: 108px;
  }

  .contact #enquire .iti__country-container {
    width: 108px;
    max-width: 108px;
  }
}

@media (max-width: 1180px) {
  .contact #enquire .field-row {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}