/* /contact: bluedigital.com contact template. Short navy banner, contact strip over its edge,
   full-bleed split with the underline-field form on navy and "what happens next". */

.bd-contact-hero { background: var(--brand-1); color: #fff; padding: 60px 0 120px; }
.bd-contact-hero :focus-visible { outline-color: #fff; }
.bd-contact-hero__title { color: #fff; font-weight: 800; font-size: clamp(34px, 4.5vw, 56px); margin: 0 0 12px; }
.bd-contact-hero__lead { max-width: 560px; margin: 0; font-size: 18px; color: var(--on-dark); }

/* Contact strip (HOUSE-C): one white card, three items split by hairlines */
.bd-contact-strip-wrap { position: relative; z-index: 2; margin-top: -70px; margin-bottom: 70px; }
.bd-contact-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: #fff; border-radius: var(--bd-r-panel); box-shadow: var(--bd-sh-soft); }
.bd-contact-strip__item { position: relative; display: flex; gap: 16px; align-items: center; padding: 28px 30px; }
.bd-contact-strip__item + .bd-contact-strip__item { border-left: 1px solid #E3E8F3; }
.bd-contact-strip__icon { display: grid; place-items: center; flex: 0 0 52px; height: 52px; border-radius: var(--bd-r-card); background: var(--brand-2); color: #fff; }
.bd-contact-strip__label { display: block; font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--royal); }
.bd-contact-strip__value { font-weight: 700; font-size: 16px; color: var(--brand-1); text-decoration: none; word-break: break-word; }
.bd-contact-strip__value::after { content: ""; position: absolute; inset: 0; }   /* whole item clickable */
.bd-contact-strip__item:hover .bd-contact-strip__value { color: var(--brand-2); }

/* Full-bleed split: navy form panel | light "what happens next" */
.bd-contact-split { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.bd-contact-split__form { padding: 80px clamp(24px, 6vw, 110px); background: var(--brand-1); color: #fff; }
.bd-contact-split__next { padding: 80px clamp(24px, 6vw, 110px); background: var(--surface-soft); }

/* Underline-only fields on navy (bluedigital.com contact form) */
.bd-enquiry--dark { padding: 0; background: none; box-shadow: none; gap: 26px 28px; }
.bd-enquiry--dark:hover, .bd-enquiry--dark:focus-within { box-shadow: none; }
.bd-enquiry--dark .bd-field label { color: #fff; font-size: 13px; letter-spacing: .5px; text-transform: uppercase; }
.bd-enquiry--dark .bd-field label span { color: var(--red-on-navy); }
.bd-enquiry--dark .bd-field input, .bd-enquiry--dark .bd-field select, .bd-enquiry--dark .bd-field textarea {
  padding: 10px 0; border: 0; border-bottom: 1px solid rgba(255, 255, 255, .45); border-radius: 0; background: transparent; color: #fff;
}
.bd-enquiry--dark .bd-field select { padding-right: 24px; }
.bd-enquiry--dark .bd-field select option { color: var(--ink); }
.bd-enquiry--dark .bd-field textarea { min-height: 110px; }
.bd-enquiry--dark .bd-field input:focus, .bd-enquiry--dark .bd-field select:focus, .bd-enquiry--dark .bd-field textarea:focus { border-bottom-color: #fff; box-shadow: 0 1px 0 #fff; }
.bd-enquiry--dark .bd-field [aria-invalid="true"] { border-bottom-color: var(--red-on-navy); }
.bd-enquiry--dark .bd-field__error { color: var(--red-on-navy); }
.bd-enquiry--dark .bd-enquiry__consent { color: var(--on-dark); }
.bd-enquiry--dark .bd-enquiry__consent a { color: #fff; }
.bd-enquiry--dark :focus-visible { outline-color: #fff; }
/* The site-wide red button hovers to navy, which vanishes on this navy panel: hover to white instead. */
.bd-enquiry--dark .bd-btn--red:hover { background: #fff; color: var(--brand-1); }

/* What happens next: numbered steps */
.bd-next { display: grid; gap: 26px; }
.bd-next__item { display: flex; gap: 20px; align-items: flex-start; }
.bd-next__num { flex: 0 0 auto; font-weight: 800; font-size: 40px; line-height: 1; color: var(--brand-2); }
.bd-next__title { margin: 2px 0 4px; font-size: 18px; }
.bd-next__item p { margin: 0; font-size: 14.5px; }
.bd-next__call { margin: 34px 0 0; padding-top: 24px; border-top: 1px solid #DCE3F0; font-weight: 600; color: var(--ink); }

@media (max-width: 980px) {
  .bd-contact-strip { grid-template-columns: 1fr; }
  .bd-contact-strip__item + .bd-contact-strip__item { border-left: 0; border-top: 1px solid #E3E8F3; }
  .bd-contact-split { grid-template-columns: 1fr; }
  .bd-contact-split__form, .bd-contact-split__next { padding: 54px 10%; }
}
@media (max-width: 767px) {
  .bd-contact-hero { padding: 44px 0 100px; }
  .bd-contact-hero__lead { font-size: 16px; }
  .bd-contact-strip-wrap { margin-bottom: 40px; }
  .bd-contact-strip__item { padding: 20px; }
  .bd-contact-split__form, .bd-contact-split__next { padding: 40px 6%; }
}