/* /inspection-checklist/ — scoped to .hm .ic-* (built by _tooling/build_inspection.py) */
.hm .ic-wrap { padding: 40px 8vw 120px; max-width: 1100px; margin: 0 auto; overflow: visible; }
.hm .ic-hero p { max-width: 760px; }
.hm .ic-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.hm .ic-card { background: var(--dark2); border: 1px solid rgba(246,246,248,0.08); border-radius: 4px; padding: 30px 32px; margin-bottom: 22px; }
.hm .ic-card h2, .hm .ic-sec legend { font-family: 'Barlow Condensed', sans-serif; font-size: 26px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: #fff; margin-bottom: 18px; }
.hm .ic-card h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 18px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--red-bright); margin-bottom: 10px; }
.hm .ic-sub { color: var(--muted); font-size: 16px; line-height: 1.55; margin: -8px 0 18px; }
.hm .ic-how { margin: 0 0 18px; }
.hm .ic-tips { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; border-color: rgba(200,16,46,0.3); }
.hm .ic-tips ul { list-style: none; }
.hm .ic-tips li { color: #dcdce4; font-size: 16px; line-height: 1.5; padding: 3px 0 3px 18px; position: relative; }
.hm .ic-tips li::before { content: ""; position: absolute; left: 0; top: 12px; width: 7px; height: 2px; background: var(--red-bright); }

.hm .ic-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 18px; }
.hm .ic-field { display: flex; flex-direction: column; gap: 7px; }
.hm .ic-full { grid-column: 1 / -1; }
.hm .ic-field > span { font-family: 'Barlow Condensed', sans-serif; font-size: 15px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muted); }
.hm .ic-q > span { text-transform: none; letter-spacing: .3px; font-size: 17px; color: #e7e7ee; }
.hm .ic-q { margin-bottom: 14px; }
.hm .ic-req { color: var(--red-bright); }
.hm .ic-field input, .hm .ic-field textarea, .hm .ic-field select {
  width: 100%; background: var(--dark); color: #fff; border: 1px solid rgba(246,246,248,0.16); border-radius: 3px;
  padding: 12px 14px; font: 400 16px/1.4 'Barlow', sans-serif; transition: border-color .2s, box-shadow .2s; }
.hm .ic-field textarea { resize: vertical; min-height: 54px; }
.hm .ic-field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #b9b9c4 50%), linear-gradient(135deg, #b9b9c4 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 40px; }
.hm .ic-field input:focus, .hm .ic-field textarea:focus, .hm .ic-field select:focus { outline: none; border-color: var(--red-bright); box-shadow: 0 0 0 3px rgba(200,16,46,0.25); }
.hm .ic-field.ic-bad input { border-color: var(--red-bright); }

.hm .ic-progress { position: sticky; top: 84px; z-index: 5; background: rgba(13,13,15,0.94); border: 1px solid rgba(200,16,46,0.35); border-radius: 4px; padding: 12px 18px; margin-bottom: 18px; font-family: 'Barlow Condensed', sans-serif; font-size: 17px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; color: #fff; backdrop-filter: blur(6px); }
.hm .ic-progress #ic-count { color: var(--red-bright); }
.hm .ic-bar { height: 4px; background: rgba(246,246,248,0.1); border-radius: 2px; margin-top: 8px; overflow: hidden; }
.hm .ic-bar i { display: block; height: 100%; width: 0; background: var(--red); transition: width .25s; }

.hm .ic-sec { border: 1px solid rgba(246,246,248,0.08); }
.hm .ic-sec legend { float: left; width: 100%; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; }
.hm .ic-sec legend small { font-size: 15px; font-weight: 500; letter-spacing: 1px; color: var(--muted); text-transform: none; }
.hm .ic-num { font-family: 'Bebas Neue', sans-serif; font-size: 30px; color: var(--red-bright); letter-spacing: 1px; }
.hm .ic-items { clear: both; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 26px; margin-bottom: 16px; }
.hm .ic-item { display: flex; align-items: flex-start; gap: 12px; padding: 10px 6px; cursor: pointer; border-bottom: 1px solid rgba(246,246,248,0.06); color: #dcdce4; font-size: 16.5px; line-height: 1.4; }
.hm .ic-item input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hm .ic-item b { flex: 0 0 24px; height: 24px; border: 1.5px solid rgba(246,246,248,0.35); border-radius: 3px; position: relative; transition: background .15s, border-color .15s; margin-top: -1px; }
.hm .ic-item input:checked + b { background: var(--red); border-color: var(--red); }
.hm .ic-item input:checked + b::after { content: ""; position: absolute; left: 7px; top: 3px; width: 6px; height: 12px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.hm .ic-item input:checked ~ span { color: #fff; }
.hm .ic-item input:focus-visible + b { box-shadow: 0 0 0 3px rgba(200,16,46,0.45); }
.hm .ic-item:hover b { border-color: var(--red-bright); }

.hm .ic-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 30px; }
.hm .ic-msg { flex-basis: 100%; min-height: 1px; font-size: 16px; color: var(--red-bright); }
.hm .ic-msg:empty { display: none; }
.hm .ic-actions button[disabled] { opacity: .6; cursor: wait; }
.hm .ic-done { text-align: center; padding: 60px 32px; }
.hm .ic-done p { color: #dcdce4; font-size: 18px; line-height: 1.6; margin-bottom: 26px; }
.hm .ic-done a { color: #fff; font-weight: 600; }

@media (max-width: 860px) {
  .hm .ic-grid { grid-template-columns: 1fr 1fr; }
  .hm .ic-items { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .hm .ic-wrap { padding: 24px 16px 80px; }
  .hm .ic-card { padding: 22px 18px; }
  .hm .ic-grid, .hm .ic-tips { grid-template-columns: 1fr; }
  .hm .ic-actions button { width: 100%; justify-content: center; }
}

/* phone note + QR (QR only on desktop) */
.hm .ic-phone { display: flex; align-items: center; justify-content: space-between; gap: 24px; border-color: rgba(200,16,46,0.45); background: linear-gradient(135deg, rgba(200,16,46,0.14), var(--dark2) 60%); }
.hm .ic-phone p { color: #e7e7ee; font-size: 17px; line-height: 1.55; max-width: 620px; }
.hm .ic-qr { flex: 0 0 auto; text-align: center; }
.hm .ic-qr img { display: block; width: 132px; height: 132px; border-radius: 4px; background: #fff; margin: 0 auto 8px; }
.hm .ic-qr span { font-family: 'Barlow Condensed', sans-serif; font-size: 14px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muted); }

/* photos */
.hm .ic-photos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.hm .ic-ph { position: relative; }
.hm .ic-ph[hidden] { display: none; }
.hm .ic-ph label { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; aspect-ratio: 4 / 3; border: 1.5px dashed rgba(246,246,248,0.28); border-radius: 4px; background: var(--dark); cursor: pointer; overflow: hidden; text-align: center; padding: 10px; transition: border-color .2s; }
.hm .ic-ph label:hover { border-color: var(--red-bright); }
.hm .ic-ph input[type=file] { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hm .ic-ph input[type=file]:focus-visible + .ic-cam { outline: 3px solid rgba(200,16,46,0.6); }
.hm .ic-ph span { font-family: 'Barlow Condensed', sans-serif; font-size: 15px; font-weight: 600; letter-spacing: .8px; text-transform: uppercase; color: #dcdce4; line-height: 1.2; }
.hm .ic-cam { width: 34px; height: 26px; border: 2px solid var(--red-bright); border-radius: 5px; position: relative; }
.hm .ic-cam::before { content: ""; position: absolute; left: 50%; top: 50%; width: 11px; height: 11px; border: 2px solid var(--red-bright); border-radius: 50%; transform: translate(-50%, -50%); }
.hm .ic-cam::after { content: ""; position: absolute; left: 7px; top: -6px; width: 10px; height: 4px; background: var(--red-bright); border-radius: 2px 2px 0 0; }
.hm .ic-plus { border-radius: 50%; width: 32px; height: 32px; }
.hm .ic-plus::before { width: 14px; height: 2px; border: 0; border-radius: 0; background: var(--red-bright); }
.hm .ic-plus::after { left: 50%; top: 50%; width: 2px; height: 14px; transform: translate(-50%, -50%); border-radius: 0; }
.hm .ic-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hm .ic-ph.ic-has label { border-style: solid; border-color: var(--red); }
.hm .ic-ph.ic-has label span { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; background: rgba(7,7,7,0.78); padding: 6px; font-size: 13px; }
.hm .ic-more .ic-ph:not(.ic-add) label span { display: none; }
.hm .ic-x { position: absolute; top: 6px; right: 6px; z-index: 2; width: 34px; height: 34px; border-radius: 50%; border: 0; background: rgba(7,7,7,0.85); color: #fff; font-size: 22px; line-height: 34px; cursor: pointer; }
.hm .ic-x[hidden] { display: none; }
.hm .ic-dmg-h { margin-top: 26px; }
.hm .ic-add label { border-color: rgba(200,16,46,0.6); }

/* "All good" per section */
.hm .ic-sec { position: relative; }
.hm .ic-all { position: absolute; top: 28px; right: 30px; background: transparent; border: 1px solid rgba(200,16,46,0.55); color: var(--red-bright); font-family: 'Barlow Condensed', sans-serif; font-size: 15px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; padding: 8px 14px; border-radius: 3px; cursor: pointer; }
.hm .ic-all:hover { background: rgba(200,16,46,0.12); }
.hm .ic-sec legend { padding-right: 150px; }

/* phones */
@media (max-width: 860px) {
  .hm .ic-photos { grid-template-columns: repeat(2, 1fr); }
  .hm .ic-qr { display: none; }
}
@media (max-width: 600px) {
  .hm .ic-hero { padding-top: 120px; padding-bottom: 34px; }
  .hm .ic-hero h1 { font-size: 54px; }
  .hm .ic-hero p { font-size: 17px; }
  .hm .ic-card h2, .hm .ic-sec legend { font-size: 23px; }
  .hm .ic-sec legend { padding-right: 0; }
  .hm .ic-all { position: static; display: block; width: 100%; margin: 0 0 10px; padding: 12px; font-size: 16px; }
  .hm .ic-item { padding: 14px 4px; font-size: 17px; gap: 14px; }
  .hm .ic-item b { flex-basis: 28px; height: 28px; }
  .hm .ic-item input:checked + b::after { left: 9px; top: 4px; width: 7px; height: 14px; }
  .hm .ic-field input, .hm .ic-field textarea, .hm .ic-field select { padding: 14px; font-size: 16px; }
  .hm .ic-progress { top: 0; margin: 0 -16px 18px; border-radius: 0; border-width: 0 0 1px; padding: 10px 16px; }
  .hm .ic-ph span { font-size: 14px; }
  .hm .ic-print-hide, .hm #ic-print { display: none; }
}
@media print {
  header, footer, .site-header, .site-footer, .ic-actions, .ic-progress, .ic-tips, .ic-phone, .ic-all, .ic-x, .ic-add { display: none !important; }
  body, .hm, .hm .page-hero, .hm .ic-card { background: #fff !important; color: #000 !important; }
  .hm .page-hero { padding: 0 0 12px; }
  .hm .page-hero h1 { font-size: 36px; color: #000; }
  .hm .page-hero p, .hm .ic-item, .hm .ic-field > span, .hm .ic-card h2, .hm .ic-sec legend { color: #000 !important; }
  .hm .ic-wrap { padding: 0; }
  .hm .ic-card { border: 1px solid #999; padding: 12px; break-inside: avoid; }
  .hm .ic-field input, .hm .ic-field textarea, .hm .ic-field select { background: #fff; color: #000; border: 1px solid #999; }
  .hm .ic-item b { border-color: #000; }
}

/* site wrapper is overflow-x:hidden, which breaks sticky; clip keeps the same look without a scroll container */
.hm:has(.ic-form) { overflow-x: clip; overflow-y: visible; }