/* contact/wizard.css - WUC enquiry wizard (07/10/26). Site fonts + colours (css/style.css):
   orange #f7941e, charcoal #262d31 / #333c41, green #00a453. Text on orange is charcoal, never white. */
.enq {
  --enq-orange: #f7941e;
  --enq-orange-soft: #fff3e3;
  --enq-ink: #262d31;
  --enq-ink-2: #4a5359;
  --enq-line: #dcdcdc;
  --enq-ok: #00873f;
  --enq-err: #b3261e;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0 0 24px 0;
  padding: 24px 20px;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 12px;
  box-shadow: 0 6px 24px rgba(38, 45, 49, 0.08);
  color: var(--enq-ink);
  font-family: "Gill Sans MT", "Gill Sans", '33535gillsansmt', "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
  font-size: 17px;
  line-height: 1.4;
  clear: both;
  scroll-margin-top: 180px;
}
.enq *, .enq *::before, .enq *::after { box-sizing: border-box; }
.enq [hidden] { display: none !important; }
.enq { position: relative; }
.enq .enq-sr { position: absolute; left: 0; top: 0; width: 1px !important; max-width: 1px; height: 1px; white-space: nowrap; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; }
@media (min-width: 640px) { .enq { padding: 32px; } }
/* Keep prose readable, but align every field, validation icon and primary action
   to the same full-width column. A capped input inside an uncapped wrapper
   leaves its validation tick floating outside the field on desktop. */
.enq .enq-q, .enq p.enq-sub, .enq .enq-fine { max-width: 680px; }
.enq .enq-in, .enq .enq-l, .enq .enq-msg, .enq .enq-go,
.enq .enq-field, .enq .enq-suggest, .enq .enq-radio, .enq .enq-alert { max-width: none; }
.enq form { width: 100%; margin: 0; padding: 0; float: none; }

/* which form shows: the flow needs JS, the basic form is the no-JS fallback */
.enq .enq-flow { display: none; }
.enq.enq-js .enq-flow { display: block; }
.enq.enq-js .enq-basic { display: none; }

/* progress + answer chips */
.enq .enq-top { margin: 0 0 24px; padding-bottom: 20px; border-bottom: 1px solid #ececec; }
.enq .enq-bar { height: 4px; background: #eeeeee; border-radius: 4px; overflow: hidden; }
.enq .enq-bar span { display: block; height: 100%; width: 20%; background: var(--enq-orange); border-radius: 4px; transition: width .3s ease-out; }
.enq .enq-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; min-height: 0; }
.enq .enq-chips:empty { display: none; }
.enq .enq-chip {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  min-height: 44px; padding: 8px 12px; margin: 0;
  font: inherit; font-size: 14px; color: var(--enq-ink); text-align: left;
  background: var(--enq-orange-soft); border: 1px solid #f6d3a6; border-radius: 999px; cursor: pointer;
  white-space: nowrap; overflow: hidden;
  animation: enq-pop .2s ease-out;
}
.enq .enq-chip-l { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.enq .enq-chip::before { content: "\2713"; color: var(--enq-ok); font-weight: bold; }
.enq .enq-chip:hover { border-color: var(--enq-orange); }
.enq .enq-chip:focus-visible { outline: 3px solid var(--enq-ink); outline-offset: 2px; }
/* C3 (wave 2): Back on the same row as the progress cue, and a one-time "Tap to change" hint after the chips */
.enq .enq-toprow { display: flex; align-items: center; gap: 12px; }
.enq .enq-toprow .enq-strip { flex: 1 1 auto; min-width: 0; }
.enq .enq-back.enq-back-top { flex: 0 0 auto; min-height: 48px; margin: 0; padding: 0 8px 0 0; }
.enq .enq-chip-hint { align-self: center; font-size: 13px; color: var(--enq-ink-2); animation: enq-pop .2s ease-out; }

/* question screens */
.enq .enq-step { display: none; }
.enq .enq-step.enq-active { display: block; animation: enq-in .25s ease-out; }
.enq .enq-step.enq-active.enq-rev { animation-name: enq-in-rev; }
.enq h2.enq-q, .enq .enq-q label {
  margin: 0 0 8px; padding: 0; font: inherit; font-size: 24px; font-weight: bold; line-height: 1.25;
  color: var(--enq-ink); text-transform: none; letter-spacing: 0; background: none; border: 0; float: none; width: auto; display: block;
}
.enq h2.enq-q:focus { outline: none; }
.enq .enq-q label { margin: 0; }
.enq p.enq-sub { margin: 0 0 20px; font-size: 16px; line-height: 1.5; color: var(--enq-ink-2); }

/* tiles: 2 columns on phones, 3 on wider screens */
.enq .enq-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
@media (min-width: 640px) { .enq .enq-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
.enq .enq-tiles.enq-tiles-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.enq .enq-tiles .enq-tile-wide { grid-column: 1 / -1; min-height: 88px; }   /* R-Q54: the cut-list tile spans the row under sawn/planed */
.enq .enq-tile {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  min-height: 112px; width: 100%; margin: 0; padding: 16px 8px;
  font: inherit; color: var(--enq-ink) !important; text-align: center; text-decoration: none !important;
  background: #fff; border: 1.5px solid var(--enq-line); border-radius: 12px; cursor: pointer;
  transition: border-color .15s ease-out, background-color .15s ease-out, transform .1s ease-out, box-shadow .15s ease-out;
  float: none; text-transform: none;
}
@media (hover: hover) { .enq .enq-tile:hover { border-color: var(--enq-orange); background: var(--enq-orange-soft); box-shadow: 0 3px 10px rgba(247, 148, 30, 0.18); } }
.enq .enq-tile:focus-visible { outline: 3px solid var(--enq-ink); outline-offset: 2px; }
.enq .enq-tile:active, .enq .enq-tile.enq-picked { transform: scale(0.97); border-color: var(--enq-orange); background: var(--enq-orange-soft); }
.enq .enq-ic { width: 32px; height: 32px; color: #d97706; flex: 0 0 auto; }
/* tiles with an existing site image (silhouette or photo); the SVG icon is the fallback */
.enq .enq-tile.enq-has-img > .enq-ic { display: none; }
.enq .enq-tile.enq-noimg > .enq-img { display: none; }
.enq .enq-tile.enq-noimg > .enq-ic { display: block; }
.enq .enq-img { display: block; flex: 0 0 auto; margin: 0 0 8px 0; background: #fff; }
.enq .enq-img-profile { width: 80px; height: 80px; object-fit: contain; }
.enq .enq-img-photo { width: 100%; height: 88px; object-fit: cover; border-radius: 8px; }
.enq .enq-tile.enq-has-img { justify-content: flex-start; }
.enq .enq-tl { display: block; font-size: 16px; font-weight: bold; line-height: 1.2; }
.enq .enq-ts { display: block; font-size: 13px; color: var(--enq-ink-2); line-height: 1.2; }

/* fields */
.enq .enq-l { display: block; margin: 20px 0 8px; padding: 0; font-size: 16px; font-weight: bold; color: var(--enq-ink); float: none; width: auto; text-transform: none; }
.enq .enq-opt { font-weight: normal; color: var(--enq-ink-2); }
.enq .enq-in {
  display: block; width: 100%; min-height: 50px; margin: 0; padding: 10px 14px;
  font: inherit; font-size: 17px; color: var(--enq-ink);
  background: #fff; border: 1.5px solid #c9c9c9; border-radius: 10px; box-shadow: none; float: none;
}
.enq textarea.enq-in { min-height: 140px; resize: vertical; line-height: 1.5; }
.enq .enq-in:focus { outline: none; border-color: var(--enq-orange); box-shadow: 0 0 0 3px rgba(247, 148, 30, 0.25); }
.enq .enq-field { position: relative; width: 100%; }
.enq .enq-field .enq-in { padding-right: 46px; }
.enq .enq-tick { position: absolute; right: 12px; top: 50%; transform: translateY(-50%) scale(0.4); width: 26px; height: 26px; border-radius: 50%; background: var(--enq-ok); opacity: 0; transition: opacity .2s ease-out, transform .2s ease-out; pointer-events: none; }
.enq .enq-tick::after { content: "\2713"; position: absolute; left: 0; right: 0; top: 0; line-height: 26px; text-align: center; color: #fff; font-size: 16px; font-weight: bold; }
.enq .enq-field.enq-ok .enq-in { border-color: var(--enq-ok); }
.enq .enq-field.enq-ok .enq-tick { opacity: 1; transform: translateY(-50%) scale(1); }
.enq .enq-msg { margin: 8px 0 0 0; font-size: 15px; color: var(--enq-err); }
.enq .enq-in[aria-invalid="true"] { border-color: var(--enq-err); }
.enq .enq-alert { margin: 0 0 14px 0; padding: 10px 14px; font-size: 15px; color: var(--enq-err); background: #fdecea; border-radius: 8px; }

/* buttons */
.enq .enq-go {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; min-height: 56px; height: auto; margin: 24px 0 0; padding: 14px 20px;
  font: inherit; font-size: 18px; font-weight: bold; color: var(--enq-ink); text-align: center;
  background: var(--enq-orange); border: 0; border-radius: 10px; cursor: pointer; float: none; text-transform: none; line-height: 1.35; white-space: normal;
  transition: background-color .15s ease-out, transform .1s ease-out;
}
@media (hover: hover) { .enq .enq-go:hover { background: #ffa53d; } }
.enq .enq-go:active { transform: scale(0.98); }
.enq .enq-go:focus-visible { outline: 3px solid var(--enq-ink); outline-offset: 2px; }
.enq .enq-go[disabled] { opacity: .7; cursor: default; }
.enq .enq-final::after { content: " \2192"; }
.enq .enq-go.enq-loading::after { content: ""; display: inline-block; width: 16px; height: 16px; margin-left: 8px; vertical-align: -2px; border: 2px solid var(--enq-ink); border-right-color: transparent; border-radius: 50%; animation: enq-spin .7s linear infinite; }
@keyframes enq-spin { to { transform: rotate(360deg); } }
.enq .enq-link, .enq .enq-back {
  min-height: 48px; margin: 8px 0 0 0; padding: 10px 4px;
  font: inherit; font-size: 16px; color: var(--enq-ink); text-decoration: underline;
  background: none; border: 0; cursor: pointer; float: none;
}
.enq .enq-link:focus-visible, .enq .enq-back:focus-visible { outline: 3px solid var(--enq-ink); outline-offset: 2px; }
.enq .enq-foot { min-height: 0; margin-top: 20px; padding-top: 12px; border-top: 1px solid #ececec; }
.enq.enq-at-start .enq-foot { display: none; }
.enq .enq-foot .enq-back { margin: 0; }
.enq .enq-fine { margin: 10px 0 0 0; font-size: 14px; color: var(--enq-ink-2); }
.enq .enq-fine a { color: var(--enq-ink); text-decoration: underline; }

/* ===== wave 2 copy build (C2, C4 to C8) ===== */
/* C5: 3-step strip; the grey track runs between the first and last dot, the orange fill shows progress */
.enq .enq-strip { position: relative; }
.enq .enq-toprow .enq-strip { max-width: 520px; margin: 0 auto; }   /* W2P-L3: the 3 dots sit closer, centred */
.enq .enq-strip .enq-bar { position: absolute; left: 16.667%; right: 16.667%; top: 5px; height: 3px; border-radius: 3px; }
.enq ol.enq-s3 { position: relative; display: flex; margin: 0; padding: 0; list-style: none; }
.enq ol.enq-s3 li { position: relative; flex: 1 1 0; min-width: 0; margin: 0; padding: 18px 2px 0 2px; list-style: none; text-align: center; font-size: 13px; line-height: 1.2; color: var(--enq-ink-2); background: none; float: none; width: auto; }
.enq ol.enq-s3 li::marker { content: ""; }
.enq ol.enq-s3 li::before { content: ""; position: absolute; top: 0; left: 50%; width: 13px; height: 13px; margin-left: -6.5px; border: 2px solid #cfcfcf; border-radius: 50%; background: #fff; box-sizing: border-box; transition: background-color .2s ease-out, border-color .2s ease-out; }
.enq ol.enq-s3 li.enq-s3-on { color: var(--enq-ink); font-weight: bold; }
.enq ol.enq-s3 li.enq-s3-on::before { background: var(--enq-orange); border-color: var(--enq-orange); }
/* C4: 3 tiles - one row of 3 from 640px, stacked rows on phones (no orphan tile) */
@media (max-width: 639px) {
  .enq .enq-tiles.enq-tiles-3 { grid-template-columns: 1fr; }
  .enq .enq-tiles-3 .enq-tile { display: grid; grid-template-columns: 32px 1fr; column-gap: 14px; row-gap: 2px; align-items: center; justify-items: start; min-height: 72px; padding: 12px 16px; text-align: left; }
  .enq .enq-tiles-3 .enq-tile .enq-ic { grid-row: 1 / span 2; }
}
/* C4: "Or just tell us" */
.enq .enq-ask { margin: 18px 0 0 0; max-width: none; }
.enq .enq-askrow .enq-in, .enq .enq-askrow .enq-go { max-width: none; }   /* W2P-L1: the line spans the same width as the tile row */
.enq .enq-askrow { display: flex; gap: 8px; align-items: stretch; }
.enq .enq-askrow .enq-in { flex: 1 1 auto; min-width: 0; }
.enq .enq-go.enq-ask-go { flex: 0 0 auto; width: auto; min-width: 72px; margin: 0; }
@media (max-width: 639px) {
  .enq .enq-askrow { flex-direction: column; gap: 12px; }
  .enq .enq-go.enq-ask-go { width: 100%; }
  .enq .enq-toprow { flex-wrap: wrap; gap: 12px; }
  .enq .enq-toprow .enq-strip { flex-basis: 100%; order: -1; }
}
/* C4: the quiet row - plain text links; with JS it shows on the first screen only */
.enq .enq-quiet { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 20px 0 0 0; padding: 12px 0 0 0; border-top: 1px solid #ececec; font-size: 15px; }
.enq .enq-qsep { color: #9aa0a4; }   /* W2P-B-R1 */
.enq.enq-js .enq-quiet { display: none; }
.enq.enq-js.enq-at-start .enq-quiet { display: flex; }
/* Quiet routes remain comfortable tap targets on phones, without squeezing four labels into one line. */
@media (max-width: 480px) {
  .enq .enq-quiet, .enq.enq-js.enq-at-start .enq-quiet { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 12px; }
  .enq .enq-qsep { display: none; }
}
@media (max-width: 374px) {
  .enq .enq-quiet, .enq.enq-js.enq-at-start .enq-quiet { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.enq .enq-quiet a { display: inline-flex; align-items: center; min-height: 44px; color: var(--enq-ink-2) !important; text-decoration: underline; }
.enq .enq-quiet a:hover { color: var(--enq-ink) !important; }
.enq .enq-quiet a:focus-visible { outline: 3px solid var(--enq-ink); outline-offset: 2px; }
/* C7: made-to-order explainer, closed by default */
.enq .enq-explain { max-width: none; width: 100%; margin: -14px 0 6px 0; font-size: 15px; color: var(--enq-ink-2); }   /* W2P-L2: closer to the tiles */
.enq .enq-explain summary { display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--enq-ink); text-decoration: underline; }
.enq .enq-explain summary:focus-visible { outline: 3px solid var(--enq-ink); outline-offset: 2px; }
.enq .enq-explain p { box-sizing: border-box; width: 100%; max-width: none; margin: 0 0 4px 0; padding: 10px 14px; background: var(--enq-orange-soft); border-radius: 10px; }
/* C6: reflection of the previous answer */
.enq p.enq-reflect { max-width: 640px; margin: 0 0 4px 0; font-size: 15px; color: var(--enq-ink-2); }
/* C8: request card fanning out to supplier cards (the final positions are the resting style, so reduced motion shows them still) */
.enq .enq-fan { position: relative; max-width: 640px; height: 64px; margin: 18px 0 0 0; }
.enq .enq-fan i { position: absolute; left: 50%; top: 10px; width: 52px; height: 38px; margin-left: -26px; border: 1.5px solid var(--enq-orange); border-radius: 8px; background: #fff; box-shadow: 0 3px 10px rgba(38, 45, 49, 0.12); animation: enq-fan .6s ease-out both; }
.enq .enq-fan i.enq-fan-s1 { transform: translateX(-84px) rotate(-6deg); }
.enq .enq-fan i.enq-fan-s2 { transform: translateY(-6px); }
.enq .enq-fan i.enq-fan-s3 { transform: translateX(84px) rotate(6deg); }
.enq .enq-fan i.enq-fan-req { background: var(--enq-orange-soft); animation-name: enq-fan-req; }
@keyframes enq-fan { from { opacity: 0; transform: none; } }
@keyframes enq-fan-req { 0% { opacity: 1; } 100% { opacity: 0; } }
/* css/style.css sets "div#inner-text p" and "div#inner-text ol" (an id selector), so the wave 2 text is scoped by the wizard's id to keep its intended size */
#wizard ol.enq-s3 { margin: 0; font-size: 13px; }
#wizard p.enq-sg { font-size: 18px; }
#wizard p.enq-reflect, #wizard .enq-explain p { font-size: 15px; }
#wizard p.enq-sub { font-size: 16px; line-height: 1.5; }
#wizard p.enq-fine { font-size: 14px; line-height: 1.5; }

/* free-text suggestion */
.enq .enq-suggest { margin: 14px 0 0 0; padding: 14px; background: var(--enq-orange-soft); border-radius: 10px; animation: enq-pop .2s ease-out; }
.enq p.enq-sg { margin: 0; font-size: 18px; line-height: 1.3; color: var(--enq-ink); }

/* no-JS form */
.enq .enq-basic .enq-fs { margin: 0; padding: 0; border: 0; }
.enq .enq-radio { display: flex; align-items: center; gap: 10px; min-height: 48px; margin: 0 0 6px 0; padding: 8px 12px; font-size: 16px; border: 1.5px solid var(--enq-line); border-radius: 10px; cursor: pointer; float: none; width: auto; }
.enq .enq-radio input { width: 20px; height: 20px; margin: 0; }

/* ===== contact page (contact/index.cfm) ===== */
.enq-page { clear: both; font-family: "Gill Sans MT", "Gill Sans", '33535gillsansmt', "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; color: #262d31; }
.enq-page h1.enq-h1 { margin: 24px 0 8px 0; padding: 0; font-size: 32px; line-height: 1.2; font-weight: bold; color: #262d31; text-transform: none; }
.contact-form.enq-noform { display: none !important; }
/* Secondary enquiry routes: a single full-width, clearly labelled destination. */
.contact-page .contact-form { display: block; width: 100%; }
.contact-page .contact-form #contact-us { box-sizing: border-box; width: 100%; max-width: none; margin: 0; float: none; scroll-margin-top: 180px; }
.enq-route-nav { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 20px 0 8px; font-size: 16px; }
.contact-page .enq-route-nav a { display: inline-flex; align-items: center; min-height: 44px; color: #262d31 !important; text-decoration: underline !important; }
.enq-route-nav a[aria-current] { font-weight: bold; text-decoration-thickness: 2px; }
.contact-page .enq-secondary { margin: 16px 0 28px; font-family: "Gill Sans MT", "Gill Sans", '33535gillsansmt', "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; }
.contact-page .enq-secondary:not(.enq-partner) #contact-us { padding: 32px; border: 1px solid #ddd; border-radius: 14px; background: #fff; }
.contact-page .enq-secondary #contact-us h1 { margin: 0 0 16px; font-size: 32px; line-height: 1.15; color: #262d31; text-transform: none; }
.contact-page .enq-secondary #contact-us p { font-size: 17px; line-height: 1.5; margin: 0 0 16px; }
.contact-page .enq-secondary #contact-us fieldset { box-sizing: border-box; width: 100%; padding: 0; margin: 20px 0; border: 0; }
.contact-page .enq-secondary #contact-us input[type=text],
.contact-page .enq-secondary #contact-us textarea { box-sizing: border-box; width: 100%; max-width: none; padding: 14px 16px; font-size: 17px; border-radius: 8px; min-height: 52px; }
.contact-page .enq-secondary #contact-us label { display: block; margin-bottom: 8px; font-size: 17px; }
.contact-page .enq-secondary #contact-us button.send-email,
.contact-page #contact-us a.enq-route-cta { box-sizing: border-box; display: flex; justify-content: center; align-items: center; width: 100%; max-width: none; min-height: 56px; height: auto; padding: 14px 20px; border: 2px solid #f7941e; border-radius: 9px; background: #f7941e; color: #262d31 !important; font-size: 18px; font-weight: bold; text-align: center; text-decoration: none !important; }
.contact-page .enq-secondary #contact-us p a:not(.enq-route-cta):not(.enq-pbtn) { color: #262d31 !important; text-decoration: underline !important; }
.enq-route-nav a:focus-visible, .enq-secondary a:focus-visible, .enq-secondary summary:focus-visible { outline: 3px solid #a54c00; outline-offset: 4px; }

/* Supplier pitch: full-width hero, business benefits and FAQ, without invented figures. */
.enq-partner-card, .enq-partner-card * { box-sizing: border-box; }
.enq-partner-card { width: 100%; margin: 0; border: 1px solid #dce2df; border-radius: 16px; background: #fff; color: #262d31; overflow: hidden; box-shadow: 0 8px 28px rgba(38,45,49,.07); }
.enq-partner-hero { padding: 40px; background: #262d31; color: #fff; }
.contact-page #contact-us .enq-partner-card p { font-size: 15px; }
.contact-page .enq-partner #contact-us h1 { color: #fff; font-size: 32px; line-height: 1.08; margin: 0 0 20px; letter-spacing: normal; }
.contact-page #contact-us .enq-partner-hero p { color: #fff; max-width: 740px; }
.contact-page #contact-us .enq-partner-card .enq-eyebrow { font-size: 12px; font-weight: bold; letter-spacing: .12em; margin-bottom: 16px; }
.contact-page #contact-us .enq-partner-card .enq-partner-lead { font-size: 20px; line-height: 1.35; font-weight: bold; }
.contact-page #contact-us .enq-partner-card a.enq-pbtn { display: flex; gap: 14px; justify-content: center; align-items: center; width: 100%; min-height: 60px; margin: 24px 0 12px; padding: 16px 24px; border: 2px solid #f7941e; border-radius: 9px; background: #f7941e; color: #262d31 !important; font-size: 16px; line-height: 1.3; font-weight: bold; text-align: center; text-decoration: none !important; }
.enq-partner-card .enq-pbtn span { flex-shrink: 0; font-size: 24px; }
.contact-page #contact-us .enq-partner-card .enq-small { max-width: none; font-size: 14px; line-height: 1.5; margin: 12px 0 0; }
.enq-partner-hero a:focus-visible { outline-color: #fff; }
.enq-partner-section { display: block; padding: 32px 40px; border-top: 1px solid #e1e6e3; }
.contact-page #contact-us .enq-partner-section h2 { margin: 0 0 16px; padding: 0; font-size: 25px; line-height: 1.2; color: #262d31; text-transform: none; }
.enq-benefit-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
.enq-benefit { min-width: 0; padding: 24px; border: 1px solid #dce2df; border-radius: 10px; }
.enq-feature-tag { display: block; font-size: 12px; font-weight: bold; color: #262d31; letter-spacing: .08em; margin-bottom: 12px; }
.contact-page #contact-us .enq-benefit h3 { font-size: 20px; line-height: 1.2; margin: 0 0 12px; padding: 0; color: #262d31; text-transform: none; }
.enq-cost-section { background: #f5f5f5; }
.enq-partner-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; list-style: decimal; margin: 0; padding: 0 0 0 22px; }
.enq-partner-steps li { padding: 0 8px 0 0; font-size: 15px; line-height: 1.5; }
.enq-partner-steps li::marker { color: #262d31; font-weight: bold; }
.enq-partner-steps strong, .enq-partner-steps span { display: block; }
.enq-partner-steps span { margin-top: 8px; }
.enq-partner-faq details { border-bottom: 1px solid #e1e6e3; }
.enq-partner-faq summary { padding: 16px 4px; font-size: 18px; line-height: 1.4; font-weight: bold; cursor: pointer; }
.contact-page #contact-us .enq-partner-faq details p { margin: 0 4px 20px; }
.enq-partner-close { background: #f5f5f5; }
.contact-page #contact-us .enq-partner-card .enq-plinks { display: flex; flex-wrap: wrap; gap: 4px 24px; margin: 20px 0 0; }
.enq-plinks a { display: inline-flex; align-items: center; min-height: 44px; }
@media (hover: hover) { .contact-page #contact-us .enq-partner-card a.enq-pbtn:hover, .contact-page #contact-us a.enq-route-cta:hover { background: #ffa53d; border-color: #ffa53d; } }
@media (max-width: 640px) {
  .contact-page .contact-form #contact-us { scroll-margin-top: 112px; }
  .contact-page .enq-secondary:not(.enq-partner) #contact-us { padding: 24px 16px; }
  .enq-partner-hero, .enq-partner-section { padding: 28px 20px; }
  .enq-benefit-grid, .enq-partner-steps { grid-template-columns: minmax(0,1fr); }
  .contact-page #contact-us .enq-partner-card a.enq-pbtn { font-size: 16px; padding: 16px; }
  .enq-partner-steps { gap: 20px; }
  .contact-page #contact-us .enq-partner-section h2 { font-size: 25px; }
}
@media (max-width: 360px) {
  .enq-partner-hero, .enq-partner-section { padding: 24px 16px; }
  .contact-page .enq-secondary:not(.enq-partner) #contact-us { padding: 20px 12px; }
  .contact-page #contact-us .enq-partner-card a.enq-pbtn { font-size: 16px; }
}
/* P-S16-8 (Paul 10/10/26 "font sizing hierarchy... a better read"): one clear type scale for the supplier pitch,
   scoped to the partner card: h1 40 > h2 28 > h3/lead 21 > FAQ question 18 > body 17 > small 15 > eyebrow/tag 13 (px). */
.contact-page #contact-us .enq-partner-card p,
.contact-page #contact-us .enq-partner-card li { font-size: 17px; line-height: 1.55; }
.contact-page .enq-partner #contact-us .enq-partner-hero h1 { font-size: 40px; line-height: 1.1; }
.contact-page #contact-us .enq-partner-card .enq-partner-lead { font-size: 21px; line-height: 1.35; }
.contact-page #contact-us .enq-partner-section h2 { font-size: 28px; line-height: 1.2; }
.contact-page #contact-us .enq-benefit h3 { font-size: 21px; }
.contact-page #contact-us .enq-partner-card .enq-eyebrow,
.contact-page #contact-us .enq-partner-card .enq-feature-tag { font-size: 13px; }
.contact-page #contact-us .enq-partner-card .enq-small { font-size: 15px; }
.contact-page #contact-us .enq-partner-steps strong { font-size: 18px; }
.contact-page #contact-us .enq-partner-faq summary { font-size: 18px; }
.contact-page #contact-us .enq-partner-card a.enq-pbtn { font-size: 18px; }
@media (max-width: 640px) {
  .contact-page .enq-partner #contact-us .enq-partner-hero h1 { font-size: 32px; }
  .contact-page #contact-us .enq-partner-section h2 { font-size: 24px; }
  .contact-page #contact-us .enq-partner-card .enq-partner-lead { font-size: 19px; }
}
.enq-company { clear: both; float: none !important; width: 100% !important; max-width: none !important; margin: 0 0 24px 0 !important; padding: 16px 0 0 0 !important; border-top: 1px solid #ececec; font-size: 13px; line-height: 1.5; color: #4a5359; }
.enq-company p { margin: 0 0 8px 0; font-size: 13px; }
.enq-company a { color: #262d31; text-decoration: underline; }
.enq-company .enq-social { display: flex !important; flex-wrap: wrap; gap: 8px; }
.enq-company .enq-social a { display: inline-flex !important; float: none !important; width: auto !important; margin: 0 !important; }
.enq-company .enq-social img { width: 24px !important; height: 24px !important; max-width: 24px !important; }

/* "Where is my order?" modal (contact/index.cfm #openModal): readable on phones, real backdrop, big close target */
#openModal:not(:target), #openModalEmail:not(:target) { display: none; }
#openModal:target { background: rgba(38, 45, 49, 0.55); }
#openModal .dialog { box-sizing: border-box; width: auto; max-width: min(440px, calc(100vw - 32px)); margin: 96px auto 0 auto; padding: 24px; background: #fff; color: #262d31; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25); }
#openModal .dialog h2 { margin: 0 0 16px 0; padding-right: 48px; font-size: 22px; text-transform: none; color: #262d31; }
#openModal .dialog p { font-size: 16px; line-height: 1.4; margin: 0 0 8px 0; }
#openModal .dialog a.close { position: absolute; top: 8px; right: 8px; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; font-size: 18px; color: #262d31; text-decoration: none; }
#openModal .dialog a.login-btn { max-width: none; height: 48px; margin: 16px 0 0 0; color: #262d31; font-weight: bold; text-transform: none; border-radius: 10px; }

@keyframes enq-in { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: none; } }
@keyframes enq-in-rev { from { opacity: 0; transform: translateX(-18px); } to { opacity: 1; transform: none; } }
@keyframes enq-pop { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .enq *, .enq *::before, .enq *::after, .enq-page * { animation: none !important; transition: none !important; }
  .enq .enq-go.enq-loading::after { animation: enq-spin 1.5s linear infinite !important; }
}
@media (max-width: 400px) {
  .enq { padding: 20px 16px; border-radius: 10px; }
  .enq h2.enq-q, .enq .enq-q label { font-size: 22px; }
  .enq .enq-tile { min-height: 104px; }
}

/* ===== Wave 4 (12/10/26, Paul): supplier panel (?penquiry=4) visuals - icon flow, icon chips, swap strip,
   numbered steps, compact FAQ. Site palette only (orange #f7941e, soft #fff3e3, ink #262d31 / #4a5359, line #dce2df, grey #f5f5f5).
   Motion: .enq-anim is added by the inline script in index.cfm only when motion is allowed; without it all is visible. */
.enq-partner-card svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.enq-partner-card svg .enq-fill { fill: currentColor; }
/* flow: 4 nodes on one connecting line */
.enq-partner-card .enq-flow { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; list-style: none; margin: 8px 0 0; padding: 0; counter-reset: none; }
.enq-partner-card .enq-flow::before, .enq-partner-card .enq-flow::after { content: ""; position: absolute; top: 31px; left: 12.5%; right: 12.5%; height: 3px; border-radius: 3px; background: #dce2df; }
.enq-partner-card .enq-flow::after { background: #f7941e; transform-origin: left center; }
.contact-page #contact-us .enq-flow li { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; margin: 0; padding: 0 4px; font-size: 15px; line-height: 1.4; color: #4a5359; }
.enq-ficon { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin-bottom: 14px; border: 3px solid #f7941e; border-radius: 50%; background: #fff3e3; color: #262d31; box-shadow: 0 0 0 6px #fff; }
.enq-ficon svg { width: 30px; height: 30px; }
.contact-page #contact-us .enq-flow strong { display: block; margin-bottom: 4px; font-size: 18px; line-height: 1.25; color: #262d31; }
/* benefit cards: icon + chips */
.enq-bicon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 14px; border-radius: 12px; background: #fff3e3; color: #262d31; }
.enq-bicon svg { width: 28px; height: 28px; }
.contact-page #contact-us .enq-partner-card .enq-chips { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0 0 14px; padding: 0; }
.contact-page #contact-us .enq-partner-card .enq-chips li { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 6px 12px 6px 10px; border: 1px solid #dce2df; border-radius: 999px; background: #f5f5f5; font-size: 15px; line-height: 1.3; font-weight: bold; color: #262d31; }
.enq-chips svg { width: 18px; height: 18px; color: #f7941e; stroke-width: 2; }
/* cost: from -> to strip */
.enq-swap { display: grid; grid-template-columns: minmax(0,1fr) 48px minmax(0,1fr); align-items: stretch; gap: 12px; margin: 4px 0 4px; }
.enq-swap-from, .enq-swap-to { padding: 20px; border-radius: 10px; background: #fff; border: 1px solid #dce2df; }
.enq-swap-to { border: 2px solid #f7941e; }
.enq-swap-icons { display: flex; gap: 10px; margin-bottom: 10px; color: #4a5359; }
.enq-swap-from .enq-swap-icons svg { opacity: .65; }
.enq-swap-to .enq-swap-icons { color: #262d31; }
.enq-swap-icons svg { width: 28px; height: 28px; }
.contact-page #contact-us .enq-swap p { margin: 0; }
.contact-page #contact-us .enq-swap-from p { color: #4a5359; text-decoration: line-through; text-decoration-color: rgba(74,83,89,.45); }
.enq-swap-arrow { display: flex; align-items: center; justify-content: center; color: #f7941e; }
.enq-swap-arrow svg { width: 32px; height: 32px; stroke-width: 2.25; }
/* start steps: numbered cards joined by a line (overrides the older decimal list) */
.contact-page #contact-us .enq-partner-steps, .contact-page #contact-us .enq-flow { position: relative; list-style: none; margin: 8px 0 0; padding: 0; }
.contact-page #contact-us .enq-partner-steps { gap: 20px; }
.contact-page #contact-us .enq-partner-steps li { position: relative; margin: 0; padding: 22px 20px 20px; border: 1px solid #dce2df; border-radius: 10px; background: #fff; }
.contact-page #contact-us .enq-partner-steps li + li::before { content: ""; position: absolute; top: 39px; left: -21px; width: 20px; height: 2px; background: #f7941e; }
/* site rule div#inner-text ol LI forces decimal markers; the cards carry their own numbers */
.contact-page #contact-us .enq-partner-card ol > li, .contact-page #contact-us .enq-partner-card .enq-chips li { list-style: none; }
.contact-page #contact-us .enq-partner-steps .enq-snum { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; margin: 0 0 12px; border-radius: 50%; background: #f7941e; color: #262d31; font-weight: bold; font-size: 18px; line-height: 1; }
/* compact FAQ */
.contact-page #contact-us .enq-partner-faq summary { position: relative; display: block; list-style: none; padding: 12px 40px 12px 4px; }
.enq-partner-faq summary::-webkit-details-marker { display: none; }
.enq-partner-faq summary::after { content: ""; position: absolute; right: 10px; top: 50%; width: 9px; height: 9px; margin-top: -7px; border-right: 2px solid #f7941e; border-bottom: 2px solid #f7941e; transform: rotate(45deg); transition: transform .2s ease; }
.enq-partner-faq details[open] summary::after { margin-top: -2px; transform: rotate(-135deg); }
.contact-page #contact-us .enq-partner-faq details p { margin: 0 40px 14px 4px; }
/* motion (only when the script added .enq-anim) */
@keyframes enq-node-in { from { opacity: 0; transform: translateY(14px) scale(.92); } to { opacity: 1; transform: none; } }
@keyframes enq-line-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes enq-line-y { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes enq-pulse { 0%, 100% { box-shadow: 0 0 0 6px #fff; } 50% { box-shadow: 0 0 0 6px #fff, 0 0 0 10px rgba(247,148,30,.25); } }
.enq-anim [data-reveal] > li { opacity: 0; }
.enq-anim .enq-flow::after { transform: scaleX(0); }
.enq-anim [data-reveal].is-in > li { opacity: 1; animation: enq-node-in .5s ease-out backwards; animation-delay: calc(var(--i) * .4s); }
.enq-anim .enq-flow.is-in::after { transform: none; animation: enq-line-x 1.4s ease-in-out .2s backwards; }
.enq-anim .enq-flow.is-in li:last-child .enq-ficon { animation: enq-pulse 1.6s ease-in-out 1.8s 2; }
@media (hover: hover) { .enq-partner-card .enq-flow li:hover .enq-ficon { background: #f7941e; transition: background .2s ease; } }
@media (max-width: 760px) {
  .enq-partner-card .enq-flow { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .enq-partner-card .enq-flow::before, .enq-partner-card .enq-flow::after { top: 32px; bottom: 32px; left: 31px; right: auto; width: 3px; height: auto; }
  .enq-partner-card .enq-flow::after { transform-origin: center top; }
  .enq-anim .enq-flow::after { transform: scaleY(0); }
  .enq-anim .enq-flow.is-in::after { animation-name: enq-line-y; }
  .contact-page #contact-us .enq-flow li { display: grid; grid-template-columns: 64px minmax(0,1fr); column-gap: 16px; align-items: center; text-align: left; padding: 0; }
  .enq-ficon { grid-row: 1 / span 2; margin: 0; }
  .contact-page #contact-us .enq-flow strong { align-self: end; margin: 0; }
  .contact-page #contact-us .enq-flow li > span:last-child { align-self: start; }
  .enq-swap { grid-template-columns: minmax(0,1fr); gap: 8px; }
  .enq-swap-arrow { transform: rotate(90deg); height: 32px; }
  .contact-page #contact-us .enq-partner-steps li + li::before { top: -21px; left: 37px; width: 2px; height: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .enq-partner-card *, .enq-partner-card *::before, .enq-partner-card *::after { animation: none !important; transition: none !important; }
  .enq-anim [data-reveal] > li { opacity: 1; }
  .enq-anim .enq-flow::after { transform: none; }
}

/* slice 3 (13/10/26): AI route picker - one fixed clarifying question with answer chips, and the "Send this to the team" panel.
   Same box as the suggestion; existing colours only. */
.enq .enq-clarify, .enq .enq-team { margin: 0; }
.enq p.enq-cq { margin: 0 0 10px 0; font-size: 18px; line-height: 1.3; font-weight: bold; color: var(--enq-ink); }
.enq .enq-cchips { display: flex; flex-wrap: wrap; gap: 8px; }
.enq .enq-cchip {
  min-height: 48px; margin: 0; padding: 10px 18px;
  font: inherit; font-size: 16px; color: var(--enq-ink); text-align: center;
  background: #fff; border: 1.5px solid var(--enq-line); border-radius: 999px; cursor: pointer; float: none; text-transform: none;
}
@media (hover: hover) { .enq .enq-cchip:hover { border-color: var(--enq-orange); } }
.enq .enq-cchip:active { transform: scale(0.97); border-color: var(--enq-orange); }
.enq .enq-cchip:focus-visible { outline: 3px solid var(--enq-ink); outline-offset: 2px; }
.enq .enq-team .enq-l:first-of-type { margin-top: 14px; }
.enq .enq-team textarea.enq-in { min-height: 96px; }
.enq .enq-team .enq-in { background: #fff; }
.enq .enq-captcha { margin: 16px 0 0 0; min-height: 0; }
.enq .enq-captcha:empty { display: none; }
.enq .enq-team .enq-go { margin-top: 16px; }
.enq p.enq-tq { margin: 0; font-size: 18px; line-height: 1.3; color: var(--enq-ink); }
#wizard p.enq-cq, #wizard p.enq-tq { font-size: 18px; }   /* same specificity as "#wizard p.enq-sg": the site p rules otherwise win */
.enq p.enq-team-done { margin-top: 14px; font-weight: bold; }
@media (max-width: 374px) { .enq .enq-captcha { transform: scale(0.88); transform-origin: 0 0; } }