/* Стили страницы проекта и калькулятора (вынесены из _src/project.template.html) */
  .gallery-tabs { display:flex; gap:8px; background:var(--color-bg-alt); border-radius: var(--radius-pill); padding:6px; width:fit-content; margin: 18px auto 0; flex-wrap:wrap; justify-content:center; }
  .gallery-tabs button { border:none; background:none; padding:10px 20px; border-radius: var(--radius-pill); font-weight:700; font-size:14px; cursor:pointer; color:var(--color-text-muted); }
  .gallery-tabs button.is-active { background:#fff; color:var(--color-ink); box-shadow: var(--shadow-soft); }
  .gallery-media { position:relative; border-radius: var(--radius-l); overflow:hidden; aspect-ratio: 16/9; background:var(--color-ink); margin-top:18px; }
  .gallery-slide { position:absolute; inset:0; opacity:0; transition:opacity .3s; pointer-events:none; }
  .gallery-slide.is-active { opacity:1; pointer-events:auto; }
  .gallery-slide > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .gallery-slide[data-gimg="plan"] { background:#fff; }
  .gallery-slide[data-gimg="plan"] > img { object-fit:contain; padding:8px; }
  .gallery-slide[data-gimg="plan"] .gallery-carousel__track img { object-fit:contain; background:#fff; padding:8px; }
  .gallery-slide[data-gimg="plan"] .gallery-dot { background:rgba(18,51,30,.28); }
  .gallery-slide[data-gimg="plan"] .gallery-dot.is-active { background:#12331e; }
  .gallery-carousel { position:relative; width:100%; height:100%; overflow:hidden; border-radius: var(--radius-l); }
  .gallery-carousel__track { display:flex; width:100%; height:100%; transition: transform .35s ease; }
  .gallery-carousel__track img { flex:0 0 100%; width:100%; height:100%; object-fit:cover; }
  .gallery-arrow { position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; border:none; background:rgba(18,51,30,.55); color:#fff; font-size:22px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:5; transition:background .2s; }
  .gallery-arrow:hover { background:rgba(18,51,30,.85); }
  .gallery-arrow--prev { left:14px; }
  .gallery-arrow--next { right:14px; }
  .gallery-badge { position:absolute; top:14px; left:14px; z-index:5; padding:6px 14px; border-radius:999px; background:rgba(255,255,255,.92); color:#2b2b2b; font-weight:600; font-size:14px; box-shadow:0 1px 4px rgba(0,0,0,.15); pointer-events:none; }
  .gallery-dots { position:absolute; bottom:14px; left:0; right:0; display:flex; justify-content:center; gap:8px; z-index:5; }
  .gallery-dot { width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.55); border:none; cursor:pointer; padding:0; transition:background .2s, transform .2s; }
  .gallery-dot.is-active { background:#fff; transform:scale(1.2); }
  .price-card { background:var(--color-card); border:1px solid var(--color-line); border-radius: var(--radius-l); padding:32px; box-shadow: var(--shadow-card); }
  .price-card .price { font-size:34px; font-weight:800; color:var(--color-primary-dark); }
  .price-card .price small { display:block; font-size:13px; color:var(--color-text-muted); font-weight:600; }
  .chars-card { background:var(--color-card); border:1px solid var(--color-line); border-radius: var(--radius-l); padding:28px 32px; }
  .chars-card__title { font-size:20px; font-weight:800; margin-bottom:14px; }
  .chars-card__rows { display:flex; flex-direction:column; }
  .chars-card__row { display:flex; justify-content:space-between; gap:16px; padding:11px 0; border-bottom:1px solid var(--color-line); font-size:15px; }
  .chars-card__row:last-child { border-bottom:none; }
  .chars-card__row span:first-child { color:var(--color-text-muted); font-weight:600; }
  .chars-card__row span:last-child { font-weight:700; color:var(--color-ink); text-align:right; }
  .pay-options { display:flex; flex-direction:column; gap:12px; margin:18px 0; }
  .pay-option { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:16px 18px; border-radius: var(--radius-m); border:1.5px solid var(--color-line); width:100%; background:#fff; cursor:pointer; text-align:left; font:inherit; color:inherit; }
  .pay-option.is-active { background: var(--color-primary-tint); border-color: var(--color-primary); }
  .pay-option b { display:block; font-size:14.5px; }
  .pay-option > div span { font-size:12.5px; color:var(--color-text-muted); }
  .pay-option__check { width:22px; height:22px; border-radius:50%; border:2px solid var(--color-line); flex-shrink:0; display:flex; align-items:center; justify-content:center; color:transparent; font-size:13px; line-height:1; }
  .pay-option.is-active .pay-option__check { background:var(--color-primary); border-color:var(--color-primary); color:#fff; }
  .basecomp { background:var(--color-card); border:1px solid var(--color-line); border-radius: var(--radius-l); padding:36px 40px; }
  .basecomp__title { font-size:28px; margin-bottom:22px; }
  .basecomp__list { display:flex; flex-direction:column; }
  .basecomp__row { display:grid; grid-template-columns: 280px 1fr; gap:18px; padding:12px 0; border-bottom:1px solid var(--color-line); font-size:15px; }
  .basecomp__row span:first-child { font-weight:700; color:var(--color-ink); }
  .basecomp__row span:last-child { color:var(--color-text); }
  .basecomp__list:not(.is-open) .basecomp__row:nth-child(n+7) { display:none; }
  .basecomp [data-basecomp-more] { margin-top:22px; }
  .prodfilter__header { margin-bottom:28px; }
  .prodfilter__header h2 { margin-bottom:10px; }
  .prodfilter__header p { max-width:640px; color:var(--color-text-muted); }
  .prodfilter__block { border:1px solid var(--color-line); border-radius: var(--radius-m); background:var(--color-card); margin-bottom:12px; overflow:hidden; }
  .prodfilter__top { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 20px; }
  .prodfilter__name { border:none; background:none; padding:0; font:inherit; font-size:17px; font-weight:800; cursor:pointer; text-align:left; color:var(--color-ink); flex:1; }
  .prodfilter__name::after { content:''; display:inline-block; width:8px; height:8px; border-right:2px solid var(--color-ink); border-bottom:2px solid var(--color-ink); transform:rotate(45deg) translateY(-3px); margin-left:10px; transition:transform .2s; }
  .prodfilter__block.is-open .prodfilter__name::after { transform:rotate(225deg) translateY(-2px); }
  .togglecheck { position:relative; width:48px; height:28px; flex-shrink:0; cursor:pointer; }
  .togglecheck__input { position:absolute; inset:0; opacity:0; cursor:pointer; }
  .togglecheck__ui { display:block; width:48px; height:28px; border-radius:99px; background:#d7d2c8; transition:background .2s; }
  .togglecheck__ui::after { content:''; position:absolute; top:3px; left:3px; width:22px; height:22px; border-radius:50%; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.18); transition:transform .2s; }
  .togglecheck__input:checked + .togglecheck__ui { background:var(--color-primary); }
  .togglecheck__input:checked + .togglecheck__ui::after { transform:translateX(20px); }
  .prodfilter__content { display:none; padding:0 20px 20px; }
  .prodfilter__block.is-open .prodfilter__content { display:block; }
  .prodfilter__optrows { display:flex; flex-direction:column; gap:8px; }
  .prodfilter__optrow { padding:14px 0; border-top:1px solid var(--color-line); }
  .prodfilter__optrow:first-child { border-top:none; padding-top:4px; }
  .prodfilter__opttop { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; font-weight:700; margin-bottom:12px; cursor:pointer; }
  .prodfilter__opttop b { display:block; font-size:15px; }
  .prodfilter__opttop small { display:block; margin-top:4px; font-weight:600; color:var(--color-text-muted); }
  .prodfilter__opttop input { margin-right:10px; accent-color:var(--color-primary); }
  .prodfilter__optprice { white-space:nowrap; font-weight:800; color:var(--color-primary-dark); }
  .finoptions { display:grid; grid-template-columns:repeat(auto-fill, minmax(92px, 1fr)); gap:10px; }
  .finoptions__item { position:relative; display:flex; flex-direction:column; align-items:center; gap:6px; cursor:pointer; }
  .finoptions__item input { position:absolute; opacity:0; pointer-events:none; }
  .finoptions__swatch { width:72px; height:72px; border-radius:12px; border:2px solid transparent; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08); display:block; background-size:cover; background-position:center; background-repeat:no-repeat; overflow:hidden; }
  .finoptions__item:has(input:checked) .finoptions__swatch { border-color:var(--color-primary); box-shadow:0 0 0 3px var(--color-primary-tint); }
  .finoptions__name { font-size:12px; font-weight:600; color:var(--color-text-muted); text-align:center; }
  .elopts { display:grid; grid-template-columns:repeat(2, 1fr); gap:14px; margin-bottom:14px; }
  .elopts__item { position:relative; display:flex; flex-direction:column; border:1.5px solid var(--color-line); border-radius:14px; overflow:hidden; cursor:pointer; background:#fff; }
  .elopts__item input { position:absolute; opacity:0; pointer-events:none; }
  .elopts__item:has(input:checked) { border-color:var(--color-primary); box-shadow:0 0 0 3px var(--color-primary-tint); }
  .elopts__image { display:block; aspect-ratio:16/10; background:var(--color-bg-alt); }
  .elopts__image img { width:100%; height:100%; object-fit:cover; }
  .elopts__content { display:flex; flex-direction:column; gap:8px; padding:12px 14px 14px; }
  .elopts__text { font-size:14px; font-weight:600; line-height:1.35; }
  .elopts__price { font-weight:800; color:var(--color-primary-dark); }
  .elopts--rows { display:flex; flex-direction:column; gap:8px; }
  .elopts--rows .elopts__item { flex-direction:row; align-items:center; padding:14px 16px; }
  .elopts--rows .elopts__content { flex-direction:row; justify-content:space-between; align-items:center; width:100%; padding:0; gap:16px; }
  .elopts--3 { grid-template-columns:repeat(3, minmax(0, 240px)); justify-content:center; max-width:780px; margin:0 auto 14px; }
  .elopts--3 .elopts__image { aspect-ratio:3/4; background:#f3efe6; }
  .elopts--3 .elopts__image img { object-fit:contain; }
  .elopts__note { font-size:13px; font-weight:600; color:var(--color-text-muted); line-height:1.35; }
  .elopts__item .finoptions { display:none; padding:0 14px 14px; }
  .elopts__item:has(input:checked) .finoptions { display:grid; }
  .prodcheck { display:flex; align-items:flex-start; gap:12px; padding:14px 0; border-top:1px solid var(--color-line); cursor:pointer; }
  .prodcheck input { margin-top:3px; width:18px; height:18px; accent-color:var(--color-primary); }
  .prodcheck__content { display:flex; justify-content:space-between; gap:16px; width:100%; }
  .prodcheck__text { font-size:14.5px; font-weight:600; }
  .prodcheck__price { font-weight:800; white-space:nowrap; color:var(--color-ink); }
  .prodfilter__total { margin-top:28px; padding:22px 26px; border-radius:var(--radius-l); background:var(--color-primary-tint); display:flex; flex-direction:column; gap:4px; }
  .prodfilter__total > div { display:flex; justify-content:space-between; align-items:baseline; gap:16px; }
  .prodfilter__total span { font-weight:700; }
  .prodfilter__total b { font-size:28px; color:var(--color-primary-dark); }
  .prodfilter__total small { color:var(--color-text-muted); }
  @media (max-width:720px) {
    .basecomp { padding:24px 18px; }
    .basecomp__title { font-size:22px; }
    .basecomp__row { grid-template-columns:1fr; gap:4px; }
    .elopts { grid-template-columns:1fr; }
    .elopts--3 { grid-template-columns:1fr; }
    .chars-card { padding:22px 18px; }
    .prodfilter__total b { font-size:22px; }
    .finoptions { grid-template-columns:repeat(auto-fill, minmax(76px, 1fr)); }
  }
.monthly { margin:16px 0 4px; padding:14px 16px; border-radius:var(--radius-m); background:var(--color-primary-tint); }
.monthly__label { display:block; font-size:13.5px; font-weight:600; color:var(--color-text-muted); }
.monthly__value { display:block; margin-top:2px; font-size:22px; font-weight:800; color:var(--color-primary-dark); }
.monthly__note { display:block; margin-top:6px; font-size:11.5px; line-height:1.4; color:var(--color-text-muted); }