/* shop.techno-med.ru — статический магазин шовного материала ATRAMAT (server/technomed-shop/assets/shop.css) */
:root{--c:#1d2733;--mut:#5b6b7c;--bg:#fff;--bg2:#f4f6f8;--line:#dde3e9;--pri:#1f5fa8;--pri2:#174a85;--acc:#f6a623;--cell:#fff4dc;--cell2:#ffe6b3;--red:#c62828;--ok:#2e7d32}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--c);background:var(--bg)}
a{color:var(--pri)}a:hover{color:var(--pri2)}
img{max-width:100%;height:auto}
.wrap{max-width:1240px;margin:0 auto;padding:0 16px}
h1{font-size:clamp(1.4rem,3.2vw,2rem);line-height:1.25;margin:.4em 0 .6em}
h2{font-size:1.25rem;margin:1.6em 0 .6em}
h3{font-size:1.05rem;margin:1.3em 0 .4em}
.tel{white-space:nowrap;color:var(--c);text-decoration:none;font-weight:600}
.small,.note{font-size:.88rem;color:var(--mut)}
.note{margin:1.4em 0}
/* шапка */
.hdr{border-bottom:1px solid var(--line);background:#fff}
.hdr-top{display:flex;align-items:center;gap:20px;padding-top:12px;padding-bottom:12px;flex-wrap:wrap}
.logo img{display:block;width:168px;height:auto}
.slogan{font-size:.85rem;color:var(--mut);line-height:1.3}
.phones{list-style:none;margin:0;padding:0;font-size:.95rem}
.hdr .phones{margin-left:auto}
.hours{font-size:.85rem;color:var(--mut);line-height:1.4}
.cart-link{background:var(--pri);color:#fff;text-decoration:none;padding:8px 14px;border-radius:6px;font-weight:600;white-space:nowrap}
.cart-link:hover{background:var(--pri2);color:#fff}
.cart-count{display:inline-block;min-width:1.5em;padding:0 .4em;border-radius:1em;background:#fff;color:var(--pri);text-align:center;margin-left:4px}
.menu{background:var(--bg2);border-top:1px solid var(--line)}
.menu .wrap{display:flex;flex-wrap:wrap;gap:4px 22px;padding-top:8px;padding-bottom:8px;align-items:center}
.menu a,.menu summary{color:var(--c);text-decoration:none;font-weight:500;cursor:pointer}
.menu a:hover,.menu summary:hover{color:var(--pri)}
.menu-mats{position:relative}
.mats-drop{position:absolute;z-index:20;top:1.8em;left:-10px;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 6px 20px rgba(0,0,0,.12);padding:8px 0;min-width:320px}
.mats-drop a{display:block;padding:5px 14px}
@media (max-width:760px){.hdr .phones{margin-left:0}.slogan{display:none}.hdr-top{gap:10px 16px}.mats-drop{min-width:260px}}
/* хлебные крошки */
.crumbs ol{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:4px;font-size:.85rem;color:var(--mut)}
.crumbs li+li:before{content:"—";margin-right:4px}
/* плитки материалов */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.tile{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;padding:10px;text-decoration:none;color:var(--c);background:#fff}
.tile:hover{border-color:var(--pri);box-shadow:0 2px 10px rgba(31,95,168,.15)}
.tile-img{aspect-ratio:4/3;object-fit:cover;border-radius:5px;background:var(--bg2);width:100%}
.t-name{font-weight:600;margin-top:8px}
.t-sub{font-size:.82rem;color:var(--mut)}
.t-cnt{font-size:.82rem;margin-top:auto;padding-top:4px}
/* поиск по коду */
.code-search{background:var(--bg2);padding:12px 14px;border-radius:8px;margin:12px 0}
.code-search input{width:min(420px,100%);padding:7px 10px;border:1px solid var(--line);border-radius:5px;font:inherit}
.cs-res{margin-top:8px}
.cs-res a{display:inline-block;min-width:9em;font-weight:600}
.cs-res div{padding:2px 0;border-bottom:1px dashed var(--line)}
/* таблицы */
table.list{border-collapse:collapse;width:100%}
table.list th,table.list td{border-bottom:1px solid var(--line);padding:8px 6px;text-align:left;vertical-align:top}
table.list .num{text-align:right;white-space:nowrap}
table.list .sub{font-size:.82rem;color:var(--mut)}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.sut{border-collapse:separate;border-spacing:2px;min-width:100%;font-size:.88rem}
table.sut th{background:var(--acc);color:#1d1d1d;padding:5px 6px;font-weight:600;white-space:nowrap}
table.sut td{background:var(--cell);padding:5px;vertical-align:top;text-align:center}
table.sut td.rt,table.sut td.rl{background:var(--cell2);font-weight:600;white-space:nowrap}
table.sut td.rt-cont{color:var(--mut);font-weight:400}
table.sut td.empty{background:#fafafa}
.it{padding:3px 0;line-height:1.3}
.it+.it{border-top:1px solid #fff;margin-top:3px;padding-top:5px}
.it a{font-weight:600;white-space:nowrap}
.nt{display:block;font-size:.78rem;color:var(--mut)}
.pr{display:block;color:var(--red);font-weight:600;white-space:nowrap}
.pr.req,.price.req{color:var(--mut);font-weight:400}
.it.hid,tr.hid,.grp.hid,.tbl-wrap.hid{display:none}
.filter{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;background:var(--bg2);padding:10px 14px;border-radius:8px;margin:14px 0}
.filter input,.filter select{padding:5px 8px;border:1px solid var(--line);border-radius:5px;font:inherit}
.f-cnt{color:var(--mut);font-size:.85rem}
.grp{font-size:1.05rem;margin:1.4em 0 .4em}
ul.ns{columns:2 280px;padding-left:1.1em}
ul.ns li{margin:3px 0;break-inside:avoid}
ul.ns .pr{display:inline}
/* кнопки */
.buy{background:var(--acc);border:0;border-radius:5px;padding:8px 16px;font:inherit;font-weight:600;cursor:pointer;color:#1d1d1d}
.buy:hover{background:#e5951a}
.buy-s{padding:2px 7px;font-size:.78rem;margin-top:3px}
/* раздел */
.sec-intro{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.sec-intro .mat-img{width:260px;border-radius:6px;flex:0 0 auto}
.sec-intro>div{flex:1 1 300px}
.subt{font-weight:600;margin-top:0}
.desc{border-top:1px solid var(--line);margin-top:2em}
.desc p{text-align:justify}
/* карточка */
.prod{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}
.prod-img{width:320px;border-radius:8px;flex:0 0 auto}
.prod-main{flex:1 1 360px}
table.props{border-collapse:collapse;width:100%;max-width:640px}
table.props th,table.props td{border-bottom:1px solid var(--line);padding:6px 8px;text-align:left;vertical-align:top}
table.props th{width:42%;font-weight:500;color:var(--mut)}
.buybox{margin-top:16px;padding:14px;border:1px solid var(--line);border-radius:8px;max-width:640px;background:var(--bg2)}
.price{font-size:1.5rem;font-weight:700;color:var(--red);white-space:nowrap}
.pu{color:var(--mut)}
.qty{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:8px}
.qty input{width:80px;padding:6px;border:1px solid var(--line);border-radius:5px;font:inherit}
.analogs ul{columns:2 320px;padding-left:1.1em}
.analogs li{break-inside:avoid;margin:3px 0}
.analogs .nt,.analogs .pr{display:inline;margin-left:4px}
.back{margin-top:1.5em}
/* корзина */
.cart-tbl input{width:70px;padding:4px;border:1px solid var(--line);border-radius:4px}
.cart-tbl .del{background:none;border:0;color:var(--red);cursor:pointer;font-size:1.1rem}
.order{margin-top:1.5em;max-width:760px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}
.grid2 .wide{grid-column:1/-1}
@media (max-width:600px){.grid2{grid-template-columns:1fr}}
.order label{display:flex;flex-direction:column;font-size:.9rem;gap:3px}
.order input,.order textarea{padding:7px 9px;border:1px solid var(--line);border-radius:5px;font:inherit}
.order label.consent{flex-direction:row;gap:8px;align-items:flex-start;margin:12px 0}
.order .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{min-height:1.4em}
.form-msg.err{color:var(--red)}
.order-ok h2{color:var(--ok)}
/* подвал */
.ftr{margin-top:48px;background:var(--bg2);border-top:1px solid var(--line);font-size:.9rem}
.ftr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;padding-top:24px;padding-bottom:16px}
.social a{display:inline-block;margin:0 12px 6px 0}
.copy{color:var(--mut);font-size:.8rem;padding-bottom:20px}
.toast{position:fixed;right:16px;bottom:16px;z-index:50;background:#1d2733;color:#fff;padding:12px 16px;border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.25);max-width:calc(100% - 32px)}
.toast a{color:#ffd27a}