/* ============================================================================
   enquiry-modal.css — dynamic, service-aware enquiry popup (js/enquiry-modal.js)
   Built on the site design tokens (styles.css); themes light/dark automatically.
   ============================================================================ */
.tgm{position:fixed;inset:0;z-index:2147482000;display:none;align-items:flex-start;justify-content:center;
  padding:24px 16px;overflow-y:auto;background:rgba(6,14,38,.6);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.tgm.tgm-on{display:flex;animation:tgm-fade .2s ease}
.tgm [hidden]{display:none!important}
@keyframes tgm-fade{from{opacity:0}to{opacity:1}}
html.tgm-lock,html.tgm-lock body{overflow:hidden!important}

.tgm-card{background:var(--paper,#fff);width:100%;max-width:640px;border-radius:18px;box-shadow:0 30px 80px rgba(4,12,40,.5);
  margin:auto;position:relative;overflow:hidden;display:flex;flex-direction:column;max-height:calc(100vh - 48px)}

/* Header */
.tgm-head{background:var(--grad-navy,linear-gradient(160deg,#14153a,#23246b));color:#fff;padding:20px 24px;position:sticky;top:0;z-index:2}
.tgm-eyebrow{font:700 11px/1 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:#ff8298;margin:0 0 7px}
.tgm-title{font-size:clamp(1.15rem,2.6vw,1.5rem);font-weight:800;margin:0;letter-spacing:-.01em}
.tgm-sub{font-size:13px;line-height:1.55;color:rgba(255,255,255,.8);margin:8px 0 0}
.tgm-selected{display:inline-flex;align-items:center;gap:7px;margin-top:12px;font-size:12px;font-weight:700;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);padding:5px 12px;border-radius:999px}
.tgm-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(255,255,255,.16);color:#fff;font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .15s}
.tgm-close:hover{background:rgba(255,255,255,.3)}

/* Progress steps */
.tgm-steps{display:flex;gap:6px;padding:12px 24px 0;background:var(--paper)}
.tgm-step{flex:1;height:4px;border-radius:999px;background:var(--ink-100,#eef)}
.tgm-step.on{background:var(--brand-red,#ff2045)}
.tgm-step.done{background:#0f9d58}

/* Body */
/* The form fills the remaining card height and lays out as a column so the
   body scrolls between the sticky header and the sticky footer. */
.tgm-form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
.tgm-body{padding:20px 24px 8px;overflow-y:auto;flex:1 1 auto;min-height:0;-webkit-overflow-scrolling:touch}
.tgm-secttitle{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-500,#667);margin:4px 0 12px}
.tgm-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.tgm-field{display:flex;flex-direction:column;gap:5px;min-width:0}
.tgm-field.full{grid-column:1/-1}
.tgm-field label{font-size:12.5px;font-weight:600;color:var(--ink-700,#3d3e63)}
.tgm-field label b{color:var(--brand-red,#ff2045);font-weight:700}
.tgm-field input,.tgm-field select,.tgm-field textarea{width:100%;padding:11px 12px;border:1px solid var(--ink-300,#d9dbec);border-radius:10px;
  font:inherit;font-size:14px;color:var(--ink-900,#14152f);background:var(--paper,#fff)}
.tgm-field textarea{min-height:76px;resize:vertical}
.tgm-field input:focus,.tgm-field select:focus,.tgm-field textarea:focus{outline:none;border-color:var(--brand-navy-light,#363a9e);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-navy,#23246b) 12%,transparent)}
.tgm-field.err input,.tgm-field.err select,.tgm-field.err textarea{border-color:var(--brand-red,#ff2045);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-red,#ff2045) 12%,transparent)}
.tgm-phone{display:flex;gap:8px}
.tgm-phone select{flex:0 0 96px}
.tgm-err{font-size:11.5px;font-weight:600;color:var(--brand-red-dark,#d10f34)}
.tgm-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* Service picker (universal Enquire Now step) */
.tgm-pick{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.tgm-pick{grid-template-columns:1fr}}
.tgm-pick-btn{display:flex;flex-direction:column;gap:4px;text-align:left;padding:16px;border:1.5px solid var(--ink-300);border-radius:14px;
  background:var(--paper);cursor:pointer;transition:border-color .15s,transform .12s,box-shadow .15s}
.tgm-pick-btn:hover{border-color:var(--brand-navy-light);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.tgm-pick-btn b{font-size:14.5px;color:var(--ink-900)}
.tgm-pick-btn span{font-size:12px;color:var(--ink-500);line-height:1.4}

/* Footer / actions */
.tgm-foot{display:flex;gap:10px;justify-content:space-between;align-items:center;padding:14px 24px 20px;
  border-top:1px solid var(--ink-100);background:var(--paper);position:sticky;bottom:0}
.tgm-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:12px 22px;border-radius:11px;font-size:14.5px;font-weight:700;
  cursor:pointer;border:1.5px solid var(--ink-300);background:var(--paper);color:var(--ink-900);text-decoration:none;transition:transform .12s,background .15s,border-color .15s}
.tgm-btn:hover{transform:translateY(-1px)}
.tgm-btn.primary{background:var(--brand-red);border-color:var(--brand-red);color:#fff;box-shadow:var(--shadow-glow)}
.tgm-btn.primary:hover{background:var(--brand-red-dark)}
.tgm-btn.pay{background:#0f9d58;border-color:#0f9d58;color:#fff}
.tgm-btn[disabled]{opacity:.6;cursor:progress}
.tgm-note{padding:0 24px 16px;font-size:11.5px;color:var(--ink-500)}

/* Success */
.tgm-ok{padding:26px 24px 8px;text-align:center}
.tgm-ok-ico{width:58px;height:58px;margin:0 auto 12px;border-radius:50%;background:color-mix(in srgb,#0f9d58 16%,transparent);color:#0f9d58;font-size:30px;font-weight:900;display:flex;align-items:center;justify-content:center}
.tgm-ok h3{font-size:1.35rem;font-weight:800;color:var(--ink-900);margin:0 0 6px}
.tgm-ok p{font-size:13.5px;color:var(--ink-500);line-height:1.6;margin:0 auto 16px;max-width:46ch}
.tgm-code{background:var(--grad-navy,linear-gradient(160deg,#14153a,#23246b));color:#fff;border-radius:12px;padding:14px;margin-bottom:14px}
.tgm-code span{display:block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;opacity:.75;font-weight:700;margin-bottom:3px}
.tgm-code b{font-size:1.4rem;font-weight:800;letter-spacing:.05em;font-family:'IBM Plex Mono',ui-monospace,monospace}
.tgm-ok-track{font-size:12px;color:var(--ink-500);line-height:1.6;background:var(--paper-alt);border-radius:10px;padding:10px 12px;margin-bottom:16px}

@media(max-width:640px){
  .tgm{padding:0;align-items:stretch}
  .tgm-card{max-width:none;min-height:100vh;max-height:none;border-radius:0}
  .tgm-grid,.tgm-pick{grid-template-columns:1fr}
}

/* Documents step inside the modal */
.tgm-docnote{font-size:12px;line-height:1.55;color:var(--ink-700);background:color-mix(in srgb,#0f9d58 8%,transparent);
  border:1px solid color-mix(in srgb,#0f9d58 24%,transparent);border-radius:10px;padding:9px 12px;margin:0 0 12px}
.tgm-docerr{margin:0 0 12px}
.tgm .ve-attach-grid{grid-template-columns:1fr}            /* single column inside the narrower modal */
.tgm .ve-progress{margin-bottom:8px}