﻿/* Source: kzn-market.html */
:root{--blue:#1C5DA8;--navy:#143E73;--teal:#26A89E;--coral:#E8604F;--yellow:#F2B937;--ink:#1F2A37;--muted:#6B7686;--line:#E2E8EF;--bg:#F4F6F9;--soft:#EAF1F8;--stok:#5C7CB5;--wrap:1280px}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Inter",system-ui,sans-serif;background:var(--bg);color:var(--ink);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 18px}
.ph{position:relative;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#dfeaf5,#c2d6ea);overflow:hidden}
.ph svg{width:44%;max-width:80px;color:rgba(28,93,168,.45)}
.ph::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 18%,rgba(255,255,255,.5),transparent 60%)}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.promo{background:var(--blue);color:#fff;text-align:center;font-size:14px;font-weight:700;padding:10px;display:flex;align-items:center;justify-content:center;gap:10px}.promo svg{width:22px;height:22px}
header{background:#fff;border-bottom:1px solid var(--line)}
.hdr{display:flex;align-items:center;gap:24px;padding:18px 0}
.logo{font-weight:800;font-size:30px;letter-spacing:-.02em;line-height:1;white-space:nowrap;display:flex;align-items:center;gap:1px;color:var(--blue)}
.logo .dp{color:var(--teal);font-size:18px;margin:0 1px}.logo b{color:var(--ink);font-weight:300}
.search{flex:1;display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;max-width:560px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.search svg{width:18px;height:18px;color:var(--muted);align-self:center;margin-left:15px}
.search input{flex:1;border:0;outline:0;font:inherit;font-size:14.5px;padding:14px 12px;background:transparent}
.search button{background:var(--blue);border:0;color:#fff;padding:0 30px;font:inherit;font-weight:700;cursor:pointer}
.phone{display:flex;align-items:center;gap:10px;color:var(--coral);font-weight:800}.phone svg{width:28px;height:28px}.phone .num{font-size:18px}
.sep{width:1px;height:42px;background:var(--line)}
.hic{display:flex;gap:20px}
.hi{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--blue);font-size:12px;font-weight:600;position:relative}.hi svg{width:26px;height:26px}.hi .l{color:var(--ink)}
.cc{position:absolute;top:-4px;right:4px;background:var(--coral);color:#fff;font-size:10px;font-weight:800;border-radius:20px;padding:0 6px;line-height:16px}
.burger{display:none;background:none;border:0;cursor:pointer;color:var(--blue)}.burger svg{width:28px;height:28px}
.nav{border-bottom:1px solid var(--line);background:#fff}
.nav .wrap{display:flex;align-items:stretch;overflow-x:auto;scrollbar-width:none}.nav .wrap::-webkit-scrollbar{display:none}
.nav a.cl{padding:15px 18px;font-size:13px;font-weight:700;color:var(--blue);text-transform:uppercase;white-space:nowrap;line-height:1.15;display:flex;align-items:center;text-align:center;border-right:1px solid var(--line)}
.nav a.cl:hover{background:var(--soft)}
.nav .sp{flex:1}
.nav a.blk{padding:0 22px;display:flex;align-items:center;font-size:13px;font-weight:800;color:#fff;text-transform:uppercase;white-space:nowrap;text-align:center;line-height:1.1}
.nav a.navy{background:var(--navy)}.nav a.teal{background:var(--teal)}.nav a.coral{background:var(--coral)}
.main{padding:18px 0}
.mgrid{display:grid;grid-template-columns:1fr 318px;gap:16px;align-items:start}
.hmain{position:relative;border-radius:10px;overflow:hidden;height:400px;background:#0f3a6b}
.hslide{position:absolute;inset:0;opacity:0;transition:opacity .6s;display:flex;align-items:center;background:linear-gradient(110deg,#eef4fa 0%,#dfeaf5 55%,#cdddee 100%)}
.hslide.on{opacity:1}
.hphoto{position:absolute;right:0;top:0;bottom:0;width:50%;display:flex;align-items:center;justify-content:center;padding:26px 32px 26px 16px}
.hphoto::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(238,244,250,0),rgba(255,255,255,.35))}
.hphoto img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 28px rgba(20,40,70,.18))}
.hicon{position:absolute;right:0;top:50%;transform:translateY(-50%);color:rgba(28,93,168,.13)}.hicon svg{width:330px;height:330px}
.htx{position:relative;z-index:2;width:50%;max-width:50%;padding:0 44px}
.hbr{font-size:26px;font-weight:800;color:var(--blue);margin-bottom:10px}
.htt{font-size:clamp(22px,2.6vw,30px);font-weight:800;color:var(--ink);line-height:1.18;margin-bottom:20px}
.hfe{display:flex;gap:18px;margin-bottom:22px}.fe{text-align:center;font-size:11.5px;font-weight:600;color:var(--ink);width:70px}
.fe .d{width:48px;height:48px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 7px}.fe .d svg{width:24px;height:24px}
.hbtn{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;font-weight:700;font-size:14px;padding:12px 22px;border-radius:8px}.hbtn svg{width:15px;height:15px}
.hbadge{position:absolute;top:24px;right:30px;z-index:3;display:flex;flex-direction:column;align-items:center}
.kur{width:128px;height:128px;border-radius:50%;background:var(--yellow);color:#5a4410;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;text-align:center;padding:0 16px;line-height:1.2}
.ind{margin-top:-20px;background:var(--navy);color:#fff;border-radius:50%;width:96px;height:96px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:34px;font-weight:800;box-shadow:0 8px 20px rgba(0,0,0,.2);border:4px solid #fff}.ind small{font-size:11px;font-weight:700;background:var(--coral);border-radius:20px;padding:1px 8px;margin-top:2px}
.harw{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.9);box-shadow:0 2px 8px rgba(0,0,0,.12);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--navy)}.harw.l{left:14px}.harw.r{right:14px}.harw svg{width:20px;height:20px}
.hthumbs{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:10px}
.hthumb{height:62px;border-radius:8px;border:2px solid var(--line);background:var(--soft);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;color:var(--blue);transition:.15s}.hthumb.on,.hthumb:hover{border-color:var(--blue)}.hthumb svg{width:24px;height:24px}.hthumb span{font-size:10.5px;font-weight:700;color:var(--ink)}
.firsat{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.fh{background:var(--blue);color:#fff;font-weight:700;font-size:14px;padding:13px;display:flex;align-items:center;justify-content:center;gap:9px}.fh svg{width:20px;height:20px}
.fbody{padding:20px;text-align:center;position:relative}
.fbody .pc-im{aspect-ratio:1/1;border-radius:8px;overflow:hidden;margin-bottom:14px}
.fnm{font-size:14px;font-weight:500;line-height:1.35;min-height:40px;display:block}.fnm b{font-weight:800}
.frow{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:10px}
.fpct{background:var(--teal);color:#fff;font-size:13px;font-weight:800;padding:4px 9px;border-radius:6px}
.fold{font-size:13px;color:var(--muted);text-decoration:line-through}
.fnew{font-size:22px;font-weight:800;color:var(--ink)}
.farw{position:absolute;top:46%;width:34px;height:34px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--navy)}.farw.l{left:8px}.farw.r{right:8px}.farw svg{width:18px;height:18px}
.trust{border:1px solid var(--line);border-radius:10px;background:#fff;padding:20px 0;margin-top:16px}
.tg{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ti{display:flex;gap:13px;align-items:center;justify-content:center}.ti .ic{width:42px;height:42px;color:var(--blue);flex-shrink:0}.ti .ic svg,.ti .ic img{width:42px;height:42px;object-fit:contain}.ti h4{font-size:15px;font-weight:700}.ti p{font-size:12.5px;color:var(--muted)}
.pbanners{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:28px 0}
.pbanner{position:relative;border-radius:10px;overflow:hidden;min-height:160px;display:flex;align-items:center;padding:26px;color:#fff;background:var(--g)}
.pbanner .ic{position:absolute;right:-10px;bottom:-10px;color:rgba(255,255,255,.16)}.pbanner .ic svg{width:140px;height:140px}
.pbanner .z{position:relative;z-index:2}.pbanner .z p{font-size:14px;opacity:.95;max-width:60%;line-height:1.4}.pbanner .z .hi2{display:inline-block;background:rgba(0,0,0,.22);font-weight:800;font-size:15px;padding:4px 12px;border-radius:6px;margin-top:8px}
.sec{padding:14px 0 30px}
.sh{margin-bottom:18px}.sh h2{font-size:24px;font-weight:800}
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pc{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;transition:.16s;position:relative}
.pc:hover{box-shadow:0 12px 28px rgba(20,40,70,.1);transform:translateY(-3px)}
.pc::before{content:"";position:absolute;top:0;left:0;width:26px;height:26px;border-top:3px solid var(--teal);border-left:3px solid var(--teal);border-top-left-radius:10px;z-index:2}
.pc-im{aspect-ratio:1/1;display:block;background:#fff}.pc-im .ph{height:100%}.pc-im img{width:100%;height:100%;object-fit:contain;display:block}
.pc-b{padding:14px;display:flex;flex-direction:column;flex:1}
.pc-n{font-size:13.5px;font-weight:500;color:var(--muted);line-height:1.35;min-height:38px;margin-bottom:14px}.pc-n b{color:var(--ink);font-weight:800}
.pc-f{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:8px}
.pc-pr{display:flex;flex-direction:column;gap:2px}
.pct{background:var(--teal);color:#fff;font-size:12px;font-weight:800;padding:2px 7px;border-radius:5px;width:fit-content}
.po{font-size:12px;color:var(--muted);text-decoration:line-through}.pn{font-size:18px;font-weight:800}
.stok{background:var(--stok);color:#fff;font-size:11.5px;font-weight:700;padding:7px 10px;border-radius:6px;text-align:center;line-height:1.1}.stok.order{background:#9b650d}.stok.out{background:var(--coral)}
.fblock{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:16px;padding-bottom:30px}
.bbanner{position:relative;border-radius:10px;overflow:hidden;min-height:340px;display:flex;align-items:flex-end;padding:30px;color:#fff;background:var(--g)}
.bbanner[style*="background-image"]{background-size:cover;background-position:center}
.bbanner .bwm{position:absolute;right:-20px;top:30px;color:rgba(255,255,255,.16)}.bbanner .bwm svg{width:230px;height:230px}
.bbanner .bz{position:relative;z-index:2;display:flex;flex-direction:column}
.bbanner .bbr{font-size:24px;font-weight:800;margin-bottom:10px}
.bbanner .bsub{font-size:13px;opacity:.9;margin-bottom:4px}
.bbanner .btt{font-size:22px;font-weight:800;line-height:1.2;margin-bottom:18px}
.bbanner .bbtn{background:#fff;color:var(--ink);font-weight:700;font-size:14px;padding:11px 22px;border-radius:8px;width:fit-content}
.popkat{display:grid;grid-template-columns:1fr 1.6fr;gap:20px;align-items:center}
.kbanner{position:relative;border-radius:10px;overflow:hidden;min-height:360px;display:flex;align-items:flex-end;padding:28px;color:#fff;background:linear-gradient(160deg,#2f7fb8,#16507f)}
.kbanner .bwm{position:absolute;left:-20px;top:20px;color:rgba(255,255,255,.14)}.kbanner .bwm svg{width:200px;height:200px}
.kbanner .z{position:relative;z-index:2}.kbanner .z .br{font-size:22px;font-weight:800}.kbanner .z p{font-size:14px;opacity:.92;margin:8px 0 16px;max-width:80%}.kbanner .z a,.kbanner .z span:not(.br){background:#fff;color:var(--ink);font-weight:700;font-size:13px;padding:10px 20px;border-radius:8px;display:inline-block}
.circs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.circ{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.circ .c{width:120px;height:120px;border-radius:50%;background:linear-gradient(150deg,#eaf2fa,#d6e6f3);display:flex;align-items:center;justify-content:center;transition:.2s;border:1px solid var(--line)}
.circ:hover .c{transform:translateY(-4px);box-shadow:0 14px 28px rgba(20,60,120,.14)}.circ .c svg{width:48px;height:48px;color:var(--blue)}
.circ span{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:var(--ink)}
.markgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.btile{position:relative;border-radius:10px;overflow:hidden;height:128px;display:flex;align-items:center;justify-content:center;background:var(--g)}
.btile::after{content:"";position:absolute;inset:0;background:rgba(15,42,77,.4)}
.btile .wm{position:absolute;right:8px;bottom:6px;color:rgba(255,255,255,.18)}.btile .wm svg{width:60px;height:60px}
.btile span{position:relative;z-index:2;color:#fff;font-weight:800;font-size:24px;letter-spacing:.03em}
.corp{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.cb2{position:relative;border-radius:10px;overflow:hidden;min-height:150px;display:flex;align-items:center;padding:28px;color:#fff;background:var(--g)}
.cb2 .ic{position:absolute;right:-6px;bottom:-6px;color:rgba(255,255,255,.16)}.cb2 .ic svg{width:120px;height:120px}
.cb2 .z{position:relative;z-index:2}.cb2 .z .t{font-size:15px;opacity:.95}.cb2 .z .h{display:inline-block;background:var(--navy);font-weight:800;font-size:16px;padding:5px 13px;border-radius:6px;margin-top:8px}
footer{background:var(--navy);color:#AEC2DA;padding:48px 0 0;font-size:13px;margin-top:30px}
.fc{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:34px;padding-bottom:34px;border-bottom:1px solid rgba(255,255,255,.12)}
footer h5{color:#fff;font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:13px;font-weight:700}footer ul{list-style:none}footer li{margin-bottom:8px}footer a:hover{color:#fff}
.fl{font-weight:800;font-size:22px;color:#fff;margin-bottom:11px}.fl .dp{color:var(--teal)}.fa{color:#8AA4C2;max-width:300px;line-height:1.7}
.pay{display:flex;gap:6px;margin-top:13px;flex-wrap:wrap}.pay span{background:rgba(255,255,255,.1);border-radius:6px;padding:5px 9px;font-size:11px;font-weight:600}
.fb{display:flex;justify-content:space-between;padding:16px 0;color:#7C95B4;font-size:12px;flex-wrap:wrap;gap:8px}
.wa{position:fixed;right:20px;bottom:20px;z-index:50;background:#25D366;color:#fff;border-radius:30px;padding:13px 19px;display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px;box-shadow:0 10px 26px rgba(0,0,0,.25)}.wa svg{width:26px;height:26px}
.sh .sub{color:var(--muted);font-size:14px;margin-top:4px}
.hdots{display:flex;gap:7px;justify-content:center;margin-top:12px}
.hdot{width:9px;height:9px;border-radius:50%;background:var(--line);cursor:pointer}.hdot.on{background:var(--blue);width:24px;border-radius:8px}
.campsl{padding:4px 0 6px}
.csmain{position:relative;border-radius:10px;overflow:hidden;height:210px}
.cslide{position:absolute;inset:0;opacity:0;transition:opacity .6s;display:flex;align-items:center;padding:0 54px;color:#fff;background:var(--g)}
.cslide[style*="background-image"],
.pbanner[style*="background-image"],
.kbanner[style*="background-image"],
.cb2[style*="background-image"]{background-size:cover;background-position:center}
.cslide[style*="background-image"]::before,
.pbanner[style*="background-image"]::before,
.kbanner[style*="background-image"]::before,
.cb2[style*="background-image"]::before{content:"";position:absolute;inset:0;background:rgba(10,25,42,.18)}
.cslide[style*="background-image"]>*,
.pbanner[style*="background-image"]>*,
.kbanner[style*="background-image"]>*,
.cb2[style*="background-image"]>*{position:relative;z-index:1}
.cslide.on{opacity:1}
.cwm{position:absolute;right:34px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.16)}.cwm svg{width:180px;height:180px}
.cz{position:relative;z-index:2;max-width:66%}
.cmanset{font-size:clamp(26px,3.6vw,42px);font-weight:800;text-transform:uppercase;line-height:1.05;letter-spacing:-.01em}
.csub{font-size:15px;opacity:.95;margin:10px 0 16px;max-width:92%}
.cbtn{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--ink);font-weight:700;font-size:14px;padding:11px 22px;border-radius:8px}.cbtn svg{width:15px;height:15px}
.cdots{position:absolute;bottom:14px;left:0;right:0;display:flex;gap:7px;justify-content:center;z-index:3}
.cdot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.5);cursor:pointer}.cdot.on{background:#fff;width:24px;border-radius:8px}
.setgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.setc{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;transition:.16s}
.setc:hover{box-shadow:0 12px 28px rgba(20,40,70,.1);transform:translateY(-3px)}
.set-im{position:relative;height:148px;background:linear-gradient(135deg,#1C5DA8,#143E73);display:flex;align-items:center;justify-content:center}
.set-im img{width:100%;height:100%;object-fit:cover;display:block}
.set-badge{position:absolute;top:12px;left:12px;background:var(--teal);color:#fff;font-size:11.5px;font-weight:800;padding:4px 11px;border-radius:20px;letter-spacing:.08em}
.set-icons{display:flex;gap:8px}.set-icons .si{width:46px;height:46px;border-radius:12px;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;color:#fff}.set-icons .si svg{width:24px;height:24px}
.set-b{padding:16px;display:flex;flex-direction:column;flex:1}
.set-n{font-size:16px;font-weight:800}
.set-list{font-size:12.5px;color:var(--muted);margin:6px 0 14px;line-height:1.5;min-height:38px}
.set-f{margin-top:auto}.set-pr{display:flex;align-items:baseline;gap:8px;margin-bottom:10px}.set-old{font-size:13px;color:var(--muted);text-decoration:line-through}.set-new{font-size:20px;font-weight:800;color:var(--blue)}
.set-btn{display:block;text-align:center;background:var(--ink);color:#fff;font-weight:700;font-size:13.5px;padding:11px;border-radius:8px}.set-btn:hover{background:var(--blue)}
@media(max-width:1024px){.setgrid{grid-template-columns:repeat(2,1fr)}.cz{max-width:82%}.csmain{height:200px}}
@media(max-width:640px){.setgrid{grid-template-columns:1fr 1fr}.cslide{padding:0 22px}.cz{max-width:90%}.cmanset{font-size:24px}.csub{font-size:13px}.cwm svg{width:120px;height:120px}.csmain{height:185px}}
@media(max-width:1024px){.mgrid{grid-template-columns:1fr}.firsat{max-width:420px;margin:0 auto;width:100%}.pgrid{grid-template-columns:repeat(2,1fr)}.fblock{grid-template-columns:1fr 1fr}.bbanner{grid-column:1/-1;min-height:240px}.popkat{grid-template-columns:1fr}.pbanners{grid-template-columns:1fr}.markgrid{grid-template-columns:repeat(2,1fr)}.tg{grid-template-columns:1fr 1fr}.circs{grid-template-columns:repeat(3,1fr)}.corp{grid-template-columns:1fr}.fc{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.promo,.search,.phone,.sep,.nav .blk,.hi .l{display:none}.burger{display:block;order:-1}.hdr{gap:14px;padding:12px 0}.logo{font-size:24px}.hmain{height:360px}.hphoto{width:100%;opacity:.22;padding:30px}.htx{width:82%;max-width:82%;padding:0 22px}.hbadge{top:12px;right:12px}.kur{width:96px;height:96px;font-size:11px}.ind{width:72px;height:72px;font-size:26px}.hthumbs{grid-template-columns:repeat(3,1fr)}.pgrid{grid-template-columns:1fr 1fr}.circs{grid-template-columns:1fr 1fr}.markgrid{grid-template-columns:1fr 1fr}.fc{grid-template-columns:1fr 1fr}.wa span{display:none}.wa{padding:0;width:56px;height:56px;justify-content:center;border-radius:50%}}

/* Homepage arrow refinements */
.hmain .harw,
.csmain .harw {
  width: 30px;
  height: 30px;
  box-shadow: 0 2px 7px rgba(0, 0, 0, .1);
}

.hmain .harw svg,
.csmain .harw svg {
  width: 15px;
  height: 15px;
}

.hmain .harw.l,
.csmain .harw.l {
  left: 12px;
}

.hmain .harw.r,
.csmain .harw.r {
  right: 12px;
}

.firsat .farw {
  display: none !important;
}

@media(max-width:640px) {
  .hmain .harw,
  .csmain .harw {
    width: 28px;
    height: 28px;
  }

  .hmain .harw svg,
  .csmain .harw svg {
    width: 14px;
    height: 14px;
  }
}


