/*
 * BFTPANEL runtime layout adjustments.
 * The visual DOM/CSS contract remains stable while data comes
 * from Global ACF / page ACF and business forms are rendered by Contact Form 7.
 * This file is intentionally loaded after every page stylesheet.
 */

/* Global CF7 normalization without changing the original page geometry. */
.bft-cf7-form .wpcf7,
.bft-cf7-form .wpcf7-form {
  width: 100%;
  max-width: 100%;
  margin: 0;
}
.bft-cf7-form .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
}
.bft-cf7-form .wpcf7-not-valid-tip {
  display: block;
  margin-top: 4px;
  color: #b00020;
  font-size: 12px;
  line-height: 1.4;
}
.bft-cf7-form .wpcf7-response-output {
  clear: both;
  margin: 16px 0 0 !important;
}
.bft-cf7-form .wpcf7-spinner {
  vertical-align: middle;
}

/* Home + global quote: normalize CF7 submit controls to the theme button geometry. */
.enquiry-form.bft-cf7-form .form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 19px;
}
.enquiry-form.bft-cf7-form .wpcf7-form > label {
  display: block;
  margin: 1rem 0;
  color: #555;
  font-size: .9rem;
}
.enquiry-form.bft-cf7-form input.wpcf7-submit.button {
  display: block;
  width: 100%;
  min-height: 44px;
  margin-top: .5rem;
  padding: 10px 3.2rem 10px 1.5rem;
  border: 1px solid var(--red);
  border-radius: 0;
  background-color: var(--red);
  background-image: var(--bft-quote-icon, none);
  background-repeat: no-repeat;
  background-position: calc(100% - 20px) 50%;
  background-size: 18px auto;
  color: #fff;
  cursor: pointer;
}
.enquiry-form.bft-cf7-form input.wpcf7-submit.button:hover,
.enquiry-form.bft-cf7-form input.wpcf7-submit.button:focus-visible {
  background-color: var(--main-color2, #8d0c12);
  border-color: var(--main-color2, #8d0c12);
}
#quote-dialog .enquiry-form.bft-cf7-form input.wpcf7-submit.button {
  padding-right: 1.5rem;
  background-image: none;
}

/* Contact: retain the 01/02/03/04 timeline and geometry.
 * CF7 autop is disabled during rendering, so the labels below remain direct
 * grid children just like the original native form. These explicit rules also
 * protect the layout from generic .form-grid declarations elsewhere. */
.wyn-contact .project-inquiry .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
}
.wyn-contact .project-inquiry .choice-grid > .wpcf7-form-control-wrap {
  /* CF7 renders one wrapper for the entire checkbox group. The theme markup
   * had six labels as direct grid children, so this wrapper must span both
   * parent columns before its own two-column list grid is applied. */
  grid-column: 1 / -1;
  min-width: 0;
}
.wyn-contact .project-inquiry .choice-grid > .wpcf7-form-control-wrap > .wpcf7-form-control {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .8rem 1rem;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
}
.wyn-contact .project-inquiry .choice-grid .wpcf7-list-item {
  display: block;
  min-width: 0;
  margin: 0;
}
.wyn-contact .project-inquiry .choice-grid .wpcf7-list-item label {
  display: flex;
  align-items: flex-start;
  gap: .4rem;
  margin: 0;
}
.wyn-contact .project-inquiry .choice-grid .wpcf7-list-item input {
  flex: 0 0 auto;
}
.wyn-contact .project-inquiry .form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 19px !important;
  width: 100%;
}
.wyn-contact .project-inquiry .form-grid > label {
  display: block;
  min-width: 0;
  margin: 0;
}
.wyn-contact .project-inquiry .form-grid > label .wpcf7-form-control-wrap {
  margin-top: .3rem;
}
.wyn-contact .project-inquiry .form-grid input:not([type=radio]):not([type=checkbox]),
.wyn-contact .project-inquiry fieldset > label textarea {
  width: 100%;
  max-width: 100%;
}
.wyn-contact .project-inquiry .project-inquiry-submit {
  display: flex !important;
  justify-content: flex-start;
  align-items: center;
  padding-top: 20px;
}
.wyn-contact .project-inquiry input.wpcf7-submit.button {
  display: inline-flex;
  width: auto !important;
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding: 10px 1.5rem;
  border: 1px solid var(--red);
  border-radius: 0;
  background: var(--red);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
}
.wyn-contact .project-inquiry input.wpcf7-submit.button:hover,
.wyn-contact .project-inquiry input.wpcf7-submit.button:focus-visible {
  background: var(--main-color2, #8d0c12);
  border-color: var(--main-color2, #8d0c12);
}
.wyn-contact .project-inquiry .file-upload {
  position: relative;
}
.wyn-contact .project-inquiry .file-upload .wpcf7-form-control-wrap {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
}
.wyn-contact .project-inquiry .file-upload input[type="file"] {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  cursor: pointer;
}

/* CF7 appends response/status nodes after the visual steps, so stop the old
 * vertical timeline explicitly at step 04 instead of using nth-last-child. */
.wyn-contact .project-inquiry .project-inquiry-items:nth-of-type(4) .lefts::after {
  display: none;
}

/* Global contact/social images use the site icon boxes. */
.wyn-contact .wyn-method .icons img {
  display: block;
  width: 60%;
  height: 60%;
  object-fit: contain;
}
.wyn-follow-links img {
  display: block;
  width: 60%;
  height: 60%;
  object-fit: contain;
}
/* Products/Support: reproduce the old product-form-box DOM contract around CF7. */
.product-form-box.bft-cf7-form .wpcf7,
.product-form-box.bft-cf7-form .wpcf7-form {
  width: 100%;
}
.product-form-box.bft-cf7-form .wpcf7-form > .flexs {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -12px;
  gap: 24px 0;
}
.product-form-box.bft-cf7-form .items .wpcf7-form-control-wrap {
  height: auto;
}
.product-form-box.bft-cf7-form .items select,
.product-form-box.bft-cf7-form .items input:not([type="submit"]) {
  width: 100%;
  height: 43px;
  padding: 0 15px;
}
.product-form-box.bft-cf7-form .bft-cf7-submit-row input.wpcf7-submit.button {
  display: inline-block;
  width: auto;
  min-width: 160px;
  min-height: 44px;
  padding: 10px 3.2rem 10px 1.5rem;
  border: 0;
  background-color: var(--main-color);
  background-image: var(--bft-quote-icon, none);
  background-repeat: no-repeat;
  background-position: calc(100% - 20px) 50%;
  background-size: 18px auto;
  color: #fff;
  cursor: pointer;
}
.product-form-box.bft-cf7-form .bft-cf7-submit-row input.wpcf7-submit.button:hover,
.product-form-box.bft-cf7-form .bft-cf7-submit-row input.wpcf7-submit.button:focus-visible {
  background-color: var(--main-color2, #8d0c12);
}

/* Resources: CF7 adds wrapper spans; keep the original one-line question layout. */
.res-form .quick-question.bft-cf7-form .wpcf7,
.res-form .quick-question.bft-cf7-form .wpcf7-form {
  width: 100%;
}
.res-form .quick-question.bft-cf7-form .bft-quick-question-row {
  display: flex;
  width: 100%;
}
.res-form .quick-question.bft-cf7-form .wpcf7-form-control-wrap {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
}
.res-form .quick-question.bft-cf7-form input[type="text"] {
  width: 100%;
  min-width: 0;
  height: 54px;
  margin: 0;
}
.res-form .quick-question.bft-cf7-form input.wpcf7-submit.button {
  flex: 0 0 184px;
  width: 184px;
  height: 54px;
  margin: 0;
  border: 0;
  background: var(--main-color);
  color: #fff;
  cursor: pointer;
}

@media (max-width: 1100px) {
  /* Match the contact responsive breakpoint from pages.css. */
  .wyn-contact .project-inquiry .choice-grid > .wpcf7-form-control-wrap > .wpcf7-form-control {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 700px) {
  .enquiry-form.bft-cf7-form .form-grid,
  .wyn-contact .project-inquiry .choice-grid > .wpcf7-form-control-wrap > .wpcf7-form-control,
  .wyn-contact .project-inquiry .form-grid {
    grid-template-columns: 1fr !important;
  }
  .res-form .quick-question.bft-cf7-form .bft-quick-question-row {
    display: block;
  }
  .res-form .quick-question.bft-cf7-form input.wpcf7-submit.button {
    width: 100%;
    margin-top: 10px;
  }
}


/* v2.0.1 Contact: keep the original static-page button arrow dimensions. */
.wyn-help .help-audiences .button {
  width: auto;
  max-width: 100%;
  white-space: nowrap;
  gap: 12px;
}
.wyn-help .help-audiences .button .bft-button-arrow {
  display: block;
  width: 15.333px !important;
  height: 13.089px !important;
  min-width: 15.333px;
  max-width: 15.333px;
  flex: 0 0 15.333px;
  overflow: visible;
}
.wyn-help .help-audiences .button .bft-button-arrow path {
  fill: #fff !important;
  stroke: #fff !important;
}

/* v2.0.1 About: the artwork itself already contains number + title overlays. */
.wyn-chain .production-chain figure {
  margin: 0;
}
.wyn-chain .production-chain figure::after,
.wyn-chain .production-chain figure:not(:last-child)::after,
.wyn-chain .production-chain figcaption {
  display: none !important;
  content: none !important;
}
.wyn-chain .production-chain img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 280 / 190;
  object-fit: cover;
}

/* v2.0.4 Project detail: static case-study.html remains the visual source of truth. */
.bft-global-article-social a img,
.bft-global-article-social .bft-social-item img {
  display: block;
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.bft-global-article-social .bft-social-text {
  display: inline-block;
  max-width: 28px;
  overflow: hidden;
  color: #fff;
  font-size: 10px;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* A global social item may intentionally have no URL yet. Keep its icon visible
   and styled exactly like the static article-share links. */
.wyn-article-section .article-share .bft-social-item {
  border: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background-color: #121212;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
}

@media (max-width: 700px) {
  .wyn-help .help-audiences .button {
    white-space: normal;
  }
}

/* v2.0.7 Footer: keep static-page proportions, but make navigation/content useful. */
.site-footer .footer-grid {
  grid-template-columns: 1.15fr 1.28fr 1.08fr 1fr .95fr 1.22fr;
  gap: 2.35rem;
  align-items: start;
}
.site-footer .footer-brand::after {
  display: none !important;
  content: none !important;
}
.site-footer .footer-brand-description {
  max-width: 12rem;
  margin-top: .45rem;
  color: #fff;
  font-size: .6875rem;
  line-height: 1.85;
  text-transform: none;
}
.site-footer .footer-nav h3 a,
.site-footer .footer-contact h3 a {
  color: #fff;
  text-decoration: none;
}
.site-footer .footer-nav h3 a:hover,
.site-footer .footer-contact h3 a:hover {
  color: #ffb5b9;
}
.site-footer .footer-nav ul {
  white-space: normal;
}
.site-footer .footer-nav li {
  line-height: 1.55;
  margin-bottom: .48rem;
}
.site-footer .footer-nav li a {
  display: inline;
  overflow-wrap: anywhere;
}
.footer-social-links {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin-top: 1rem;
}
.footer-social-link {
  display: grid;
  width: 1.75rem;
  height: 1.75rem;
  flex: 0 0 1.75rem;
  place-items: center;
  border: 1px solid #3b3b3b;
  border-radius: 2px;
  background: #151515;
}
.footer-social-link:hover {
  border-color: var(--red, #ad0c14);
  background: var(--red, #ad0c14);
}
.footer-social-link img {
  display: block;
  width: .95rem;
  height: .95rem;
  object-fit: contain;
}
.footer-social-link .wyn-follow-text {
  max-width: 1.2rem;
  overflow: hidden;
  color: #fff;
  font-size: .55rem;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.site-footer .footer-contact {
  min-width: 0;
}
.footer-contact-list {
  display: grid;
  gap: .6rem;
}
.footer-contact-item {
  display: grid;
  grid-template-columns: 1rem minmax(0, 1fr);
  gap: .45rem;
  align-items: start;
  min-width: 0;
}
.footer-contact-icon {
  display: grid;
  width: 1rem;
  height: 1rem;
  margin-top: .08rem;
  place-items: center;
}
.footer-contact-icon img {
  display: block;
  width: .9rem;
  height: .9rem;
  object-fit: contain;
}
.footer-contact-copy {
  display: block;
  min-width: 0;
}
.footer-contact-label {
  display: block;
  margin-bottom: .08rem;
  color: #aaa;
  font-size: .58rem;
  font-weight: 500;
  line-height: 1.25;
  text-transform: uppercase;
}
.footer-contact-value {
  display: block;
  color: #fff;
  font-size: .6875rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
  white-space: normal;
}
a.footer-contact-value:hover {
  color: #ffb5b9;
}

@media (max-width: 1100px) {
  .site-footer .footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2.25rem 2rem;
  }
  .site-footer .footer-brand-description {
    max-width: 18rem;
  }
}

@media (max-width: 700px) {
  .site-footer .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem 1.25rem;
  }
  .site-footer .footer-brand,
  .site-footer .footer-contact {
    grid-column: 1 / -1;
  }
  .site-footer .footer-brand-description {
    max-width: 20rem;
    font-size: 12px;
  }
  .site-footer .footer-nav h3,
  .site-footer .footer-contact h3 {
    font-size: 13px;
  }
  .site-footer .footer-nav ul,
  .footer-contact-value {
    font-size: 12px;
  }
  .footer-contact-label {
    font-size: 10px;
  }
  .footer-social-link {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }
  .footer-social-link img {
    width: 16px;
    height: 16px;
  }
}

/* v2.0.13: Support resource download is intentionally non-interactive when the
   selected Download has no file; normal seeded data keeps this state hidden. */
.support-product .button.is-disabled{opacity:.55;pointer-events:none;cursor:not-allowed}
