/* Калькулятор «Чайка» — стили в системе Тундры (Manrope/Inter, graphite/ice/arctic/amber). Префикс .cc-* */
.cc{--g950:#0b1116;--g900:#111b22;--g800:#152029;--g700:#31434e;--ice50:#f4f8fa;--ice100:#e4eef2;--arc:#16b6e4;--arc-h:#3fc4eb;--arc7:#087fa6;--amber:#f2a544;--amber-s:#f6d2a4;--err:#ff8e8e;--ok:#2f9b70;--r-sm:8px;--r-md:12px;--r-lg:20px;--fh:"Manrope",system-ui,sans-serif;--fb:"Inter",system-ui,sans-serif;font-family:var(--fb);color:#fff;position:relative}
.cc *{box-sizing:border-box}
.cc-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:start}
.cc-layout--done{grid-template-columns:minmax(0,720px);justify-content:center}
.cc-panel{background:var(--g900);border:1px solid rgba(255,255,255,.06);border-radius:var(--r-lg);padding:28px}
.cc-progress__label{display:flex;justify-content:space-between;font-size:13px;color:rgba(255,255,255,.72);margin-bottom:10px}
.cc-progress__bar{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:24px}
.cc-progress__bar button{height:4px;border:0;border-radius:4px;background:rgba(255,255,255,.12);padding:0;cursor:pointer}
.cc-progress__bar button.is-done{background:var(--arc)}
.cc-progress__bar button:disabled{cursor:default}
.cc h3{font-family:var(--fh);font-weight:700;font-size:22px;line-height:1.25;margin:0 0 6px}
.cc-lead{color:rgba(255,255,255,.7);font-size:14px;line-height:1.55;margin:0 0 20px}
.cc-group{margin-bottom:18px}
.cc-group__title,.cc-sub{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--arc);font-weight:600;margin-bottom:8px}
.cc-sub{color:rgba(255,255,255,.55);margin:14px 0 6px}
.cc-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cc-grid--1{grid-template-columns:1fr}
.cc-choice{font:500 14px var(--fb);text-align:left;color:#fff;background:var(--g800);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-sm);padding:12px 14px;cursor:pointer;transition:border-color .18s,background .18s}
.cc-choice:hover{border-color:rgba(22,182,228,.6)}
.cc-choice.is-on{border-color:var(--arc);background:rgba(22,182,228,.14);box-shadow:inset 0 0 0 1px var(--arc)}
.cc-err{color:var(--err);font-size:12px;margin:6px 0 0}
.has-err .cc-choice{border-color:rgba(255,142,142,.5)}
.cc-bodies{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}
.cc-body{display:flex;flex-direction:column;gap:6px;text-align:left;font:inherit;color:#fff;background:var(--g800);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-md);padding:12px;cursor:pointer}
.cc-body img{width:100%;aspect-ratio:2.1/1;object-fit:contain;background:#fff;border-radius:var(--r-sm)}
.cc-body.is-on{border-color:var(--arc);box-shadow:inset 0 0 0 1px var(--arc)}
.cc-body__t{font:700 17px var(--fh);margin-top:4px}
.cc-body__t em{font:600 11px var(--fb);font-style:normal;color:var(--g950);background:var(--arc);border-radius:20px;padding:2px 8px;vertical-align:middle;margin-left:6px}
.cc-body__d{font-size:13px;color:rgba(255,255,255,.72);line-height:1.45}
.cc-body ul{margin:2px 0 0;padding-left:16px;font-size:12px;color:rgba(255,255,255,.6);line-height:1.5}
.cc-body__p{margin-top:auto;font-weight:600;font-size:13px;color:var(--arc)}
.cc-help,.cc-consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:rgba(255,255,255,.8);margin:6px 0 14px;cursor:pointer}
.cc-help input,.cc-consent input{accent-color:var(--arc);width:18px;height:18px;margin:1px 0 0;flex-shrink:0}
.cc-consent a{color:var(--arc)}
.cc-consent.has-err span{color:var(--err)}
.cc-cat{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.07);border-radius:var(--r-md);padding:14px;margin-bottom:10px}
.cc-cat__title{font:700 15px var(--fh);margin-bottom:8px}
.cc-opt{display:grid;grid-template-columns:20px 1fr auto;gap:12px;align-items:start;padding:10px 8px;border-radius:var(--r-sm);cursor:pointer;transition:background .15s}
.cc-opt:hover{background:rgba(255,255,255,.04)}
.cc-opt input{position:absolute;opacity:0;pointer-events:none}
.cc-opt__mark{width:18px;height:18px;margin-top:1px;border:1.5px solid rgba(255,255,255,.35);border-radius:5px;display:block;position:relative}
.cc-opt input[type=radio]+.cc-opt__mark{border-radius:50%}
.cc-opt.is-on .cc-opt__mark{border-color:var(--arc);background:var(--arc)}
.cc-opt.is-on .cc-opt__mark:after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid var(--g950);border-width:0 2px 2px 0;transform:rotate(45deg)}
.cc-opt input[type=radio]+.cc-opt__mark:after{left:4px;top:4px;width:7px;height:7px;border:0;border-radius:50%;background:var(--g950);transform:none}
.cc-opt input:focus-visible+.cc-opt__mark{outline:2px solid var(--arc);outline-offset:2px}
.cc-opt__txt b{display:block;font-weight:500;font-size:14px;line-height:1.4}
.cc-opt__txt small{display:block;font-size:12px;color:rgba(255,255,255,.55);line-height:1.45;margin-top:2px}
.cc-opt__txt small.cc-warn{color:var(--amber)}
.cc-opt__price{font-size:13px;font-weight:600;white-space:nowrap;color:rgba(255,255,255,.85);padding-top:1px}
.cc-opt.is-disabled{opacity:.45;cursor:not-allowed}
.cc-opt.is-fixed{cursor:default}
.cc-badge{display:inline-block;font-size:11px;font-weight:600;color:var(--arc);background:rgba(22,182,228,.12);border-radius:20px;padding:2px 8px}
.cc-qty{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;font-size:14px}
.cc-qty small{display:block;font-size:12px;color:rgba(255,255,255,.5)}
.cc-qty__ctl{display:flex;align-items:center;gap:6px}
.cc-qty__ctl button{width:34px;height:34px;border-radius:var(--r-sm);border:1px solid rgba(255,255,255,.15);background:var(--g800);color:#fff;font-size:18px;cursor:pointer}
.cc-qty__ctl button:disabled{opacity:.35;cursor:default}
.cc-qty__ctl output{min-width:44px;text-align:center;font-weight:600}
.cc-link{background:none;border:0;padding:0;font:500 13px var(--fb);color:var(--arc);cursor:pointer}
.cc-clear{margin:4px 0 0 40px}
.cc-rec{background:linear-gradient(135deg,rgba(22,182,228,.14),rgba(22,182,228,.04));border:1px solid rgba(22,182,228,.35);border-radius:var(--r-md);padding:14px 16px;margin-bottom:16px}
.cc-rec__head{display:flex;align-items:center;gap:8px;font-size:14px;margin-bottom:8px}
.cc-rec__head .cc-link{margin-left:auto}
.cc-rec ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cc-rec li{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:13px}
.cc-rec li i{color:rgba(255,255,255,.6);font-style:normal}
.cc-chip{flex-shrink:0;font:600 12px var(--fb);color:var(--g950);background:var(--arc);border:0;border-radius:20px;padding:6px 10px;cursor:pointer}
.cc-chip:hover{background:var(--arc-h)}
.cc-note{font-size:12px;color:rgba(255,255,255,.5);line-height:1.5;margin:8px 0 0}
.cc-acc{border:1px solid rgba(255,255,255,.08);border-radius:var(--r-md);margin-bottom:10px;overflow:hidden}
.cc-acc__head{width:100%;display:flex;align-items:center;gap:12px;background:var(--g800);border:0;color:#fff;font:700 15px var(--fh);padding:14px 16px;cursor:pointer;text-align:left}
.cc-acc__head span{flex:1}
.cc-acc__head small{display:block;font:500 12px var(--fb);color:rgba(255,255,255,.55);margin-top:2px}
.cc-acc__head i{width:10px;height:10px;border:solid rgba(255,255,255,.6);border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .2s}
.cc-acc.is-open .cc-acc__head i{transform:rotate(-135deg)}
.cc-acc__body{padding:12px}
.cc-acc__body .cc-cat{background:transparent}
.cc-ico{width:24px;height:24px;filter:brightness(1.25);flex-shrink:0}
.cc-ico--xl{width:56px;height:56px}
.cc-more{margin-top:12px;font-size:13px;color:rgba(255,255,255,.75)}
.cc-more summary{cursor:pointer;color:var(--arc);font-weight:500}
.cc-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:10px}
.cc-cols ul{padding-left:16px;margin:6px 0 0;line-height:1.55}
.cc-nav{display:flex;justify-content:space-between;gap:12px;margin-top:24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08)}
.cc-btn{font:600 15px var(--fb);border-radius:var(--r-md);padding:14px 22px;cursor:pointer;border:1px solid transparent;transition:background .18s,transform .18s}
.cc-btn--primary{background:var(--arc);color:var(--g950)}
.cc-btn--primary:hover{background:var(--arc-h);transform:translateY(-1px)}
.cc-btn--primary:disabled{opacity:.6;cursor:wait}
.cc-btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.25)}
.cc-btn--ghost:hover{border-color:var(--arc)}
.cc-btn--block{width:100%;margin-top:14px}
.cc-aside{position:sticky;top:92px;background:#fff;color:var(--g950);border-radius:var(--r-lg);padding:20px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.cc-aside__eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--arc7);font-weight:600;margin-bottom:10px}
.cc-aside__img{border:1px solid var(--ice100);border-radius:var(--r-md);overflow:hidden;margin-bottom:14px}
.cc-aside__img img{display:block;width:100%;aspect-ratio:2.1/1;object-fit:contain;background:#fff}
.cc-aside__img span{display:block;font-size:12px;font-weight:600;padding:8px 10px;border-top:1px solid var(--ice100)}
.cc-aside h4{font:700 18px var(--fh);margin:0 0 8px}
.cc-aside__list{list-style:none;padding:0;margin:0 0 14px;font-size:13px;color:var(--g700);line-height:1.8}
.cc-price{border-top:1px solid var(--ice100);padding-top:12px}
.cc-panel .cc-price{background:var(--ice50);color:var(--g950);border-radius:var(--r-md);padding:16px;border:0;margin-bottom:20px}
.cc-row{display:flex;justify-content:space-between;gap:12px;font-size:14px;padding:3px 0}
.cc-row b{font-weight:600;white-space:nowrap}
.cc-row--muted{color:var(--g700);font-size:13px}
.cc-row--benefit b{color:#c47a18}
.cc-promo-chip{background:var(--amber-s);color:#8a5410;border-radius:20px;padding:4px 10px;font-size:12px;font-weight:600;margin:8px 0}
.cc-total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:10px;padding-top:10px;border-top:1px solid var(--ice100)}
.cc-total span{font:700 16px var(--fh)}
.cc-total strong{font:800 24px var(--fh);color:var(--g950);white-space:nowrap}
.cc-total--promo strong{color:#c47a18}
.cc-disc{font-size:11px;color:#6b7c87;line-height:1.5;margin:10px 0 0}
.cc-print{display:block;margin:12px auto 0;color:var(--arc7)}
.cc-form{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.cc-field label{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:6px}
.cc-field input,.cc-field select,.cc-field textarea{width:100%;font:15px var(--fb);color:#fff;background:var(--g800);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-sm);padding:12px 14px;outline:none}
.cc-field input:focus,.cc-field select:focus,.cc-field textarea:focus{border-color:var(--arc)}
.cc-field.has-err input{border-color:var(--err)}
.cc-field--wide,.cc-form .cc-consent,.cc-form .cc-note,.cc-form .cc-err{grid-column:1/-1}
.cc-thanks{text-align:center;padding:12px 8px}
.cc-thanks h3{font-size:26px;margin:14px 0 8px}
.cc-thanks p{color:rgba(255,255,255,.75);line-height:1.6}
.cc-thanks__sum{display:flex;justify-content:space-between;background:var(--ice50);color:var(--g950);border-radius:var(--r-md);padding:16px 18px;margin:18px 0;font:700 17px var(--fh)}
.cc-thanks__next{text-align:left;color:rgba(255,255,255,.8);line-height:1.8;margin:0 auto 18px;max-width:460px}
.cc-mbar{display:none}
@media (max-width:1023px){.cc-layout{grid-template-columns:1fr}.cc-aside{position:static}}
@media (max-width:767px){
 .cc-panel{padding:18px;border-radius:16px}
 .cc-grid,.cc-bodies,.cc-form,.cc-cols{grid-template-columns:1fr}
 .cc-aside{display:none;position:fixed;left:0;right:0;top:auto;bottom:64px;max-height:72vh;overflow:auto;border-radius:20px 20px 0 0;z-index:60}
 .cc-aside.is-sheet{display:block;box-shadow:0 0 0 100vmax rgba(11,17,22,.6)}
 .cc-mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:61;align-items:center;justify-content:space-between;gap:12px;background:var(--g950);border-top:1px solid rgba(255,255,255,.1);padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
 .cc-mbar small{display:block;font-size:11px;color:rgba(255,255,255,.6)}
 .cc-mbar b{font:800 18px var(--fh)}
 .cc-mbar .cc-btn{padding:10px 16px}
 html{scroll-padding-bottom:calc(80px + env(safe-area-inset-bottom))}
 body{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
 .cc-nav .cc-btn--primary{flex:1}
 .cc-opt{grid-template-columns:20px 1fr;}
 .cc-opt__price{grid-column:2}
}
@media print{.cc-mbar,.cc-nav{display:none}}
.cc{overflow-anchor:none}
