/* Блок 02 «Какая сетка под вашу задачу». Без JS видны все задачи стопкой, вкладки скрыты. */
.ig[data-ig="podbor"] .ig-defs { position: absolute; width: 0; height: 0; overflow: hidden; }

/* Вкладки нужны только с JS */
.ig[data-ig="podbor"] .ig-pb-tabs { display: none; }
.ig-js .ig[data-ig="podbor"] .ig-pb-tabs { display: flex; }
.ig-js .ig[data-ig="podbor"] .ig-pb-panel:not(.is-on) { display: none; }
.ig[data-ig="podbor"] .ig-pb-panel + .ig-pb-panel { margin-top: clamp(28px, 4vw, 44px); padding-top: clamp(24px, 3vw, 36px); border-top: 1px solid var(--ig-line); }
.ig-js .ig[data-ig="podbor"] .ig-pb-panel + .ig-pb-panel { margin-top: 0; padding-top: 0; border-top: 0; }
.ig-js .ig[data-ig="podbor"].is-in .ig-pb-panel.is-on { animation: ig-pb-show 400ms var(--ig-ease-out); }
@keyframes ig-pb-show { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* Чертёж */
.ig[data-ig="podbor"] .ig-pb-fig { max-width: 620px; }
.ig[data-ig="podbor"] .ig-pb-svg .t { font-size: 12.5px; }
.ig[data-ig="podbor"] .ig-pb-cap { margin-top: 8px; font-size: 12px; color: var(--ig-muted); letter-spacing: .04em; }
.ig[data-ig="podbor"] .ig-pb-edge { stroke: var(--ig-line-2); stroke-width: 1; fill: none; }
.ig[data-ig="podbor"] .ig-pb-outline { fill: none; stroke: var(--ig-line-2); stroke-width: 1; }
.ig[data-ig="podbor"] .ig-pb-wall { stroke: var(--ig-line-2); stroke-width: 1; }
.ig[data-ig="podbor"] .ig-pb-joint { fill: var(--ig-card); }
.ig[data-ig="podbor"] .ig-pb-rod { stroke: var(--ig-accent); stroke-linecap: round; fill: none; }
.ig[data-ig="podbor"] .ig-pb-node { fill: var(--ig-accent); }
.ig[data-ig="podbor"] .ig-pb-chair { fill: var(--ig-neutral-2); stroke: var(--ig-neutral); stroke-width: 1; stroke-linejoin: round; }
.ig[data-ig="podbor"] .ig-pb-pipe { fill: none; stroke: var(--ig-steel); stroke-width: 2.5; }
.ig[data-ig="podbor"] .ig-pb-load { stroke: var(--ig-neutral); stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.ig[data-ig="podbor"] .ig-pb-mid { stroke: var(--ig-accent); stroke-width: 1; }
.ig[data-ig="podbor"] .ig-pb-lead { stroke: var(--ig-muted); stroke-width: 1; fill: none; }
.ig[data-ig="podbor"] .ig-pb-dot { fill: var(--ig-head); stroke: var(--ig-card); stroke-width: 1.5; }
.ig[data-ig="podbor"] .ig-pb-dot.is-a { fill: var(--ig-accent); }
.ig[data-ig="podbor"] .ig-pb-mortar { fill: #1d1f21; }
.ig[data-ig="podbor"] .ig-pb-brick { fill: #2f3236; }
.ig[data-ig="podbor"] .ig-pb-opening { fill: var(--ig-deep); stroke: var(--ig-line-2); stroke-width: 1; }

/* Карточка рекомендации */
.ig[data-ig="podbor"] .ig-pb-card { padding-top: 4px; }
.ig[data-ig="podbor"] .ig-pb-card__h { margin: 0 0 18px; font: 600 clamp(20px, 2vw, 24px)/1.15 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .01em; color: var(--ig-head); }
.ig[data-ig="podbor"] .ig-pb-card__h span { font: 300 15px/1.3 'Inter', sans-serif; text-transform: none; letter-spacing: 0; color: var(--ig-muted); }
.ig[data-ig="podbor"] .ig-pb-card__k { margin: 0 0 10px; font: 500 11px/1.2 'Inter', sans-serif; letter-spacing: .15em; text-transform: uppercase; color: var(--ig-muted); }
.ig[data-ig="podbor"] .ig-pb-rec { display: flex; flex-wrap: wrap; gap: 6px clamp(20px, 3vw, 32px); align-items: flex-end; padding: 16px 0 14px; border-top: 1px solid var(--ig-accent); border-bottom: 1px solid var(--ig-line); }
.ig[data-ig="podbor"] .ig-pb-rec__c { display: flex; flex-direction: column; }
.ig[data-ig="podbor"] .ig-pb-rec__v { font: 600 var(--ig-fs-num-l)/1 'Oswald', sans-serif; letter-spacing: -.01em; color: var(--ig-accent); font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; white-space: nowrap; }
.ig[data-ig="podbor"] .ig-pb-rec__l { margin-top: 8px; font-size: 13px; color: var(--ig-muted); }
.ig[data-ig="podbor"] .ig-pb-rec__alt { color: var(--ig-text); }
.ig[data-ig="podbor"] .ig-pb-type { margin: 12px 0 0; font-size: 15px; color: var(--ig-muted); }
.ig[data-ig="podbor"] .ig-pb-type b { font-weight: 500; color: var(--ig-head); }
.ig[data-ig="podbor"] .ig-pb-rules { margin: 18px 0 0; padding: 0; list-style: none; counter-reset: pb; }
.ig[data-ig="podbor"] .ig-pb-rules li { position: relative; padding: 9px 0 9px 34px; border-top: 1px solid var(--ig-line); font-size: 15px; line-height: 1.4; color: var(--ig-text); counter-increment: pb; }
.ig[data-ig="podbor"] .ig-pb-rules li:last-child { border-bottom: 1px solid var(--ig-line); }
.ig[data-ig="podbor"] .ig-pb-rules li::before { content: counter(pb, decimal-leading-zero); position: absolute; left: 0; top: 10px; font: 600 12px/1.4 'Oswald', sans-serif; letter-spacing: .08em; color: var(--ig-accent); }
.ig[data-ig="podbor"] .ig-pb-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 22px; }
.ig[data-ig="podbor"] .ig-pb-more { margin-top: clamp(18px, 2.4vw, 26px); padding: 12px 0; font-size: 14px; color: var(--ig-text); text-decoration: none; border-bottom: 1px solid var(--ig-line-2); transition: color var(--ig-t-hover) ease, border-color var(--ig-t-hover) ease; }
.ig[data-ig="podbor"] .ig-pb-more::after { content: " →"; color: var(--ig-accent); }
.ig[data-ig="podbor"] .ig-pb-more:hover { color: var(--ig-head); border-color: var(--ig-accent); }
.ig[data-ig="podbor"] .ig-pb-more:focus-visible { outline: 2px solid var(--ig-accent-2); outline-offset: 2px; }

@media (max-width: 760px) {
  /* чертёж ужимается ~0,7: подписи 17 ед. ≈ 12 px на экране */
  .ig[data-ig="podbor"] .ig-pb-svg .t { font-size: 18.5px; }
  .ig[data-ig="podbor"] .ig-pb-tabs { gap: 6px; }
  .ig[data-ig="podbor"] .ig-pb-tabs .ig-tab { padding: 8px 12px; font-size: 13.5px; }
}
