/* Карточки ступеней, экран пользы и видео: общий CSS для сайта (site.html), страницы /tariffs и витрины в планере (index.html).
   Правила 16.10: один акцентный цвет (оранжевый только на кнопке и кольце выбора, тёмный оранжевый для чисел), текст не мельче 13px,
   курсива нет (файлов курсива нет), выбор карточки показан одним способом. */
:root{--orange-ink:#C2461C}
.tiers{display:grid;gap:12px}
.tiers-head h1,.tiers-head h2{margin:0}
.tiers-lede{font-size:16px;line-height:1.45;color:var(--ink2);margin:8px 0 0}
.tiers-head{margin-bottom:22px}   /* воздух между лидом и первой карточкой, его просьба 17.10 */
.tier{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:10px;position:relative;transition:box-shadow .15s,border-color .15s}
.tier .n{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);font-weight:600;display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.tier .t{font-family:var(--fh);font-weight:800;font-size:20px;letter-spacing:-.01em;line-height:1.2}
.tier .price{font-family:var(--fh);font-weight:800;font-size:28px;line-height:1;letter-spacing:-.01em;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
.tier .price small{font:500 14px/1.3 var(--fb);color:var(--ink2);letter-spacing:0}
.tier .who{font-size:16px;line-height:1.45;font-weight:500;color:var(--ink);margin:0}
.tier ul.sum,.tier ul.items{margin:0;padding-left:20px;font-size:16px;line-height:1.5}
.tier ul.sum li{margin:4px 0}
.tier ul.sum li b,.gain .gh b{display:inline;font-family:var(--fb);font-weight:600;font-size:inherit;line-height:inherit;color:var(--ink);margin:0}   /* **жирное** из tariffs.json */
.tier ul.items li{margin:6px 0}
.tier li.live{color:var(--ink);font-weight:500}
.tier li .k{display:block;font-weight:600}
.tier li .d{display:block;font-size:15px;line-height:1.45;color:var(--ink2);margin-top:2px}
.tier .det{display:flex;flex-direction:column;gap:8px}
.tier .g{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);font-weight:600;margin-top:4px}
.tier .plus{background:var(--cream);border-radius:12px;padding:10px 12px;font-size:15px;line-height:1.45;color:var(--ink)}
.tier .plus b{display:block;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);margin-bottom:4px;font-weight:600}
.tier .more{align-self:flex-start;border:0;background:transparent;color:var(--ink);font:600 16px var(--fb);padding:10px 0;margin:-6px 0;cursor:pointer;min-height:44px}
.tier .fine{font-size:13px;line-height:1.45;color:var(--ink2);margin:0}
.tier .own{font-size:14px;color:var(--ok);font-weight:600;padding:8px 0 2px}
.tier .own.muted{color:var(--ink2)}
.tier .btn{margin-top:4px}
.tier.sel{border-color:var(--orange);box-shadow:0 0 0 1px var(--orange)}   /* тоньше: «не вырвиглазно» */
.tier.soldout{opacity:.7}
.tier.owned{opacity:.85}
.tier .n .bdg{display:inline-block;font-size:13px;letter-spacing:0;text-transform:none;border-radius:999px;padding:3px 10px;background:var(--line);color:var(--ink);font-weight:600}
.tier .n .bdg.own{background:var(--ok);color:#fff}
.tiers-foot{font-size:13px;color:var(--ink2);margin-top:14px;line-height:1.5}
.tiers-foot a{color:inherit;text-decoration:none}
.tiers-closed{text-align:center;padding:40px 16px}
.ladder{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 0 4px}.ladder::-webkit-scrollbar{display:none}
.ladder .lad{flex:0 0 auto;border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:8px 12px;font:600 13px var(--fb);color:var(--ink);display:flex;align-items:center;gap:6px}
.ladder .lad span{font-size:13px;color:var(--ink2);font-weight:600}
.ladder .lad.on{background:var(--ink);color:#fff;border-color:var(--ink)}.ladder .lad.on span{color:#F6D9CC}
/* панель покупки в планере */
.shop-bar{position:fixed;left:0;right:0;bottom:calc(54px + var(--safe-b));z-index:6;background:var(--paper);border-top:1px solid var(--line);padding:10px 16px calc(10px);display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.shop-bar .legal{flex:1 1 100%;font-size:13px;color:var(--ink2);line-height:1.4;margin-top:2px}.shop-bar .legal a{color:var(--ink2);text-decoration:underline;text-underline-offset:2px}
.shop-bar.solo{bottom:0;padding-bottom:calc(10px + var(--safe-b))}
.shop-bar .s{flex:1;font-size:14px;color:var(--ink2);line-height:1.4}.shop-bar .s b{color:var(--ink);font-weight:600;display:block;font-size:15px}
.shop-bar .btn{width:auto;padding:13px 18px;border-radius:12px;white-space:nowrap}
.shop-trust{font-size:13px;color:var(--ink2);text-align:center;margin-top:10px}
.shop-skip{display:block;text-align:center;font-size:14px;color:var(--ink2);text-decoration:underline;margin-top:18px;background:none;border:0;width:100%;font-family:var(--fb);min-height:44px}
/* экран пользы: три плитки */
/* ролик 16:9 на сайте и в витрине планера; .vid-ph — заглушка-кадр на сайте, пока файла нет */
.vid{width:100%;max-width:640px;margin:0 auto}   /* width обязателен: в grid элемент с margin:auto и без содержимого схлопывается в 0 */
.vid video,.vid .vid-ph{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:var(--r);background:#000 center/cover no-repeat;object-fit:cover}
.vid video[hidden],.vid .vid-ph[hidden]{display:none}
.vid .vid-ph{position:relative}
.vid .vid-ph .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:50%;background:var(--orange);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;padding-left:4px}
/* отзывы: общие для сайта и витрины планера */
.photos{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-bottom:12px;padding-bottom:4px}
.photos::-webkit-scrollbar{display:none}
.photos img{flex:0 0 150px;width:150px;aspect-ratio:3/4;object-fit:cover;border-radius:14px;display:block;background:var(--paper)}
.reviews{display:grid;gap:10px}
.rev{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.rev q{display:block;quotes:"«" "»";font-size:15px;line-height:1.45}
.results{display:grid;gap:10px;margin-bottom:10px}
.rev.res q{font-size:16px;color:var(--ink)}
.rev .tag{display:block;font:600 13px/1.4 var(--fb);letter-spacing:.06em;text-transform:uppercase;color:var(--orange-ink);margin-bottom:6px}
details.fold{margin-top:10px}
details.fold summary{list-style:none;cursor:pointer;font:600 16px var(--fb);color:var(--ink);padding:10px 0;min-height:44px;display:flex;align-items:center;gap:6px}
details.fold summary::-webkit-details-marker{display:none}
details.fold summary::after{content:"▾"}
details.fold[open] summary::after{content:"▴"}
.reviews-note{margin-top:14px;font-size:14px;color:var(--ink2)}
@media (min-width:720px){.reviews{grid-template-columns:repeat(3,1fr)}.results{grid-template-columns:repeat(3,1fr)}}
.gains{display:grid;gap:10px}
.gain{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.gain .gl{display:block;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);font-weight:600}
.gain>b{display:block;font-family:var(--fh);font-weight:800;font-size:24px;letter-spacing:-.01em;line-height:1.1;color:var(--orange-ink);margin-top:6px}   /* мельче заголовка секции, его правило 17.10 */   /* только заголовок плитки, не жирное в абзаце */
.gain .gs{display:block;font-size:15px;line-height:1.4;color:var(--ink2);margin-top:4px}
.gain .gh{font-size:16px;line-height:1.45;color:var(--ink);margin:10px 0 0}
.gain .gw{font-size:14px;line-height:1.45;color:var(--ink2);margin:8px 0 0}.gain .gw b{font:600 14px var(--fb);color:var(--ink2);display:inline;margin:0}
.gains.compact{grid-template-columns:repeat(3,1fr);gap:8px}
.gains.compact .gain{padding:10px 8px;text-align:center}
.gains.compact .gain b{font-size:18px;margin-top:4px}
.gains.compact .gain .gs{font-size:13px;margin-top:2px}
@media (min-width:720px){.gains{grid-template-columns:repeat(3,1fr)}.gain>b{font-size:28px}}
/* видео владельца: вертикальное 9:16 */
