/* ═══════════════════════════════════════════════════════════════════
   kagami-shop.css · v0.2 · 2026-10-01 (v0.1 · 2026-09-30 + пътища А/Б „услуга + техника“)
   Допълнение към kagami-brand.css само за магазина (Ш9 категория · Ш10 продукт).
   Не пренаписва общия бранд — само нови класове с префикс .sh-
   Зарежда се СЛЕД kagami-brand.css.
   ═══════════════════════════════════════════════════════════════════ */
.shop{max-width:1120px;margin:0 auto;padding:0 20px 40px}
.shop .l-hero h1{max-width:26ch}
.sh-sec{margin:38px 0 10px;scroll-margin-top:84px}
.sh-sec>h2{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:10px}
.sh-sec>h2 .n{font-family:var(--f-mono);font-size:.8rem;font-weight:600;color:var(--mint);display:block;letter-spacing:.14em;margin-bottom:6px}
.sh-sec>p{color:var(--text2);max-width:70ch;margin-bottom:14px}
.g3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}

/* стълбата — кратко резюме */
.sh-ladder{list-style:none;display:flex;flex-direction:column;gap:6px;margin:18px 0}
.sh-ladder li{display:grid;grid-template-columns:110px 1fr auto;gap:14px;align-items:center;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.sh-ladder li .p{font-family:var(--f-mono);font-weight:600;color:var(--mint);font-size:1.05rem;white-space:nowrap}
.sh-ladder li .p small{display:block;font-size:.66rem;color:var(--muted);font-weight:400}
.sh-ladder li .nm{font-weight:800;color:#fff}
.sh-ladder li .w{display:block;color:var(--silver);font-size:.88rem;font-weight:400}
.sh-ladder li .tg{font-family:var(--f-mono);font-size:.68rem;color:var(--muted);border:1px solid var(--line);border-radius:20px;padding:3px 9px;white-space:nowrap}
.sh-ladder li.flag{border-color:rgba(232,160,32,.55);background:rgba(232,160,32,.06)}
.sh-ladder li.here{border-color:var(--mint);background:rgba(10,191,176,.07)}

/* карта на категория / продукт */
.sh-card{display:flex;flex-direction:column;gap:8px;color:inherit}
.sh-card:hover{text-decoration:none}
.sh-card .ic{font-size:1.7rem;line-height:1}
.sh-card .cnt{font-family:var(--f-mono);font-size:.78rem;color:var(--mint);margin-top:auto;padding-top:6px}
.sh-card .labs{display:flex;flex-wrap:wrap;gap:6px}
.sh-card .row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.sh-thumb{height:130px;border-radius:10px;border:1px dashed var(--line);display:grid;place-items:center;font-size:3rem;background:radial-gradient(70% 90% at 50% 20%,#16306a,rgba(13,27,62,.4) 70%)}
.sh-price{font-family:var(--f-mono);font-weight:600;font-size:1.5rem;color:#fff;margin-top:auto}
.sh-price small{display:block;font-size:.72rem;font-weight:400;color:var(--muted);margin-top:2px}
.sh-more{font-weight:700;color:var(--mint);font-size:.9rem}
.sh-old{font-family:var(--f-mono);font-size:.68rem;color:var(--muted)}

/* категории — лента */
.sh-cats{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 8px}
.sh-cats a{font-size:.8rem;color:var(--silver);border:1px solid var(--line);border-radius:20px;padding:5px 12px}
.sh-cats a:hover{color:var(--mint);border-color:var(--mint);text-decoration:none}
.sh-cats a.on{color:var(--ink);background:var(--mint);border-color:var(--mint)}

/* сортиране */
.sh-sort{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:18px 0 14px;font-family:var(--f-mono);font-size:.74rem;color:var(--muted)}
.sh-sort button{font-family:var(--f-mono);font-size:.72rem;color:var(--silver);background:none;border:1px solid var(--line);border-radius:20px;padding:4px 12px;cursor:pointer}
.sh-sort button.on{color:var(--ink);background:var(--mint);border-color:var(--mint)}

/* как се заявява — 4 стъпки */
.sh-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;counter-reset:s;margin:14px 0}
.sh-steps div{counter-increment:s;border:1px solid var(--line);border-radius:12px;padding:16px;background:var(--surface);font-size:.9rem;color:var(--silver)}
.sh-steps div::before{content:counter(s);display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--mint);color:var(--ink);font-family:var(--f-mono);font-weight:600;margin-bottom:8px}
.sh-steps b{color:#fff;display:block}

/* „какво получаваш“ */
.sh-sec ul.ticks{list-style:none;margin:6px 0 10px}
.sh-sec ul.ticks li{position:relative;padding:6px 0 6px 28px;color:var(--text2)}
.sh-sec ul.ticks li::before{content:"✓";position:absolute;left:4px;top:6px;color:var(--mint);font-weight:800}
.sh-sec ul.ticks li.q::before{content:"?";color:var(--amber)}

/* продукт */
.pd-wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:34px;align-items:start;padding-top:10px}
.pd-gal{display:flex;flex-direction:column;gap:10px}
.pd-main{aspect-ratio:4/3;border-radius:var(--r);border:1px dashed var(--line);display:grid;place-items:center;font-size:6rem;background:radial-gradient(70% 90% at 50% 20%,#16306a,rgba(13,27,62,.4) 70%);position:relative}
.pd-main .ph{position:absolute;bottom:12px;left:12px;font-family:var(--f-mono);font-size:.7rem;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:3px 8px;background:rgba(8,18,43,.7)}
.pd-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pd-thumbs span{aspect-ratio:1;border:1px dashed var(--line);border-radius:10px;display:grid;place-items:center;font-family:var(--f-mono);font-size:.62rem;color:var(--muted);text-align:center;padding:4px}
.pd-buy{border:1px solid var(--line);border-radius:var(--r);padding:22px;background:var(--surface);position:sticky;top:84px}
.pd-buy .big{font-family:var(--f-mono);font-weight:600;font-size:2.3rem;color:#fff;line-height:1.1}
.pd-buy .vat{font-size:.86rem;color:var(--silver);margin:4px 0 14px}
.pd-buy .vat b{color:#fff}
.pd-buy .brk{width:100%;font-size:.84rem;margin:0 0 16px}
.pd-buy .brk td{padding:6px 0;border-bottom:1px dashed var(--line)}
.pd-buy .brk td:last-child{text-align:right;font-family:var(--f-mono);color:#fff}
.pd-buy .btn{width:100%;text-align:center;margin-bottom:8px}
.pd-buy .fine{font-size:.8rem;color:var(--muted);line-height:1.6}
.pd-meta{list-style:none;margin:14px 0 0;display:flex;flex-direction:column;gap:6px;font-size:.88rem;color:var(--silver)}
.pd-meta li b{color:#fff}
.tbd{display:inline-block;font-family:var(--f-mono);font-size:.66rem;font-weight:600;color:#f3c46b;border:1px dashed var(--amber);border-radius:5px;padding:1px 6px;margin-left:4px;vertical-align:middle}
.lawyer{display:inline-block;font-family:var(--f-mono);font-size:.66rem;font-weight:600;color:#ffab8a;border:1px dashed var(--coral);border-radius:5px;padding:1px 6px;margin-left:4px;vertical-align:middle}
.pd-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pd-two .card h3{font-size:1.15rem}
.pd-two ul{list-style:none;margin-top:8px}
.pd-two li{padding:5px 0 5px 24px;position:relative;color:var(--text2);font-size:.93rem}
.pd-two .yes li::before{content:"✓";position:absolute;left:2px;color:var(--mint);font-weight:800}
.pd-two .no li::before{content:"✕";position:absolute;left:2px;color:#ffab8a;font-weight:800}

/* форма за заявка */
.sh-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sh-form label{display:flex;flex-direction:column;gap:5px;font-size:.84rem;color:var(--silver)}
.sh-form .full{grid-column:1/-1}
.sh-form input,.sh-form textarea,.sh-form select{padding:11px 14px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:#fff;font:inherit;font-size:.95rem}
.sh-form input:focus,.sh-form textarea:focus{outline:none;border-color:var(--mint)}
.sh-form .chk{flex-direction:row;align-items:flex-start;gap:10px}
.sh-form .chk input{margin-top:4px;accent-color:var(--mint)}
.sh-form .ok{grid-column:1/-1;padding:12px 14px;border-radius:10px;background:rgba(43,182,115,.15);color:#6fe0a4;font-weight:700}

@media(max-width:900px){
  .pd-wrap{grid-template-columns:1fr}
  .pd-buy{position:static}
  .sh-steps{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .shop{padding:0 16px 30px}
  .pd-two,.sh-form{grid-template-columns:1fr}
  .sh-ladder li{grid-template-columns:1fr;gap:4px}
  .sh-ladder li .tg{justify-self:start}
  .sh-steps{grid-template-columns:1fr}
}

/* ── v0.2 · 2026-10-01 · „услуга + техника“ (решение на Галин 01.10.2026): пътища А/Б ── */
.sh-paths{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0 22px}
.sh-price.tbdp{font-size:1.05rem;color:#f3c46b}
.sh-path{border:1px solid var(--line);border-radius:var(--r);padding:22px;background:var(--surface);display:flex;flex-direction:column;gap:10px}
.sh-path .hd{display:flex;align-items:center;gap:12px}
.sh-path .ltr{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:var(--ink);font-family:var(--f-mono);font-weight:700;font-size:1.15rem}
.sh-path.b2b{border-color:rgba(232,160,32,.45)}
.sh-path.b2b .ltr{background:var(--amber)}
.sh-path h3{font-size:1.2rem;margin:0}
.sh-path .who{display:block;font-family:var(--f-mono);font-size:.7rem;color:var(--muted);letter-spacing:.08em;font-weight:400}
.sh-path p{color:var(--text2);font-size:.93rem;margin:0}
.sh-path .notice{border:1px dashed var(--amber);border-radius:10px;padding:10px 12px;font-size:.86rem;color:#f3d9a4;background:rgba(232,160,32,.06)}
.sh-path .hw{border-top:1px dashed var(--line);padding-top:10px;font-size:.86rem;color:var(--silver)}
.sh-path .hw b{color:#fff}
.sh-path .btn{align-self:flex-start;margin-top:auto}
.sh-steps.s3{grid-template-columns:repeat(3,1fr)}
.pd-buy .big.tbdp{font-size:1.55rem;color:#f3c46b}
.pd-buy .svc{font-family:var(--f-mono);font-size:.72rem;color:var(--mint);letter-spacing:.1em;margin-bottom:6px}
.sh-form fieldset{grid-column:1/-1;border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-wrap:wrap;gap:10px 22px}
.sh-form legend{font-size:.84rem;color:var(--silver);padding:0 6px}
.sh-form fieldset label{flex-direction:row;align-items:center;gap:8px;color:#fff}
.sh-form fieldset input{accent-color:var(--mint)}
.sh-form [hidden]{display:none}
@media(max-width:900px){
  .sh-paths{grid-template-columns:1fr}
  .sh-steps.s3{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .sh-steps.s3{grid-template-columns:1fr}
}
