/*! tmg-intake.css v0.1.6 DRAFT (2026-10-04). Styles for tmg-intake.js: static forms A, B, C, R,
 * the calculator capture (Form D), the "Deal closing soon? Priority callback" dialog, the partner
 * link display and the guide end blocks. Matches styles.css and the calculator pages: Open Sans,
 * TMG Orange #D55C19, greys #444547 and #63666A, 14px radius, pill buttons. Everything is scoped
 * under .tmg-* so it cannot restyle existing pages. */

.tmg-form, .tmg-scn, .tmg-dialog, .tmg-guide-end, .tmg-confirm, .tmg-hotline {
  --tmg-orange: #D55C19; --tmg-orange-dark: #B44A12; --tmg-ht-grey: #444547; --tmg-grey: #63666A;
  --tmg-line: #E7E4DC; --tmg-wash: #FAF9F6; --tmg-paper: #FAF9F7; --tmg-error: #B3261E; --tmg-radius: 14px;
  font-family: "Open Sans", "Segoe UI", Arial, sans-serif; color: var(--tmg-ht-grey); line-height: 1.55;
}
.tmg-form *, .tmg-scn *, .tmg-dialog *, .tmg-guide-end *, .tmg-confirm * { box-sizing: border-box; }
.tmg-form [hidden], .tmg-scn [hidden], .tmg-dialog [hidden], .tmg-confirm [hidden], .tmg-confirm[hidden], .tmg-form[hidden],
.tmg-guide-end [hidden], .tmg-page [hidden], [data-tmg-hide-on-success][hidden] { display: none !important; }

/* ---------- Buttons ---------- */
.tmg-btn {
  display: inline-block; font: inherit; font-weight: 800; font-size: 1rem; line-height: 1;
  padding: 14px 26px; border-radius: 999px; border: 2px solid transparent; cursor: pointer;
  text-decoration: none; transition: background .15s ease, transform .08s ease;
}
.tmg-btn:hover { text-decoration: none; transform: translateY(-1px); }
.tmg-btn[disabled] { opacity: .65; cursor: progress; transform: none; }
.tmg-btn-primary { background: var(--tmg-orange, #D55C19); color: #fff; }
.tmg-btn-primary:hover { background: var(--tmg-orange-dark, #B44A12); color: #fff; }
.tmg-btn-ghost { background: #fff; color: var(--tmg-ht-grey, #444547); border-color: var(--tmg-line, #E7E4DC); }
.tmg-btn-ghost:hover { border-color: var(--tmg-orange, #D55C19); color: var(--tmg-orange-dark, #B44A12); }
.tmg-btn-sm { padding: 8px 14px; font-size: .88rem; }
.tmg-link-btn {
  background: none; border: 0; padding: 4px 0; font: inherit; font-weight: 700; font-size: .92rem;
  color: var(--tmg-orange-dark, #B44A12); text-decoration: underline; cursor: pointer;
}
.tmg-btn:focus-visible, .tmg-link-btn:focus-visible, .tmg-hotline-btn:focus-visible,
.tmg-form input:focus-visible, .tmg-form select:focus-visible, .tmg-form textarea:focus-visible,
.tmg-guide-end a:focus-visible, .tmg-confirm a:focus-visible, .tmg-confirm button:focus-visible {
  outline: 3px solid var(--tmg-orange, #D55C19); outline-offset: 2px;
}
.tmg-form h2:focus, .tmg-form h3:focus, .tmg-confirm h2:focus, .tmg-scn h3:focus, .tmg-dialog h2:focus,
.tmg-confirm-lead:focus, .tmg-alert:focus { outline: none; }

/* ---------- Form layout ---------- */
.tmg-form h2 { font-size: clamp(1.35rem, 2.4vw, 1.75rem); margin: 0 0 .5em; }
.tmg-form .tmg-step-intro, .tmg-note { color: var(--tmg-grey, #63666A); }
.tmg-note { background: var(--tmg-wash, #FAF9F6); border-left: 3px solid var(--tmg-orange, #D55C19); border-radius: 6px; padding: 10px 12px; font-size: .95rem; }
.tmg-progress { font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--tmg-orange-dark, #B44A12); margin: 0 0 10px; }
.tmg-field, .tmg-group, .tmg-subgroup, .tmg-repeater { margin: 0 0 20px; padding: 0; border: 0; min-width: 0; }
.tmg-field > label:not(.tmg-choice), .tmg-field > legend, .tmg-group > legend, .tmg-sublabel {
  display: block; font-size: .8rem; font-weight: 700; letter-spacing: .5px; text-transform: uppercase;
  color: var(--tmg-grey, #63666A); margin: 0 0 6px; padding: 0;
}
.tmg-group > .tmg-sublabel, .tmg-subgroup > .tmg-sublabel { color: var(--tmg-ht-grey, #444547); }
.tmg-field input[type=text], .tmg-field input[type=email], .tmg-field input[type=tel], .tmg-field input[type=url],
.tmg-field input[type=date], .tmg-field input[type=month], .tmg-field select, .tmg-field textarea {
  width: 100%; border: 1px solid var(--tmg-line, #E7E4DC); border-radius: 8px; padding: 11px 12px;
  font: inherit; font-size: 16px; color: var(--tmg-ht-grey, #444547); background: #fff;
}
.tmg-field textarea { resize: vertical; min-height: 96px; }
.tmg-help { font-size: .85rem; color: var(--tmg-grey, #63666A); margin: 0 0 6px; }
.tmg-indent { padding-left: 30px; margin-top: -12px; }
.tmg-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.tmg-row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0 14px; }
.tmg-inline { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; }
.tmg-inline > .tmg-field { margin-bottom: 0; flex: 1 1 200px; }
.tmg-inline > input[type=text] { flex: 1 1 200px; width: auto; border: 1px solid var(--tmg-line, #E7E4DC); border-radius: 8px; padding: 11px 12px; font: inherit; font-size: 16px; }
.tmg-inline > input[disabled] { background: var(--tmg-wash, #FAF9F6); }

/* choices */
.tmg-choices { display: grid; gap: 8px; }
.tmg-choices-inline { display: flex; flex-wrap: wrap; gap: 8px 10px; }
.tmg-choices-cols { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.tmg-choice {
  display: flex; align-items: flex-start; gap: 10px; cursor: pointer; font-size: .98rem; font-weight: 600;
  text-transform: none; letter-spacing: 0; color: var(--tmg-ht-grey, #444547);
  border: 1px solid var(--tmg-line, #E7E4DC); border-radius: 10px; padding: 10px 12px; background: #fff; margin: 0;
}
.tmg-choice:hover { border-color: var(--tmg-orange, #D55C19); }
.tmg-choice input { margin: 3px 0 0; width: 18px; height: 18px; flex: 0 0 18px; accent-color: var(--tmg-orange, #D55C19); }
.tmg-choice:has(input:checked) { border-color: var(--tmg-orange, #D55C19); background: #FFF7F1; }
.tmg-consent .tmg-choice { border: 0; padding: 4px 0; font-weight: 400; font-size: .95rem; background: none; }
.tmg-consent .tmg-choice:has(input:checked) { background: none; }
.tmg-consent .tmg-help { padding-left: 28px; }
.tmg-inline .tmg-consent { margin: 0; }

/* repeaters */
.tmg-repeat-row { border-top: 1px dashed var(--tmg-line, #E7E4DC); padding-top: 12px; margin-top: 8px; }
.tmg-repeat-row:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }
.tmg-path { border-left: 3px solid var(--tmg-line, #E7E4DC); padding-left: 14px; margin: 0 0 20px; }

/* errors and alerts */
.tmg-err { color: var(--tmg-error, #B3261E); font-size: .88rem; font-weight: 600; margin: 6px 0 0; }
.tmg-invalid input[type=text], .tmg-invalid input[type=email], .tmg-invalid input[type=tel], .tmg-invalid input[type=url],
.tmg-invalid input[type=date], .tmg-invalid input[type=month], .tmg-invalid select, .tmg-invalid textarea { border-color: var(--tmg-error, #B3261E); }
.tmg-invalid .tmg-choice { border-color: #E9B4B0; }
.tmg-alert { background: #FDF0EF; border: 1px solid #E9B4B0; color: var(--tmg-error, #B3261E); border-radius: 10px; padding: 12px 14px; font-weight: 600; margin: 0 0 16px; }
.tmg-alert a { color: var(--tmg-error, #B3261E); }

/* nav, fine print, honeypot, turnstile */
.tmg-nav, .tmg-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 22px 0 12px; }
.tmg-nav [data-tmg-next], .tmg-nav [data-tmg-submit] { margin-left: auto; }
.tmg-fine { font-size: .82rem; color: var(--tmg-grey, #63666A); line-height: 1.5; margin: 8px 0 0; }
.tmg-fine a, .tmg-help a, .tmg-note a { color: var(--tmg-orange-dark, #B44A12); }
.tmg-hp { position: absolute !important; left: -10000px !important; top: auto; width: 1px; height: 1px; overflow: hidden; }
.tmg-turnstile { margin: 12px 0 0; min-height: 0; }
.tmg-noscript { font-weight: 700; }
.tmg-disclaimer { max-width: 760px; margin: 18px auto 0; }

/* ---------- Confirmation ---------- */
.tmg-confirm h2 { font-size: clamp(1.4rem, 2.6vw, 1.9rem); margin: 0 0 .5em; }
.tmg-confirm h3 { font-size: 1.15rem; margin: 1.2em 0 .4em; }
.tmg-checklist { margin: 0 0 1em 1.2em; padding: 0; }
.tmg-checklist li { margin: 0 0 6px; }
.tmg-confirm-lead { font-size: 1.05rem; font-weight: 600; background: var(--tmg-wash, #FAF9F6); border-left: 3px solid var(--tmg-orange, #D55C19); border-radius: 8px; padding: 12px 14px; }

/* partner link display */
.tmg-linkbox { background: var(--tmg-wash, #FAF9F6); border: 1px solid var(--tmg-line, #E7E4DC); border-radius: var(--tmg-radius, 14px); padding: 16px 18px; margin: 14px 0; }
.tmg-linkline { margin: 0 0 6px; word-break: break-all; }
.tmg-link, .tmg-share-url { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .95rem; color: var(--tmg-ht-grey, #444547); }
.tmg-codeline code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 1.4rem; font-weight: 700; letter-spacing: .12em; color: var(--tmg-orange-dark, #B44A12); }
.tmg-copy-status { margin-left: 10px; font-weight: 700; color: #2E7D32; }
.tmg-qr { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin: 10px 0 18px; }
.tmg-qr canvas { width: 176px; height: 176px; image-rendering: pixelated; border: 1px solid var(--tmg-line, #E7E4DC); border-radius: 8px; background: #fff; }
.tmg-share-list { list-style: none; margin: 0 0 1em; padding: 0; }
.tmg-share-list li { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--tmg-line, #E7E4DC); }
.tmg-share-name { font-weight: 700; min-width: 200px; }
.tmg-share-url { flex: 1 1 240px; word-break: break-all; font-size: .85rem; }
.tmg-how { margin: 0 0 1em 1.2em; padding: 0; }
.tmg-how li { margin: 0 0 8px; }

/* ---------- Calculator capture (Form D) ---------- */
.tmg-scn-host { max-width: 760px; margin: 18px auto 0; padding: 0; }
@media (max-width: 880px) { .tmg-scn-host { margin-left: 12px; margin-right: 12px; } }
.tmg-scn { border: 1px solid var(--tmg-line, #E7E4DC); border-radius: var(--tmg-radius, 14px); background: #fff; box-shadow: 0 6px 24px rgba(0,0,0,.05); padding: 18px 20px; }
.tmg-scn-trigger { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; }
.tmg-scn-helper { margin: 0; font-size: .9rem; color: var(--tmg-grey, #63666A); }
.tmg-panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.tmg-panel-head h2, .tmg-panel-head h3 { font-size: 1.2rem; font-weight: 800; margin: 0 0 6px; color: var(--tmg-ht-grey, #444547); }
.tmg-scn-panel { margin-top: 14px; border-top: 1px solid var(--tmg-line, #E7E4DC); padding-top: 14px; }
.tmg-scn-send { font-size: .92rem; background: var(--tmg-wash, #FAF9F6); border-left: 3px solid var(--tmg-orange, #D55C19); border-radius: 6px; padding: 8px 10px; }
.tmg-scn-form, .tmg-scn-step2 { margin-top: 10px; }
.tmg-scn-step2 { border-top: 1px solid var(--tmg-line, #E7E4DC); padding-top: 14px; }

/* ---------- Hotline button and dialog ---------- */
.tmg-hotline-host { display: inline-block; }
.tmg-hotline { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.tmg-hotline-btn {
  font: inherit; font-weight: 800; font-size: 1.02rem; line-height: 1.1; padding: 15px 26px; border-radius: 999px; cursor: pointer;
  background: #fff; color: var(--tmg-orange-dark, #B44A12); border: 2px solid var(--tmg-orange, #D55C19); transition: background .15s ease, transform .08s ease;
}
.tmg-hotline-btn:hover { background: #FFF7F1; transform: translateY(-1px); }
.tmg-hotline-sub { font-size: .85rem; color: var(--tmg-grey, #63666A); }
.tmg-hotline-hero .tmg-hotline-btn { background: transparent; color: #fff; border-color: rgba(255,255,255,.85); }
.tmg-hotline-hero .tmg-hotline-btn:hover { background: #fff; color: var(--tmg-ht-grey, #444547); }
.tmg-hotline-hero .tmg-hotline-sub { color: #f2f2f2; opacity: .92; }
.tmg-dialog {
  width: min(640px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow: auto; border: 0; border-radius: var(--tmg-radius, 14px);
  padding: 22px 22px 18px; box-shadow: 0 18px 40px rgba(40,40,40,.25); color: var(--tmg-ht-grey, #444547);
}
.tmg-dialog::backdrop { background: rgba(30, 30, 32, .55); }
.tmg-dialog .tmg-licence { border-top: 1px solid var(--tmg-line, #E7E4DC); padding-top: 10px; margin-top: 14px; }

/* ---------- Guide end blocks ---------- */
.tmg-guide-end { max-width: 760px; margin: 28px auto; background: var(--tmg-paper, #FAF9F7); border: 1px solid var(--tmg-line, #E7E4DC); border-top: 6px solid var(--tmg-orange, #D55C19); border-radius: var(--tmg-radius, 14px); padding: 22px 24px; }
.tmg-guide-end h2 { font-size: clamp(1.25rem, 2.2vw, 1.6rem); font-weight: 800; margin: 0 0 .4em; color: var(--tmg-ht-grey, #444547); line-height: 1.15; }
.tmg-guide-end p { margin: 0 0 .8em; }
.tmg-guide-second a { color: var(--tmg-orange-dark, #B44A12); font-weight: 700; }
.tmg-guide-quiet { font-size: .88rem; color: var(--tmg-grey, #63666A); margin: 0 0 .3em !important; }

/* ---------- Small screens ---------- */
@media (max-width: 620px) {
  .tmg-row2, .tmg-row3 { grid-template-columns: 1fr; }
  .tmg-nav [data-tmg-next], .tmg-nav [data-tmg-submit] { margin-left: 0; }
  .tmg-nav .tmg-btn, .tmg-actions .tmg-btn { flex: 1 1 auto; text-align: center; }
  .tmg-scn { padding: 16px; }
  .form-shell .tmg-form { margin: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .tmg-btn, .tmg-hotline-btn { transition: none; }
  .tmg-btn:hover, .tmg-hotline-btn:hover { transform: none; }
}
