/* "Help me choose" guides */
.entry-content > .icona-guide { max-width: var(--container, 1140px); margin: 0 auto !important; padding: 40px 15px 60px; }
.icona-guide__intro { font-size: 16px; margin: 0 0 24px; }

/* Guide list (/help-me-choose/) */
.icona-guide__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.icona-guide__list a { display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 24px; border: 1px solid var(--line, #e5e5e5); border-radius: 6px; background: #fff; color: var(--text); text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.icona-guide__list a:hover { border-color: var(--blue); box-shadow: 0 6px 20px rgba(2, 52, 87, .08); }
.icona-guide__list strong { font-size: 18px; color: var(--heading); }
.icona-guide__list em { margin-top: auto; padding-top: 8px; font-style: normal; font-weight: 600; color: var(--blue); }

/* Steps */
.ig-step { max-width: 760px; margin: 0 auto; }
.ig-step--wide { max-width: none; }
.ig-top { display: flex; align-items: center; justify-content: space-between; min-height: 28px; margin-bottom: 6px; }
.ig-count { margin-left: auto; font-size: 12px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: var(--blue); }
.ig-back, .ig-link { padding: 0; border: 0; background: none; color: var(--blue); font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; }
.ig-back:hover, .ig-link:hover { text-decoration: underline; }
.ig-h { margin: 0 0 6px; font-size: 26px; line-height: 1.3; color: var(--heading); outline: none; }
.ig-sub { margin: 0 0 20px; font-size: 15px; }
.ig-step--wide .ig-h { margin-bottom: 14px; }

.ig-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.ig-opt { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border: 2px solid var(--line, #e5e5e5); border-radius: 6px; background: #fff; text-align: left; font: inherit; color: var(--text); cursor: pointer; transition: border-color .15s, background .15s, box-shadow .15s; }
.ig-opt:hover, .ig-opt:focus-visible { border-color: var(--blue); box-shadow: 0 4px 14px rgba(2, 52, 87, .08); outline: none; }
.ig-opt__t { font-size: 16px; font-weight: 700; color: var(--heading); }
.ig-opt__d { font-size: 14px; line-height: 1.5; }
.ig-opt--alt { border-style: dashed; background: var(--light, #f8f9fb); }
.ig-opt.is-on { border-color: var(--blue); background: #eef5fc; }
.ig-opt[aria-pressed] .ig-opt__t::before { content: ""; display: inline-block; width: 16px; height: 16px; margin: 0 8px -2px 0; border: 2px solid #b5bcc4; border-radius: 3px; background: #fff; }
.ig-opt.is-on .ig-opt__t::before { border-color: var(--blue); background: var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3 3 7-7' fill='none' stroke='%23fff' stroke-width='2.2'/%3E%3C/svg%3E") center/12px no-repeat; }
.ig-tag { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 10px; background: #e3f4e8; color: #1a7f37; font-size: 11px; font-weight: 600; vertical-align: 2px; }
.ig-actions { margin: 22px 0 0; }
.ig-actions .icona-btn[disabled] { opacity: .45; cursor: not-allowed; }

.ig-suggest { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 14px 0 4px; padding: 14px 18px; border-left: 4px solid #1a7f37; border-radius: 4px; background: #effaf2; }
.ig-suggest strong { color: var(--heading); font-size: 16px; }
.ig-suggest span { flex: 1 1 260px; }
.ig-note { margin-top: 22px; padding: 14px 18px; border-radius: 6px; background: var(--light, #f8f9fb); border: 1px solid var(--line, #e5e5e5); line-height: 1.6; }
.ig-note strong { display: block; margin-bottom: 2px; color: var(--heading); }

/* Results */
.ig-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 26px; }
.ig-chips span { padding: 4px 12px; border-radius: 14px; background: #eef5fc; color: var(--deep, #023457); font-size: 13px; font-weight: 600; }
.ig-res { margin: 0 0 34px; }
.ig-res h3 { margin: 0 0 6px; font-size: 20px; color: var(--heading); }
.ig-res > p { max-width: 760px; margin: 0 0 16px; }
.ig-res--rec h3::before { content: "\2605"; margin-right: 8px; color: #e0a100; }
.ig-res--alt { padding-top: 26px; border-top: 1px solid var(--line, #e5e5e5); }
.ig-empty { padding: 14px 18px; border-radius: 6px; background: var(--light, #f8f9fb); }
.ig-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 20px; }
.ig-card a { display: flex; flex-direction: column; height: 100%; border: 1px solid var(--line, #e5e5e5); border-radius: 6px; overflow: hidden; background: #fff; color: var(--text); text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.ig-card a:hover { border-color: var(--blue); box-shadow: 0 6px 20px rgba(2, 52, 87, .1); }
/* Fixed-size picture box; the picture is fitted inside so every card lines up (Chrome ignores max-height:100% here). */
.ig-card__img { position: relative; display: block; flex: none; aspect-ratio: 4 / 3; background: #fff; border-bottom: 1px solid var(--line, #e5e5e5); }
.ig-card__img img { position: absolute; top: 14px; left: 14px; width: calc(100% - 28px) !important; height: calc(100% - 28px) !important; max-width: none; object-fit: contain; }
.ig-card__body { display: flex; flex-direction: column; flex: 1; gap: 4px; padding: 14px 16px 16px; }
.ig-card__brand { font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--blue); }
.ig-card__title { font-size: 16px; font-weight: 700; line-height: 1.35; color: var(--heading); }
.ig-card__note { font-size: 13px; line-height: 1.5; }
.ig-card__label { margin-top: 8px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: #8a9097; }
.ig-card__cfgs { display: flex; flex-wrap: wrap; gap: 4px; }
.ig-card__cfgs span { padding: 2px 8px; border-radius: 3px; background: #f1f3f5; font-size: 12px; line-height: 1.6; }
.ig-card__cfgs .is-match { background: var(--blue); color: #fff; font-weight: 600; }
.ig-card__facts { margin-top: 6px; font-size: 12px; line-height: 1.6; }
.ig-card__facts b { font-weight: 600; color: var(--heading); }
.ig-card__differs { margin-top: 8px; padding: 6px 10px; border-radius: 4px; background: #fff6e5; color: #7a4d00; font-size: 12px; line-height: 1.55; }
.ig-card__draft { align-self: flex-start; margin-bottom: 4px; padding: 1px 8px; border-radius: 3px; background: #fcf0f1; color: #b32d2e; font-size: 11px; font-weight: 600; }
.ig-card__more { margin-top: auto; padding-top: 10px; font-weight: 600; color: var(--blue); }

.ig-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px; border-radius: 6px; background: var(--deep, #023457); color: #dfe8f0; }
.ig-cta strong { color: #fff; font-size: 16px; }
.ig-cta div { flex: 1 1 320px; }

/* Chair count buttons (compressor and suction guides) */
.ig-opts--chairs { grid-template-columns: repeat(3, 1fr); }
.ig-opts--chairs .ig-opt { align-items: center; text-align: center; }
.ig-opts--chairs .ig-opt--alt { grid-column: 1 / -1; }

/* Order codes (handpiece guide) */
.ig-codes { display: flex; flex-direction: column; gap: 3px; margin-top: 2px; font-size: 12px; line-height: 1.45; }
.ig-codes span { padding: 3px 8px; border-radius: 3px; background: #eef5fc; }
.ig-codes b { margin-right: 4px; font-weight: 700; color: var(--deep, #023457); letter-spacing: .3px; }
.ig-codes em { display: block; font-style: normal; color: #7a4d00; }

/* Comparison table (steriliser guide) */
.ig-cmp { overflow-x: auto; border: 1px solid var(--line, #e5e5e5); border-radius: 6px; background: #fff; }
.ig-cmp:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.ig-cmp table { width: 100%; min-width: 640px; margin: 0; border-collapse: collapse; font-size: 14px; line-height: 1.45; }
.ig-cmp th, .ig-cmp td { padding: 10px 14px; border: 0; border-bottom: 1px solid var(--line, #e5e5e5); text-align: left; vertical-align: top; }
.ig-cmp tbody tr:last-child th, .ig-cmp tbody tr:last-child td { border-bottom: 0; }
.ig-cmp tbody tr:nth-child(even) { background: var(--light, #f8f9fb); }
.ig-cmp tbody th { position: sticky; left: 0; z-index: 1; width: 150px; background: inherit; background-color: #fff; color: var(--heading); font-size: 13px; font-weight: 600; }
.ig-cmp tbody tr:nth-child(even) th { background-color: var(--light, #f8f9fb); }
.ig-cmp thead th { padding-top: 16px; vertical-align: bottom; }
.ig-cmp thead a { display: flex; flex-direction: column; gap: 6px; color: var(--heading); font-weight: 700; text-decoration: none; }
.ig-cmp thead a:hover span:last-child { color: var(--blue); text-decoration: underline; }
.ig-cmp thead img { display: block; width: 100%; max-width: 150px; height: 110px !important; object-fit: contain; }
.ig-cmp__mark { align-self: flex-start; padding: 1px 8px; border-radius: 10px; background: #e3f4e8; color: #1a7f37; font-size: 11px; font-weight: 600; }
.ig-cmp__none { color: #b5bcc4; }
.ig-cmp__foot { margin: 10px 0 0; font-size: 13px; color: #6b7280; }
.ig-cmp__foot a { font-weight: 600; color: var(--blue); }
.ig-note a { font-weight: 600; color: var(--blue); }
.ig-res + .ig-note, .ig-cmp__foot + .ig-note { margin-bottom: 26px; }

/* Banner on category pages */
.icona-guide-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin: 0 0 24px; padding: 16px 20px; border: 1px solid #cfe0f1; border-left: 4px solid var(--blue); border-radius: 4px; background: #f3f8fd; color: var(--text); text-decoration: none; }
.icona-guide-banner:hover { background: #eaf3fc; }
.icona-guide-banner--two:hover { background: #f3f8fd; }
.icona-guide-banner--two .icona-guide-banner__btn { text-decoration: none; }
.icona-guide-banner--two .icona-guide-banner__btn:hover { filter: brightness(1.1); }
.icona-guide-banner__text { flex: 1 1 360px; }
.icona-guide-banner__text strong { display: block; color: var(--heading); font-size: 15px; }
.icona-guide-banner__btn { flex: none; padding: 9px 18px; border-radius: 2px; background: var(--grad); color: #fff; font-size: 13px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }

@media (max-width: 640px) {
	.entry-content > .icona-guide { padding-top: 24px; }
	.ig-opts { grid-template-columns: 1fr; }
	.ig-opts--chairs { grid-template-columns: repeat(2, 1fr); }
	.ig-h { font-size: 22px; }
	.icona-guide-banner__btn { width: 100%; text-align: center; }
	.ig-cmp table { min-width: 560px; font-size: 13px; }
	.ig-cmp th, .ig-cmp td { padding: 8px 10px; }
	.ig-cmp tbody th { width: 96px; font-size: 12px; }
	.ig-cmp thead img { height: 80px !important; }
}
.ig-card__long { margin-top: 8px; padding: 6px 10px; border-radius: 4px; background: #e8f3fc; color: #0b4a7a; font-size: 12px; line-height: 1.55; font-weight: 600; }