/* =========================================================
   НАЧАЛНА СТРАНИЦА — секциите под героя
   ========================================================= */

.strip{background:#fff;border-bottom:1px solid var(--line)}
.strip-h{text-align:center;font-size:12px;text-transform:uppercase;letter-spacing:.16em;
  font-weight:750;color:var(--ink-400);margin-bottom:30px}

.lnk{display:inline-flex;align-items:center;gap:9px;font-weight:730;font-size:15px;color:var(--red);
  transition:gap .3s var(--ease)}
.lnk svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;flex:none}
.lnk:hover{gap:14px}
.lnk.light{color:#fff}
.lnk.light svg{stroke:var(--red-300)}

/* =========================================================
   ПЪТЯТ НА ТОВАРА
   ========================================================= */
.journey{background:var(--paper-2);overflow:hidden}
.jp{position:relative;margin-top:8px}
.jp-rail{position:absolute;left:0;right:0;top:37px;height:3px;background:var(--line);border-radius:3px;
  overflow:hidden}
.jp-fill{position:absolute;inset:0 auto 0 0;width:0;background:var(--grad-red);border-radius:3px;
  box-shadow:0 0 16px rgba(227,30,36,.55);transition:width 1.6s var(--ease-out)}
.jp.go .jp-fill{width:100%}

.jp-list{display:grid;grid-template-columns:repeat(6,1fr);gap:22px;position:relative;z-index:1;
  counter-reset:jp;padding:0;margin:0;list-style:none}
.jp-step{position:relative;padding-top:0}
.jp-dot{display:grid;place-items:center;width:76px;height:76px;border-radius:50%;
  background:var(--paper-2);position:relative;margin-bottom:20px}
.jp-dot i{width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid var(--line);
  display:block;transition:border-color .5s var(--ease),transform .5s var(--ease),box-shadow .5s}
.jp.go .jp-step i{border-color:var(--red);transform:scale(1.12);
  box-shadow:0 0 0 6px rgba(227,30,36,.12)}
.jp.go .jp-step:nth-child(1) i{transition-delay:.15s}
.jp.go .jp-step:nth-child(2) i{transition-delay:.4s}
.jp.go .jp-step:nth-child(3) i{transition-delay:.65s}
.jp.go .jp-step:nth-child(4) i{transition-delay:.9s}
.jp.go .jp-step:nth-child(5) i{transition-delay:1.15s}
.jp.go .jp-step:nth-child(6) i{transition-delay:1.4s}

.jp-num{position:absolute;top:6px;left:56px;font-size:11.5px;font-weight:800;color:var(--red);
  letter-spacing:.08em}
.jp-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:#fff;
  border:1px solid var(--line);margin-bottom:14px;transition:transform .45s var(--ease),
  background .4s,border-color .4s,box-shadow .4s}
.jp-ic svg{width:21px;height:21px;stroke:var(--red);fill:none;stroke-width:1.75;transition:stroke .4s}
.jp-step:hover .jp-ic{background:var(--grad-red);border-color:transparent;transform:translateY(-4px) rotate(-6deg);
  box-shadow:var(--shadow-red)}
.jp-step:hover .jp-ic svg{stroke:#fff}
.jp-step h3{font-size:17.5px;letter-spacing:-.02em;margin-bottom:7px}
.jp-step p{font-size:13.8px;color:var(--ink-500);margin:0;line-height:1.55}

/* =========================================================
   БЕНТО РЕШЕТКА С УСЛУГИ
   ========================================================= */
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.bn{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-l);
  padding:28px;overflow:hidden;display:flex;flex-direction:column;
  transition:transform .5s var(--ease),box-shadow .5s,border-color .4s}
.bn::before{content:"";position:absolute;inset:0;background:var(--grad-red);opacity:0;
  transition:opacity .5s var(--ease);z-index:0}
.bn::after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;z-index:0;
  background:radial-gradient(circle,rgba(227,30,36,.12),transparent 70%);
  top:-130px;right:-110px;transition:transform .7s var(--ease)}
.bn > *{position:relative;z-index:1}
.bn:hover{transform:translateY(-7px);box-shadow:var(--shadow-l);border-color:transparent}
.bn:hover::before{opacity:1}
.bn:hover::after{transform:scale(1.9)}
.bn.big{grid-column:span 2;grid-row:span 2;padding:34px}
.bn.sm{grid-column:span 1}
/* последните две карти запълват реда, вместо да оставят празнина */
.bn.sm:nth-last-child(-n+2){grid-column:span 2}
.bn-ic{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;margin-bottom:20px;
  background:var(--paper-2);transition:background .45s,transform .55s var(--ease)}
.bn-ic svg{width:26px;height:26px;stroke:var(--red);fill:none;stroke-width:1.7;transition:stroke .45s}
.bn:hover .bn-ic{background:rgba(255,255,255,.22);transform:rotate(-7deg) scale(1.06)}
.bn:hover .bn-ic svg{stroke:#fff}
.bn h3{font-size:20px;letter-spacing:-.024em;margin-bottom:10px;transition:color .4s}
.bn.big h3{font-size:27px;letter-spacing:-.03em}
.bn p{font-size:14.5px;color:var(--ink-500);margin:0 0 18px;flex:1;transition:color .4s;line-height:1.6}
.bn.big p{font-size:16px}
.bn-stats{display:flex;gap:26px;margin-bottom:20px;padding-top:18px;
  border-top:1px solid var(--line);transition:border-color .4s}
.bn-stats span{display:block}
.bn-stats b{display:block;font-size:24px;font-weight:850;letter-spacing:-.035em;color:var(--red);
  transition:color .4s;line-height:1.1}
.bn-stats span{font-size:11.5px;color:var(--ink-400);text-transform:uppercase;letter-spacing:.08em;
  font-weight:650;transition:color .4s}
.bn-go{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  border:1.5px solid var(--line);color:var(--ink);align-self:flex-start;
  transition:background .4s,border-color .4s,color .4s,transform .45s var(--ease)}
.bn-go svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.1;
  transition:transform .4s var(--ease)}
.bn:hover h3{color:#fff}
.bn:hover p{color:rgba(255,255,255,.9)}
.bn:hover .bn-stats{border-color:rgba(255,255,255,.28)}
.bn:hover .bn-stats b{color:#fff}
.bn:hover .bn-stats span{color:rgba(255,255,255,.72)}
.bn:hover .bn-go{background:#fff;border-color:#fff;color:var(--red);transform:scale(1.09)}
.bn:hover .bn-go svg{transform:translateX(3px)}
.bn.cta{background:var(--ink-900);border-color:transparent}
.bn.cta h3{color:#fff}
.bn.cta p{color:var(--ink-400)}
.bn.cta .bn-ic{background:rgba(255,255,255,.08)}
.bn.cta .bn-go{border-color:rgba(255,255,255,.25);color:#fff}

/* =========================================================
   МРЕЖАТА НА ЖИВО — карта на България
   ========================================================= */
.netsec{overflow:hidden}
.net-wrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:30px;
  align-items:center;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.1);
  border-radius:var(--r-xl);padding:26px;backdrop-filter:blur(10px)}
.net-stage{position:relative;aspect-ratio:1000/620;width:100%}
.net-stage svg{position:absolute;inset:0;width:100%;height:100%}
.bg-map .nb path{fill:rgba(255,255,255,.035);stroke:rgba(255,255,255,.07);stroke-width:1}
.bg-map .bg path{fill:rgba(227,30,36,.09);stroke:rgba(227,30,36,.65);stroke-width:1.8;
  filter:drop-shadow(0 0 14px rgba(227,30,36,.28))}

.net-line{fill:none;stroke:rgba(255,255,255,.16);stroke-width:1.2;stroke-dasharray:4 5}
.net-run{fill:none;stroke:url(#netG);stroke-width:2.2;stroke-linecap:round;
  filter:drop-shadow(0 0 5px rgba(227,30,36,.7))}
.net-city{fill:rgba(255,255,255,.62);cursor:pointer;transition:fill .3s,r .3s}
.net-city:hover,.net-city.on{fill:#fff}
.net-hub{fill:var(--red-300);cursor:pointer}
.net-ping{fill:none;stroke:var(--red);stroke-width:1.7}
.net-hit{fill:transparent;cursor:pointer}
.net-lab{font-family:var(--f-sans);font-size:12.5px;font-weight:750;fill:#fff;
  paint-order:stroke;stroke:rgba(14,13,13,.9);stroke-width:3.5px;stroke-linejoin:round;
  pointer-events:none}
.net-dot{fill:#fff;filter:drop-shadow(0 0 6px rgba(255,120,124,.95))}

.net-tip{position:absolute;left:24px;top:24px;background:rgba(14,13,13,.94);
  border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:12px 18px;
  opacity:0;transform:translateY(-6px);transition:opacity .25s,transform .3s var(--ease-out);
  pointer-events:none;backdrop-filter:blur(10px);z-index:4;max-width:280px}
.net-tip.on{opacity:1;transform:none}
.net-tip b{display:block;font-size:15px;font-weight:750;color:#fff}
.net-tip span{display:block;font-size:12.5px;color:var(--ink-400);margin-top:3px;line-height:1.45}

.net-side{display:grid;gap:10px;align-content:center}
.net-stat{background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.09);border-radius:14px;
  padding:15px 18px;transition:border-color .35s,background .35s,transform .4s var(--ease)}
.net-stat:hover{border-color:rgba(227,30,36,.45);background:rgba(227,30,36,.08);transform:translateX(4px)}
.net-stat b{display:block;font-size:29px;font-weight:850;letter-spacing:-.045em;line-height:1;
  font-variant-numeric:tabular-nums;
  background:var(--grad-red);-webkit-background-clip:text;background-clip:text;color:transparent}
.net-stat span{display:block;font-size:12px;color:var(--ink-400);margin-top:6px;font-weight:640}
.net-legend{margin-top:8px;display:grid;gap:8px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1)}
.net-legend span{display:flex;align-items:center;gap:9px;font-size:11.5px;color:var(--ink-400);font-weight:640}
.net-legend i{width:10px;height:10px;border-radius:50%;flex:none}
.net-legend i.hub{background:var(--red-300);box-shadow:0 0 8px rgba(227,30,36,.8)}
.net-legend i.of{background:rgba(255,255,255,.6)}
.net-legend i.ln{width:16px;height:2px;border-radius:2px;background:var(--red);box-shadow:0 0 6px rgba(227,30,36,.8)}

/* =========================================================
   ИНСТРУМЕНТИ
   ========================================================= */
.tools{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.tool{position:relative;border-radius:var(--r-xl);padding:38px 36px;overflow:hidden;isolation:isolate;
  display:flex;flex-direction:column;transition:transform .5s var(--ease),box-shadow .5s}
.tool:hover{transform:translateY(-7px);box-shadow:var(--shadow-l)}
.tool-a{background:var(--ink-900);color:#fff}
.tool-b{background:#fff;border:1px solid var(--line)}
.tool-glow{position:absolute;width:520px;height:520px;border-radius:50%;z-index:-1;
  background:radial-gradient(circle,rgba(227,30,36,.4),transparent 66%);
  top:-240px;right:-160px;transition:transform .8s var(--ease)}
.tool:hover .tool-glow{transform:scale(1.35) translate(-30px,40px)}
.tool-b .tool-glow{background:radial-gradient(circle,rgba(227,30,36,.16),transparent 66%)}
.tool-tag{display:inline-flex;align-items:center;gap:9px;font-size:11.5px;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:18px;
  background:rgba(227,30,36,.12);border-radius:99px;padding:7px 15px;align-self:flex-start}
.tool-a .tool-tag{color:var(--red-200);background:rgba(227,30,36,.2)}
.tool h3{font-size:clamp(23px,2.6vw,31px);letter-spacing:-.032em;margin-bottom:12px}
.tool-a h3{color:#fff}
.tool p{font-size:16px;margin:0 0 24px;flex:1;line-height:1.65}
.tool-a p{color:var(--ink-300)}
.tool-b p{color:var(--ink-500)}
.tool-go{display:inline-flex;align-items:center;gap:10px;font-weight:750;font-size:15.5px;
  color:var(--red);transition:gap .35s var(--ease)}
.tool-a .tool-go{color:var(--red-200)}
.tool-go svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.2}
.tool:hover .tool-go{gap:16px}

.tool-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:26px}
.tool-chips span{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);border-radius:99px;
  padding:8px 15px;color:#fff}
.tool-chips svg{width:14px;height:14px;stroke:var(--red-300);fill:none;stroke-width:2;flex:none}

.tool-track{margin-bottom:26px}
.tt-line{display:block;position:relative;height:4px;background:var(--paper-2);border-radius:4px;
  margin-bottom:11px;overflow:hidden}
.tt-line i{position:absolute;inset:0 auto 0 0;width:30%;background:var(--grad-red);border-radius:4px;
  animation:ttRun 3.4s var(--ease-out) infinite}
@keyframes ttRun{0%{width:8%}55%{width:72%}100%{width:8%}}
.tt-labels{display:flex;justify-content:space-between}
.tt-labels b{font-size:11.5px;font-weight:700;color:var(--ink-400);text-transform:uppercase;
  letter-spacing:.06em}
.tt-labels b:first-child{color:var(--red)}

/* =========================================================
   ЗАЩО НИЕ
   ========================================================= */
.why{background:var(--ink-900);color:#f2f0ed}
.why h2,.why h3{color:#fff}
.why .sh p{color:var(--ink-300)}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.1);border-radius:var(--r-l);overflow:hidden}
.why-i{background:var(--ink-900);padding:26px 24px;transition:background .4s}
.why-i:hover{background:#1a1918}
.why-i .n{display:block;font-size:11.5px;font-weight:800;color:var(--red);letter-spacing:.1em;
  margin-bottom:12px}
.why-i h3{font-size:16.5px;letter-spacing:-.018em;margin-bottom:7px}
.why-i p{font-size:13.8px;color:var(--ink-400);margin:0;line-height:1.6}

/* =========================================================
   НОВИНИ
   ========================================================= */
.nw-list{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden}
.nw{background:#fff;padding:24px 26px;display:flex;align-items:center;gap:20px;
  transition:background .3s,padding-left .35s var(--ease)}
.nw:hover{background:var(--paper-2);padding-left:34px}
.nw-date{font-size:12px;font-weight:750;color:var(--red);flex:none;width:88px;
  font-variant-numeric:tabular-nums}
.nw-t{font-weight:660;font-size:15.5px;flex:1;letter-spacing:-.014em}
.nw-go{flex:none;color:var(--ink-400);display:grid;place-items:center;
  transition:color .3s,transform .35s var(--ease)}
.nw-go svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2}
.nw:hover .nw-go{color:var(--red);transform:translateX(4px)}

/* =========================================================
   АДАПТИВНОСТ
   ========================================================= */
@media (max-width:1180px){
  .jp-list{grid-template-columns:repeat(3,1fr);gap:34px 22px}
  .jp-rail{display:none}
  .bento{grid-template-columns:repeat(2,1fr)}
  .bn.big{grid-column:span 2;grid-row:auto}
  .net-wrap{grid-template-columns:1fr;gap:22px}
  .net-side{grid-template-columns:repeat(2,1fr);display:grid}
  .net-legend{grid-column:1/-1;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.1)}
}
@media (max-width:900px){
  .tools{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr}
  .nw-list{grid-template-columns:1fr}
}
@media (max-width:640px){
  .jp-list{grid-template-columns:1fr;gap:26px}
  .jp-dot{width:auto;height:auto;margin-bottom:0;place-items:start}
  .jp-dot i{display:none}
  .jp-num{position:static;display:block;margin-bottom:10px}
  .bento{grid-template-columns:1fr}
  .bn.big,.bn.sm{grid-column:span 1}
/* последните две карти запълват реда, вместо да оставят празнина */
.bn.sm:nth-last-child(-n+2){grid-column:span 2}
  .net-side{grid-template-columns:1fr}
  .net-legend{grid-template-columns:1fr}
  .tool{padding:28px 24px}
  .nw{flex-wrap:wrap;gap:8px}
  .nw-date{width:auto}
}
