/* ============================================================================
   Request a Free Quote — page styles (.rfq-*).
   Builds on the shared design tokens from home.styles.css (--ink navy,
   --cream light-blue, --red, --amber, --e easing, Fraunces/Manrope/PlexMono).
   Labels, inputs and buttons use Manrope — never the display serif.
   ============================================================================ */

.rfq{background:var(--cream);color:var(--ink);overflow-x:clip}
.rfq *{box-sizing:border-box}

/* ---- reveal (JS-on): fades sections up; visible without JS / reduced-motion -- */
.rfq-rv{opacity:1;transform:none}
html.js .rfq-rv{opacity:0;transform:translateY(18px);transition:opacity .9s var(--e),transform .9s var(--e)}
html.js .rfq-rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html.js .rfq-rv{opacity:1!important;transform:none!important;transition:none!important}
}

/* --------------------------------------------------------------------- HERO -- */
.rfq-hero{background:var(--ink);color:#fff;padding:clamp(84px,12vw,120px) 0 clamp(34px,5vw,52px)}
.rfq-crumb{font-family:'PlexMono',ui-monospace,monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:flex;gap:10px;align-items:center;margin-bottom:22px}
.rfq-crumb a{color:var(--muted);text-decoration:none}
.rfq-crumb a:hover,.rfq-crumb a:focus-visible{color:var(--amber)}
.rfq-crumb span[aria-current]{color:#fff}
/* moving eyebrow: a masked fixed-width window (never overflows) with a linearly
   scrolling track of the repeated label — matches the site's amber eyebrows */
.rfq-eyebrow{overflow:hidden;max-width:min(100%,340px);margin:0 0 14px;-webkit-mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.rfq-etrack{display:inline-flex;align-items:center;gap:12px;white-space:nowrap;font-family:'PlexMono',ui-monospace,monospace;font-size:.82rem;letter-spacing:.22em;text-transform:uppercase;color:var(--amber);will-change:transform;animation:rfq-eyebrow-marq 18s linear infinite}
.rfq-etrack span{flex:0 0 auto}
.rfq-etrack i{color:var(--amber);font-style:normal;font-size:.9em;line-height:1}
@keyframes rfq-eyebrow-marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){ .rfq-etrack{animation:none} }
.rfq-h1{font-family:'Fraunces',Georgia,serif;font-weight:340;font-size:clamp(2.1rem,5vw,3.4rem);line-height:1.05;letter-spacing:-.01em;margin:0 0 16px}
.rfq-lead{font-family:'Manrope',system-ui,sans-serif;font-size:clamp(1rem,1.4vw,1.15rem);line-height:1.6;color:var(--muted);max-width:46ch;margin:0}

/* --------------------------------------------------------- MAIN GRID LAYOUT -- */
.rfq-main{padding:clamp(34px,5vw,64px) 0 clamp(10px,1.6vw,18px)}
.rfq-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:clamp(24px,3vw,48px);align-items:start}
@media (max-width:900px){ .rfq-grid{grid-template-columns:minmax(0,1fr)} }

/* ------------------------------------------------------------------- FORM ---- */
.rfq-formwrap{background:#fff;border:1px solid var(--line-d);border-radius:6px 6px 20px 20px;padding:clamp(22px,3vw,40px);box-shadow:0 18px 48px rgba(10,31,77,.08)}
.rfq-form{font-family:'Manrope',system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
.rfq-formintro{font-size:.9rem;color:rgba(10,31,77,.66);margin:0 0 20px}
.rfq-req-key,.rfq-req{color:var(--red);font-weight:700}

.rfq-fs{border:0;margin:0 0 26px;padding:0}
.rfq-fs:last-of-type{margin-bottom:6px}
.rfq-legend{display:flex;align-items:center;gap:12px;font-family:'Manrope',system-ui,sans-serif;font-weight:600;font-size:1.12rem;color:var(--ink);padding:0 0 16px;margin:0 0 18px;border-bottom:1px solid var(--line-d);width:100%}
.rfq-fsnum{flex:0 0 auto;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;font-size:.85rem;font-weight:700}

.rfq-field{margin:0 0 18px}
.rfq-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:520px){ .rfq-row{grid-template-columns:1fr} }
.rfq-field label,.rfq-uplabel{display:block;font-weight:600;font-size:.92rem;color:var(--ink);margin:0 0 7px}
.rfq-opt{font-weight:400;color:rgba(10,31,77,.5);font-size:.85em}

.rfq-form input[type=text],
.rfq-form input[type=email],
.rfq-form input[type=tel],
.rfq-form input[type=date],
.rfq-form select,
.rfq-form textarea{
  width:100%;font-family:inherit;font-size:1rem;color:var(--ink);background:#fff;
  border:1.5px solid var(--line-d);border-radius:4px;padding:12px 14px;line-height:1.4;
  transition:border-color .2s var(--e),box-shadow .2s var(--e);-webkit-appearance:none;appearance:none}
.rfq-form textarea{resize:vertical;min-height:132px}
.rfq-form input::placeholder,.rfq-form textarea::placeholder{color:rgba(10,31,77,.38)}
.rfq-form input:hover,.rfq-form select:hover,.rfq-form textarea:hover{border-color:rgba(10,31,77,.34)}
.rfq-form input:focus-visible,.rfq-form select:focus-visible,.rfq-form textarea:focus-visible{
  outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(10,31,77,.16)}

.rfq-selectwrap{position:relative}
.rfq-selectwrap select{padding-right:44px;cursor:pointer}
.rfq-selectarw{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--ink);pointer-events:none}
.rfq-selectarw svg{width:100%;height:100%}
.rfq-form input[type=date]{min-height:46px}

.rfq-hint{font-size:.82rem;color:rgba(10,31,77,.58);margin:7px 0 0;line-height:1.45}
/* the qualifier inside a label — the same words, carried at the weight of a hint so
   the field still reads as "Preferred date" at a glance */
.rfq-lsub{font-weight:500;color:rgba(10,31,77,.58)}
.rfq-count{color:rgba(10,31,77,.45)}

/* field + inline error state */
.rfq-err{font-size:.82rem;color:var(--red);font-weight:600;margin:7px 0 0;display:flex;gap:6px;align-items:flex-start}
.rfq-field.has-err input,.rfq-field.has-err select,.rfq-field.has-err textarea{border-color:var(--red);box-shadow:0 0 0 3px rgba(200,16,46,.12)}
.rfq-field.has-err label{color:var(--red)}

/* error summary */
.rfq-errsum{border:1.5px solid var(--red);background:rgba(200,16,46,.05);border-radius:6px;padding:16px 18px;margin:0 0 22px}
.rfq-errsum:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.rfq-errsum-h{font-family:'Manrope',sans-serif;font-size:1rem;font-weight:700;color:var(--red);margin:0 0 8px}
.rfq-errsum ul{margin:0;padding-left:18px}
.rfq-errsum li{font-size:.9rem;margin:4px 0}
.rfq-errsum a{color:var(--red);font-weight:600}

/* ------------------------------------------------------------- FILE UPLOAD -- */
.rfq-drop{position:relative;display:block;border:1.6px dashed rgba(10,31,77,.3);border-radius:8px;background:rgba(10,31,77,.02);padding:26px 20px;text-align:center;cursor:pointer;transition:border-color .2s var(--e),background .2s var(--e)}
.rfq-drop:hover,.rfq-drop.drag{border-color:var(--ink);background:rgba(10,31,77,.05)}
.rfq-drop input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.rfq-drop:focus-within{border-color:var(--ink);box-shadow:0 0 0 3px rgba(10,31,77,.16)}
.rfq-drop-ic{display:block;width:30px;height:30px;margin:0 auto 8px;color:var(--ink)}
.rfq-drop-ic svg{width:100%;height:100%}
.rfq-drop-tx{display:block;font-size:.95rem;color:var(--ink)}
.rfq-drop-tx b{color:var(--red)}
.rfq-drop-meta{display:block;font-size:.78rem;color:rgba(10,31,77,.55);margin-top:5px}
.rfq-filelist{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.rfq-fileitem{display:flex;align-items:center;gap:10px;background:rgba(10,31,77,.04);border:1px solid var(--line-d);border-radius:6px;padding:9px 12px;font-size:.86rem}
.rfq-fileitem .fn{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
.rfq-fileitem .fs{flex:0 0 auto;color:rgba(10,31,77,.55);font-variant-numeric:tabular-nums}
.rfq-fileitem.bad{border-color:var(--red);background:rgba(200,16,46,.06)}
.rfq-fileitem.bad .fs{color:var(--red)}
.rfq-filerm{flex:0 0 auto;width:26px;height:26px;border:0;background:transparent;color:rgba(10,31,77,.5);cursor:pointer;border-radius:5px;display:grid;place-items:center;font-size:1.2rem;line-height:1}
.rfq-filerm:hover,.rfq-filerm:focus-visible{color:var(--red);background:rgba(200,16,46,.08);outline:none}

/* ---------------------------------------------------------------- CONSENT ---- */
.rfq-check{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}
.rfq-check input[type=checkbox]{width:20px;height:20px;margin:0;accent-color:var(--ink);cursor:pointer}
.rfq-check label{margin:0;font-weight:500;cursor:pointer}
.rfq-consent{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;background:rgba(10,31,77,.03);border:1px solid var(--line-d);border-radius:8px;padding:16px}
.rfq-consent input[type=checkbox]{width:22px;height:22px;margin:1px 0 0;accent-color:var(--ink);cursor:pointer;flex:0 0 auto}
.rfq-consent label{margin:0;font-weight:500;font-size:.92rem;line-height:1.5}
.rfq-consent a{color:var(--red);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.rfq-consent .rfq-err{grid-column:1 / -1}
.rfq-consent.has-err{border-color:var(--red);background:rgba(200,16,46,.05)}

/* ----------------------------------------------------------------- SUBMIT ---- */
.rfq-submit-row{margin-top:22px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.rfq-submit{display:inline-flex;align-items:center;gap:12px;font-family:'Manrope',sans-serif;font-weight:700;font-size:1rem;color:#fff;background:linear-gradient(120deg,var(--gold-hi),var(--gold));border:0;border-radius:10px;padding:14px 22px;cursor:pointer;box-shadow:0 12px 30px rgba(200,16,46,.28);transition:transform .3s var(--e),box-shadow .3s var(--e),opacity .2s}
.rfq-submit:hover{transform:translateY(-2px)}
.rfq-submit:focus-visible{outline:3px solid rgba(10,31,77,.5);outline-offset:3px}
.rfq-submit .dot{width:30px;height:30px;border-radius:50%;background:#fff;color:var(--gold-hi);display:grid;place-items:center;transition:transform .35s var(--e)}
.rfq-submit .dot svg{width:15px;height:15px}
.rfq-submit:hover .dot{transform:translateX(3px)}
.rfq-submit[aria-busy=true],.rfq-submit:disabled{opacity:.7;cursor:progress;transform:none;box-shadow:none}
.rfq-spin{display:none;width:18px;height:18px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%}
.rfq-submit[aria-busy=true] .rfq-spin{display:inline-block;animation:rfq-spin .7s linear infinite}
.rfq-submit[aria-busy=true] .dot{display:none}
@keyframes rfq-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){ .rfq-submit,.rfq-submit:hover{transform:none} .rfq-spin{animation-duration:1.4s} }
.rfq-submit-note{font-size:.82rem;color:rgba(10,31,77,.55);margin:0;flex:1 1 200px}

/* ---- status (success / server error) ---- */
.rfq-status{margin-top:24px;border-radius:10px;padding:20px 22px;font-size:.96rem;line-height:1.55}
.rfq-status.ok{background:var(--ink);color:#fff;border:1px solid var(--ink)}
.rfq-status.ok .rfq-status-h{font-family:'Fraunces',serif;font-weight:400;font-size:1.3rem;margin:0 0 8px;color:#fff}
.rfq-status.ok .rfq-ref{display:inline-block;margin-top:10px;font-family:'PlexMono',monospace;font-size:.82rem;letter-spacing:.06em;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:6px;padding:5px 10px}
/* the real "enquiry received" thank-you panel is green (success), not navy */
.rfq-status.ok.is-done{background:#12784a;border-color:#12784a}
.rfq-status.bad{background:rgba(200,16,46,.06);border:1.5px solid var(--red);color:var(--ink)}
.rfq-status.bad a{color:var(--red);font-weight:700}

/* ---- site-address autocomplete (free Photon lookup; dropdown of suggestions) ---- */
.rfq-addr-wrap{position:relative}
.rfq-addr-list{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);margin:0;padding:6px;list-style:none;
  background:#fff;border:1px solid var(--line-d,rgba(10,31,77,.16));border-radius:12px;
  box-shadow:0 20px 44px -20px rgba(10,31,77,.5);max-height:284px;overflow:auto;-webkit-overflow-scrolling:touch}
.rfq-addr-list[hidden]{display:none}
.rfq-addr-opt{padding:10px 12px;border-radius:8px;font-size:.95rem;line-height:1.4;color:var(--ink,#0A1F4D);cursor:pointer}
.rfq-addr-opt:hover,.rfq-addr-opt.is-active{background:var(--cream,#E5EDF8)}
/* ---- touch-device date calendar (phones/tablets only; desktop keeps the native picker).
       Days before today are rendered disabled and grey, so a past date cannot be tapped at
       all — the native phone pickers were offering them as if they were fine. ---- */
.rfq-field{position:relative}
/* The field is narrower than the screen, and seven day columns inside it would leave the
   cells too small to tap. The panel is therefore centred on the field and sized from the
   viewport instead: as wide as it can be while keeping a margin on both sides. */
.rfq-cal{position:absolute;z-index:32;left:50%;transform:translateX(-50%);top:calc(100% + 6px);
  width:min(340px,calc(100vw - 24px));padding:10px;
  background:#fff;border:1px solid var(--line-d,rgba(10,31,77,.16));border-radius:14px;
  box-shadow:0 20px 44px -20px rgba(10,31,77,.5);color:var(--ink,#0A1F4D)}
.rfq-cal[hidden]{display:none}
.rfq-cal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.rfq-cal-head strong{font-size:.98rem;font-weight:700}
.rfq-cal-head button{width:34px;height:34px;flex:none;border:1px solid var(--line-d,rgba(10,31,77,.16));background:#fff;
  border-radius:9px;font-size:1.1rem;line-height:1;color:var(--ink,#0A1F4D);cursor:pointer}
.rfq-cal-head button:disabled{opacity:.32;cursor:default}
.rfq-cal-dow,.rfq-cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}
.rfq-cal-dow span{text-align:center;font-size:.72rem;font-weight:700;letter-spacing:.04em;color:rgba(10,31,77,.5);padding:2px 0 6px}
/* min-height with aspect-ratio was forcing every cell to at least 38px wide, which made
   seven of them wider than the panel; the cells now take their width from the column. */
.rfq-cal-grid button{aspect-ratio:1;min-height:0;min-width:0;width:100%;border:0;background:transparent;border-radius:9px;
  font-family:inherit;font-size:.92rem;font-weight:600;color:var(--ink,#0A1F4D);cursor:pointer}
.rfq-cal-grid button:hover{background:var(--cream,#E5EDF8)}
/* the point of the whole thing: a day that has passed reads as unavailable and does nothing */
.rfq-cal-grid button:disabled{color:rgba(10,31,77,.3);background:rgba(10,31,77,.055);cursor:default;text-decoration:line-through}
.rfq-cal-grid button.is-picked{background:var(--ink,#0A1F4D);color:#fff}
.rfq-cal-foot{display:flex;justify-content:flex-end;margin-top:8px}
.rfq-cal-foot button{border:0;background:transparent;font-family:inherit;font-size:.88rem;font-weight:600;
  color:var(--red,#C8102E);cursor:pointer;padding:6px 4px}
/* the field wrapper + the transparent tap-catcher that opens the calendar. The input
   itself is untappable on a touch screen, so the phone's own picker never opens and
   only one calendar is ever on screen. */
.rfq-datewrap{position:relative}
.rfq-datewrap #rfq-date{pointer-events:none}
.rfq-datehit{position:absolute;inset:0;width:100%;border:0;padding:0;margin:0;background:transparent;
  -webkit-appearance:none;appearance:none;cursor:pointer;border-radius:10px}
.rfq-datehit:focus-visible{outline:2px solid var(--ink,#0A1F4D);outline-offset:2px}
/* confirmation actions: direct the enquiry to the published email / phone */
.rfq-conf-actions{display:flex;flex-wrap:wrap;gap:14px 18px;align-items:center;margin-top:18px}
.rfq-conf-btn{display:inline-flex;align-items:center;gap:10px;font-family:'Manrope',sans-serif;font-weight:700;font-size:.98rem;color:#fff;background:linear-gradient(120deg,var(--gold-hi),var(--gold));border-radius:10px;padding:13px 22px;text-decoration:none;transition:transform .3s var(--e),box-shadow .3s var(--e);box-shadow:0 12px 30px rgba(200,16,46,.28)}
.rfq-conf-btn:hover{transform:translateY(-2px)}
.rfq-conf-btn:focus-visible{outline:3px solid rgba(255,255,255,.65);outline-offset:3px}
.rfq-conf-tel{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.rfq-conf-tel:focus-visible{outline:3px solid rgba(255,255,255,.65);outline-offset:3px}
@media (prefers-reduced-motion:reduce){ .rfq-conf-btn,.rfq-conf-btn:hover{transform:none} }

/* ---------------------------------------------------------- TRUST PANEL ------ */
.rfq-trust{display:flex;flex-direction:column;gap:16px;position:sticky;top:96px}
@media (max-width:900px){ .rfq-trust{position:static} }
.rfq-card{background:#fff;border:1px solid var(--line-d);border-radius:6px 6px 16px 16px;padding:22px 22px}
.rfq-card-h{font-family:'Manrope',sans-serif;font-weight:700;font-size:1.02rem;color:var(--ink);margin:0 0 14px}
.rfq-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;counter-reset:s}
.rfq-steps li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;font-size:.92rem;line-height:1.5;color:rgba(10,31,77,.82)}
.rfq-step-n{width:26px;height:26px;border-radius:50%;background:var(--cream-2);color:var(--ink);font-weight:700;font-size:.82rem;display:grid;place-items:center}
.rfq-card-note{font-size:.82rem;color:rgba(10,31,77,.55);margin:14px 0 0}
.rfq-ticks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.rfq-ticks li{position:relative;padding-left:26px;font-size:.92rem;line-height:1.45;color:rgba(10,31,77,.82)}
.rfq-ticks li::before{content:"";position:absolute;left:0;top:.35em;width:15px;height:9px;border-left:2.4px solid var(--red);border-bottom:2.4px solid var(--red);transform:rotate(-45deg)}
.rfq-card-contact{background:var(--ink);color:#fff}
.rfq-card-contact .rfq-card-h{color:#fff}
.rfq-contact-line{display:flex;flex-direction:column;gap:2px;margin:0 0 12px}
.rfq-contact-line:last-child{margin-bottom:0}
.rfq-contact-lbl{font-family:'PlexMono',monospace;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2)}
.rfq-card-contact a{color:#fff;font-weight:600;text-decoration:none;word-break:break-word}
.rfq-card-contact a:hover,.rfq-card-contact a:focus-visible{color:var(--amber)}
.rfq-svclist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.rfq-svclist li{border-top:1px solid var(--line-d)}
.rfq-svclist li:first-child{border-top:0}
.rfq-svclist a{display:block;padding:11px 0;font-size:.92rem;font-weight:600;color:var(--ink);text-decoration:none}
.rfq-svclist a:hover,.rfq-svclist a:focus-visible{color:var(--red)}

/* --------------------------------------------------------- ACCREDITATION ----- */
.rfq-accred{background:var(--cream);padding:clamp(12px,1.8vw,20px) 0}
.rfq-accred .acmarq{-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}

/* honeypot: keep in the layout flow but far off-screen + inert to AT */
.rfq-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* skip nothing on desktop widths — guard against any accidental overflow */
.rfq-main .wrap,.rfq-hero .wrap{max-width:min(var(--maxw),100% - 40px);margin-inline:auto}