/* Blog lead-capture widgets (injected by js/lead/blog.js). Builds on css/lead-capture.css. */

.iss-blog-sr {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ── Boxes inside the article body ───────────────────────── */
.iss-blog-box { container-type: inline-size; position: relative; }
.blog-article-body-v2 .iss-blog-box { margin: 32px 0; }
.blog-article-body-v2 .iss-blog-box p.iss-lead__title { font-size: clamp(1.1rem, 2.2vw, 1.3rem); font-weight: 700; margin: 0 0 8px; }
.blog-article-body-v2 .iss-blog-box p.iss-lead__eyebrow { font-size: 11px; margin: 0 0 8px; }
.blog-article-body-v2 .iss-blog-box p.iss-lead__text { font-size: 15px; margin: 0 0 12px; }
.blog-article-body-v2 .iss-blog-box p.iss-lead__fine { font-size: 12px; margin: 4px 0 0; }

.blog-article-body-v2 ul.iss-blog-bullets, ul.iss-blog-bullets { margin: 0 0 16px; padding: 0; display: grid; gap: 6px; list-style: none; }
.blog-article-body-v2 ul.iss-blog-bullets li, ul.iss-blog-bullets li {
  position: relative; padding-left: 24px; margin: 0; font-size: 14px; line-height: 1.5; color: var(--ink, #1C1410);
}
.blog-article-body-v2 ul.iss-blog-bullets li::before, ul.iss-blog-bullets li::before {
  content: '✓'; position: absolute; left: 0; top: 0; width: auto; height: auto; background: none; border-radius: 0;
  color: var(--crimson, #8B1A1A); font-weight: 700; font-size: 14px;
}

/* ── Form layout (shared by every blog widget) ───────────── */
.iss-blog-form { display: grid; gap: 8px; margin: 0; }
.iss-blog-row { display: grid; grid-template-columns: 1fr; gap: 10px; }
.iss-blog-field { display: block; margin: 0; }
.iss-blog-form input:not([type="hidden"]), .iss-blog-form select {
  width: 100%; min-height: 44px; padding: 10px 14px; box-sizing: border-box;
  border: 1px solid var(--border, #E2DDD8); border-radius: 8px; background: #fff; color: var(--ink, #1C1410);
  font: inherit; font-size: 16px; /* 16px stops iOS zooming on focus */
}
.iss-blog-form input:focus-visible, .iss-blog-form select:focus-visible {
  outline: 2px solid var(--crimson, #8B1A1A); outline-offset: 1px; border-color: var(--crimson, #8B1A1A);
}
.iss-blog-form button[type="submit"] {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 20px;
  border: 0; border-radius: var(--radius-btn, 8px); background: var(--crimson, #8B1A1A); color: #fff;
  font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; white-space: nowrap;
}
.iss-blog-form button[type="submit"]:hover { background: var(--crimson-dark, #6E1414); }
.iss-blog-form button[disabled] { opacity: .7; cursor: progress; }
.iss-blog-form .iss-lead__error { color: #B42318; font-size: 13px; margin: 4px 0 0; }
.iss-blog-form .iss-lead__error:empty { display: none; }

@container (min-width: 620px) {
  .iss-blog-form:not(.iss-blog-form--stack) .iss-blog-row { grid-template-columns: 1fr 1.25fr 1fr auto; align-items: start; }
  .iss-blog-form:not(.iss-blog-form--stack) .iss-blog-row--compare { grid-template-columns: 1fr 1fr auto; }
}

/* ── B5 compare box ──────────────────────────────────────── */
.iss-blog-compare { border-left: 4px solid var(--crimson, #8B1A1A); }

/* ── B4 callback inside the existing dark mid-article CTA ── */
.blog-article-mid-cta.iss-blog-callback { display: block; container-type: inline-size; }
.iss-blog-callback .iss-blog-callback__copy { position: relative; }
.blog-article-mid-cta.iss-blog-callback p { margin-bottom: 12px; }
.iss-blog-callback__link { display: inline-block; margin: 0 0 16px; color: var(--gold, #C9A84C); font-weight: 700; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }
.iss-blog-callback__link:hover { color: var(--gold-light, #E3C77A); }
.iss-blog-form--dark { position: relative; }
.iss-blog-form--dark input:not([type="hidden"]), .iss-blog-form--dark select { border-color: rgba(255,255,255,.3); }
.iss-blog-form--dark button[type="submit"] { background: var(--gold, #C9A84C); color: var(--ink, #1C1410); }
.iss-blog-form--dark button[type="submit"]:hover { background: var(--gold-light, #E3C77A); }
.blog-article-mid-cta.iss-blog-callback .iss-lead__fine { font-size: 12px; color: rgba(255,255,255,.7); margin: 4px 0 0; }
.blog-article-mid-cta.iss-blog-callback .iss-lead__fine a { color: #fff; text-decoration: underline; }
.iss-blog-form--dark .iss-lead__error { color: #FFD1CC; }
.iss-blog-callback .iss-lead__done-title { color: #B7F0C8; font-weight: 700; margin: 0; }
.iss-blog-callback .iss-lead__done { display: grid; gap: 12px; }
@container (min-width: 620px) {
  .iss-blog-callback .iss-blog-row--callback { grid-template-columns: 1fr 1fr 1.2fr auto; align-items: start; }
}

/* ── B6 sticky bottom bar (desktop + mobile): free career call + brochure ── */
.iss-blog-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 850;
  padding: 10px 16px; padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  background: var(--ink, #1C1410); color: #fff; box-shadow: 0 -8px 28px rgba(0,0,0,.2);
  font-family: var(--sans, system-ui, sans-serif);
  transform: translateY(100%); transition: transform .25s ease;
}
.iss-blog-bar.is-open { transform: none; }
.iss-blog-bar__inner { display: flex; align-items: center; gap: 12px; max-width: 1160px; margin: 0 auto; }
.iss-blog-bar__text { flex: 1; min-width: 0; margin: 0; font-size: 15px; line-height: 1.35; }
.iss-blog-bar__text strong { color: var(--gold, #C9A84C); }
.iss-blog-bar__text span { color: rgba(255,255,255,.82); }
.iss-blog-bar__actions { display: flex; gap: 8px; flex: none; }
.iss-blog-bar__cta, .iss-blog-bar__ghost {
  min-height: 44px; padding: 0 18px; border-radius: 8px; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; white-space: nowrap;
}
.iss-blog-bar__cta { border: 0; background: var(--gold, #C9A84C); color: var(--ink, #1C1410); }
.iss-blog-bar__cta:hover { background: var(--gold-light, #E3C77A); }
.iss-blog-bar__ghost { border: 1.5px solid rgba(255,255,255,.55); background: transparent; color: #fff; }
.iss-blog-bar__ghost:hover { border-color: #fff; }
.iss-blog-bar__close {
  flex: none; width: 44px; height: 44px; border: 0; background: transparent; color: rgba(255,255,255,.75);
  font-size: 24px; line-height: 1; cursor: pointer; border-radius: 50%;
}
.iss-blog-bar__cta:focus-visible, .iss-blog-bar__ghost:focus-visible, .iss-blog-bar__close:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.iss-blog-bar-open .iss-wa-float { bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
.iss-blog-bar-open body { padding-bottom: 72px; }
.iss-blog-dialog .iss-lead__title { padding-right: 36px; }
.iss-blog-dialog ul.iss-blog-bullets { margin-bottom: 14px; }

@media (max-width: 760px) {
  .iss-blog-bar { padding: 8px 8px 8px 12px; padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)); }
  .iss-blog-bar__inner { gap: 6px; }
  .iss-blog-bar__text { display: none; }
  .iss-blog-bar__actions { flex: 1; }
  .iss-blog-bar__cta { flex: 1.4; padding: 0 10px; }
  .iss-blog-bar__ghost { flex: 1; padding: 0 10px; }
  .iss-blog-bar-open .iss-wa-float { bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }
}

/* ── Career call / brochure form rows ────────────────────── */
@container (min-width: 620px) {
  .iss-blog-form:not(.iss-blog-form--stack) .iss-blog-row--call { grid-template-columns: 1fr 1fr 1.1fr auto; }
  .iss-blog-callback .iss-blog-row--call { grid-template-columns: 1fr 1fr 1.2fr auto; align-items: start; }
}
.iss-blog-form--dark .iss-lead__btn--ghost { color: #fff; border-color: rgba(255,255,255,.6); }

@media (prefers-reduced-motion: reduce) {
  .iss-blog-bar { transition: none; }
}
@media print {
  .iss-blog-box, .iss-blog-bar, .iss-blog-callback .iss-blog-form { display: none !important; }
}
