/* Shared form fields (seo-contact__field/control…, pill inputs from Figma
   243:501) + the site-wide enquiry section (includes/enquiry.php). */
.seo-contact__form { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.seo-contact__field { min-width: 0; }
.seo-contact__field--wide { grid-column: 1 / -1; }
.seo-contact__field label { display: block; margin-bottom: 16px; color: #2a4448; font-size: 14px; font-weight: 500; line-height: normal; }
.seo-contact__field--wide label { margin-bottom: 15px; }
.seo-contact__control { position: relative; display: flex; align-items: center; height: 48px; background: #fffefe; border: 1px solid rgba(144, 162, 177, 0.44); border-radius: 100px; }
.seo-contact__control:focus-within { border-color: #009066; }
.seo-contact__control input, .seo-contact__control textarea, .seo-contact__code { min-width: 0; border: 0; background: transparent; color: #2a4448; font: inherit; font-size: 14px; outline: 0; }
.seo-contact__control input { flex: 1; height: 100%; padding: 0 52px 0 15px; border-radius: inherit; }
.seo-contact__control ::placeholder { color: #5b6074; opacity: 1; }
.seo-contact__icon { position: absolute; top: 11px; right: 15px; pointer-events: none; }
.seo-contact__code { flex: none; width: 81px; height: 100%; padding: 0 0 0 15px; color: #5b6074; appearance: none; cursor: pointer; border-radius: 100px 0 0 100px; }
.seo-contact__code + .seo-contact__chevron { position: absolute; top: 11px; left: 56px; transform: rotate(90deg) scaleY(-1); pointer-events: none; }
.seo-contact__code ~ input { padding-left: 15px; }
.seo-phone-code { position: relative; flex: none; align-self: stretch; }
.seo-phone-code__toggle { display: flex; align-items: center; gap: 8px; height: 100%; padding: 0 12px 0 16px; border: 0; border-right: 1px solid rgba(144, 162, 177, 0.44); border-radius: 100px 0 0 100px; background: #f4f6f8; cursor: pointer; }
.seo-phone-code__caret { width: 0; height: 0; border: 4px solid transparent; border-top-color: #555; border-bottom: 0; }
.seo-phone-code__list { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; width: 300px; max-width: 80vw; max-height: 240px; margin: 0; padding: 4px 0; overflow-y: auto; list-style: none; background: #fff; border: 1px solid rgba(144, 162, 177, 0.44); border-radius: 8px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15); }
.seo-phone-code__list[hidden] { display: none; }
.seo-phone-code__list li { display: flex; align-items: center; gap: 10px; padding: 8px 12px; color: #2a4448; font-size: 14px; cursor: pointer; }
.seo-phone-code__list li:hover, .seo-phone-code__list li[aria-selected] { background: #eef3f1; }
.seo-phone-code__name { flex: 1; min-width: 0; }
.seo-phone-code__dial { color: #999; }
.seo-phone-code ~ .seo-contact__chevron { display: none; }
.seo-phone-code ~ input { padding-left: 15px; }
.seo-contact__control--area { height: 166px; align-items: stretch; border-radius: 10px; }
.seo-contact__control--area textarea { flex: 1; padding: 15px 52px 15px 15px; resize: none; line-height: 1.4; }

.seo-enquiry { padding: clamp(56px, 5.2vw, 100px) 0; background: linear-gradient(180deg, #f2faf6 0%, #e6f5ee 100%); }
.seo-enquiry__inner { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: clamp(32px, 4.2vw, 80px); align-items: center; }
.seo-enquiry__eyebrow { margin: 0 0 12px; color: #009066; font-size: 14px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; }
.seo-enquiry__title { margin: 0 0 16px; color: #2a4448; font-size: clamp(28px, 1.875vw, 36px); font-weight: 500; line-height: 1.2; }
.seo-enquiry__text { margin: 0; color: #5b6074; font-size: 16px; line-height: 1.7; }
.seo-enquiry__points { display: grid; gap: 12px; margin: 24px 0 28px; padding: 0; list-style: none; color: #2a4448; font-size: 15px; font-weight: 500; }
.seo-enquiry__points li { position: relative; padding-left: 30px; }
.seo-enquiry__points li::before { content: ""; position: absolute; top: 1px; left: 0; width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(180deg, #00a759, #009066); }
.seo-enquiry__points li::after { content: ""; position: absolute; top: 6px; left: 7px; width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.seo-enquiry__direct { display: flex; flex-wrap: wrap; gap: 12px; }
.seo-enquiry__direct a { display: inline-flex; align-items: center; gap: 10px; padding: 13px 20px; border-radius: 1000px; background: linear-gradient(90deg, #00a759, #009066); color: #fff; font-size: 15px; font-weight: 600; transition: transform 0.2s ease; }
.seo-enquiry__direct a + a { background: #25d366; }
.seo-enquiry__direct a:hover { transform: translateY(-2px); }
.seo-enquiry__form { padding: clamp(24px, 2.1vw, 40px); border-radius: 20px; background: #fff; box-shadow: 0 20px 50px rgba(0, 80, 50, 0.08); }
.seo-enquiry__form.seo-contact__form { gap: 20px 24px; }
.seo-enquiry__form .seo-contact__field label { margin-bottom: 10px; }
.seo-enquiry__area { height: 110px; }
.seo-enquiry__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.seo-enquiry__note { margin: 0; color: #5b6074; font-size: 13px; }
.seo-enquiry :is(input, select, textarea, button, a):focus-visible { outline: 2px solid #009066; outline-offset: 3px; }

@media (max-width: 991px) {
  .seo-enquiry__inner { grid-template-columns: 1fr; }
}
@media (max-width: 575px) {
  .seo-contact__form { grid-template-columns: 1fr; gap: 20px; }
  .seo-contact__field label { margin-bottom: 10px; }
  .seo-enquiry__actions .seo-btn { width: 100%; }
}

/* Vertical quick-enquiry card on inner-page banners (includes/banner-form.php).
   With the card, the banner grows to fit: pitch + breadcrumb left, card right
   (grid areas); on narrow screens the pitch hides and the card stacks. */
.seo-banner-form { display: grid; gap: 12px; padding: clamp(20px, 1.4583vw, 28px); border-radius: 16px; background: #fff; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.25); color: #2a4448; box-sizing: border-box; }
.seo-banner-form__title { margin: 0; color: #2a4448; font-size: 20px; font-weight: 600; line-height: 1.3; }
.seo-banner-form__text { margin: -6px 0 4px; color: #5b6074; font-size: 14px; line-height: 1.5; }
.seo-banner-form .seo-contact__control { height: 46px; }
.seo-banner-form .seo-contact__icon { top: 10px; }
.seo-banner-form .seo-contact__code + .seo-contact__chevron { top: 10px; }
.seo-banner-form .seo-contact__control--area { height: 92px; }
.seo-banner-form .seo-contact__control--area .seo-contact__icon { top: 11px; }
.seo-banner-form .seo-contact__control--area textarea { padding-top: 12px; padding-bottom: 12px; }
.seo-banner-form__btn.seo-btn { width: 100%; margin-top: 4px; }
.seo-banner-form :is(input, select, textarea, button):focus-visible { outline: 2px solid #009066; outline-offset: 2px; }

.seo-page-banner--form { height: auto; background-position: center; }
.seo-page-banner--form .seo-page-banner__inner,
.seo-blog-hero--form .seo-blog-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 400px); grid-template-areas: "pitch form" "crumb form"; column-gap: 6%; row-gap: 24px; align-items: center; height: auto; padding-top: clamp(110px, 7.3vw, 140px); padding-bottom: 36px; box-sizing: border-box; }
.seo-page-banner__pitch { grid-area: pitch; }
.seo-banner-form { grid-area: form; }
.seo-page-banner--form .seo-breadcrumb,
.seo-blog-hero--form .seo-breadcrumb { grid-area: crumb; position: static; align-self: end; }
.seo-page-banner--form .seo-breadcrumb ol,
.seo-blog-hero--form .seo-breadcrumb ol { justify-content: flex-start; }
.seo-page-banner__eyebrow { margin: 0; font-size: 14px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; opacity: 0.85; }
.seo-page-banner__headline { margin: 12px 0 16px; color: #fff; font-size: clamp(30px, 2.5vw, 48px); font-weight: 600; line-height: 1.15; }
.seo-page-banner__text { max-width: 520px; margin: 0; font-size: 16px; line-height: 1.6; opacity: 0.9; }
.seo-page-banner__call { display: inline-flex; align-items: center; gap: 10px; margin-top: 24px; padding: 12px 20px; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 1000px; color: #fff; font-size: 15px; font-weight: 600; transition: background-color 0.2s ease; }
.seo-page-banner__call:hover { background: rgba(255, 255, 255, 0.12); }

/* Blog hero: title block takes the "pitch" slot, bottom-aligned. */
.seo-blog-hero--form { height: auto; min-height: clamp(460px, 45vw, 864px); }
.seo-blog-hero--form .seo-blog-hero__inner { min-height: inherit; }
.seo-blog-hero--form .seo-blog-hero__content { grid-area: pitch; position: static; align-self: end; }

@media (max-width: 991px) {
  .seo-page-banner--form .seo-page-banner__inner,
  .seo-blog-hero--form .seo-blog-hero__inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "pitch" "form" "crumb"; row-gap: 20px; padding-top: 96px; padding-bottom: 24px; }
  .seo-page-banner--form .seo-page-banner__pitch { display: none; }
  .seo-page-banner--form .seo-page-banner__inner { grid-template-areas: "crumb" "form"; }
  .seo-banner-form { width: 100%; max-width: 520px; }
}
@media (max-width: 767px) {
  .seo-page-banner--form .seo-page-banner__inner,
  .seo-blog-hero--form .seo-blog-hero__inner { padding-top: 88px; padding-bottom: 20px; }
  .seo-page-banner--form .seo-breadcrumb, .seo-blog-hero--form .seo-breadcrumb { left: auto; right: auto; }
  .seo-blog-hero--form .seo-blog-hero__content { right: auto; left: auto; }
}

/* Home mid-page contact band (index.php, #get-started): slim full-width mint
   strip. Heading left; form right on explicit grid areas — 2x2 inputs with
   the button under them and a tall message box in the third column. Stacks
   (heading on top) below 1200px; single column on phones. */
.seo-home-contact { padding: clamp(40px, 3.125vw, 60px) 0; border-block: 1px solid #d9efe4; background: linear-gradient(90deg, #f2faf6 0%, #e6f5ee 100%); color: #2a4448; }
.seo-home-contact__inner { display: grid; grid-template-columns: minmax(0, 0.75fr) minmax(0, 2fr); gap: 24px clamp(40px, 4.2vw, 80px); align-items: center; }
.seo-home-contact__title { margin: 0 0 8px; color: #2a4448; font-size: clamp(24px, 1.6667vw, 32px); font-weight: 600; line-height: 1.25; }
.seo-home-contact__text { margin: 0; color: #5b6074; font-size: 15px; line-height: 1.6; }
.seo-home-contact__form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.15fr) auto; grid-template-areas: "name phone msg btn" "email web msg btn"; gap: 12px; }
/* intl-tel-input: flag + dial code inside the pill */
.seo-home-contact__phone .iti { flex: 1; height: 100%; min-width: 0; }
.seo-home-contact__phone .iti__country-container { padding-left: 6px; }
.seo-home-contact__phone .iti__selected-country { border-radius: 100px 0 0 100px; }
.seo-home-contact__phone .iti__selected-dial-code { color: #5b6074; font-size: 14px; }
.seo-home-contact__name { grid-area: name; }
.seo-home-contact__phone { grid-area: phone; }
.seo-home-contact__email { grid-area: email; }
.seo-home-contact__web { grid-area: web; }
.seo-home-contact__form .seo-home-contact__message { grid-area: msg; height: auto; }
.seo-home-contact__form .seo-home-contact__message textarea { padding-top: 13px; padding-bottom: 13px; }
.seo-home-contact__submit.seo-btn { grid-area: btn; align-self: center; height: 42px; padding: 0 22px; font-size: 15px; }
/* Fields: no focus ring or border change (the caret shows focus); keyboard ring kept on the button only. */
.seo-home-contact .seo-contact__control:focus-within { border-color: rgba(144, 162, 177, 0.44); }
.seo-home-contact :is(input, textarea):focus-visible { outline: 0; }
.seo-home-contact button:focus-visible { outline: 2px solid #009066; outline-offset: 2px; }

@media (max-width: 1199px) {
  .seo-home-contact__inner { grid-template-columns: minmax(0, 1fr); text-align: center; }
  .seo-home-contact__form { text-align: left; }
}
@media (max-width: 767px) {
  .seo-home-contact__form { grid-template-columns: minmax(0, 1fr); grid-template-areas: "name" "phone" "email" "web" "msg" "btn"; }
  .seo-home-contact__form .seo-home-contact__message { min-height: 110px; }
  .seo-home-contact__submit.seo-btn { justify-self: stretch; }
}
