*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
  :root{
    --bg:#0a0a0a; --bg-1:#111214; --card:#131619; --card-hi:#191c20;
    --ink:#f5f6f7; --ink2:#b7bcc2; --dim:#71777e; --line:rgba(255,255,255,.07); --line2:rgba(255,255,255,.13);
    --accent:#57DCFC; --accent-ink:#001620; --accent-soft:rgba(87,220,252,.13); --accent-bd:rgba(87,220,252,.4);
    --mono:'JetBrains Mono',ui-monospace,monospace; --sans:'Inter',-apple-system,system-ui,sans-serif;
    --maxw:1240px;
  }
  body.v-violet{ --accent:#7c5cfc; --accent-ink:#fff; --accent-soft:rgba(124,92,252,.15); --accent-bd:rgba(124,92,252,.45); }
  html,body{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;line-height:1.5}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

  /* generic section header */
  .sec{padding:72px 0}
  .sec.alt{background:var(--bg-1);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .sec-head{margin-bottom:36px}
  .klabel{display:inline-flex;align-items:center;gap:8px;font:700 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
  .klabel::before{content:"";width:18px;height:1px;background:var(--accent)}
  .sec-head h2{font:800 clamp(30px,4vw,46px)/1.02 var(--sans);letter-spacing:-.03em;text-transform:lowercase}
  .sec-head .sub{margin-top:14px;max-width:560px;color:var(--ink2);font-size:15.5px}
  .sec-head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
  .see-all{font:700 13px/1 var(--sans);color:var(--accent);display:inline-flex;gap:6px;align-items:center}

  .btn{display:inline-flex;align-items:center;gap:9px;font:800 14px/1 var(--sans);letter-spacing:-.01em;padding:14px 20px;border-radius:12px;cursor:pointer;transition:.16s;border:1px solid transparent}
  .btn svg{width:15px;height:15px}
  .btn-primary{background:var(--accent);color:var(--accent-ink)}
  .btn-primary:hover{transform:translateY(-1px);box-shadow:0 14px 30px -10px var(--accent-soft)}
  .btn-ghost{background:transparent;color:var(--ink2);border-color:var(--line2)}
  .btn-ghost:hover{color:var(--ink);border-color:#3a3f45}

  /* ===== HEADER ===== */
  .hd{position:sticky;top:0;z-index:40;background:rgba(10,10,10,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  .hd-in{display:flex;align-items:center;gap:30px;padding:15px 24px;max-width:var(--maxw);margin:0 auto}
  .logo{font:900 22px/1 var(--sans);letter-spacing:-.02em;display:inline-flex;align-items:baseline;gap:3px}
  .logo .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}
  .hd .nav{display:flex;gap:24px;margin-left:6px}
  .hd .nav a{font:600 13.5px/1 var(--sans);color:var(--ink2);padding:6px 0;border-bottom:1.5px solid transparent}
  .hd .nav a:hover{color:var(--ink)}
  .hd-cta{margin-left:auto;padding:11px 16px;font-size:13px}

  /* ===== FOOTER ===== */
  .ft{border-top:1px solid var(--line);background:var(--bg-1);padding:48px 0 28px}
  .ft-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
  .ft-grid .col h4{font:700 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:14px}
  .ft-grid .col a{display:block;color:var(--ink2);font-size:13.5px;padding:5px 0}
  .ft-grid .col a:hover{color:var(--accent)}
  .ft-grid .about p{color:var(--dim);font-size:13px;margin:12px 0 14px;max-width:280px;line-height:1.55}
  .ft-grid .about .badges{display:flex;gap:8px}
  .ft-grid .about .badges a{font:700 11px/1 var(--mono);color:var(--ink2);border:1px solid var(--line2);border-radius:7px;padding:7px 10px}
  .ft-bottom{max-width:var(--maxw);margin:32px auto 0;padding:18px 24px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--dim);font:500 12px/1.5 var(--mono)}
  @media(max-width:980px){.hd .nav{display:none}.ft-grid{grid-template-columns:1fr 1fr}}

  /* ===== HERO ===== */
  .hero{position:relative;overflow:hidden;padding:56px 0 64px;
    background:radial-gradient(ellipse at 86% 8%,var(--accent-soft) 0%,transparent 56%)}
  .hero::before{content:"";position:absolute;inset:0;pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);
    background-size:46px 46px;-webkit-mask-image:radial-gradient(ellipse at 26% 26%,#000 30%,transparent 72%);mask-image:radial-gradient(ellipse at 26% 26%,#000 30%,transparent 72%);opacity:.6}
  .hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:54px;align-items:start}
  .eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 11px/1 var(--mono);letter-spacing:.04em;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-bd);padding:7px 12px;border-radius:99px;margin-bottom:24px}
  .eyebrow .live{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
  .hero h1{font:900 clamp(46px,7vw,86px)/.95 var(--sans);letter-spacing:-.04em;text-transform:lowercase;margin-bottom:24px}
  .hero h1 .ac{color:var(--accent)}
  .hero .lead{max-width:540px;font-size:17px;color:var(--ink2);margin-bottom:32px}
  .hero .lead b{color:var(--ink);font-weight:700}
  .hero-cta{display:flex;gap:10px;flex-wrap:wrap}
  .promo{background:var(--card);border:1px solid var(--line2);border-radius:18px;padding:18px}
  .promo .tag{display:inline-flex;align-items:center;gap:6px;font:700 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
  .promo .tag::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent)}
  .promo .t{font:800 23px/1.05 var(--sans);letter-spacing:-.02em;margin-bottom:6px}
  .promo .s{font-size:12.5px;color:var(--dim);margin-bottom:14px}
  .promo .fig{display:block;width:100%;aspect-ratio:16/11;border-radius:12px;margin-bottom:14px;background-size:cover;background-position:center;border:1px solid var(--line)}
  .promo .lnk{display:inline-flex;gap:5px;align-items:center;font:700 12px/1 var(--sans);color:var(--accent);border-bottom:1px solid var(--accent-bd);padding-bottom:2px}
  .kpi{margin-top:48px;padding-top:24px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr)}
  .kpi .it{padding:0 28px;position:relative}
  .kpi .it+.it::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--line2)}
  .kpi .l{font:700 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:10px}
  .kpi .v{font:700 30px/1 var(--mono);letter-spacing:-.02em;color:var(--ink)}
  .kpi .v .u{font-size:14px;color:var(--dim);margin-left:2px}
  .kpi .f{margin-top:6px;font-size:11.5px;color:var(--dim)}

  /* ===== CATEGORIES ===== */
  .cats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
  .cat{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;transition:.16s;position:relative;overflow:hidden}
  .cat:hover{border-color:var(--accent-bd);transform:translateY(-2px)}
  .cat .n{font:700 11px/1 var(--mono);color:var(--dim)}
  .cat .ic{width:40px;height:40px;margin:18px 0 16px;color:var(--accent)}
  .cat .ic svg{width:100%;height:100%}
  .cat .en{font:600 11px/1 var(--mono);color:var(--dim);text-transform:uppercase;letter-spacing:.1em}
  .cat .nm{font:800 19px/1.1 var(--sans);letter-spacing:-.02em;margin-top:4px}
  .cat .go{margin-top:18px;display:flex;justify-content:space-between;align-items:center;font:700 12px/1 var(--mono);color:var(--ink2)}
  .cat .go .ar{color:var(--accent)}

  /* ===== PRODUCT GRID ===== */
  .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
  .pcard{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:.16s;display:flex;flex-direction:column}
  .pcard:hover{border-color:var(--accent-bd);transform:translateY(-2px)}
  .pcard .img{aspect-ratio:1;background:#0a0a0a center/cover no-repeat;border-bottom:1px solid var(--line)}
  .pcard .body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:7px;flex:1}
  .pcard .code{font:600 10px/1 var(--mono);color:var(--dim);text-transform:uppercase;letter-spacing:.08em}
  .pcard .nm{font:600 13.5px/1.3 var(--sans);color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .pcard .pills{display:flex;gap:5px;flex-wrap:wrap;margin-top:2px}
  .pcard .pill{font:600 10px/1 var(--mono);color:var(--ink2);background:var(--bg-1);border:1px solid var(--line);border-radius:5px;padding:4px 7px}
  .pcard .foot{margin-top:auto;padding-top:10px;border-top:1px solid var(--line);display:flex;align-items:baseline;justify-content:space-between}
  .pcard .price{font:800 16px/1 var(--sans);color:var(--ink)}
  .pcard .price s{font:400 12px/1 var(--mono);color:var(--dim);margin-left:5px}
  .pcard .ar{color:var(--accent);font-size:16px}

  /* ===== PRINCIPLES ===== */
  .princ{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:16px;overflow:hidden}
  .princ .p{padding:26px 22px;border-left:1px solid var(--line)}
  .princ .p:first-child{border-left:0}
  .princ .p .nn{font:700 12px/1 var(--mono);color:var(--accent)}
  .princ .p h3{font:800 16px/1.2 var(--sans);letter-spacing:-.01em;margin:14px 0 8px}
  .princ .p p{font-size:13px;color:var(--ink2);line-height:1.5}

  /* ===== SUPPORT BAND ===== */
  .band{border-top:1px solid var(--line);background:radial-gradient(ellipse at 80% 50%,var(--accent-soft) 0%,transparent 60%)}
  .band-in{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;padding:48px 0}
  .band h3{font:800 clamp(24px,3vw,34px)/1.05 var(--sans);letter-spacing:-.02em;text-transform:lowercase}
  .band p{margin-top:10px;color:var(--ink2);max-width:480px;font-size:15px}

  footer.mk{border-top:1px solid var(--line);padding:34px 0;color:var(--dim);font:500 12.5px/1.6 var(--sans)}
  footer.mk .fin{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
  footer.mk a{color:var(--ink2)}

  @media(max-width:980px){
    .hero-grid{grid-template-columns:1fr;gap:28px}
    .cats,.grid{grid-template-columns:repeat(2,1fr)}
    .princ{grid-template-columns:1fr 1fr}
    .princ .p:nth-child(3){border-left:0}
    .kpi{grid-template-columns:1fr 1fr;gap:20px 0}.kpi .it{padding:0 16px}.kpi .it:nth-child(3)::before{display:none}
    .band-in{grid-template-columns:1fr}
  }
  @media(max-width:560px){.cats,.grid{grid-template-columns:1fr}.princ{grid-template-columns:1fr}.princ .p{border-left:0;border-top:1px solid var(--line)}.princ .p:first-child{border-top:0}}

/* ===== page-head + filters (каталог/статика) ===== */
.page-head{padding:48px 0 8px}
.crumb{font:600 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-bottom:16px;display:flex;gap:8px}
.crumb a{color:var(--dim)} .crumb .sep{opacity:.4}
.page-head h1{font:800 clamp(30px,4.5vw,52px)/1 var(--sans);letter-spacing:-.03em;text-transform:lowercase}
.page-head h1 .ac{color:var(--accent)}
.page-head .lead{margin-top:14px;max-width:620px;color:var(--ink2);font-size:15.5px}
.filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:26px 0 30px}
.filters .lbl{font:700 11px/1 var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--dim);margin-left:8px}
.filters .lbl:first-child{margin-left:0}
.filters select,.filters input{background:var(--card);border:1px solid var(--line2);color:var(--ink);font:600 13px/1 var(--sans);padding:10px 12px;border-radius:10px}
.filters select:focus,.filters input:focus{outline:none;border-color:var(--accent-bd)}
.filters .right{margin-left:auto;display:flex;gap:10px;align-items:center}
.filters input[type=search]{min-width:210px}
.empty{padding:48px;text-align:center;color:var(--dim)}
.legal-body{max-width:760px;color:var(--ink2);font-size:15px;line-height:1.7}
.legal-body h2{color:var(--ink);font:800 22px/1.2 var(--sans);letter-spacing:-.02em;margin:34px 0 12px;text-transform:none}
.legal-body p{margin-bottom:14px} .legal-body ul{margin:0 0 14px 20px}

/* ===== product page ===== */
.pd{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:40px 0 56px}
.pd-cover{position:relative;aspect-ratio:1;background:var(--card) center/cover no-repeat;border:1px solid var(--line2);border-radius:18px;overflow:hidden}
.pd-thumbs{display:flex;gap:8px;margin-top:10px}
.pd-thumb{flex:1;aspect-ratio:1;background:var(--card) center/cover no-repeat;border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:.15s}
.pd-thumb:hover,.pd-thumb.on{border-color:var(--accent-bd)}
.pd-info .crumb{margin-bottom:20px}
.pd-tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:16px}
.pd-tag{font:600 10px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-bd);border-radius:6px;padding:5px 8px}
.pd-info h1{font:800 clamp(26px,3vw,40px)/1.05 var(--sans);letter-spacing:-.025em}
.pd-summary{margin-top:14px;color:var(--ink2);font-size:15px;max-width:520px;line-height:1.6}
.pd-quick{display:grid;grid-template-columns:repeat(4,1fr);margin-top:24px;border:1px solid var(--line2);border-radius:12px;overflow:hidden}
.pd-quick .c{padding:16px 12px;border-left:1px solid var(--line2)}
.pd-quick .c:first-child{border-left:0}
.pd-quick .n{font:800 22px/1 var(--sans);letter-spacing:-.02em}
.pd-quick .u{font:600 10px/1 var(--mono);color:var(--dim);letter-spacing:.12em;margin-top:5px;text-transform:uppercase}
.pd-buy{margin-top:26px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px}
.pd-price-row{display:flex;align-items:baseline;gap:14px;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:16px}
.pd-price{font:900 38px/1 var(--sans);letter-spacing:-.02em}
.pd-old{font:500 16px/1 var(--mono);color:var(--dim);text-decoration:line-through}
.pd-disc{margin-left:auto;font:700 11px/1 var(--mono);color:var(--accent-ink);background:var(--accent);border-radius:6px;padding:5px 9px}
.pd-cta{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pd-cta .btn{width:100%;justify-content:center}
.pd-perks{display:flex;flex-direction:column;gap:9px;margin-top:16px}
.pd-perk{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink2)}
.pd-perk .ic{width:22px;height:22px;flex-shrink:0;background:var(--accent-soft);border:1px solid var(--accent-bd);color:var(--accent);border-radius:6px;display:flex;align-items:center;justify-content:center}
.specs{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;max-width:860px}
.specs .row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.specs .row .k{color:var(--dim)} .specs .row .v{color:var(--ink);text-align:right}
@media(max-width:900px){.pd{grid-template-columns:1fr;gap:28px}.pd-cta{grid-template-columns:1fr}.specs{grid-template-columns:1fr}}
