.tgqf {
  --q-primary: var(--tg-primary-color, #062e39);
  --q-accent: var(--tg-accent-color, #1e90ff);
  --q-text: var(--tg-text-color, #565969);
  --q-red: #e21a22;
  --q-line: var(--tg-divider-color, #56596924);
  --q-bg: #f4f6f8;
  --q-ok: #137a4b;
  --q-r: 10px;
  font-family: var(--main-font);
}

.tgqf-formbox .tgqf-lede {
  color: var(--q-text, #565969);
  font-size: 14.5px;
  line-height: 1.6;
  margin-top: -16px;
  margin-bottom: 26px;
}

/* Form card now matches the site's default 50/50 split (same width as the live site) —
   no width override needed here. */

.tgqf-grp { margin-bottom: 16px; }
.tgqf-grp-2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; margin-bottom: 16px; }
.tgqf-grp-2 > * { min-width: 0; }

.tgqf label,
.tgqf-lbl {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--q-primary);
  margin-bottom: 6px;
}
.tgqf-req { color: var(--q-red); margin-left: 2px; }
.tgqf-opt { color: var(--q-text); font-weight: 400; font-size: 12px; margin-left: 5px; }

.tgqf input[type=text],
.tgqf input[type=email],
.tgqf input[type=tel],
.tgqf select,
.tgqf textarea {
  width: 100%;
  border: 1.5px solid var(--q-line);
  border-radius: 8px;
  padding: 10px 14px;
  font-family: var(--main-font);
  font-size: 14.5px;
  color: var(--q-text);
  background: #fff;
  min-height: 42px;
  transition: border-color .15s, box-shadow .15s;
}
.tgqf input::placeholder,
.tgqf textarea::placeholder { color: #9aa3ad; }
.tgqf input:focus,
.tgqf select:focus,
.tgqf textarea:focus {
  border-color: var(--q-accent);
  box-shadow: 0 0 0 3px rgba(30, 144, 255, .12);
  outline: none;
}
.tgqf textarea { min-height: 96px; resize: vertical; line-height: 1.6; }
.tgqf select {
  appearance: none;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23565969' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 18px;
  padding-right: 40px;
}
.tgqf select:disabled { background-color: #f5f7f9; color: #9aa3ad; cursor: not-allowed; }
.tgqf .tgqf-portx { margin-top: 9px; }

/* Country combobox */
.tgqf-cb { position: relative; }
.tgqf .tgqf-cb input.tgqf-cbin {
  padding-left: 38px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23565969' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 12px center;
  background-size: 16px;
}
.tgqf-cb-list {
  position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; right: 0;
  background: #fff; border: 1.5px solid var(--q-line); border-radius: 8px;
  max-height: 240px; overflow-y: auto; box-shadow: 0 16px 40px rgba(6, 46, 57, .18);
  display: none;
}
.tgqf-cb-list.open { display: block; }
.tgqf-cb-o {
  padding: 10px 14px; font-size: 14.5px; cursor: pointer; display: flex; align-items: center;
  gap: 10px; border-bottom: 1px solid var(--q-bg);
  color: var(--q-primary); text-align: left;
}
.tgqf-cb-o:last-child { border-bottom: 0; }
.tgqf-cb-o:hover, .tgqf-cb-o.act { background: #eaf4ff; }
.tgqf-cb-o mark { background: transparent; color: var(--q-accent); font-weight: 700; }
.tgqf-fl { font-size: 17px; line-height: 1; color: var(--q-text); }
/* The form sits inside dark sections whose white text colour would otherwise
   be inherited by the popups and lists (white text on white). */
.tgqf-modal { color: var(--q-primary); text-align: left; }
.tgqf-cb-none { padding: 14px; font-size: 14px; color: var(--q-text); }

/* Origin / destination compact trigger button (opens a popup) */
.tgqf-fieldbtn {
  width: 100%; display: flex; align-items: center; gap: 10px;
  border: 1.5px solid var(--q-line); border-radius: 8px; padding: 10px 14px;
  min-height: 42px; background: #fff; cursor: pointer; text-align: left;
  font-family: var(--main-font); transition: border-color .15s, box-shadow .15s;
}
.tgqf-fieldbtn:hover { border-color: var(--q-accent); }
.tgqf-fieldbtn:focus-visible {
  border-color: var(--q-accent); box-shadow: 0 0 0 3px rgba(30, 144, 255, .12); outline: none;
}
.tgqf-fieldbtn-ic { width: 17px; height: 17px; flex: none; stroke: var(--q-accent); fill: none; stroke-width: 2; }
.tgqf-fieldbtn-text {
  flex: 1; font-size: 14.5px; color: #9aa3ad; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tgqf-fieldbtn-text.tgqf-filled { color: var(--q-primary); font-weight: 500; }
.tgqf-fieldbtn-chev { width: 15px; height: 15px; flex: none; stroke: #9aa3ad; fill: none; stroke-width: 2; }

/* Origin / destination popup */
.tgqf-modal-overlay {
  position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center;
  padding: 20px; background: rgba(6, 46, 57, .55); opacity: 0; transition: opacity .18s ease;
}
.tgqf-modal-overlay.open { opacity: 1; }
.tgqf-modal-overlay[hidden] { display: none; }
.tgqf-modal {
  width: 100%; max-width: 460px; background: #fff; border-radius: 16px;
  box-shadow: 0 24px 60px rgba(6, 46, 57, .3); transform: translateY(10px) scale(.98);
  transition: transform .18s ease; font-family: var(--main-font);
}
.tgqf-modal-overlay.open .tgqf-modal { transform: translateY(0) scale(1); }
.tgqf-modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px; border-bottom: 1px solid var(--q-bg);
}
.tgqf-modal-head h4 { font-size: 18px; font-weight: 700; color: var(--q-primary); margin: 0; }
.tgqf-modal-x {
  width: 30px; height: 30px; display: flex; align-items: center; justify-content: center;
  border: none; background: var(--q-bg); border-radius: 50%; cursor: pointer; padding: 0;
}
.tgqf-modal-x svg { width: 14px; height: 14px; stroke: var(--q-text); fill: none; stroke-width: 2; }
.tgqf-modal-x:hover svg { stroke: var(--q-red); }
.tgqf-modal-body { padding: 20px; }
.tgqf-modal-body .tgqf-grp-2 { margin-bottom: 0; }
.tgqf-modal-foot { padding: 0 20px 20px; }
.tgqf-modal-done {
  width: 100%; background: var(--q-accent); color: #fff; border: none; border-radius: 8px;
  padding: 12px; font-family: var(--main-font); font-size: 14.5px; font-weight: 700; cursor: pointer;
  min-height: 44px; transition: .18s;
}
.tgqf-modal-done:hover { background: var(--q-primary); }
body.tgqf-modal-lock { overflow: hidden; }

/* Mode pills */
.tgqf-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.tgqf-pill {
  border: 1.5px solid var(--q-line); border-radius: 30px; padding: 9px 16px; font-size: 14px;
  font-weight: 500; cursor: pointer; background: #fff; transition: .16s; user-select: none;
  min-height: 40px; display: flex; align-items: center; gap: 6px; font-family: var(--main-font);
  color: var(--q-text);
}
.tgqf-pill:hover { border-color: var(--q-accent); }
.tgqf-pill.on { border-color: var(--q-accent); background: var(--q-accent); color: #fff; }
.tgqf-pill svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.8; }

/* Phone row */
.tgqf-tel { display: grid; grid-template-columns: 100px 1fr; gap: 8px; max-width: 360px; }
.tgqf-tel select { padding-left: 10px; padding-right: 30px; background-position: right 8px center; font-size: 13.5px; }

/* Errors */
.tgqf-err { display: none; font-size: 13px; color: var(--q-red); margin-top: 6px; }
.tgqf-err.on { display: block; }
.tgqf-bad input, .tgqf-bad select, .tgqf-bad textarea, .tgqf-cbin {
  transition: border-color .15s, box-shadow .15s;
}
.tgqf-bad input, .tgqf-bad select, .tgqf-bad textarea { border-color: var(--q-red) !important; background: #fff9f9; }
.tgqf-bad .tgqf-fieldbtn { border-color: var(--q-red) !important; background: #fff9f9; }

.tgqf-hint { font-size: 12.5px; color: var(--q-text); margin-top: 6px; }

.tgqf-submit {
  width: 100%; background: var(--q-accent); color: #fff; border: none; border-radius: 8px;
  padding: 16px; font-family: var(--main-font); font-size: 15.5px; font-weight: 700; cursor: pointer;
  min-height: 52px; margin-top: 6px; display: flex; align-items: center; justify-content: center;
  gap: 10px; transition: .18s;
}
.tgqf-submit:hover { background: var(--q-primary); }
.tgqf-submit:disabled { opacity: .65; cursor: not-allowed; }
.tgqf-submit svg { width: 18px; height: 18px; stroke: #fff; fill: none; stroke-width: 2.2; }

.tgqf-note { font-size: 12.5px; color: var(--q-text); text-align: center; margin-top: 14px; }

/* Inline result message — same treatment as the site's other contact form (.alert / .alert-success / .alert-danger) */
.tgqf-msg {
  padding: 0.75rem 1rem; margin-top: 1rem; border: 1px solid transparent;
  border-radius: 0.375rem; font-size: 0.9rem; font-weight: 600; text-align: center;
}
.tgqf-msg.tgqf-alert-success { color: #0f5132; background-color: #d1e7dd; border-color: #badbcc; }
.tgqf-msg.tgqf-alert-danger { color: #842029; background-color: #f8d7da; border-color: #f5c2c7; }

@media (max-width: 560px) {
  .tgqf-grp-2 { grid-template-columns: 1fr; }
  .tgqf-tel { max-width: none; }
}

/* ==========================================================================
   FAQ + Request-a-Quote form side by side (inner pages)
   FAQs (title + accordion) on the left, the quote form card on the right.
   ========================================================================== */

/* "What We Move" pages — dark why-choose section */
.tg-why-choose-section .tg-why-choose-box--faq-form {
  align-items: flex-start;
}

.tg-why-choose-box--faq-form > .tg-why-choose-content .about-section-title {
  margin-bottom: 30px;
}

/* "Whom We Serve" pages — industry FAQ section */
.ind-faqform-grid.ind-faqform-grid--form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 30px 60px;
}

.ind-faqform-grid--form > .ind-faq-col,
.ind-faqform-grid--form > .tgqf-formbox {
  width: calc(50% - 30px);
}

.ind-faqform-grid--form .ind-faq-accordion {
  column-count: 1;
}

.ind-faqform-grid--form > .tgqf-formbox {
  background: #ffffff;
  border-radius: 40px;
  padding: 50px;
  box-shadow: 0px 0px 30px 0px #0000001a;
}

.ind-faqform-grid--form > .tgqf-formbox h3 {
  font-size: 36px;
  font-weight: 600;
  text-transform: capitalize;
  margin-bottom: 30px;
  color: var(--tg-primary-color, #062e39);
}

@media only screen and (max-width: 991px) {
  .ind-faqform-grid--form > .ind-faq-col,
  .ind-faqform-grid--form > .tgqf-formbox {
    width: 100%;
  }

  .ind-faqform-grid--form > .tgqf-formbox {
    padding: 30px;
    border-radius: 26px;
  }

  .ind-faqform-grid--form > .tgqf-formbox h3 {
    font-size: 30px;
    margin-bottom: 20px;
  }
}