/* ==========================================================================
   MaxBG · витрина

   Похватите са взети от това, което реално работи на българския пазар:
   планове по брой посещения, промо ивица с обратно броене, телефон в
   шапката, отзиви с оценки, партньорски лога, подробна таблица.

   Имената на класовете са запазени, за да наследят промяната всички
   страници наведнъж.
   ========================================================================== */

/*
 * Шрифтовете се зареждат само ако файловете наистина ги има.
 *
 * Липсващ woff2 не чупи страницата, но пълни лога с грешки при всяко
 * зареждане и бави рисуването, докато браузърът чака отговор.
 * Резервните са системни — четими навсякъде, без изтегляне.
 *
 * За да сложиш истинските:
 *   mkdir -p /var/www/maxbg.net/public/fonts
 *   и копирай onest.woff2 и jetbrains-mono.woff2 там
 */
@font-face{
  font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;
  src:url(/fonts/onest-cyrillic-400-normal.woff2) format('woff2');
}
@font-face{
  font-family:'JetBrains Mono';font-style:normal;font-weight:500 700;font-display:swap;
  src:url(/fonts/jetbrains-mono-cyrillic-wght-normal.woff2) format('woff2');
}

:root{
  /* --- мастило и хартия --- */
  --navy:#0E2745; --navy-2:#173654; --navy-3:#22496D; --navy-deep:#0A1D33;
  --paper:#FFFFFF; --wash:#F5F7FA; --wash-2:#EDF1F6;
  --line:#DFE5EC; --line-2:#C7D1DD; --line-3:#AEBBCB;
  --ink:#0E2745; --ink-2:#48586C; --ink-3:#7A8899;

  /* --- акцент: казанлъшка роза --- */
  --rose:#C0335C; --rose-2:#A32949; --rose-w:#FDF1F4;

  /* --- състояния --- */
  --ok:#127A55; --ok-w:#E7F5EF;
  --warn:#9A6A12; --warn-w:#FBF4E4;
  --bad:#B0342C; --bad-w:#FDF0EE;
  --blue:#1C5FA8; --blue-w:#EAF2FB;
  --star:#F0A81E;

  /* Резервните са изброени нарочно: при липсващ woff2 текстът пак
     изглежда прилично, вместо да падне на Times. */
  --sans:'Onest',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,'DejaVu Sans Mono',monospace;

  --r:6px; --r-md:8px; --r-lg:10px;
  --sh-s:0 1px 2px rgba(14,39,69,.05);
  --sh:0 2px 10px rgba(14,39,69,.06);
  --sh-l:0 16px 44px rgba(14,39,69,.14);
  --sh-xl:0 24px 60px rgba(14,39,69,.2);
}

/* ==========================================================================
   Основа
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}

body{
  margin:0;background:var(--paper);color:var(--ink);
  font:400 15px/1.55 var(--sans);
  font-variant-numeric:tabular-nums;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}

h1,h2,h3,h4,h5{margin:0;font-weight:800;letter-spacing:-.035em;line-height:1.2}
h1{font-size:clamp(1.6rem,3.2vw,2.2rem)}
h2{font-size:clamp(1.35rem,2.6vw,1.75rem)}
h3{font-size:1.08rem}
h4{font-size:.95rem}
p{margin:0}
ul,ol{margin:0;padding:0}

a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
button{font-family:inherit}
img,svg,video{display:block;max-width:100%}
table{border-collapse:collapse}

::selection{background:var(--rose-w);color:var(--rose-2)}
:focus-visible{outline:2px solid var(--rose);outline-offset:2px;border-radius:3px}

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.mono{font-family:var(--mono)}
.ta-r,.tb-right{text-align:right}

.wrap-w{max-width:1280px;margin-inline:auto;padding-inline:22px}
.wrap-n{max-width:840px;margin-inline:auto;padding-inline:22px}

/* ==========================================================================
   Бутони
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font:600 15px/1 var(--sans);padding:12px 22px;border-radius:var(--r);
  background:var(--rose);color:#fff;border:1px solid var(--rose);
  cursor:pointer;white-space:nowrap;text-decoration:none;
  transition:background .14s,border-color .14s,color .14s,box-shadow .14s;
}
.btn:hover{background:var(--rose-2);border-color:var(--rose-2);color:#fff;text-decoration:none}
.btn:active{transform:translateY(.5px)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn svg{width:15px;height:15px;flex:0 0 auto;stroke-width:2}

.btn-sm{font-size:14px;padding:9px 15px}
.btn-lg{font-size:16px;padding:14px 28px}

.btn-ghost{background:none;color:#060606;border-color:#7cbf00;}
.btn-ghost:hover{background:none;color:var(--ink);border-color:var(--ink-3)}

.btn-light{background:#fff;color:var(--navy);border-color:#fff}
.btn-light:hover{background:var(--wash-2);border-color:var(--wash-2);color:#ffffff;}

.btn-navy{background:var(--navy);border-color:var(--navy)}
.btn-navy:hover{background:var(--navy-2);border-color:var(--navy-2)}

.link-back{font-size:14px;color:var(--ink-2);font-weight:500}
.link-back:hover{color:var(--rose)}
.link-danger{
  background:none;border:0;padding:0;cursor:pointer;font:500 14px/1 var(--sans);
  color:var(--ink-2);text-decoration:underline;text-underline-offset:3px;
}
.link-danger:hover{color:var(--bad)}

/* ==========================================================================
   Промо ивица
   ========================================================================== */
.topbar{
  background:linear-gradient(90deg,var(--rose) 0%,#8E2544 100%);color:#fff;font-size:13.5px;
}
.topbar .wrap-w{display:flex;align-items:center;gap:14px;padding-block:6px;min-height:48px;flex-wrap:wrap}
.topbar a{color:#fff;text-decoration:underline;text-underline-offset:3px;font-weight:600}
.topbar b{font-weight:700}
.topbar .tag{
  background:rgba(255,255,255,.22);border-radius:4px;padding:3px 9px;
  font:700 11px/1 var(--mono);letter-spacing:.06em;flex:0 0 auto;
}
.topbar .cd{margin-left:auto;display:flex;align-items:center;gap:5px;font-size:12.5px}
.topbar .cd i{
  font-style:normal;background:rgba(0,0,0,.2);border-radius:4px;padding:4px 7px;
  font:700 13px/1 var(--mono);
}

/* ==========================================================================
   Служебна лента
   ========================================================================== */
.utilbar{background:#7cbf00;color:rgb(0 0 0);font-size:12.5px}
.utilbar .wrap-w{display:flex;align-items:center;gap:22px;padding-block:7px;flex-wrap:wrap}
.utilbar a{color:rgb(0 0 0);text-decoration:none}
.utilbar a:hover{color:#fff;text-decoration:none}
.utilbar .r{margin-left:auto;display:flex;gap:18px;align-items:center}
.utilbar span{display:flex;align-items:center;gap:7px}
.utilbar svg{width:13px;height:13px;stroke-width:2}
.utilbar .dot{
  width:7px;height:7px;border-radius:50%;background:#ffffff;flex:0 0 auto;
  box-shadow:0 0 0 0 rgba(63,210,147,.5);animation:mb-pulse 2.6s infinite;
}
@keyframes mb-pulse{
  0%{box-shadow:0 0 0 0 rgba(63,210,147,.45)}
  70%{box-shadow:0 0 0 7px rgba(63,210,147,0)}
  100%{box-shadow:0 0 0 0 rgba(63,210,147,0)}
}

/* ==========================================================================
   Шапка
   ========================================================================== */
.site-header{
  border-bottom:1px solid var(--line);background:#000000;
  position:sticky;top:0;z-index:60;
}
.site-header .wrap-w{display:flex;align-items:center;gap:24px;padding-block:13px}

.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand:hover{text-decoration:none}
.brand img{height:55px;width:auto}
.brand-mark{
  width:34px;height:34px;border-radius:7px;background:var(--navy);color:#fff;
  display:grid;place-items:center;font:800 16px/1 var(--sans);letter-spacing:-.05em;flex:0 0 auto;
}
.brand b{font-size:19px;font-weight:800;letter-spacing:-.04em;color:var(--ink)}
.brand i{color:var(--rose);font-style:normal}

/* --- главно меню --- */
.nav{display:flex;gap:2px;list-style:none}
.nav>li{position:relative}
.nav>li>a{
  display:flex;align-items:center;gap:6px;padding:10px 13px;border-radius:var(--r);
  font-size:15px;font-weight:600;color:#ffffff;text-decoration:none;
}
.nav>li>a:hover,.nav>li.has-drop:hover>a{background:var(--wash);color:var(--ink);text-decoration:none}
.nav>li>a[aria-current]{color:var(--ink);background:var(--wash)}
.nav>li>a svg{width:11px;height:11px;stroke-width:2.4;opacity:.55}

.nav-drop,.drop,.mega{
  position:absolute;top:100%;left:0;min-width:346px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--sh-l);padding:7px;list-style:none;

  /* Над всичко останало в шапката. Пет беше достатъчно на теория,
     но не оставя място за грешка при добавяне на нов слой. */
  z-index:80;
  /*
   * Скрито с display, не с прозрачност.
   *
   * Прозрачността оставя менюто на страницата — то заема място, лови
   * щраквания и зависи от вериги правила, които лесно се чупят.
   * display:none е недвусмислено: или го има, или го няма.
   */
  display:none;
}
.has-drop.is-open>.nav-drop,
.has-drop.is-open>.drop,
.has-drop.is-open>.mega{
  display:block;
}
.has-drop.is-open>.mega{display:grid}
.mega-col{list-style:none}
.mega-col h4{
  font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);padding:10px 11px 5px;
}

.nav-drop a,.drop a,.mega a{
  display:flex;gap:12px;padding:10px 11px;border-radius:var(--r);
  color:var(--ink);text-decoration:none;

  /* Изрично: нищо да не отменя приемането на щраквания. */
  pointer-events:auto;position:relative;z-index:1;
}
.nav-drop a:hover,.drop a:hover,.mega a:hover{background:var(--wash);text-decoration:none}
.nav-drop .fi,.drop .fi,.mega .fi{
  width:32px;height:32px;border-radius:var(--r);flex:0 0 auto;
  display:grid;place-items:center;background:#000000!mportant;color:#9dff1e!mportant;
}
.nav-drop .fi svg,.drop .fi svg,.mega .fi svg{width:16px;height:16px;stroke-width:1.8}
.nav-drop b,.drop b,.mega b{display:block;font-size:14.5px;font-weight:700;margin-bottom:2px}
.nav-drop span,.drop span,.mega span{display:block;font-size:12.5px;color:var(--ink-2);line-height:1.4}
.plan-badge,.free-badge{
  display:inline-block;font:700 9.5px/1 var(--sans);letter-spacing:.06em;
  text-transform:uppercase;background:var(--ok-w);color:var(--ok);
  padding:3px 6px;border-radius:3px;margin-bottom:4px;
}

.nav-actions{margin-left:auto;display:flex;align-items:center;gap:13px}
.nav-tel{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15.5px;color:var(--ink);text-decoration:none}
.nav-tel:hover{text-decoration:none;color:var(--rose)}
.nav-tel svg{width:16px;height:16px;color:var(--rose);stroke-width:2;flex:0 0 auto}
.nav-tel span{display:block}
.nav-tel small{display:block;font-size:11px;font-weight:500;color:var(--ink-3);margin-top:1px}

.lang,.lang-switch{display:flex;gap:5px;align-items:center}
.lang a,.lang-switch a{
  font-size:13px;font-weight:600;color:var(--ink-3);padding:5px 8px;border-radius:4px;
  text-decoration:none;
}
.lang a:hover,.lang-switch a:hover{background:var(--wash);color:var(--ink);text-decoration:none}
.lang a[aria-current],.lang-switch a[aria-current]{background:var(--navy);color:#fff}

.nav-toggle{
  display:none;width:40px;height:40px;border:1px solid var(--line-2);border-radius:var(--r);
  background:none;cursor:pointer;place-items:center;color:var(--ink);
}
.nav-toggle svg{width:19px;height:19px;stroke-width:2}

/* ==========================================================================
   Секции
   ========================================================================== */
.sec{padding-block:100px}
.sec-wash{background:var(--wash);border-block:1px solid var(--line)}
.sec-head{margin-bottom:24px}
.sec-head.is-center{text-align:center}
.sec-head h1,.sec-head h2{margin-bottom:9px}
.sec-head p,.lead{color:var(--ink-2);font-size:16.5px;line-height:1.6;max-width:70ch}
.sec-head.is-center p,.sec-head.is-center .lead{margin-inline:auto}
.sec-more{margin-top:22px;text-align:center}
.eyebrow{
  display:block;font:700 11.5px/1 var(--sans);letter-spacing:.14em;
  text-transform:uppercase;color:var(--rose);margin-bottom:12px;
}
.crumb{font-size:13.5px;color:var(--ink-3);margin-bottom:14px}
.crumb a{color:var(--ink-2)}
.crumb span{margin-inline:7px;opacity:.5}

/* ==========================================================================
   Герой на вътрешните страници
   ========================================================================== */
.hero-lite{
  background:var(--wash);border-bottom:1px solid var(--line);
  padding-block:34px 30px;
}
.hero-lite h1{margin-bottom:11px}
.hero-lite .lead{font-size:17px}
.hero-cta{display:flex;gap:11px;flex-wrap:wrap;margin-top:20px}

.hero-home{
  background:#cffb804f;border-bottom:1px solid var(--line);padding-block:70px 38px;
}
.hero-home .sec-head{margin-bottom:22px}

/* ==========================================================================
   Планове — продавани по брой посещения
   ========================================================================== */
.plan-cycle{display:flex;justify-content:center;margin-bottom:22px}
.plan-cycle .cyc-box,.plan-cycle>div{
  display:flex;background:var(--paper);border:1px solid var(--line);
  border-radius:7px;padding:3px;gap:2px;
}
.plan-cycle button,.cyc-opt{
  border:0;background:none;cursor:pointer;padding:8px 16px;border-radius:5px;
  font:600 13.5px/1 var(--sans);color:var(--ink-2);
  display:flex;align-items:center;gap:7px;
}
.plan-cycle button:hover,.cyc-opt:hover{color:var(--ink)}
.plan-cycle button.is-on,.cyc-opt.is-on,.plan-cycle button[aria-pressed="true"]{
  background:var(--navy);color:#fff;
}
.cyc-label{font-weight:600}
.cyc-price,.plan-cycle .save{
  font:700 10px/1 var(--sans);background:var(--ok-w);color:var(--ok);
  padding:3px 6px;border-radius:3px;letter-spacing:.04em;
}
.plan-cycle button.is-on .cyc-price,.cyc-opt.is-on .cyc-price,
.plan-cycle button[aria-pressed="true"] .save{background:rgba(255,255,255,.2);color:#fff}

.plan-grid,.cyc-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:start;
}

.plan-card{
  background:var(--paper);border:1px solid var(--line);border-radius:9px;
  display:flex;flex-direction:column;position:relative;
}
.plan-card.is-featured{border:2px solid var(--rose);box-shadow:0 10px 32px rgba(192,51,92,.13)}
.plan-card .plan-top{
  position:absolute;top:-11px;left:50%;transform:translateX(-50%);
  background:var(--rose);color:#fff;border-radius:4px;padding:4px 12px;
  font:700 10.5px/1 var(--sans);letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;
}
.plan-card .plan-gift{
  display:block;text-align:center;background:var(--ok-w);color:var(--ok);
  font:700 11px/1 var(--sans);padding:7px;border-radius:8px 8px 0 0;
}
.plan-card.is-featured .plan-gift{border-radius:6px 6px 0 0}

.plan-card h3{
  padding:18px 20px 0;text-align:center;
  font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);
}
.plan-card .plan-name{
  display:block;text-align:center;padding:4px 20px 0;
  font-size:1.28rem;font-weight:800;letter-spacing:-.035em;color:var(--ink);
}

/* --- главната мярка --- */
.plan-sum,.plan-visits{
  margin:16px 20px;padding:14px;background:#7cbf00;border-radius:7px;text-align:center;
}
.plan-sum b,.plan-visits b{
  display:block;font:700 1.6rem/1 var(--mono);letter-spacing:-.045em;
  color:var(--navy);margin-bottom:4px;
}
.plan-sum span,.plan-visits span{display:block;font-size:12.5px;color:var(--ink-2)}
.plan-card.is-featured .plan-sum,.plan-card.is-featured .plan-visits{background:var(--rose-w)}
.plan-card.is-featured .plan-sum b,.plan-card.is-featured .plan-visits b{color:var(--rose)}

.plan-spec{text-align:center;padding:0 20px 16px;border-bottom:1px solid var(--line)}
.plan-spec b{font:700 1.05rem/1 var(--mono);letter-spacing:-.03em}
.plan-spec span{display:block;font-size:12.5px;color:var(--ink-2);margin-top:4px}

.plan-list,.tick-list{
  list-style:none;margin:0;padding:16px 20px;display:grid;gap:9px;font-size:13.5px;flex:1;
}
.plan-list li,.tick-list li{display:flex;gap:9px;align-items:flex-start;color:var(--ink-2)}
.plan-list li::before,.tick-list li::before{
  content:"";width:14px;height:14px;flex:0 0 auto;margin-top:3px;
  background:currentColor;color:var(--ok);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
}
.plan-list li b,.tick-list li b{color:var(--ink);font-weight:600}
.plan-list li.no{color:var(--ink-3)}
.plan-list li.no::before{color:var(--line-2);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
}

.plan-price{padding:16px 20px 18px;text-align:center;border-top:1px solid var(--line)}
.plan-old{font:600 14px/1 var(--mono);color:var(--ink-3);text-decoration:line-through}
.plan-price .now{display:flex;align-items:baseline;justify-content:center;gap:5px;margin:5px 0 3px}
.plan-price .now b,.plan-price>b{font:700 2.15rem/1 var(--mono);letter-spacing:-.05em}
.plan-price .now span{font-size:14px;color:var(--ink-3)}
.plan-vat{font-size:12.5px;color:var(--ink-3);margin-bottom:14px}
.plan-btn{width:100%}
.plan-note{margin-top:20px;text-align:center;font-size:13.5px;color:var(--ink-3)}
.plan-idx{
  display:inline-block;font:700 11px/1 var(--mono);color:var(--ink-3);
}

/* ==========================================================================
   Лента „включено във всеки план“
   ========================================================================== */
.incl-bar{padding-block:24px;border-bottom:1px solid var(--line)}
.incl-bar .wrap-w{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.incl-bar h2{font-size:15px;flex:0 0 auto;letter-spacing:-.02em}
.incl-bar ul{list-style:none;display:flex;gap:24px;flex-wrap:wrap}
.incl-bar li{display:flex;align-items:center;gap:9px;font-size:14px;color:#7CFF00;}
.incl-bar li svg{width:16px;height:16px;color:#ffffff;stroke-width:2.4;flex:0 0 auto}

/* ==========================================================================
   Търсене на домейн
   ========================================================================== */
.dsearch{background:var(--navy);color:#fff;padding-block:34px}
.dsearch .wrap-w{display:grid;grid-template-columns:1fr 420px;gap:38px;align-items:center}
.dsearch h2{margin-bottom:8px;color:#4a4a4a;}
.dsearch p{color:rgba(255,255,255,.7);font-size:15.5px;margin-bottom:18px;max-width:52ch}
.dsearch-form{display:flex;gap:8px;margin-bottom:14px}
.dsearch-form input,.dm-input{
  flex:1;min-width:0;border:0;border-radius:var(--r);padding:14px 16px;
  font:500 16px/1 var(--sans);color:var(--ink);outline:none;background:#fff;
}
.dsearch-form input:focus{box-shadow:0 0 0 3px rgba(192,51,92,.4)}
.dm-note,.dsearch .note{font-size:13px;color:rgba(255,255,255,.55)}

.tld-chips{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.tld-chip{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r);padding:11px 14px;
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
}
.tld-chip b{font:700 15px/1 var(--mono);color:#fff}
.tld-chip .p{text-align:right}
.tld-chip .p s{display:block;font:500 11.5px/1 var(--mono);color:rgba(255,255,255,.4)}
.tld-chip .p em{font-style:normal;font:700 14px/1 var(--mono);color:#7CE0B4}
.tld-chip.is-hot{background:rgba(192,51,92,.24);border-color:rgba(255,92,135,.4)}

/* --- резултати от търсенето --- */
.dres{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;margin-bottom:16px;
}
.dres-row,.dres>div{
  display:flex;align-items:center;gap:16px;padding:15px 18px;
  border-bottom:1px solid var(--line);flex-wrap:wrap;
}
.dres>div:last-child{border-bottom:0}
.dres-name{font:700 17px/1.2 var(--mono);letter-spacing:-.02em;flex:1;min-width:0;word-break:break-all}
.dres-status{
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  padding:5px 10px;border-radius:4px;white-space:nowrap;
}
.dres-status.is-good{background:var(--ok-w);color:var(--ok)}
.dres-status.is-bad{background:var(--bad-w);color:var(--bad)}
.dres-price{font:700 17px/1 var(--mono);letter-spacing:-.03em;white-space:nowrap}
.dres-price small{display:block;font:400 12px/1 var(--sans);color:var(--ink-3);margin-top:4px}

.sug-list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.sug-list>div{background:var(--paper);display:flex;align-items:center;gap:14px;padding:12px 16px}
.sug-title{font:700 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
.sug-name{font:600 15px/1 var(--mono);flex:1}
.sug-price{font:700 15px/1 var(--mono);white-space:nowrap}

.dm-opts{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}

/* --- таблица с цени по разширения --- */
.tld-table{width:100%;font-size:14.5px}
.tld-table th,.tld-table td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left}
.tld-table thead th{
  background:var(--wash);font-size:12px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--ink-2);border-bottom:1px solid var(--line);
}
.tld-table td:first-child{font-family:var(--mono);font-weight:700}
.tld-table td:not(:first-child){font-family:var(--mono);text-align:right}
.tld-table tbody tr:hover{background:var(--wash)}

/* ==========================================================================
   Отзиви и оценки
   ========================================================================== */
.rev-head{display:flex;align-items:center;gap:26px;margin-bottom:20px;flex-wrap:wrap}
.rev-scores{margin-left:auto;display:flex;gap:22px;flex-wrap:wrap}
.rev-score{display:flex;align-items:center;gap:10px}
.rev-score .src{font:700 13px/1 var(--sans);color:var(--ink-2)}
.rev-score b{font:700 15px/1 var(--mono)}
.rev-score span{font-size:12px;color:var(--ink-3)}
.stars{display:flex;gap:2px}
.stars svg{width:14px;height:14px;color:var(--star)}

.rev-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:14px}
.rev-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:18px}
.rev-card .who{display:flex;align-items:center;gap:11px;margin-bottom:11px}
.rev-card .av{
  width:38px;height:38px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  font:700 14px/1 var(--sans);color:#fff;background:var(--navy);
}
.rev-card .who b{display:block;font-size:14.5px;font-weight:700}
.rev-card .who .stars{margin-top:3px}
.rev-card p{font-size:14px;color:var(--ink-2);line-height:1.55}
.rev-card .src{
  display:block;margin-top:12px;padding-top:11px;border-top:1px solid var(--line);
  font-size:12px;color:var(--ink-3);
}

/* ==========================================================================
   Сравнителна таблица
   ========================================================================== */
.cmp-wrap{border:1px solid var(--line);border-radius:var(--r-md);overflow:auto}
.cmp{width:100%;min-width:760px}
.cmp th,.cmp td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:center}
.cmp thead th{
  background:var(--navy);color:#fff;font-size:13px;font-weight:700;border-bottom:0;
  position:sticky;top:0;z-index:2;
}
.cmp thead th.is-featured{background:var(--rose)}
.cmp thead th small{display:block;font-weight:500;font-size:11.5px;color:rgba(255,255,255,.7);margin-top:3px}
.cmp thead th:first-child{text-align:left;background:var(--navy-2)}
.cmp tbody th{
  text-align:left;font-weight:600;font-size:13.5px;color:var(--ink-2);
  background:var(--wash);width:262px;
}
.cmp tbody th em{display:block;font-style:normal;font-size:12px;color:var(--ink-3);margin-top:2px;font-weight:400}
.cmp td{font:600 14px/1.4 var(--mono)}
.cmp tbody tr:hover td{background:var(--wash)}
.cmp .is-good,.cmp .y{color:var(--ok)}
.cmp .is-bad,.cmp .n{color:var(--line-2)}
.cmp svg{width:16px;height:16px;stroke-width:2.6;margin-inline:auto}
.cmp tr.cmp-buy td{padding:16px 14px}
.cmp tr.cmp-buy th{background:var(--wash)}

/* ==========================================================================
   Карти с предимства
   ========================================================================== */
.feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:16px}
.feat-card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:22px;
}
.sec-wash .feat-card{background:var(--paper)}
.feat-card .fi{
  width:42px;height:42px;border-radius:var(--r-md);background:var(--navy);color:#fff;
  display:grid;place-items:center;margin-bottom:14px;
}
.feat-card .fi svg{width:20px;height:20px;stroke-width:1.75}
.feat-card h3{font-size:16px;margin-bottom:7px}
.feat-card p{font-size:14px;color:var(--ink-2);line-height:1.55}
.feat-idx{
  display:block;font:700 12px/1 var(--mono);color:var(--rose);
  letter-spacing:.1em;margin-bottom:11px;
}

/* ==========================================================================
   Локации и партньори
   ========================================================================== */
.loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}
.loc-list{display:flex;gap:10px;flex-wrap:wrap}
.loc-item{
  display:flex;align-items:center;gap:9px;background:var(--wash);
  border:1px solid var(--line);border-radius:var(--r);padding:9px 14px;
  font-size:14px;font-weight:600;
}
.loc-item i{font-style:normal;font-size:17px}
.loc-item.is-main{background:var(--rose-w);border-color:#F0CFDA;color:var(--rose)}

.partner-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.partner{
  border:1px solid var(--line);border-radius:7px;padding:16px;
  display:flex;align-items:center;gap:12px;background:var(--paper);
}
.partner svg{width:24px;height:24px;color:var(--blue);stroke-width:1.6;flex:0 0 auto}
.partner b{display:block;font-size:14px;font-weight:700}
.partner span{display:block;font-size:12px;color:var(--ink-3);margin-top:2px}

/* ==========================================================================
   Начини на плащане
   ========================================================================== */
.pay-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.pay-opt{background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:15px}
.pay-opt b{display:block;font-size:14px;font-weight:700;margin-bottom:5px}
.pay-opt p{font-size:12.5px;color:var(--ink-2);line-height:1.5}
.pay-note{font-size:13px;color:var(--ink-3);margin-top:12px}

/* ==========================================================================
   Въпроси
   ========================================================================== */
.faq-list{display:grid;grid-template-columns:1fr 1fr;gap:0 38px}
.faq-list>div{min-width:0}
.qa{border-bottom:1px solid var(--line)}
.qa summary{
  padding:15px 0;cursor:pointer;font-size:15.5px;font-weight:600;
  display:flex;align-items:center;gap:12px;list-style:none;
}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{
  content:"";margin-left:auto;width:9px;height:9px;flex:0 0 auto;
  border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);
  transform:rotate(45deg);transition:transform .18s;
}
.qa[open] summary::after{transform:rotate(-135deg)}
.qa p{padding:0 0 16px;font-size:14.5px;color:var(--ink-2);line-height:1.6}

/* ==========================================================================
   Призив накрая
   ========================================================================== */
.cta-band{background:var(--navy);color:#fff;padding-block:40px}
.cta-band .wrap-w{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center}
.cta-band h2{margin-bottom:9px;color:#fff}
.cta-band p{color:rgba(255,255,255,.7);font-size:16px;max-width:56ch}
.cta-band .hero-cta{margin-top:0}

/* ==========================================================================
   Съдържание, блог, помощ
   ========================================================================== */
.prose{font-size:16px;line-height:1.7;color:var(--ink-2);max-width:174ch}
.prose h2{margin:32px 0 12px;color:var(--ink)}
.prose h3{margin:26px 0 10px;color:var(--ink)}
.prose p{margin-bottom:16px}
.prose ul,.prose ol{margin:0 0 16px 22px;display:grid;gap:8px}
.prose li{padding-left:2px}
.prose a{text-decoration:underline;text-underline-offset:3px}
.prose blockquote{
  margin:20px 0;padding:14px 20px;border-left:3px solid var(--rose);
  background:var(--wash);color:var(--ink);font-style:italic;
}
.prose code{
  font-family:var(--mono);font-size:13.5px;background:var(--wash-2);
  padding:2px 6px;border-radius:4px;
}
.prose pre{
  background:var(--navy-deep);color:#D7E1EE;padding:16px;border-radius:var(--r-md);
  overflow-x:auto;font-family:var(--mono);font-size:13px;line-height:1.6;
}
.prose pre code{background:none;padding:0;color:inherit}
.prose img{border-radius:var(--r-md);margin-block:18px}
.prose table{width:100%;font-size:14.5px;margin-bottom:18px}
.prose th,.prose td{padding:10px 12px;border:1px solid var(--line);text-align:left}
.prose th{background:var(--wash);font-weight:700}

.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(288px,1fr));gap:18px}
.post{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .15s,border-color .15s;
}
.post:hover{border-color:var(--line-2);box-shadow:var(--sh)}
.thumb{aspect-ratio:16/9;overflow:hidden;background:var(--wash-2)}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb-ph{
  aspect-ratio:16/9;background:linear-gradient(135deg,var(--navy),var(--navy-3));
  display:grid;place-items:center;color:rgba(255,255,255,.3);
  font:800 2rem/1 var(--sans);letter-spacing:-.05em;
}
.post .post-b{padding:18px;display:flex;flex-direction:column;flex:1}
.post time{font:500 12px/1 var(--mono);color:var(--ink-3);margin-bottom:8px;display:block}
.post h3{font-size:17px;margin-bottom:8px;letter-spacing:-.028em}
.post h3 a{color:var(--ink);text-decoration:none}
.post h3 a:hover{color:var(--rose)}
.post p{font-size:14px;color:var(--ink-2);line-height:1.55;margin-bottom:14px}
.post .more{margin-top:auto;font-size:13.5px;font-weight:600;color:var(--rose)}

/* --- помощни статии --- */
.kb-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.kb-cat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:20px}
.kb-cat h3{font-size:15.5px;margin-bottom:12px}
.kb-cat ul{list-style:none;display:grid;gap:9px}
.kb-cat li a{font-size:14px;color:var(--ink-2);display:flex;gap:9px;align-items:flex-start;text-decoration:none}
.kb-cat li a:hover{color:var(--blue)}
.kb-note{
  background:var(--blue-w);border:1px solid #CDE0F4;border-radius:var(--r-md);
  padding:16px 20px;font-size:14.5px;color:#154D89;line-height:1.6;
}

/* ==========================================================================
   Форми
   ========================================================================== */
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.f-row.is-single{grid-template-columns:1fr}
/*
 * Общото правило за полета във форма.
 *
 * Изключват се изборите с кръгче: там надписът стои СРЕЩУ кръгчето,
 * не над него, и блоковият вид ги подрежда един под друг.
 */
.order-form label:not(.dopt):not(.term):not(.co-tab),
.co-form label:not(.co-tab),
.contact-form label{
  display:flex;flex-direction:column;gap:7px;
  font-size:13px;font-weight:600;color:var(--ink);
}
.order-form input,.order-form select,.order-form textarea,
.co-form input,.co-form select,.co-form textarea,
.contact-form input,.contact-form select,.contact-form textarea,
.dm-input,.f-input{
  border:1px solid var(--line-2);border-radius:var(--r);padding:11px 14px;
  font:400 15px/1.4 var(--sans);color:var(--ink);background:var(--paper);
  transition:border-color .14s,box-shadow .14s;
}
.order-form input:hover,.co-form input:hover,.contact-form input:hover{border-color:var(--line-3)}
.order-form input:focus,.order-form select:focus,.order-form textarea:focus,
.co-form input:focus,.co-form select:focus,.co-form textarea:focus,
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{
  outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(14,39,69,.09);
}
.order-form textarea,.co-form textarea,.contact-form textarea{
  resize:vertical;min-height:118px;line-height:1.6;
}
.order-form select,.co-form select{
  cursor:pointer;appearance:none;padding-right:34px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237A8899' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
}
.f-check,.f-radio{
  display:flex;align-items:flex-start;gap:11px;font-size:14.5px;font-weight:400;
  line-height:1.5;cursor:pointer;
}
.f-check input,.f-radio input{
  accent-color:var(--navy);width:17px;height:17px;flex:0 0 auto;margin-top:2px;
}
.form-error{
  background:var(--bad-w);border:1px solid #F1D2CE;color:#8E2A23;
  border-radius:var(--r);padding:12px 16px;font-size:14px;margin-bottom:16px;
}
.note{font-size:13px;color:var(--ink-3);line-height:1.5}
.vat-note{font-size:12.5px;color:var(--ink-3)}

/* ==========================================================================
   Поръчка и плащане
   ========================================================================== */
.checkout-grid{display:grid;grid-template-columns:1fr 340px;gap:26px;align-items:start}
.co-side{position:sticky;top:96px}
.co-sum{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;
}
.co-sum h3{padding:15px 18px;border-bottom:1px solid var(--line);font-size:15px;background:var(--wash)}
.cs-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:12px 18px;border-bottom:1px solid var(--line);font-size:14px;
}
.cs-row:last-of-type{border-bottom:0}
.cs-row span{color:var(--ink-2)}
.cs-row b{font-family:var(--mono);font-weight:600}
.cs-row.is-total{background:var(--wash);font-size:15.5px}
.cs-row.is-total b{font-size:1.24rem;font-weight:700;letter-spacing:-.035em}
.order-feat{list-style:none;display:grid;gap:9px;margin-top:16px;font-size:13.5px;color:var(--ink-2)}
.order-no{font:700 1.3rem/1 var(--mono);letter-spacing:-.03em}
.of-step{
  display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line);
}
.of-step:last-child{border-bottom:0}
.of-step .n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 12px/1 var(--mono);
}
.of-step b{display:block;font-size:15px;margin-bottom:3px}
.of-step p{font-size:14px;color:var(--ink-2)}
.note-manual{
  background:var(--warn-w);border:1px solid #EDDDB8;border-radius:var(--r);
  padding:13px 16px;font-size:14px;color:#7A5410;line-height:1.55;
}

/* ==========================================================================
   Празни състояния, съобщения, 404
   ========================================================================== */
.empty-box{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  padding:48px 30px;text-align:center;
}
.empty-box h2{font-size:1.1rem;margin-bottom:8px}
.empty-box p{color:var(--ink-2);max-width:46ch;margin:0 auto 18px;font-size:14.5px}

.sec-404,.e404{text-align:center;padding-block:70px}
.e404{font:800 clamp(4rem,14vw,8rem)/1 var(--mono);letter-spacing:-.06em;color:var(--wash-2)}
.sec-404 h1{margin-top:-14px;margin-bottom:12px}

.sec-done{text-align:center;padding-block:52px}
.sec-done .tick{
  width:64px;height:64px;border-radius:50%;background:var(--ok-w);color:var(--ok);
  display:grid;place-items:center;margin:0 auto 20px;
}
.sec-done .tick svg{width:30px;height:30px;stroke-width:2.6}

.legal-warn{
  background:var(--warn-w);border:1px solid #EDDDB8;border-left:3px solid var(--warn);
  border-radius:var(--r);padding:14px 18px;margin-bottom:20px;
  font-size:14.5px;color:#7A5410;line-height:1.6;
}

.split-2{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.contact-grid{display:grid;grid-template-columns:1fr 340px;gap:32px;align-items:start}
.contact-box{
  background:var(--wash);border:1px solid var(--line);border-radius:var(--r-md);padding:22px;
}
.contact-box .line{
  display:flex;align-items:flex-start;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);
}
.contact-box .line:last-child{border-bottom:0}
.contact-box svg{width:18px;height:18px;color:var(--rose);stroke-width:1.9;flex:0 0 auto;margin-top:2px}
.contact-box b{display:block;font-size:14.5px;font-weight:600}
.contact-box span{display:block;font-size:13px;color:var(--ink-3);margin-top:2px}

.hp-row{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.hp-body{font-size:15px;color:var(--ink-2);line-height:1.65}

/* ==========================================================================
   Подвал
   ========================================================================== */
.site-footer{background:var(--navy-deep);color:rgba(255,255,255,.62);padding-block:36px 22px;font-size:13.5px}
.site-footer a{color:rgba(255,255,255,.62);text-decoration:none}
.site-footer a:hover{color:#fff;text-decoration:none}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:28px;margin-bottom:28px}
.foot-brand .brand b{color:#fff}
.foot-brand .brand-mark{background:rgba(255,255,255,.12)}
.foot-brand p{margin-top:12px;font-size:13.5px;line-height:1.6;max-width:34ch}
.foot-col h4{font-size:13px;color:#fff;margin-bottom:12px;letter-spacing:.02em}
.foot-col ul{list-style:none;display:grid;gap:8px}
.foot-social{display:flex;gap:10px;margin-top:16px}
.foot-social a{
  width:32px;height:32px;border-radius:var(--r);background:rgba(255,255,255,.08);
  display:grid;place-items:center;
}
.foot-social a:hover{background:rgba(255,255,255,.16)}
.foot-social svg{width:16px;height:16px;stroke-width:1.9}
.foot-bottom{
  border-top:1px solid rgba(255,255,255,.1);padding-top:18px;
  display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-size:12.5px;
}
.foot-bottom .r{margin-left:auto;display:flex;gap:16px}
.foot-reg{font-size:12.5px;color:rgba(255,255,255,.45);line-height:1.6}

/* ==========================================================================
   Адаптивност
   ========================================================================== */
@media (max-width:1120px){
  .plan-grid,.cyc-grid{grid-template-columns:repeat(2,1fr)}
  .dsearch .wrap-w,.loc-grid,.cta-band .wrap-w,.checkout-grid,
  .contact-grid,.split-2,.hp-row{grid-template-columns:1fr;gap:24px}
  .co-side{position:static}
  .faq-list{grid-template-columns:1fr;gap:0}
  .foot-grid{grid-template-columns:repeat(3,1fr)}
  .foot-brand{grid-column:1 / -1}
  .mega{grid-template-columns:1fr;min-width:346px}
}

@media (max-width:860px){
  .utilbar{display:none}
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;gap:0;background:var(--paper);
    border-bottom:1px solid var(--line);box-shadow:var(--sh-l);
    padding:8px;max-height:calc(100dvh - 60px);overflow-y:auto;
  }
  .nav.is-open{display:flex}
  .nav>li>a{padding:13px 14px;font-size:16px}
  /*
   * На телефон менюто е част от потока, не изскачащо. Показването
   * пак се решава от is-open — иначе всичките три списъка биха
   * стояли отворени наведнъж.
   */
  .nav-drop,.drop,.mega{
    position:static;box-shadow:none;border:0;
    border-left:2px solid var(--line);border-radius:0;
    margin-left:14px;min-width:0;padding:0;
  }
  .mega{grid-template-columns:1fr}
  .nav-toggle{display:grid}
  .nav-tel small{display:none}
  .site-header .wrap-w{position:relative;gap:12px}

  .plan-grid,.cyc-grid{grid-template-columns:1fr}
  .tld-chips{grid-template-columns:1fr}
  .partner-grid{grid-template-columns:1fr}
  .f-row{grid-template-columns:1fr}
  .rev-scores{margin-left:0;gap:16px}
  .incl-bar .wrap-w{gap:14px}
  .incl-bar ul{gap:12px 20px}
  .topbar .cd{margin-left:0;width:100%}
  .sec{padding-block:30px}
  .wrap-w,.wrap-n{padding-inline:16px}
  .dres-row,.dres>div{gap:10px}
  .dres-price{width:100%;text-align:left}
  .foot-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:460px){
  .foot-grid{grid-template-columns:1fr}
  .cta-band .hero-cta{flex-direction:column}
  .cta-band .hero-cta .btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

@media print{
  .topbar,.utilbar,.site-header,.site-footer,.cta-band,.hero-cta,.btn{display:none}
  body{background:#fff;font-size:12pt}
  .sec{padding-block:12px}
  .cmp-wrap,.feat-card,.plan-card{border-color:#CCC;box-shadow:none}
}

/* ==========================================================================
   Класове от съществуващите страници
   ========================================================================== */

/* --- прескачане към съдържанието --- */
.skip{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--navy);color:#fff;padding:11px 18px;border-radius:0 0 var(--r) 0;
  font-size:14px;font-weight:600;
}
.skip:focus{left:0;text-decoration:none}

/* --- лого и шапка --- */
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo img{height:30px;width:auto}
.logo:hover{text-decoration:none}
.burger{
  display:none;width:40px;height:40px;border:1px solid var(--line-2);border-radius:var(--r);
  background:none;cursor:pointer;place-items:center;color:var(--ink);
}
.burger svg{width:19px;height:19px;stroke-width:2}
.nav-login{display:flex;align-items:center;gap:10px}

/* --- телефон и контакти в лентите --- */
.tb-phone{display:flex;align-items:center;gap:7px;font-weight:600}
.tb-phone svg{width:13px;height:13px;stroke-width:2}
.tb-contact{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.foot-contact{display:grid;gap:9px;font-size:13.5px;margin-top:14px}
.foot-contact a{display:flex;align-items:center;gap:9px}
.foot-contact svg{width:15px;height:15px;stroke-width:1.9;flex:0 0 auto;opacity:.7}

/* --- герой с панел отстрани --- */
.hero-grid{display:grid;grid-template-columns:1fr 420px;gap:40px;align-items:center}
.hero-left{min-width:0}
.hero-panel{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:22px;box-shadow:var(--sh);
}
.hero-trust{
  display:flex;gap:22px;flex-wrap:wrap;margin-top:22px;
  font-size:13.5px;color:var(--ink-2);
}
.hero-trust span{display:flex;align-items:center;gap:8px}
.hero-trust svg{width:15px;height:15px;color:var(--ok);stroke-width:2.4;flex:0 0 auto}

/* --- обещания и точки --- */
.promise{
  display:grid;gap:10px;list-style:none;font-size:14.5px;color:var(--ink-2);
}
.promise li{display:flex;gap:10px;align-items:flex-start}
.promise li svg{width:16px;height:16px;color:var(--ok);stroke-width:2.4;margin-top:2px;flex:0 0 auto}
.hp-dot{
  width:5px;height:5px;border-radius:50%;background:var(--ink-3);
  display:inline-block;vertical-align:middle;margin-inline:8px;flex:0 0 auto;
}
.hp-sep{
  border:0;border-top:1px solid var(--line);margin-block:26px;
}

/* --- състояния --- */
.is-warn{background:var(--warn-w);color:var(--warn)}
.yes{color:var(--ok);font-weight:700}
.tag-manual{
  display:inline-block;font:700 10.5px/1 var(--sans);letter-spacing:.06em;
  text-transform:uppercase;background:var(--warn-w);color:var(--warn);
  padding:4px 8px;border-radius:3px;
}

/* --- съобщения при вход и форми --- */
.af-msg{
  padding:12px 16px;border-radius:var(--r);font-size:14px;line-height:1.55;
  margin-bottom:16px;border:1px solid;
}
.af-msg.is-ok{background:var(--ok-w);border-color:#BEE5D3;color:#0E6B4A}
.af-msg.is-bad{background:var(--bad-w);border-color:#F1D2CE;color:#8E2A23}
.af-msg.is-warn{background:var(--warn-w);border-color:#EDDDB8;color:#7A5410}

/* --- поръчка --- */
.co-main{min-width:0}
.co-who{
  background:var(--wash);border:1px solid var(--line);border-radius:var(--r-md);
  padding:16px 18px;margin-bottom:20px;font-size:14.5px;
}
.co-who b{display:block;font-weight:700;margin-bottom:3px}
.co-who span{color:var(--ink-2)}

/* --- начини на плащане в поръчката --- */
.pm-list{display:grid;gap:10px}
.pm-opt{
  border:1.5px solid var(--line);border-radius:var(--r-md);padding:15px 17px;
  cursor:pointer;transition:border-color .14s,background .14s;
}
.pm-opt:hover{border-color:var(--line-3)}
.pm-opt:has(input:checked){border-color:var(--rose);background:var(--rose-w)}
.pm-opt label{display:flex;align-items:flex-start;gap:12px;cursor:pointer}
.pm-opt input{accent-color:var(--rose);width:18px;height:18px;flex:0 0 auto;margin-top:2px}
.pm-opt b{display:block;font-size:15px;font-weight:700;margin-bottom:3px}
.pm-body{font-size:13.5px;color:var(--ink-2);line-height:1.55}

/* --- категории --- */
.cat{
  display:inline-block;font:700 11px/1 var(--sans);letter-spacing:.06em;
  text-transform:uppercase;background:var(--blue-w);color:var(--blue);
  padding:4px 9px;border-radius:3px;
}

/* --- основен блок --- */
main{display:block;min-height:40vh}

@media (max-width:1120px){
  .hero-grid{grid-template-columns:1fr;gap:26px}
}
@media (max-width:860px){
  .burger{display:grid}
  .tb-contact{gap:12px}
}

/* --- подвалът ползва h3 за заглавия на колоните --- */
.foot-col h3{font-size:13px;color:#fff;margin-bottom:12px;letter-spacing:.02em;font-weight:700}
.foot-brand img{height:30px;width:auto;filter:brightness(0) invert(1);opacity:.9}
.foot-social span{font-size:12.5px;margin-right:4px;align-self:center}
.foot-social{align-items:center}

/* --- иконките: квадратчето е върху обвивката, не върху SVG-то --- */
.feat-card .fi{
  display:grid;place-items:center;
  width:42px;height:42px;border-radius:var(--r-md);
  background:var(--navy);color:#fff;margin-bottom:14px;flex:0 0 auto;
}
.feat-card .fi svg{width:20px;height:20px;stroke-width:1.75;display:block}
.feat-card svg:not(.fi svg){width:20px;height:20px}

/* Иконките в падащото меню и в останалите места остават малки. */
.nav-drop .fi,.drop .fi,.mega .fi{
  display:grid;place-items:center;
  width:32px;height:32px;border-radius:var(--r);
  background:#000000;color:#8bff0e;flex:0 0 auto;
}
.nav-drop .fi svg,.drop .fi svg,.mega .fi svg{width:16px;height:16px;display:block}

.partner svg,.contact-box svg,.incl-bar li svg,.hero-trust svg,.promise li svg{flex:0 0 auto}

/* --- призивът: текст отляво, бутони отдясно --- */
.cta-band .hero-cta{margin-top:0;flex-wrap:nowrap}
.cta-band .btn{flex:0 0 auto}
.btn-ghost-w{background:none;color:#fff;border-color:rgba(255,255,255,.32)}
.btn-ghost-w:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.55);color:#fff}

@media (max-width:1120px){
  .cta-band .hero-cta{flex-wrap:wrap}
}

/* ==========================================================================
   Начини на плащане — емблема и кога тръгва услугата
   ========================================================================== */
.sub-line{margin:0 0 20px;color:var(--ink-2);font-size:15px}

.pay-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(224px,1fr));gap:12px}

.pay-opt{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  padding:18px;display:flex;flex-direction:column;
  transition:border-color .15s, box-shadow .15s;
}
.pay-opt:hover{border-color:var(--line-2);box-shadow:0 4px 16px rgba(14,39,69,.07)}

.pay-top{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:10px;margin-bottom:12px;
}

/* --- емблемата: разпознава се без четене --- */
.pay-mark{
  height:34px;min-width:52px;padding:0 10px;border-radius:var(--r);flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash-2);
  font:800 12.5px/1 var(--sans);letter-spacing:-.02em;color:var(--navy);
}
.pay-mark.is-card{background:var(--navy);color:#fff}
.pay-mark.is-pp{background:#F0F5FB;color:#1B4C8C}
.pay-mark.is-ep{background:var(--rose-w);color:var(--rose)}

/* --- значка кога тръгва --- */
.when{
  display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;
  font:700 10.5px/1 var(--sans);letter-spacing:.05em;text-transform:uppercase;
  padding:4px 8px;border-radius:3px;white-space:nowrap;
}
.when.now{background:var(--ok-w);color:var(--ok)}
.when.wait{background:var(--warn-w);color:var(--warn)}
.when svg{width:11px;height:11px;stroke-width:2.6;flex:0 0 auto}

.pay-opt b{display:block;font-size:15px;font-weight:700;margin-bottom:5px}
.pay-opt p{margin:0 0 14px;font-size:13px;color:var(--ink-2);line-height:1.5;flex:1}
.pay-foot{
  padding-top:12px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--ink-3);
}

@media (max-width:460px){
  .pay-grid{grid-template-columns:1fr}
}

/* ==========================================================================
   Мега меню — две изравнени колони
   ========================================================================== */
/*
 * Тук се задава само ПОДРЕДБАТА. Дали менюто се вижда се решава на
 * едно място отгоре, с is-open. Ако display стои и тук, скритото
 * меню се показва въпреки скриването — точно това го чупеше.
 */
.mega{
  grid-template-columns:repeat(2,minmax(300px,1fr));
  gap:4px;min-width:640px;padding:10px;
}
.mega-col{min-width:0}
.mega-col>h4{
  font:700 10px/1 var(--sans);letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-3);padding:8px 11px 7px;margin:0;
  border-bottom:1px solid var(--line);margin-bottom:5px;
}
.mega-col>ul{list-style:none;margin:0;padding:0;display:grid;gap:1px}
.mega-col>ul>li{min-width:0}

/* Всяка връзка заема еднаква височина, за да са изравнени двете колони. */
.mega a{
  display:flex;gap:12px;align-items:flex-start;
  padding:10px 11px;border-radius:var(--r);
  color:var(--ink);text-decoration:none;height:100%;
}
.mega a:hover{background:var(--wash);text-decoration:none}
.mega a>span:last-child{min-width:0;display:block}
.mega b{
  display:block;font-size:14.5px;font-weight:700;margin-bottom:2px;letter-spacing:-.015em;
}
.mega a>span:last-child>span{
  display:block;font-size:12.5px;color:var(--ink-2);line-height:1.4;
}
.mega .plan-badge{margin-bottom:5px}

@media (max-width:860px){
  .mega{grid-template-columns:1fr;min-width:0;padding:0;gap:0}
  .mega-col>h4{
    border-bottom:0;padding:12px 14px 4px;margin-bottom:0;
  }
  .mega a{padding:11px 14px}
}

/* --- заглавията на разделите не водят никъде, само отварят менюто --- */
.nav>li>.nav-top{
  display:flex;align-items:center;gap:6px;
  padding:10px 13px;border:0;border-radius:var(--r);background:none;
  font:600 15px/1 var(--sans);color:#ffffff;cursor:default;
}
.nav>li:hover>.nav-top,
.nav>li:focus-within>.nav-top{background:var(--wash);color:var(--ink)}
.nav>li>.nav-top svg{width:11px;height:11px;stroke-width:2.4;opacity:.55;transition:transform .16s;}
.nav>li:hover>.nav-top svg,
.nav>li:focus-within>.nav-top svg{transform:rotate(180deg)}
.nav>li>.nav-top:focus-visible{outline:2px solid var(--rose);outline-offset:-2px}

@media (max-width:860px){
  .nav>li>.nav-top{width:100%;padding:13px 14px;font-size:16px;cursor:pointer}
  .nav>li:hover>.nav-top svg,
  .nav>li:focus-within>.nav-top svg{transform:none}
}

/* --- „Без лимит“ е по-къс от число, затова е по-едър --- */
.plan-sum.is-unlimited b{font-size:1.5rem;letter-spacing:-.035em}

/* --- дълъг списък с характеристики не бива да разкъсва мрежата --- */
.plan-list{max-height:none}
.plan-card{align-self:stretch}
.plan-grid{align-items:stretch}

/* ==========================================================================
   Мост над празнината под менюто
   ========================================================================== */

/*
 * Мостът над празнината отпадна.
 *
 * Беше невидима лента под бутона, която задържаше посочването. Но тя
 * лежеше ВЪРХУ горния ръб на менюто и поглъщаше щраквания. Изчакването
 * от 220 мс в скрипта върши същата работа, без да закрива нищо.
 */
.nav>li.has-drop{position:relative}

/* Самото меню тръгва плътно до моста. */


/*
 * Отварянето остава и докато мишката е ВЪТРЕ в менюто. Без това
 * преминаването от една връзка към друга го затваря.
 */


/* Връзките заемат цялата ширина, за да няма мъртви ивици между тях. */
.nav-drop li,.drop li,.mega li{display:block;width:100%}
.nav-drop a,.drop a,.mega a{width:100%}

@media (max-width:860px){
  .nav-drop,.drop,.mega{top:auto}
}


.nav>li.has-drop.is-open>.nav-top{background:#7cbf00;color:var(--ink)}
.nav>li.has-drop.is-open>.nav-top svg{transform:rotate(180deg)}

/* --- покана за хостинг при поръчка на домейн --- */
.add-host{
  background:var(--wash);border:1px solid var(--line);border-radius:var(--r-md);
  padding:13px 16px;font-size:14.5px;color:var(--ink-2);margin:0 0 20px;
}
.add-host a{font-weight:600}

/* --- домейн, пренесен от предишната стъпка --- */
.dm-kept{
  background:var(--ok-w);border:1px solid #C9E4D8;border-radius:var(--r);
  padding:9px 13px;font-size:13.5px;color:var(--ok);margin:0 0 12px;
}

/* ==========================================================================
   Количка
   ========================================================================== */
.cart-note{
  background:var(--ok-w);border:1px solid #C9E4D8;border-radius:var(--r-md);
  padding:11px 15px;font-size:14px;color:var(--ok);margin-bottom:18px;
}

.cart-lines{
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;
  margin-bottom:16px;background:var(--paper);
}

.cart-line{
  display:grid;grid-template-columns:auto 1fr auto auto;
  gap:14px;align-items:center;padding:16px 18px;
  border-bottom:1px solid var(--line);
}
.cart-line:last-child{border-bottom:0}

.cl-icon{
  width:38px;height:38px;border-radius:var(--r);flex:0 0 auto;
  display:grid;place-items:center;background:var(--navy);color:#fff;
}
.cl-icon svg{width:19px;height:19px}

.cl-body{min-width:0}
.cl-body b{display:block;font-size:15.5px;font-weight:700;letter-spacing:-.015em}
.cl-body>span{display:block;font-size:13px;color:var(--ink-2);margin-top:2px}

.cl-cycle{margin-top:9px}
.cl-cycle .control{
  padding:6px 30px 6px 10px;font-size:13.5px;height:auto;max-width:260px;
}

.cl-price{
  font-family:var(--mono);font-size:16px;font-weight:600;
  white-space:nowrap;letter-spacing:-.02em;
}

/* Кръстчето е бледо, докато не го посочиш — махането не бива да
   изглежда като главното действие на страницата. */
.cl-remove{
  width:30px;height:30px;border:0;background:none;cursor:pointer;
  display:grid;place-items:center;border-radius:var(--r);
  color:var(--ink-3);transition:background .15s,color .15s;
}
.cl-remove:hover{background:var(--rose-w);color:var(--rose)}
.cl-remove svg{width:15px;height:15px}
.cl-act{min-width:30px}

.cart-sum{
  border:1px solid var(--line);border-radius:var(--r-md);
  padding:16px 18px;background:var(--wash);margin-bottom:18px;
}
.cart-go{margin-bottom:10px}
.cart-go .btn{width:100%}

.cyc-select{max-width:340px;margin-bottom:6px}

@media (max-width:560px){
  .cart-line{grid-template-columns:auto 1fr auto;row-gap:8px}
  .cl-icon{grid-row:span 2}
  .cl-price{grid-column:2/4;text-align:right}
}


/* ==========================================================================
   Домейн и срок на един ред
   ========================================================================== */

/*
 * Трите полета се четат като изречение: какво правим, с кое име, за
 * колко време. Затова стоят едно до друго, а не едно под друго.
 */
.dm-row{
  display:grid;
  grid-template-columns:minmax(220px,1fr) minmax(170px,auto);
  gap:12px;align-items:end;margin-bottom:10px;
}

.dm-cell{min-width:0}
.dm-cell label{
  display:block;font-size:13px;font-weight:600;color:var(--ink-2);
  margin-bottom:5px;
}
.dm-cell .control{width:100%}

.dm-name .control{font-family:var(--mono);font-size:15px}

@media (max-width:640px){
  .dm-row{grid-template-columns:1fr;gap:14px}
}

/* ==========================================================================
   Конфигурация на домейна
   ========================================================================== */
.dc-head{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;margin-bottom:26px;
}
.dc-head .dc-cell{background:var(--paper);padding:14px 16px}

.dc-cell .k{
  display:block;font-size:12px;font-weight:600;color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:5px;
}
.dc-cell b{font-size:15.5px;font-weight:700;letter-spacing:-.015em}

/* Липсващият хостинг е покана, не тревога — затова е розово, не червено. */
.dc-add{
  display:inline-block;font-size:14.5px;font-weight:600;color:var(--rose);
}
.dc-add:hover{text-decoration:underline}

.dc-form h2{font-size:1.15rem;margin:0 0 6px}
.dc-note{
  font-size:14px;color:var(--ink-2);line-height:1.6;
  margin:0 0 18px;max-width:72ch;
}

.dc-err{
  background:var(--rose-w);border:1px solid #F0CBD6;border-radius:var(--r-md);
  padding:11px 15px;font-size:14px;color:var(--rose);margin-bottom:16px;
}

.dc-ns{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;margin-bottom:24px;
}
.dc-ns label{
  display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:5px;
}
.dc-ns label em{font-style:normal;font-weight:400;color:var(--ink-3)}
.dc-ns .control{width:100%;font-size:14.5px}

.dc-go{display:inline-flex;align-items:center;gap:9px}
.dc-go svg{width:17px;height:17px}

@media (max-width:520px){
  .dc-ns{grid-template-columns:1fr}
}

/* ==========================================================================
   ПОРЪЧКА — единен вид за целия поток
   ==========================================================================
   Същите токени като витрината: същият ръб, същото розово, същият
   шрифт за числата. Поръчката не бива да изглежда като чужд сайт,
   залепен накрая.
   ========================================================================== */

/* --------------------------------------------------- лента на стъпките */
.steps{
  background:var(--wash);border-bottom:1px solid var(--line);
  padding:16px 0;margin-bottom:6px;
}
.steps ol{
  max-width:1280px;margin-inline:auto;padding-inline:22px;
  display:flex;align-items:center;gap:8px;list-style:none;
  counter-reset:none;flex-wrap:wrap;
}

.st{
  display:flex;align-items:center;gap:9px;
  font-size:13.5px;color:var(--ink-3);flex:0 0 auto;
}

/* Чертичка между стъпките: показва посоката, без да заема място. */
.st + .st::before{
  content:"";width:22px;height:1px;background:var(--line-2);
  margin-right:5px;flex:0 0 auto;
}

.st-n{
  width:24px;height:24px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--wash-2);color:var(--ink-3);
  font:700 12px/1 var(--sans);
}
.st-n svg{width:12px;height:12px}

.st.is-now{color:var(--ink);font-weight:600}
.st.is-now .st-n{background:var(--rose);color:#fff}

.st.is-done{color:var(--ok)}
.st.is-done .st-n{background:var(--ok-w);color:var(--ok)}

@media (max-width:700px){
  /* На тесен екран остава само текущата — останалите са само номера. */
  .st-l{display:none}
  .st.is-now .st-l{display:inline}
  .st + .st::before{width:14px}
}

/* ------------------------------------------------------- обща рамка */
.of-step{
  font-size:1.05rem;font-weight:700;letter-spacing:-.02em;
  margin:26px 0 12px;padding-bottom:9px;
  border-bottom:1px solid var(--line);
}
.of-step:first-of-type{margin-top:0}

/* --------------------------------------------- обобщение над формата */
.dc-head{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;margin-bottom:24px;
}
.dc-head .dc-cell{background:var(--paper);padding:14px 16px}

/* ------------------------------------------------------ редовете в количката */
.cart-line{background:var(--paper)}
.cart-line:hover{background:var(--wash)}

/* ------------------------------------------------------------- сметката */
.cart-sum,.checkout-sum{
  border:1px solid var(--line);border-radius:var(--r-md);
  padding:18px 20px;background:var(--paper);
}
.cs-row{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:16px;padding:7px 0;font-size:14.5px;color:var(--ink-2);
}
.cs-row b{font-family:var(--mono);color:var(--ink);font-weight:600}
.cs-row.is-total{
  border-top:1px solid var(--line);margin-top:8px;padding-top:14px;
  font-size:16px;color:var(--ink);font-weight:600;
}
.cs-row.is-total b{font-size:20px;letter-spacing:-.03em}

/* ------------------------------------------------------------ бутоните */
.cart-go .btn,.dc-go{margin-top:4px}

.link-back{
  display:inline-block;margin-top:14px;font-size:13.5px;color:var(--ink-3);
}
.link-back:hover{color:var(--rose)}

.vat-note{font-size:12.5px;color:var(--ink-3);margin-top:10px}

/* ------------------------------------------------------- страницата за данни */
.checkout-grid{
  display:grid;grid-template-columns:1fr minmax(300px,360px);
  gap:28px;align-items:start;
}
@media (max-width:900px){
  .checkout-grid{grid-template-columns:1fr}
}

/* ==========================================================================
   Поръчка в две колони
   ========================================================================== */
.ord-grid{
  display:grid;grid-template-columns:1fr minmax(290px,340px);
  gap:30px;align-items:start;
}
.ord-main{min-width:0}

/* Обобщението пътува с превъртането — сметката трябва да се вижда
   през цялото време, а не само в началото. */
.ord-aside{position:sticky;top:96px}

.oa-box{
  border:1px solid var(--line);border-radius:var(--r-md);
  background:var(--paper);padding:20px;
}
.oa-box h3{
  font-size:1.02rem;margin:0 0 14px;padding-bottom:11px;
  border-bottom:1px solid var(--line);letter-spacing:-.02em;
}

.oa-empty{font-size:13.5px;color:var(--ink-3);line-height:1.6;margin:0}

.oa-lines{display:grid;gap:1px;margin-bottom:14px}

.oa-line{
  display:grid;grid-template-columns:auto 1fr auto;
  gap:11px;align-items:center;padding:9px 0;
}
.oa-line + .oa-line{border-top:1px solid var(--line)}

.oa-ico{
  width:30px;height:30px;border-radius:var(--r);flex:0 0 auto;
  display:grid;place-items:center;background:var(--navy);color:#fff;
}
.oa-ico svg{width:15px;height:15px}

.oa-body{min-width:0}
.oa-body b{
  display:block;font-size:14px;font-weight:700;letter-spacing:-.015em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.oa-body span{display:block;font-size:12px;color:var(--ink-3);margin-top:1px}

.oa-p{font-family:var(--mono);font-size:14px;font-weight:600;white-space:nowrap}

.oa-sum{border-top:1px solid var(--line);padding-top:10px}
.oa-sum .cs-row{padding:5px 0;font-size:13.5px}
.oa-sum .cs-row.is-total{font-size:15px;padding-top:11px}
.oa-sum .cs-row.is-total b{font-size:18px}

.oa-edit{
  display:block;margin-top:14px;font-size:13px;color:var(--ink-3);
  text-align:center;
}
.oa-edit:hover{color:var(--rose)}

@media (max-width:900px){
  .ord-grid{grid-template-columns:1fr;gap:22px}

  /* Отгоре, за да се види преди формата, а не след нея. */
  .ord-aside{position:static;order:-1}
}

/*
 * Без обобщение решетката се свива в една колона и се стеснява.
 *
 * Инак формата се разлива по цялата ширина и полетата стават дълги
 * колкото екрана, а човек ги чете по-трудно, отколкото ако бяха
 * събрани.
 */
.ord-grid:not(:has(.ord-aside)){
  grid-template-columns:minmax(0,840px);
  justify-content:center;
}

/* ==========================================================================
   Първа стъпка — вид на плана
   ========================================================================== */

/* Ключовите числа под заглавието. Разделени с преградки, за да се
   четат като таблица, а не като изречение. */
.plan-facts{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;margin:18px 0 26px;
}
.pf-item{background:var(--paper);padding:14px 16px}
.pf-item b{
  display:block;font-family:var(--mono);font-size:1.25rem;font-weight:600;
  letter-spacing:-.035em;color:var(--ink);
}
.pf-item span{
  display:block;font-size:12.5px;color:var(--ink-3);margin-top:3px;
}

/* --------------------------------------------------- характеристиките */
.of-feat{margin-top:28px}

.order-feat{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:2px 22px;margin:0;
}
.order-feat li{
  display:flex;gap:9px;align-items:flex-start;
  padding:7px 0;font-size:14.5px;color:var(--ink-2);
  border-bottom:1px solid var(--line);
}
.order-feat li::before{
  content:"";flex:0 0 auto;width:16px;height:16px;margin-top:2px;
  background:var(--ok);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M5 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M5 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* ------------------------------------------------------------- бутонът */
.of-go{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  margin-top:28px;padding-top:22px;border-top:1px solid var(--line);
}
.of-go .btn{flex:0 0 auto}
.of-go .vat-note{margin:0}

@media (max-width:520px){
  .order-feat{grid-template-columns:1fr}
  .of-go .btn{width:100%}
}

/* ==========================================================================
   Поръчков поток по образеца
   ========================================================================== */

/* --- лентата: стъпките заемат равна ширина и си сочат една друга --- */
.steps ol{display:flex;gap:0;padding-inline:22px}
.st{flex:1;justify-content:center;padding:15px 10px;position:relative;gap:9px}
.st + .st::before{
  content:"";position:absolute;left:0;top:50%;width:7px;height:7px;
  border-top:1px solid var(--line-2);border-right:1px solid var(--line-2);
  transform:translateY(-50%) rotate(45deg);margin:0;background:none;
}
.st.is-now{box-shadow:inset 0 -2px 0 var(--rose)}

/* --- карта за секция --- */
.o-card{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-md);padding:24px;margin-bottom:16px;
}
.o-card>h2{margin:0 0 4px;font-size:1.12rem;font-weight:700;letter-spacing:-.025em}
.o-card>p.sub{margin:0 0 18px;font-size:14px;color:var(--ink-2)}

/* --- добавки --- */
.adds{display:grid;gap:10px}
.add{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;
  align-items:center;border:1px solid var(--line);border-radius:var(--r-md);
  padding:15px 17px;margin:0;
}
.add.is-on{border-color:var(--ok);background:var(--ok-w)}
.a-ic{
  width:36px;height:36px;border-radius:var(--r);display:grid;place-items:center;
  background:var(--wash-2);color:var(--navy);flex:0 0 auto;
}
.add.is-on .a-ic{background:var(--ok);color:#fff}
.a-ic svg{width:18px;height:18px}
.a-body{min-width:0}
.a-body b{display:block;font-size:14.5px;font-weight:700}
.a-body>span{display:block;font-size:13px;color:var(--ink-2);margin-top:2px}
.a-pr{font-family:var(--mono);font-size:14px;font-weight:600;white-space:nowrap}
.btn-ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn-ok:hover{background:#0F6A4A;border-color:#0F6A4A;color:#fff}

/* --- промо код --- */
.promo-box{
  display:grid;grid-template-columns:1fr auto;gap:9px;
  background:var(--blue-w);border:1px dashed #B9D3EE;
  border-radius:var(--r-md);padding:15px 17px;margin-bottom:16px;
}
.pb-lab{
  grid-column:1/-1;font-size:13.5px;color:var(--blue);
  font-weight:600;margin-bottom:2px;
}

/* --- начини на плащане в прегледа --- */
.pays{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px}
.pm{
  border:1px solid var(--line);border-radius:var(--r-md);padding:14px;
  cursor:pointer;display:block;position:relative;
}
.pm:has(input:checked){border-color:var(--rose);box-shadow:0 0 0 1px var(--rose) inset}
.pm input{position:absolute;opacity:0;pointer-events:none}
.pm .mk{
  height:32px;border-radius:var(--r);display:grid;place-items:center;
  background:var(--wash-2);font:800 12.5px/1 var(--sans);color:var(--navy);margin-bottom:9px;
}
.pm .mk.is-card{background:var(--navy);color:#fff}
.pm .mk.is-pp{background:#F0F5FB;color:#1B4C8C}
.pm .mk.is-ep{background:var(--rose-w);color:var(--rose)}
.pm b{display:block;font-size:13.5px;font-weight:600}
.pm .when{margin-top:7px}

.terms-check{margin:18px 0 4px}

/* --- отстъпка в обобщението --- */
.cs-row.is-disc span,.cs-row.is-disc b{color:var(--ok)}

@media (max-width:640px){
  .add{grid-template-columns:auto 1fr;row-gap:10px}
  .a-pr,.add .btn{grid-column:2}
  .st-l{display:none}
  .st.is-now .st-l{display:inline}
}

/* ==========================================================================
   Първа стъпка по макета
   ========================================================================== */

/* --- избраният план, тъмна лента --- */
.picked{
  display:grid;grid-template-columns:auto 1fr auto;gap:15px;align-items:center;
  background:var(--navy);color:#fff;border-radius:var(--r-md);
  padding:17px 20px;margin-bottom:16px;
}
.pk-ic{
  width:40px;height:40px;border-radius:var(--r);display:grid;place-items:center;
  background:rgba(255,255,255,.12);flex:0 0 auto;
}
.pk-ic svg{width:20px;height:20px}
.picked b{display:block;font-size:17px;font-weight:700;letter-spacing:-.02em}
.picked>div>span{display:block;font-size:13px;color:rgba(255,255,255,.62);margin-top:2px}
.picked a{color:#fff;font-size:13px;text-decoration:underline;opacity:.82;white-space:nowrap}
.picked a:hover{opacity:1;color:#fff}

/* --- период като плочки --- */
.terms{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.term{
  border:1px solid var(--line);border-radius:var(--r-md);padding:16px 15px;
  cursor:pointer;position:relative;text-align:center;display:block;
}
.term:has(input:checked){border-color:var(--rose);box-shadow:0 0 0 1px var(--rose) inset}
.term input{position:absolute;opacity:0;pointer-events:none}
.t-p{display:block;font:600 1.28rem/1 var(--mono);letter-spacing:-.035em}
.t-u{display:block;font-size:12px;color:var(--ink-3);margin-top:5px}
.t-save{
  display:inline-block;margin-top:10px;font:700 10.5px/1 var(--sans);
  text-transform:uppercase;letter-spacing:.05em;
  background:var(--ok-w);color:var(--ok);padding:4px 8px;border-radius:3px;
}
.t-tag{
  position:absolute;top:-9px;left:50%;transform:translateX(-50%);
  background:var(--rose);color:#fff;font:700 10px/1 var(--sans);
  text-transform:uppercase;letter-spacing:.05em;padding:4px 10px;
  border-radius:3px;white-space:nowrap;
}

/* --- избор какво правим с домейна --- */
.dopt{
  display:flex;gap:10px;align-items:flex-start;padding:13px 0;
  border-bottom:1px solid var(--line);cursor:pointer;
}
.dopt:last-of-type{border-bottom:0;padding-bottom:16px}
.dopt input{position:absolute;opacity:0;pointer-events:none}
.d-radio{
  width:19px;height:19px;border:2px solid var(--line-2);border-radius:50%;
  flex:0 0 auto;margin-top:1px;display:grid;place-items:center;
}
.dopt:has(input:checked) .d-radio{border-color:var(--rose)}
.dopt:has(input:checked) .d-radio::after{
  content:"";width:9px;height:9px;border-radius:50%;background:var(--rose);
}
.dopt b{display:block;font-size:14.5px;font-weight:600}
.dopt>span>span{display:block;font-size:13px;color:var(--ink-2);margin-top:2px}

/* --- резултат от проверката --- */
.d-res{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;
  align-items:center;padding:12px 15px;border-radius:var(--r);margin-top:12px;
}
.d-res.is-free{background:var(--ok-w);border:1px solid #C9E4D8}
.d-res.is-taken{background:var(--rose-w);border:1px solid #F0CBD6}
.d-res.is-warn{background:var(--warn-w);border:1px solid #EDDDB8}
.d-dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
.d-res.is-free .d-dot{background:var(--ok)}
.d-res.is-taken .d-dot{background:var(--rose)}
.d-res.is-warn .d-dot{background:var(--warn)}
.d-res b{font-family:var(--mono);font-size:14.5px;font-weight:600}
.d-pr{font-family:var(--mono);font-size:14px;font-weight:600;white-space:nowrap}
.d-st{font-size:13px;white-space:nowrap}
.d-res.is-free .d-st{color:var(--ok)}
.d-res.is-taken .d-st{color:var(--rose)}
.d-res.is-warn .d-st{color:var(--warn)}

@media (max-width:640px){
  .picked{grid-template-columns:auto 1fr;row-gap:9px}
  .picked a{grid-column:2}
  .d-res{grid-template-columns:auto 1fr;row-gap:6px}
  .d-pr,.d-st{grid-column:2}
}

/* --- същата лента, но като покана за хостинг --- */
.picked.is-empty{
  background:var(--paper);color:var(--ink);
  border:1px solid var(--line);
}
.picked.is-empty .pk-ic{background:var(--wash-2);color:var(--navy)}
.picked.is-empty>div>span{color:var(--ink-2)}
.picked.is-empty a{color:var(--rose);font-weight:600;opacity:1;text-decoration:none}
.picked.is-empty a:hover{text-decoration:underline;color:var(--rose)}

/* ==========================================================================
   Данни за фактура
   ========================================================================== */

/* Раздели вместо отметки: изборът решава кои полета изобщо трябват. */
.co-tabs{
  display:flex;gap:2px;background:var(--wash-2);padding:3px;
  border-radius:var(--r);margin-bottom:20px;width:fit-content;
}
.co-tab{
  padding:8px 18px;border-radius:3px;font-size:14px;font-weight:600;
  color:var(--ink-2);cursor:pointer;position:relative;
}
.co-tab input{position:absolute;opacity:0;pointer-events:none}
.co-tab:has(input:checked){
  background:var(--paper);color:var(--ink);box-shadow:0 1px 3px rgba(14,39,69,.1);
}

.co-two{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}

.co-form .field{margin-bottom:14px}
.co-form label{
  display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:5px;
}
.co-form .control{width:100%}

.co-note{
  font-size:13.5px;color:var(--ink-2);margin:4px 0 0;line-height:1.6;
}

.co-who{
  display:flex;align-items:center;gap:14px;justify-content:space-between;
  background:var(--wash);border-radius:var(--r);padding:14px 16px;
}
.co-who b{display:block;font-size:15px;font-weight:700}
.co-who span{display:block;font-size:13px;color:var(--ink-2);margin-top:1px}

/*
 * Данните на фирмата се скриват, докато не е избрано „Фирма“.
 * Полета, които не трябват, объркват повече от липсващи.
 */
.co-form:has(input[name="type"][value="company"]:checked) .co-company{display:block}
.co-company{display:none}
.co-company.is-on{display:block}

@media (max-width:640px){
  .co-two{grid-template-columns:1fr}
}

/* --- изборите с кръгче: надписът е СРЕЩУ него, не над него --- */
.dopt{
  display:flex!important;flex-direction:row!important;
  align-items:flex-start;gap:11px;
}
.dopt>span:last-child{
  flex:1 1 auto;min-width:0;display:block;
  font-weight:400;color:var(--ink);
}

/* Плочките за период също са със свой строеж. */
.term{display:block!important;flex-direction:initial!important}

/* Разделите физическо лице / фирма — също. */
.co-tab{display:block!important;flex-direction:initial!important}



















































/* ==== domain-search: начало ==== */

/* ══════════════════════════════════════════════════════════
   ПРОВЕРКА НА ДОМЕЙН · значки и процедура
   ══════════════════════════════════════════════════════════ */

/*
 * ЗНАЧКАТА КАЗВА СЪСТОЯНИЕТО с една дума, преди окото да стигне до
 * цената.
 */
.dres-pills{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin-bottom:12px;
}

.dpill{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px;border-radius:99px;
  font:700 11.5px/1 var(--sans);white-space:nowrap;
}
.dpill i{
  width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 auto;
}

.dpill-ok{background:#E7F5EF;color:var(--up)}
.dpill-muted{background:var(--mist);color:var(--steel)}
.dpill-warn{background:#FBF4E4;color:var(--warn)}
.dpill-bad{background:#FDF0EE;color:var(--down)}
.dpill-blue{background:#EAF2FB;color:#1C5FA8}

/* Плътната значка: само за най-евтиния ред. */
.dpill-solid{background:var(--rose);color:#fff}

/*
 * Цената за подновяване стои ПОД тази за първата година.
 *
 * „9 сега, 14 догодина“ е различно от „11 и 11“, а само първото число
 * не го казва.
 */
.dres-renew{
  display:block;font:400 11.5px/1.3 var(--sans);font-style:normal;
  color:var(--steel);margin-top:5px;
}

/* ══════════════════════════════════════════════════════════
   „.bg“ · процедурата
   ══════════════════════════════════════════════════════════ */
/*
 * Казва се ПРЕДВАРИТЕЛНО: четирите стъпки и колко трае всяка.
 *
 * Взаимствано от българските регистратори — при тях това стои в
 * помощните страници, а човек го открива след плащането.
 */
.dproc{
  border-radius:var(--r-lg, 16px);margin-top:14px;overflow:hidden;
  border:1px solid rgba(154,101,18,.22);background:#FBF4E4;
}

.dproc-h{display:flex;gap:13px;align-items:flex-start;padding:16px 18px}

.dproc-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--warn);color:#fff;
}
.dproc-ic svg{width:16px;height:16px}

.dproc-t{flex:1;font-size:13.5px;color:var(--warn);line-height:1.6}
.dproc-t b{display:block;font-weight:700;margin-bottom:4px}

.dproc-steps{
  background:var(--paper);border-top:1px solid rgba(154,101,18,.18);
  padding:18px;
}

.dpstep{
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:start;
  padding:13px 0;border-bottom:1px solid var(--line);
}
.dpstep:first-child{padding-top:0}
.dpstep:last-child{border-bottom:0;padding-bottom:0}

.dpstep-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:#FDF1F4;color:var(--rose);
  font:700 12.5px/1 var(--mono);
}

.dpstep-t{font-size:13.5px;line-height:1.55;color:var(--ink-soft)}
.dpstep-t b{display:block;color:var(--ink);font-weight:700;margin-bottom:3px}

/* Колко трае: то отговаря на въпроса „кога ще работи“. */
.dpstep-w{
  font:600 11px/1 var(--sans);color:var(--steel-lt);
  white-space:nowrap;padding-top:6px;
}

.dproc-warn-wrap{padding:0 18px 18px;background:var(--paper)}

/*
 * НАЙ-ВАЖНОТО: плащането само по себе си не запазва домейна.
 *
 * Клиент, който плати и мисли, че е негов, се обажда ядосан седмица
 * по-късно.
 */
.dproc-warn{
  padding:12px 14px;border-radius:var(--r, 10px);
  background:#FDF0EE;border:1px solid rgba(185,59,51,.2);
  font-size:13px;color:var(--down);line-height:1.55;
}
.dproc-warn b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   Алтернативите
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-ЕВТИНИЯТ носи ръб и плътна значка.
 *
 * Без нея човек чете пет цени и ги сравнява наум.
 */
.sug-list li.is-best{
  border-color:var(--rose);background:#FDF1F4;
}

/* Подновяването под цената, по-дребно. */
.sug-price em{
  display:block;font:400 11px/1.3 var(--sans);font-style:normal;
  color:var(--steel);margin-top:4px;
}

/* ── по екрани ── */
@media (max-width:620px){
  /* Часът минава на свой ред: три колони не се събират. */
  .dpstep{grid-template-columns:auto 1fr}
  .dpstep-w{grid-column:2;padding-top:2px}

  .dproc-h{padding:14px}
  .dproc-steps{padding:14px}
  .dproc-warn-wrap{padding:0 14px 14px}
}


/* ══════════════════════════════════════════════════════════
   РЕЗУЛТАТЪТ · един ред, не четири
   ══════════════════════════════════════════════════════════ */
/*
 * Дотук име, цена и бутон бяха на ОТДЕЛНИ РЕДОВЕ и заемаха половин
 * екран за три думи.
 */
.dres.is-good,
.dres.is-bad,
.dres.is-warn{
  display:block;padding:clamp(18px,2.6vw,24px);
  border-radius:var(--r-lg, 16px);
}

.dres .dres-body{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
}

/*
 * Името НЕ разтяга реда.
 *
 * С „flex:1“ то избутваше цената и бутона чак в другия край — между
 * тях зееше празнота, а окото трябваше да минава разстояние за три
 * думи.
 *
 * Сега трите стоят ЕДНО ДО ДРУГО, а празното остава отдясно.
 */
.dres .dres-name{
  margin:0;min-width:0;
  font:800 clamp(1.15rem,2.5vw,1.5rem)/1.12 var(--mono);
  letter-spacing:-.035em;word-break:break-all;
}

/* Празното е ТУК, след бутона. */
.dres .dres-body::after{content:'';flex:1;order:9}

.dres .dres-price{
  margin:0;flex:0 0 auto;
  font:800 clamp(1.25rem,2.6vw,1.5rem)/1 var(--mono);letter-spacing:-.035em;
  padding-left:6px;
}
.dres .dres-price span{
  font:400 11.5px/1 var(--sans);color:var(--steel);margin-left:4px;
}

/* Бутонът е ПОСЛЕДЕН и се долепя вдясно. */
.dres .btn{flex:0 0 auto;order:10;margin-left:auto}

/*
 * МИГАЩА ТОЧКА · само където нещо СЕ СЛУЧВА.
 *
 * Мигане навсякъде значи мигане никъде: окото свиква и спира да го
 * вижда.
 */
.dpill-live i{animation:dblink 1.6s ease-in-out infinite}

@keyframes dblink{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.35;transform:scale(.82)}
}

/* Дишащ ръб при най-евтиния; спира при посочване, за да не пречи. */
.dpill-solid.dpill-pulse{position:relative}
.dpill-solid.dpill-pulse::after{
  content:'';position:absolute;inset:-3px;border-radius:99px;
  border:2px solid currentColor;opacity:0;
  animation:dring 2.4s ease-out infinite;
}
.dpill-solid.dpill-pulse:hover::after{animation:none}

@keyframes dring{
  0%{opacity:.5;transform:scale(.94)}
  70%{opacity:0;transform:scale(1.12)}
  100%{opacity:0}
}

/* ══════════════════════════════════════════════════════════
   Стъпките · четири колонки
   ══════════════════════════════════════════════════════════ */
/*
 * Четири РЕДА правят стена от текст; четири КОЛОНКИ се четат наведнъж.
 */
.dproc-steps{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}

.dpstep{
  display:block;position:relative;padding:0 0 0 34px;border:0;
}

.dpstep-n{position:absolute;left:0;top:0}

.dpstep-t{display:block;font-size:12.5px}
.dpstep-t b{display:block;font:700 13px/1.35 var(--sans);margin-bottom:4px}

.dpstep-w{
  display:inline-block;margin-top:7px;padding:3px 8px;border-radius:99px;
  background:var(--wash, #F5F7FA);
  font:700 10.5px/1 var(--sans);color:var(--steel-lt);
}

/* ══════════════════════════════════════════════════════════
   Вместо таблицата
   ══════════════════════════════════════════════════════════ */
.dsec-head{max-width:640px;margin:0 0 clamp(24px,3.5vw,36px)}
.dsec-head h2{margin:0 0 12px}
.dsec-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ── четирите предимства ── */
.dwhy{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.dwhy-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.dwhy-ic{
  width:40px;height:40px;border-radius:12px;margin-bottom:14px;
  display:grid;place-items:center;
  background:#FDF1F4;color:var(--rose);
}
.dwhy-ic svg{width:19px;height:19px}

.dwhy-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:6px}
.dwhy-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ── въпросите ── */
/*
 * ЗА ТЪРСАЧКИТЕ: те хващат питания като „колко струва .bg домейн“ и
 * излизат разгънати в резултатите.
 *
 * Числото в началото се вижда ПРЕДИ текста.
 */
.dfaq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.dfaq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

.dfaq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);
  font:700 12px/1 var(--mono);
}

.dfaq-i h3{font:700 15.5px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.dfaq-i p{margin:0;font-size:14px;color:var(--ink-soft);line-height:1.65}
.dfaq-i b{color:var(--ink);font-weight:700}

/* ── по екрани ── */
@media (max-width:1000px){
  .dproc-steps{grid-template-columns:1fr 1fr}
  .dwhy{grid-template-columns:1fr 1fr}
  .dfaq{grid-template-columns:1fr}
}

@media (max-width:620px){
  .dproc-steps{grid-template-columns:1fr}
  .dwhy{grid-template-columns:1fr}

  /* Цената и бутонът заемат цял ред: заедно с името не се събират. */
  .dres .dres-price{min-width:100%;text-align:left}
  .dres .btn{width:100%}
}


/* ══════════════════════════════════════════════════════════
   ГЛАВАТА · тъмна, с плочките отдясно
   ══════════════════════════════════════════════════════════ */
.dsearch{
  background:var(--navy, #0E2745);color:#fff;
  padding:clamp(36px,6vw,64px) 0 clamp(34px,5vw,56px);
}

/*
 * Двете колони: полето отляво, плочките отдясно.
 *
 * Едно под друго, плочките изглеждат като списък с цени, а полето се
 * губи най-горе.
 */
.dsearch > .wrap-w{
  display:grid;grid-template-columns:1.25fr 1fr;
  gap:clamp(24px,4vw,48px);align-items:start;
}

.dsearch h1,
.dsearch h2{
  font:800 clamp(1.9rem,4vw,2.7rem)/1.08 var(--sans);
  letter-spacing:-.035em;margin:0 0 12px;color:#343434;
}

.dsearch > .wrap-w > div > p{
  color:rgb(6 6 6 / 72%);font-size:clamp(14.5px,1.7vw,16px);
  margin:0 0 22px;max-width:480px;line-height:1.6;
}

/* ── полето ── */
.dsearch-form{
  display:flex;gap:9px;flex-wrap:wrap;
  padding:6px;border-radius:var(--r-lg, 16px);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);
}

.dsearch-form input{
  flex:1;min-width:190px;
  padding:14px 17px;border:0;border-radius:var(--r, 10px);
  background:#fff;color:var(--ink, #0E2745);
  font:600 clamp(15.5px,1.9vw,17px)/1.3 var(--sans);letter-spacing:-.01em;
}
.dsearch-form input:focus{outline:2px solid var(--rose);outline-offset:1px}
.dsearch-form input::placeholder{color:var(--steel-lt);font-weight:400}

.dsearch-form .btn{padding:14px 28px;font-size:15.5px;flex:0 0 auto}

/*
 * ТРИ ОБЕЩАНИЯ вместо изречение.
 *
 * Те отговарят на въпросите, преди да са зададени.
 */
.dsearch-notes{
  display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;
  font-size:13px;color:rgb(0 0 0);
}
.dsearch-notes span{display:inline-flex;align-items:center;gap:7px}

.dsearch-notes i{
  width:15px;height:15px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:#61b511;color:#ffffff;
}
.dsearch-notes svg{width:9px;height:9px}

/* ── плочките ── */
.tld-chips{display:grid;grid-template-columns:1fr 1fr;gap:9px}

.tld-chip{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 15px;border-radius:var(--r, 10px);text-decoration:none;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  transition:background .15s,border-color .15s;
}
.tld-chip:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.26)}

/* „.bg“ е с розов ръб: той е причината повечето хора да са тук. */
.tld-chip.is-hot{background:rgba(192,51,92,.16);border-color:rgba(192,51,92,.55)}

.tld-chip b{font:700 14px/1 var(--mono);color:#fff;letter-spacing:-.02em}

.tld-chip .p{text-align:right;white-space:nowrap}
.tld-chip .p s{
  display:block;font:400 11px/1 var(--mono);
  color:rgba(255,255,255,.42);text-decoration:line-through;margin-bottom:4px;
}
.tld-chip .p em{font:700 13.5px/1 var(--mono);font-style:normal;color:#61b511;}

/* Всички останали: зад една връзка, не под плочките. */
.tld-chip-more{
  grid-column:1 / -1;
  padding:11px;border-radius:var(--r, 10px);text-align:center;text-decoration:none;
  border:1px dashed rgba(255,255,255,.13);
  font:600 12.5px/1 var(--sans);color:rgba(255,255,255,.62);
}
.tld-chip-more:hover{border-color:rgba(255,255,255,.3);color:#101010;}

@media (max-width:1000px){
  .dsearch > .wrap-w{grid-template-columns:1fr}
}

@media (max-width:620px){
  .tld-chips{grid-template-columns:1fr}
  .dsearch-form .btn{width:100%}
}


/* ══════════════════════════════════════════════════════════
   Списъкът с алтернативи · целият
   ══════════════════════════════════════════════════════════ */
/*
 * ПРОПУСНАТО ПЪРВИЯ ПЪТ.
 *
 * Писах само правилото за най-евтиния ред, а самата решетка беше в
 * „site.css“ — файл, който страницата НЕ ЧЕТЕ. Затова редовете се
 * разпадаха: име, цена и бутон падаха един под друг.
 */
.sug-title{
  font:700 1.1rem/1.3 var(--sans);letter-spacing:-.02em;
  margin:28px 0 14px;color:var(--ink, #0E2745);
}

.sug-list{
  list-style:none;padding:0;margin:0;
  display:grid;gap:8px;
}

.sug-list li{
  display:grid;grid-template-columns:1fr auto auto auto;
  gap:16px;align-items:center;
  padding:14px 18px;border-radius:var(--r, 10px);
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  transition:border-color .15s,box-shadow .15s;
}
.sug-list li:hover{
  border-color:var(--steel-lt, #7385A0);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Най-евтиният носи ръб: без него човек сравнява пет цени наум. */
.sug-list li.is-best{border-color:var(--rose, #C0335C);background:#FDF1F4}

.sug-name{
  font:500 15.5px/1 var(--mono);letter-spacing:-.02em;
  word-break:break-all;min-width:0;color:var(--ink, #0E2745);
}

.sug-price{
  font:700 15.5px/1 var(--mono);letter-spacing:-.02em;
  white-space:nowrap;text-align:right;color:var(--ink, #0E2745);
}

/* Подновяването под цената, по-дребно. */
.sug-price em{
  display:block;font:400 11px/1.3 var(--sans);font-style:normal;
  color:var(--steel, #56677F);margin-top:5px;
}

/* ══════════════════════════════════════════════════════════
   Зает домейн · трите пътя
   ══════════════════════════════════════════════════════════ */
.dcard{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 16px);padding:clamp(18px,2.6vw,24px);
  margin-top:14px;
}

.dcard h2{
  font:700 1.05rem/1.3 var(--sans);letter-spacing:-.02em;
  margin:0 0 16px;color:var(--ink, #0E2745);
}

.dsteps{display:grid;gap:13px}

/*
 * Номерът е ОТСТРАНИ, не слепен за текста.
 *
 * Без решетка той се лепи за първата дума: „1Вземи го в друго
 * разширение“.
 */
.dstep{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  font-size:14px;line-height:1.55;color:var(--ink-soft, #3A4A63);
}

.dstep-n{
  width:25px;height:25px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;
  background:#FDF1F4;color:var(--rose, #C0335C);
  font:700 12px/1 var(--mono);
}

.dstep b{color:var(--ink, #0E2745);font-weight:700}

/* Съобщението при мълчащ регистър. */
.dres-msg{
  flex:1;min-width:200px;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft, #3A4A63);
}

@media (max-width:620px){
  /* Редът се разпада на две: име и значка горе, цена и бутон долу. */
  .sug-list li{grid-template-columns:1fr auto;gap:12px}
  .sug-list li .btn{grid-column:1 / -1;text-align:center;justify-content:center}
}


/* ══════════════════════════════════════════════════════════
   КОЛИЧКАТА · лентата долу
   ══════════════════════════════════════════════════════════ */
/*
 * ЗАЛЕПЕНА ДОЛУ: човек, който търси пет имена, не бива да превърта
 * нагоре, за да види какво е избрал.
 */
.cartbar{
  position:sticky;bottom:0;z-index:30;
  padding:0 0 16px;pointer-events:none;
}

.cartbar-in{
  max-width:1180px;margin:0 auto;
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding:16px 22px;border-radius:var(--r-lg, 16px);
  background:var(--navy, #0E2745);color:#fff;
  box-shadow:0 10px 32px rgba(14,39,69,.32);
  pointer-events:auto;
}

.cartbar-t{flex:1;min-width:180px;font-size:13px;color:rgba(255,255,255,.66)}
.cartbar-t b{display:block;color:#fff;font-weight:700;font-size:14px;margin-bottom:3px}

.cartbar-sum{
  font:800 1.3rem/1 var(--mono);letter-spacing:-.03em;
  flex:0 0 auto;text-align:right;
}

/* Следващата година: показва се само когато е различна. */
.cartbar-sum em{
  display:block;font:400 11px/1 var(--sans);font-style:normal;
  color:rgba(255,255,255,.55);margin-top:6px;
}

.cartbar .btn-ghost{
  background:transparent;border-color:rgba(255,255,255,.24);color:#fff;
}
.cartbar .btn-ghost:hover{
  background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.4);
}

/* Формата за добавяне не разтяга реда. */
.cart-add{display:contents}

/* Вече вътре: казва го, вместо да мълчи при втори натиск. */
.btn.is-in{gap:6px;color:var(--ok, #127A55);border-color:rgba(18,122,85,.3)}
.btn.is-in svg{width:13px;height:13px}
.btn.is-in:hover{background:#E7F5EF}

/* ══════════════════════════════════════════════════════════
   Стъпките · връзки назад
   ══════════════════════════════════════════════════════════ */
/*
 * Минатите стъпки са ВРЪЗКИ: човек, който е сгрешил плана, не бива да
 * започва отначало.
 *
 * Напред остава заключено — стъпка, до която още не се е стигнало, няма
 * какво да покаже.
 */
.st-back{
  display:inherit;align-items:inherit;gap:inherit;
  color:inherit;text-decoration:none;
}
.st-back:hover .st-l{color:var(--rose, #C0335C);text-decoration:underline}
.st-back:hover .st-n{border-color:var(--rose, #C0335C)}

/* Показалецът казва, че се щрака — иначе изглежда като картинка. */
.st.is-done .st-back{cursor:pointer}

@media (max-width:620px){
  .cartbar{padding:0 12px 12px}
  .cartbar-in{flex-direction:column;align-items:stretch;padding:14px 16px}
  .cartbar-sum{text-align:left}
  .cartbar .btn{width:100%}
}


/* ══════════════════════════════════════════════════════════
   Количката · списъкът в страницата
   ══════════════════════════════════════════════════════════ */
.cart-box{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 16px);padding:20px 22px;margin-bottom:18px;
}

.cart-box-h{
  display:flex;align-items:center;gap:12px;
  margin-bottom:14px;
}
.cart-box-h h2{
  flex:1;margin:0;font:700 1.05rem/1.3 var(--sans);letter-spacing:-.02em;
}

/* „Изпразни“ е дребно: то не бива да се натиска по погрешка. */
.cart-clear{
  border:0;background:0;cursor:pointer;padding:4px 8px;
  font:600 12px/1 var(--sans);color:var(--steel-lt, #7385A0);
}
.cart-clear:hover{color:var(--bad, #B0342C);text-decoration:underline}

.cart-list{list-style:none;padding:0;margin:0;display:grid}

.cart-list li{
  display:grid;grid-template-columns:1fr auto auto;
  gap:16px;align-items:center;
  padding:13px 0;border-bottom:1px solid var(--line, #DFE5EC);
}
.cart-list li:last-child{border-bottom:0}

.cart-n{
  font:600 15px/1 var(--mono);letter-spacing:-.02em;
  word-break:break-all;min-width:0;
}

.cart-p{
  font:700 15px/1 var(--mono);letter-spacing:-.02em;
  white-space:nowrap;text-align:right;
}
.cart-p em{
  display:block;font:400 11px/1.3 var(--sans);font-style:normal;
  color:var(--steel, #56677F);margin-top:5px;
}

.cart-rm{display:flex}
.cart-rm button{
  width:30px;height:30px;border-radius:8px;cursor:pointer;
  display:grid;place-items:center;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  color:var(--steel-lt, #7385A0);
}
.cart-rm button:hover{
  border-color:var(--bad, #B0342C);color:var(--bad, #B0342C);background:#FDF0EE;
}
.cart-rm svg{width:14px;height:14px}

.cart-sum{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  margin-top:16px;padding-top:16px;border-top:2px solid var(--ink, #0E2745);
  font-size:14px;
}
.cart-sum b{font:800 1.25rem/1 var(--mono);letter-spacing:-.03em}

.cart-note{
  margin:10px 0 0;font-size:12.5px;color:var(--steel, #56677F);
}

/* „.bg“ иска заявка: казва се ТУК, преди плащането. */
.cart-warn{
  margin:14px 0 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:13px;color:var(--warn, #9A6A12);line-height:1.55;
}
.cart-warn b{font-weight:700}

.cart-go{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}

@media (max-width:620px){
  .cart-list li{grid-template-columns:1fr auto}
  .cart-rm{grid-column:2}
  .cart-go .btn{flex:1}
}


/* ══════════════════════════════════════════════════════════
   Количката в шапката
   ══════════════════════════════════════════════════════════ */
/*
 * ПОКАЗВА СЕ САМО КОГАТО ИМА НЕЩО ВЪТРЕ.
 *
 * Празна иконка е шум, който окото се научава да пропуска — и после не
 * я вижда и когато има какво.
 */
.nav-cart{
  position:relative;flex:0 0 auto;
  width:38px;height:38px;border-radius:var(--r, 10px);
  display:grid;place-items:center;
  background:#7cbf00;
  color:var(--ink, #0E2745);text-decoration:none;
  transition:border-color .15s,background .15s;
}
.nav-cart:hover{border-color:var(--rose, #C0335C);background:#FDF1F4}
.nav-cart svg{width:18px;height:18px}

/* Числото е ВЪРХУ иконката: до нея то се чете като цена. */
.nav-cart b{
  position:absolute;top:-6px;right:-6px;
  min-width:19px;height:19px;padding:0 5px;border-radius:99px;
  display:grid;place-items:center;
  background:var(--rose, #C0335C);color:#fff;
  font:700 11px/1 var(--mono);
}

/* ══════════════════════════════════════════════════════════
   Предложение за хостинг
   ══════════════════════════════════════════════════════════ */
/*
 * В САМАТА СТЪПКА, не бутон накрая.
 *
 * Досега водеше към плановете — това изхвърля човека от поръчката и той
 * се връща рядко.
 */
.hoffer{
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  padding:20px 22px;border-radius:var(--r-lg, 16px);margin:18px 0;
  background:#EAF2FB;border:1px solid rgba(28,95,168,.22);
}

.hoffer-t{flex:1;min-width:220px}
.hoffer-t b{
  display:block;font:700 15px/1.3 var(--sans);margin-bottom:5px;
  color:var(--blue, #1C5FA8);
}
.hoffer-t p{
  margin:0;font-size:13.5px;line-height:1.55;color:var(--ink-soft, #3A4A63);
}

.hoffer-p{
  text-align:right;flex:0 0 auto;
  padding-right:20px;border-right:1px solid rgba(28,95,168,.2);
}
.hoffer-name{
  display:block;font:600 12.5px/1 var(--sans);
  color:var(--steel, #56677F);margin-bottom:7px;
}
.hoffer-price{
  display:block;font:800 1.3rem/1 var(--mono);letter-spacing:-.03em;
  color:var(--ink, #0E2745);
}
.hoffer-price em{
  display:block;font:400 11px/1 var(--sans);font-style:normal;
  color:var(--steel, #56677F);margin-top:5px;
}

.hoffer-go{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;flex:0 0 auto;
}

/*
 * „Продължи без“ Е ВИДИМО, не скрито.
 *
 * Скрито, човек се чуди дали изобщо може да мине без хостинг — и се
 * отказва от целия ред.
 */
.hoffer-skip{
  font:600 13px/1 var(--sans);color:var(--steel, #56677F);
  text-decoration:underline;text-underline-offset:3px;
}
.hoffer-skip:hover{color:var(--ink, #0E2745)}

@media (max-width:720px){
  .hoffer-p{
    padding-right:0;border-right:0;text-align:left;
    padding-bottom:14px;border-bottom:1px solid rgba(28,95,168,.2);
    min-width:100%;
  }
  .hoffer-go{min-width:100%;justify-content:space-between}
}


/* ══════════════════════════════════════════════════════════
   Показалецът · „Домейни“
   ══════════════════════════════════════════════════════════ */
/*
 * ВРЪЗКА, НЕ БУТОН.
 *
 * „.nav-top“ е правено за бутон на падащо меню — то не носи показалец,
 * защото при бутон браузърът не го слага сам.
 *
 * Сега „Домейни“ е връзка и трябва да се държи като „Блог“ и
 * „Контакти“: ръчичка, за да личи, че се щрака.
 */
/*
 * ТЕЖЕСТТА ТРЯБВА ДА НАДДЕЛЕЕ.
 *
 * Съществуващото правило е „.nav>li>.nav-top“ — три части. Моето
 * „a.nav-top“ е две и губи, каквото и да пише в него.
 *
 * Затова тук е със същия път.
 */
.nav>li>a.nav-top{cursor:pointer}

/*
 * Стрелката се маха при връзка.
 *
 * Тя обещава падащо меню, каквото вече няма — а обещание, което не се
 * изпълнява, дразни повече от липсата му.
 */
.nav>li>a.nav-top svg{display:none}

/* ── количката: винаги видима ── */
/*
 * Празната е по-блед: тя стои, но не вика.
 *
 * Скрита, изчезва точно когато човек я търси — за да провери дали
 * изобщо е добавил нещо.
 */
.nav-cart{color:#000000;}
.nav-cart.has-items{color:var(--ink, #0E2745);border-color:var(--rose, #C0335C)}


/* ══════════════════════════════════════════════════════════
   МЕНЮТО · чекмедже отдясно
   ══════════════════════════════════════════════════════════ */
/*
 * ОТДЯСНО, НЕ ОТГОРЕ.
 *
 * Падащото отгоре бута страницата и се затваря при най-лекото
 * превъртане. Чекмеджето стои, докато не го затвориш — и палецът стига
 * до него, защото телефонът се държи с дясната ръка.
 */
@media (max-width:860px){
  .nav{
    position:fixed;top:0;right:0;bottom:0;left:auto;
    width:min(86vw, 340px);
    display:flex;flex-direction:column;gap:0;
    background:var(--paper);
    border-bottom:0;border-left:1px solid var(--line);
    box-shadow:-8px 0 32px rgba(14,39,69,.18);
    padding:70px 12px 24px;
    max-height:none;height:100dvh;overflow-y:auto;
    z-index:60;

    /* Извън екрана, докато не се отвори. */
    transform:translateX(100%);
    transition:transform .24s ease;
  }

  .nav.is-open{display:flex;transform:translateX(0)}

  /*
   * Затъмнение отзад.
   *
   * Без него менюто виси върху страницата и окото не знае кое е отпред.
   */
  .nav::before{content:none}

  .nav-veil{
    position:fixed;inset:0;z-index:55;
    background:rgba(14,39,69,.45);
    opacity:0;pointer-events:none;transition:opacity .24s;
  }
  .nav-veil.is-open{opacity:1;pointer-events:auto}

  /* Бутонът остава ОТГОРЕ, върху менюто: с него се затваря. */
  .nav-toggle{
    position:relative;z-index:70;
    width:42px;height:42px;
  }

  .nav.is-open ~ .nav-toggle,
  .nav-toggle[aria-expanded="true"]{
    color:var(--rose);
  }

  .nav>li>a,
  .nav>li>.nav-top{
    width:100%;padding:14px;font-size:16px;
    justify-content:space-between;
  }

  /* Подменютата са затворени по подразбиране. */
  .nav-drop,
  .mega{display:none}

  .nav-drop.is-open{display:block}
  .mega.is-open{display:grid}

  /* Стрелката се обръща: тя казва накъде води. */
  .nav>li>.nav-top svg{transition:transform .18s}
  .nav>li>.nav-top[aria-expanded="true"] svg{transform:rotate(180deg)}

  .nav-drop li a,
  .mega li a{padding:11px 14px}

  /* Страницата отдолу не се превърта. */
  body.nav-locked{overflow:hidden}

  /*
   * Количката остава ВИДИМА до бутона за меню.
   *
   * Скрита вътре, тя иска две натискания за нещо, което се гледа
   * най-често.
   */
  .nav-cart{order:-1}

  .site-header .wrap-w{gap:10px}
}

/*
 * ПОД 460: най-тесните телефони.
 */
@media (max-width:460px){
  .site-header .wrap-w{gap:8px}

  .brand img{width:118px;height:auto}

  /* Бутоните се смаляват, но остават четими. */
  .nav-actions .btn{padding:9px 13px;font-size:12.5px}

  /* Лентата с количката: числото под сумата, не до нея. */
  .cartbar-in{padding:12px 14px;gap:12px}
  .cartbar-t{font-size:12px}
  .cartbar-sum{font-size:1.15rem}

  /* Резултатът: името цял ред, за да не се реже. */
  .dres-name{min-width:100%}
  .dres-price{min-width:100%}
  .dres .btn{width:100%}

  /* Стъпките: само числата, без надписи — те не се събират. */
  .steps .st-l{display:none}
  .steps ol{gap:6px}

  /* Предложението за хостинг: всичко отвесно. */
  .hoffer{padding:16px;gap:14px}
  .hoffer-go{flex-direction:column;align-items:stretch}
  .hoffer-go .btn{width:100%}
  .hoffer-skip{text-align:center}
}

/*
 * ПОД 380: най-малките, които още се ползват.
 *
 * Тук вече се жертва украса, не съдържание.
 */
@media (max-width:380px){
  .dpill{padding:4px 9px;font-size:10.5px}
  .dres-pills{gap:6px}

  .cart-list li{gap:10px}
  .cart-n{font-size:13.5px}

  .tld-chip{padding:11px 13px}
  .tld-chip b{font-size:13px}
}


/* ══════════════════════════════════════════════════════════
   МЕНЮТО ВДЯСНО · на широк екран
   ══════════════════════════════════════════════════════════ */
/*
 * Досега менюто беше залепено ЗА ЛОГОТО, а вдясно зееше празно.
 *
 * Сега то се долепя до бутоните: окото минава от логото направо към
 * действията, а не през списък по средата.
 */
@media (min-width:861px){
  .site-header .wrap-w{
    display:flex;align-items:center;gap:clamp(16px, 2.5vw, 32px);
  }

  /*
   * ПРАЗНОТО СЕ МЕСТИ СЛЕД ЛОГОТО.
   *
   * Сега „.nav-actions“ има „margin-left:auto“ — то бута само бутоните
   * вдясно, а менюто остава залепено за логото.
   *
   * Тук празното отива веднага след логото: тогава и менюто, и
   * бутоните се долепят вдясно, един до друг.
   */
  .site-header .wrap-w > .brand{flex:0 0 auto;margin-right:auto}

  .site-header .wrap-w > .nav{flex:0 0 auto}

  /* „auto“ отпада: празното вече е при логото. */
  .site-header .wrap-w > .nav-actions{flex:0 0 auto;margin-left:0}
}


/* ══════════════════════════════════════════════════════════
   ВТОРА СТЪПКА · настройка на домейните
   ══════════════════════════════════════════════════════════ */
/*
 * ВСЕКИ ДОМЕЙН Е ОТДЕЛНА КУТИЯ.
 *
 * Настройките са различни за всеки, а обща форма кара човек да мисли,
 * че важат за всички.
 */
.dcfg{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 16px);padding:18px 20px;margin-bottom:12px;
}

.dcfg-h{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding-bottom:14px;margin-bottom:4px;
  border-bottom:1px solid var(--line, #DFE5EC);
}
.dcfg-h b{font:700 16px/1 var(--mono);letter-spacing:-.02em}

.dcfg-p{
  margin-left:auto;font:800 16px/1 var(--mono);letter-spacing:-.03em;
}

.dcfg-row{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:13px 0;border-bottom:1px solid var(--line, #DFE5EC);
}
.dcfg-row:last-child{border-bottom:0;padding-bottom:0}

.dcfg-l{flex:1;min-width:200px;font:600 14px/1.3 var(--sans)}
.dcfg-l span{
  display:block;font:400 12px/1.5 var(--sans);
  color:var(--steel, #56677F);margin-top:4px;
}

/* ── години ── */
.dcfg-years{display:flex;gap:6px;flex:0 0 auto}
.dcfg-y{display:contents}

.dcfg-yb{
  width:38px;height:38px;border-radius:9px;cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:700 14px/1 var(--mono);color:var(--ink, #0E2745);
}
.dcfg-yb:hover{border-color:var(--steel-lt, #7385A0)}
.dcfg-yb.is-on{
  background:var(--rose, #C0335C);border-color:var(--rose, #C0335C);color:#fff;
}

/* ── плъзгач ── */
.dcfg-t{display:flex;flex:0 0 auto}

.tgl{
  width:44px;height:25px;border-radius:99px;cursor:pointer;padding:0;
  border:0;background:var(--line, #DFE5EC);position:relative;
  transition:background .18s;
}
.tgl i{
  position:absolute;top:3px;left:3px;
  width:19px;height:19px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(14,39,69,.28);transition:transform .18s;
}
.tgl.is-on{background:var(--ok, #127A55)}
.tgl.is-on i{transform:translateX(19px)}

/* ══════════════════════════════════════════════════════════
   Потвържденията
   ══════════════════════════════════════════════════════════ */
/*
 * НЕЗАДАДЕНОТО НЕ Е „НЕ“.
 *
 * Обикновен плъзгач не става: изключен, той изглежда като отговорен с
 * „не“, а човек просто не го е пипал.
 *
 * Затова са два бутона и трето състояние — незададено, с жълт ръб.
 */
.dcfg-ask{border-color:rgba(28,95,168,.24);background:#EAF2FB}

.dcfg-intro{
  margin:12px 0 16px;font-size:13.5px;line-height:1.6;
  color:var(--ink-soft, #3A4A63);
}

.dcfg-ask-i{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r, 10px);padding:16px 18px;margin-bottom:10px;
}
.dcfg-ask-i:last-child{margin-bottom:0}

/* Незададеното е с жълт ръб: то спира продължаването. */
.dcfg-ask-i.is-unset{border-left:3px solid var(--warn, #9A6A12)}

.dcfg-ask-q{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.dcfg-ask-q b{font:700 14px/1 var(--mono);color:var(--rose, #C0335C)}
.dcfg-ask-q span{flex:1;min-width:200px;font:600 14px/1.4 var(--sans)}

.dcfg-ask-b{display:flex;gap:8px}
.dcfg-ask-b form{display:contents}

.dcfg-ask-btn{
  min-width:74px;padding:9px 16px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:700 13.5px/1 var(--sans);color:var(--ink-soft, #3A4A63);
}
.dcfg-ask-btn:hover{border-color:var(--steel-lt, #7385A0)}

.dcfg-ask-btn.is-yes{
  background:var(--ok, #127A55);border-color:var(--ok, #127A55);color:#fff;
}
.dcfg-ask-btn.is-no{
  background:var(--steel, #56677F);border-color:var(--steel, #56677F);color:#fff;
}

/*
 * Обяснителният ред се МЕНИ според отговора.
 *
 * „Какво следва“ е по-полезно от повторение на въпроса.
 */
.dcfg-ask-n{
  margin:12px 0 0;font-size:12.5px;line-height:1.6;
  color:var(--steel, #56677F);
}
.dcfg-ask-n b{color:var(--ink, #0E2745);font-weight:700}

.dcfg-ask-n.is-ok{color:var(--ok, #127A55)}
.dcfg-ask-n.is-ok b{color:var(--ok, #127A55)}

.dcfg-ask-n.is-warn{color:var(--bad, #B0342C)}
.dcfg-ask-n.is-warn b{color:var(--bad, #B0342C)}

/* ── заключеният бутон ── */
/*
 * ИЗГЛЕЖДА КАТО БУТОН, но не води никъде.
 *
 * Скрит, човек търси къде е „напред“. Блед и неподвижен, той казва
 * „има още нещо“.
 */
.btn.is-locked{
  opacity:.45;cursor:not-allowed;pointer-events:none;
}

.cart-locked-why{
  margin:12px 0 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:13px;color:var(--warn, #9A6A12);line-height:1.55;
}
.cart-locked-why b{font-weight:700}

@media (max-width:620px){
  .dcfg-row{gap:12px}
  .dcfg-l{min-width:100%}
  .dcfg-years{width:100%;justify-content:space-between}
  .dcfg-yb{flex:1}
  .dcfg-ask-b form,
  .dcfg-ask-b{width:100%}
  .dcfg-ask-btn{flex:1}
}


/* ══════════════════════════════════════════════════════════
   ПЛАЩАНЕ · всички методи на ЕДИН ред
   ══════════════════════════════════════════════════════════ */
/*
 * ПЛОЧКИ ЕДНА ДО ДРУГА, не списък отгоре надолу.
 *
 * Пет метода в стълб заемат половин екран за нещо, което се избира с
 * едно щракане. Наредени в ред, се виждат наведнъж.
 */
.pays{
  display:flex;gap:8px;flex-wrap:wrap;
}

.pm{
  flex:1 1 0;min-width:96px;
  display:flex;flex-direction:column;align-items:center;gap:7px;
  padding:12px 8px;border-radius:var(--r, 9px);cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  text-align:center;transition:border-color .15s, background .15s;
}
/*
 * ТЕЖЕСТТА ТРЯБВА ДА НАДДЕЛЕЕ.
 *
 * „.pm“ вече съществува в сайта — с „:has(input:checked)“, което е
 * по-силно от голото „:hover“. Моето правило стоеше и мълчеше.
 *
 * Затова тук е през „.pays“: с родителя става по-специфично.
 */
.pays .pm:hover{border-color:var(--steel-lt, #7385A0)}

.pays .pm:has(input:checked){
  border-color:var(--rose, #C0335C);background:#FDF1F4;
  box-shadow:0 0 0 1px var(--rose, #C0335C) inset;
}

/* Кръгчето е скрито: избраната плочка се вижда по ръба. */
.pm input{position:absolute;opacity:0;width:0;height:0}

.pm-marks{display:flex;align-items:center;gap:4px;flex:0 0 auto}
.pm-marks svg{height:20px;width:auto;display:block}

.pm > b{
  font:600 12px/1.25 var(--sans);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
}

/*
 * Кога тръгва: ЕДИНСТВЕНОТО, което човек пита за метод.
 *
 * Зелено при веднага, сиво при чакане — цветът казва отговора преди
 * думите.
 */
.pm .when{
  padding:2px 7px;border-radius:99px;
  font:700 9.5px/1 var(--sans);white-space:nowrap;
}
.pm .when.now{background:#E7F5EF;color:var(--ok, #127A55)}
.pm .when.wait{background:var(--wash, #F5F7FA);color:var(--steel, #56677F)}

@media (max-width:620px){
  /* По две в ред: пет плочки в ред стават по-тесни от знака. */
  .pm{flex:1 1 calc(50% - 4px);min-width:0}
  .pm-marks svg{height:18px}
}


/* ══════════════════════════════════════════════════════════
   ПОРЪЧКА · въпроси и сървъри в количката
   ══════════════════════════════════════════════════════════ */
/*
 * НЕЗАДАДЕНОТО НЕ Е „НЕ“.
 *
 * Обикновен плъзгач не става: изключен, той изглежда като отговорен с
 * „не“, а човек просто не го е пипал.
 *
 * Затова са два бутона и трето състояние — незададено, с жълт ръб.
 */
.oq{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 14px);padding:16px 18px;margin-bottom:12px;
}

/* Незададеното спира плащането — затова личи. */
.oq.is-unset{
  border-left:3px solid var(--warn, #9A6A12);background:#FBF4E4;
}

.oq-t{display:flex;align-items:center;gap:14px;flex-wrap:wrap}

.oq-l{flex:1;min-width:190px;font:600 13.5px/1.4 var(--sans)}

/* Белег ЗАЩО се вижда този въпрос. */
.owhy{
  display:inline-block;margin-left:7px;padding:2px 7px;border-radius:99px;
  background:var(--wash, #F5F7FA);color:var(--steel-lt, #7385A0);
  font:600 9.5px/1 var(--sans);vertical-align:1px;
}

.oq-b{display:flex;gap:6px;flex:0 0 auto}
.oq-b form{display:contents}

.oq-btn{
  min-width:60px;padding:9px 15px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:700 13px/1 var(--sans);color:var(--ink-soft, #3A4A63);
}
.oq-btn:hover{border-color:var(--steel-lt, #7385A0)}
.oq-btn.is-yes{background:var(--ok, #127A55);border-color:var(--ok, #127A55);color:#fff}
.oq-btn.is-no{background:var(--steel, #56677F);border-color:var(--steel, #56677F);color:#fff}

/*
 * Обяснителният ред СЕ МЕНИ според отговора.
 *
 * „Какво следва“ е по-полезно от повторение на въпроса.
 */
.oq-n{margin:10px 0 0;font-size:12.5px;line-height:1.6;color:var(--steel, #56677F)}
.oq-n b{color:var(--ink, #0E2745);font-weight:700}
.oq-n.is-ok{color:var(--ok, #127A55)}
.oq-n.is-ok b{color:var(--ok, #127A55)}
.oq-n.is-warn{color:var(--bad, #B0342C)}
.oq-n.is-warn b{color:var(--bad, #B0342C)}

/* ── сървърите ── */
/*
 * САМО БЕЗ ХОСТИНГ ПРИ НАС.
 *
 * С хостинг домейнът се насочва сам — питането е за нищо.
 */
.ocard{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 14px);margin-bottom:12px;overflow:hidden;
}

.ocard-h{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:13px 16px;border-bottom:1px solid var(--line, #DFE5EC);
  background:var(--wash, #F5F7FA);
}
.ocard-h h2{
  flex:1;margin:0;font:700 14px/1.3 var(--sans);letter-spacing:-.01em;
}

.ocard-b{padding:14px 16px}

.otwo{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.ons-go{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px;
}
.ons-go .hint{
  flex:1;min-width:180px;font:400 11.5px/1.5 var(--sans);
  color:var(--steel, #56677F);
}

/* ── заключеният бутон ── */
/*
 * ИЗГЛЕЖДА КАТО БУТОН, но не води никъде.
 *
 * Скрит, човек търси къде е „плати“. Блед и неподвижен, той казва „има
 * още нещо“.
 */
.btn.is-locked{opacity:.42;cursor:not-allowed;pointer-events:none}

.olocked{
  margin:12px 0 0;padding:11px 13px;border-radius:var(--r, 9px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:12.5px;color:var(--warn, #9A6A12);line-height:1.5;
}
.olocked b{font-weight:700}

@media (max-width:620px){
  .otwo{grid-template-columns:1fr}
  .oq-l{min-width:100%}
  .oq-b{width:100%}
  .oq-btn{flex:1}
}


/* ══════════════════════════════════════════════════════════
   КОЛИЧКА · две колони
   ══════════════════════════════════════════════════════════ */
/*
 * СМЕТКАТА Е ОТДЯСНО и залепена.
 *
 * Сложена накрая, тя кара човек да превърта нагоре-надолу, за да
 * провери какво плаща.
 */
.ocard-h .oprice{
  font:800 15px/1 var(--mono);letter-spacing:-.03em;
  margin-left:auto;
}

.ocard-rm{display:flex;flex:0 0 auto}
.ocard-rm button{
  width:26px;height:26px;border-radius:7px;cursor:pointer;
  display:grid;place-items:center;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  color:var(--steel-lt, #7385A0);
}
.ocard-rm button:hover{
  border-color:var(--bad, #B0342C);color:var(--bad, #B0342C);background:#FDF0EE;
}
.ocard-rm svg{width:12px;height:12px}

/* Значка при домейна: „.bg“ иска заявка, „.com“ тръгва за минути. */
.opill{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:99px;
  font:700 10.5px/1 var(--sans);white-space:nowrap;
}
.opill.warn{background:#FBF4E4;color:var(--warn, #9A6A12)}
.opill.blue{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.opill.ok{background:#E7F5EF;color:var(--ok, #127A55)}

/* ── сметката ── */
.oa-box{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 14px);padding:16px;
}

.oa-h{
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt, #7385A0);margin-bottom:13px;
}

.oa-lines{list-style:none;padding:0;margin:0 0 13px;display:grid;gap:9px}

.oa-lines li{display:flex;align-items:baseline;gap:10px;font-size:12.5px}
.oa-lines span{flex:1;color:var(--ink-soft, #3A4A63);min-width:0;word-break:break-all}
.oa-lines em{
  display:block;font:400 10.5px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt, #7385A0);margin-top:2px;
}
.oa-lines b{font:600 12.5px/1 var(--mono);white-space:nowrap}

.oa-sub{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  font-size:12.5px;color:var(--steel, #56677F);padding:4px 0;
}
.oa-sub b{font:600 12.5px/1 var(--mono);color:var(--ink, #0E2745)}

.oa-total{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding-top:13px;margin-top:9px;
  border-top:2px solid var(--ink, #0E2745);
}
.oa-total span{font:600 13px/1 var(--sans)}
.oa-total b{font:800 1.3rem/1 var(--mono);letter-spacing:-.03em}

/* Догодина: изненадата при подновяване гони клиенти. */
.oa-next{
  margin:13px 0 0;padding:9px 11px;border-radius:8px;
  background:var(--wash, #F5F7FA);
  font-size:11px;color:var(--steel, #56677F);line-height:1.5;
}
.oa-next b{color:var(--ink, #0E2745);font-weight:700}


/* ══════════════════════════════════════════════════════════
   ДАННИ ЗА ФАКТУРА · моите или други
   ══════════════════════════════════════════════════════════ */
/*
 * ВЛЕЗЛИЯТ ВИЖДА СВОИТЕ и избира.
 *
 * Повторното попълване при наличен профил е излишна работа — но и
 * задължителните му данни са грешка: фактурата може да е за друга
 * фирма, а адресът да се е сменил.
 */
.obill{display:flex;gap:6px;margin-bottom:14px}
.obill-f{display:contents}

.obill-b{
  flex:1;padding:10px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:600 12.5px/1 var(--sans);color:var(--ink-soft, #3A4A63);
}
.obill-b:hover{border-color:var(--steel-lt, #7385A0)}
.obill-b.is-on{
  background:var(--navy, #0E2745);border-color:var(--navy, #0E2745);color:#fff;
}

/*
 * Какво ще влезе във фактурата · показва се, не се пипа.
 *
 * Полета за четене изглеждат като полета за писане и човек се чуди
 * защо не се пишат.
 */
.omine{
  padding:14px 16px;border-radius:var(--r, 9px);
  background:var(--wash, #F5F7FA);border:1px solid var(--line, #DFE5EC);
  display:grid;gap:5px;
}
.omine b{font:700 14px/1.3 var(--sans)}
.omine span{font-size:12.5px;color:var(--steel, #56677F)}
.omine .mono{font-family:var(--mono)}
.omine a{
  justify-self:start;margin-top:6px;
  font:600 12px/1 var(--sans);color:var(--rose, #C0335C);
  text-decoration:underline;text-underline-offset:3px;
}

.oguest{
  margin:14px 0 0;padding:11px 13px;border-radius:8px;
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:12px;color:var(--ok, #127A55);line-height:1.55;
}
.oguest b{font-weight:700}


/* ══════════════════════════════════════════════════════════
   НУЖЕН Е ПРОФИЛ
   ══════════════════════════════════════════════════════════ */
/*
 * ГОСТ НЕ МОЖЕ ДА ПОРЪЧА.
 *
 * Домейнът иска притежател, а притежателят е сметка — така работят
 * всички регистратори.
 *
 * Полета за попълване тук са заблуда: човекът ги пълни, а накрая пак
 * трябва профил.
 */
.oauth{border-color:rgba(28,95,168,.24)}
.oauth .ocard-h{background:#EAF2FB;border-bottom-color:rgba(28,95,168,.2)}
.oauth .ocard-h h2{color:var(--blue, #1C5FA8)}

.oauth-t{
  margin:0 0 16px;font-size:13.5px;line-height:1.6;
  color:var(--ink-soft, #3A4A63);
}

/*
 * ДВА ПЪТЯ, еднакво видими.
 *
 * „Вход“ е по-често, затова е плътният — но „регистрация“ не е скрито:
 * човек без профил търси точно него.
 */
.oauth-go{display:flex;gap:9px;flex-wrap:wrap}
.oauth-go .btn{flex:1;min-width:150px}

/* Количката не се губи: това се казва, за да не се страхува човек. */
.oauth-keep{
  margin:14px 0 0;padding:11px 13px;border-radius:var(--r, 9px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:12px;color:var(--ok, #127A55);line-height:1.55;
}
.oauth-keep b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   Полетата в количката
   ══════════════════════════════════════════════════════════ */
/*
 * Полетата бяха ГОЛИ — без нашия вид, защото „control“ живее в друг
 * файл и там е стилизирано за друга страница.
 */
.ocard-b .field{margin-bottom:0}

.ocard-b .field label{
  display:block;font:600 11.5px/1 var(--sans);
  color:var(--steel, #56677F);margin-bottom:6px;
}

.ocard-b .field .control{
  width:100%;padding:10px 12px;border-radius:8px;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:400 13.5px/1.3 var(--sans);color:var(--ink, #0E2745);
}
.ocard-b .field .control:focus{
  outline:none;border-color:var(--rose, #C0335C);
}
.ocard-b .field .control.mono{font-family:var(--mono);font-size:13px}

/* Двойката полета: равни и с еднакво разстояние. */
.ocard-b .otwo{margin-bottom:12px}
.ocard-b .otwo:last-child{margin-bottom:0}

/* Фирмените: показват се само при избран „фирма“. */
.ocard-b .co-company{display:none}
.ocard-b .co-company.is-on{display:block;margin-bottom:12px}

/* Превключвателят лице · фирма. */
.ocard-b .co-tabs{display:flex;gap:6px;margin-bottom:14px}

/*
 * БЕЗ „background“ и „color“ ТУК.
 *
 * В сайта има „.co-tab:has(input:checked)“, което ги задава за
 * избрания — и е по-силно от голото ми правило.
 *
 * Ако ги пиша и тук, неизбраните биха ги взели от мен, а избраният от
 * тях: два източника за едно нещо. По-чисто е да не ги пипам.
 */
.ocard-b .co-tab{
  flex:1;padding:10px;border-radius:8px;cursor:pointer;text-align:center;
  border:1px solid var(--line, #DFE5EC);
  font:600 12.5px/1 var(--sans);
}
.ocard-b .co-tab input{position:absolute;opacity:0;width:0;height:0}
/*
 * ЧЕРЕЗ „:has“, не с клас.
 *
 * В сайта вече има „.co-tab:has(input:checked)“ — по-силно от голото
 * „.is-on“. Моето правило щеше да стои и да мълчи.
 *
 * С родителя „.ocard-b“ отпред то надделява.
 */
.ocard-b .co-tab:has(input:checked),
.ocard-b .co-tab.is-on{
  background:var(--navy, #0E2745);border-color:var(--navy, #0E2745);color:#fff;
}

/* ==== domain-search: край ==== */

/* ══════════════════════════════════════════════════════════
   Срок на регистрация · менюто в количката
   ══════════════════════════════════════════════════════════ */
/*
 * Менюто стои в самия ред, не под него.
 *
 * Отделен ред за нещо, което се сменя с едно движение, разкъсва
 * връзката между името и цената му.
 */
.cart-yr{display:inline-flex;align-items:center;gap:8px;margin:0}

.cart-yr .control,
.cart-yr select{
  -webkit-appearance:none;appearance:none;
  padding:7px 30px 7px 11px;border-radius:8px;
  border:1px solid var(--line,#DCE3ED);background:var(--paper,#fff);
  font-family:var(--mono,ui-monospace,monospace);
  font-size:12.5px;color:var(--ink,#101A2B);
  cursor:pointer;line-height:1.3;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2356677F' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 9px center;
  background-size:13px;
  transition:border-color .14s ease;
}

.cart-yr select:hover{border-color:var(--steel-lt,#7385A0)}
.cart-yr select:focus{
  outline:0;border-color:var(--rose,#C0335C);
  box-shadow:0 0 0 3px rgba(192,51,92,.14);
}

/* Редът в кутията на домейна: надпис вляво, меню вдясно. */
.orow-yr{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;
}

/*
 * В КРАТКИЯ СПИСЪК менюто е по-дребно.
 *
 * Там редът е тесен и трите неща — име, срок, цена — трябва да се
 * съберат на една линия.
 */
.cart-list .cart-yr select{
  padding:5px 26px 5px 9px;font-size:11.5px;background-size:12px;
  background-position:right 7px center;
}

@media (max-width:560px){
  /* На тясно менюто заема свой ред: до цената остава по три знака. */
  .orow-yr{flex-direction:column;align-items:stretch;gap:8px}
  .cart-yr,.cart-yr select{width:100%}
  .cart-list li .cart-yr{flex:1 0 100%;margin-top:6px}
}

/* ══════════════════════════════════════════════════════════
   Бутонът до менюто за срок
   ══════════════════════════════════════════════════════════ */
/*
 * ВИДИМ БУТОН, НЕ „onchange“.
 *
 * Правилото за сигурност е „script-src 'self' 'nonce-…'“ без
 * „unsafe-inline“ — вграденият код в атрибут се блокира МЪЛЧАЛИВО.
 * Човек избира от менюто, страницата не мърда, в дневника няма нищо.
 *
 * Бутонът е дребен нарочно: той е потвърждение, не главно действие.
 */
.cart-yr-go{
  -webkit-appearance:none;appearance:none;
  padding:7px 13px;border-radius:8px;
  border:1px solid var(--line,#DCE3ED);
  background:var(--paper,#fff);
  font-family:var(--sans,system-ui,sans-serif);
  font-size:12px;font-weight:600;
  color:var(--steel,#56677F);
  cursor:pointer;white-space:nowrap;line-height:1.3;
  transition:border-color .14s ease,color .14s ease,background .14s ease;
}

.cart-yr-go:hover{
  border-color:var(--rose,#C0335C);
  color:var(--rose,#C0335C);
  background:var(--mist,#EEF2F7);
}

.cart-yr-go:active{transform:translateY(1px)}

.cart-yr-go:focus-visible{
  outline:2px solid var(--rose,#C0335C);
  outline-offset:2px;
}

/* В стария избор на период класът е същият — един вид за едно нещо. */
.cl-cycle .cart-yr-go{margin-left:8px}

@media (max-width:560px){
  /* На тясно бутонът е на цял ред под менюто. */
  .cart-yr-go{width:100%;padding-block:9px}
}

/* ══════════════════════════════════════════════════════════
   Срок на регистрация · менюто в количката
   ══════════════════════════════════════════════════════════ */
/*
 * Смяната е АВТОМАТИЧНА.
 *
 * Скриптът в страницата праща формата при избор и скрива бутона.
 * Бутонът остава само за случая, в който скриптът не тръгне — тогава
 * менюто пак работи, просто с едно натискане повече.
 */
.cart-yr{display:inline-flex;align-items:center;gap:8px;margin:0}

.cart-yr select,
.cl-cycle select{
  -webkit-appearance:none;appearance:none;
  padding:7px 30px 7px 11px;border-radius:8px;
  border:1px solid var(--line,#DCE3ED);background:var(--paper,#fff);
  font-family:var(--mono,ui-monospace,monospace);
  font-size:12.5px;color:var(--ink,#101A2B);
  cursor:pointer;line-height:1.3;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2356677F' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 9px center;
  background-size:13px;
  transition:border-color .14s ease,opacity .14s ease;
}

.cart-yr select:hover,
.cl-cycle select:hover{border-color:var(--steel-lt,#7385A0)}

.cart-yr select:focus,
.cl-cycle select:focus{
  outline:0;border-color:var(--rose,#C0335C);
  box-shadow:0 0 0 3px rgba(192,51,92,.14);
}

/* Заключено, докато страницата се презарежда: показва, че нещо става. */
.cart-yr select:disabled,
.cl-cycle select:disabled{opacity:.55;cursor:progress}

/* Редът в кутията на домейна: надпис вляво, меню вдясно. */
.orow-yr{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;
}

/* Резервният бутон — вижда се само без скриптове. */
.cart-yr-go{
  -webkit-appearance:none;appearance:none;
  padding:7px 13px;border-radius:8px;
  border:1px solid var(--line,#DCE3ED);background:var(--paper,#fff);
  font-family:var(--sans,system-ui,sans-serif);
  font-size:12px;font-weight:600;color:var(--steel,#56677F);
  cursor:pointer;white-space:nowrap;line-height:1.3;
  transition:border-color .14s ease,color .14s ease;
}
.cart-yr-go:hover{border-color:var(--rose,#C0335C);color:var(--rose,#C0335C)}
.cart-yr-go[hidden]{display:none}

/* В краткия списък менюто е по-дребно: редът е тесен. */
.cart-list .cart-yr select{
  padding:5px 26px 5px 9px;font-size:11.5px;background-size:12px;
  background-position:right 7px center;
}

@media (max-width:560px){
  /* На тясно менюто заема свой ред: до цената остават три знака. */
  .orow-yr{flex-direction:column;align-items:stretch;gap:8px}
  .cart-yr,.cart-yr select{width:100%}
  .cart-list li .cart-yr{flex:1 0 100%;margin-top:6px}
}

/* ══════════════════════════════════════════════════════════
   Менюто · бутоните на една линия със връзките
   ══════════════════════════════════════════════════════════ */
/*
 * КРИВАТА ЛИНИЯ.
 *
 * Менюто смесва два вида елемента:
 *
 *   <a>                          за „Блог“ и „Контакти“
 *   <button class="nav-top">     за тези с подменю
 *
 * Бутонът има съкратен запис:
 *
 *     font:600 15px/1 var(--sans);
 *
 * „/1“ е височината на реда — и тя ПРЕЗАПИСВА наследената 1.55 от
 * тялото. Разликата:
 *
 *     <a>       15 × 1.55 = 23,2px текст + 20px отстъп = 43,2px
 *     <button>  15 × 1.00 = 15,0px текст + 20px отстъп = 35,0px
 *
 * Осем пиксела. Бутоните с подменю се качват над съседите си.
 *
 * Съкратеният запис е коварен точно с това: не пише „line-height“
 * никъде, но го задава.
 */
.nav>li>.nav-top{line-height:1.55}

/*
 * И списъкът се изравнява по средата.
 *
 * Без него всяка бъдеща разлика във височината — по-дълъг надпис,
 * друга иконка — пак ще изкриви реда.
 */
.nav{align-items:center}

/*
 * Двата вида получават еднаква височина.
 *
 * Подравняването по средата се справя и без това, но при мишката
 * върху тях фонът трябва да е с еднакъв ръб — иначе личи, че са
 * различни елементи.
 */
.nav>li>a,
.nav>li>.nav-top{min-height:43px}


/* ══════════════════════════════════════════════════════════
   Партньорска програма за агенции
   ══════════════════════════════════════════════════════════ */
/*
 * ВСИЧКО Е ЗАГРАДЕНО В „.pg-partners“.
 *
 * Страницата ползва имена, които вече съществуват другаде — „.fi“,
 * „.feat-card“, „.sh“. Без заграждане чуждите правила се месят: „.fi“
 * например има размер САМО вътре в „.feat-card“, затова иконките в
 * друга карта се разтягаха до цялата ѝ височина.
 *
 * Заграждането дава и по-висока тежест, тоест тукашните правила
 * печелят, без да се разчита на реда във файла.
 */

/* ── заглавна част ─────────────────────────────────────── */
.pg-partners .pg-hero{
  background:linear-gradient(170deg,var(--navy) 0%,var(--navy-deep) 100%);
  color:#fff;padding:76px 0 82px;
}
.pg-partners .pg-hero .eyebrow{
  display:inline-block;padding:5px 13px;border-radius:99px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);
  font-size:12.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  color:#fff;
}
.pg-partners .pg-hero h1{
  margin:20px 0 16px;font-size:clamp(2rem,4.4vw,3.05rem);
  font-weight:800;letter-spacing:-.035em;line-height:1.12;color:#fff;
}
.pg-partners .pg-hero .lead{
  max-width:640px;margin:0;font-size:17.5px;line-height:1.65;
  color:rgba(255,255,255,.8);
}
.pg-partners .pg-hero .go{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}

/*
 * Светлият бутон е обърнат спрямо витрината: там фонът е бял, тук —
 * тъмносин, и „btn-ghost“ с тъмен ръб не се вижда.
 */
.pg-partners .pg-hero .btn-ghost{
  background:transparent;color:#fff;border-color:rgba(255,255,255,.28);
}
.pg-partners .pg-hero .btn-ghost:hover{
  background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.45);color:#fff;
}

/* ── заглавие на раздел ────────────────────────────────── */
.pg-partners .sh{max-width:680px;margin-bottom:8px}
.pg-partners .sh h2{
  margin:0;font-size:clamp(1.5rem,2.7vw,2rem);font-weight:800;letter-spacing:-.03em;
}
.pg-partners .sh p{margin:12px 0 0;font-size:16px;color:var(--ink-2);line-height:1.65}

/* ── стъпалата ─────────────────────────────────────────── */
/*
 * ОТБЕЛЯЗАНО Е СРЕДНОТО, не най-скъпото.
 *
 * То е и най-честото за агенциите. Отбелязано най-горно стъпало
 * изглежда като опит да се продаде нагоре.
 */
.pg-partners .ptiers{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px;
}
.pg-partners .ptier{
  position:relative;padding:28px 24px;border-radius:var(--r-lg);
  border:1px solid var(--line);background:var(--paper);box-shadow:var(--sh-s);
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.pg-partners .ptier:hover{
  border-color:var(--line-2);transform:translateY(-2px);box-shadow:var(--sh);
}
.pg-partners .ptier.is-on{
  border-color:var(--navy);border-width:1.5px;box-shadow:var(--sh-l);
}
.pg-partners .ptier-tag{
  position:absolute;top:-11px;left:24px;padding:4px 12px;border-radius:99px;
  background:var(--navy);color:#fff;font-size:11.5px;font-weight:700;
}
.pg-partners .ptier-n{font-size:14px;font-weight:600;color:var(--ink-3)}
.pg-partners .ptier-p{
  margin:8px 0 14px;display:flex;align-items:baseline;gap:8px;
  font-size:15px;color:var(--ink-3);
}
.pg-partners .ptier-p b{
  font-size:2.5rem;font-weight:800;letter-spacing:-.05em;
  color:var(--ink);line-height:1;
}
.pg-partners .ptier p{margin:0;font-size:14px;color:var(--ink-2);line-height:1.6}
.pg-partners .plan-note{
  margin:22px 0 0;font-size:13.5px;color:var(--ink-3);text-align:center;
}

/* ── кой плаща ─────────────────────────────────────────── */
.pg-partners .ppays{
  display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px;
}
.pg-partners .ppay{
  padding:28px 26px;border-radius:var(--r-lg);
  border:1px solid var(--line);background:var(--paper);
}

/*
 * ИКОНКАТА ИМА СВОЙ РАЗМЕР ТУК.
 *
 * В hosting.css „.fi svg“ е оразмерен само вътре в „.feat-card“ и в
 * падащото меню. Другаде SVG-то няма размер и се разтяга до цялата
 * височина на картата — точно това ставаше.
 */
.pg-partners .fi{
  display:inline-grid;place-items:center;
  width:42px;height:42px;flex:0 0 42px;
  border-radius:var(--r-md);background:var(--rose-w);color:var(--rose);
}
.pg-partners .fi svg{
  width:20px;height:20px;fill:none;stroke:currentColor;
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;
}
.pg-partners .ppay h3{margin:16px 0 9px;font-size:17.5px;font-weight:700}
.pg-partners .ppay p{margin:0;font-size:14.5px;color:var(--ink-2);line-height:1.65}

/* ── панелът ───────────────────────────────────────────── */
.pg-partners .psplit{
  display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;
}
.pg-partners .psplit h2{
  margin:0;font-size:clamp(1.45rem,2.5vw,1.9rem);font-weight:800;letter-spacing:-.03em;
}
.pg-partners .psplit>div>p{
  margin:14px 0 0;font-size:16px;color:var(--ink-2);line-height:1.7;
}
.pg-partners .ptick{list-style:none;margin:0;padding:0;display:grid;gap:13px}
.pg-partners .ptick li{
  position:relative;padding-left:30px;font-size:15px;line-height:1.55;
}
/*
 * ОТМЕТКАТА Е ЦЯЛА КАРТИНКА, не маска.
 *
 * „mask-composite“ се смесва зле между „-webkit-“ и стандартния запис:
 * Firefox не го разбира, Chrome рисува плътен кръг без отметка.
 */
.pg-partners .ptick li::before{
  content:"";position:absolute;left:0;top:3px;width:19px;height:19px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10' fill='%23127A55'/%3E%3Cpath d='M5.6 10.2l2.9 2.9 5.9-6' fill='none' stroke='%23fff' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/19px no-repeat;
}

/* ── какво влиза ───────────────────────────────────────── */
.pg-partners .pfeat{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px;
}
.pg-partners .pfeat-card{
  padding:26px 24px;border-radius:var(--r-lg);
  border:1px solid var(--line);background:var(--paper);
}
.pg-partners .pfeat-card h3{margin:15px 0 8px;font-size:16.5px;font-weight:700}
.pg-partners .pfeat-card p{margin:0;font-size:14px;color:var(--ink-2);line-height:1.65}

/* ── за кого е ─────────────────────────────────────────── */
.pg-partners .pwho{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px;
}
.pg-partners .pwho>div{
  padding:24px;border-radius:var(--r-lg);
  background:var(--paper);border:1px solid var(--line);
}
.pg-partners .pwho b{display:block;margin-bottom:8px;font-size:16px;font-weight:700}
.pg-partners .pwho span{font-size:14px;color:var(--ink-2);line-height:1.65}

/* ── формата ───────────────────────────────────────────── */
.pg-partners .pform{display:grid;gap:16px;margin-top:34px}
.pg-partners .pform-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}

.pg-partners .pf{display:flex;flex-direction:column;gap:7px;font-size:13.5px;font-weight:600}

/* Точката казва „задължително“ ПРЕДИ натискане на бутона. */
.pg-partners .pf.req>span::after{
  content:"";display:inline-block;width:4px;height:4px;margin-left:6px;
  vertical-align:2px;border-radius:50%;background:var(--rose);
}

.pg-partners .pf input,
.pg-partners .pf select,
.pg-partners .pf textarea{
  width:100%;box-sizing:border-box;
  border:1px solid var(--line-2);border-radius:var(--r-md);padding:12px 14px;
  background:var(--paper);font-family:inherit;font-size:14.5px;font-weight:400;
  color:var(--ink);transition:border-color .14s ease,box-shadow .14s ease;
}
.pg-partners .pf input::placeholder,
.pg-partners .pf textarea::placeholder{color:#9AA7B6;opacity:1}

.pg-partners .pf input:focus,
.pg-partners .pf select:focus,
.pg-partners .pf textarea:focus{
  outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(14,39,69,.09);
}

.pg-partners .pf textarea{resize:vertical;min-height:104px;line-height:1.6}

.pg-partners .pf select{
  -webkit-appearance:none;appearance:none;cursor:pointer;padding-right:36px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A8899' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;background-size:15px;
}

.pg-partners .pchk{
  display:flex;gap:11px;align-items:flex-start;
  font-size:14px;font-weight:400;line-height:1.55;cursor:pointer;
}
.pg-partners .pchk input{
  width:17px;height:17px;margin-top:2px;accent-color:var(--navy);flex:0 0 auto;
}
.pg-partners .pform .btn{justify-self:start}

/* ── въпроси ───────────────────────────────────────────── */
/*
 * Разгъващи се, с „details“ вместо скрипт: работи и при блокиран
 * JavaScript, а правилото за сигурност не му пречи.
 */
.pg-partners .pfaq{margin-top:30px;border-top:1px solid var(--line)}
.pg-partners .pfaq details{border-bottom:1px solid var(--line)}
.pg-partners .pfaq summary{
  padding:19px 40px 19px 19px;font-size:16px;font-weight:600;cursor:pointer;
  list-style:none;position:relative;
}
.pg-partners .pfaq summary::-webkit-details-marker{display:none}
.pg-partners .pfaq summary::after{
  content:"";position:absolute;right:6px;top:24px;width:10px;height:10px;
  border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);
  transform:rotate(45deg);transition:transform .18s ease,top .18s ease;
}
.pg-partners .pfaq details[open] summary::after{transform:rotate(-135deg);top:28px}
.pg-partners .pfaq p{
  margin:0;padding:0 40px 21px 0;font-size:15px;color:var(--ink-2);line-height:1.7;
}

/* ── призив ────────────────────────────────────────────── */
.pg-partners .pcta{
  background:var(--navy);color:#fff;border-radius:var(--r-lg);
  padding:52px 44px;text-align:center;
}
.pg-partners .pcta h2{margin:0;font-size:1.7rem;font-weight:800;letter-spacing:-.03em}
.pg-partners .pcta p{
  margin:14px auto 26px;max-width:520px;
  color:rgba(255,255,255,.76);font-size:16px;line-height:1.65;
}

/* Дълга дума в тясна карта излиза от рамката и бута реда. */
.pg-partners p,
.pg-partners li,
.pg-partners span,
.pg-partners h2,
.pg-partners h3,
.pg-partners summary{overflow-wrap:break-word}

@media (max-width:900px){
  /* Три карти една до друга стават по 110 пиксела: числото се чете,
     обяснението под него — не. */
  .pg-partners .ptiers,
  .pg-partners .pfeat,
  .pg-partners .pwho,
  .pg-partners .ppays{grid-template-columns:1fr}

  .pg-partners .psplit{grid-template-columns:1fr;gap:32px}
  .pg-partners .pg-hero{padding:52px 0 58px}
}

@media (max-width:600px){
  .pg-partners .pform-2{grid-template-columns:1fr}
  .pg-partners .ptier-p b{font-size:2.2rem}
  .pg-partners .pcta{padding:38px 24px}

  /* Под 16 пиксела iPhone увеличава страницата сам при щракане. */
  .pg-partners .pf input,
  .pg-partners .pf select,
  .pg-partners .pf textarea{font-size:16px}
}

/* ══════════════════════════════════════════════════════════
   Сървъри за имена · наставката ОТДЯСНО, не отдолу
   ══════════════════════════════════════════════════════════ */
/*
 * Правилата съществуваха в „site.css“ — файл, който НИКОЯ страница не
 * чете. Вграждаме само „hosting.css“, затова полето оставаше просто
 * поле на цялата ширина, а наставката „.mojqtdomejn.com“ падаше под
 * него като втори ред.
 *
 * Клиентът пише само „ns1“, а вижда „.mojqtdomejn.com“ отдясно — така
 * знае какво ще излезе, без да го преписва.
 */
.ns-row{display:flex;align-items:stretch;gap:0;min-width:0}
.ns-row .control{
  border-top-right-radius:0;
  border-bottom-right-radius:0;
  min-width:0;flex:1;
}
.ns-suffix{
  display:flex;align-items:center;
  padding:0 12px;
  background:#F1F4F8;
  border:1px solid #D8DFE8;
  border-left:0;
  border-radius:0 8px 8px 0;
  font-size:13px;color:#5C6B80;
  white-space:nowrap;
  max-width:45%;
  overflow:hidden;text-overflow:ellipsis;
}
@media (max-width:520px){
  /* На тясно наставката отива отдолу: иначе полето остава три знака. */
  .ns-row{flex-direction:column}
  .ns-row .control{border-radius:8px 8px 0 0}
  .ns-suffix{
    border-left:1px solid #D8DFE8;border-top:0;
    border-radius:0 0 8px 8px;max-width:none;
  }
}
/* Празната наставка не заема място: рамка без съдържание изглежда
   като счупено поле. */
.ns-suffix:empty{display:none}

/* ══════════════════════════════════════════════════════════
   „Добави още сървъри“
   ══════════════════════════════════════════════════════════ */
/*
 * Дребен и блед НАРОЧНО: той не е главното действие на страницата.
 * Деветима от десет не го натискат — оставят нашите два сървъра.
 *
 * Скрива се сам, щом полетата стигнат тринайсет.
 */
.ns-more[hidden]{display:none}

.ns-more{
  -webkit-appearance:none;appearance:none;
  margin:-10px 0 20px;padding:8px 14px;border-radius:8px;
  border:1px dashed var(--line-2,#C7D1DD);background:none;
  font:600 13px/1 var(--sans,system-ui,sans-serif);
  color:var(--ink-2,#48586C);cursor:pointer;
  transition:border-color .14s ease,color .14s ease,background .14s ease;
}
.ns-more:hover{
  border-color:var(--rose,#C0335C);color:var(--rose,#C0335C);
  border-style:solid;
}
.ns-more:focus-visible{outline:2px solid var(--rose,#C0335C);outline-offset:2px}

@media (max-width:520px){
  .ns-more{width:100%;padding-block:11px}
}

/* ==== dedicated: начало ==== */

/* ══════════════════════════════════════════════════════════
   САМОСТОЯТЕЛНИ СЪРВЪРИ
   ══════════════════════════════════════════════════════════ */

.ded-head{max-width:640px;margin:0 0 clamp(26px,3.5vw,40px)}
.ded-head h2{margin:0 0 12px}
.ded-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.ded-hero{
  background:var(--navy);color:#fff;
  padding:clamp(44px,7vw,86px) 0 clamp(40px,6vw,72px);
}

.ded-hero-in{
  display:grid;grid-template-columns:1.15fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.ded-hero h1{color:#fff;margin:0 0 14px}

.ded-hero > .wrap-w > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 26px;max-width:520px;line-height:1.65;
}

.ded-eyebrow{margin-bottom:16px}

.ded-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:26px}

/*
 * ТРИ ОБЕЩАНИЯ вместо изречение.
 *
 * Те отговарят на въпросите, преди да са зададени: колко чакам, къде е
 * машината, и мога ли да изляза.
 */
.ded-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.ded-notes span{display:inline-flex;align-items:center;gap:7px}
.ded-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.ded-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   РИСУВАНИЯТ СЪРВЪР
   ══════════════════════════════════════════════════════════ */
/*
 * СНИМКА ОТ ЧУЖД СКЛАД показва чужди машини. Рисунката казва същото и
 * не лъже — а твоята е с розов ръб, за да личи коя е.
 */
.ded-art{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.ded-rack{display:grid;gap:8px}

.ded-unit{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;border-radius:9px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
}

.ded-unit.is-yours{
  background:rgba(192,51,92,.16);border-color:rgba(192,51,92,.5);
}

.ded-led{
  width:7px;height:7px;border-radius:50%;flex:0 0 auto;background:#6FD9AC;
}
.ded-unit.is-yours .ded-led{
  background:#FF6B93;animation:dedblink 2s ease-in-out infinite;
}

@keyframes dedblink{0%,100%{opacity:1}50%{opacity:.35}}

.ded-bays{display:flex;gap:3px;flex:0 0 auto}
.ded-bay{width:5px;height:22px;border-radius:2px;background:rgba(255,255,255,.16)}
.ded-unit.is-yours .ded-bay{background:rgba(255,255,255,.4)}

.ded-unit-t{flex:1;min-width:0}
.ded-unit-t b{
  display:block;font:700 12.5px/1 var(--mono);color:#fff;letter-spacing:-.02em;
}
.ded-unit-t span{
  display:block;font:400 10.5px/1 var(--sans);
  color:rgba(255,255,255,.5);margin-top:5px;
}

.ded-tag{
  font:700 9.5px/1 var(--sans);padding:3px 8px;border-radius:99px;
  background:rgba(255,255,255,.1);color:rgba(255,255,255,.62);white-space:nowrap;
}
.ded-unit.is-yours .ded-tag{background:var(--rose);color:#fff}

/* ══════════════════════════════════════════════════════════
   СРАВНЕНИЕТО С VPS
   ══════════════════════════════════════════════════════════ */
/*
 * ТО Е ГЛАВНОТО: човек, който гледа тази страница, вече знае какво е
 * сървър. Въпросът му е дали да плати няколко пъти повече — и защо.
 *
 * Затова се казва и КОГА VPS Е ПО-ДОБРОТО: премълчаването му личи, а
 * клиент, купил грешното, се връща ядосан.
 */
.ded-vs{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.ded-vs-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}
.ded-vs-i.is-this{border-color:var(--rose);background:#FDF1F4}

.ded-vs-h{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.ded-vs-h b{flex:1;font:700 15px/1.3 var(--sans)}

.ded-vs-l{list-style:none;padding:0;margin:0;display:grid;gap:11px}

.ded-vs-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.ded-d{
  width:19px;height:19px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;
}
.ded-d svg{width:10px;height:10px;stroke-width:3.2}
.ded-d.yes{background:#E7F5EF;color:var(--up, #127A55)}
.ded-d.no{background:var(--wash);color:var(--steel-lt)}

.ded-vs-go{margin-top:16px}

/* ══════════════════════════════════════════════════════════
   ПЛОЧКИТЕ
   ══════════════════════════════════════════════════════════ */
.ded-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.ded-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

/* Препоръчаният: розов ръб и значка. Без нея човек сравнява наум. */
.ded-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

.ded-plan-h{
  padding:20px 22px 16px;border-bottom:1px solid var(--line);position:relative;
}
.ded-plan.is-best .ded-plan-h{background:#FDF1F4}

.ded-plan-tag{
  position:absolute;top:-1px;right:18px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.ded-plan-n{
  font:800 1.15rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px;
}
.ded-plan-for{font-size:12.5px;color:var(--steel);margin:0;line-height:1.5}

.ded-plan-p{padding:18px 22px;border-bottom:1px solid var(--line)}
.ded-plan-p b{font:800 1.7rem/1 var(--mono);letter-spacing:-.035em}
.ded-plan-p > span{font-size:12.5px;color:var(--steel);margin-left:4px}
.ded-plan-p em{
  display:block;font:400 11.5px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/*
 * ЖЕЛЯЗОТО В ЕДНА РЕШЕТКА.
 *
 * Списък с точки кара окото да чете; решетката се сравнява между
 * плановете с един поглед.
 */
.ded-hw{padding:18px 22px;flex:1;display:grid;gap:12px}

.ded-hw-r{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start}

.ded-hw-ic{
  width:28px;height:28px;border-radius:8px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.ded-hw-ic svg{width:14px;height:14px}

.ded-hw-t b{display:block;font:700 13px/1.3 var(--mono);letter-spacing:-.02em}
.ded-hw-t span{
  display:block;font:400 11.5px/1.4 var(--sans);color:var(--steel);margin-top:3px;
}

.ded-plan-go{padding:0 22px 22px}
.ded-plan-go .btn{width:100%}

/*
 * НАЛИЧНОСТТА Е ПОД ЦЕНАТА.
 *
 * „Остават 2“ решава повече от списъка с желязо, а не се вижда никъде
 * другаде.
 */
.ded-stock{
  display:flex;align-items:center;gap:7px;justify-content:center;
  margin-top:11px;font-size:11.5px;color:var(--steel);
}
.ded-stock i{width:6px;height:6px;border-radius:50%;background:var(--up, #127A55);flex:0 0 auto}
.ded-stock.low{color:var(--warn)}
.ded-stock.low i{background:var(--warn)}
.ded-stock.wait{color:var(--steel-lt)}
.ded-stock.wait i{background:var(--steel-lt)}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦАТА
   ══════════════════════════════════════════════════════════ */
.ded-tbl{
  overflow-x:auto;border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);background:var(--paper);
}

.ded-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px}

.ded-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

.ded-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.ded-tbl tbody tr:last-child td{border-bottom:0}
.ded-tbl tbody tr:hover{background:var(--wash)}

.ded-tbl td.mono{font-family:var(--mono);font-size:13px}

/* Колоната на препоръчания: с лек фон, за да се проследи. */
.ded-col-best{background:#FDF1F4}
.ded-tbl th.ded-col-best{background:#FBE4EA;color:var(--rose)}

/* ══════════════════════════════════════════════════════════
   СЛУЧАИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * СЛУЧАИ, НЕ СВОЙСТВА.
 *
 * „32 GB RAM“ не казва нищо на човек, който не знае колко му трябват.
 * „Магазин с 50 000 стоки“ казва.
 */
.ded-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.ded-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.ded-case-ic{
  width:42px;height:42px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.ded-case-ic svg{width:20px;height:20px}

.ded-case h3{margin:0 0 7px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em}
.ded-case p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.6}

.ded-case-p{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:99px;background:var(--wash);
  font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.ded-case-p b{font-family:var(--mono);font-weight:700}

.ded-ask{margin:26px 0 0;font-size:14px;color:var(--steel)}
.ded-ask a{color:var(--rose);font-weight:600}

/* ══════════════════════════════════════════════════════════
   КАКВО ВЛИЗА
   ══════════════════════════════════════════════════════════ */
.ded-incl{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.ded-incl-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.ded-incl-ic{
  width:38px;height:38px;border-radius:11px;margin-bottom:14px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.ded-incl-ic svg{width:18px;height:18px}

.ded-incl-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.ded-incl-i p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ДОБАВКИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЦЕНИТЕ СА ТУК, не „по запитване“.
 *
 * „Свържи се с нас за цена“ значи още едно писмо и два дни чакане — а
 * човекът иска само да сметне.
 */
.ded-adds{display:grid;gap:9px}

.ded-add{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:15px 18px;border-radius:var(--r, 10px);
  background:var(--paper);border:1px solid var(--line);
}

.ded-add-t{flex:1;min-width:200px}
.ded-add-t b{display:block;font:600 14px/1.3 var(--sans)}
.ded-add-t span{
  display:block;font:400 12px/1.5 var(--sans);color:var(--steel);margin-top:4px;
}

.ded-add-p{
  font:700 15px/1 var(--mono);white-space:nowrap;text-align:right;
  letter-spacing:-.02em;flex:0 0 auto;
}
.ded-add-p span{
  display:block;font:400 11px/1 var(--sans);color:var(--steel);margin-top:5px;
}
.ded-add-p.free{color:var(--up, #127A55)}

/* ══════════════════════════════════════════════════════════
   КЪДЕ Е МАШИНАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ВРЕМЕНАТА СА ЧИСЛА: „бърза мрежа“ е обещание, а „5 ms до София“ е
 * проверимо.
 */
.ded-dc{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center}

.ded-dc-box{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);padding:26px;
}

.ded-dc-box h3{
  color:#fff;margin:0 0 10px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em;
}
.ded-dc-box p{
  margin:0 0 18px;font-size:13.5px;color:rgba(255,255,255,.7);line-height:1.6;
}

.ded-dc-l{display:grid;gap:11px}

.ded-dc-r{
  display:flex;align-items:center;gap:12px;
  padding:11px 13px;border-radius:9px;background:rgba(255,255,255,.06);
}
.ded-dc-r b{flex:1;font:600 13px/1 var(--sans);color:#fff}
.ded-dc-r span{font:700 12.5px/1 var(--mono);color:#6FD9AC}

.ded-dc-facts{display:grid;gap:14px}

.ded-dc-f{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  font-size:13.5px;line-height:1.6;color:var(--ink-soft);
}
.ded-dc-f b{display:block;color:var(--ink);font-weight:700;margin-bottom:3px}

.ded-dc-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.ded-dc-ic svg{width:16px;height:16px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИТЕ
   ══════════════════════════════════════════════════════════ */
.ded-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.ded-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.ded-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.ded-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.ded-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.ded-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.ded-cta{
  background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0;
}

.ded-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.ded-cta h2{color:#fff;margin:0 0 8px}
.ded-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:460px}

.ded-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.ded-cta-ghost{
  background:transparent;border-color:rgba(255,255,255,.24);color:#fff;
}
.ded-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1000px){
  .ded-hero-in{grid-template-columns:1fr}
  .ded-plans{grid-template-columns:1fr}
  .ded-cases{grid-template-columns:1fr}
  .ded-incl{grid-template-columns:1fr 1fr}
  .ded-dc{grid-template-columns:1fr}
  .ded-faq{grid-template-columns:1fr}
  .ded-vs{grid-template-columns:1fr}
}

@media (max-width:620px){
  .ded-incl{grid-template-columns:1fr}
  .ded-hero-go .btn{width:100%}
  .ded-add{gap:12px}
  .ded-add-p{min-width:100%;text-align:left}
  .ded-cta-go{width:100%}
  .ded-cta-go .btn{flex:1}
  .ded-notes{gap:12px}
}

/* ==== dedicated: край ==== */

/* ==== адаптация: начало ==== */

/* ══════════════════════════════════════════════════════════
   АДАПТАЦИЯ · поправки за тесен екран
   ══════════════════════════════════════════════════════════ */
/*
 * Всяко правило тук поправя нещо, което на 360 пиксела излиза извън
 * екрана или се слепва.
 *
 * СТОЯТ НАКРАЯ, за да надделеят: съществуващите правила не се пипат, а
 * при равна тежест печели по-долното.
 */

/* ── таблиците ── */
/*
 * ТАБЛИЦА БЕЗ ОБВИВКА РАЗЧЕКВА СТРАНИЦАТА.
 *
 * Широката таблица не се свива — тя избутва цялото тяло и човек
 * превърта настрани, за да види менюто.
 *
 * Обвивката с „overflow-x“ ограничава превъртането САМО до нея.
 */
.tld-table-wrap,
.tbl-wrap,
.table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:var(--r-md, 12px);
}

/*
 * Ако таблицата няма обвивка в HTML-а, самата тя се свива.
 *
 * По-лошо от превъртане, но по-добро от счупена страница.
 */
@media (max-width:760px){
  .tld-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}
  .tld-table thead,
  .tld-table tbody{display:table;width:100%;min-width:560px}

  /* Първата колона остава видима при превъртане: тя казва кой е редът. */
  .tld-table td:first-child,
  .tld-table th:first-child{position:sticky;left:0;background:var(--paper);z-index:1}
}

/* Сравнителната таблица: същото. */
@media (max-width:820px){
  .cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .cmp{min-width:640px}
}

@media (max-width:680px){
  .cmp{min-width:520px;font-size:13px}
  .cmp th,
  .cmp td{padding:10px 12px}
}

/* ── решетките ── */
/*
 * ТРИ КОЛОНИ НА 360 ПИКСЕЛА дават по 100 на колона — там не се побира
 * дори цена.
 */
@media (max-width:620px){
  .oa-line{grid-template-columns:1fr auto}
  .oa-line .oa-p{grid-column:2}

  .promo-box{grid-template-columns:1fr;gap:10px}
  .promo-box .btn{width:100%}

  /* Номерът остава отляво, текстът минава на цял ред. */
  .dstep{grid-template-columns:auto 1fr}

  .ded-vs-l li{grid-template-columns:auto 1fr}
  .ded-hw-r{grid-template-columns:auto 1fr}
  .ded-dc-f{grid-template-columns:auto 1fr}
}

/* ── мишени за пръст ── */
/*
 * ПРЪСТЪТ Е ОКОЛО 45 ПИКСЕЛА.
 *
 * По-малко копче се уцелва трудно и се натиска съседното — а тук
 * съседното трие ред от количката.
 *
 * Видимият размер остава същият; расте само областта за натискане.
 */
@media (max-width:860px){
  .cl-remove,
  .cart-rm button,
  .ocard-rm button{
    position:relative;
  }

  .cl-remove::after,
  .cart-rm button::after,
  .ocard-rm button::after{
    content:'';position:absolute;
    top:50%;left:50%;transform:translate(-50%,-50%);
    width:44px;height:44px;
  }

  /* Плъзгачът: по-голям, защото се натиска често. */
  .tgl{width:52px;height:30px}
  .tgl i{width:24px;height:24px}
  .tgl.is-on i{transform:translateX(22px)}

  /* Копчетата за години и за да/не: пълна височина за пръст. */
  .oyb,
  .dcfg-yb,
  .oq-btn,
  .q-btn,
  .obill-b,
  .who-b{min-height:44px}
}

/* ── шрифтове ── */
/*
 * ПОД 12 ПИКСЕЛА не се чете на телефон, а на слънце — още по-малко.
 */
@media (max-width:620px){
  .mega-col h4{font-size:12px}
  .nav-tel small{font-size:12px}
  .oa-next{font-size:12px}
  .oa-lines em{font-size:11.5px}
  .sum-vat{font-size:11.5px}
}

/* ── текст, който не се пренася ── */
/*
 * „nowrap“ НА ДЪЛЪГ НАДПИС го изкарва извън екрана.
 *
 * На цените и значките е вярно — те са къси. На състоянието и имената
 * не е.
 */
@media (max-width:620px){
  .dres-status{white-space:normal}
  .oa-body b{white-space:normal;word-break:break-word}
  .cart-p{white-space:normal}
  .oa-lines b{white-space:normal}
}

/* ── дълги думи ── */
/*
 * ДОМЕЙН БЕЗ ИНТЕРВАЛИ не се пренася сам и разчеква реда.
 *
 * „mnogodalgoimenafirma.bg“ е една дума за браузъра.
 */
.dres-name,
.cart-n,
.sug-name,
.oa-lines span,
.item-h b,
.ocard-h h2{
  word-break:break-word;
  overflow-wrap:anywhere;
}

/* ── общи предпазни мерки ── */
/*
 * НИЩО НЕ ИЗЛИЗА ИЗВЪН ЕКРАНА.
 *
 * Един широк елемент кара цялата страница да се превърта настрани — а
 * човек не разбира кой е виновникът.
 */
@media (max-width:860px){
  /*
   * „overflow-x:hidden“ НА „body“ Е МАХНАТ.
   *
   * Той убива „position:sticky“ на ВСИЧКО вътре — заради него шапката
   * спря да се лепи и менюто увисна в средата на страницата.
   *
   * Причината е в самия стандарт: елемент с ограничено преливане става
   * нова основа за превъртане, а „sticky“ се закача за нея, не за
   * екрана.
   *
   * Широките елементи се оправят поединично, по-долу.
   */

  img,
  svg,
  video,
  iframe{max-width:100%;height:auto}

  pre,
  code{overflow-x:auto;max-width:100%}
}

/* ── най-тесните ── */
/*
 * ПОД 380: тук вече се жертва украса, не съдържание.
 */
@media (max-width:380px){
  .wrap-w,
  .wrap-n{padding-inline:14px}

  .btn{padding:12px 18px;font-size:14px}
  .btn-lg{padding:14px 18px;font-size:15px}

  /* Двойката копчета: едно под друго, вместо смачкани. */
  .hero-cta,
  .of-go,
  .cart-go,
  .ded-hero-go{flex-direction:column;align-items:stretch}

  .hero-cta .btn,
  .of-go .btn,
  .cart-go .btn,
  .ded-hero-go .btn{width:100%}
}


/* ══════════════════════════════════════════════════════════
   ШАПКАТА НА ТЕЛЕФОН
   ══════════════════════════════════════════════════════════ */
/*
 * ХАМБУРГЕРЪТ Е ВДЯСНО, не залепен за логото.
 *
 * В HTML-а той стои веднага след логото — а нищо не го мести. Затова
 * се лепи отляво и изглежда като част от знака.
 *
 * Палецът стига до десния край, не до левия: телефонът се държи с
 * дясната ръка.
 */
@media (max-width:860px){
  .site-header .wrap-w{
    display:flex;align-items:center;gap:10px;
    padding-block:11px;position:relative;
  }

  /* Логото не се разтяга; празното отива веднага след него. */
  .site-header .wrap-w > .brand{flex:0 0 auto;margin-right:auto}

  .site-header .wrap-w > .brand img{width:124px;height:auto}

  /*
   * Редът вдясно: количка, после хамбургер.
   *
   * Количката е ПРЕДИ него, за да не се мести, когато менюто се
   * отвори.
   */
  .site-header .wrap-w > .nav-actions{
    flex:0 0 auto;margin-left:0;order:8;gap:8px;
  }

  .site-header .wrap-w > .nav-toggle{
    flex:0 0 auto;order:9;margin-left:2px;
  }

  /*
   * ЧЕКМЕДЖЕТО ТРЪГВА ПОД ШАПКАТА, не върху нея.
   *
   * Дотук започваше от нулата и покриваше логото — а бутонът за
   * затваряне оставаше отдолу, невидим.
   */
  .nav{
    position:fixed;top:0;right:0;bottom:0;left:auto;
    width:min(86vw, 340px);
    display:flex;flex-direction:column;gap:0;
    background:var(--paper);
    border-left:1px solid var(--line);border-bottom:0;
    box-shadow:-8px 0 32px rgba(14,39,69,.18);
    padding:76px 12px 24px;
    max-height:none;height:100dvh;overflow-y:auto;
    z-index:60;
    transform:translateX(100%);
    transition:transform .24s ease;
  }

  .nav.is-open{display:flex;transform:translateX(0)}

  /*
   * БУТОНЪТ ОСТАВА НАД ЧЕКМЕДЖЕТО.
   *
   * С него се затваря — а под менюто той не се вижда и човек търси
   * изход.
   */
  /*
   * ТУК БЕШЕ „position:relative“ — и той УБИВАШЕ залепването.
   *
   * Шапката е „sticky“ от самото начало на файла. Моето правило я
   * връщаше към нормална и тя спираше да стои горе при превъртане.
   *
   * Сега само слоят се вдига, положението не се пипа.
   */
  .site-header{z-index:75}

  .nav-toggle{
    position:relative;z-index:80;
    width:42px;height:42px;
  }

  /* Отворено: бутонът става розов и показва кръстче. */
  .nav-toggle[aria-expanded="true"]{
    color:var(--rose);border-color:var(--rose);
  }

  /*
   * Затъмнението е ПОД шапката, но над страницата.
   *
   * Без това то покрива бутона и менюто не може да се затвори.
   */
  .nav-veil{z-index:55}

  /* Действията остават видими над затъмнението. */
  .site-header .wrap-w > .nav-actions{position:relative;z-index:71}
}

/*
 * ПОД 420: логото се смалява още.
 *
 * При три неща на един ред — лого, количка, хамбургер — първото трябва
 * да отстъпи.
 */
@media (max-width:420px){
  .site-header .wrap-w{gap:8px;padding-inline:14px}
  .site-header .wrap-w > .brand img{width:104px}

  .nav-toggle{width:40px;height:40px}
  .nav-cart{width:36px;height:36px}
  .nav-cart svg{width:17px;height:17px}

  /* Бутонът „вход“ отпада: количката и менюто са по-важни. */
  .site-header .nav-actions .btn{display:none}
}


/* ══════════════════════════════════════════════════════════
   ШАПКАТА · поправка след проба на телефон
   ══════════════════════════════════════════════════════════ */
/*
 * КОЛИЧКАТА И ХАМБУРГЕРЪТ ОСТАВАХА ВЪРХУ МЕНЮТО.
 *
 * Чекмеджето е „fixed“ и излиза от потока — а шапката, която го носи,
 * няма своя основа. Затова двете плуваха в средата на списъка.
 *
 * Решението: шапката получава фон и остава залепена отгоре.
 */
@media (max-width:860px){
  .site-header{z-index:75;background:var(--paper)}

  /* Чекмеджето тръгва ПОД шапката, не под нулата. */
  .nav{
    top:var(--hd-h, 62px);height:calc(100dvh - var(--hd-h, 62px));
    padding:16px 12px 24px;
  }

  /*
   * МЕНЮТО Е ПОДРАВНЕНО ОТЛЯВО.
   *
   * Центрирано, окото търси началото на всеки ред наново — а списък се
   * чете по левия ръб.
   */
  .nav{align-items:stretch;text-align:left}

  .nav>li{width:100%}

  .nav>li>a,
  .nav>li>.nav-top{
    width:100%;padding:14px 12px;font-size:16px;
    justify-content:flex-start;text-align:left;
    border-radius:8px;
  }

  /* Стрелката отива вдясно, до края на реда. */
  .nav>li>.nav-top svg{margin-left:auto}

  /* Подменютата: с отстъп, за да личи че са вътре. */
  .nav-drop,
  .mega{
    padding-left:12px;margin-left:10px;
    border-left:2px solid var(--line);
  }

  .nav-drop li a,
  .mega li a{
    padding:11px 12px;justify-content:flex-start;text-align:left;
  }
}

/*
 * ВХОДЪТ СЕ ВРЪЩА.
 *
 * Скрих го под 420, за да има място — но той е причината половината
 * хора да отворят шапката.
 *
 * Вместо да изчезва, става само иконка.
 */
@media (max-width:420px){
  .site-header .nav-actions .btn{
    display:inline-flex;
    padding:0;width:36px;height:36px;
    border-radius:9px;
    font-size:0;
  }

  /*
   * Надписът се сменя с иконка на човек.
   *
   * Рисувана в самото правило: отделен файл за един знак се тегли
   * бавно.
   */
  .site-header .nav-actions .btn::before{
    content:'';
    width:17px;height:17px;
    background:currentColor;
    -webkit-mask:var(--ico-user) center/contain no-repeat;
    mask:var(--ico-user) center/contain no-repeat;
  }
}

:root{
  --ico-user:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/><circle cx='12' cy='7' r='4'/></svg>");
}


/* ══════════════════════════════════════════════════════════
   ШАПКАТА · трета поправка
   ══════════════════════════════════════════════════════════ */
/*
 * НАД ШАПКАТА ИМА ОЩЕ ДВЕ ИВИЦИ: промоция и служебна лента.
 *
 * Затова „top:62px“ беше грешно — истинската шапка е много по-ниско, а
 * чекмеджето покриваше логото.
 *
 * ФИКСИРАНО ЧИСЛО НЕ РАБОТИ: промоцията се сменя от настройките, а с
 * дълъг текст става два реда.
 *
 * Решението: шапката се залепва отгоре, а чекмеджето тръгва от НЕЯ —
 * без да се знае колко е висока.
 */
@media (max-width:860px){
  /*
   * Промоцията и служебната се превъртат нормално: те са за четене
   * веднъж, не за връщане.
   */
  .topbar{position:relative;z-index:1}
  .utilbar{display:none}

  /*
   * Шапката е „sticky“ ОТ САМОТО НАЧАЛО на файла — не се пипа.
   *
   * Тук само слоят: чекмеджето трябва да е ПОД нея, за да не покрива
   * логото и количката.
   */
  .site-header{z-index:75;background:var(--paper)}

  /*
   * ЧЕКМЕДЖЕТО Е ВЪТРЕ В ШАПКАТА, не върху страницата.
   *
   * „absolute“ спрямо шапката значи, че то тръгва точно под нея —
   * каквато и да е височината ѝ.
   */
  .site-header .wrap-w{position:relative}

  /*
   * ШАПКАТА СЕ ЛЕПИ, чекмеджето върви с нея.
   *
   * „absolute“ го закачаше за шапката, но тогава тя не можеше да
   * стои горе при превъртане.
   *
   * „fixed“ с изчислена височина решава и двете: шапката е залепена, а
   * менюто тръгва точно под нея — каквато и да е промоцията отгоре.
   */
  .nav{
    position:fixed;
    top:var(--hd-bottom, 62px);
    right:0;left:auto;bottom:auto;
    width:min(88vw, 340px);
    height:auto;max-height:calc(100dvh - var(--hd-bottom, 62px));
    padding:10px;
    border-radius:0 0 0 var(--r-lg, 14px);
  }

  /*
   * КОЛИЧКАТА И „ВХОД“ ОСТАВАТ В ШАПКАТА.
   *
   * На снимката те стояха вътре в чекмеджето — защото „nav-actions“ е
   * след „nav“ в HTML-а, а нищо не ги разделяше.
   */
  .site-header .wrap-w > .nav-actions{
    position:relative;z-index:2;
    order:8;margin-left:0;flex:0 0 auto;
  }

  .site-header .wrap-w > .nav-toggle{
    position:relative;z-index:2;
    order:9;flex:0 0 auto;
  }

  /*
   * ЧЕКМЕДЖЕТО Е ПОД ШАПКАТА по слой.
   *
   * Шапката е 75, менюто 60: така то се плъзга под нея и логото
   * остава видимо.
   */
  .nav{z-index:60}

  .nav-veil{z-index:55}
}

/* Под 420: без промоцията — тя яде половин екран. */
@media (max-width:420px){
  .topbar .cd{display:none}
}


/* ══════════════════════════════════════════════════════════
   ШИРОКИТЕ ЕЛЕМЕНТИ · без да се чупи залепването
   ══════════════════════════════════════════════════════════ */
/*
 * „overflow-x:hidden“ НА „body“ УБИВА „sticky“.
 *
 * Затова широкото се оправя ПОИМЕННО: всеки виновник се свива сам,
 * вместо да се реже цялата страница.
 */
@media (max-width:860px){
  /* Обвивките не пускат съдържание навън. */
  .wrap-w,
  .wrap-n,
  .sec,
  .ord-main,
  .ocard,
  .card,
  .o-card{max-width:100%;min-width:0}

  /*
   * Решетките и редовете: без „min-width:0“ вътрешното съдържание ги
   * разтяга отвътре.
   */
  .ord-grid,
  .plan-grid,
  .ded-plans,
  .ded-cases,
  .ded-incl,
  .pays,
  .otwo,
  .fields{min-width:0}

  .ord-grid > *,
  .plan-grid > *,
  .ded-plans > *,
  .pays > *,
  .otwo > *{min-width:0}

  /* Дългите низове се пренасят, вместо да бутат реда. */
  .mono,
  .dres-name,
  .cart-n,
  .sug-name,
  .oa-lines span,
  .ocard-h h2{min-width:0;overflow-wrap:anywhere}

  /* Полетата не надрастват кутията си. */
  input,
  select,
  textarea{max-width:100%}
}

/* ==== адаптация: край ==== */



/* ==== shared: начало ==== */

/* ══════════════════════════════════════════════════════════
   СПОДЕЛЕН ХОСТИНГ
   ══════════════════════════════════════════════════════════ */

.sh-head{max-width:660px;margin:0 0 clamp(26px,3.5vw,40px)}
.sh-head h2{margin:0 0 12px}
.sh-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.sh-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.sh-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.sh-hero-in{
  display:grid;grid-template-columns:1.1fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.sh-hero h1{color:#fff;margin:0 0 14px}

.sh-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.sh-eyebrow{margin-bottom:16px}

.sh-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.sh-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.sh-notes span{display:inline-flex;align-items:center;gap:7px}
.sh-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:#93dc25;color:#ffffff;
}
.sh-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   СКОРОСТТА
   ══════════════════════════════════════════════════════════ */
/*
 * РИСУВАНА, НЕ ОБЕЩАНА С ДУМИ.
 *
 * „Бърз хостинг“ пише навсякъде. Числото до конкурент е проверимо, а
 * лентата го показва, преди да е прочетено.
 */
.sh-speed{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sh-speed-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:16px;
}

.sh-speed-r{margin-bottom:14px}
.sh-speed-r:last-of-type{margin-bottom:0}

.sh-speed-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:7px;font-size:13px;color:rgba(255,255,255,.72);
}
.sh-speed-t b{font:700 13.5px/1 var(--mono);color:#fff}

.sh-speed-bar{
  height:8px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden;
}
.sh-speed-fill{height:100%;border-radius:99px;background:#93dc25;}
.sh-speed-fill.slow{background:rgba(255,255,255,.28)}

/* Как е мерено: обещание без метод не значи нищо. */
.sh-speed-note{
  margin:16px 0 0;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.1);
  font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.5;
}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ.
 *
 * „align-items:start“ оставяше всяка плочка с нейната си височина —
 * планът със седем реда стърчеше, а бутоните бяха на различни места.
 *
 * „stretch“ ги изравнява, а списъкът вътре се разтяга, за да падне
 * бутонът долу при всички.
 */
.sh-plans{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
  align-items:stretch;
}

.sh-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.sh-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/*
 * Шапката е с еднаква височина: описанието е един или два реда, а без
 * това плочките започват разместени.
 */
.sh-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:96px;
  display:flex;flex-direction:column;justify-content:center;
}
.sh-plan.is-best .sh-plan-h{background:#FDF1F4}

.sh-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.sh-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.sh-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * ПОСЕЩЕНИЯТА СА ГЛАВНОТО ЧИСЛО.
 *
 * „5 GB“ не казва нищо на човек, който не знае колко тежи сайтът му.
 * „До 4000 посещения“ казва.
 */
.sh-plan-v{
  padding:18px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.sh-plan-v b{
  display:block;font:800 1.6rem/1 var(--mono);letter-spacing:-.035em;
}
.sh-plan-v span{
  display:block;font-size:11.5px;color:var(--steel);margin-top:6px;
}

.sh-plan-p{padding:18px 20px;border-bottom:1px solid var(--line)}

.sh-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.sh-plan-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.sh-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Подновяването: изненадата гони клиенти. */
.sh-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/*
 * Списъкът се РАЗТЯГА, останалото не.
 *
 * Така редовете започват на една височина, а празното отива под
 * последния — не между заглавието и цената.
 */
.sh-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:10px;align-content:start;
}

.sh-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.sh-plan-f b{font-weight:700;color:var(--ink)}

.sh-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.sh-fi svg{width:9px;height:9px;stroke-width:3.4}
.sh-fi.no{background:var(--wash);color:var(--steel-lt)}

/* Бутонът е ПОСЛЕДЕН и се долепя за дъното. */
.sh-plan-go{padding:0 20px 20px;margin-top:auto}
.sh-plan-go .btn{width:100%}

.sh-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
/*
 * ИЗВАЖДА СЕ ОТ ПЛОЧКИТЕ.
 *
 * Повторено четири пъти, то удължава всяка и скрива разликите — а
 * разликите са това, което човек сравнява.
 */
.sh-all-sec{padding-block:clamp(30px,4vw,44px)}

.sh-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.sh-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.sh-all-h b{font:700 15px/1.3 var(--sans)}

.sh-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.sh-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   КОЙ ПЛАН
   ══════════════════════════════════════════════════════════ */
.sh-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sh-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sh-case-ic{
  width:42px;height:42px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.sh-case-ic svg{width:20px;height:20px}

.sh-case h3{margin:0 0 7px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em}
.sh-case p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.6}

.sh-case-p{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:99px;background:var(--wash);
  font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.sh-case-p b{font-weight:700}

.sh-ask{margin:26px 0 0;font-size:14px;color:var(--steel)}
.sh-ask a{color:var(--rose);font-weight:600}

/* ══════════════════════════════════════════════════════════
   ЗАЩО ПРИ НАС
   ══════════════════════════════════════════════════════════ */
.sh-why{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sh-why-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sh-why-ic{
  width:40px;height:40px;border-radius:12px;margin-bottom:14px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.sh-why-ic svg{width:19px;height:19px}

/* Числото прави обещанието проверимо. */
.sh-why-n{
  display:inline-block;margin-bottom:10px;padding:3px 9px;border-radius:99px;
  background:var(--wash);color:var(--ink);font:700 11.5px/1 var(--mono);
}

.sh-why-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:6px}
.sh-why-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПРЕНАСЯНЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ТО Е ГЛАВНАТА СПИРАЧКА.
 *
 * Човек със сайт другаде не се бои от цената, а от това да не изгуби
 * нещо. Затова тук са стъпките и какво става, ако се обърка.
 */
.sh-move{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.sh-move h2{color:#fff;margin:0 0 10px}
.sh-move > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.sh-move-steps{display:grid;gap:14px}

.sh-move-s{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.sh-move-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);color:#fff;font:700 12px/1 var(--mono);
}

.sh-move-t b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:3px;
}
.sh-move-t span{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.55}

.sh-move-safe{
  margin-top:20px;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgb(152 219 28 / 35%);border:1px solid rgba(111,217,172,.24);
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.sh-move-safe b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.sh-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.sh-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:680px}

.sh-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.sh-tbl th.best{background:#FBE4EA;color:var(--rose)}

.sh-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.sh-tbl tbody tr:last-child td{border-bottom:0}
.sh-tbl tbody tr:hover{background:var(--wash)}

.sh-tbl td.mono{font-family:var(--mono);font-size:13px}
.sh-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.sh-tbl th:first-child,
.sh-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.sh-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.sh-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sh-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sh-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.sh-rev-stars svg{width:15px;height:15px}

.sh-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.sh-rev-who{display:flex;align-items:center;gap:11px}

.sh-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.sh-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.sh-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.sh-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.sh-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.sh-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.sh-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.sh-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.sh-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.sh-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.sh-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.sh-cta h2{color:#fff;margin:0 0 8px}
.sh-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.sh-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.sh-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.sh-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .sh-plans{grid-template-columns:1fr 1fr}
  .sh-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .sh-hero-in{grid-template-columns:1fr}
  .sh-cases{grid-template-columns:1fr}
  .sh-why{grid-template-columns:1fr 1fr}
  .sh-revs{grid-template-columns:1fr}
  .sh-faq{grid-template-columns:1fr}
  .sh-move{grid-template-columns:1fr}
}

@media (max-width:620px){
  .sh-plans{grid-template-columns:1fr}
  .sh-all-l{grid-template-columns:1fr}
  .sh-why{grid-template-columns:1fr}
  .sh-hero-go .btn{width:100%}
  .sh-cta-go{width:100%}
  .sh-cta-go .btn{flex:1}
}

/* ==== shared: край ==== */

/* ==== wordpress: начало ==== */

/* ══════════════════════════════════════════════════════════
   WORDPRESS ХОСТИНГ
   ══════════════════════════════════════════════════════════ */

.wp-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.wp-head h2{margin:0 0 12px}
.wp-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.wp-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.wp-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.wp-hero-in{
  display:grid;grid-template-columns:1.05fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.wp-hero h1{color:#fff;margin:0 0 14px}

.wp-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.wp-eyebrow{margin-bottom:16px}

.wp-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.wp-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.wp-notes span{display:inline-flex;align-items:center;gap:7px}
.wp-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.3);color:#6FD9AC;
}
.wp-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   ОБНОВЯВАНИЯТА · главният страх
   ══════════════════════════════════════════════════════════ */
/*
 * СТРАХЪТ ОТ ОБНОВЯВАНЕ Е ГЛАВНАТА СПИРАЧКА.
 *
 * Всеки, който е държал WordPress, е виждал бяла страница след
 * обновяване на добавка. Затова ги отлага — и после сайтът бива разбит
 * през стара дупка.
 *
 * Тук се показва КАК се решава, вместо да се обещава „автоматични
 * обновявания“ — което тъкмо плаши.
 */
.wp-flow{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.wp-flow-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

.wp-flow-s{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  padding-bottom:16px;position:relative;
}
.wp-flow-s:last-of-type{padding-bottom:0}

/* Черта между стъпките: тя казва, че вървят по ред. */
.wp-flow-s:not(:last-of-type)::before{
  content:'';position:absolute;left:13px;top:28px;bottom:4px;
  width:2px;background:rgba(255,255,255,.12);
}

.wp-flow-n{
  width:28px;height:28px;border-radius:50%;flex:0 0 auto;z-index:1;
  display:grid;place-items:center;
  background:rgba(255,255,255,.1);color:#fff;
  font:700 12px/1 var(--mono);
}
.wp-flow-s.is-ok .wp-flow-n{background:var(--up, #127A55);color:#fff}
.wp-flow-s.is-ok .wp-flow-n svg{width:13px;height:13px;stroke-width:3.2}

.wp-flow-t b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:3px;
}
.wp-flow-t span{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.55}

.wp-flow-note{
  margin:18px 0 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid rgba(111,217,172,.24);
  font-size:12.5px;color:#6FD9AC;line-height:1.6;
}
.wp-flow-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.wp-plans{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  align-items:stretch;
}

.wp-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.wp-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.wp-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:96px;display:flex;flex-direction:column;justify-content:center;
}
.wp-plan.is-best .wp-plan-h{background:#FDF1F4}

.wp-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.wp-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.wp-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * САЙТОВЕТЕ СА ГЛАВНОТО ЧИСЛО, не посещенията.
 *
 * При WordPress човек мисли „колко сайта ще сложа“, а посетителите
 * рядко ги знае — те остават отдолу, по-дребно.
 */
.wp-plan-v{
  padding:18px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.wp-plan-v b{display:block;font:800 1.6rem/1 var(--mono);letter-spacing:-.035em}
.wp-plan-v span{display:block;font-size:11.5px;color:var(--steel);margin-top:6px}
.wp-plan-v em{
  display:block;font:400 11px/1 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:5px;
}

.wp-plan-p{padding:18px 20px;border-bottom:1px solid var(--line)}

.wp-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.wp-plan-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.wp-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Подновяването: изненадата гони клиенти. */
.wp-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.wp-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:10px;align-content:start;
}

.wp-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.wp-plan-f b{font-weight:700;color:var(--ink)}

.wp-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.wp-fi svg{width:9px;height:9px;stroke-width:3.4}
.wp-fi.no{background:var(--wash);color:var(--steel-lt)}

.wp-plan-go{padding:0 20px 20px;margin-top:auto}
.wp-plan-go .btn{width:100%}

.wp-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
.wp-all-sec{padding-block:clamp(30px,4vw,44px)}

.wp-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.wp-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.wp-all-h b{font:700 15px/1.3 var(--sans)}

.wp-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.wp-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   СИГУРНОСТТА
   ══════════════════════════════════════════════════════════ */
/*
 * WORDPRESS Е НАЙ-АТАКУВАНАТА СИСТЕМА — не защото е лоша, а защото я
 * има навсякъде.
 *
 * Числата от нашите сървъри казват какво се случва наистина, вместо да
 * плашат с общи приказки.
 */
.wp-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:22px}

.wp-fact{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:22px;text-align:center;
}

.wp-fact b{
  display:block;font:800 2rem/1 var(--mono);letter-spacing:-.035em;margin-bottom:8px;
}
.wp-fact span{
  display:block;font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.5;
}

.wp-shield{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}

.wp-shield-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;
}

.wp-shield-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.wp-shield-ic svg{width:18px;height:18px}

.wp-shield-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.wp-shield-i p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   БЪРЗИНАТА
   ══════════════════════════════════════════════════════════ */
/*
 * СРАВНЕНИЕТО Е СЪС СЕБЕ СИ.
 *
 * „При нас с кеш“ срещу „при нас без кеш“ показва какво прави
 * настройката, а не само че сме по-добри от някого.
 */
.wp-speed{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.wp-speed-box{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}

.wp-speed-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);margin-bottom:18px;
}

.wp-speed-r{margin-bottom:16px}
.wp-speed-r:last-of-type{margin-bottom:0}

.wp-speed-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:7px;font-size:13px;color:var(--ink-soft);
}
.wp-speed-t b{font:700 14px/1 var(--mono)}

.wp-speed-bar{height:9px;border-radius:99px;background:var(--wash);overflow:hidden}
.wp-speed-fill{height:100%;border-radius:99px;background:var(--up, #127A55)}
.wp-speed-fill.slow{background:var(--line-2, #C7D1DD)}

.wp-speed-note{
  margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);
  font-size:11.5px;color:var(--steel-lt);line-height:1.5;
}

.wp-speed-l{display:grid;gap:14px}

.wp-speed-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.wp-speed-ic{
  width:36px;height:36px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.wp-speed-ic svg{width:17px;height:17px}

.wp-speed-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.wp-speed-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПРЕНАСЯНЕ
   ══════════════════════════════════════════════════════════ */
.wp-move{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.wp-move h2{color:#fff;margin:0 0 10px}
.wp-move > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.wp-move-steps{display:grid;gap:14px}

.wp-move-s{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.wp-move-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);color:#fff;font:700 12px/1 var(--mono);
}

.wp-move-t b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:3px;
}
.wp-move-t span{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.55}

.wp-move-safe{
  margin-top:20px;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid rgba(111,217,172,.24);
  font-size:12.5px;color:#6FD9AC;line-height:1.6;
}
.wp-move-safe b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   СЛУЧАИТЕ
   ══════════════════════════════════════════════════════════ */
.wp-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.wp-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.wp-case-ic{
  width:42px;height:42px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.wp-case-ic svg{width:20px;height:20px}

.wp-case h3{margin:0 0 7px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em}
.wp-case p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.6}

.wp-case-p{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:99px;background:var(--wash);
  font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.wp-case-p b{font-weight:700}

.wp-ask{margin:26px 0 0;font-size:14px;color:var(--steel)}
.wp-ask a{color:var(--rose);font-weight:600}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */


/* Първата колона остава при превъртане: тя казва кой е редът. */
.wp-tbl th:first-child,
.wp-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.wp-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.wp-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.wp-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.wp-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.wp-rev-stars svg{width:15px;height:15px}

.wp-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.wp-rev-who{display:flex;align-items:center;gap:11px}

.wp-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.wp-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.wp-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.wp-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.wp-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.wp-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.wp-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.wp-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.wp-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.wp-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.wp-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.wp-cta h2{color:#fff;margin:0 0 8px}
.wp-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.wp-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.wp-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.wp-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .wp-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .wp-hero-in{grid-template-columns:1fr}
  .wp-plans{grid-template-columns:1fr}
  .wp-cases{grid-template-columns:1fr}
  .wp-revs{grid-template-columns:1fr}
  .wp-faq{grid-template-columns:1fr}
  .wp-move{grid-template-columns:1fr}
  .wp-speed{grid-template-columns:1fr}
  .wp-shield{grid-template-columns:1fr}
  .wp-facts{grid-template-columns:1fr}
}

@media (max-width:620px){
  .wp-all-l{grid-template-columns:1fr}
  .wp-hero-go .btn{width:100%}
  .wp-cta-go{width:100%}
  .wp-cta-go .btn{flex:1}
}

/* ==== wordpress: край ==== */

/* ==== business: начало ==== */

/* ══════════════════════════════════════════════════════════
   БИЗНЕС ХОСТИНГ
   ══════════════════════════════════════════════════════════ */

.bz-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.bz-head h2{margin:0 0 12px}
.bz-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.bz-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.bz-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.bz-hero-in{
  display:grid;grid-template-columns:1.05fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.bz-hero h1{color:#fff;margin:0 0 14px}

.bz-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.bz-eyebrow{margin-bottom:16px}

.bz-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.bz-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.bz-notes span{display:inline-flex;align-items:center;gap:7px}
.bz-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.3);color:#6FD9AC;
}
.bz-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   ПОЩАТА · главното при фирма
   ══════════════════════════════════════════════════════════ */
/*
 * ФИРМЕНО ПИСМО В СПАМА Е ЗАГУБА, не неудобство.
 *
 * Оферта, която не е стигнала, се брои за неизпратена. А повечето
 * хостинги дават поща „в комплекта“ и не се занимават с това дали тя
 * пристига.
 *
 * Рисуваното писмо се разбира по-бързо от обяснение.
 */
.bz-mail{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.bz-mail-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:16px;
}

.bz-mail-box{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  border-radius:var(--r, 10px);padding:14px 16px;margin-bottom:16px;
}

.bz-mail-from{
  display:flex;align-items:center;gap:10px;margin-bottom:10px;
  padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.08);
}

.bz-mail-av{
  width:30px;height:30px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:#7cbf00;color:#000000;font:700 12px/1 var(--sans);
}

.bz-mail-who{flex:1;min-width:0}
.bz-mail-who b{display:block;font:600 12.5px/1 var(--sans);color:#fff}
.bz-mail-who span{
  display:block;font:400 11px/1 var(--mono);
  color:rgba(255,255,255,.5);margin-top:4px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

.bz-mail-in{
  display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;
  padding:4px 9px;border-radius:99px;
  background:rgb(152 219 28);color:#000000;
  font:700 10px/1 var(--sans);
}
.bz-mail-in svg{width:10px;height:10px;stroke-width:3.2}

.bz-mail-subj{font:600 13px/1.4 var(--sans);color:#fff}

.bz-mail-checks{display:grid;gap:9px}

.bz-mail-c{
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;
  font-size:12.5px;color:rgba(255,255,255,.72);
}

.bz-mail-c i{
  width:17px;height:17px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.28);color:#6FD9AC;
}
.bz-mail-c svg{width:9px;height:9px;stroke-width:3.4}

/* Записът се показва, но не се обяснява: важното е, че е настроен. */
.bz-mail-c code{
  font:700 10px/1 var(--mono);padding:3px 7px;border-radius:5px;
  background:rgba(255,255,255,.08);color:rgba(255,255,255,.6);
}

.bz-mail-note{
  margin:16px 0 0;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.1);
  font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.55;
}

/* ══════════════════════════════════════════════════════════
   КОЛКО СТРУВА СПИРАНЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * ХОРАТА СРАВНЯВАТ ЦЕНИ НА ХОСТИНГ, но не смятат другата страна.
 *
 * Затова тук е сметка, не обещание — това превръща „99,98%“ от число в
 * довод: един час струва повече от година хостинг.
 */
.bz-cost{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.bz-cost-box{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);padding:26px;
}

.bz-cost-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

.bz-cost-r{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1);
  font-size:13.5px;color:rgba(255,255,255,.72);
}
.bz-cost-r:last-of-type{border-bottom:0}
.bz-cost-r b{font:700 15px/1 var(--mono);color:#fff;white-space:nowrap}

.bz-cost-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  margin-top:16px;padding-top:16px;border-top:2px solid rgba(255,255,255,.2);
}
.bz-cost-t span{font:600 14px/1 var(--sans);color:#fff}

/* Сборът е розов: той е загубата, не цената. */
.bz-cost-t b{
  font:800 1.5rem/1 var(--mono);letter-spacing:-.03em;color:#FF8FAB;
}

.bz-cost-note{
  margin:16px 0 0;font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.55;
}

.bz-cost-l{display:grid;gap:16px}

.bz-cost-i{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}

.bz-cost-n{
  font:800 1.4rem/1 var(--mono);letter-spacing:-.03em;
  color:var(--rose);flex:0 0 auto;min-width:76px;
}

.bz-cost-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:5px}
.bz-cost-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.bz-plans{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  align-items:stretch;
}

.bz-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.bz-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.bz-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:96px;display:flex;flex-direction:column;justify-content:center;
}
.bz-plan.is-best .bz-plan-h{background:#FDF1F4}

.bz-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.bz-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.bz-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * ПОЩИТЕ СА ГЛАВНОТО ЧИСЛО тук.
 *
 * Фирма пресмята „колко души ще имат адрес“ преди място и посещения.
 */
.bz-plan-v{
  padding:18px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.bz-plan-v b{display:block;font:800 1.6rem/1 var(--mono);letter-spacing:-.035em}
.bz-plan-v span{display:block;font-size:11.5px;color:var(--steel);margin-top:6px}
.bz-plan-v em{
  display:block;font:400 11px/1 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:5px;
}

.bz-plan-p{padding:18px 20px;border-bottom:1px solid var(--line)}

.bz-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.bz-plan-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.bz-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Подновяването: изненадата гони клиенти. */
.bz-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.bz-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:10px;align-content:start;
}

.bz-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.bz-plan-f b{font-weight:700;color:var(--ink)}

.bz-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.bz-fi svg{width:9px;height:9px;stroke-width:3.4}
.bz-fi.no{background:var(--wash);color:var(--steel-lt)}

.bz-plan-go{padding:0 20px 20px;margin-top:auto}
.bz-plan-go .btn{width:100%}

.bz-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
.bz-all-sec{padding-block:clamp(30px,4vw,44px)}

.bz-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.bz-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.bz-all-h b{font:700 15px/1.3 var(--sans)}

.bz-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.bz-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   ЗА СЧЕТОВОДСТВОТО
   ══════════════════════════════════════════════════════════ */
/*
 * ФИРМА ИМА СЧЕТОВОДИТЕЛ, а той иска документи навреме.
 *
 * Това не се пише никъде, а е истинска причина да смениш доставчика —
 * особено чужд, който издава фактура на английски без ДДС номер.
 */
.bz-acc{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}

.bz-acc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;
}

.bz-acc-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.bz-acc-ic svg{width:18px;height:18px}

.bz-acc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.bz-acc-i p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПОДДРЪЖКАТА
   ══════════════════════════════════════════════════════════ */
/*
 * „24/7“ ПИШЕ НАВСЯКЪДЕ и не значи нищо.
 *
 * Числата казват друго: колко бързо отговаряме, колко се решават от
 * първия човек, и по кои начини.
 */
.bz-sup{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.bz-sup h2{color:#fff;margin:0 0 10px}
.bz-sup > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.bz-sup-nums{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.bz-sup-n{
  background:rgba(255,255,255,.06);border-radius:var(--r, 10px);padding:16px;
  text-align:center;
}
.bz-sup-n b{
  display:block;font:800 1.5rem/1 var(--mono);letter-spacing:-.03em;margin-bottom:7px;
}
.bz-sup-n span{font-size:11.5px;color:rgba(255,255,255,.6);line-height:1.4}

.bz-sup-ways{display:grid;gap:11px}

.bz-sup-w{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;border-radius:var(--r, 10px);background:rgba(255,255,255,.06);
}

.bz-sup-w-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.1);color:#fff;
}
.bz-sup-w-ic svg{width:15px;height:15px}

.bz-sup-w b{flex:1;font:600 13px/1.3 var(--sans);color:#fff}
.bz-sup-w > span:last-child{
  font:700 12px/1 var(--mono);color:#6FD9AC;white-space:nowrap;
}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.bz-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.bz-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px}

.bz-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.bz-tbl th.best{background:#FBE4EA;color:var(--rose)}

.bz-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.bz-tbl tbody tr:last-child td{border-bottom:0}
.bz-tbl tbody tr:hover{background:var(--wash)}

.bz-tbl td.mono{font-family:var(--mono);font-size:13px}
.bz-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.bz-tbl th:first-child,
.bz-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.bz-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   ПРЕНАСЯНЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПРИ ФИРМА ПРЕКЪСВАНЕТО В РАБОТЕН ДЕН Е СКЪПО, а уикендът е буфер.
 */
.bz-move{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(24px,3.5vw,32px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.bz-move h2{margin:0 0 10px}
.bz-move > div > p{
  margin:0 0 20px;font-size:14.5px;color:var(--steel);line-height:1.65;
}

.bz-move-steps{display:grid;gap:14px}

.bz-move-s{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.bz-move-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 12px/1 var(--mono);
}

.bz-move-t b{display:block;font:700 13.5px/1.3 var(--sans);margin-bottom:3px}
.bz-move-t span{font-size:12.5px;color:var(--steel);line-height:1.55}

.bz-move-safe{
  margin-top:20px;padding:13px 15px;border-radius:var(--r, 10px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:12.5px;color:var(--up, #127A55);line-height:1.6;
}
.bz-move-safe b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   СЛУЧАИТЕ
   ══════════════════════════════════════════════════════════ */
.bz-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.bz-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.bz-case-ic{
  width:42px;height:42px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.bz-case-ic svg{width:20px;height:20px}

.bz-case h3{margin:0 0 7px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em}
.bz-case p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.6}

.bz-case-p{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:99px;background:var(--wash);
  font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.bz-case-p b{font-weight:700}

.bz-ask{margin:26px 0 0;font-size:14px;color:var(--steel)}
.bz-ask a{color:var(--rose);font-weight:600}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.bz-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.bz-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.bz-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.bz-rev-stars svg{width:15px;height:15px}

.bz-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.bz-rev-who{display:flex;align-items:center;gap:11px}

.bz-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.bz-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.bz-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.bz-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.bz-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.bz-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.bz-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.bz-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.bz-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.bz-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.bz-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.bz-cta h2{color:#fff;margin:0 0 8px}
.bz-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.bz-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.bz-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.bz-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .bz-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .bz-hero-in{grid-template-columns:1fr}
  .bz-plans{grid-template-columns:1fr}
  .bz-cases{grid-template-columns:1fr}
  .bz-revs{grid-template-columns:1fr}
  .bz-faq{grid-template-columns:1fr}
  .bz-move{grid-template-columns:1fr}
  .bz-cost{grid-template-columns:1fr}
  .bz-acc{grid-template-columns:1fr}
  .bz-sup{grid-template-columns:1fr}
}

@media (max-width:620px){
  .bz-all-l{grid-template-columns:1fr}
  .bz-hero-go .btn{width:100%}
  .bz-cta-go{width:100%}
  .bz-cta-go .btn{flex:1}
  .bz-sup-nums{grid-template-columns:1fr}
  .bz-cost-i{grid-template-columns:1fr}
}

/* ==== business: край ==== */

/* ==== reseller: начало ==== */

/* ══════════════════════════════════════════════════════════
   ХОСТИНГ ЗА ПРЕПРОДАЖБА
   ══════════════════════════════════════════════════════════ */

.rs-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.rs-head h2{margin:0 0 12px}
.rs-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.rs-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.rs-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.rs-hero-in{
  display:grid;grid-template-columns:1fr 1.05fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.rs-hero h1{color:#fff;margin:0 0 14px}

.rs-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.rs-eyebrow{margin-bottom:16px}

.rs-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.rs-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.rs-notes span{display:inline-flex;align-items:center;gap:7px}
.rs-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.rs-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   СМЕТКАТА · колко остава
   ══════════════════════════════════════════════════════════ */
/*
 * ТОВА Е ЕДИНСТВЕНИЯТ ВЪПРОС, който препродавачът има.
 *
 * Не колко GB и не какъв панел — а колко остава за него. Всичко
 * останало се решава, ако числото е добро.
 */
.rs-calc{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.rs-calc-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:16px;
}

.rs-calc-slider{margin-bottom:18px}

.rs-calc-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:12px;font-size:13px;color:rgba(255,255,255,.72);
}
.rs-calc-t b{font:700 17px/1 var(--mono);color:#fff}

/*
 * ИСТИНСКИ ПЛЪЗГАЧ, не рисунка.
 *
 * Рисуваният не работи с клавиатура и с четците на екран — а тук
 * човекът трябва да мести, за да види своята сметка.
 */
.rs-range{
  -webkit-appearance:none;appearance:none;
  width:100%;height:6px;border-radius:99px;margin:0;
  background:linear-gradient(
    to right,
   #7cbf00 0,
    #52a503 var(--rs-pct, 40%),
    rgba(255,255,255,.12) var(--rs-pct, 40%),
    rgba(255,255,255,.12) 100%
  );
  cursor:pointer;
}

.rs-range::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:22px;height:22px;border-radius:50%;border:0;
  background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);cursor:grab;
}
.rs-range::-moz-range-thumb{
  width:22px;height:22px;border-radius:50%;border:0;
  background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);cursor:grab;
}

/* Видим ръб при движение с клавиатура. */
.rs-range:focus-visible{outline:2px solid #6FD9AC;outline-offset:6px}

.rs-calc-marks{
  display:flex;justify-content:space-between;margin-top:8px;
  font:400 10.5px/1 var(--mono);color:rgba(255,255,255,.35);
}

.rs-calc-rows{
  margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);
}

.rs-calc-r{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:10px 0;font-size:13.5px;color:rgba(255,255,255,.72);
}
.rs-calc-r b{font:700 14px/1 var(--mono);color:#fff;white-space:nowrap}

/* Изваденото е розово: то е разход, не приход. */
.rs-calc-r.minus b{color:#FF8FAB}

.rs-calc-t2{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  margin-top:12px;padding-top:14px;border-top:2px solid rgba(255,255,255,.2);
}
.rs-calc-t2 span{font:600 14px/1 var(--sans);color:#fff}
.rs-calc-t2 b{
  font:800 1.6rem/1 var(--mono);letter-spacing:-.03em;color:#6FD9AC;
}

/* При нула не се боядисва зелено: щеше да изглежда като печалба. */
.rs-calc-t2 b.is-thin{color:rgba(255,255,255,.45)}

.rs-calc-note{
  margin:14px 0 0;font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.55;
}

/* ══════════════════════════════════════════════════════════
   БЕЗ НАШЕТО ИМЕ
   ══════════════════════════════════════════════════════════ */
/*
 * КЛИЕНТЪТ НА ПРЕПРОДАВАЧА НЕ БИВА ДА ВИЖДА НАС.
 *
 * Ако види, следващия път ще дойде право при нас — а той губи клиента,
 * който сам е намерил.
 *
 * Рисуваният панел се разбира по-бързо от обяснение.
 */
.rs-white{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.rs-white-box{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

.rs-white-bar{
  display:flex;align-items:center;gap:8px;
  padding:11px 14px;background:var(--wash);border-bottom:1px solid var(--line);
}

.rs-white-dots{display:flex;gap:5px}
.rs-white-dots i{
  width:9px;height:9px;border-radius:50%;background:var(--line-2, #C7D1DD);
}

.rs-white-url{
  flex:1;padding:5px 11px;border-radius:99px;
  background:var(--paper);border:1px solid var(--line);
  font:400 11px/1.3 var(--mono);color:var(--steel);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.rs-white-url b{color:var(--ink);font-weight:700}

.rs-white-body{padding:18px}

.rs-white-logo{
  display:flex;align-items:center;gap:10px;margin-bottom:16px;
  padding-bottom:14px;border-bottom:1px solid var(--line);
}

.rs-white-mark{
  width:30px;height:30px;border-radius:8px;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--blue, #1C5FA8);color:#fff;font:800 13px/1 var(--sans);
}

.rs-white-name{font:700 14px/1 var(--sans)}

.rs-white-rows{display:grid;gap:9px}

.rs-white-r{
  display:flex;align-items:center;gap:10px;
  padding:9px 11px;border-radius:8px;background:var(--wash);
  font-size:12.5px;color:var(--ink-soft);
}
.rs-white-r span{flex:1;min-width:0}
.rs-white-r b{font:600 12px/1 var(--mono);color:var(--ink);white-space:nowrap}

.rs-white-l{display:grid;gap:14px}

.rs-white-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.rs-white-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.rs-white-ic svg{width:16px;height:16px}

.rs-white-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.rs-white-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ЗА ТЕБ ЛИ Е
   ══════════════════════════════════════════════════════════ */
/*
 * ЧЕСТНО СРАВНЕНИЕ: препродажбата не е за всеки.
 *
 * Клиент, купил грешното, се връща ядосан и разказва на другите.
 * По-добре да си тръгне сега, отколкото след три месеца.
 */
.rs-vs{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.rs-vs-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}
.rs-vs-i.is-this{border-color:var(--rose);background:#FDF1F4}

.rs-vs-h{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.rs-vs-h b{flex:1;font:700 15px/1.3 var(--sans)}

.rs-vs-l{list-style:none;padding:0;margin:0;display:grid;gap:11px}

.rs-vs-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.rs-d{
  width:19px;height:19px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;
}
.rs-d svg{width:10px;height:10px;stroke-width:3.2}
.rs-d.yes{background:#E7F5EF;color:var(--up, #127A55)}
.rs-d.no{background:var(--wash);color:var(--steel-lt)}

.rs-vs-go{margin-top:16px}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.rs-plans{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  align-items:stretch;
}

.rs-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.rs-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.rs-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:96px;display:flex;flex-direction:column;justify-content:center;
}
.rs-plan.is-best .rs-plan-h{background:#FDF1F4}

.rs-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.rs-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.rs-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * КЛИЕНТСКИТЕ СМЕТКИ СА ГЛАВНОТО ЧИСЛО.
 *
 * Препродавачът мисли „колко клиента ще сложа“ — това определя и
 * приходите му, и кога ще му е тясно.
 */
.rs-plan-v{
  padding:18px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.rs-plan-v b{display:block;font:800 1.6rem/1 var(--mono);letter-spacing:-.035em}
.rs-plan-v span{display:block;font-size:11.5px;color:var(--steel);margin-top:6px}

/* Печалбата при пълен план: тя е причината да се избере по-голям. */
.rs-plan-v em{
  display:block;font:700 11.5px/1 var(--sans);font-style:normal;
  color:var(--up, #127A55);margin-top:8px;
}

.rs-plan-p{padding:18px 20px;border-bottom:1px solid var(--line)}

.rs-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.rs-plan-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.rs-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Подновяването: изненадата гони клиенти. */
.rs-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.rs-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:10px;align-content:start;
}

.rs-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.rs-plan-f b{font-weight:700;color:var(--ink)}

.rs-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.rs-fi svg{width:9px;height:9px;stroke-width:3.4}
.rs-fi.no{background:var(--wash);color:var(--steel-lt)}

.rs-plan-go{padding:0 20px 20px;margin-top:auto}
.rs-plan-go .btn{width:100%}

.rs-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
.rs-all-sec{padding-block:clamp(30px,4vw,44px)}

.rs-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.rs-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.rs-all-h b{font:700 15px/1.3 var(--sans)}

.rs-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.rs-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   КОЙ ОТГОВАРЯ
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-СТРАШНОТО ЗА ПРЕПРОДАВАЧА: клиент звъни в събота с проблем, който
 * той не може да реши.
 *
 * Затова тук е ясно разделено кой какво поема.
 */
.rs-who{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}

.rs-who-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.rs-who-h{display:flex;align-items:center;gap:11px;margin-bottom:16px}

.rs-who-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;
}
.rs-who-ic svg{width:18px;height:18px}
.rs-who-i.us .rs-who-ic{background:#FDF1F4;color:var(--rose)}
.rs-who-i.you .rs-who-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}

.rs-who-h b{font:700 15px/1.3 var(--sans)}

.rs-who-l{list-style:none;padding:0;margin:0;display:grid;gap:10px}

.rs-who-l li{
  display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;
  font-size:13px;line-height:1.55;color:var(--ink-soft);
}

.rs-who-l i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:7px;
  background:var(--steel-lt);
}

/* Това е ГЛАВНАТА ГАРАНЦИЯ: не оставаш сам с проблема. */
.rs-who-note{
  margin-top:22px;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:13.5px;color:var(--up, #127A55);line-height:1.65;
}
.rs-who-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.rs-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.rs-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px}

.rs-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.rs-tbl th.best{background:#FBE4EA;color:var(--rose)}

.rs-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.rs-tbl tbody tr:last-child td{border-bottom:0}
.rs-tbl tbody tr:hover{background:var(--wash)}

.rs-tbl td.mono{font-family:var(--mono);font-size:13px}
.rs-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.rs-tbl th:first-child,
.rs-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.rs-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   КАК СЕ ЗАПОЧВА
   ══════════════════════════════════════════════════════════ */
.rs-steps{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.rs-steps h2{color:#fff;margin:0 0 10px}
.rs-steps > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.rs-steps-l{display:grid;gap:14px}

.rs-step-s{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.rs-step-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);color:#fff;font:700 12px/1 var(--mono);
}

.rs-step-t b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:3px;
}
.rs-step-t span{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.55}

.rs-steps-note{
  margin-top:20px;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid #7cbf00;
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.rs-steps-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.rs-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.rs-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.rs-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.rs-rev-stars svg{width:15px;height:15px}

.rs-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.rs-rev-who{display:flex;align-items:center;gap:11px}

.rs-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.rs-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.rs-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.rs-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.rs-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.rs-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.rs-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.rs-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.rs-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.rs-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.rs-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.rs-cta h2{color:#fff;margin:0 0 8px}
.rs-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.rs-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.rs-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.rs-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .rs-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .rs-hero-in{grid-template-columns:1fr}
  .rs-plans{grid-template-columns:1fr}
  .rs-revs{grid-template-columns:1fr}
  .rs-faq{grid-template-columns:1fr}
  .rs-steps{grid-template-columns:1fr}
  .rs-white{grid-template-columns:1fr}
  .rs-who{grid-template-columns:1fr}
  .rs-vs{grid-template-columns:1fr}
}

@media (max-width:620px){
  .rs-all-l{grid-template-columns:1fr}
  .rs-hero-go .btn{width:100%}
  .rs-cta-go{width:100%}
  .rs-cta-go .btn{flex:1}

  /* Пръстът иска по-голяма топка. */
  .rs-range::-webkit-slider-thumb{width:26px;height:26px}
  .rs-range::-moz-range-thumb{width:26px;height:26px}
}

/* ==== reseller: край ==== */

/* ==== vps: начало ==== */

/* ══════════════════════════════════════════════════════════
   VPS
   ══════════════════════════════════════════════════════════ */

.vp-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.vp-head h2{margin:0 0 12px}
.vp-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.vp-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.vp-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.vp-hero-in{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.vp-hero h1{color:#fff;margin:0 0 14px}

.vp-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.vp-eyebrow{margin-bottom:16px}

.vp-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.vp-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.vp-notes span{display:inline-flex;align-items:center;gap:7px}
.vp-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.vp-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   ДЯЛОВЕТЕ НА МАШИНАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ГЛАВНАТА РАЗЛИКА СЪС СПОДЕЛЕНИЯ Е ТУК.
 *
 * „Твоите ядра са само твои“ е трудно за обясняване с думи. Лентата с
 * дялове го показва: твоят е розов и назован, съседските са сиви.
 */
.vp-res{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.vp-res-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

.vp-res-row{margin-bottom:16px}
.vp-res-row:last-of-type{margin-bottom:0}

.vp-res-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:8px;font-size:12.5px;color:rgba(255,255,255,.72);
}
.vp-res-t b{font:700 12.5px/1 var(--mono);color:#fff;white-space:nowrap}

.vp-res-bar{
  height:26px;border-radius:8px;overflow:hidden;
  display:flex;gap:2px;background:rgba(255,255,255,.07);padding:2px;
}

.vp-res-part{
  border-radius:6px;display:grid;place-items:center;
  font:700 10px/1 var(--mono);
}
.vp-res-part.other{background:rgba(255,255,255,.09)}

/* Твоят дял: розов и назован. */
.vp-res-part.mine{background:#7cbf00;color:#000000}

.vp-res-note{
  margin:18px 0 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid #7cbf00;
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.vp-res-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ДВАТА ВАРИАНТА · кратко
   ══════════════════════════════════════════════════════════ */
/*
 * КРАТКО НАРОЧНО: пакетите, цените и подробностите за управлението
 * живеят на страницата „managed-vps“.
 *
 * Ако ги повторим тук, двете страници се застъпват — човек намира едно
 * и също на два адреса, а Гугъл ги смята за дублирани.
 */
.vp-fork{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.vp-fork-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
  display:flex;flex-direction:column;
}
.vp-fork-i.is-rec{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

.vp-fork-h{display:flex;align-items:center;gap:11px;margin-bottom:10px}

.vp-fork-ic{
  width:40px;height:40px;border-radius:12px;flex:0 0 auto;
  display:grid;place-items:center;
}
.vp-fork-ic svg{width:19px;height:19px}
.vp-fork-i.is-rec .vp-fork-ic{background:#FDF1F4;color:var(--rose)}
.vp-fork-i.self .vp-fork-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}

.vp-fork-h b{flex:1;font:800 1.15rem/1.2 var(--sans);letter-spacing:-.02em}

.vp-fork-sub{
  margin:0 0 18px;font-size:13.5px;color:var(--ink-soft);line-height:1.65;
  flex:1;
}

.vp-fork-who{
  padding:14px 16px;border-radius:var(--r, 10px);
  font-size:12.5px;line-height:1.6;
}
.vp-fork-i.is-rec .vp-fork-who{background:#FDF1F4;color:var(--rose-lo, #9B2949)}
.vp-fork-i.self .vp-fork-who{background:var(--wash);color:var(--ink-soft)}
.vp-fork-who b{font-weight:700}

.vp-fork-note{
  margin:14px 0 0;font-size:12px;color:var(--steel-lt);
}

/* Връзката към другата страница: там са подробностите. */
.vp-fork-go{margin-top:14px;align-self:flex-start}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.vp-plans{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
  align-items:stretch;
}

.vp-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.vp-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.vp-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:92px;display:flex;flex-direction:column;justify-content:center;
}
.vp-plan.is-best .vp-plan-h{background:#FDF1F4}

.vp-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.vp-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.vp-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * ЯДРАТА И ПАМЕТТА СА ГЛАВНОТО ЧИСЛО.
 *
 * Купувачът на VPS знае какво значат — за разлика от този на споделен
 * хостинг, който мисли в посещения.
 */
.vp-plan-spec{
  padding:16px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);
  display:grid;grid-template-columns:1fr 1fr;gap:2px;text-align:center;
}

.vp-plan-spec div b{
  display:block;font:800 1.3rem/1 var(--mono);letter-spacing:-.035em;
}
.vp-plan-spec div span{
  display:block;font-size:10.5px;color:var(--steel);margin-top:5px;
}

.vp-plan-p{padding:16px 20px;border-bottom:1px solid var(--line)}

.vp-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.vp-plan-p b{font:800 1.45rem/1 var(--mono);letter-spacing:-.035em}
.vp-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Цената на час: причината за черен петък. */
.vp-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.vp-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:9px;align-content:start;
}

.vp-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:12.5px;line-height:1.5;color:var(--ink-soft);
}
.vp-plan-f b{font-weight:700;color:var(--ink)}

.vp-fi{
  width:15px;height:15px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.vp-fi svg{width:8px;height:8px;stroke-width:3.6}
.vp-fi.no{background:var(--wash);color:var(--steel-lt)}

.vp-plan-go{padding:0 20px 20px;margin-top:auto}
.vp-plan-go .btn{width:100%}

.vp-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
.vp-all-sec{padding-block:clamp(30px,4vw,44px)}

.vp-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.vp-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.vp-all-h b{font:700 15px/1.3 var(--sans)}

.vp-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.vp-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   РАСТЕЖЪТ
   ══════════════════════════════════════════════════════════ */
/*
 * ДВЕТЕ НЕЩА, КОИТО САМОСТОЯТЕЛНИЯТ СЪРВЪР НЯМА.
 *
 * Растеж за минути и снимка преди промяна. Това е истинското
 * предимство на VPS, а не цената.
 */
.vp-grow{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.vp-grow-box{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);padding:26px;
}

.vp-grow-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

/* Стъпалата: растежът е по избор, не по договор. */
.vp-grow-steps{display:grid;gap:9px;margin-bottom:18px}

.vp-grow-s{
  display:flex;align-items:center;gap:12px;
  padding:11px 14px;border-radius:var(--r, 10px);background:rgba(255,255,255,.06);
}

/* Текущото положение: то дава опора на окото. */
.vp-grow-s.is-now{
  background:rgba(192,51,92,.2);border:1px solid rgba(192,51,92,.4);
}

.vp-grow-s b{flex:1;font:700 13px/1 var(--mono);color:#fff}
.vp-grow-s span{font:600 12px/1 var(--sans);color:rgba(255,255,255,.55)}
.vp-grow-s.is-now span{color:#FF8FAB}

.vp-grow-time{
  display:flex;align-items:center;gap:9px;
  padding-top:16px;border-top:1px solid rgba(255,255,255,.1);
  font-size:12.5px;color:rgba(255,255,255,.6);
}
.vp-grow-time svg{width:15px;height:15px;flex:0 0 auto}
.vp-grow-time b{font:700 13px/1 var(--mono);color:#6FD9AC}

.vp-grow-l{display:grid;gap:16px}

.vp-grow-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.vp-grow-ic{
  width:36px;height:36px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.vp-grow-ic svg{width:17px;height:17px}

.vp-grow-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:5px}
.vp-grow-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   КЪДЕ СТОИ VPS
   ══════════════════════════════════════════════════════════ */
/*
 * ЧЕСТНО ПОЗИЦИОНИРАНЕ между споделен и самостоятелен.
 *
 * Половината хора, които гледат VPS, не им трябва. Ако го премълчим,
 * купуват грешното и се връщат ядосани.
 */
.vp-where{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.vp-where-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}
.vp-where-i.is-this{border-color:var(--rose);background:#FDF1F4}

.vp-where-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.vp-where-top b{flex:1;font:700 15px/1.3 var(--sans)}

.vp-where-i p{margin:0 0 14px;font-size:13px;color:var(--steel);line-height:1.6}
.vp-where-i.is-this p{color:var(--ink-soft)}

.vp-where-when{
  padding:12px 14px;border-radius:var(--r, 10px);background:var(--wash);
  font-size:12.5px;line-height:1.6;color:var(--ink-soft);
}
.vp-where-i.is-this .vp-where-when{background:rgba(255,255,255,.7)}
.vp-where-when b{font-weight:700;color:var(--ink)}

.vp-where-go{margin-top:14px}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.vp-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.vp-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:680px}

.vp-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.vp-tbl th.best{background:#FBE4EA;color:var(--rose)}

.vp-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.vp-tbl tbody tr:last-child td{border-bottom:0}
.vp-tbl tbody tr:hover{background:var(--wash)}

.vp-tbl td.mono{font-family:var(--mono);font-size:13px}
.vp-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.vp-tbl th:first-child,
.vp-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.vp-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   СИСТЕМИТЕ
   ══════════════════════════════════════════════════════════ */
.vp-os{display:flex;gap:10px;flex-wrap:wrap}

.vp-os-i{
  display:flex;align-items:center;gap:10px;
  padding:12px 16px;border-radius:var(--r, 10px);
  background:var(--paper);border:1px solid var(--line);
}

.vp-os-mark{
  width:28px;height:28px;border-radius:8px;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--wash);color:var(--steel);font:800 11px/1 var(--sans);
}

.vp-os-i b{font:600 13.5px/1 var(--sans)}
.vp-os-i span span{font:400 11.5px/1 var(--sans);color:var(--steel-lt)}

.vp-os-note{margin:18px 0 0;font-size:13px;color:var(--steel);line-height:1.65}
.vp-os-note b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.vp-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.vp-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.vp-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.vp-rev-stars svg{width:15px;height:15px}

.vp-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.vp-rev-who{display:flex;align-items:center;gap:11px}

.vp-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.vp-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.vp-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.vp-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.vp-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.vp-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.vp-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.vp-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.vp-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.vp-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.vp-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.vp-cta h2{color:#fff;margin:0 0 8px}
.vp-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.vp-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.vp-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.vp-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .vp-plans{grid-template-columns:1fr 1fr}
  .vp-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .vp-hero-in{grid-template-columns:1fr}
  .vp-revs{grid-template-columns:1fr}
  .vp-faq{grid-template-columns:1fr}
  .vp-grow{grid-template-columns:1fr}
  .vp-fork{grid-template-columns:1fr}
  .vp-where{grid-template-columns:1fr}
}

@media (max-width:620px){
  .vp-plans{grid-template-columns:1fr}
  .vp-all-l{grid-template-columns:1fr}
  .vp-hero-go .btn{width:100%}
  .vp-cta-go{width:100%}
  .vp-cta-go .btn{flex:1}
  .vp-os-i{flex:1 1 100%}
}

/* ==== vps: край ==== */

/* ==== managed-vps: начало ==== */

/* ══════════════════════════════════════════════════════════
   МЕНИДЖЪР VPS
   ══════════════════════════════════════════════════════════ */

.mv-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.mv-head h2{margin:0 0 12px}
.mv-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.mv-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.mv-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.mv-hero-in{
  display:grid;grid-template-columns:1fr 1.1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.mv-hero h1{color:#fff;margin:0 0 14px}

.mv-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.mv-eyebrow{margin-bottom:16px}

.mv-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.mv-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.mv-notes span{display:inline-flex;align-items:center;gap:7px}
.mv-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.mv-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   НОЩТА · случка по часове
   ══════════════════════════════════════════════════════════ */
/*
 * ПРОБЛЕМЪТ НА УПРАВЛЕНИЕТО Е, ЧЕ ПЛАЩАШ И НЕ ВИЖДАШ НИЩО.
 *
 * Работата е невидима, докато всичко работи — а когато работи, човек си
 * мисли, че плаща за нищо.
 *
 * Случката в три през нощта го показва по-бързо от думи като
 * „проактивна поддръжка“.
 */
.mv-night{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.mv-night-h{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:18px;
}
.mv-night-h span{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);
}
.mv-night-h b{
  font:700 11px/1 var(--mono);color:#6FD9AC;
  padding:4px 9px;border-radius:99px;background:rgba(18,122,85,.24);
  white-space:nowrap;
}

.mv-night-l{display:grid}

.mv-night-r{
  display:grid;grid-template-columns:auto auto 1fr;gap:13px;
  align-items:start;padding-bottom:16px;position:relative;
}
.mv-night-r:last-child{padding-bottom:0}

/* Черта между часовете: тя казва, че вървят по ред. */
.mv-night-r:not(:last-child)::before{
  content:'';position:absolute;left:52px;top:22px;bottom:2px;
  width:2px;background:rgba(255,255,255,.12);
}

.mv-night-t{
  font:700 11.5px/1 var(--mono);color:rgba(255,255,255,.5);
  padding-top:5px;min-width:38px;
}

.mv-night-d{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:3px;
  display:grid;place-items:center;z-index:1;
  background:rgba(255,255,255,.14);
}
.mv-night-d i{
  width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5);
}

/* Началото на случката е червено, краят — зелен. */
.mv-night-r.is-bad .mv-night-d{background:rgba(176,52,44,.3)}
.mv-night-r.is-bad .mv-night-d i{background:#FF8FAB}

.mv-night-r.is-ok .mv-night-d{background:rgba(18,122,85,.3)}
.mv-night-r.is-ok .mv-night-d i{background:#6FD9AC}

.mv-night-x b{
  display:block;font:600 13px/1.4 var(--sans);color:#fff;margin-bottom:3px;
}
.mv-night-x span{font-size:12px;color:rgba(255,255,255,.55);line-height:1.5}

.mv-night-end{
  margin-top:18px;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid #7cbf00;
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.mv-night-end b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   НЕВИДИМАТА РАБОТА
   ══════════════════════════════════════════════════════════ */
/*
 * ДРУГАТА ПОЛОВИНА НА СЪЩИЯ ВЪПРОС: човек вижда сметката, но не вижда
 * работата.
 */
.mv-work{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:22px}

.mv-work-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;text-align:center;
}

.mv-work-i b{
  display:block;font:800 1.7rem/1 var(--mono);letter-spacing:-.035em;
  margin-bottom:8px;
}
.mv-work-i span{display:block;font-size:12px;color:var(--steel);line-height:1.5}

/* ══════════════════════════════════════════════════════════
   ДНЕВНИКЪТ
   ══════════════════════════════════════════════════════════ */
/*
 * „ПРАВИМ МНОГО НЕЩА“ НЕ ЗНАЧИ НИЩО. Ред с дата и какво е направено —
 * значи.
 *
 * Колоната „не си усетил“ е нарочна: тя е целият смисъл на услугата.
 */
.mv-log{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.mv-log-h{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 20px;background:var(--wash);border-bottom:1px solid var(--line);
}
.mv-log-h b{font:700 13.5px/1 var(--sans)}
.mv-log-h span{font:400 11.5px/1 var(--mono);color:var(--steel-lt)}

.mv-log-l{display:grid}

.mv-log-r{
  display:grid;grid-template-columns:auto auto 1fr auto;gap:14px;
  align-items:center;padding:13px 20px;
  border-bottom:1px solid var(--line);font-size:13px;
}
.mv-log-r:last-child{border-bottom:0}

.mv-log-date{
  font:400 11.5px/1 var(--mono);color:var(--steel-lt);min-width:44px;
}

.mv-log-kind{
  font:700 10px/1 var(--sans);padding:4px 8px;border-radius:99px;
  white-space:nowrap;
}
.mv-log-kind.up{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.mv-log-kind.sec{background:#FDF1F4;color:var(--rose)}
.mv-log-kind.fix{background:#FBF4E4;color:var(--warn, #9A6A12)}
.mv-log-kind.bak{background:#E7F5EF;color:var(--up, #127A55)}

.mv-log-r > span:nth-child(3){color:var(--ink-soft);line-height:1.5}

.mv-log-you{
  font:600 11px/1 var(--sans);color:var(--steel-lt);white-space:nowrap;
}

.mv-log-more{
  padding:13px 20px;text-align:center;
  font-size:12.5px;color:var(--steel);background:var(--wash);
}

/* ══════════════════════════════════════════════════════════
   ПАКЕТИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.mv-packs{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  align-items:stretch;
}

.mv-pack{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.mv-pack.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.mv-pack-h{
  padding:22px 22px 18px;border-bottom:1px solid var(--line);position:relative;
  min-height:104px;display:flex;flex-direction:column;justify-content:center;
}
.mv-pack.is-best .mv-pack-h{background:#629308}

.mv-pack-tag{
  position:absolute;top:-1px;right:18px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.mv-pack-n{font:800 1.2rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 5px}
.mv-pack-for{font-size:12.5px;color:var(--steel);margin:0;line-height:1.5}

/*
 * ВРЕМЕТО ЗА ОТГОВОР Е ГЛАВНОТО ЧИСЛО, не списъкът с функции.
 *
 * При управление човек купува спокойствие, а то се мери в минути.
 */
.mv-pack-sla{
  padding:18px 22px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.mv-pack-sla b{display:block;font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.mv-pack-sla span{display:block;font-size:11.5px;color:var(--steel);margin-top:6px}

.mv-pack-p{padding:18px 22px;border-bottom:1px solid var(--line)}
.mv-pack-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.mv-pack-p > span{font-size:12.5px;color:var(--steel);margin-left:3px}
.mv-pack-p em{
  display:block;font:400 11.5px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.mv-pack-f{
  padding:18px 22px;flex:1 0 auto;
  display:grid;gap:11px;align-content:start;
}

.mv-pack-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.mv-pack-f b{font-weight:700;color:var(--ink)}

.mv-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.mv-fi svg{width:9px;height:9px;stroke-width:3.4}
.mv-fi.no{background:var(--wash);color:var(--steel-lt)}

.mv-pack-go{padding:0 22px 22px;margin-top:auto}
.mv-pack-go .btn{width:100%}

.mv-pack-note{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   КОЙ КАКВО ПРАВИ
   ══════════════════════════════════════════════════════════ */
/*
 * НЕЯСНОТАТА ТУК РАЖДА СПОРОВЕ ПОСЛЕ: „управление“ значи различно при
 * всеки доставчик.
 */
.mv-split{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.mv-split-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}
.mv-split-i.us{border-color:rgba(18,122,85,.3)}

.mv-split-h{display:flex;align-items:center;gap:11px;margin-bottom:18px}

.mv-split-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;
}
.mv-split-ic svg{width:18px;height:18px}
.mv-split-i.us .mv-split-ic{background:#E7F5EF;color:var(--up, #127A55)}
.mv-split-i.you .mv-split-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}

.mv-split-h b{font:700 15px/1.3 var(--sans)}

.mv-split-l{list-style:none;padding:0;margin:0;display:grid;gap:11px}

.mv-split-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.mv-split-l i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--steel-lt);
}
.mv-split-i.us .mv-split-l i{background:var(--up, #127A55)}
.mv-split-i.you .mv-split-l i{background:var(--blue, #1C5FA8)}

/*
 * КАКВО НЕ ВЛИЗА · казва се право.
 *
 * Премълчаването изглежда изгодно, докато клиентът не поиска нещо и не
 * получи отказ.
 */
.mv-split-not{
  margin-top:22px;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.2);
  font-size:13px;color:var(--warn, #9A6A12);line-height:1.65;
}
.mv-split-not b{font-weight:700;display:block;margin-bottom:6px}
.mv-split-not ul{margin:0;padding-left:18px}
.mv-split-not li{margin-bottom:4px}

/* ══════════════════════════════════════════════════════════
   СЛУЧАИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * „А АКО СТАНЕ ТОВА?“ — най-честият въпрос преди купуване.
 *
 * Общо обещание не отговаря. Конкретен случай с време и стъпки —
 * отговаря.
 */
.mv-cases{display:grid;gap:12px}

.mv-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.mv-case-q{
  display:flex;align-items:center;gap:13px;
  padding:16px 20px;background:var(--wash);border-bottom:1px solid var(--line);
}

.mv-case-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:#FDF0EE;color:var(--down, #B0342C);
}
.mv-case-ic svg{width:16px;height:16px}

.mv-case-q b{flex:1;font:700 14.5px/1.35 var(--sans)}

.mv-case-a{padding:18px 20px;display:grid;gap:12px}

.mv-case-s{
  display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

/* Времето е отляво: то е отговорът, текстът е обяснението. */
.mv-case-t{
  font:700 11px/1 var(--mono);color:var(--up, #127A55);
  padding:4px 8px;border-radius:99px;background:#E7F5EF;
  white-space:nowrap;min-width:62px;text-align:center;
}

.mv-case-who{
  padding:12px 20px;background:var(--wash);border-top:1px solid var(--line);
  font-size:12.5px;color:var(--steel);
}
.mv-case-who b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.mv-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.mv-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:620px}

.mv-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.mv-tbl th.best{background:#FBE4EA;color:var(--rose)}

.mv-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.mv-tbl tbody tr:last-child td{border-bottom:0}
.mv-tbl tbody tr:hover{background:var(--wash)}

.mv-tbl td.mono{font-family:var(--mono);font-size:13px}
.mv-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.mv-tbl th:first-child,
.mv-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.mv-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.mv-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.mv-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.mv-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.mv-rev-stars svg{width:15px;height:15px}

.mv-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.mv-rev-who{display:flex;align-items:center;gap:11px}

.mv-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.mv-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.mv-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.mv-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.mv-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.mv-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.mv-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.mv-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.mv-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.mv-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.mv-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.mv-cta h2{color:#fff;margin:0 0 8px}
.mv-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.mv-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.mv-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.mv-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .mv-work{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .mv-hero-in{grid-template-columns:1fr}
  .mv-packs{grid-template-columns:1fr}
  .mv-revs{grid-template-columns:1fr}
  .mv-faq{grid-template-columns:1fr}
  .mv-split{grid-template-columns:1fr}

  /* Дневникът: „не си усетил“ пада на нов ред. */
  .mv-log-r{grid-template-columns:auto 1fr;gap:10px}
  .mv-log-you{grid-column:2}
}

@media (max-width:620px){
  .mv-work{grid-template-columns:1fr}
  .mv-hero-go .btn{width:100%}
  .mv-cta-go{width:100%}
  .mv-cta-go .btn{flex:1}

  /* Нощта: точките отпадат, остават часът и текстът. */
  .mv-night-r{grid-template-columns:auto 1fr}
  .mv-night-d{display:none}
  .mv-night-r::before{display:none}

  .mv-case-s{grid-template-columns:1fr}
  .mv-case-t{justify-self:start}
}

/* ==== managed-vps: край ==== */

/* ==== ddos: начало ==== */

/* ══════════════════════════════════════════════════════════
   ЗАЩИТА ОТ АТАКИ
   ══════════════════════════════════════════════════════════ */

.dd-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.dd-head h2{margin:0 0 12px}
.dd-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.dd-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.dd-hero-in{
  display:grid;grid-template-columns:1fr 1.05fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.dd-hero h1{color:#fff;margin:0 0 14px}

.dd-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.dd-eyebrow{margin-bottom:16px}

.dd-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.dd-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.dd-notes span{display:inline-flex;align-items:center;gap:7px}
.dd-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.dd-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   МИНАЛИЯ МЕСЕЦ
   ══════════════════════════════════════════════════════════ */
/*
 * ЧИСЛА ОТ НАШАТА МРЕЖА, не от чужд отчет.
 *
 * Страниците за защита обикновено плашат: „всеки 39 секунди става
 * атака“. Това е чужда статистика и не значи нищо за конкретния сайт.
 */
.dd-month{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.dd-month-h{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:20px;
}
.dd-month-h span{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);
}
.dd-month-h b{
  font:700 11px/1 var(--mono);color:#6FD9AC;
  padding:4px 9px;border-radius:99px;background:rgba(18,122,85,.24);
}

.dd-month-g{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}

.dd-month-i{background:rgba(255,255,255,.06);border-radius:var(--r, 10px);padding:16px}
.dd-month-i b{
  display:block;font:800 1.5rem/1 var(--mono);letter-spacing:-.03em;
  color:#fff;margin-bottom:7px;
}
.dd-month-i span{font-size:11.5px;color:rgba(255,255,255,.55);line-height:1.45}

/* Най-голямата атака: тя дава мащаб на всичко останало. */
.dd-month-big{
  padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(192,51,92,.16);border:1px solid rgba(192,51,92,.34);
}
.dd-month-big b{
  display:block;font:800 1.3rem/1 var(--mono);color:#FF8FAB;margin-bottom:6px;
}
.dd-month-big span{font-size:12px;color:rgba(255,255,255,.6);line-height:1.5}

.dd-month-note{
  margin:16px 0 0;font-size:11.5px;color:rgba(255,255,255,.42);line-height:1.55;
}

/* ══════════════════════════════════════════════════════════
   АТАКА ИЛИ БАВНО
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-ЧЕСТИЯТ ВЪПРОС, и почти никой не му отговаря.
 *
 * Човек вижда бавен сайт и се пита дали го атакуват. Обикновено не го
 * атакуват — но няма как да го разбере сам.
 */
.dd-tell{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.dd-tell-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}
.dd-tell-i.attack{border-color:rgba(176,52,44,.3)}

.dd-tell-h{display:flex;align-items:center;gap:11px;margin-bottom:18px}

.dd-tell-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;
}
.dd-tell-ic svg{width:18px;height:18px}
.dd-tell-i.attack .dd-tell-ic{background:#FDF0EE;color:var(--down, #B0342C)}
.dd-tell-i.slow .dd-tell-ic{background:#FBF4E4;color:var(--warn, #9A6A12)}

.dd-tell-h b{font:700 15px/1.3 var(--sans)}

.dd-tell-l{list-style:none;padding:0;margin:0;display:grid;gap:12px}

.dd-tell-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.dd-tell-l i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--steel-lt);
}
.dd-tell-i.attack .dd-tell-l i{background:var(--down, #B0342C)}
.dd-tell-i.slow .dd-tell-l i{background:var(--warn, #9A6A12)}

/* Какво да направи: без него сравнението е само описание. */
.dd-tell-what{
  margin-top:20px;padding:14px 16px;border-radius:var(--r, 10px);
  font-size:12.5px;line-height:1.6;
}
.dd-tell-i.attack .dd-tell-what{background:#FDF0EE;color:var(--down, #B0342C)}
.dd-tell-i.slow .dd-tell-what{background:#FBF4E4;color:var(--warn, #9A6A12)}
.dd-tell-what b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   СЛОЕВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * „МНОГОСЛОЙНА ЗАЩИТА“ Е ДУМА БЕЗ СЪДЪРЖАНИЕ.
 *
 * Схемата показва в кой момент от пътя се маха кое, а числата отдясно
 * правят обещанието проверимо.
 */
.dd-layers{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,32px);
}

.dd-layers-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:22px;
}

.dd-layer{
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;
  align-items:center;padding:16px 0;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.dd-layer:last-of-type{border-bottom:0}

.dd-layer-n{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.1);color:#fff;font:700 13px/1 var(--mono);
}

.dd-layer-t b{
  display:block;font:700 14px/1.35 var(--sans);color:#fff;margin-bottom:4px;
}
.dd-layer-t span{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.55}

/* Числото прави схемата проверима. */
.dd-layer-cut{text-align:right;flex:0 0 auto}
.dd-layer-cut b{
  display:block;font:700 15px/1 var(--mono);color:#FF8FAB;margin-bottom:4px;
  white-space:nowrap;
}
.dd-layer-cut span{font:400 10.5px/1 var(--sans);color:rgba(255,255,255,.45)}

.dd-layers-end{
  margin-top:20px;padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid rgba(111,217,172,.24);
  display:flex;align-items:center;gap:12px;
  font-size:13px;color:#6FD9AC;line-height:1.6;
}
.dd-layers-end b{font:700 15px/1 var(--mono);white-space:nowrap}

/* ══════════════════════════════════════════════════════════
   ЕДНА АТАКА
   ══════════════════════════════════════════════════════════ */
/*
 * ОБЩОТО ОБЕЩАНИЕ „защитаваме ви“ не казва нищо. Една атака с часове и
 * числа казва какво значи на практика.
 */
.dd-att{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.dd-att-h{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 22px;background:var(--wash);border-bottom:1px solid var(--line);
}
.dd-att-h b{font:700 14px/1 var(--sans)}
.dd-att-h span{font:400 12px/1 var(--mono);color:var(--steel-lt)}

.dd-att-l{padding:20px 22px;display:grid}

.dd-att-r{
  display:grid;grid-template-columns:auto auto 1fr;gap:14px;
  align-items:start;padding-bottom:18px;position:relative;
}
.dd-att-r:last-child{padding-bottom:0}

/* Черта между часовете: тя казва, че вървят по ред. */
.dd-att-r:not(:last-child)::before{
  content:'';position:absolute;left:60px;top:20px;bottom:2px;
  width:2px;background:var(--line);
}

.dd-att-t{
  font:700 11.5px/1 var(--mono);color:var(--steel-lt);
  padding-top:4px;min-width:46px;
}

.dd-att-d{
  width:14px;height:14px;border-radius:50%;flex:0 0 auto;margin-top:2px;
  display:grid;place-items:center;z-index:1;background:var(--wash-2, #EDF1F6);
}
.dd-att-d i{width:6px;height:6px;border-radius:50%;background:var(--steel-lt)}

/* Началото е червено, краят — зелен. */
.dd-att-r.is-bad .dd-att-d{background:#FDF0EE}
.dd-att-r.is-bad .dd-att-d i{background:var(--down, #B0342C)}
.dd-att-r.is-ok .dd-att-d{background:#E7F5EF}
.dd-att-r.is-ok .dd-att-d i{background:var(--up, #127A55)}

.dd-att-x b{display:block;font:600 13.5px/1.4 var(--sans);margin-bottom:3px}
.dd-att-x span{font-size:12.5px;color:var(--steel);line-height:1.55}

.dd-att-end{
  padding:16px 22px;background:#E7F5EF;border-top:1px solid rgba(18,122,85,.2);
  font-size:13px;color:var(--up, #127A55);line-height:1.6;
}
.dd-att-end b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ГРАНИЦИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЧЕСТНИТЕ ГРАНИЦИ РЯДКО СЕ ПИШАТ, а точно те строят доверие.
 *
 * Всеки обещава „пълна защита“. Никой не казва какво става над
 * определен размер, или при атака, която прилича на истински хора.
 */
.dd-limits{
  background:#FBF4E4;border:1px solid rgba(154,106,18,.24);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,28px);
}

.dd-limits-h{display:flex;align-items:center;gap:12px;margin-bottom:18px}

.dd-limits-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(154,106,18,.16);color:var(--warn, #9A6A12);
}
.dd-limits-ic svg{width:17px;height:17px}

.dd-limits-h b{font:700 15.5px/1.3 var(--sans);color:var(--warn, #9A6A12)}

.dd-limits-l{display:grid;gap:16px}

.dd-limits-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.dd-limits-i > i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--warn, #9A6A12);
}

.dd-limits-i b{
  display:block;font:700 13.5px/1.35 var(--sans);
  color:var(--warn, #9A6A12);margin-bottom:4px;
}
.dd-limits-i p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   КАКВО ПРАВИШ ТИ
   ══════════════════════════════════════════════════════════ */
/*
 * ОТГОВОРЪТ Е „НИЩО“ — и точно това трябва да се каже право.
 *
 * Човек, който чете за атаки, започва да търси какво да настрои.
 */
.dd-you{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.dd-you-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

/* „Нищо“ е най-важното — то е с друг цвят. */
.dd-you-i.big{border-color:rgba(18,122,85,.3);background:#E7F5EF}

.dd-you-ic{
  width:40px;height:40px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.dd-you-ic svg{width:19px;height:19px}
.dd-you-i.big .dd-you-ic{background:rgba(18,122,85,.14);color:var(--up, #127A55)}

.dd-you-i b{display:block;font:700 15px/1.35 var(--sans);margin-bottom:7px}
.dd-you-i.big b{color:var(--up, #127A55)}
.dd-you-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}
.dd-you-i.big p{color:var(--ink-soft)}

/* ══════════════════════════════════════════════════════════
   ЗА КОГО
   ══════════════════════════════════════════════════════════ */
.dd-who{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}

.dd-who-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.dd-who-ic{
  width:36px;height:36px;border-radius:10px;margin-bottom:14px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.dd-who-ic svg{width:17px;height:17px}

.dd-who-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.dd-who-i p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.dd-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.dd-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.dd-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.dd-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.dd-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.dd-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.dd-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.dd-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.dd-cta h2{color:#fff;margin:0 0 8px}
.dd-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:460px}

.dd-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.dd-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.dd-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .dd-who{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .dd-hero-in{grid-template-columns:1fr}
  .dd-tell{grid-template-columns:1fr}
  .dd-you{grid-template-columns:1fr}
  .dd-faq{grid-template-columns:1fr}
}

@media (max-width:620px){
  .dd-who{grid-template-columns:1fr}
  .dd-month-g{grid-template-columns:1fr}
  .dd-hero-go .btn{width:100%}
  .dd-cta-go{width:100%}
  .dd-cta-go .btn{flex:1}

  /* Числото пада под текста, вместо да го смачква. */
  .dd-layer{grid-template-columns:auto 1fr;gap:12px}
  .dd-layer-cut{grid-column:2;text-align:left}

  /* Часовете остават, точките отпадат. */
  .dd-att-r{grid-template-columns:auto 1fr}
  .dd-att-d{display:none}
  .dd-att-r::before{display:none}
}

/* ==== ddos: край ==== */

/* ==== ssl: начало ==== */

/* ══════════════════════════════════════════════════════════
   СЕРТИФИКАТИ ЗА ЗАЩИТА
   ══════════════════════════════════════════════════════════ */

.sl-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.sl-head h2{margin:0 0 12px}
.sl-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.sl-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.sl-hero-in{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.sl-hero h1{color:#fff;margin:0 0 14px}

.sl-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.sl-eyebrow{margin-bottom:16px}

.sl-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.sl-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.sl-notes span{display:inline-flex;align-items:center;gap:7px}
.sl-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.sl-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НА БРАУЗЪРА
   ══════════════════════════════════════════════════════════ */
/*
 * ТОВА, КОЕТО ЧОВЕК НАИСТИНА ВИЖДА.
 *
 * Обясненията говорят за „криптиране“ и „удостоверяване“. Човек вижда
 * едно катинарче и се пита дали е наред.
 */
.sl-bar-box{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sl-bar-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

.sl-bar{
  display:flex;align-items:center;gap:10px;
  padding:11px 14px;border-radius:99px;margin-bottom:9px;
  background:rgba(255,255,255,.08);
}

.sl-bar-ic{width:18px;height:18px;flex:0 0 auto;display:grid;place-items:center}
.sl-bar-ic svg{width:14px;height:14px;stroke-width:2}

.sl-bar-url{
  flex:1;min-width:0;font:400 12.5px/1.3 var(--mono);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

.sl-bar.ok .sl-bar-ic{color:#6FD9AC}
.sl-bar.ok .sl-bar-url{color:rgba(255,255,255,.85)}
.sl-bar.ok .sl-bar-url b{color:#fff;font-weight:700}

.sl-bar.warn{background:rgba(154,106,18,.2)}
.sl-bar.warn .sl-bar-ic{color:#F5C86B}
.sl-bar.warn .sl-bar-url{color:rgba(255,255,255,.7)}

.sl-bar.bad{background:rgba(176,52,44,.22)}
.sl-bar.bad .sl-bar-ic{color:#FF8FAB}
.sl-bar.bad .sl-bar-url{color:rgba(255,255,255,.7)}

.sl-bar-say{
  font:700 10px/1 var(--sans);padding:4px 9px;border-radius:99px;
  white-space:nowrap;flex:0 0 auto;
}
.sl-bar.ok .sl-bar-say{background:rgba(18,122,85,.3);color:#6FD9AC}
.sl-bar.warn .sl-bar-say{background:rgba(154,106,18,.3);color:#F5C86B}
.sl-bar.bad .sl-bar-say{background:rgba(176,52,44,.3);color:#FF8FAB}

.sl-bar-note{
  margin:18px 0 0;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid #7cbf00;
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.sl-bar-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   НЕДОРАЗУМЕНИЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-СКЪПОТО НЕДОРАЗУМЕНИЕ В ИНТЕРНЕТ.
 *
 * Хората мислят, че катинарчето значи „сайтът е честен“. То казва само,
 * че връзката не се подслушва.
 *
 * Измамните сайтове също имат сертификат: безплатен е и се взима за
 * минута, точно както нашият.
 */
.sl-myth{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.sl-myth-i{
  border-radius:var(--r-lg, 16px);padding:24px;
  border:1px solid var(--line);background:var(--paper);
}
.sl-myth-i.no{border-color:rgba(176,52,44,.3);background:#FDF0EE}
.sl-myth-i.yes{border-color:rgba(18,122,85,.3);background:#E7F5EF}

.sl-myth-h{display:flex;align-items:center;gap:11px;margin-bottom:16px}

.sl-myth-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
}
.sl-myth-ic svg{width:17px;height:17px}
.sl-myth-i.no .sl-myth-ic{background:rgba(176,52,44,.14);color:var(--down, #B0342C)}
.sl-myth-i.yes .sl-myth-ic{background:rgba(18,122,85,.14);color:var(--up, #127A55)}

.sl-myth-h b{font:700 15px/1.3 var(--sans)}
.sl-myth-i.no .sl-myth-h b{color:var(--down, #B0342C)}
.sl-myth-i.yes .sl-myth-h b{color:var(--up, #127A55)}

.sl-myth-l{list-style:none;padding:0;margin:0;display:grid;gap:11px}

.sl-myth-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.sl-myth-l i{width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px}
.sl-myth-i.no .sl-myth-l i{background:var(--down, #B0342C)}
.sl-myth-i.yes .sl-myth-l i{background:var(--up, #127A55)}

/* Това е главното изречение на раздела. */
.sl-myth-end{
  margin-top:22px;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.24);
  font-size:13.5px;color:var(--warn, #9A6A12);line-height:1.65;
}
.sl-myth-end b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   СРАВНЕНИЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * ТУК СЕ КАЗВА НЕЩО, КОЕТО НЕ ПРОДАВА.
 *
 * Първите четири реда са „еднакво“ — това е главното, което страницата
 * казва.
 */
.sl-cmp{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.sl-cmp table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:560px}

.sl-cmp th{
  text-align:left;padding:14px 18px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

/* Безплатната колона е зелена: тя е препоръката. */
.sl-cmp th.free{background:#E7F5EF;color:var(--up, #127A55)}

.sl-cmp td{padding:14px 18px;border-bottom:1px solid var(--line)}
.sl-cmp tbody tr:last-child td{border-bottom:0}
.sl-cmp tbody tr:hover{background:var(--wash)}

.sl-cmp td.free{background:#E7F5EF}
.sl-cmp td b{font-weight:700}

.sl-cmp th:first-child,
.sl-cmp td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.sl-cmp th:first-child{background:var(--wash)}

.sl-same{
  display:inline-flex;align-items:center;gap:6px;
  font:600 12px/1 var(--sans);color:var(--up, #127A55);
}
.sl-same svg{width:12px;height:12px;stroke-width:3.2}

.sl-cmp-after{
  margin:22px 0 0;padding:18px 20px;border-radius:var(--r-lg, 16px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:14px;color:var(--up, #127A55);line-height:1.65;
}
.sl-cmp-after b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   КОГА ПЛАТЕНИЯТ
   ══════════════════════════════════════════════════════════ */
.sl-when{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sl-when-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sl-when-ic{
  width:40px;height:40px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.sl-when-ic svg{width:19px;height:19px}

.sl-when-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:7px}
.sl-when-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

.sl-when-note{margin:22px 0 0;font-size:13.5px;color:var(--steel);line-height:1.65}
.sl-when-note b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ПОДНОВЯВАНЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * ГЛАВНИЯТ СТРАХ: изтекъл сертификат прави сайта червен, а собственикът
 * научава от клиент.
 *
 * Затова тук е показано кога какво става — с дни, не с обещания.
 */
.sl-renew{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,34px);
}

.sl-renew-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:22px;
}

/* Лентата на живота: 90 дни, с отбелязано подновяване. */
.sl-life{margin-bottom:24px}

.sl-life-bar{
  height:34px;border-radius:10px;overflow:hidden;display:flex;
  background:rgba(255,255,255,.08);padding:3px;gap:3px;
}

.sl-life-p{
  border-radius:8px;display:grid;place-items:center;
  font:700 11px/1 var(--mono);overflow:hidden;white-space:nowrap;
}
.sl-life-p.used{background:rgba(255,255,255,.12);color:rgba(255,255,255,.6)}
.sl-life-p.act{background:var(--up, #127A55);color:#fff}
.sl-life-p.left{background:rgba(255,255,255,.08);color:rgba(255,255,255,.35)}

.sl-life-marks{
  display:flex;justify-content:space-between;margin-top:10px;
  font:400 11px/1 var(--mono);color:rgba(255,255,255,.4);
}

.sl-renew-l{display:grid;gap:14px}

.sl-renew-r{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}

.sl-renew-d{
  font:700 12px/1 var(--mono);color:#6FD9AC;flex:0 0 auto;
  padding:5px 10px;border-radius:99px;background:rgba(18,122,85,.24);
  min-width:74px;text-align:center;white-space:nowrap;
}

.sl-renew-t b{
  display:block;font:700 13.5px/1.35 var(--sans);color:#fff;margin-bottom:3px;
}
.sl-renew-t span{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.55}

.sl-renew-end{
  margin-top:22px;padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid rgba(111,217,172,.24);
  font-size:12.5px;color:#6FD9AC;line-height:1.6;
}
.sl-renew-end b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЧЕСТИТЕ ПРОБЛЕМИ
   ══════════════════════════════════════════════════════════ */
/*
 * ТРИТЕ НЕЩА, КОИТО ГОНЯТ ХОРАТА В ПОДДРЪЖКАТА.
 *
 * Всичките са с прост признак и прост отговор — но никой не ги обяснява
 * на човешки език.
 */
.sl-probs{display:grid;gap:12px}

.sl-prob{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.sl-prob-q{
  display:flex;align-items:center;gap:13px;
  padding:16px 20px;background:var(--wash);border-bottom:1px solid var(--line);
}

.sl-prob-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:#FBF4E4;color:var(--warn, #9A6A12);
}
.sl-prob-ic svg{width:16px;height:16px}

.sl-prob-q b{flex:1;font:700 14.5px/1.35 var(--sans)}

.sl-prob-a{padding:18px 20px}

.sl-prob-a p{margin:0 0 12px;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.sl-prob-a p:last-child{margin-bottom:0}
.sl-prob-a b{color:var(--ink);font-weight:700}

/*
 * Примерът за грешката: разликата е ЕДНА БУКВА, затова се показва,
 * вместо да се обяснява.
 */
.sl-prob-code{
  margin:12px 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:var(--navy-deep, #0A1D33);color:rgba(255,255,255,.8);
  font:400 12px/1.6 var(--mono);
  overflow-x:auto;
}
.sl-prob-code b{color:#FF8FAB;font-weight:700}

/* ══════════════════════════════════════════════════════════
   ВИДОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * DV, OV И EV не значат нищо на човек извън бранша. Обяснени с това
 * какво ПРОВЕРЯВА издателят — значат.
 */
.sl-kinds{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sl-kind{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

/* Този, който човекът вече има. */
.sl-kind.is-yours{border-color:var(--up, #127A55);background:#E7F5EF}

.sl-kind-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}

.sl-kind-tag{
  font:800 11px/1 var(--mono);padding:5px 9px;border-radius:6px;
  background:var(--wash);color:var(--steel);
}
.sl-kind.is-yours .sl-kind-tag{
  background:rgba(18,122,85,.16);color:var(--up, #127A55);
}

.sl-kind-top b{flex:1;font:700 14.5px/1.3 var(--sans)}

.sl-kind-what{font-size:12.5px;color:var(--steel);line-height:1.6;margin:0 0 14px}
.sl-kind.is-yours .sl-kind-what{color:var(--ink-soft)}

.sl-kind-check{
  padding:12px 14px;border-radius:var(--r, 10px);background:var(--wash);
  font-size:12.5px;line-height:1.6;color:var(--ink-soft);
}
.sl-kind.is-yours .sl-kind-check{background:rgba(255,255,255,.7)}
.sl-kind-check b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.sl-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.sl-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.sl-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.sl-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.sl-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.sl-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.sl-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.sl-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.sl-cta h2{color:#fff;margin:0 0 8px}
.sl-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:460px}

.sl-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.sl-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.sl-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1000px){
  .sl-hero-in{grid-template-columns:1fr}
  .sl-myth{grid-template-columns:1fr}
  .sl-when{grid-template-columns:1fr}
  .sl-kinds{grid-template-columns:1fr}
  .sl-faq{grid-template-columns:1fr}
}

@media (max-width:620px){
  .sl-hero-go .btn{width:100%}
  .sl-cta-go{width:100%}
  .sl-cta-go .btn{flex:1}

  /* Денят пада над текста, вместо да го смачква. */
  .sl-renew-r{grid-template-columns:1fr}
  .sl-renew-d{justify-self:start}

  .sl-life-p{font-size:10px}
}

/* ==== ssl: край ==== */

/* ==== kontakti: начало ==== */

/* ══════════════════════════════════════════════════════════
   КОНТАКТИ
   ══════════════════════════════════════════════════════════ */

.kt-head{max-width:660px;margin:0 0 clamp(24px,3vw,36px)}
.kt-head h2{margin:0 0 12px}
.kt-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА · телефонът е първи
   ══════════════════════════════════════════════════════════ */
/*
 * ПОЛОВИНАТА ХОРА ВЛИЗАТ САМО ЗА ТЕЛЕФОНА.
 *
 * Затова той е първото нещо на екрана — едър, натискаем, без да се
 * търси.
 */
.kt-hero{
  background:var(--navy);color:#fff;
  padding:clamp(36px,5vw,58px) 0 clamp(32px,4.5vw,50px);
}

.kt-hero h1{color:#fff;margin:0 0 12px}

.kt-hero > .wrap-w > p{
  color:rgba(255,255,255,.72);font-size:clamp(15px,1.7vw,16.5px);
  margin:0 0 30px;max-width:560px;line-height:1.65;
}

.kt-big{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.kt-big-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg, 16px);padding:22px;
  text-decoration:none;color:inherit;
  display:flex;flex-direction:column;
  transition:background .15s,border-color .15s;
}
.kt-big-i:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22)}

.kt-big-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}

.kt-big-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.1);color:#fff;
}
.kt-big-ic svg{width:16px;height:16px}

.kt-big-top b{
  font:700 11.5px/1 var(--sans);letter-spacing:.05em;text-transform:uppercase;
  color:rgba(255,255,255,.55);
}

/* Самото число е главното: чете се отдалеч. */
.kt-big-v{
  font:800 clamp(1.15rem,2.2vw,1.5rem)/1.15 var(--mono);
  letter-spacing:-.02em;color:#fff;margin-bottom:8px;word-break:break-word;
}

.kt-big-w{
  font-size:12.5px;color:rgba(255,255,255,.5);line-height:1.5;margin-top:auto;
}

/* Живото състояние: казва повече от „24/7 поддръжка“. */
.kt-now{
  display:inline-flex;align-items:center;gap:10px;
  margin-top:22px;padding:11px 18px;border-radius:99px;
  background:rgba(18,122,85,.2);border:1px solid rgba(111,217,172,.3);
  font-size:13px;color:#6FD9AC;
}

.kt-now-dot{
  width:8px;height:8px;border-radius:50%;background:#6FD9AC;flex:0 0 auto;
  box-shadow:0 0 0 4px rgba(111,217,172,.2);
}
.kt-now b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ФОРМАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ГЛАВНОТО НА СТРАНИЦАТА: човек влиза в „Контакти“, за да напише нещо
 * НА МЯСТО — не за да отваря пощата си.
 */
.kt-form-wrap{
  display:grid;grid-template-columns:1.25fr 1fr;
  gap:clamp(24px,3.5vw,44px);align-items:start;
}

.kt-form{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Капанът за машини: човек не го вижда, четците го прескачат. */
.kt-trap{
  position:absolute;left:-9999px;width:1px;height:1px;
  opacity:0;pointer-events:none;
}

.kt-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
.kt-one{margin-bottom:16px}

.kt-l{
  display:block;font:600 12.5px/1 var(--sans);color:var(--ink-soft);
  margin-bottom:7px;
}
.kt-l em{font-style:normal;color:var(--steel-lt);font-weight:400}

.kt-in,
.kt-sel,
.kt-ta{
  width:100%;padding:12px 14px;border-radius:var(--r, 10px);
  border:1px solid var(--line);background:var(--paper);
  font:400 14.5px/1.4 var(--sans);color:var(--ink);
  transition:border-color .15s,box-shadow .15s;
}

.kt-in:focus,
.kt-sel:focus,
.kt-ta:focus{
  outline:none;border-color:var(--rose);
  box-shadow:0 0 0 3px rgba(192,51,92,.12);
}

.kt-ta{min-height:130px;resize:vertical;line-height:1.6}

.kt-sel{
  appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2356677F' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
  background-size:18px;padding-right:40px;
}

/*
 * ПОЛЕТО, КОЕТО СЕ ПОЯВЯВА според темата.
 *
 * Пунктираният ръб казва, че не е винаги там.
 */
.kt-extra{
  padding:16px;border-radius:var(--r, 10px);margin-bottom:16px;
  background:var(--wash);border:1px dashed var(--line-2, #C7D1DD);
}
.kt-extra[hidden]{display:none}

.kt-extra-h{
  display:flex;align-items:center;gap:8px;margin-bottom:12px;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}
.kt-extra-h svg{width:13px;height:13px;flex:0 0 auto}

.kt-hint{margin:7px 0 0;font-size:12px;color:var(--steel-lt);line-height:1.5}

.kt-check{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  margin-bottom:20px;font-size:12.5px;color:var(--steel);line-height:1.55;
  cursor:pointer;
}
.kt-check input{
  width:18px;height:18px;margin:2px 0 0;accent-color:var(--rose);cursor:pointer;
}
.kt-check a{color:var(--rose);font-weight:600}

.kt-go{display:flex;align-items:center;gap:16px;flex-wrap:wrap}

.kt-note{font-size:12.5px;color:var(--steel-lt);line-height:1.5}
.kt-note b{color:var(--ink-soft);font-weight:600}

/*
 * СЪОБЩЕНИЕТО СЛЕД ИЗПРАЩАНЕ.
 *
 * Прави се от кода, затова тук е само видът.
 */
.kt-said{
  padding:14px 16px;border-radius:var(--r, 10px);margin-bottom:16px;
  font-size:13.5px;line-height:1.6;font-weight:600;
}
.kt-said.is-ok{
  background:#E7F5EF;border:1px solid rgba(18,122,85,.24);
  color:var(--up, #127A55);
}
.kt-said.is-bad{
  background:#FDF0EE;border:1px solid rgba(176,52,44,.24);
  color:var(--down, #B0342C);
}

/* ══════════════════════════════════════════════════════════
   ОТСТРАНИ
   ══════════════════════════════════════════════════════════ */
.kt-aside{display:grid;gap:14px}

.kt-card{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

/* Спешното: то не бива да се търси в списък. */
.kt-card.urgent{border-color:rgba(176,52,44,.3);background:#FDF0EE}

.kt-card-h{display:flex;align-items:center;gap:11px;margin-bottom:14px}

.kt-card-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.kt-card.urgent .kt-card-ic{background:rgba(176,52,44,.14);color:var(--down, #B0342C)}
.kt-card.blue .kt-card-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.kt-card-ic svg{width:16px;height:16px}

.kt-card-h b{font:700 14.5px/1.3 var(--sans)}
.kt-card.urgent .kt-card-h b{color:var(--down, #B0342C)}

.kt-card p{margin:0 0 14px;font-size:13px;color:var(--steel);line-height:1.6}
.kt-card.urgent p{color:var(--ink-soft)}
.kt-card p:last-child{margin-bottom:0}

.kt-card .btn{width:100%}

/* Работното време: ясен блок, не изречение в текста. */
.kt-hours{display:grid;gap:9px}

.kt-hours-r{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:9px 12px;border-radius:8px;background:var(--wash);
  font-size:12.5px;
}
.kt-hours-r span{color:var(--ink-soft)}
.kt-hours-r b{font:700 12px/1 var(--mono);color:var(--ink);white-space:nowrap}

/* Денонощното е зелено: то е най-търсеното. */
.kt-hours-r.all{background:#E7F5EF}
.kt-hours-r.all b{color:var(--up, #127A55)}

/* ══════════════════════════════════════════════════════════
   АДРЕСЪТ И КАРТАТА
   ══════════════════════════════════════════════════════════ */
.kt-place{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.kt-place-in{display:grid;grid-template-columns:1fr 1fr}

.kt-place-t{padding:clamp(24px,3.5vw,32px)}
.kt-place-t h3{margin:0 0 14px}

.kt-addr{display:grid;gap:14px;margin-bottom:20px}

.kt-addr-r{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.kt-addr-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.kt-addr-ic svg{width:15px;height:15px}

.kt-addr-r b{
  display:block;font:600 12px/1 var(--sans);color:var(--steel-lt);margin-bottom:5px;
}
.kt-addr-r span span{font-size:13.5px;color:var(--ink);line-height:1.55}
.kt-addr-r a{
  color:var(--ink);text-decoration:none;
  border-bottom:1px solid var(--line-2, #C7D1DD);
}
.kt-addr-r a:hover{border-color:var(--rose)}

/* „Обади се, преди да дойдеш“: казва се право. */
.kt-place-say{
  padding:13px 15px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.2);
  font-size:12.5px;color:var(--warn, #9A6A12);line-height:1.6;
}
.kt-place-say b{font-weight:700}

/*
 * РИСУВАНА КАРТА.
 *
 * Истинската иска чужд скрипт, забавя страницата и следи посетителите.
 * Бутонът отваря истинските карти, ако някой наистина тръгва.
 */
.kt-map{
  background:var(--navy);position:relative;min-height:300px;
  display:grid;place-items:center;overflow:hidden;
}

.kt-map-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:34px 34px;
}

.kt-map-road{position:absolute;background:rgba(255,255,255,.07)}
.kt-map-road.r1{left:0;right:0;top:40%;height:12px}
.kt-map-road.r2{left:0;right:0;top:70%;height:7px}
.kt-map-road.r3{top:0;bottom:0;left:32%;width:9px}
.kt-map-road.r4{top:0;bottom:0;left:74%;width:6px}

.kt-map-pin{position:relative;z-index:2;text-align:center;padding:0 16px}

.kt-map-dot{
  width:22px;height:22px;border-radius:50%;margin:0 auto 12px;
  background:var(--rose);
  box-shadow:0 0 0 8px rgba(192,51,92,.24), 0 0 0 18px rgba(192,51,92,.1);
}

.kt-map-name{font:700 13px/1 var(--sans);color:#fff;margin-bottom:5px}
.kt-map-city{font:400 11.5px/1.4 var(--mono);color:rgba(255,255,255,.5)}

.kt-map-go{position:absolute;bottom:16px;left:16px;right:16px;z-index:2}
.kt-map-go .btn{width:100%}

/* ══════════════════════════════════════════════════════════
   ДАННИ ЗА ФАКТУРИ
   ══════════════════════════════════════════════════════════ */
.kt-firm{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.kt-firm-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}

.kt-firm-h{display:flex;align-items:center;gap:11px;margin-bottom:18px}

.kt-firm-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.kt-firm-ic svg{width:16px;height:16px}

.kt-firm-h b{font:700 14.5px/1.3 var(--sans)}

.kt-firm-l{display:grid;gap:11px}

.kt-firm-r{display:grid;grid-template-columns:118px 1fr;gap:14px;font-size:13.5px}
.kt-firm-r > span:first-child{color:var(--steel-lt)}
.kt-firm-r > span:last-child{color:var(--ink);font-weight:600;line-height:1.5}
.kt-firm-r .mono{font-family:var(--mono);font-size:13px;word-break:break-all}

.kt-firm-note{
  margin-top:18px;padding:13px 15px;border-radius:var(--r, 10px);
  background:var(--wash);font-size:12.5px;color:var(--steel);line-height:1.6;
}
.kt-firm-note b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.kt-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.kt-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

.kt-faq-i h3{font:700 14.5px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.kt-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.kt-faq-i b{color:var(--ink);font-weight:700}

/* ── по екрани ── */
@media (max-width:1000px){
  .kt-big{grid-template-columns:1fr}
  .kt-form-wrap{grid-template-columns:1fr}
  .kt-place-in{grid-template-columns:1fr}
  .kt-firm{grid-template-columns:1fr}
  .kt-faq{grid-template-columns:1fr}
  .kt-map{min-height:220px}
}

@media (max-width:620px){
  .kt-row{grid-template-columns:1fr}
  .kt-firm-r{grid-template-columns:1fr;gap:2px}

  /* Бутонът заема реда: пръстът иска голяма мишена. */
  .kt-go{flex-direction:column;align-items:stretch}
  .kt-go .btn{width:100%}
}

/* ==== kontakti: край ==== */

/* ==== za-nas: начало ==== */

/* ══════════════════════════════════════════════════════════
   ЗА НАС
   ══════════════════════════════════════════════════════════ */

.zn-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.zn-head h2{margin:0 0 12px}
.zn-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.zn-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,72px) 0 clamp(36px,5vw,58px);
}

/* Заглавието е изречение, не дума — затова има място за дишане. */
.zn-hero h1{color:#fff;max-width:720px;margin:0 0 14px}

.zn-hero > .wrap-w > p{
  color:rgba(255,255,255,.74);font-size:clamp(15.5px,1.9vw,18px);
  margin:0 0 32px;max-width:620px;line-height:1.6;
}

/*
 * ЧИСЛАТА СЕ ПРОВЕРЯВАТ, за разлика от „водещ доставчик“.
 *
 * Затова са преди всякакъв разказ.
 */
.zn-nums{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.zn-num{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.zn-num b{
  display:block;font:800 clamp(1.5rem,3vw,2rem)/1 var(--mono);
  letter-spacing:-.035em;color:#fff;margin-bottom:8px;
}
.zn-num span{
  display:block;font-size:12.5px;color:rgba(255,255,255,.55);line-height:1.45;
}

/* ══════════════════════════════════════════════════════════
   ГРЕШКАТА
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-ЦЕННОТО НА СТРАНИЦАТА.
 *
 * Всеки пише какво прави добре; никой не пише какво е счупил — а точно
 * това се проверява.
 *
 * Червеният ръб отляво: разказът е за нещо лошо и не се маскира.
 */
.zn-oops{
  background:var(--paper);border:1px solid var(--line);
  border-left:4px solid var(--down, #B0342C);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.zn-oops-h{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:18px 24px;background:#FDF0EE;
  border-bottom:1px solid rgba(176,52,44,.2);flex-wrap:wrap;
}

.zn-oops-h b{font:700 15px/1.3 var(--sans);color:var(--down, #B0342C)}
.zn-oops-h span{
  font:700 11.5px/1 var(--mono);color:var(--down, #B0342C);opacity:.7;
}

.zn-oops-b{padding:clamp(22px,3vw,28px)}

.zn-oops-b p{margin:0 0 14px;font-size:14.5px;line-height:1.7;color:var(--ink-soft)}
.zn-oops-b p:last-child{margin-bottom:0}
.zn-oops-b b{color:var(--ink);font-weight:700}

/* Какво се промени: без него разказът е оправдание. */
.zn-oops-after{
  margin-top:22px;padding:18px 20px;border-radius:var(--r-lg, 16px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
}

.zn-oops-after b{
  display:block;font:700 14px/1.35 var(--sans);
  color:var(--up, #127A55);margin-bottom:10px;
}

.zn-oops-l{list-style:none;padding:0;margin:0;display:grid;gap:9px}

.zn-oops-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.6;color:var(--ink-soft);
}
.zn-oops-l i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--up, #127A55);
}

/* ══════════════════════════════════════════════════════════
   ХОРАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ХОРА С ИМЕНА, не снимки от чужд склад.
 *
 * ИНИЦИАЛИТЕ СА НАРОЧНИ: по-честно от купена снимка на непознат.
 */
.zn-crew{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.zn-crew-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;text-align:center;
}

.zn-crew-av{
  width:64px;height:64px;border-radius:50%;margin:0 auto 14px;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;
  font:700 20px/1 var(--sans);letter-spacing:-.02em;
}

/* Различен цвят за всеки: инициалите иначе се сливат. */
.zn-crew-i:nth-child(2) .zn-crew-av{background:var(--rose)}
.zn-crew-i:nth-child(3) .zn-crew-av{background:var(--blue, #1C5FA8)}
.zn-crew-i:nth-child(4) .zn-crew-av{background:var(--up, #127A55)}

.zn-crew-i b{display:block;font:700 15px/1.3 var(--sans);margin-bottom:5px}

.zn-crew-role{
  display:block;font-size:12.5px;color:var(--steel);line-height:1.5;
  margin-bottom:12px;
}

.zn-crew-since{
  display:inline-block;padding:4px 10px;border-radius:99px;
  background:var(--wash);font:700 11px/1 var(--mono);color:var(--steel-lt);
}

.zn-crew-note{
  margin:22px auto 0;font-size:13.5px;color:var(--steel);line-height:1.65;
  text-align:center;max-width:620px;
}
.zn-crew-note b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   СЪРВЪРИТЕ
   ══════════════════════════════════════════════════════════ */
.zn-dc{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,44px);
  align-items:center;
}

.zn-dc h2{color:#fff;margin:0 0 12px}
.zn-dc > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.zn-dc-l{display:grid;gap:12px}

.zn-dc-r{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  font-size:13.5px;color:rgba(255,255,255,.75);line-height:1.55;
}
.zn-dc-r i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:#6FD9AC;
}
.zn-dc-r b{color:#fff;font-weight:700}

/* Пингът: числото прави „близо“ проверимо. */
.zn-ping{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.zn-ping-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:16px;
}

.zn-ping-r{
  display:flex;align-items:center;gap:12px;
  padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08);
  font-size:13px;
}
.zn-ping-r:last-of-type{border-bottom:0}

.zn-ping-city{flex:1;color:rgba(255,255,255,.72)}

.zn-ping-bar{
  width:90px;height:6px;border-radius:99px;
  background:rgba(255,255,255,.1);overflow:hidden;flex:0 0 auto;
}
.zn-ping-fill{height:100%;border-radius:99px;background:#6FD9AC;display:block}

/* Чуждият град е сив: той е за сравнение, не за хвалба. */
.zn-ping-fill.far{background:rgba(255,255,255,.3)}

.zn-ping-ms{
  font:700 12px/1 var(--mono);color:#fff;min-width:44px;text-align:right;
  flex:0 0 auto;
}

.zn-ping-note{
  margin:16px 0 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);
  font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.55;
}

/* ══════════════════════════════════════════════════════════
   ПАРИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * СТРАНЕН РАЗДЕЛ ЗА ТАКАВА СТРАНИЦА — и точно затова работи.
 *
 * Обяснява защо не сме най-евтините, преди човекът да го открие сам.
 */
.zn-money{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.zn-money-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}

/* Пунктираният ръб: това е нещо, което НЕ правим. */
.zn-money-i.no{background:var(--wash);border-style:dashed}

.zn-money-h{display:flex;align-items:center;gap:11px;margin-bottom:14px}

.zn-money-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.zn-money-i.no .zn-money-ic{
  background:var(--wash-2, #EDF1F6);color:var(--steel-lt);
}
.zn-money-ic svg{width:17px;height:17px}

.zn-money-h b{font:700 14.5px/1.3 var(--sans)}
.zn-money-i.no .zn-money-h b{color:var(--steel)}

.zn-money-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.65}
.zn-money-i.no p{color:var(--steel-lt)}

/* Изводът е на тъмно: той е най-важното изречение на раздела. */
.zn-money-end{
  margin:22px 0 0;padding:18px 20px;border-radius:var(--r-lg, 16px);
  background:var(--navy);color:rgba(255,255,255,.8);
  font-size:14px;line-height:1.7;
}
.zn-money-end b{color:#fff;font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЗА КОГО НЕ СМЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЧЕСТНОТО ОТКАЗВАНЕ.
 *
 * Страница, която казва „не сме за теб“, звучи по-достоверно и когато
 * казва обратното.
 */
.zn-notfor{
  background:#FBF4E4;border:1px solid rgba(154,106,18,.24);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
}

.zn-notfor-h{display:flex;align-items:center;gap:12px;margin-bottom:18px}

.zn-notfor-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(154,106,18,.16);color:var(--warn, #9A6A12);
}
.zn-notfor-ic svg{width:17px;height:17px}

.zn-notfor-h b{font:700 15.5px/1.3 var(--sans);color:var(--warn, #9A6A12)}

.zn-notfor-l{display:grid;gap:16px}

.zn-notfor-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.zn-notfor-i > i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--warn, #9A6A12);
}

.zn-notfor-i b{
  display:block;font:700 13.5px/1.35 var(--sans);
  color:var(--warn, #9A6A12);margin-bottom:4px;
}
.zn-notfor-i p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПЪТЯТ
   ══════════════════════════════════════════════════════════ */
/*
 * КРАТЪК И С ДАТИ: дългите разкази не се четат, пет реда с години се
 * четат.
 */
.zn-road{display:grid;gap:0}

.zn-road-r{
  display:grid;grid-template-columns:auto auto 1fr;gap:16px;
  align-items:start;padding-bottom:22px;position:relative;
}
.zn-road-r:last-child{padding-bottom:0}

/* Черта между годините: тя казва, че вървят по ред. */
.zn-road-r:not(:last-child)::before{
  content:'';position:absolute;left:56px;top:24px;bottom:2px;
  width:2px;background:var(--line);
}

.zn-road-y{
  font:800 14px/1 var(--mono);color:var(--steel-lt);
  padding-top:4px;min-width:42px;
}

.zn-road-d{
  width:14px;height:14px;border-radius:50%;flex:0 0 auto;margin-top:3px;
  display:grid;place-items:center;z-index:1;background:var(--wash-2, #EDF1F6);
}
.zn-road-d i{width:6px;height:6px;border-radius:50%;background:var(--steel-lt)}

/* „Днес“ е с друг цвят: то е краят на пътя. */
.zn-road-r.now .zn-road-d{background:#FDF1F4}
.zn-road-r.now .zn-road-d i{background:var(--rose)}

.zn-road-t b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:4px}
.zn-road-t span{font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ФИРМАТА
   ══════════════════════════════════════════════════════════ */
.zn-firm{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,28px);
}

.zn-firm-h{display:flex;align-items:center;gap:11px;margin-bottom:18px}

.zn-firm-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.zn-firm-ic svg{width:16px;height:16px}

.zn-firm-h b{font:700 14.5px/1.3 var(--sans)}

.zn-firm-g{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.zn-firm-r{padding:14px 16px;border-radius:var(--r, 10px);background:var(--wash)}

.zn-firm-r span{
  display:block;font:600 11.5px/1 var(--sans);color:var(--steel-lt);
  margin-bottom:6px;
}
.zn-firm-r b{font:700 13.5px/1.4 var(--sans);color:var(--ink)}
.zn-firm-r b.mono{font-family:var(--mono);font-size:13px;word-break:break-all}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.zn-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.zn-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.zn-cta h2{color:#fff;margin:0 0 8px}
.zn-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:460px}

.zn-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.zn-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.zn-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .zn-nums{grid-template-columns:1fr 1fr}
  .zn-crew{grid-template-columns:1fr 1fr}
  .zn-firm-g{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .zn-dc{grid-template-columns:1fr}
  .zn-money{grid-template-columns:1fr}
}

@media (max-width:620px){
  .zn-nums{grid-template-columns:1fr}
  .zn-crew{grid-template-columns:1fr}
  .zn-firm-g{grid-template-columns:1fr}
  .zn-cta-go{width:100%}
  .zn-cta-go .btn{flex:1}

  /* Годините остават, точките отпадат. */
  .zn-road-r{grid-template-columns:auto 1fr}
  .zn-road-d{display:none}
  .zn-road-r::before{display:none}

  /* Лентата отпада: числото стига. */
  .zn-ping-bar{display:none}
}

/* ==== za-nas: край ==== */

/* ==== baza-znaniya: начало ==== */

/* ══════════════════════════════════════════════════════════
   БАЗА ЗНАНИЯ
   ══════════════════════════════════════════════════════════ */

.kb-head{max-width:660px;margin:0 0 clamp(22px,3vw,32px)}
.kb-head h2{margin:0 0 10px}
.kb-head p{margin:0;color:var(--steel);font-size:15px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА · търсенето
   ══════════════════════════════════════════════════════════ */
/*
 * ХОРАТА ВЛИЗАТ ТУК НАСРЕД ПРОБЛЕМ, вече подразнени.
 *
 * Не идват да разглеждат рубрики — идват с въпрос. Затова полето е
 * първото и е едро, а не малко квадратче в ъгъла.
 */
.kb-hero{
  background:var(--navy);color:#fff;
  padding:clamp(38px,5vw,60px) 0 clamp(32px,4vw,44px);
}

.kb-hero h1{color:#fff;margin:0 0 12px}

.kb-hero > .wrap-n > p{
  color:rgba(255,255,255,.7);font-size:15.5px;margin:0 0 26px;line-height:1.6;
}

.kb-find{position:relative}

.kb-find-in{
  width:100%;padding:18px 46px 18px 54px;border-radius:var(--r-lg, 16px);
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);
  font:400 16px/1.4 var(--sans);color:#fff;
  transition:border-color .15s,background .15s;
}
.kb-find-in::placeholder{color:rgba(255,255,255,.45)}
.kb-find-in:focus{
  outline:none;border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.12);
}

/* Кръстчето на браузъра се маха: имаме си свое. */
.kb-find-in::-webkit-search-cancel-button{-webkit-appearance:none}

.kb-find-ic{
  position:absolute;left:20px;top:50%;transform:translateY(-50%);
  width:20px;height:20px;color:rgba(255,255,255,.5);pointer-events:none;
}
.kb-find-ic svg{width:20px;height:20px;stroke-width:2}

.kb-find-x{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  width:28px;height:28px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(255,255,255,.14);color:#fff;
  font:400 20px/1 var(--sans);
  display:grid;place-items:center;
}
.kb-find-x:hover{background:rgba(255,255,255,.22)}
.kb-find-x[hidden]{display:none}

/* Броят намерени: показва се само при търсене. */
.kb-count{
  margin-top:14px;font:600 13px/1 var(--sans);color:rgba(255,255,255,.55);
}
.kb-count[hidden]{display:none}

/* ══════════════════════════════════════════════════════════
   РУБРИКИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПРАЗНА РУБРИКА НЕ СЕ ПОКАЗВА: по-добре пет истински, отколкото десет,
 * от които половината водят доникъде.
 */
.kb-chips{
  display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px;
}

.kb-chip{
  display:inline-flex;align-items:center;gap:7px;
  padding:9px 14px;border-radius:99px;cursor:pointer;
  border:1px solid var(--line);background:var(--paper);
  font:600 13px/1 var(--sans);color:var(--ink-soft);
  transition:border-color .15s,background .15s;
}
.kb-chip:hover{border-color:var(--steel-lt)}
.kb-chip svg{width:14px;height:14px;flex:0 0 auto}

.kb-chip b{
  font:700 11px/1 var(--mono);color:var(--steel-lt);
}

/* Избраната рубрика: тъмна, за да личи отдалеч. */
.kb-chip.is-on{
  background:var(--navy);border-color:var(--navy);color:#fff;
}
.kb-chip.is-on b{color:rgba(255,255,255,.55)}

/* ══════════════════════════════════════════════════════════
   РЕШЕНИЯТА
   ══════════════════════════════════════════════════════════ */
/*
 * СТЪПКИТЕ СА ВЪТРЕ, скрити: човек отваря решението и чете, без да
 * зарежда нова страница.
 *
 * При проблем всяко зареждане е загубено време.
 */
.kb-items{display:grid;gap:10px}

.kb-item{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  transition:border-color .15s;
}
.kb-item[hidden]{display:none}
.kb-item:hover{border-color:var(--steel-lt)}
.kb-item[open]{border-color:var(--rose)}

.kb-q{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;
  align-items:center;padding:18px 20px;cursor:pointer;
  list-style:none;
}

/* Стрелката на браузъра се маха: имаме си своя. */
.kb-q::-webkit-details-marker{display:none}
.kb-q::marker{content:''}

.kb-q-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.kb-item[open] .kb-q-ic{background:#FDF1F4;color:var(--rose)}
.kb-q-ic svg{width:16px;height:16px}

.kb-q-t{min-width:0}

.kb-q-t b{
  display:block;font:700 15px/1.4 var(--sans);margin-bottom:4px;
  letter-spacing:-.01em;
}
.kb-q-t span{
  display:block;font-size:13px;color:var(--steel);line-height:1.5;
}

.kb-q-min{
  display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;
  font:600 11.5px/1 var(--mono);color:var(--steel-lt);white-space:nowrap;
}
.kb-q-min svg{width:12px;height:12px}

/* Стрелката се върти при отваряне — знак, че има повече. */
.kb-q-arr{
  width:22px;height:22px;flex:0 0 auto;
  display:grid;place-items:center;color:var(--steel-lt);
  transition:transform .18s;
}
.kb-q-arr svg{width:16px;height:16px}
.kb-item[open] .kb-q-arr{transform:rotate(180deg);color:var(--rose)}

/* ── отговорът ── */
.kb-a{
  padding:4px 20px 20px 68px;
  border-top:1px solid var(--line);margin-top:-1px;padding-top:18px;
}

.kb-step{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  margin-bottom:14px;font-size:14px;line-height:1.65;color:var(--ink-soft);
}
.kb-step:last-child{margin-bottom:0}
.kb-step b{color:var(--ink);font-weight:700}

.kb-step-n{
  width:22px;height:22px;border-radius:50%;flex:0 0 auto;margin-top:2px;
  display:grid;place-items:center;
  background:var(--wash);color:var(--steel);font:700 11px/1 var(--mono);
}

/* Кодът: на тъмно, за да не се бърка с текста. */
.kb-code{
  margin:0 0 14px;padding:14px 16px;border-radius:var(--r, 10px);
  background:var(--navy-deep, #0A1D33);color:rgba(255,255,255,.82);
  font:400 12.5px/1.7 var(--mono);
  overflow-x:auto;white-space:pre;
}

/*
 * КАПАНЪТ · отбелязан нарочно.
 *
 * Точно тези места правят разликата между упътване, което работи, и
 * упътване, което не.
 */
.kb-warn{
  display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;
  margin:0 0 14px;padding:14px 16px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:13.5px;line-height:1.6;color:var(--ink-soft);
}
.kb-warn b{color:var(--warn, #9A6A12);font-weight:700}

.kb-warn-ic{
  width:20px;height:20px;flex:0 0 auto;margin-top:1px;
  color:var(--warn, #9A6A12);
}
.kb-warn-ic svg{width:18px;height:18px}

/* Как се разбира, че е станало. */
.kb-ok{
  display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;
  margin:0;padding:14px 16px;border-radius:var(--r, 10px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:13.5px;line-height:1.6;color:var(--ink-soft);
}
.kb-ok b{color:var(--up, #127A55);font-weight:700}

.kb-ok-ic{
  width:20px;height:20px;flex:0 0 auto;margin-top:1px;
  color:var(--up, #127A55);
}
.kb-ok-ic svg{width:18px;height:18px;stroke-width:2.6}

/* ── нищо не се намери ── */
.kb-none{
  padding:36px 24px;text-align:center;
  border:1px dashed var(--line-2, #C7D1DD);border-radius:var(--r-lg, 16px);
  background:var(--wash);
}
.kb-none[hidden]{display:none}

.kb-none b{display:block;font:700 16px/1.3 var(--sans);margin-bottom:8px}
.kb-none p{
  margin:0 auto 16px;font-size:13.5px;color:var(--steel);line-height:1.6;
  max-width:420px;
}

/* ══════════════════════════════════════════════════════════
   НЕ НАМЕРИ ЛИ
   ══════════════════════════════════════════════════════════ */
/*
 * ИЗХОДЪТ КЪМ ЧОВЕК.
 *
 * Който е стигнал дотук, вече е търсил и не е намерил. Не бива да се
 * връща в началото — трябва му път навън.
 */
.kb-miss{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,34px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.kb-miss h2{color:#fff;margin:0 0 10px}
.kb-miss p{
  margin:0 0 18px;font-size:14.5px;color:rgba(255,255,255,.72);
  line-height:1.65;max-width:540px;
}

.kb-miss-l{display:grid;gap:10px}

.kb-miss-r{
  display:flex;align-items:center;gap:11px;
  font-size:13px;color:rgba(255,255,255,.72);
}
.kb-miss-r i{
  width:17px;height:17px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.28);color:#6FD9AC;
}
.kb-miss-r svg{width:9px;height:9px;stroke-width:3.4}

.kb-miss-go{flex:0 0 auto;display:grid;gap:10px}

.kb-miss-ghost{
  background:transparent;border-color:rgba(255,255,255,.24);color:#fff;
}
.kb-miss-ghost:hover{background:rgba(255,255,255,.09)}

/* ══════════════════════════════════════════════════════════
   КАК ПИШЕМ
   ══════════════════════════════════════════════════════════ */
.kb-how{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.kb-how-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.kb-how-ic{
  width:38px;height:38px;border-radius:11px;margin-bottom:14px;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.kb-how-ic svg{width:18px;height:18px}

.kb-how-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:7px}
.kb-how-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ── по екрани ── */
@media (max-width:1000px){
  .kb-how{grid-template-columns:1fr}
  .kb-miss{grid-template-columns:1fr}
}

@media (max-width:620px){
  .kb-find-in{padding:16px 42px 16px 48px;font-size:15px}
  .kb-find-ic{left:17px;width:18px;height:18px}
  .kb-find-ic svg{width:18px;height:18px}

  /* Минутите падат: заглавието е по-важно. */
  .kb-q{grid-template-columns:auto 1fr auto;gap:11px;padding:16px}
  .kb-q-min{display:none}

  /* Отговорът се прибира вляво: няма място за отстъп. */
  .kb-a{padding-left:16px;padding-right:16px}

  .kb-miss-go .btn{width:100%}
}

/* ==== baza-znaniya: край ==== */

/* ==== obshti-usloviya: начало ==== */

/* ══════════════════════════════════════════════════════════
   ОБЩИ УСЛОВИЯ
   ══════════════════════════════════════════════════════════ */

.ou-lead{
  color:var(--steel);font-size:14.5px;margin:0 0 20px;line-height:1.65;
}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.ou-hero{
  background:var(--navy);color:#fff;
  padding:clamp(34px,4.5vw,52px) 0 clamp(28px,3.5vw,40px);
}

.ou-hero h1{color:#fff;margin:0 0 12px}

.ou-hero > .wrap-n > p{
  color:rgba(255,255,255,.72);font-size:15px;margin:0 0 22px;line-height:1.65;
  max-width:600px;
}

/* Датата и версията: условия без дата не се знае кога са валидни. */
.ou-meta{display:flex;gap:20px;flex-wrap:wrap;font-size:12.5px}

.ou-meta-i{
  display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.55);
}
.ou-meta-i b{color:#fff;font-weight:700;font-family:var(--mono);font-size:12.5px}
.ou-meta-i svg{width:14px;height:14px;flex:0 0 auto;stroke-width:2}

/* ══════════════════════════════════════════════════════════
   ОБОБЩЕНИЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * ВСИЧКИ ЗНАЯТ, ЧЕ НИКОЙ НЕ ЧЕТЕ ОБЩИТЕ УСЛОВИЯ.
 *
 * Да се преструваме на обратното е нечестно. По-добре се признава и се
 * дава кратко обобщение — а долу стои и пълният текст.
 */
.ou-gist{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

.ou-gist-h{
  display:flex;align-items:center;gap:12px;
  padding:18px 22px;background:#FDF1F4;
  border-bottom:1px solid rgba(192,51,92,.16);
}

.ou-gist-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(192,51,92,.14);color:var(--rose);
}
.ou-gist-ic svg{width:16px;height:16px}

.ou-gist-h b{flex:1;font:700 15px/1.3 var(--sans);color:var(--rose)}

.ou-gist-l{display:grid}

.ou-gist-r{
  display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;
  padding:18px 22px;border-bottom:1px solid var(--line);
}
.ou-gist-r:last-child{border-bottom:0}

.ou-gist-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 12px/1 var(--mono);
}

.ou-gist-t b{display:block;font:700 14.5px/1.4 var(--sans);margin-bottom:5px}
.ou-gist-t p{margin:0;font-size:13.5px;color:var(--steel);line-height:1.65}
.ou-gist-t a{color:var(--rose);font-weight:600;text-decoration:none}
.ou-gist-t a:hover{text-decoration:underline}

/* Че обобщението няма правна сила · казва се право. */
.ou-gist-say{
  padding:14px 22px;background:var(--wash);border-top:1px solid var(--line);
  font-size:12.5px;color:var(--steel);line-height:1.6;
}
.ou-gist-say b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ДОКУМЕНТЪТ
   ══════════════════════════════════════════════════════════ */
.ou-doc{
  display:grid;grid-template-columns:230px 1fr;
  gap:clamp(24px,3.5vw,48px);align-items:start;
}

/*
 * СЪДЪРЖАНИЕТО ОСТАВА НА ЕКРАНА.
 *
 * Дълъг документ без него значи безкрайно търкаляне, за да се намери
 * един раздел.
 */
.ou-toc{position:sticky;top:20px}

.ou-toc-h{
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);margin-bottom:12px;
}

.ou-toc-l{list-style:none;padding:0;margin:0;display:grid;gap:2px}

.ou-toc-l a{
  display:block;padding:8px 12px;border-radius:8px;
  font-size:13px;color:var(--ink-soft);text-decoration:none;
  border-left:2px solid transparent;
  transition:background .15s;
}
.ou-toc-l a:hover{background:var(--wash)}

/* Разделът, който се чете в момента. */
.ou-toc-l a.on{
  background:#FDF1F4;color:var(--rose);
  border-left-color:var(--rose);font-weight:600;
}

.ou-body{min-width:0}

/* ── един раздел ── */
.ou-part{
  padding-bottom:32px;margin-bottom:32px;
  border-bottom:1px solid var(--line);
  scroll-margin-top:24px;
}
.ou-part:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}

.ou-part-n{
  display:inline-block;margin-bottom:10px;
  padding:4px 10px;border-radius:99px;
  background:var(--wash);color:var(--steel-lt);
  font:700 11px/1 var(--mono);
}

.ou-part p{
  margin:0 0 14px;font-size:14.5px;line-height:1.75;color:var(--ink-soft);
}
.ou-part p:last-child{margin-bottom:0}
.ou-part b{color:var(--ink);font-weight:700}
.ou-part a{color:var(--rose);font-weight:600}

.ou-part ol,
.ou-part ul{margin:0 0 14px;padding-left:22px}
.ou-part li{
  margin-bottom:8px;font-size:14.5px;line-height:1.7;color:var(--ink-soft);
}

/*
 * ЧОВЕШКОТО ОБЯСНЕНИЕ до правния текст.
 *
 * Не заменя договора — стои до него. Така човек чете каквото му е
 * нужно, а юристът вижда, че условието си е там.
 */
.ou-plain{
  margin:0 0 16px;padding:14px 16px;border-radius:var(--r, 10px);
  background:#EAF2FB;border-left:3px solid var(--blue, #1C5FA8);
  font-size:13.5px;line-height:1.65;color:var(--ink-soft);
}
.ou-plain b{
  color:var(--blue, #1C5FA8);font-weight:700;display:block;margin-bottom:5px;
}

/*
 * ВАЖНОТО УСЛОВИЕ · чете се дори при прескачане.
 *
 * Точно там са нещата, които обикновено се крият: какво не се връща,
 * кога се спира услуга, докъде стига отговорността.
 */
.ou-mark{
  margin:0 0 16px;padding:14px 16px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:13.5px;line-height:1.65;color:var(--ink-soft);
}
.ou-mark b{color:var(--warn, #9A6A12);font-weight:700}

.ou-mark ul{margin:8px 0 0;padding-left:20px}
.ou-mark li{font-size:13.5px;margin-bottom:5px;line-height:1.6}

/*
 * ЧИСЛАТА · за раздела с обещанието.
 *
 * „43 минути“ е нарочно: 99,9% звучи безупречно, докато не се преведе
 * в минути.
 */
.ou-nums{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 16px;
}

.ou-num{
  padding:14px;border-radius:var(--r, 10px);background:var(--wash);
  text-align:center;
}
.ou-num b{
  display:block;font:800 1.25rem/1 var(--mono);letter-spacing:-.03em;
  margin-bottom:6px;color:var(--ink);
}
.ou-num span{display:block;font-size:11.5px;color:var(--steel);line-height:1.4}

/* ══════════════════════════════════════════════════════════
   ПРОМЕНИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * УСЛОВИЯ, КОИТО СЕ МЕНЯТ ТИХО, СА ПО-ЛОШИ ОТ ЛОШИ УСЛОВИЯ.
 */
.ou-hist{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.ou-hist-h{
  padding:14px 20px;background:var(--wash);border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.ou-hist-h b{font:700 13.5px/1 var(--sans)}
.ou-hist-h span{font:400 12px/1 var(--mono);color:var(--steel-lt)}

.ou-hist-r{
  display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;
  padding:16px 20px;border-bottom:1px solid var(--line);
}
.ou-hist-r:last-child{border-bottom:0}

.ou-hist-d{
  font:700 11.5px/1 var(--mono);color:var(--steel-lt);
  min-width:74px;padding-top:2px;
}

.ou-hist-t b{display:block;font:600 13.5px/1.4 var(--sans);margin-bottom:4px}
.ou-hist-t span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.ou-ask{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(22px,3vw,30px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,36px);
  align-items:center;
}

.ou-ask h2{color:#fff;margin:0 0 8px}
.ou-ask p{
  margin:0;font-size:14px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:540px;
}

.ou-ask-go{display:flex;gap:10px;flex-wrap:wrap;flex:0 0 auto}

/* ══════════════════════════════════════════════════════════
   ДРУГИТЕ ДОКУМЕНТИ
   ══════════════════════════════════════════════════════════ */
.ou-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.ou-doc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  text-decoration:none;color:inherit;
  transition:border-color .15s;
}
.ou-doc-i:hover{border-color:var(--steel-lt)}

.ou-doc-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.ou-doc-ic svg{width:16px;height:16px}

.ou-doc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.ou-doc-i span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ── по екрани ── */
@media (max-width:900px){
  .ou-doc{grid-template-columns:1fr}

  /* Съдържанието става лента отгоре. */
  .ou-toc{
    position:static;padding-bottom:20px;border-bottom:1px solid var(--line);
  }
  .ou-toc-l{
    display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;
    -webkit-overflow-scrolling:touch;
  }
  .ou-toc-l a{
    white-space:nowrap;border-left:0;border-bottom:2px solid transparent;
  }
  .ou-toc-l a.on{border-left:0;border-bottom-color:var(--rose)}

  .ou-docs{grid-template-columns:1fr}
  .ou-ask{grid-template-columns:1fr}
}

@media (max-width:620px){
  .ou-nums{grid-template-columns:1fr}
  .ou-gist-r{gap:12px;padding:16px}
  .ou-hist-r{grid-template-columns:1fr;gap:4px}
  .ou-ask-go{width:100%}
  .ou-ask-go .btn{flex:1;width:100%}
}

/* ==== obshti-usloviya: край ==== */

/* ==== poveritelnost: начало ==== */

/* ══════════════════════════════════════════════════════════
   ПОВЕРИТЕЛНОСТ
   ══════════════════════════════════════════════════════════ */

.pv-head{max-width:660px;margin:0 0 clamp(20px,2.6vw,30px)}
.pv-head h2{margin:0 0 12px}
.pv-head p{margin:0;color:var(--steel);font-size:14.5px;line-height:1.65}

.pv-lead{color:var(--steel);font-size:14.5px;margin:0 0 20px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.pv-hero{
  background:var(--navy);color:#fff;
  padding:clamp(34px,4.5vw,52px) 0 clamp(28px,3.5vw,40px);
}

.pv-hero h1{color:#fff;margin:0 0 12px}

.pv-hero > .wrap-n > p{
  color:rgba(255,255,255,.72);font-size:15px;margin:0 0 22px;line-height:1.65;
  max-width:620px;
}

.pv-meta{display:flex;gap:20px;flex-wrap:wrap;font-size:12.5px}

.pv-meta-i{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.55)}
.pv-meta-i b{color:#fff;font-weight:700;font-family:var(--mono);font-size:12.5px}
.pv-meta-i svg{width:14px;height:14px;flex:0 0 auto;stroke-width:2}

/* ══════════════════════════════════════════════════════════
   ЧЕТИРИТЕ „НЕ“
   ══════════════════════════════════════════════════════════ */
/*
 * ЧОВЕК, КОЙТО ОТВАРЯ ТАКАВА СТРАНИЦА, СЕ ПИТА ЕДНО: „ще ме продадат
 * ли“.
 *
 * Отговорът е първи, не на осмия абзац. Зелено, защото са добри вести.
 */
.pv-nots{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}

.pv-not{
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.pv-not-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;
  background:rgba(18,122,85,.14);color:var(--up, #127A55);
}
.pv-not-ic svg{width:16px;height:16px;stroke-width:2.4}

.pv-not b{
  display:block;font:700 14px/1.35 var(--sans);color:var(--up, #127A55);
  margin-bottom:6px;
}
.pv-not span{display:block;font-size:12.5px;color:var(--ink-soft);line-height:1.55}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ГЛАВНОТО НА СТРАНИЦАТА.
 *
 * Всеки ред казва четири неща наведнъж. Разказ в абзаци значи, че човек
 * трябва да събира отговора от четири места.
 */
.pv-data{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.pv-data table{
  width:100%;border-collapse:collapse;font-size:13.5px;min-width:720px;
}

.pv-data th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

.pv-data td{
  padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top;
}
.pv-data tbody tr:last-child td{border-bottom:0}
.pv-data tbody tr:hover{background:var(--wash)}

.pv-data td b{color:var(--ink);font-weight:700}
.pv-data td span{display:block;font-size:12px;color:var(--steel-lt);margin-top:3px}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.pv-data th:first-child,
.pv-data td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.pv-data th:first-child{background:var(--wash)}
.pv-data tbody tr:hover td:first-child{background:var(--wash)}

/*
 * ОСНОВАНИЕТО е етикет с цвят, не правен цитат.
 *
 * Четирите вида се различават по цвят, а под таблицата пише какво значи
 * всеки.
 */
.pv-basis{
  display:inline-block;padding:4px 9px;border-radius:99px;
  font:700 10.5px/1 var(--sans);white-space:nowrap;
}
.pv-basis.c{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.pv-basis.l{background:#FBF4E4;color:var(--warn, #9A6A12)}
.pv-basis.i{background:var(--wash);color:var(--steel)}
.pv-basis.s{background:#FDF1F4;color:var(--rose)}

/* Колко дълго: числото се чете преди думите. */
.pv-keep{font:700 12.5px/1 var(--mono);color:var(--ink);white-space:nowrap}

.pv-legend{
  display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;
  font-size:12px;color:var(--steel);
}
.pv-legend > span{display:inline-flex;align-items:center;gap:7px}

/* ══════════════════════════════════════════════════════════
   КОЙ ВИЖДА
   ══════════════════════════════════════════════════════════ */
/*
 * ПОИМЕННО, не „доверени партньори“.
 *
 * Тази дума е чиста мъгла — зад нея може да стои всеки.
 */
.pv-who{display:grid;gap:10px}

.pv-who-i{
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  padding:16px 20px;border-radius:var(--r-lg, 16px);
  background:var(--paper);border:1px solid var(--line);
}

.pv-who-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.pv-who-ic svg{width:17px;height:17px}

.pv-who-t b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:4px}
.pv-who-t span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* Държавата отдясно: първото, което човек проверява. */
.pv-who-where{text-align:right;flex:0 0 auto}
.pv-who-where b{
  display:block;font:700 11.5px/1 var(--mono);color:var(--ink);margin-bottom:4px;
}
.pv-who-where span{font-size:11px;color:var(--steel-lt)}

/* „Това е целият списък“ · изречение, което задължава. */
.pv-who-note{
  margin:18px 0 0;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:13.5px;color:var(--up, #127A55);line-height:1.65;
}
.pv-who-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ПРАВАТА
   ══════════════════════════════════════════════════════════ */
/*
 * С ДЕЙСТВИЕ, не само с цитат от закона.
 *
 * „Имате право на достъп до вашите данни“ не помага на никого. „Ето
 * бутона, с който ги теглиш“ — помага.
 */
.pv-rights{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}

.pv-right{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  display:flex;flex-direction:column;
}

.pv-right-h{display:flex;align-items:center;gap:11px;margin-bottom:10px}

.pv-right-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.pv-right-ic svg{width:15px;height:15px}

.pv-right-h b{font:700 14px/1.3 var(--sans)}

/* Текстът се разтяга, за да падне бутонът долу при всички. */
.pv-right p{
  margin:0 0 14px;font-size:13px;color:var(--steel);line-height:1.6;flex:1;
}

.pv-right-go{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

.pv-right-when{font:600 11.5px/1 var(--mono);color:var(--steel-lt)}

/* ══════════════════════════════════════════════════════════
   БИСКВИТКИТЕ
   ══════════════════════════════════════════════════════════ */
.pv-cook{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(22px,3vw,30px);
}

.pv-cook h2{color:#fff;margin:0 0 10px}
.pv-cook > p{
  margin:0 0 20px;font-size:14px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:560px;
}

.pv-cook-l{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px;
}

.pv-cook-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r, 10px);padding:16px;
}

.pv-cook-tag{
  display:inline-block;margin-bottom:9px;padding:4px 9px;border-radius:99px;
  font:700 10px/1 var(--sans);
}
.pv-cook-tag.need{background:rgba(18,122,85,.28);color:#6FD9AC}
.pv-cook-tag.opt{background:rgba(255,255,255,.14);color:rgba(255,255,255,.7)}

.pv-cook-i b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:5px;
}
.pv-cook-i span{font-size:12px;color:rgba(255,255,255,.6);line-height:1.55}

.pv-cook-go{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

.pv-cook-say{font-size:12.5px;color:rgba(255,255,255,.5);line-height:1.55}

/* ══════════════════════════════════════════════════════════
   ПРИ ПРОБИВ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОЧТИ НИКОЙ НЕ ГО ПИШЕ — а точно това е моментът, в който политиката
 * има значение.
 *
 * Червеният ръб: разделът е за нещо лошо и не се маскира.
 */
.pv-leak{
  background:var(--paper);border:1px solid var(--line);
  border-left:4px solid var(--down, #B0342C);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.pv-leak-h{
  display:flex;align-items:center;gap:12px;
  padding:16px 20px;background:#FDF0EE;
  border-bottom:1px solid rgba(176,52,44,.2);
}

.pv-leak-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(176,52,44,.14);color:var(--down, #B0342C);
}
.pv-leak-ic svg{width:15px;height:15px}

.pv-leak-h b{font:700 14.5px/1.3 var(--sans);color:var(--down, #B0342C)}

.pv-leak-l{padding:18px 20px;display:grid;gap:14px}

.pv-leak-r{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}

/* Срокът отляво: той е обещанието, текстът е обяснението. */
.pv-leak-t{
  font:700 11px/1 var(--mono);color:var(--down, #B0342C);
  padding:5px 10px;border-radius:99px;background:#FDF0EE;
  white-space:nowrap;min-width:74px;text-align:center;
}

.pv-leak-x{font-size:13.5px;line-height:1.6;color:var(--ink-soft)}
.pv-leak-x b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ И ЖАЛБИ
   ══════════════════════════════════════════════════════════ */
/*
 * ЖАЛБАТА КЪМ КОМИСИЯТА Е РАВНОСТОЙНА на нашия адрес, не скрита
 * накрая — затова двете колони са с еднаква ширина.
 */
.pv-ask{
  background:var(--wash-2, #EDF1F6);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,36px);
}

.pv-ask-c h3{margin:0 0 10px}
.pv-ask-c p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.65}
.pv-ask-c p:last-child{margin-bottom:0}
.pv-ask-c b{color:var(--ink);font-weight:700}

.pv-ask-box{
  padding:14px 16px;border-radius:var(--r, 10px);background:var(--paper);
  border:1px solid var(--line);font-size:13px;line-height:1.7;
  color:var(--ink-soft);
}
.pv-ask-box b{display:block;color:var(--ink);margin-bottom:4px;font-weight:700}
.pv-ask-box a{color:var(--rose);font-weight:600;text-decoration:none}
.pv-ask-box a:hover{text-decoration:underline}

/* ══════════════════════════════════════════════════════════
   ДЕЦА И ЧУВСТВИТЕЛНИ
   ══════════════════════════════════════════════════════════ */
.pv-care{
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  border-radius:var(--r-lg, 16px);padding:clamp(20px,2.6vw,26px);
}

.pv-care-h{display:flex;align-items:center;gap:11px;margin-bottom:14px}

.pv-care-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(154,106,18,.16);color:var(--warn, #9A6A12);
}
.pv-care-ic svg{width:16px;height:16px}

.pv-care-h b{font:700 14.5px/1.3 var(--sans);color:var(--warn, #9A6A12)}

.pv-care p{margin:0 0 12px;font-size:13.5px;color:var(--ink-soft);line-height:1.7}
.pv-care p:last-child{margin-bottom:0}
.pv-care b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ДРУГИТЕ ДОКУМЕНТИ
   ══════════════════════════════════════════════════════════ */
.pv-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.pv-doc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  text-decoration:none;color:inherit;transition:border-color .15s;
}
.pv-doc-i:hover{border-color:var(--steel-lt)}

.pv-doc-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.pv-doc-ic svg{width:16px;height:16px}

.pv-doc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.pv-doc-i span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ── по екрани ── */
@media (max-width:1000px){
  .pv-nots{grid-template-columns:1fr 1fr}
  .pv-cook-l{grid-template-columns:1fr}
  .pv-ask{grid-template-columns:1fr}
  .pv-docs{grid-template-columns:1fr}
}

@media (max-width:620px){
  .pv-nots{grid-template-columns:1fr}
  .pv-rights{grid-template-columns:1fr}

  /* Държавата пада под текста, вместо да го смачква. */
  .pv-who-i{grid-template-columns:auto 1fr}
  .pv-who-where{grid-column:2;text-align:left}

  .pv-leak-r{grid-template-columns:1fr}
  .pv-leak-t{justify-self:start}
}

/* ==== poveritelnost: край ==== */

/* ==== sla: начало ==== */

/* ══════════════════════════════════════════════════════════
   ГАРАНЦИЯ ЗА РАБОТА
   ══════════════════════════════════════════════════════════ */

.sl-head{max-width:660px;margin:0 0 clamp(20px,2.6vw,30px)}
.sl-head h2{margin:0 0 12px}
.sl-head p{margin:0;color:var(--steel);font-size:14.5px;line-height:1.65}

.sl-lead{color:var(--steel);font-size:14.5px;margin:0 0 20px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.sl-hero{
  background:var(--navy);color:#fff;
  padding:clamp(34px,4.5vw,52px) 0 clamp(30px,3.5vw,42px);
}

.sl-hero h1{color:#fff;margin:0 0 12px}

.sl-hero > .wrap-n > p{
  color:rgba(255,255,255,.72);font-size:15px;margin:0 0 26px;line-height:1.65;
  max-width:620px;
}

/*
 * ЧИСЛОТО, ПРЕВЕДЕНО В МИНУТИ.
 *
 * „99,9%“ звучи безупречно, докато не се преведе. Ако не го кажем ние,
 * човекът го смята сам и се чувства подведен.
 */
.sl-big{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.sl-big-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.sl-big-i b{
  display:block;font:800 clamp(1.4rem,2.6vw,1.8rem)/1 var(--mono);
  letter-spacing:-.035em;color:#fff;margin-bottom:8px;
}
.sl-big-i span{
  display:block;font-size:12.5px;color:rgba(255,255,255,.55);line-height:1.5;
}

/* ══════════════════════════════════════════════════════════
   КАК МЕРИМ
   ══════════════════════════════════════════════════════════ */
/*
 * ТУК СЕ КРИЕ ЦЕЛИЯТ ФОКУС НА ТАКИВА ДОКУМЕНТИ.
 *
 * Ако не се каже откъде се мери, всяко число може да се твърди. Мерене
 * от съседната стая ще покаже 100% винаги.
 */
.sl-how{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.sl-how-h{
  display:flex;align-items:center;gap:12px;
  padding:16px 20px;background:#EAF2FB;
  border-bottom:1px solid rgba(28,95,168,.16);
}

.sl-how-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(28,95,168,.14);color:var(--blue, #1C5FA8);
}
.sl-how-ic svg{width:16px;height:16px}

.sl-how-h b{font:700 15px/1.3 var(--sans);color:var(--blue, #1C5FA8)}

.sl-how-l{display:grid}

.sl-how-r{
  display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;
  padding:18px 20px;border-bottom:1px solid var(--line);
}
.sl-how-r:last-child{border-bottom:0}

.sl-how-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 12px/1 var(--mono);
}

.sl-how-t b{display:block;font:700 14px/1.4 var(--sans);margin-bottom:5px}
.sl-how-t p{margin:0;font-size:13.5px;color:var(--steel);line-height:1.65}

.sl-how-t code{
  font-family:var(--mono);font-size:12.5px;
  background:var(--wash);padding:2px 6px;border-radius:5px;color:var(--ink);
}

/* Точките за мерене: къде стоят. */
.sl-spots{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

.sl-spot{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 11px;border-radius:99px;
  background:var(--wash);font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.sl-spot i{
  width:6px;height:6px;border-radius:50%;background:var(--up, #127A55);
  flex:0 0 auto;
}

/* ══════════════════════════════════════════════════════════
   СТЪЛБИЦАТА
   ══════════════════════════════════════════════════════════ */
.sl-tiers{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.sl-tiers table{
  width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px;
}

.sl-tiers th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

.sl-tiers td{
  padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:middle;
}
.sl-tiers tbody tr:last-child td{border-bottom:0}
.sl-tiers tbody tr:hover{background:var(--wash)}

.sl-tiers td.mono{font-family:var(--mono);font-size:13px}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.sl-tiers th:first-child,
.sl-tiers td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.sl-tiers th:first-child{background:var(--wash)}
.sl-tiers tbody tr:hover td:first-child{background:var(--wash)}

/*
 * ПРОЦЕНТЪТ · цветът расте с числото.
 *
 * Окото вижда тежестта, преди да прочете.
 */
.sl-pct{
  display:inline-block;padding:5px 12px;border-radius:99px;
  font:800 13px/1 var(--mono);
}
.sl-pct.p10{background:#FBF4E4;color:var(--warn, #9A6A12)}
.sl-pct.p25{background:#FBE9E4;color:#B5591E}
.sl-pct.p50{background:#FDF0EE;color:var(--down, #B0342C)}
.sl-pct.p100{
  background:#FDF0EE;color:var(--down, #B0342C);
  box-shadow:inset 0 0 0 1px rgba(176,52,44,.3);
}

/* ══════════════════════════════════════════════════════════
   СМЕТКАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ПРОЦЕНТИ ВЪРХУ НЕПОЗНАТА СУМА НЕ ЗНАЧАТ НИЩО.
 *
 * Пример с истински числа показва и колко е малко.
 */
.sl-calc{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(22px,3vw,30px);
}

.sl-calc h2{color:#fff;margin:0 0 10px}
.sl-calc > p{
  margin:0 0 22px;font-size:14px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:560px;
}

.sl-calc-box{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r, 10px);padding:20px;margin-bottom:16px;
}

.sl-calc-r{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:11px 0;font-size:13.5px;color:rgba(255,255,255,.72);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.sl-calc-r:last-of-type{border-bottom:0}
.sl-calc-r b{font:700 14px/1 var(--mono);color:#fff;white-space:nowrap}

.sl-calc-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  margin-top:14px;padding-top:14px;border-top:2px solid rgba(255,255,255,.2);
}
.sl-calc-t span{font:600 14px/1 var(--sans);color:#fff}
.sl-calc-t b{
  font:800 1.5rem/1 var(--mono);letter-spacing:-.03em;color:#000000;
}

/*
 * ПРИЗНАНИЕТО · то струва повече от още едно обещание.
 *
 * Всеки такъв документ работи така, но малцина го казват.
 */
.sl-calc-say{
  padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(154,106,18,.18);border:1px solid rgba(240,184,74,.28);
  font-size:13px;color:#F5C86B;line-height:1.65;
}
.sl-calc-say b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ИЗКЛЮЧЕНИЯТА
   ══════════════════════════════════════════════════════════ */
/*
 * ОТПРЕД, не заровени на осма страница.
 *
 * И преброени: „пет, и толкова“ е обещание само по себе си.
 */
.sl-exc{
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,28px);
}

.sl-exc-h{display:flex;align-items:center;gap:12px;margin-bottom:8px}

.sl-exc-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(154,106,18,.16);color:var(--warn, #9A6A12);
}
.sl-exc-ic svg{width:16px;height:16px}

.sl-exc-h b{font:700 15px/1.3 var(--sans);color:var(--warn, #9A6A12)}

.sl-exc-lead{
  margin:0 0 18px;font-size:13px;color:var(--ink-soft);line-height:1.65;
}

.sl-exc-l{display:grid;gap:14px}

.sl-exc-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.sl-exc-i > i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--warn, #9A6A12);
}

.sl-exc-i b{
  display:block;font:700 13.5px/1.35 var(--sans);
  color:var(--warn, #9A6A12);margin-bottom:4px;
}
.sl-exc-i p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.6}

/* Какво НЕ е в списъка · по-важно от самия списък. */
.sl-exc-count{
  margin-top:20px;padding-top:16px;border-top:1px solid rgba(154,106,18,.2);
  font-size:13px;color:var(--warn, #9A6A12);line-height:1.6;
}
.sl-exc-count b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ИСКАНЕТО
   ══════════════════════════════════════════════════════════ */
.sl-claim{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.sl-claim-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sl-claim-n{
  width:30px;height:30px;border-radius:50%;margin-bottom:14px;
  display:grid;place-items:center;
  background:var(--rose);color:#fff;font:700 13px/1 var(--mono);
}

.sl-claim-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:7px}
.sl-claim-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/*
 * ЗАЩО НЕ Е АВТОМАТИЧНО.
 *
 * Почти никъде не е, но малцина обясняват. Тук причината е истинска и
 * проверима.
 */
.sl-claim-why{
  margin:18px 0 0;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#EAF2FB;border-left:3px solid var(--blue, #1C5FA8);
  font-size:13.5px;color:var(--ink-soft);line-height:1.65;
}
.sl-claim-why b{
  color:var(--blue, #1C5FA8);font-weight:700;display:block;margin-bottom:5px;
}

/* ══════════════════════════════════════════════════════════
   ПЛАТЕНОТО
   ══════════════════════════════════════════════════════════ */
/*
 * ГАРАНЦИЯ, ПО КОЯТО НИКОГА НЕ Е ПЛАЩАНО, е или безупречна услуга, или
 * документ, написан да не плаща.
 */
.sl-paid{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.sl-paid-h{
  padding:14px 20px;background:var(--wash);border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.sl-paid-h b{font:700 13.5px/1 var(--sans)}
.sl-paid-h span{font:400 12px/1 var(--mono);color:var(--steel-lt)}

.sl-paid-r{
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  padding:15px 20px;border-bottom:1px solid var(--line);
}
.sl-paid-r:last-child{border-bottom:0}

.sl-paid-y{font:700 13px/1 var(--mono);color:var(--steel-lt);min-width:44px}

.sl-paid-t b{display:block;font:600 13.5px/1.4 var(--sans);margin-bottom:3px}
.sl-paid-t span{font-size:12.5px;color:var(--steel);line-height:1.5}

.sl-paid-s{
  font:700 13px/1 var(--mono);color:var(--ink);white-space:nowrap;
  text-align:right;
}

/* Годината с нула: тя прави останалите верни. */
.sl-paid-s.zero{color:var(--steel-lt)}

/* ══════════════════════════════════════════════════════════
   ДОГОВОР С НЕУСТОЙКА
   ══════════════════════════════════════════════════════════ */
.sl-more{
  background:var(--wash-2, #EDF1F6);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,36px);
  align-items:center;
}

.sl-more h3{margin:0 0 8px}
.sl-more p{
  margin:0;font-size:13.5px;color:var(--steel);line-height:1.65;max-width:560px;
}

.sl-more-go{flex:0 0 auto}

/* ══════════════════════════════════════════════════════════
   ДРУГИТЕ ДОКУМЕНТИ
   ══════════════════════════════════════════════════════════ */
.sl-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.sl-doc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  text-decoration:none;color:inherit;transition:border-color .15s;
}
.sl-doc-i:hover{border-color:var(--steel-lt)}

.sl-doc-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.sl-doc-ic svg{width:16px;height:16px}

.sl-doc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.sl-doc-i span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ── по екрани ── */
@media (max-width:1000px){
  .sl-claim{grid-template-columns:1fr}
  .sl-docs{grid-template-columns:1fr}
  .sl-more{grid-template-columns:1fr}
}

@media (max-width:620px){
  .sl-big{grid-template-columns:1fr}
  .sl-how-r{gap:12px;padding:16px}

  /* Сумата пада под текста, вместо да го смачква. */
  .sl-paid-r{grid-template-columns:auto 1fr}
  .sl-paid-s{grid-column:2;text-align:left}

  .sl-more-go .btn{width:100%}
}

/* ==== sla: край ==== */

/* ==== politika-polzvane: начало ==== */

/* ══════════════════════════════════════════════════════════
   ПРАВИЛА ЗА ПОЛЗВАНЕ
   ══════════════════════════════════════════════════════════ */

.ap-head{max-width:660px;margin:0 0 clamp(20px,2.6vw,30px)}
.ap-head h2{margin:0 0 12px}
.ap-head p{margin:0;color:var(--steel);font-size:14.5px;line-height:1.65}

.ap-lead{color:var(--steel);font-size:14.5px;margin:0 0 20px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.ap-hero{
  background:var(--navy);color:#fff;
  padding:clamp(34px,4.5vw,52px) 0 clamp(28px,3.5vw,38px);
}

.ap-hero h1{color:#fff;margin:0 0 12px}

.ap-hero > .wrap-n > p{
  color:rgba(255,255,255,.72);font-size:15px;margin:0 0 24px;line-height:1.65;
  max-width:620px;
}

/*
 * „ТАЗИ СТРАНИЦА НЕ Е ЗА ТЕБ.“
 *
 * Такива правила плашат честните хора, а нечестните и без това не ги
 * четат. Затова първото нещо е успокоение — и то е зелено.
 */
.ap-calm{
  display:flex;align-items:flex-start;gap:14px;
  padding:18px 20px;border-radius:var(--r-lg, 16px);
  background:rgb(18 122 85 / 0%);border:1px solid rgb(152 219 28);
}

.ap-calm-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#ffffff;
}
.ap-calm-ic svg{width:16px;height:16px;stroke-width:2.4}

.ap-calm-t b{
  display:block;font:700 14.5px/1.35 var(--sans);color:#7cbf00;margin-bottom:5px;
}
.ap-calm-t span{
  display:block;font-size:13.5px;color:rgba(255,255,255,.75);line-height:1.65;
}

/* ══════════════════════════════════════════════════════════
   ЗАБРАНИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * СЕДЕМ НЕЩА, И ВСИЧКИТЕ ОЧЕВИДНИ.
 *
 * Дълъг списък от забрани значи, че всичко може да се окаже нарушение.
 */
.ap-stop{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}

.ap-stop-i{
  background:#FDF0EE;border:1px solid rgba(176,52,44,.2);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.ap-stop-h{display:flex;align-items:center;gap:11px;margin-bottom:9px}

.ap-stop-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(176,52,44,.14);color:var(--down, #B0342C);
}
.ap-stop-ic svg{width:15px;height:15px}

.ap-stop-h b{font:700 14px/1.35 var(--sans);color:var(--down, #B0342C)}

.ap-stop-i p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   СИВАТА ЗОНА
   ══════════════════════════════════════════════════════════ */
/*
 * НЕЩАТА, ЗА КОИТО ХОРАТА СЕ ПРИТЕСНЯВАТ БЕЗ ПРИЧИНА.
 *
 * Почти всеки, който чете такива правила, се пита „а моето влиза ли“.
 * Зелена глава, защото отговорът обикновено е „да“.
 */
.ap-grey{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.ap-grey-h{
  display:flex;align-items:center;gap:12px;
  padding:16px 20px;background:#E7F5EF;
  border-bottom:1px solid rgba(18,122,85,.18);
}

.ap-grey-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.14);color:var(--up, #127A55);
}
.ap-grey-ic svg{width:16px;height:16px}

.ap-grey-h b{font:700 14.5px/1.3 var(--sans);color:var(--up, #127A55)}

.ap-grey-l{display:grid}

.ap-grey-r{
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;
  padding:15px 20px;border-bottom:1px solid var(--line);
}
.ap-grey-r:last-child{border-bottom:0}

.ap-grey-q{
  width:24px;height:24px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--wash);color:var(--steel-lt);
  font:700 12px/1 var(--mono);
}

.ap-grey-t b{display:block;font:600 13.5px/1.4 var(--sans);margin-bottom:3px}
.ap-grey-t span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* Отговорът се чете преди въпроса: той е важното. */
.ap-grey-a{
  padding:5px 12px;border-radius:99px;flex:0 0 auto;
  font:700 11px/1 var(--sans);white-space:nowrap;
}
.ap-grey-a.yes{background:#E7F5EF;color:var(--up, #127A55)}
.ap-grey-a.ask{background:#FBF4E4;color:var(--warn, #9A6A12)}

/* ══════════════════════════════════════════════════════════
   ГРАНИЦИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЧИСЛА ВМЕСТО „НЕОГРАНИЧЕНО*“.
 *
 * Звездичката е най-старият номер в бранша.
 */
.ap-lim{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.ap-lim table{
  width:100%;border-collapse:collapse;font-size:13.5px;min-width:620px;
}

.ap-lim th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

.ap-lim td{
  padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top;
}
.ap-lim tbody tr:last-child td{border-bottom:0}
.ap-lim tbody tr:hover{background:var(--wash)}

.ap-lim td b{color:var(--ink);font-weight:700}
.ap-lim td.mono{font-family:var(--mono);font-size:13px;white-space:nowrap}
.ap-lim td span{
  display:block;font-size:12px;color:var(--steel-lt);margin-top:3px;
  font-family:var(--sans);white-space:normal;
}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.ap-lim th:first-child,
.ap-lim td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.ap-lim th:first-child{background:var(--wash)}
.ap-lim tbody tr:hover td:first-child{background:var(--wash)}

/* Без това числата горе плашат. */
.ap-lim-note{
  margin:18px 0 0;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#EAF2FB;border-left:3px solid var(--blue, #1C5FA8);
  font-size:13.5px;color:var(--ink-soft);line-height:1.65;
}
.ap-lim-note b{
  color:var(--blue, #1C5FA8);font-weight:700;display:block;margin-bottom:5px;
}

/* ══════════════════════════════════════════════════════════
   ПРИ СИГНАЛ
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-ВАЖНИЯТ РАЗДЕЛ.
 *
 * Повечето такива правила пишат „можем да прекратим незабавно по наша
 * преценка“ — изречение, което значи „когато решим“.
 *
 * Тук са стъпки със срокове.
 */
.ap-flow{display:grid;gap:0}

.ap-flow-r{
  display:grid;grid-template-columns:auto auto 1fr;gap:16px;
  align-items:start;padding-bottom:22px;position:relative;
}
.ap-flow-r:last-child{padding-bottom:0}

/* Черта между стъпките: тя казва, че вървят по ред. */
.ap-flow-r:not(:last-child)::before{
  content:'';position:absolute;left:60px;top:26px;bottom:2px;
  width:2px;background:var(--line);
}

.ap-flow-t{
  font:700 11.5px/1 var(--mono);color:var(--steel-lt);
  padding-top:6px;min-width:46px;
}

.ap-flow-d{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:3px;
  display:grid;place-items:center;z-index:1;background:var(--wash-2, #EDF1F6);
}
.ap-flow-d i{width:7px;height:7px;border-radius:50%;background:var(--steel-lt)}

.ap-flow-r.start .ap-flow-d{background:#FBF4E4}
.ap-flow-r.start .ap-flow-d i{background:var(--warn, #9A6A12)}
.ap-flow-r.good .ap-flow-d{background:#E7F5EF}
.ap-flow-r.good .ap-flow-d i{background:var(--up, #127A55)}

.ap-flow-x b{display:block;font:700 14px/1.4 var(--sans);margin-bottom:4px}
.ap-flow-x p{margin:0;font-size:13.5px;color:var(--steel);line-height:1.65}

/* Изключението: то се вижда, а не се крие. */
.ap-flow-fast{
  margin-top:20px;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#FDF0EE;border:1px solid rgba(176,52,44,.22);
}

.ap-flow-fast b{
  display:block;font:700 13.5px/1.35 var(--sans);
  color:var(--down, #B0342C);margin-bottom:8px;
}
.ap-flow-fast p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.65}

.ap-flow-fast ul{margin:8px 0 0;padding-left:20px}
.ap-flow-fast li{
  font-size:13px;color:var(--ink-soft);line-height:1.6;margin-bottom:4px;
}

.ap-fast-after{margin-top:10px !important}

/* ══════════════════════════════════════════════════════════
   ЗАЩИТАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ПРАВОТО ДА ВЪЗРАЗИШ.
 *
 * Фалшиви сигнали има постоянно. Ако няма път за защита, всеки сигнал
 * е присъда.
 */
.ap-appeal{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(22px,3vw,30px);
}

.ap-appeal h2{color:#fff;margin:0 0 10px}
.ap-appeal > p{
  margin:0 0 20px;font-size:14px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:560px;
}

.ap-appeal-l{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.ap-appeal-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r, 10px);padding:18px;
}

.ap-appeal-n{
  width:26px;height:26px;border-radius:50%;margin-bottom:12px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.14);color:#fff;font:700 12px/1 var(--mono);
}

.ap-appeal-i b{
  display:block;font:700 13.5px/1.35 var(--sans);color:#fff;margin-bottom:5px;
}
.ap-appeal-i span{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.6}

.ap-appeal-say{
  margin-top:18px;padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.18);border:1px solid rgba(111,217,172,.24);
  font-size:13px;color:#6FD9AC;line-height:1.65;
}
.ap-appeal-say b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ДОКЛАДВАНЕ
   ══════════════════════════════════════════════════════════ */
.ap-rep{
  background:var(--wash-2, #EDF1F6);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,36px);
  align-items:center;
}

.ap-rep h3{margin:0 0 8px}
.ap-rep p{
  margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.65;
  max-width:560px;
}
.ap-rep b{color:var(--ink);font-weight:700}

.ap-rep-box{
  padding:13px 15px;border-radius:var(--r, 10px);background:var(--paper);
  border:1px solid var(--line);font-size:13px;line-height:1.7;
  color:var(--ink-soft);
}
.ap-rep-box b{display:block;color:var(--ink);margin-bottom:4px}
.ap-rep-box a{color:var(--rose);font-weight:600;text-decoration:none}
.ap-rep-box a:hover{text-decoration:underline}

.ap-rep-go{flex:0 0 auto}

/* ══════════════════════════════════════════════════════════
   ДРУГИТЕ ДОКУМЕНТИ
   ══════════════════════════════════════════════════════════ */
.ap-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.ap-doc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  text-decoration:none;color:inherit;transition:border-color .15s;
}
.ap-doc-i:hover{border-color:var(--steel-lt)}

.ap-doc-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.ap-doc-ic svg{width:16px;height:16px}

.ap-doc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.ap-doc-i span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ── по екрани ── */
@media (max-width:1000px){
  .ap-stop{grid-template-columns:1fr}
  .ap-appeal-l{grid-template-columns:1fr}
  .ap-docs{grid-template-columns:1fr}
  .ap-rep{grid-template-columns:1fr}
}

@media (max-width:620px){
  /* Отговорът пада под въпроса, вместо да го смачква. */
  .ap-grey-r{grid-template-columns:auto 1fr}
  .ap-grey-a{grid-column:2;justify-self:start}

  /* Часовете остават, точките отпадат. */
  .ap-flow-r{grid-template-columns:auto 1fr}
  .ap-flow-d{display:none}
  .ap-flow-r::before{display:none}

  .ap-rep-go .btn{width:100%}
}

/* ==== politika-polzvane: край ==== */

/* ==== nov-geroy: начало ==== */

/* ══════════════════════════════════════════════════════════
   ГЕРОЙ С РИСУНКА
   ══════════════════════════════════════════════════════════ */
/*
 * РИСУВАН, НЕ СНИМКА.
 *
 * Купените снимки на сървърни зали са едни и същи навсякъде — човек ги
 * е виждал при пет конкурента, преди да стигне тук.
 */
.hero-art{
  position:relative;overflow:hidden;
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(43,127,212,.22), transparent 60%),
    radial-gradient(900px 500px at 10% 110%, rgba(192,51,92,.16), transparent 55%),
    linear-gradient(160deg, #071628 0%, var(--navy, #0B1F38) 55%, #12304F 100%);
  color:#fff;
  padding:clamp(44px,6.5vw,92px) 0 clamp(52px,7.5vw,104px);
}

/* Мрежата отзад: дълбочина, без да отвлича. */
.hero-art::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(closest-side at 50% 40%, #000 40%, transparent 100%);
  mask-image:radial-gradient(closest-side at 50% 40%, #000 40%, transparent 100%);
}

.hero-art-in{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(30px,5vw,62px);align-items:center;
}

/* Лявата половина: текстът. */
.hero-art-t{min-width:0}

.hero-art h1{
  color:#fff;margin:0 0 18px;
  font-size:clamp(2rem,4.4vw,3.2rem);line-height:1.06;letter-spacing:-.04em;
}

/* Подчертаните думи: преливка вместо плътен цвят. */
.hero-art h1 em{
  font-style:normal;white-space:nowrap;
  background:linear-gradient(120deg,#FF8FAB 0%,#FFB4A2 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
}

.hero-art .eyebrow{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:14px;
  font:700 11.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;
  color:#FF8FAB;
}
.hero-art .eyebrow::before{
  content:'';width:22px;height:2px;border-radius:2px;background:#FF8FAB;
}

.hero-art-lead{
  color:rgba(255,255,255,.76);font-size:clamp(15.5px,1.9vw,18px);
  line-height:1.62;margin:0 0 28px;max-width:520px;
}

.hero-art-go{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}

/* Числата: доверие с числа, не с думи. */
.hero-art-tr{
  display:flex;gap:26px;flex-wrap:wrap;
  padding-top:24px;border-top:1px solid rgba(255,255,255,.12);
}

.hero-fact b{
  display:block;font:800 1.35rem/1 var(--mono);letter-spacing:-.03em;
  color:#fff;margin-bottom:5px;
}
.hero-fact span{font-size:12.5px;color:rgba(255,255,255,.55);line-height:1.4}

/* ── самата рисунка ── */
.hero-art-p svg{
  width:100%;height:auto;display:block;
  filter:drop-shadow(0 24px 48px rgba(0,0,0,.34));
}

/* Пулсът по кабелите: показва, че нещо тече. */
@keyframes hr-flow{to{stroke-dashoffset:-24}}
.hr-wire{stroke-dasharray:4 8;animation:hr-flow 1.4s linear infinite}

@keyframes hr-blink{0%,100%{opacity:1}50%{opacity:.25}}
.hr-led{animation:hr-blink 2.4s ease-in-out infinite}
.hr-led-2{animation-delay:.5s}
.hr-led-3{animation-delay:1s}

/*
 * ПРИ ИЗКЛЮЧЕНО ДВИЖЕНИЕ всичко спира.
 *
 * Хора с чувствителност към движение го изключват в системата —
 * страницата трябва да го спазва.
 */
@media (prefers-reduced-motion: reduce){
  .hr-wire,
  .hr-led{animation:none}
}

/* ══════════════════════════════════════════════════════════
   ЛЕНТА С ЛОГАТА
   ══════════════════════════════════════════════════════════ */
.logo-bar{
  padding:clamp(24px,3.6vw,38px) 0;
  background:var(--paper, #fff);
  border-bottom:1px solid var(--line, #DFE6EE);
}

.logo-bar-t{
  text-align:center;margin:0 0 20px;
  font:600 12px/1 var(--sans);letter-spacing:.09em;text-transform:uppercase;
  color:var(--steel-lt, #7387A0);
}

.logo-bar-l{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(22px,4.5vw,54px);flex-wrap:wrap;
}

/*
 * СИВО, ОЦВЕТЯВА СЕ ПРИ ПОСОЧВАНЕ.
 *
 * Чуждите лога в цвят крадат вниманието от нашето. Сивото ги оставя
 * като доказателство, а не като реклама.
 */
.logo-i{
  display:inline-flex;align-items:center;gap:9px;
  opacity:.7;filter:grayscale(1);
  transition:opacity .16s, filter .16s;
}
.logo-i:hover{opacity:1;filter:grayscale(0)}

.logo-i img{width:24px;height:24px;flex:0 0 auto;object-fit:contain}

.logo-i b{
  font:700 15px/1 var(--sans);color:var(--steel-lt, #7387A0);
}
.logo-i:hover b{color:var(--ink, #0B1F38)}

/* ══════════════════════════════════════════════════════════
   ДВЕ ПОПРАВКИ В ПЛОЧКИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЛИПСВАЩОТО С КРЪСТЧЕ.
 *
 * Досега „FTP Акаунти НЕ“ излизаше със същата зелена отметка като
 * останалите — тоест липсата изглеждаше като предимство.
 */
.plan-list li.is-no{
  color:var(--steel-lt, #7387A0);
}

.plan-list li.is-no::before{
  content:'✕';
  color:var(--line-2, #C4D0DC);
  font-weight:700;
}

/*
 * ЦЕНАТА ПРИ ПОДНОВЯВАНЕ.
 *
 * Изненадата на дванайсетия месец е първата причина хората да си
 * тръгват от хостинг. Другите я крият в общите условия.
 *
 * Пунктираната черта отгоре я отделя от цената, без да я скрива.
 */
.plan-renew{
  margin:9px 0 0;padding-top:9px;
  border-top:1px dashed var(--line-2, #C4D0DC);
  font-size:11px;line-height:1.45;color:var(--steel-lt, #7387A0);
}

/* ── по екрани ── */
@media (max-width:900px){
  .hero-art-in{grid-template-columns:1fr;gap:34px}
  .hero-art-p{max-width:500px;margin:0 auto}
}

@media (max-width:620px){
  .hero-art-go{flex-direction:column}
  .hero-art-go .btn{width:100%}
  .hero-art-tr{gap:20px}

  /* Рисунката пада: на тесен екран тя изяжда целия първи екран. */
  .hero-art-p{display:none}
}

/* ==== nov-geroy: край ==== */

/* ==== dsearch-art: начало ==== */

/* ══════════════════════════════════════════════════════════
   РИСУНКАТА ПРИ ТЪРСЕНЕ НА ДОМЕЙН
   ══════════════════════════════════════════════════════════ */
/*
 * ЗАЩО Е ТУК:
 *
 * Дотук дясната колона беше само плочки с цени — половин екран, зает
 * от шест малки правоъгълника.
 *
 * Рисунката показва КАКВО Е ДОМЕЙН: име, което сочи към машина. Това е
 * въпросът зад половината запитвания в поддръжката.
 */
.dsearch-side{
  display:grid;
  gap:20px;
  align-content:start;
  min-width:0;
}

.dsearch-art{margin:0}

.dsearch-art svg{
  width:100%;
  height:auto;
  display:block;
  max-width:400px;
  margin:0 auto;
  filter:drop-shadow(0 18px 40px rgba(0,0,0,.3));
}

/* Пулсът по кабелите: показва, че нещо тече. */
@keyframes da-flow{to{stroke-dashoffset:-20}}
.da-wire{stroke-dasharray:3 7;animation:da-flow 1.3s linear infinite}

@keyframes da-blink{0%,100%{opacity:1}50%{opacity:.35}}
.da-dot{animation:da-blink 2.6s ease-in-out infinite}
.da-dot-2{animation-delay:.6s}
.da-dot-3{animation-delay:1.2s}

/* Лентата с адреса се носи бавно: дава живот, без да отвлича. */
@keyframes da-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.da-float{animation:da-float 4s ease-in-out infinite}

/*
 * ПРИ ИЗКЛЮЧЕНО ДВИЖЕНИЕ всичко спира.
 *
 * Хора с чувствителност към движение го изключват в системата —
 * страницата трябва да го спазва.
 */
@media (prefers-reduced-motion: reduce){
  .da-wire,
  .da-dot,
  .da-float{animation:none}
}

/* ── по екрани ── */
@media (max-width:900px){
  /* Рисунката се смалява, за да не изяде екрана. */
  .dsearch-art svg{max-width:320px}
}

@media (max-width:620px){
  /*
   * Рисунката пада на тесен екран.
   *
   * Там първият екран трябва да е полето за търсене — украсата само го
   * избутва надолу.
   */
  .dsearch-art{display:none}
}

/* ==== dsearch-art: край ==== */

/* ==== tseni-domeyni: начало ==== */

/* ══════════════════════════════════════════════════════════
   ЦЕНИ НА ДОМЕЙНИ
   ══════════════════════════════════════════════════════════ */

.tc-head-s{max-width:660px;margin:0 0 clamp(24px,3.4vw,40px)}
.tc-head-s.is-mid{margin-inline:auto;text-align:center}
.tc-head-s h2{margin:0 0 12px}
.tc-head-s p{margin:0;color:var(--steel);font-size:14.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ТУК НЯМА ГОЛЯМ ГЕРОЙ.
 *
 * Човек, който отваря страница с цени, вече знае какво иска — той
 * търси число, не убеждаване. Затова главата е ниска.
 */
.tc-top{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(900px 400px at 82% -20%, rgba(28,95,168,.24), transparent 62%),
    linear-gradient(156deg, #0A1D33 0%, var(--navy, #0E2745) 62%, #173654 100%);
  padding:clamp(32px,4.4vw,58px) 0 clamp(28px,3.8vw,50px);
}

.tc-top::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px);
  background-size:50px 50px;
  -webkit-mask-image:radial-gradient(closest-side at 50% 30%, #000 45%, transparent);
  mask-image:radial-gradient(closest-side at 50% 30%, #000 45%, transparent);
}

.tc-top-in{position:relative;z-index:1;max-width:760px}

.tc-top h1{
  color:#fff;margin:0 0 16px;
  font-size:clamp(1.85rem,4vw,2.9rem);line-height:1.06;letter-spacing:-.042em;
}
.tc-top h1 em{
  font-style:normal;
  background:linear-gradient(120deg,#6FD9AC 0%,#8FC0F0 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

.tc-top .eyebrow{color:#6FD9AC}
.tc-top .eyebrow::before{background:#6FD9AC}

.tc-lead{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.9vw,17px);
  line-height:1.6;margin:0 0 26px;max-width:560px;
}

/*
 * ТРИТЕ ЧИСЛА · какво значат колоните.
 *
 * Без тях таблицата отдолу иска обяснение. С тях се чете направо.
 */
.tc-cols{display:flex;gap:22px;flex-wrap:wrap}

.tc-col{display:flex;align-items:flex-start;gap:10px;max-width:236px}

.tc-col-n{
  width:24px;height:24px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);color:#fff;font:700 11px/1 var(--mono);
}

.tc-col b{display:block;font:700 13px/1.3 var(--sans);color:#fff;margin-bottom:3px}
.tc-col > span > span{font-size:12px;color:rgba(255,255,255,.56);line-height:1.5}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ЗАЛЕПЕНА ГОРЕ · при много разширения човек търка дълго, а търсенето
 * трябва да е под ръка през цялото време.
 */
.tc-bar{
  position:sticky;top:0;z-index:20;
  background:var(--paper);border-bottom:1px solid var(--line);
  padding:13px 0;box-shadow:0 2px 12px rgba(14,39,69,.05);
}

.tc-bar-in{display:flex;gap:12px;align-items:center;flex-wrap:wrap}

.tc-find{flex:1;min-width:220px;position:relative}

.tc-find input{
  width:100%;padding:11px 16px 11px 40px;border-radius:var(--r, 10px);
  border:1.5px solid var(--line);background:var(--wash);
  font:500 14px/1.3 var(--sans);color:var(--ink);
  transition:border-color .14s, background .14s;
}
.tc-find input:focus{outline:none;border-color:var(--rose);background:var(--paper)}
.tc-find input::placeholder{color:var(--steel-lt);font-weight:400}

.tc-find svg{
  position:absolute;left:14px;top:50%;transform:translateY(-50%);
  width:16px;height:16px;color:var(--steel-lt);pointer-events:none;
}

.tc-tabs{display:flex;gap:6px;flex-wrap:wrap}

.tc-tab{
  padding:9px 15px;border-radius:99px;cursor:pointer;
  border:1.5px solid var(--line);background:var(--paper);
  font:600 12.5px/1 var(--sans);color:var(--steel);
  transition:all .14s;white-space:nowrap;
}
.tc-tab:hover{border-color:var(--line-2);color:var(--ink)}
.tc-tab.is-on{background:var(--navy);border-color:var(--navy);color:#fff}

.tc-count{font:600 12.5px/1 var(--mono);color:var(--steel-lt);white-space:nowrap}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦАТА
   ══════════════════════════════════════════════════════════ */
.tc-table{
  border:1.5px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);overflow:hidden;
}

.tc-head{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr auto;
  gap:14px;align-items:center;
  padding:12px 20px;background:var(--wash);
  border-bottom:1.5px solid var(--line);
  font:700 11px/1 var(--sans);letter-spacing:.07em;text-transform:uppercase;
  color:var(--steel-lt);
}
.tc-head > span:not(:first-child){text-align:right}
.tc-head > span:last-child{width:92px}

.tc-row{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr auto;
  gap:14px;align-items:center;
  padding:14px 20px;border-bottom:1px solid var(--line);
  transition:background .12s;
}
.tc-row:last-child{border-bottom:0}
.tc-row:hover{background:var(--wash)}

/* Скритите при търсене · без това остават на мястото си. */
.tc-row[hidden]{display:none}

/* Най-търсените са отделени: те са почти всички поръчки. */
.tc-row.is-top{background:#FDF1F4}
.tc-row.is-top:hover{background:#FBE7ED}

.tc-name{display:flex;align-items:center;gap:9px;min-width:0;flex-wrap:wrap}

.tc-tld{font:800 1.05rem/1 var(--mono);letter-spacing:-.03em;color:var(--ink)}

.tc-tag{padding:3px 9px;border-radius:99px;font:700 9.5px/1.4 var(--sans);white-space:nowrap}
.tc-tag.hot{background:var(--rose);color:#fff}
.tc-tag.doc{background:#FBF4E4;color:var(--warn, #9A6A12)}

.tc-p{text-align:right;font:700 14px/1 var(--mono);white-space:nowrap}

/*
 * ЦВЕТЪТ КАЗВА ДАЛИ ЦЕНАТА СЕ МЕНИ.
 *
 * Зелено · подновяването е същото като регистрацията
 * Жълто  · по-скъпо е · това е цената на регистъра, не измама
 *
 * Без цвят човек сравнява числа с очи, ред по ред.
 */
.tc-p.same{color:var(--up, #127A55)}
.tc-p.up{color:var(--warn, #9A6A12)}

.tc-p s{
  display:block;font:400 11.5px/1 var(--mono);color:var(--steel-lt);margin-bottom:4px;
}

.tc-go{width:92px;text-align:right}

/*
 * ПРОМОЦИЯТА НА РЕГИСТЪРА · казва се чия е.
 *
 * Премълчаването ѝ е причината хората да се чувстват измамени при
 * първото подновяване.
 */
.tc-note{
  grid-column:1 / -1;margin-top:8px;
  padding:9px 12px;border-radius:8px;
  background:#FBF4E4;border-left:3px solid var(--warn, #9A6A12);
  font-size:12px;color:var(--warn, #9A6A12);line-height:1.5;
}

.tc-foot{
  padding:14px 20px;background:var(--wash);border-top:1px solid var(--line);
  font-size:12.5px;color:var(--steel);line-height:1.6;
}

.tc-foot-i{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.tc-foot-i svg{width:14px;height:14px;flex:0 0 auto;color:var(--steel-lt)}
.tc-foot b{color:var(--ink);font-weight:700}

/* Празният отговор · без него човек мисли сайта за счупен. */
.tc-none{padding:40px 0;text-align:center;font-size:14.5px;color:var(--steel)}

/* ══════════════════════════════════════════════════════════
   .BG
   ══════════════════════════════════════════════════════════ */
.tc-bgx{
  background:var(--paper);border:1.5px solid var(--line);
  border-radius:var(--r-xl, 24px);overflow:hidden;
}

.tc-bgx-h{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:clamp(20px,2.8vw,26px);background:#EAF2FB;
  border-bottom:1.5px solid rgba(28,95,168,.16);
}

.tc-flag{
  width:48px;height:34px;border-radius:8px;flex:0 0 auto;overflow:hidden;
  box-shadow:0 3px 10px rgba(14,39,69,.18);
}
.tc-flag svg{display:block;width:100%;height:100%}

.tc-bgx-h b{font:800 16.5px/1.2 var(--sans);color:var(--blue, #1C5FA8)}
.tc-bgx-h > span > span{display:block;font-size:12.5px;color:var(--steel);margin-top:4px}

.tc-bgx-l{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}

.tc-rule{background:var(--paper);padding:20px 22px}

.tc-rule-h{display:flex;align-items:center;gap:10px;margin-bottom:9px}

.tc-rule-ic{
  width:30px;height:30px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;
}
.tc-rule:nth-child(1) .tc-rule-ic{background:#E7F5EF;color:var(--up, #127A55)}
.tc-rule:nth-child(2) .tc-rule-ic{background:#FBF4E4;color:var(--warn, #9A6A12)}
.tc-rule:nth-child(3) .tc-rule-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.tc-rule:nth-child(4) .tc-rule-ic{background:#FDF1F4;color:var(--rose)}
.tc-rule-ic svg{width:15px;height:15px}

.tc-rule b{font:700 13.5px/1.3 var(--sans)}
.tc-rule p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.62}

/* ══════════════════════════════════════════════════════════
   ВКЛЮЧЕНО
   ══════════════════════════════════════════════════════════ */
.tc-incl{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}

.tc-inc{
  background:var(--paper);border:1.5px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;transition:border-color .16s;
}
.tc-inc:hover{border-color:var(--line-2)}

.tc-inc-ic{width:44px;height:44px;border-radius:14px;margin-bottom:14px;
           display:grid;place-items:center}
.tc-inc:nth-child(1) .tc-inc-ic{background:#E7F5EF;color:var(--up, #127A55)}
.tc-inc:nth-child(2) .tc-inc-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.tc-inc:nth-child(3) .tc-inc-ic{background:#FDF1F4;color:var(--rose)}
.tc-inc:nth-child(4) .tc-inc-ic{background:#FBF4E4;color:var(--warn, #9A6A12)}
.tc-inc-ic svg{width:20px;height:20px}

.tc-inc b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.tc-inc p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/*
 * „ДРУГАДЕ СЕ ПЛАЩА ОТДЕЛНО“.
 *
 * Иначе „скрити лични данни“ не значи нищо на човек, който не знае, че
 * това се продава.
 */
.tc-inc em{
  display:block;font-style:normal;margin-top:9px;
  font:700 11.5px/1 var(--sans);color:var(--up, #127A55);
}

/* ══════════════════════════════════════════════════════════
   НУЛИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ТОВА, КОЕТО ДРУГАДЕ СТРУВА ПАРИ.
 *
 * По-силно от списък с включени неща: числото „0 €“ се вижда и се
 * помни, а „безплатно“ е дума, която всички ползват.
 */
.tc-zero{
  background:var(--navy);color:#fff;border-radius:var(--r-xl, 24px);
  padding:clamp(26px,3.6vw,40px);
}

.tc-zero h2{color:#fff;margin:0 0 10px}
.tc-zero > p{
  margin:0 0 26px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:540px;
}

.tc-zero-l{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.tc-zero-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r, 10px);padding:20px;text-align:center;
}

.tc-zero-n{
  display:block;font:800 1.8rem/1 var(--mono);letter-spacing:-.04em;
  color:#6FD9AC;margin-bottom:8px;
}

.tc-zero-i b{display:block;font:700 13px/1.35 var(--sans);color:#fff;margin-bottom:5px}
.tc-zero-i > span:last-child{font-size:11.5px;color:rgba(255,255,255,.55);line-height:1.5}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.tc-faq{display:grid;grid-template-columns:1fr 1fr;gap:13px}

.tc-q{
  background:var(--paper);border:1.5px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px 22px 54px;position:relative;
}

/* Въпросителният знак: дребна графика, която прави реда четим. */
.tc-q::before{
  content:'?';position:absolute;left:20px;top:22px;
  width:23px;height:23px;border-radius:50%;
  display:grid;place-items:center;
  background:#FDF1F4;color:var(--rose);font:800 12.5px/1 var(--sans);
}

.tc-q h3{font:700 14px/1.4 var(--sans);margin:0 0 8px}
.tc-q p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.7}
.tc-q b{font-weight:700;color:var(--ink)}

/* ══════════════════════════════════════════════════════════
   НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.tc-cta{
  background:var(--wash-2, #EDF1F6);border:1.5px solid var(--line);
  border-radius:var(--r-xl, 24px);padding:clamp(24px,3.4vw,36px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,36px);
  align-items:center;
}

.tc-cta h3{margin:0 0 8px;font-size:1.15rem}
.tc-cta p{margin:0;font-size:13.5px;color:var(--steel);line-height:1.65;max-width:520px}

/* ── по екрани ── */
@media (max-width:1000px){
  .tc-incl{grid-template-columns:1fr 1fr}
  .tc-zero-l{grid-template-columns:1fr 1fr}
  .tc-bgx-l{grid-template-columns:1fr}
  .tc-faq{grid-template-columns:1fr}
  .tc-cta{grid-template-columns:1fr}
}

@media (max-width:760px){
  /*
   * ТАБЛИЦАТА СТАВА КАРТИ.
   *
   * Пет колони на телефон значи водоравно търкаляне при всеки ред — а
   * човек тогава губи от поглед кое разширение гледа.
   */
  .tc-head{display:none}

  .tc-row{grid-template-columns:1fr 1fr;gap:10px;padding:16px 18px}

  .tc-name{grid-column:1 / -1;margin-bottom:4px}

  .tc-p{
    text-align:left;display:flex;flex-direction:column;gap:3px;font-size:13.5px;
  }

  /* Надписът идва от „data-l“ · на широк екран го има в главата. */
  .tc-p::before{
    content:attr(data-l);
    font:600 10px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
    color:var(--steel-lt);
  }

  .tc-go{grid-column:1 / -1;width:100%;text-align:left;margin-top:6px}
  .tc-go .btn{width:100%}

  .tc-tabs{width:100%;overflow-x:auto;padding-bottom:2px}
}

@media (max-width:560px){
  .tc-incl{grid-template-columns:1fr}
  .tc-zero-l{grid-template-columns:1fr}
}

/* ==== tseni-domeyni: край ==== */

/* ==== terakota: начало ==== */

/* ══════════════════════════════════════════════════════════
   ТЕРАКОТА · подменя цветовете на целия сайт
   ══════════════════════════════════════════════════════════ */
/*
 * ═══ ЗАЩО ЦЕЛИЯТ САЙТ, А НЕ САМО НАЧАЛНАТА ═══
 *
 * Ако сменим само началната, тя ще е топла, а останалите четиридесет
 * страници — сини. Човек го усеща веднага, дори да не знае защо.
 *
 * КАК: подменят се СЪЩЕСТВУВАЩИТЕ променливи, не се пишат нови. Затова
 * промяната стига навсякъде наведнъж, без да се пипа нито един клас.
 *
 * ЗА ВРЪЩАНЕ: маха се този блок и всичко става както преди.
 */
:root{
  /* --- въглен с топла нотка · вместо морско синьо --- */
  --navy:#241C18;
  --navy-2:#332723;
  --navy-3:#463630;
  --navy-deep:#1A1411;

  /* --- хартия с пясъчен оттенък --- */
  --paper:#FFFFFF;
  --wash:#FBF7F3;
  --wash-2:#F4EDE6;

  --line:#E8DED5;
  --line-2:#D5C6B9;
  --line-3:#BFAB9C;

  --ink:#241C18;
  --ink-2:#4A3C35;
  --ink-3:#8B7668;

  /* --- теракота · главният акцент --- */
  --rose:#C2562F;
  --rose-2:#9E4225;
  --rose-w:#FDF2ED;

  /*
   * ЗЕЛЕНОТО СТАВА ПО-ТОПЛО.
   *
   * Студеното зелено до теракота изглежда чуждо. Това е с лека жълта
   * нотка и се връзва.
   */
  --ok:#3B7A4E;
  --ok-w:#EDF6EF;

  --warn:#B8862B;
  --warn-w:#FBF3E2;

  --bad:#A83A2A;
  --bad-w:#FCEFEC;

  /* Синьото остава само за редки бележки · не за украса. */
  --blue:#4A6B7C;
  --blue-w:#EDF2F4;

  --star:#B8862B;

  /* Сенките с топъл оттенък · студената сянка издава синьо. */
  --sh-s:0 1px 2px rgba(36,28,24,.05);
  --sh:0 2px 10px rgba(36,28,24,.07);
  --sh-l:0 16px 44px rgba(36,28,24,.13);
  --sh-xl:0 24px 60px rgba(36,28,24,.19);
}

/* ══════════════════════════════════════════════════════════
   БУТОНИТЕ · дизайнерски, не квадратчета
   ══════════════════════════════════════════════════════════ */
/*
 * ЗЕЛЕНОТО Е САМО ЗА ДЕЙСТВИЕ.
 *
 * Ако всичко е зелено, нищо не е. Тук зелено значи „това щракни“ —
 * поръчай, вземи, започни.
 *
 * ДВИЖЕНИЕТО: светлина, която минава при посочване, и стрелка, която
 * тръгва напред. Бутонът показва, че води някъде.
 */
.btn{
  position:relative;overflow:hidden;isolation:isolate;
  border-radius:99px;border:0;
  background:linear-gradient(180deg, #B7FF35 0%, #4a9503, #7CFF00 100%);
  color:#fff;
  box-shadow:0 6px 18px rgba(59,122,78,.3), inset 0 1px 0 rgba(255,255,255,.2);
  transition:transform .22s cubic-bezier(.2,.9,.2,1), box-shadow .22s;
}
.btn:hover{
  background:linear-gradient(156deg, #69c90e 0%, #69c90e, #305a08 100%);
  transform:translateY(-2px);
  box-shadow:0 10px 28px rgba(59,122,78,.38), inset 0 1px 0 rgba(255,255,255,.26);
}
.btn:active{transform:translateY(0)}

/* Светлината, която минава · прави бутона предмет. */
.btn::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg, transparent 20%, rgba(255,255,255,.28) 50%, transparent 80%);
  transform:translateX(-120%);
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.btn:hover::before{transform:translateX(120%)}

.btn svg{transition:transform .22s}
.btn:hover svg{transform:translateX(3px)}

/* Теракотеният · за разглеждане, не за поръчка. */
.btn-rose,
.btn-terra{
  background:linear-gradient(135deg, #E0764C 0%, var(--rose) 55%, var(--rose-2) 100%);
  box-shadow:0 6px 18px rgba(194,86,47,.28), inset 0 1px 0 rgba(255,255,255,.2);
}
.btn-rose:hover,
.btn-terra:hover{
  background:linear-gradient(135deg, #E0764C 0%, var(--rose) 55%, var(--rose-2) 100%);
  box-shadow:0 10px 28px rgba(194,86,47,.36), inset 0 1px 0 rgba(255,255,255,.26);
}

/*
 * ОЧЕРТАНИЯТ · с двоен ръб.
 *
 * Обикновена рамка изглежда недовършена; вътрешната сянка прави
 * бутона предмет.
 */
.btn-ghost{
  background:transparent;color:#5e890f;
  box-shadow:inset 0 0 0 1.5px #7cbf00;
}
.btn-ghost:hover{
  background:var(--wash);color:var(--ink);
  box-shadow:inset 0 0 0 1.5px var(--ink);transform:translateY(-2px);
}
.btn-ghost::before{display:none}

.btn-light{
  background:rgba(255,255,255,.1);color:#fff;
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.24);
}
.btn-light:hover{
  background:rgba(255,255,255,.18);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4);
}

/* ══════════════════════════════════════════════════════════
   ГЕРОЯТ · въглен с теракотено сияние
   ══════════════════════════════════════════════════════════ */
.hero-art{
  background:
    radial-gradient(1100px 620px at 84% -12%, rgba(194,86,47,.34), transparent 62%),
    radial-gradient(760px 420px at 6% 108%, rgba(184,134,43,.18), transparent 58%),
    linear-gradient(178deg, #1A1411 0%, var(--navy) 48%, #7cbf00 100%);
}

/*
 * ТОЧКИ, НЕ МРЕЖА.
 *
 * Мрежата прилича на милиметрова хартия. Точките са по-меки.
 */
.hero-art::before{
  background-image:radial-gradient(rgba(255,255,255,.07) 1.2px, transparent 1.2px) !important;
  background-size:26px 26px !important;
}

.hero-art h1 em{
  background:linear-gradient(110deg, #B7FF35 0%, #7CFF00 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-art h1 em svg{display:none}

.hero-art .eyebrow{color:#7CFF00;}
.hero-art .eyebrow::before{background:#7CFF00;}

/* ══════════════════════════════════════════════════════════
   ЖИВОТО ТАБЛО · вместо рисунка
   ══════════════════════════════════════════════════════════ */
/*
 * ═══ ГЛАВНОТО НА ГЕРОЯ ═══
 *
 * Рисунката показва какво имаме; таблото показва, че работи В МОМЕНТА.
 * Числата трепкат, чертата се движи, точката пулсира.
 *
 * Никой хостинг не го прави, защото трябва да е верен — а верният е
 * най-доброто доказателство.
 */
.dash{
  position:relative;
  background:linear-gradient(160deg, rgba(255,255,255,.07) 0%, rgba(255,255,255,.03) 100%);
  border:1px solid rgba(255,255,255,.13);
  border-radius:28px;padding:clamp(20px,2.4vw,28px);
  backdrop-filter:blur(14px);
  box-shadow:0 24px 70px rgba(0,0,0,.4);
}

.dash::before{
  content:'';position:absolute;inset:-1px;border-radius:inherit;z-index:-1;
  background:linear-gradient(140deg, rgba(194,86,47,.5), transparent 55%);
  opacity:.6;filter:blur(22px);
}

.dash-h{
  display:flex;align-items:center;gap:12px;
  padding-bottom:16px;margin-bottom:18px;
  border-bottom:1px solid rgba(255,255,255,.1);
}

/* Точката „на живо“ · пулсира, за да личи, че не е снимка. */
.dash-live{
  display:inline-flex;align-items:center;gap:8px;
  padding:5px 12px 5px 9px;border-radius:99px;
  background:rgba(59,122,78,.2);border:1px solid rgba(87,160,108,.34);
  font:700 10.5px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;
  color:#B7FF35;
}
.dash-live i{
  width:7px;height:7px;border-radius:50%;background:#8FD3A2;flex:0 0 auto;
  animation:dash-beat 1.8s ease-in-out infinite;
}
@keyframes dash-beat{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.75)}}

.dash-t{font:700 13px/1.2 var(--sans);color:rgba(255,255,255,.55);margin-left:auto}

.dash-top{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}

.dm{
  padding:16px 18px;border-radius:16px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);
}
.dm-l{
  display:block;font:600 10.5px/1 var(--sans);letter-spacing:.09em;
  text-transform:uppercase;color:rgba(255,255,255,.42);margin-bottom:10px;
}
.dm-v{
  display:flex;align-items:baseline;gap:5px;
  font:700 1.65rem/1 var(--mono);letter-spacing:-.04em;color:#fff;
}
.dm-v small{font-size:.85rem;font-weight:500;color:rgba(255,255,255,.45)}
.dm-v.is-ok{color:#B7FF35;}
.dm-sub{display:block;margin-top:8px;font-size:11px;color:rgba(255,255,255,.4)}

/*
 * ЧЕРТАТА СЕ ДВИЖИ НАЛЯВО.
 *
 * Две еднакви криви една след друга, които се плъзгат — така
 * движението няма шев.
 */
.dash-graph{
  height:78px;border-radius:16px;overflow:hidden;position:relative;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  margin-bottom:14px;
}
.dash-graph svg{width:100%;height:100%;display:block;overflow:hidden}
@keyframes dash-slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.dash-graph-l{
  position:absolute;top:9px;left:14px;z-index:1;
  font:600 10px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;
  color:rgba(255,255,255,.4);
}

.dash-rows{display:grid;gap:1px;border-radius:16px;overflow:hidden;
           background:rgba(255,255,255,.07)}

.dr{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;
  padding:11px 14px;background:rgba(36,28,24,.5);font-size:12.5px;
}
.dr-dot{width:7px;height:7px;border-radius:50%;background:#8FD3A2;flex:0 0 auto;
        box-shadow:0 0 0 3px rgba(143,211,162,.16)}
.dr-n{font:600 12.5px/1 var(--mono);color:rgba(255,255,255,.82)}
.dr-b{width:64px;height:5px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}
.dr-f{display:block;height:100%;border-radius:99px;
      background:linear-gradient(90deg,#57A06C,#8FD3A2);transition:width 1.4s ease}
.dr-f.is-hot{background:linear-gradient(90deg,var(--rose),#E0764C)}
.dr-ms{font:600 11.5px/1 var(--mono);color:rgba(255,255,255,.5);min-width:38px;text-align:right}

.dash-f{
  margin-top:14px;padding-top:13px;border-top:1px solid rgba(255,255,255,.1);
  font-size:11px;color:rgba(255,255,255,.38);line-height:1.5;
  display:flex;align-items:center;gap:8px;
}
.dash-f svg{width:12px;height:12px;flex:0 0 auto}

@media (prefers-reduced-motion: reduce){
  .dash-live i{animation:none}
}

/* ══════════════════════════════════════════════════════════
   КАРТАТА ЗА ДОМЕЙН · бутикова
   ══════════════════════════════════════════════════════════ */
/*
 * ═══ НЕ Е ЛЕНТА, А КАРТА ═══
 *
 * Обикновено търсачката е ивица с поле и копче. Тук е самостоятелен
 * предмет: повдигнат, с цветна ивица отгоре като печат на кутия.
 *
 * Това е първото, което човек прави — щом е главното, трябва да
 * изглежда като главното.
 */
.dsearch{
  background:transparent !important;
  /*padding:0 !important;
  margin:clamp(-70px,-4vw,-40px) 0 clamp(40px,5vw,72px) !important;*/
  position:relative;z-index:3;
}
.dsearch::before{display:none !important}

.dsearch > .wrap-w,
.dsearch > .wrap-n{
  background:var(--paper);border-radius:34px;
  padding:clamp(26px,3.2vw,38px) !important;
  box-shadow:var(--sh-xl);
  position:relative;overflow:hidden;
  display:block !important;
}

/* Ивицата с преливка · като печат на кутия. */
.dsearch > .wrap-w::before,
.dsearch > .wrap-n::before{
  content:'';position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg, #B7FF35 0%, #7cbf00 45%, var(--ok) 100%);
}

/* Мекото петно в ъгъла · дълбочина, без да пречи. */
.dsearch > .wrap-w::after,
.dsearch > .wrap-n::after{
  content:'';position:absolute;top:-90px;right:-90px;
  width:280px;height:280px;border-radius:50%;
  background:#dffbac4f;opacity:.6;pointer-events:none;
  /*background:var(--rose-w);opacity:.6;pointer-events:none;*/
}

.dsearch-side{position:relative;z-index:1}
.dsearch-art{display:none !important}

/*
 * ПОЛЕТО · дебел ръб, който се оцветява при писане.
 *
 * Обикновено поле изглежда като формуляр. Ръбът го прави предмет, а
 * оцветяването казва „чувам те“.
 */
.dsearch form,
.dsearch .dsearch-form{
  display:flex;align-items:center;gap:0;
  background:#b7ff354f;/*border:2px solid var(--line);*/
  border-radius:99px;padding:6px;
  transition:border-color .22s, box-shadow .22s, background .22s;
}
.dsearch form:focus-within,
.dsearch .dsearch-form:focus-within{
  border-color:var(--rose);background:var(--paper);
  box-shadow:0 0 0 5px var(--rose-w);
}

.dsearch input[type="text"],
.dsearch input[type="search"]{
  flex:1;min-width:0;border:0 !important;background:transparent !important;
  padding:14px 18px !important;
  font:600 clamp(15px,2vw,18px)/1.3 var(--sans) !important;color:var(--ink);
  box-shadow:none !important;
}
.dsearch input:focus{outline:none !important;box-shadow:none !important}

.dsearch button[type="submit"],
.dsearch .btn{border-radius:99px;flex:0 0 auto}

/* Плочките с разширенията. */
.tld-chips{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-top:18px}

.tld-chips a,
.tld-chip{
  display:inline-flex;align-items:baseline;gap:8px;
  padding:9px 15px;border-radius:99px;text-decoration:none;
  background:var(--paper);border:1.5px solid var(--line);
  font:700 13px/1 var(--mono);color:var(--ink);
  transition:border-color .18s, transform .18s, box-shadow .18s;
}
.tld-chips a:hover,
.tld-chip:hover{
  border-color:#8bc850;transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(194,86,47,.16);
}
.tld-chips b,
.tld-chip b{font:600 15px/1 var(--sans);color:#000000;}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ · копчето се разширява
   ══════════════════════════════════════════════════════════ */
.plan-card{border-radius:26px;transition:transform .22s cubic-bezier(.2,.9,.2,1),
           box-shadow .22s, border-color .22s}
.plan-card:hover{transform:translateY(-5px)}
.plan-card.is-featured{border-color:var(--rose)}
.plan-card.is-featured:hover{transform:translateY(-13px)}

/* ══════════════════════════════════════════════════════════
   КАРТИТЕ · един вид от край до край
   ══════════════════════════════════════════════════════════ */
/*
 * ЕДИН ВИД КАРТА, ПОВТОРЕН НАВСЯКЪДЕ.
 *
 * Ъгловото петно расте при посочване — дребно движение, което прави
 * картата жива.
 */
.svc-card,
.card-tile,
.feature-card{
  position:relative;overflow:hidden;border-radius:26px;
  transition:transform .22s cubic-bezier(.2,.9,.2,1), box-shadow .22s, border-color .22s;
}
.svc-card:hover,
.card-tile:hover,
.feature-card:hover{transform:translateY(-5px)}

.svc-card::before,
.card-tile::before{
  content:'';position:absolute;top:-46px;right:-46px;
  width:140px;height:140px;border-radius:50%;
  background:var(--rose);opacity:.08;
  transition:transform .35s cubic-bezier(.2,.9,.2,1);
}
.svc-card:hover::before,
.card-tile:hover::before{transform:scale(1.4)}

/* ══════════════════════════════════════════════════════════
   ПЛАВАЩОТО КОПЧЕ ЗА ЧАТ
   ══════════════════════════════════════════════════════════ */
/*
 * ДОЛУ ВДЯСНО, НА ВСЯКА СТРАНИЦА.
 *
 * Човек, който се затрудни, не търси страница „контакти“ — той иска да
 * пита веднага.
 *
 * ЗЕЛЕНАТА ТОЧКА пулсира: показва, че наистина има някой.
 */
.mchat{
  position:fixed;right:24px;bottom:24px;z-index:60;
  display:flex;align-items:center;gap:12px;
  padding:11px 22px 11px 11px;border-radius:99px;
  background:var(--navy);color:#fff;text-decoration:none;
  box-shadow:0 12px 36px rgba(36,28,24,.38);
  transition:transform .22s, box-shadow .22s;
}
.mchat:hover{transform:translateY(-3px);box-shadow:0 16px 44px rgba(36,28,24,.46);
             color:#fff;text-decoration:none}

.mchat-ic{
  width:40px;height:40px;border-radius:50%;flex:0 0 auto;position:relative;
  display:grid;place-items:center;
  background:linear-gradient(135deg,#57A06C,#2E6140);color:#fff;
}
.mchat-ic svg{width:19px;height:19px}

.mchat-ic::after{
  content:'';position:absolute;right:-1px;bottom:-1px;
  width:12px;height:12px;border-radius:50%;
  background:#8FD3A2;border:2.5px solid var(--navy);
  animation:mchat-live 2.2s ease-in-out infinite;
}
@keyframes mchat-live{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}
@media (prefers-reduced-motion: reduce){ .mchat-ic::after{animation:none} }

.mchat b{display:block;font:700 13.5px/1.2 var(--sans);margin-bottom:2px;color:#fff}
.mchat-t{display:block;font-size:11.5px;color:rgba(255,255,255,.55)}

/* ── по екрани ── */
@media (max-width:900px){
  .dash-top{grid-template-columns:1fr}
}

@media (max-width:640px){
  .dsearch{margin-top:-24px !important}
  .dsearch > .wrap-w,
  .dsearch > .wrap-n{border-radius:24px}

  .dsearch form,
  .dsearch .dsearch-form{flex-direction:column;border-radius:20px;gap:8px}
  .dsearch form .btn{width:100%}

  /* Копчето става само иконка · текстът изяжда екрана. */
  .mchat{right:16px;bottom:16px;padding:10px}
  .mchat-t,
  .mchat b{display:none}
}

/* ==== terakota: край ==== */

/* ==== nov-red: начало ==== */

/* ══════════════════════════════════════════════════════════
   ОЦЕНКИТЕ ОТ ТРИ МЕСТА
   ══════════════════════════════════════════════════════════ */
/*
 * ТЪНКА ЛЕНТА, не раздел.
 *
 * Оценките са потвърждение, не съдържание — затова заемат един ред,
 * а не цял екран.
 */
.rate-bar{
  padding:clamp(20px,2.6vw,30px) 0;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}

.rate-l{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(20px,4vw,54px);flex-wrap:wrap;
}

.rate-i{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.rate-i:hover{text-decoration:none}

.rate-src{
  font:800 12.5px/1 var(--sans);color:var(--ink);
  padding:7px 12px;border-radius:8px;background:var(--wash-2);
}

.rate-s{display:flex;gap:2px}
.rate-s svg{width:14px;height:14px;color:var(--star)}

.rate-n{display:flex;align-items:baseline;gap:6px}
.rate-n b{font:800 1.2rem/1 var(--mono);letter-spacing:-.03em;color:var(--ink)}
.rate-n span{font-size:12px;color:var(--ink-3)}

/* ══════════════════════════════════════════════════════════
   КАРТИТЕ С УСЛУГИ
   ══════════════════════════════════════════════════════════ */
/*
 * ЕДИН ВИД КАРТА, ПОВТОРЕН ШЕСТ ПЪТИ.
 *
 * Различава ги само цветът на ъгловото петно и иконката. Така окото
 * ги чете като едно семейство, а не като шест различни неща.
 */
.svc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

.svc-card{
  position:relative;overflow:hidden;text-decoration:none;color:inherit;
  background:#5E9A000D;border:1.5px solid #7cbf00;
  border-radius:26px;padding:26px;
  display:flex;flex-direction:column;
  transition:transform .22s cubic-bezier(.2,.9,.2,1), box-shadow .22s, border-color .22s;
}
.svc-card:hover{
  transform:translateY(-5px);box-shadow:var(--sh-l);
  border-color:var(--line-2);text-decoration:none;
}

/* Ъгловото петно · расте при посочване. */
.svc-card::before{
  content:'';position:absolute;top:-46px;right:-46px;
  width:140px;height:140px;border-radius:50%;
  opacity:.09;transition:transform .35s cubic-bezier(.2,.9,.2,1);
}
.svc-card:hover::before{transform:scale(1.4)}

.svc-card.c1::before{background:#78BE0A;}
.svc-card.c2::before{background:var(--ok)}
.svc-card.c3::before{background:#5E9A00;}
.svc-card.c4::before{background:#5E9A00;}

.svc-card > *{position:relative;z-index:1}

.svc-ic{
  width:50px;height:50px;border-radius:15px;margin-bottom:16px;
  display:grid;place-items:center;transition:transform .22s;
}
.svc-card:hover .svc-ic{transform:scale(1.06) rotate(-3deg)}
.svc-card.c1 .svc-ic{background:#5E9A000D;color:#5E9A00;}
.svc-card.c2 .svc-ic{background:var(--ok-w);#5E9A00;}
.svc-card.c3 .svc-ic{background:#5E9A000D;color:#5E9A00;}
.svc-card.c4 .svc-ic{background:#5E9A000D;color:#5E9A00;}
.svc-ic svg{width:23px;height:23px}

.svc-tag{
  position:absolute;top:24px;right:24px;z-index:2;
  padding:5px 11px;border-radius:99px;
  font:700 9.5px/1.4 var(--sans);letter-spacing:.05em;text-transform:uppercase;
  background:#70dd08;color:#040404;
}
.svc-tag.is-t{background:#a4fd03b5;}

.svc-card h3{margin:0 0 8px;font:700 1.08rem/1.32 var(--sans);letter-spacing:-.022em}
.svc-card p{margin:0 0 18px;font-size:13.5px;color:var(--ink-2);line-height:1.62;flex:1}

.svc-p{
  display:flex;align-items:center;gap:8px;
  padding-top:16px;border-top:1px solid var(--line);
}
.svc-p b{font:800 1.15rem/1 var(--mono);letter-spacing:-.035em;color:var(--ink)}
.svc-p > span{font-size:12px;color:#000000;}

/*
 * КОПЧЕТО СЕ РАЗШИРЯВА.
 *
 * Кръгче със стрелка, което става „Поръчай“ при посочване — заема
 * малко място, но казва къде се щраква.
 */
.svc-go{
  margin-left:auto;display:inline-flex;align-items:center;gap:0;
  height:38px;padding:0 12px;border-radius:99px;overflow:hidden;
  background:linear-gradient(135deg, #7CFF00, #61b511);
  color:#fff;box-shadow:0 4px 12px rgba(59,122,78,.26);
  transition:gap .24s cubic-bezier(.2,.9,.2,1), padding .24s, box-shadow .22s;
}
.svc-card:hover .svc-go{
  gap:8px;padding:0 16px;box-shadow:0 6px 18px rgba(59,122,78,.36);
}

.svc-go > span{
  max-width:0;overflow:hidden;white-space:nowrap;
  font:700 12.5px/1 var(--sans);color:#000000;
  transition:max-width .24s cubic-bezier(.2,.9,.2,1);
}
.svc-card:hover .svc-go > span{max-width:76px}

.svc-go svg{width:15px;height:15px;flex:0 0 auto}

/* ══════════════════════════════════════════════════════════
   РАЗДЕЛИТЕ ЗА ВИДА ПЛАН
   ══════════════════════════════════════════════════════════ */
/*
 * ЧОВЕК ИЗБИРА ПЪТЯ СИ, преди да гледа числа.
 *
 * Водят към страници, не менят съдържание на място — така всеки вид
 * има свой адрес, който се праща на колега.
 */
.plan-tabs{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:18px}

.plan-tab{
  display:inline-flex;align-items:center;gap:9px;
  padding:12px 24px;border-radius:99px;text-decoration:none;
  border:1.5px solid var(--line);background:var(--paper);
  font:700 14px/1 var(--sans);color:var(--ink-2);
  transition:all .2s;
}
.plan-tab:hover{border-color:var(--line-2);color:var(--ink);text-decoration:none}
.plan-tab.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.plan-tab svg{width:16px;height:16px}

/* ── по екрани ── */
@media (max-width:1000px){
  .svc-cards{grid-template-columns:1fr 1fr}
}

@media (max-width:640px){
  .svc-cards{grid-template-columns:1fr}

  /* Копчето стои разгънато · на телефон няма посочване. */
  .svc-go{gap:8px;padding:0 16px}
  .svc-go > span{max-width:76px}

  .plan-tabs{width:100%}
  .plan-tab{flex:1;justify-content:center;padding:12px 10px;font-size:13px}
}

/* ==== nov-red: край ==== */







/*
 * ЛЕНТИТЕ ПЪЛЗЯТ, не прескачат.
 *
 * Преходът е тук, не в кода: така движението остава плавно дори когато
 * числото дойде рязко.
 */
.dr-f{transition:width .8s cubic-bezier(.2,.8,.2,1), background .3s}



/*
 * ЛЕНТИТЕ ПЪЛЗЯТ, не прескачат.
 *
 * Преходът е тук, не в кода: така движението остава плавно дори когато
 * числото дойде рязко.
 */
.dr-f{transition:width .8s cubic-bezier(.2,.8,.2,1), background .3s}

/*
 * ПРАЗНАТА ЛЕНТА · когато натоварването не се знае.
 *
 * Различава се от нула: нулата казва „нищо не прави“, а празното —
 * „не знам“.
 */
.dr-b:empty{background:rgba(255,255,255,.06)}

/* ==== tablo-nodes: начало ==== */

/*
 * НЕДОСТИЖИМАТА МАШИНА.
 *
 * Сива точка и приглушен ред — вижда се, че нещо не е наред, но не
 * крещи. Червено насред героя плаши повече, отколкото информира.
 */
.dr.is-down{opacity:.45}
.dr.is-down .dr-dot{background:rgba(255,255,255,.3);box-shadow:none}
.dr.is-down .dr-f{background:rgba(255,255,255,.2)}

/* ==== tablo-nodes: край ==== */

/*
 * ЛЕНТИТЕ ПЪЛЗЯТ, не прескачат.
 *
 * Преходът е тук, не в кода: така движението остава плавно дори когато
 * числото дойде рязко.
 */
.dr-f{transition:width .8s cubic-bezier(.2,.8,.2,1), background .3s}

/*
 * ПРАЗНАТА ЛЕНТА · когато натоварването не се знае.
 *
 * Различава се от нула: нулата казва „нищо не прави“, а празното —
 * „не знам“.
 */
.dr-b:empty{background:rgba(255,255,255,.06)}



/* Контейнерът на логата */
.c-logo-bar, .logo-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 30px;
}

/* Елементът за всяко логото */
.c-logo-bar img, .logo-bar img {
   /* max-height: 45px;  Задава еднаква максимална височина */
    width: auto;      /* Запазва пропорциите */
    object-fit: contain;
    display: block;
    margin: 0 auto;   /* Хоризонтално центриране */
}



/* ==== lang-flag: начало ==== */

/*
 * ФЛАГЧЕТАТА ЗА ЕЗИК.
 *
 * Кръгли и дребни · до тях остават и буквите, защото знамето само по
 * себе си не е име на език. Човек, който търси английски, гледа „EN“,
 * не флаг.
 */
.lang-f{
  width:64px;height:64px;flex:0 0 auto;border-radius:50%;
  display:inline-block;vertical-align:middle;
  box-shadow:0 1px 3px rgba(0,0,0,.3);
  transition:transform .16s, box-shadow .16s;
}

a[hreflang]:hover .lang-f{transform:scale(1.08)}

/*
 * ТЕКУЩИЯТ ЕЗИК · с ясен ръб.
 *
 * Без буквите трябва друг знак кой е избран — иначе двете флагчета
 * изглеждат еднакво.
 */
/*
 * ТЕКУЩИЯТ ЕЗИК · бял ръб с отстояние.
 *
 * Розовият се сливаше с червената ивица на българското знаме и
 * изглеждаше като петно.
 *
 * Белият личи и на двете, а тъмната сянка отвън го отделя от лентата.
 */
/*
 * ТЕКУЩИЯТ ЕЗИК · без ръб.
 *
 * Всеки ръб около знаме мени вида му: белият се сливаше с бялата
 * ивица, розовият — с червената.
 *
 * Затова избраният просто е плътен, а другият приглушен.
 */
a[aria-current] .lang-f{box-shadow:0 2px 6px rgba(0,0,0,.35)}

/* Неизбраният · приглушен, за да личи разликата. */
a[hreflang]:not([aria-current]) .lang-f{opacity:.55}
a[hreflang]:not([aria-current]):hover .lang-f{opacity:1}

/*
 * БУКВИТЕ ОСТАВАТ ЗА ЧЕТЦИТЕ.
 *
 * Скрити са от очите, но екранните четци ги произнасят — иначе
 * връзката е просто „кръг“ и никой не разбира къде води.
 */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* Редът: флагче, после буквите. */
.top-bar a[hreflang],
.topbar a[hreflang]{
  display:inline-flex;align-items:center;gap:6px;
  opacity:.72;transition:opacity .16s;
}
.top-bar a[hreflang]:hover,
.topbar a[hreflang]:hover{opacity:1}

/* Текущият език · плътен, за да личи кой е избран. */
.top-bar a[aria-current],
.topbar a[aria-current]{opacity:1}

/* ==== lang-flag: край ==== */

/*
 * ═══ ФЛАГЧЕТАТА СА В „utilbar“, НЕ В „topbar“ ═══
 *
 * Там има правило „svg{width:13px}“ за дребните иконки — и то смаляваше
 * и знамената.
 *
 * Затова тук се пише изрично: то е по-специфично и надделява.
 */
.utilbar a[hreflang] svg.lang-f{
  width:26px;height:26px;stroke-width:0;
}

/*
 * ОТСТОЯНИЕ ОТ ПОЩАТА.
 *
 * Флагчетата стояха залепени за адреса и изглеждаха като част от него.
 * Тази отстъпка ги отделя визуално.
 */
.utilbar a[hreflang]{display:inline-flex;align-items:center}
/*
 * ═══ ОТСТОЯНИЕТО Е НА КУТИЯТА, НЕ НА ВРЪЗКАТА ═══
 *
 * Флагчетата са в „.r“ с „display:flex“ и свой „gap“. Отстъпка на
 * самата връзка се губи вътре в подредбата.
 *
 * Затова се мести цялата група.
 */
/*
 * ═══ ДВЕТЕ ФЛАГЧЕТА ВДЯСНО, ПЛЪТНО ЕДНО ДО ДРУГО ═══
 *
 * „margin-left“ на първото само го отдалечаваше от второто, вместо да
 * измести двете.
 *
 * Затова се мести САМАТА КУТИЯ, а разстоянието между флагчетата се
 * задава отделно — те са двойка и трябва да изглеждат като двойка.
 */


/*
 * ═══ ТОЧКИТЕ НА МАШИНИТЕ ПУЛСИРАТ ═══
 *
 * Както при „на живо“ — показва, че редът не е снимка.
 *
 * РАЗНО ЗАБАВЯНЕ: ако мигат в такт, изглежда като едно нещо. Различните
 * мигат като отделни машини, всяка със свой ритъм.
 */
.dr-dot{animation:dash-beat 2.4s ease-in-out infinite}
.dr:nth-child(2) .dr-dot{animation-delay:.8s}
.dr:nth-child(3) .dr-dot{animation-delay:1.6s}

/* Недостижимата не пулсира · тя не е жива. */
.dr.is-down .dr-dot{animation:none}

@media (prefers-reduced-motion: reduce){
  .dr-dot{animation:none}
}

/*
 * ═══ САМО ФЛАГЧЕТАТА ═══
 *
 * Те са в своя обвивка „.langs“, затова местенето им не влачи пощата
 * и помощния център.
 */
.utilbar .langs{
  display:inline-flex;align-items:center;
  gap:4px;              /* плътно · те са двойка */
  margin-left:14px;     /* отделя ги от пощата */
  margin-right:-8px;    /* изтегля ги надясно */
}

/* Общото разстояние на кутията не важи вътре в обвивката. */
.utilbar .langs a[hreflang]{margin:0}

/*
 * ═══ ФЛАГЧЕТАТА СЕ ИЗРАВНЯВАТ С БУТОНА „ВХОД“ ═══
 *
 * Бутонът отдолу стои на самия десен ръб на съдържанието. Флагчетата
 * бяха малко навътре и двете линии не съвпадаха.
 *
 * ТУК ОТСТЪПКАТА ОТПАДА · те опират до ръба, точно като бутона.
 */
.utilbar .langs{margin-left:auto;margin-right:0}

/*
 * ПОЩАТА И ПОМОЩНИЯТ ЦЕНТЪР ОСТАВАТ ВЛЯВО.
 *
 * „margin-left:auto“ на флагчетата ги избутва надясно и оставя двете
 * връзки на мястото им — без да се пипат изобщо.
 */

/* ==== loc-flag: начало ==== */



/*
 * ═══ БЕЗ КУТИЙКИ ═══
 *
 * Рамката и фонът бяха за текста. Щом той отпадна, те само ограждат
 * знамето и му пречат.
 */
.loc-item{
  background:none !important;
  border:0 !important;
  padding:0 !important;
}
.loc-item.is-main{background:none !important;border:0 !important}

/*
 * ДВА РЕДА ПО ЧЕТИРИ.
 *
 * Осем в редица стават дребни; четири на ред им дават място да се
 * виждат.
 */
.loc-list,
.locations .row,
.loc-item:first-child{ }

.loc-item{ }

.loc-f{width:74px;height:48px}

/* Обвивката · четири в ред. */
.loc-item{margin:0}


/* Сянката на гънките · дава обем. */
.loc-item{position:relative}

.loc-item::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  border-radius:1px;
  background:linear-gradient(100deg,
    rgba(0,0,0,.16) 0%, rgba(255,255,255,.14) 22%,
    rgba(0,0,0,.12) 46%, rgba(255,255,255,.12) 70%,
    rgba(0,0,0,.14) 100%);
  background-size:220% 100%;
  animation:flag-sheen 5s linear infinite;
  mix-blend-mode:overlay;
}

@keyframes flag-sheen{
  from{background-position:0% 0}
  to  {background-position:-220% 0}
}

.loc-item:nth-child(2)::after{animation-delay:-1.1s}
.loc-item:nth-child(3)::after{animation-delay:-2.2s}
.loc-item:nth-child(4)::after{animation-delay:-3.3s}
.loc-item:nth-child(5)::after{animation-delay:-.6s}
.loc-item:nth-child(6)::after{animation-delay:-1.8s}
.loc-item:nth-child(7)::after{animation-delay:-2.9s}
.loc-item:nth-child(8)::after{animation-delay:-4.1s}

@media (prefers-reduced-motion: reduce){
  .loc-item::after{animation:none;opacity:.25}
  .loc-f{filter:none}
}

/*
 * ═══ ЧЕТИРИ НА РЕД, ДВА РЕДА ═══
 *
 * Осемте знамена в една редица стават дребни. Четири на ред им дават
 * място да се виждат.
 */
.loc-list{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr);
  gap:18px;
  align-items:center;
  justify-items:center;
}

/* Филтърът не заема място в решетката. */
.loc-list > svg[width="0"]{display:none}

@media (max-width:560px){
  /* На тесен екран два на ред · четири стават дребни. */
  .loc-list{grid-template-columns:repeat(2, 1fr);gap:14px}
}


/* ==== loc-flag: начало ==== */

/*
 * ═══ ЗНАМЕТО СЕ РАЗВЯВА ═══
 *
 * То е нарязано на шестнайсет тесни ивици. Всяка показва своята част от
 * рисунката и се движи с малко закъснение от предната.
 *
 * Затова гънката ПЪТУВА отляво надясно — както при истинско платно на
 * вятър, а не като изкривена картинка.
 */
.loc-f{
  display:flex;position:relative;
  width:68px;height:46px;
  overflow:hidden;border-radius:2px;

  /*
   * БЕЗ СЯНКА.
   *
   * Тя отделяше знамето от страницата и го правеше на залепен стикер.
   * Без нея то е част от дизайна, не предмет върху него.
   */
}

.loc-f i{
  display:block;flex:0 0 auto;
  /*
   * ШИРИНАТА В ЧАСТИ, НЕ В ПИКСЕЛИ.
   *
   * „6px“ се чупи при друг размер на знамето. Тук всяка ивица е
   * една шестнайсета от него — важи при всяка големина.
   */
  /*
   * ИВИЦИТЕ СЕ ЗАСТЪПВАТ.
   *
   * При точно 6.25% между тях остава косъм разстояние — и точно то
   * се вижда като ленти.
   *
   * Затова всяка е малко по-широка и влиза под съседната.
   */
  width:6.6%;margin-right:-.35%;height:100%;
  background-image:var(--fl);
  background-size:1600% 100%;
  background-repeat:no-repeat;
  animation:loc-wave 3.4s ease-in-out infinite;
}

/* Всяка ивица показва своята част и тръгва малко по-късно. */
.loc-f i:nth-child(1){background-position:0.0000% 0;animation-delay:0s}
.loc-f i:nth-child(2){background-position:6.6667% 0;animation-delay:-.145s}
.loc-f i:nth-child(3){background-position:13.3333% 0;animation-delay:-.290s}
.loc-f i:nth-child(4){background-position:20.0000% 0;animation-delay:-.435s}
.loc-f i:nth-child(5){background-position:26.6667% 0;animation-delay:-.580s}
.loc-f i:nth-child(6){background-position:33.3333% 0;animation-delay:-.725s}
.loc-f i:nth-child(7){background-position:40.0000% 0;animation-delay:-.870s}
.loc-f i:nth-child(8){background-position:46.6667% 0;animation-delay:-1.015s}
.loc-f i:nth-child(9){background-position:53.3333% 0;animation-delay:-1.160s}
.loc-f i:nth-child(10){background-position:60.0000% 0;animation-delay:-1.305s}
.loc-f i:nth-child(11){background-position:66.6667% 0;animation-delay:-.9s}
.loc-f i:nth-child(12){background-position:73.3333% 0;animation-delay:-1.595s}
.loc-f i:nth-child(13){background-position:80.0000% 0;animation-delay:-1.740s}
.loc-f i:nth-child(14){background-position:86.6667% 0;animation-delay:-1.885s}
.loc-f i:nth-child(15){background-position:93.3333% 0;animation-delay:-2.030s}
.loc-f i:nth-child(16){background-position:100.0000% 0;animation-delay:-2.175s}

/*
 * ДВИЖЕНИЕТО · три неща наведнъж.
 *
 * Вдига се и пада · вятърът я носи
 * Смалява се · платът се извива навътре
 * Светлее и потъмнява · дава дълбочина на гънката
 */
@keyframes loc-wave{
  0%,100%{ transform:translateY(0) scaleY(1); filter:brightness(1) }
  25%    { transform:translateY(-3px) scaleY(.93); filter:brightness(1.2) }
  50%    { transform:translateY(0) scaleY(1); filter:brightness(1) }
  75%    { transform:translateY(3px) scaleY(.93); filter:brightness(.82) }
}

/* Всяко знаме със свой ритъм · иначе изглеждат като едно платно. */
.loc-item:nth-child(2) .loc-f i{animation-duration:3.7s}
.loc-item:nth-child(3) .loc-f i{animation-duration:3.1s}
.loc-item:nth-child(4) .loc-f i{animation-duration:4s}
.loc-item:nth-child(5) .loc-f i{animation-duration:3.3s}
.loc-item:nth-child(6) .loc-f i{animation-duration:3.8s}
.loc-item:nth-child(7) .loc-f i{animation-duration:3.5s}
.loc-item:nth-child(8) .loc-f i{animation-duration:4.2s}

/* Без кутийки · рамката беше за текста, който отпадна. */
.loc-item{background:none;border:0;padding:0;position:relative}
.loc-item.is-main{background:none;border:0}

/* Четири на ред, два реда. */
.loc-list{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:12px;align-items:center;justify-items:center;
}

@media (max-width:560px){
  .loc-list{grid-template-columns:repeat(2,1fr);gap:10px}
  .loc-f{width:62px;height:42px}
}

@media (prefers-reduced-motion: reduce){
  .loc-f i{animation:none}
}

/* ==== loc-flag: край ==== */

/*
 * РАЗДЕЛЪТ С ЛОКАЦИИТЕ · без своя кутия.
 *
 * Знамената сами носят цвят; рамка около тях само ги ограждаше.
 */
.loc-grid{background:none;border:0}
.loc-list{background:none;border:0;padding:0}


.size-logo{
max-height: 120px;!important;}











/* Променливи за цветовете */
:root {
    --star-color: #FFDE4D; /* Светло жълт цвят за звездите */
    --bg-card: #ffffff;
    --text-main: #1a1a1a;
    --text-sub: #666666;
}

/* Основен контейнер на бокса */
.rate-bar-container {
    background: var(--bg-card);
    padding: 24px 40px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    display: flex;
    gap: 40px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    font-family: system-ui, -apple-system, sans-serif;
}

/* Индивидуална карта за всяка платформа */
.rate-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 12px;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
    position: relative;
}

/* Интерактивен Hover ефект - повдигане и сянка */
.rate-card:hover {
    transform: translateY(-8px) scale(1.02);
    background: #ffffff;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
}

/* Контейнер за логата (снимките) */
.platform-logo {
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
    transition: transform 0.3s ease;
}

.rate-card:hover .platform-logo {
    transform: scale(1.08);
}

/* Оразмеряване на конкретните лога */
.logo-img-tp { height: 26px; width: auto; }
.logo-img-g  { height: 32px; width: auto; }
.logo-img-fb { height: 32px; width: auto; }

/* Големи светло жълти звезди чрез HTML кодове */
.stars-container {
    display: flex;
    gap: 3px;
    font-size: 26px; /* Голям размер за звездите */
    color: var(--star-color);
    line-height: 1;
}

/* Пулсираща анимация за звездите при hover */
.rate-card:hover .stars-container .star {
    animation: starPulse 0.6s ease infinite alternate;
}

@keyframes starPulse {
    0% { transform: scale(1); filter: drop-shadow(0 0 1px rgba(255,222,77,0.5)); }
    100% { transform: scale(1.15); filter: drop-shadow(0 0 6px rgba(255,222,77,0.8)); }
}

/* Забавяне на анимацията за всяка звезда за "вълнообразен" ефект */
.stars-container .star:nth-child(1) { animation-delay: 0.05s; }
.stars-container .star:nth-child(2) { animation-delay: 0.10s; }
.stars-container .star:nth-child(3) { animation-delay: 0.15s; }
.stars-container .star:nth-child(4) { animation-delay: 0.20s; }
.stars-container .star:nth-child(5) { animation-delay: 0.25s; }

/* Текст с оценка */
.rate-score {
    font-size: 22px;
    font-weight: 700;
    color: var(--text-main);
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 2px;
}

/* Специфичен стил за зеления текст на Facebook */
.rate-score.fb-recommend {
    font-size: 15px; 
    font-weight: 600; 
    color: #00b67a;
}

.check-icon {
    font-size: 14px;
}

/* Брой отзиви */
.rate-count {
    font-size: 13px;
    color: var(--text-sub);
    font-weight: 400;
}

/* Специфичен ефект за Facebook процентите */
.fb-percent {
    color: #1877F2;
    font-weight: 700;
    font-size: 24px;
    transition: transform 0.3s ease;
}
.rate-card:hover .fb-percent {
    transform: scale(1.1);
}

/* Разделителна линия между картите */
.divider {
    width: 1px;
    height: 60px;
    background: #e1e6eb;
}

/* Мобилна адаптивност */
@media (max-width: 768px) {
    .rate-bar-container {
        flex-direction: column;
        gap: 20px;
        padding: 30px;
    }
    .divider {
        width: 60px;
        height: 1px;
    }
}








/* Нов ограничаващ контейнер за центриране и ширина до 1280px */
.c-logo-carousel-container {
    max-width: 1280px;
    margin: 0 auto; /* Центрира контейнера хоризонтално */
    padding: 0 20px; /* Вътрешно отстояние, за да не опира в края на екрана при по-малки дисплеи */
    box-sizing: border-box;
}

/* Контейнер на карусела - скрива излизащите лога */
.c-logo-bar-carousel {
    overflow: hidden;
    width: 100%;
    position: relative;
    padding: 15px 0;
    background: transparent;
}

/* Плавно избледняване отляво и отдясно вътре в рамките на 1280px */
.c-logo-bar-carousel::before,
.c-logo-bar-carousel::after {
    content: "";
    height: 100%;
    position: absolute;
    width: 100px;
    z-index: 2;
    pointer-events: none;
}
.c-logo-bar-carousel::before {
    left: 0;
    top: 0;
    background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.c-logo-bar-carousel::after {
    right: 0;
    top: 0;
    background: linear-gradient(to left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}

/* Лентата, която държи логата и се движи */
.c-logo-bar-track {
    display: flex;
    width: max-content;
    gap: 80px; /* По-голяма дистанция между логата */
    align-items: center;
    animation: scrollLogos 20s linear infinite; /* Регулирайте секундите за скорост */
}

/* Спиране на движението при посочване с мишката */
.c-logo-bar-carousel:hover .c-logo-bar-track {
    animation-play-state: paused;
}

/* Центриране на елементите в техните кутийки */
.logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Увеличени и напълно цветни лога */
.size-logo {
    height: 145px; /* Височината е увеличена от 50px на 65px */
    width: auto;
    object-fit: contain;
    filter: none; /* Премахнато grayscale - логата са изцяло цветни */
    opacity: 1; /* Напълно видими по подразбиране */
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Интерактивен лек отскок при посочване на лого */
.logo-item:hover .size-logo {
    transform: scale(1.1);
}

/* Анимацията за плавно безкрайно движение */
@keyframes scrollLogos {
    0% {
        transform: translateX(0);
    }
    100% {
        /* Премества редицата точно наполовина (заради дублираните лога) + отчита разстоянието (gap) */
        transform: translateX(calc(-50% - 40px)); 
    }
}

/* Мобилна адаптивност - леко смаляване на логата на телефони */
@media (max-width: 768px) {
    .size-logo {
        height: 45px;
    }
    .c-logo-bar-track {
        gap: 50px;
    }
}



.incl-bar{background: black;}
.incl-bar .wrap-w h2{color: white;}
.btn .btn-ghost, .btn-sm{color: white!important;}
.btn .plan-btn .btn-ghost{color: black!important;}




/* Секция с бял фон */
.sec.sec-wash {
  background: #ffffff;
  background-image: 
    radial-gradient(circle at 10% 20%, rgba(152, 219, 28, 0.08) 0%, transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(152, 219, 28, 0.05) 0%, transparent 40%);
  padding: 100px 20px;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: #1e293b;
  overflow: hidden;
  position: relative;
}

/* Деликатна футуристична мрежа */
.sec.sec-wash::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(0, 0, 0, 0.02) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(0, 0, 0, 0.02) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
}

.wrap-w {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* Заглавие и оценки (изчистен панел с бял фон и черрно заглавие) */
.rev-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 60px;
  background: #ffffff;
  padding: 40px 20px;
  border-radius: 24px;
  border: 1px solid rgba(152, 219, 28, 0.4);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05);
  position: relative;
  overflow: hidden;
}

.rev-head h2 {
  font-size: 2.8rem;
  font-weight: 900;
  color: #000000; /* Черно заглавие */
  margin-bottom: 24px;
  letter-spacing: -0.03em;
  z-index: 1;
}

.rev-scores {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: center;
  z-index: 1;
}

.rev-score {
  background: #cffb804f;
  padding: 12px 24px;
  border-radius: 50px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 0.95rem;
  border: 1px solid rgba(152, 219, 28, 0.4);
  color: #1e293b;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.rev-score:hover {
  transform: translateY(-5px) scale(1.05);
  border-color: #7cbf00;
  box-shadow: 0 0 25px rgba(152, 219, 28, 0.3);
  background: #ffffff;
}

.rev-score b {
  color: #000000;
  font-weight: 700;
}

/* Мрежа от отзиви */
.rev-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 28px;
}

/* Карти с динамична левитация и неонов кант */
.rev-card {
  background: #f8fafc;
  padding: 32px;
  border-radius: 24px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid rgba(152, 219, 28, 0.3);
  position: relative;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  animation: floatCard 6s ease-in-out infinite;
}

/* Различни фази на левитация за всяка карта */
.rev-card:nth-child(1) { animation-delay: 0s; }
.rev-card:nth-child(2) { animation-delay: 1.5s; }
.rev-card:nth-child(3) { animation-delay: 3s; }
.rev-card:nth-child(4) { animation-delay: 4.5s; }

/* Светлинен ефект при движение на мишката */
.rev-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(152, 219, 28, 0.2), transparent);
  transition: 0.6s;
}

.rev-card:hover::before {
  left: 100%;
}

.rev-card:hover {
  transform: translateY(-12px) scale(1.03);
  border-color: #7cbf00;
  box-shadow: 0 20px 40px rgba(152, 219, 28, 0.2), 0 0 25px rgba(152, 219, 28, 0.25);
  background: #ffffff;
}

/* Автор на отзива */
.who {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}

.av {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #050704;
  font-weight: 800;
  font-size: 1.05rem;
  background: linear-gradient(135deg, #7cbf00, #6ea810) !important;
  box-shadow: 0 8px 20px rgba(152, 219, 28, 0.3);
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.rev-card:hover .av {
  transform: rotate(12deg) scale(1.15);
}

.who b {
  font-size: 1.1rem;
  color: #0f172a;
  display: block;
  margin-bottom: 4px;
}

/* Текст на отзива */
.rev-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #475569;
  margin-bottom: 24px;
  flex-grow: 1;
}

/* Източник / дата */
.rev-card .src {
  font-size: 0.85rem;
  color: #64748b;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Звезди */
.stars {
  display: inline-flex;
  color: #7ab810;
  gap: 3px;
  filter: drop-shadow(0 0 4px rgba(152, 219, 28, 0.4));
}

.rev-card .stars svg,
.rev-score .stars svg {
  width: 16px;
  height: 16px;
}

.rev-head .stars svg {
  width: 14px;
  height: 14px;
}

/* Анимации */
@keyframes floatCard {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}

/**/




/* Контейнер на решетката - фиксиран на 4 колони за десктоп */
.feat-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important; /* Точно 4 колони на ред */
    gap: 24px !important;
    padding: 30px 0 !important;
}

/* Изчистена минималистична картичка */
.feat-card {
    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.15) !important; /* Лек и ненатрапчив контур */
    border-radius: 12px !important; /* Фино заобляне */
    padding: 30px 25px !important;
    position: relative;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important; /* Плавно премиум движение */
    box-shadow: 0 4px 15px rgba(48, 90, 8, 0.02) !important; /* Почти незабележима начална сянка */
}

/* Напълно скриваме иконите и техните контейнери */
.feat-card .fi, 
.feat-card .fi svg,
.feat-card span {
    display: none !important;
}

/* Тънка акцентна линия вляво от заглавието, която придава структура */
.feat-card h3 {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #305a08 !important; /* Тъмнозелен цвят */
    margin: 0 0 14px 0 !important;
    padding-left: 12px !important;
    border-left: 3px solid #7cbf00; /* Вертикална линия пред заглавието */
    letter-spacing: -0.3px;
    transition: border-color 0.3s ease, color 0.3s ease;
}

/* Описание на характеристиките */
.feat-card p {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #555850 !important; /* Приятно за четене сиво-зелено */
    margin: 0 !important;
}

/* ИНТЕРАКТИВНОСТ И ДВИЖЕНИЕ (HOVER EFFECT) */
.feat-card:hover {
    transform: translateY(-6px) !important; /* Модерно изплуване нагоре */
    border-color: rgba(105, 201, 14, 0.35) !important; /* Контурът става по-ясен */
    background: #ffffff !important; /* Запазва се чистият бял фон */
    /* Елегантна, мека неонова сянка, която кара картичката да изпъкне */
    box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Промяна на акцента на заглавието при hover */
.feat-card:hover h3 {
    border-left-color: #69c90e; /* Линията става по-наситено зелена */
    color: #69c90e !important; /* Заглавието също леко светва в брандовия цвят */
}

/* АДАПТИВНОСТ ЗА МОБИЛНИ УСТРОЙСТВА (RESPONSIVE) */
@media (max-width: 1024px) {
    .feat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important; /* 2 на ред за таблети */
    }
}

@media (max-width: 640px) {
    .feat-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important; /* 1 на ред за телефони */
        gap: 16px !important;
    }
}


/**/


/* ==========================================================================
   ОГРАНИЧЕН СТИЛ САМО ЗА СЕКЦИЯТА "НАЧИНИ НА ПЛАЩАНЕ"
   ========================================================================== */

/* Тъмен технологичен фон само за контейнера на плащанията */
.pay-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}

/* Тъмна премиум картичка за начин на плащане */
.pay-grid .pay-opt {
    background: #11140c !important; /* Наситено матово черно с лек зелен отенък */
    border: 1px solid rgba(152, 219, 28, 0.2) !important; /* Фин електриков контур */
    border-radius: 12px !important;
    padding: 30px 25px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    position: relative !important;
    overflow: hidden !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important; /* Дълбока тъмна сянка */
}

/* Горна част на плащанията (значки и време) */
.pay-grid .pay-top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 20px !important;
}

/* Електриково зелени значки за методите (IBAN, КАРТА, PayPal) */
.pay-grid .pay-mark {
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    background: rgba(152, 219, 28, 0.15) !important; /* Прозрачна електрикова основа */
    color: #7cbf00 !important; /* Ярко електриково зелен текст */
    letter-spacing: 0.5px !important;
}

/* Изключения за логото на PayPal, ако искате да запази маркова идентичност */
.pay-grid .pay-mark.is-pp {
    background: rgba(0, 69, 124, 0.2) !important;
    color: #0079c1 !important;
}

/* Време за активация и икони вътре в плащанията */
.pay-grid .when {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

.pay-grid .when svg {
    width: 15px !important;
    height: 15px !important;
    stroke-width: 2.2 !important;
}

/* Цветове за времето в тъмния режим */
.pay-grid .when.wait { 
    color: #9ca3af !important; /* Светло сиво за изчакване */
}
.pay-grid .when.now { 
    color: #69c90e !important; /* Електриково зелено за активиране веднага */
}

/* Заглавие на метода за плащане (Банков превод, Карта...) */
.pay-grid .pay-opt b {
    display: block !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #ffffff !important; /* Силно открояващо се бяло заглавие */
    margin-bottom: 12px !important;
    letter-spacing: -0.3px !important;
    transition: color 0.3s ease !important;
}

/* Описание на метода за плащане */
.pay-grid .pay-opt p {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #d1d5db !important; /* Светъл, силно четим текст на черния фон */
    margin: 0 0 20px 0 !important;
    flex-grow: 1 !important;
}

/* Долна секция (Без такса) */
.pay-grid .pay-foot {
    font-size: 13px !important;
    font-weight: 800 !important;
    color: #7cbf00 !important; /* Светещ електриков надпис */
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-top: 1px solid rgba(152, 219, 28, 0.15) !important;
    padding-top: 15px !important;
}

/* Интерактивност при hover за черните плащания */
.pay-grid .pay-opt:hover {
    transform: translateY(-6px) !important;
    background: #171c0f !important; /* Леко изсветляване на черното */
    border-color: #7cbf00 !important; /* Контурът светва напълно */
    /* Светещ неонов ореол около картичката при посочване */
    box-shadow: 0 15px 35px rgba(152, 219, 28, 0.2) !important;
}

.pay-grid .pay-opt:hover b {
    color: #7cbf00 !important; /* Заглавието светва в електриково зелено при посочване */
}

/* Текстови бележки под решетката за плащания */
.pay-grid + .pay-note {
    font-size: 13px !important;
    color: #6b7280 !important;
    text-align: center !important;
    margin-top: 25px !important;
}

/* АДАПТИВНОСТ ЗА ТАБЛЕТИ И ТЕЛЕФОНИ */
@media (max-width: 1024px) {
    .pay-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important; /* 2 на ред за таблети */
    }
}

@media (max-width: 640px) {
    .pay-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important; /* 1 на ред за телефони */
        gap: 16px !important;
    }
}


/**/


/* ==========================================================================
   ИЗЧИСТЕН И РЕАЛИСТИЧЕН ИЗГЛЕД НА ЗНАМЕНАТА СЪС СЪРВЪРИ
   ========================================================================== */

/* Центриране на текстовото съдържание в секцията */
.loc-grid > div {
    text-align: center !important;
}

/* Перфектно хоризонтално центриране на редицата със знамената */
.loc-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 30px !important; /* Приятно разстояние между отделните знамена */
    align-items: center !important;
    justify-content: center !important;
    padding: 20px 0 !important;
    max-width: 900px !important;
    margin: 0 auto !important;
}

/* Изчистен контейнер за знамената - БЕЗ рамки, БЕЗ ховър ефекти, БЕЗ фон */
.loc-item {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important; /* Напълно прозрачен фон */
    border: none !important; /* Премахва абсолютно всички рамки */
    padding: 0 !important; /* Маха излишното празно пространство на кутията */
    box-shadow: none !important; /* Маха сенките около бокса */
    transform: none !important; /* Премахва каквото и да е движение */
    cursor: default !important; /* Стандартен курсор, без усещане за излишен бутон */
}

/* Премахване на ховър ефектите и за двете състояния */
.loc-item:hover {
    transform: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Премахване на изскачащите етикети (tooltips) */
.loc-item::after,
.loc-item:hover::after {
    display: none !important;
    content: none !important;
}

/* КОРИГИРАНЕ НА ЗНАМЕНАТА – ЗА ДА ИЗГЛЕЖДАТ РЕАЛНИ И ЕСТЕСТВЕНИ */
.loc-f {
    width: 72px !important;  /* Професионален, лесно забележим размер */
    height: 48px !important; /* Точно съотношение 3:2 за истински вид на флаговете */
    border-radius: 4px !important; /* Фин умерено заоблен ръб на самото платно */
    display: block !important;
    object-fit: cover !important; /* Предпазва софтуерно флаговете от разтягане и деформация */
    
    /* Добавяне на пластови фини сенки, за да изглежда платното обемно и истинско */
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16)) 
            drop-shadow(0 1px 3px rgba(0, 0, 0, 0.1)) !important;
    
    transition: filter 0.3s ease !important;
}

/* При задържане на мишката върху знамето се активира единствено вълнообразната анимация, без да мърда самата икона */
.loc-item:hover .loc-f {
    filter: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.25)) url(#flagWave) !important;
}




/**/
/* Контейнер на цялата секция */
.map-box-section {
    width: 100%;
    max-width: 1920px;
    margin: 60px auto;
    padding: 40px 0px;
    text-align: center;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0,0,0,0.03);
    border: 1px solid #f3f4f6;
    box-sizing: border-box;
}

.map-box-section h2 {
    font-size: 2.2rem;
    color: #111827;
    margin-bottom: 12px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.map-box-desc {
    color: #4b5563;
    font-size: 1.1rem;
    max-width: 600px;
    margin: 0 auto 40px auto;
    line-height: 1.6;
}

.map-wrapper {
    width: 100%;
    max-width: 950px;
    margin: 0 auto;
    position: relative;
}

/* Стил за реалната географска карта (Сив хостинг нюанс) */
.real-world-map-svg {
    width: 100%;
    height: auto;
    display: block;
}

.real-world-map-svg path {
    fill: #f3f4f6 !important; /* Професионално светло сиво */
    stroke: #ffffff !important; /* Чисти бели граници */
    stroke-width: 0.6px !important;
}

/* ДИЗАЙН НА ЗЕЛЕНИТЕ ХОСТИНГ ТОЧКИ */
.h-dot {
    position: absolute;
    width: 13px;
    height: 13px;
    background-color: #10b981;
    border: 2px solid #ffffff;
    border-radius: 50%;
    cursor: pointer;
    transform: translate(-50%, -50%);
    transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), background-color 0.2s ease;
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6);
    animation: hPulseNode 2s infinite;
    z-index: 10;
}

/* ЕФЕКТ ПО-ГОЛЕМИ: При посочване с мишката стават с 60% по-големи */
.h-dot:hover {
    transform: translate(-50%, -50%) scale(1.6) !important;
    background-color: #059669;
    z-index: 100;
    animation: none;
}

/* Централен дата център България — пулсира по-силно за фокус */
.h-dot.core-node-dot {
    width: 15px;
    height: 15px;
    background-color: #059669;
    animation: hPulseCore 1.8s infinite;
}

@keyframes hPulseNode {
    0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.5); }
    70% { box-shadow: 0 0 0 11px rgba(16, 185, 129, 0); }
    100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

@keyframes hPulseCore {
    0% { box-shadow: 0 0 0 0 rgba(5, 150, 105, 0.6); }
    70% { box-shadow: 0 0 0 15px rgba(5, 150, 105, 0); }
    100% { box-shadow: 0 0 0 0 rgba(5, 150, 105, 0); }
}

/* Черен информационен балон при посочване */
.h-dot .h-tooltip {
    visibility: hidden;
    width: 220px;
    background-color: #111827;
    color: #ffffff;
    text-align: center;
    border-radius: 6px;
    padding: 7px 12px;
    position: absolute;
    z-index: 101;
    bottom: 160%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.2s ease, bottom 0.2s ease;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
    pointer-events: none;
    white-space: nowrap;
}

.h-dot .h-tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -6px;
    border-width: 6px;
    border-style: solid;
    border-color: #111827 transparent transparent transparent;
}

.h-dot:hover .h-tooltip {
    visibility: visible;
    opacity: 1;
    bottom: 185%;
}
.map-wrapper {
    width: 120%;
    max-width: 1600px; /* ТУК СМЕНЯТЕ СТОЙНОСТТА, ЗА ДА СЕ УВЕЛИЧИ КАРТАТА */
    margin: 0 auto;
    position: relative;
}


/*нов код*/


/* Контейнер за подредба на флаговете */
.loc-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}

/* Стил за отделната локация/бутон */
.loc-item {
  position: relative;
  width: 90px;
  cursor: pointer;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  display: inline-block;
}

/* Плавно изскачане при задържане на мишката */
.loc-item:hover {
  transform: translateY(-5px);
}

/* Подобрен вид и дълбочина за самите SVG флагове, запазвайки анимацията */
.loc-f {
  width: 100%;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transition: box-shadow 0.3s ease;
  display: block;
}

/* По-силна сянка за фокус при ховър */
.loc-item:hover .loc-f {
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
}

/* Специален акцент за основната локация (България) */
.loc-item.is-main .loc-f {
  box-shadow: 0 4px 16px rgba(0, 150, 110, 0.35);
  border: 2px solid #00966E;
}

/* Скриване на текстовия етикет за екранни четци, без да се чупи структурата */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/**/

.loc-item {
  display: inline-block;
  position: relative;
  border: none !important;
  box-shadow: none !important;
  background: transparent;
  transform: none !important;
  transition: none !important;
}

.loc-item:hover {
  transform: none !important;
  box-shadow: none !important;
}

.loc-f {
  width: 100%;
  height: auto;
  border: none !important;
  box-shadow: none !important;
  display: block;
  shape-rendering: geometricPrecision;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  image-rendering: -webkit-optimize-contrast;
  transform: none !important;
  transition: none !important;
}

.loc-item:hover .loc-f,
.loc-item:focus .loc-f,
.loc-item.is-main .loc-f {
  border: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
}
/**/


/* Основен контейнер за трите карти */
.rate-bar-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    max-width: 1200px;
    margin: 40px auto;
    padding: 20px;
    background-color: #ffffff; /* Бял фон на секцията */
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); /* Лека елегантна сянка */
}

/* Индивидуална карта за оценка */
.rate-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    flex: 1;
    min-width: 200px;
    padding: 15px;
}

/* Контейнер за логата на платформите */
.platform-logo {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}

/* Универсални правила за изображенията */
.platform-logo img {
    max-height: 100%;
    width: auto;
    object-fit: contain;
}

/* Конкретни размери за логата, спрямо техните класове */
.logo-img-tp { max-width: 140px; }
.logo-img-g  { max-width: 110px; }
.logo-img-fb { max-width: 40px; }

/* Стилизиране на звездите (Trustpilot & Google) */
.stars-container {
    display: flex;
    gap: 2px;
    margin-bottom: 8px;
}

.star {
    color: #ffb600; /* Златисто-жълт цвят за звездите */
    font-size: 22px;
    line-height: 1;
}

/* Текстов рейтинг (например: 4.8 / 4.9) */
.rate-score {
    font-size: 24px;
    font-weight: 700;
    color: #0e2745; /* Тъмносиният цвят от вашата тема 'theme.color' */
    margin-bottom: 4px;
}

/* Стилизиране на Facebook процентите (97%) */
.fb-percent {
    font-size: 32px;
    font-weight: 800;
    color: #1877f2; /* Оригинално Facebook синьо */
    margin-bottom: 4px;
    line-height: 1;
}

/* Стилизиране на "Препоръчват" текста под процентите */
.fb-recommend {
    font-size: 15px;
    font-weight: 600;
    color: #1877f2;
    display: flex;
    align-items: center;
    gap: 5px;
}

.check-icon {
    font-size: 14px;
}

/* Брой отзиви (малък сив текст най-отдолу) */
.rate-count {
    font-size: 14px;
    color: #64748b; /* Модерен slate/сив цвят за второстепенен текст */
    font-weight: 500;
}

/* Разделителни линии (вертикални на десктоп) */
.divider {
    width: 1px;
    height: 60px;
    background-color: #e2e8f0; /* Светло сив разделител */
}

/* Адаптивност за мобилни телефони (под 768px) */
@media (max-width: 768px) {
    .rate-bar-container {
        flex-direction: column; /* Подрежда боксовете един под друг */
        gap: 30px;
        padding: 30px 15px;
    }
    
    /* Промяна на разделителя от вертикален в хоризонтален за мобилни */
    .divider {
        width: 80%;
        height: 1px;
    }
    
    .rate-card {
        width: 100%;
    }
}
/**/


/* Главният контейнер (вашият код, леко оптимизиран) */
.rev-scores {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center; /* Центрира ги вертикално в контейнера */
    width: 100%;
    z-index: 1;
    margin: 20px auto;
}

/* Всяка отделна карта (ПРОМЕНЕНО: превърната във flex колона) */
.rev-score {
    display: flex;
    flex-direction: column; /* Подрежда елементите един под друг */
    align-items: center;    /* Центрира елементите хоризонтално вътре в картата */
    justify-content: center;/* Центрира елементите вертикално */
    text-align: center;
    min-width: 345px;
    padding: 10px;
}

/* Името на източника (Trustpilot, Google, Facebook) */
.rev-score .src {
    font-size: 16px;
    font-weight: 700;
    color: #0e2745;
    margin-bottom: 8px;
}

/* Контейнерът за SVG звездите */
.rev-score .stars {
    display: flex;
    justify-content: center;
    gap: 2px;
    margin-bottom: 6px;
}

/* Размери и цвят на самите SVG звезди */
.rev-score .stars svg {
    width: 20px;
    height: 20px;
    color: #ffb600; /* Златисто-жълти звезди */
}

/* Рейтингът (4,9 / 4,8 / 97%) */
.rev-score b {
    font-size: 22px;
    font-weight: 800;
    color: #0e2745;
    margin-bottom: 4px;
    line-height: 1.2;
}

/* Текстът най-отдолу (от 218 отзива...) */
.rev-score span:not(.src):not(.stars) {
    font-size: 13px;
    color: #64748b;
    font-weight: 500;
}
#plans{
    background: #cffb804f;
}




/* Основен контейнер за целия бокс */
.sh-all {
    max-width: 1200px;
    margin: 0px auto;
    padding: 30px;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(14, 39, 69, 0.06); /* Лека, модерна дълбочина */
    border: 1px solid rgba(14, 39, 69, 0.04);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;
}

/* Раздвижване на целия бокс при посочване */
.sh-all:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(14, 39, 69, 0.1);
}

/* Хедър на бокса (Заглавие + Хапче) */
.sh-all-h {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 2px dashed #f1f5f9; /* Елегантна разделителна линия */
}

/* Заглавие */
.sh-all-h b {
    font-size: 22px;
    font-weight: 800;
    color: #0e2745; /* Водещ тъмносин цвят */
    letter-spacing: -0.5px;
}

/* Пулсиращ ефект за етикета "без доплащане" */
.sh-all-h .pill.p-ok {
    background: #edfdd24f;
    color: #69c90e;
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    box-shadow: 0 0 0 0 rgba(2, 122, 72, 0.2);
    animation: pulseGlow 2s infinite;
}

@keyframes pulseGlow {
    0% { box-shadow: 0 0 0 0 rgba(2, 122, 72, 0.2); }
    70% { box-shadow: 0 0 0 8px rgba(2, 122, 72, 0); }
    100% { box-shadow: 0 0 0 0 rgba(2, 122, 72, 0); }
}

/* Контейнер за списъка с екстри - подредба в 2 колони */
.sh-all-l {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

/* Индивидуален елемент (Екстра) */
.sh-all-l > div {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: #edfdd24f; /* Лек сив фон за всяка плочка */
    border-radius: 10px;
    border: 1px solid transparent;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: default;
}

/* Интерактивен Hover ефект за всяка отделна екстра */
.sh-all-l > div:hover {
    background: #ffffff;
    border-color: #4e950a; /* Променя границата в зелено */
    transform: translateX(4px); /* Леко движение надясно */
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.08);
}

/* Кръгчето около зелената отметка */
.sh-fi {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: #69c90e; /* Ярко зелено */
    color: #ffffff;
    border-radius: 50%;
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

/* Завъртане на отметката, когато потребителят посочи елемента */
.sh-all-l > div:hover .sh-fi {
    transform: scale(1.1) rotate(8deg);
}

/* Размер на самата SVG отметка */
.sh-fi svg {
    width: 14px;
    height: 14px;
}

/* Текстът на самата екстра */
.sh-all-l > div span:not(.sh-fi) {
    font-size: 15px;
    font-weight: 500;
    color: #334155;
    transition: color 0.2s ease;
}

/* Промяна на цвета на текста при посочване */
.sh-all-l > div:hover span:not(.sh-fi) {
    color: #0e2745;
}

/* Адаптивност за мобилни устройства */
@media (max-width: 640px) {
    .sh-all {
        padding: 20px;
        margin: 20px 10px;
    }
    
    .sh-all-h {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    /* Сгъване в 1 колона на мобилни екрани */
    .sh-all-l {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .sh-all-l > div:hover {
        transform: none; /* Изключваме хоризонталното мърдане за тъч екрани */
    }
}






/* Основна секция */
.sec#which {
    background-color: #f8fafc; /* Светъл, модерен фон за контраст */
    padding: 80px 20px;
}

/* Общ контейнер */
.sec#which .wrap-w {
    max-width: 1100px;
    margin: 0 auto;
}

/* Заглавна част */
.sh-head {
    text-align: center;
    margin-bottom: 50px;
}

.sh-head h2 {
    font-size: 32px;
    font-weight: 800;
    color: #0e2745; /* Основен корпоративен цвят */
    margin-bottom: 12px;
    letter-spacing: -0.5px;
}

.sh-head p {
    font-size: 16px;
    color: #64748b;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Контейнер за трите случая/карти */
.sh-cases {
    display: flex;
    gap: 24px;
    justify-content: center;
    margin-bottom: 40px;
}

/* Индивидуална карта (Случай от практиката) */
.sh-case {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 30px 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Подравняване вляво за по-елегантен вид */
    position: relative;
    overflow: hidden;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Интерактивен Hover ефект за картите */
.sh-case:hover {
    transform: translateY(-6px);
    border-color: transparent;
    box-shadow: 0 15px 35px rgba(14, 39, 69, 0.08);
}

/* Стилизиране на иконите (всеки случай получава нежен цветен фон) */
.sh-case-ic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: #eff6ff; /* Лек син фон */
    color: #2563eb; /* Ярко синя икона */
    border-radius: 12px;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}

/* Раздвижване на иконата при посочване на картата */
.sh-case:hover .sh-case-ic {
    background: #0e2745;
    color: #ffffff;
    transform: scale(1.05);
}

.sh-case-ic svg {
    width: 24px;
    height: 24px;
}

/* Подзаглавия в картите */
.sh-case h3 {
    font-size: 18px;
    font-weight: 700;
    color: #0e2745;
    margin-bottom: 12px;
}

/* Описание */
.sh-case p {
    font-size: 14px;
    color: #475569;
    line-height: 1.6;
    margin-bottom: 24px;
    flex-grow: 1; /* Избутва финалния съвет винаги най-отдолу, за да са подравнени */
}

/* Финален съвет ("Стига ти най-малкия") */
.sh-case-p {
    font-size: 14px;
    color: #334155;
    background: #f1f5f9;
    padding: 8px 14px;
    border-radius: 8px;
    width: 100%; /* Разпъва се по цялата широчина на картата */
    box-sizing: border-box;
    text-align: center;
    font-weight: 500;
    transition: all 0.3s ease;
}

.sh-case-p b {
    color: #0e2745;
    font-weight: 700;
}

/* Акцент върху съвета при hover */
.sh-case:hover .sh-case-p {
    background: #e1fbf2; /* Нежно зелено, подсказващо правилен избор */
    color: #027a48;
}

.sh-case:hover .sh-case-p b {
    color: #027a48;
}

/* Текст най-отдолу ("Не си сигурен?") */
.sh-ask {
    text-align: center;
    font-size: 15px;
    color: #475569;
    margin-top: 30px;
    font-weight: 500;
}

.sh-ask a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 700;
    border-bottom: 2px solid rgba(37, 99, 235, 0.2);
    padding-bottom: 2px;
    transition: all 0.2s ease;
}

.sh-ask a:hover {
    color: #0e2745;
    border-bottom-color: #0e2745;
}

/* Адаптивност за таблети и мобилни устройства */
@media (max-width: 900px) {
    .sh-cases {
        flex-direction: column; /* Нарежда картите една под друга */
        gap: 20px;
    }
    
    .sh-case {
        align-items: center; /* Центрира съдържанието на мобилен за по-добър фокус */
        text-align: center;
    }

    .sh-case p {
        margin-bottom: 16px;
    }
}




/* Основен контейнер и фон на секцията */
section#which.sec {
  background-color: #fafafa !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

section#which .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* Заглавна част */
section#which .sh-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}

section#which .sh-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 12px !important;
}

section#which .sh-head p {
  font-size: 1.1rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
}

/* Мрежа с карти */
section#which .sh-cases {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 24px !important;
  margin-bottom: 40px !important;
}

/* Дизайн на картите: бели, със заобляне и мека сянка */
section#which .sh-case {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

/* Ховър ефект с леко повдигане */
section#which .sh-case:hover {
  transform: translateY(-4px) !important;
  border-color: #d1d5db !important;
  box-shadow: 0 12px 20px -3px rgba(0, 0, 0, 0.05) !important;
}

/* Пълно скриване на иконите */
section#which .sh-case-ic {
  display: none !important;
}

/* Стил на заглавията (h3) според изискването ти */
section#which .sh-case h3 {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  margin: 0 0 14px 0 !important;
  padding-left: 12px !important;
  border-left: 3px solid #7cbf00 !important;
  letter-spacing: -0.3px !important;
  transition: border-color 0.3s ease, color 0.3s ease !important;
}

/* Текст в картите */
section#which .sh-case p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  flex-grow: 1 !important;
  margin-bottom: 20px !important;
}

/* Долен етикет (план) */
section#which .sh-case-p {
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background-color: #f9fafb !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  display: inline-block !important;
  align-self: flex-start !important;
  border: 1px solid #f3f4f6 !important;
}

section#which .sh-case-p b {
  color: #305a08 !important;
}

/* Текст и линк най-долу */
section#which .sh-ask {
  text-align: center !important;
  font-size: 0.95rem !important;
  color: #4b5563 !important;
}

section#which .sh-ask a {
  color: #305a08 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

section#which .sh-ask a:hover {
  text-decoration: underline !important;
}

section#which .sh-case:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}




/* Основен контейнер и фон на новата секция */
div.wrap-w:has(.sh-why) {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

/* Заглавна част */
div.wrap-w .sh-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}

div.wrap-w .sh-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 12px !important;
}

div.wrap-w .sh-head p {
  font-size: 1.1rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
}

/* Мрежа с карти (.sh-why) */
.sh-why {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 24px !important;
}

/* Дизайн на картите (.sh-why-i): бели, заоблени, със същия ховър ефект */
.sh-why-i {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

.sh-why-i:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Премахване на иконите */
.sh-why-ic {
  display: none !important;
}

/* Голямо число (0,4 s, 99,98% и т.н.) */
.sh-why-n {
  font-size: 2.25rem !important;
  font-weight: 800 !important;
  color: #305a08 !important;
  margin-bottom: 12px !important;
  letter-spacing: -1px !important;
  line-height: 1 !important;
}

/* Заглавие (b таг) с твоите точни изисквания */
.sh-why-i b {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  margin: 0 0 14px 0 !important;
  padding-left: 12px !important;
  border-left: 3px solid #7cbf00 !important;
  letter-spacing: -0.3px !important;
  display: block !important;
  transition: border-color 0.3s ease, color 0.3s ease !important;
}

/* Описание (p таг) */
.sh-why-i p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  flex-grow: 1 !important;
}


/*3*/


/* Стилът важи само за секцията с отзиви на клиентите */
section.sec:has(.sh-revs) {
  background: #ffffff !important;
  background-image: radial-gradient(circle at 10% 20%, rgba(152, 219, 28, 0.08) 0%, transparent 40%), radial-gradient(circle at 90% 80%, rgba(152, 219, 28, 0.05) 0%, transparent 40%) !important;
  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
}

section.sec:has(.sh-revs) .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Заглавна част само за тази секция */
section.sec:has(.sh-revs) .sh-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  margin-bottom: 50px !important;
  background: #ffffff !important;
  padding: 40px 30px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;
  position: relative !important;
}

section.sec:has(.sh-revs) .sh-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 10px !important;
  letter-spacing: -0.5px !important;
}

section.sec:has(.sh-revs) .sh-head p {
  font-size: 1.05rem !important;
  color: #4b5563 !important;
  margin-bottom: 0 !important;
}

/* Мрежа (Grid) за самите отзиви */
section.sec:has(.sh-revs) .sh-revs {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 24px !important;
}

/* Дизайн на индивидуалната карта с отзив */
section.sec:has(.sh-revs) .sh-rev {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

section.sec:has(.sh-revs) .sh-rev:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Звезди в картата */
section.sec:has(.sh-revs) .sh-rev-stars {
  display: flex !important;
  gap: 4px !important;
  color: #f59e0b !important;
  width: 90px !important;
  height: 18px !important;
  margin-bottom: 16px !important;
}

/* Текст на отзива */
section.sec:has(.sh-revs) .sh-rev p {
  font-size: 0.98rem !important;
  color: #374151 !important;
  line-height: 1.6 !important;
  flex-grow: 1 !important;
  margin: 0 0 24px 0 !important;
}

/* Автор на отзива и аватар */
section.sec:has(.sh-revs) .sh-rev-who {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-top: 1px solid #f3f4f6 !important;
  padding-top: 16px !important;
}

section.sec:has(.sh-revs) .sh-rev-av {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #305a08, #69c90e) !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  flex-shrink: 0 !important;
}

section.sec:has(.sh-revs) .sh-rev-who span span {
  display: block !important;
  font-size: 0.85rem !important;
  color: #6b7280 !important;
  font-weight: 400 !important;
  margin-top: 2px !important;
}

section.sec:has(.sh-revs) .sh-rev-who b {
  font-size: 0.95rem !important;
  color: #111827 !important;
  font-weight: 600 !important;
}


/*4*/



/* Стил за секцията с отзиви (WordPress страница) */
section.sec:has(.wp-revs),
.wp-revs {
  all: unset;
}

div:has(> .wrap-w > .wp-revs) {
  background: #ffffff !important;
  background-image: radial-gradient(circle at 10% 20%, rgba(152, 219, 28, 0.08) 0%, transparent 40%), radial-gradient(circle at 90% 80%, rgba(152, 219, 28, 0.05) 0%, transparent 40%) !important;
  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
  display: block !important;
  width: 100% !important;
}

div:has(> .wrap-w > .wp-revs) .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Заглавна част */
div:has(> .wrap-w > .wp-revs) .wp-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  margin-bottom: 50px !important;
  background: #ffffff !important;
  padding: 40px 30px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;
  position: relative !important;
}

div:has(> .wrap-w > .wp-revs) .wp-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 10px !important;
  letter-spacing: -0.5px !important;
}

div:has(> .wrap-w > .wp-revs) .wp-head p {
  font-size: 1.05rem !important;
  color: #4b5563 !important;
  margin-bottom: 0 !important;
}

/* Мрежа (Grid) за отзивите */
.wp-revs {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 24px !important;
  width: 100% !important;
}

/* Индивидуална карта */
.wp-rev {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

.wp-rev:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Звезди */
.wp-rev-stars {
  display: flex !important;
  gap: 4px !important;
  color: #f59e0b !important;
  width: 90px !important;
  height: 18px !important;
  margin-bottom: 16px !important;
}

/* Текст на отзива */
.wp-rev p {
  font-size: 0.98rem !important;
  color: #374151 !important;
  line-height: 1.6 !important;
  flex-grow: 1 !important;
  margin: 0 0 24px 0 !important;
}

/* Автор и аватар */
.wp-rev-who {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-top: 1px solid #f3f4f6 !important;
  padding-top: 16px !important;
}

.wp-rev-av {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #305a08, #69c90e) !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  flex-shrink: 0 !important;
}

.wp-rev-who span span {
  display: block !important;
  font-size: 0.85rem !important;
  color: #6b7280 !important;
  font-weight: 400 !important;
  margin-top: 2px !important;
}

.wp-rev-who b {
  font-size: 0.95rem !important;
  color: #111827 !important;
  font-weight: 600 !important;
}

.wp-flow-s.is-ok .wp-flow-n {
    background: #7cbf00;
    color: #fff;
}
.wp-flow-note {
    margin: 18px 0 0;
    padding: 12px 14px;
    border-radius: var(--r, 10px);
    background: rgba(18, 122, 85, .16);
    border: 1px solid rgba(111, 217, 172, .24);
    font-size: 12.5px;
    color: #7cbf00;
    line-height: 1.6;
}
.wp-notes i {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    background: #7cbf00d6;
    color: #ffffff;
}


/*5*/

/* Разпределение на мрежата да показва точно по 4 карти на ред */
.wp-all-l {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 20px !important;
}

/* Адаптивност за мобилни устройства и таблети */
@media (max-width: 1024px) {
  .wp-all-l {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 640px) {
  .wp-all-l {
    grid-template-columns: 1fr !important;
  }
}

/* Общ стил на картите, взаимстван от .svc-card */
.wp-all-l > div,
.wp-all-l a {
  position: relative !important;
  overflow: hidden !important;
  text-decoration: none !important;
  color: inherit !important;
  background: #5E9A000D !important;
  border: 1.5px solid #7cbf00 !important;
  border-radius: 26px !important;
  padding: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform .22s cubic-bezier(.2, .9, .2, 1), box-shadow .22s, border-color .22s !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02) !important;
}

.wp-all-l > div:hover,
.wp-all-l a:hover {
  transform: translateY(-4px) !important;
  border-color: #69c90e !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.12) !important;
  background: #ffffff !important;
}

/* Икона */
.wp-all-l .wp-fi {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  background: #f0fdf4 !important;
  color: #305a08 !important;
  border-radius: 14px !important;
  margin-bottom: 16px !important;
  flex-shrink: 0 !important;
  border: 1px solid rgba(152, 219, 28, 0.3) !important;
}

.wp-all-l .wp-fi svg {
  width: 22px !important;
  height: 22px !important;
}

/* Текст на елемента */
.wp-all-l > div span:not(.wp-fi),
.wp-all-l a span:not(.wp-fi) {
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: #111827 !important;
  line-height: 1.4 !important;
}

/* Главна обвивка на секцията */
.wp-all {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 32px !important;
  padding: 40px !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;
}

.wp-all-h {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin-bottom: 30px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid #f3f4f6 !important;
}

.wp-all-h b {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  letter-spacing: -0.5px !important;
}

.wp-all-h .pill.p-ok {
  background-color: #f0fdf4 !important;
  color: #305a08 !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;
  padding: 6px 14px !important;
  border-radius: 20px !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
}
.wp-shield-ic {
    width: 38px;
    height: 38px;
    border-radius: 11px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    background: #7cbf0021;
    color: #7cbf00;
}
.wp-speed-fill {
    height: 100%;
    border-radius: 99px;
    background: #7cbf00;
}
/*6*/

/* Прилагане на точния дизайн от .svc-card върху блоковете в новата секция за скорост */
.wp-speed {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px !important;
  align-items: stretch !important;
}

/* Лява кутия (графиките) и дясната кутия (.wp-speed-i) с дизайн на .svc-card */
.wp-speed-box,
.wp-speed-i {
  position: relative !important;
  overflow: hidden !important;
  background: rgba(183, 255, 53, 0.04) !important;
  border: 1.5px solid #305a08 !important;
  border-radius: 26px !important;
  padding: 30px !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform .22s cubic-bezier(.2, .9, .2, 1), box-shadow .22s, border-color .22s !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02) !important;
}

.wp-speed-box:hover,
.wp-speed-i:hover {
  transform: translateY(-4px) !important;
  border-color: #69c90e !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.12) !important;
  background: #ffffff !important;
}

/* Вътрешна организация на дясната колона .wp-speed-l */
.wp-speed-l {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
}

/* Стил за отделните елементи в .wp-speed-i */
.wp-speed-i {
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 18px !important;
  padding: 24px !important;
}

/* Икони (в стил .svc-ic) */
.wp-speed-ic {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  background: #f0fdf4 !important;
  color: #305a08 !important;
  border-radius: 14px !important;
  flex-shrink: 0 !important;
  border: 1px solid rgba(48, 90, 8, 0.2) !important;
}

.wp-speed-ic svg {
  width: 24px !important;
  height: 24px !important;
}

/* Типография и текстове в дясната колона */
.wp-speed-i > span {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.wp-speed-i b {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  letter-spacing: -0.2px !important;
}

.wp-speed-i p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

/* Стил за левия панел с измерванията */
.wp-speed-h {
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 24px !important;
  letter-spacing: -0.3px !important;
}

.wp-speed-r {
  margin-bottom: 18px !important;
}

.wp-speed-t {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 0.92rem !important;
  color: #4b5563 !important;
  margin-bottom: 8px !important;
  font-weight: 500 !important;
}

.wp-speed-t b {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  background: #f0fdf4 !important;
  padding: 2px 8px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(48, 90, 8, 0.2) !important;
}

.wp-speed-bar {
  width: 100% !important;
  height: 10px !important;
  background: #e5e7eb !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.wp-speed-fill {
  height: 100% !important;
  background: linear-gradient(90deg, #305a08, #69c90e) !important;
  border-radius: 6px !important;
}

.wp-speed-fill.slow {
  background: linear-gradient(90deg, #9ca3af, #6b7280) !important;
}

.wp-speed-note {
  font-size: 0.85rem !important;
  color: #6b7280 !important;
  margin-top: 20px !important;
  line-height: 1.4 !important;
  border-top: 1px solid #e5e7eb !important;
  padding-top: 14px !important;
}

/* Адаптивност за таблети и мобилни устройства */
@media (max-width: 968px) {
  .wp-speed {
    grid-template-columns: 1fr !important;
  }
}
.wp-speed-ic {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    background: #ffffff !important;
    color: #7cbf00 !important;
    border-radius: 14px !important;
    flex-shrink: 0 !important;
    border: 1px solid rgba(48, 90, 8, 0.2) !important;
}

.wp-move-safe {
    margin-top: 20px;
    padding: 13px 15px;
    border-radius: var(--r, 10px);
    background: rgb(152 219 28 / 24%);
    border: 1px solid rgba(111, 217, 172, .24);
    font-size: 12.5px;
    color: #7cbf00;
    line-height: 1.6;
}


/*7*/
.sec-wash {
  background: #ffffff;
  padding: 80px 0;
}

.sec-wash .wp-head {
  text-align: center;
  max-width: 600px;
  margin: 0 auto 50px;
}

.sec-wash .wp-head h2 {
  font-size: 2.25rem;
  font-weight: 800;
  color: #1a2e05;
  letter-spacing: -0.025em;
  margin-bottom: 12px;
}

.sec-wash .wp-head p {
  font-size: 1.1rem;
  color: #4a5c3a;
  line-height: 1.6;
}

.wp-cases {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  margin-bottom: 40px;
}

.wp-case {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 36px 30px !important;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.wp-case:hover {
  transform: translateY(-6px);
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.wp-case-ic {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: rgba(183, 255, 53, 0.15);
  color: #305a08;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
  transition: background 0.3s, color 0.3s;
}

.wp-case:hover .wp-case-ic {
  background: rgba(105, 201, 14, 0.25);
  color: #1a2e05;
}

.wp-case-ic svg {
  width: 26px;
  height: 26px;
}

.wp-case h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1a2e05;
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}

.wp-case p {
  font-size: 0.95rem;
  color: #4a5c3a;
  line-height: 1.6;
  margin-bottom: 28px;
  flex-grow: 1;
}

.wp-case-p {
  font-size: 0.9rem;
  color: #1a2e05;
  background: rgba(183, 255, 53, 0.1);
  border: 1px solid rgba(152, 219, 28, 0.2);
  padding: 12px 16px;
  border-radius: 12px;
  display: block;
  text-align: center;
  font-weight: 500;
}

.wp-case-p b {
  color: #305a08;
  font-weight: 700;
}

.wp-ask {
  text-align: center;
  font-size: 1rem;
  color: #4a5c3a;
  margin-top: 10px;
}

.wp-ask a {
  color: #305a08;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px dashed #69c90e;
  padding-bottom: 1px;
  transition: color 0.2s, border-color 0.2s;
}

.wp-ask a:hover {
  color: #1a2e05;
  border-color: #305a08;
}
/*8 faq*/

/* Стил за FAQ секцията с цветовете и дизайна на сайта */
.wp-faq {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
  margin-top: 40px;
}

.wp-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative;
  cursor: pointer;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.wp-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.wp-faq-i h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1a2e05;
  margin: 0;
  padding-right: 25px;
  position: relative;
}

/* Иконка плюс/минус за акордеона */
.wp-faq-i h3::after {
  content: '+';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.25rem;
  color: #305a08;
  font-weight: 400;
  transition: transform 0.3s ease;
}

.wp-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg);
}

.wp-faq-i .wp-faq-n {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #305a08;
  background: rgba(183, 255, 53, 0.2);
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 12px;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.wp-faq-i p {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  margin: 0;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease;
  font-size: 0.95rem;
  color: #4a5c3a;
  line-height: 1.6;
}

.wp-faq-i.is-open p {
  max-height: 300px;
  opacity: 1;
  margin-top: 14px;
}

/*9faq*/



/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за оригиналните класове) */
.sh-faq {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
  margin-top: 40px;
}

.sh-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative;
  cursor: pointer;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.sh-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.sh-faq-i h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1a2e05;
  margin: 0;
  padding-right: 25px;
  position: relative;
}

/* Иконка плюс/минус за акордеона */
.sh-faq-i h3::after {
  content: '+';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.25rem;
  color: #305a08;
  font-weight: 400;
  transition: transform 0.3s ease;
}

.sh-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg);
}

.sh-faq-i .sh-faq-n {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #305a08;
  background: rgba(183, 255, 53, 0.2);
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 12px;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.sh-faq-i p {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  margin: 0;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease;
  font-size: 0.95rem;
  color: #4a5c3a;
  line-height: 1.6;
}

.sh-faq-i.is-open p {
  max-height: 300px;
  opacity: 1;
  margin-top: 14px;
}

/*10wordpress-hosting Кой план ми трябва?*/


/* Основен контейнер и фон на секцията */
section.sec-wash {
  background-color: #fafafa;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

section.sec-wash .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* Заглавна част */
section.sec-wash .wp-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}

section.sec-wash .wp-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 12px !important;
}

section.sec-wash .wp-head p {
  font-size: 1.1rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
}

/* Мрежа с карти */
section.sec-wash .wp-cases {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 24px !important;
  margin-bottom: 40px !important;
}

/* Дизайн на картите: бели, със заобляне и мека сянка */
section.sec-wash .wp-case {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

/* Пълно скриване на иконите */
section.sec-wash .wp-case-ic {
  display: none !important;
}

/* Стил на заглавията (h3) според изискването ти */
section.sec-wash .wp-case h3 {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  margin: 0 0 14px 0 !important;
  padding-left: 12px !important;
  border-left: 3px solid #7cbf00 !important;
  letter-spacing: -0.3px !important;
  transition: border-color 0.3s ease, color 0.3s ease !important;
}

/* Текст в картите */
section.sec-wash .wp-case p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  flex-grow: 1 !important;
  margin-bottom: 20px !important;
}

/* Долен етикет (план) */
section.sec-wash .wp-case-p {
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background-color: #f9fafb !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  display: inline-block !important;
  align-self: flex-start !important;
  border: 1px solid #f3f4f6 !important;
}

section.sec-wash .wp-case-p b {
  color: #305a08 !important;
}

/* Текст и линк най-долу */
section.sec-wash .wp-ask {
  text-align: center !important;
  font-size: 0.95rem !important;
  color: #4b5563 !important;
}

section.sec-wash .wp-ask a {
  color: #305a08 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

section.sec-wash .wp-ask a:hover {
  text-decoration: underline !important;
}

/* Ховър ефект с леко повдигане */
section.sec-wash .wp-case:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/*11 biznes-hosting Кой план ми трябва?*/



/* Основен контейнер и фон на секцията */
section.sec-wash {
  background-color: #fafafa;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

section.sec-wash .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* Заглавна част */
section.sec-wash .bz-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}


/*Не знаеш коя ти трябва? /naeti-sarvari/*/






#help.sec-wash {
  background-color: #fafafa;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

#help .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

#help .ded-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}

#help .ded-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 12px !important;
}

#help .ded-head p {
  font-size: 1.1rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
}

#help .ded-cases {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 24px !important;
  margin-bottom: 40px !important;
}

#help .ded-case {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

#help .ded-case:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

#help .ded-case-ic {
  display: none !important;
}

#help .ded-case h3 {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  margin: 0 0 14px 0 !important;
  padding-left: 12px !important;
  border-left: 3px solid #7cbf00 !important;
  letter-spacing: -0.3px !important;
}

#help .ded-case p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  flex-grow: 1 !important;
  margin-bottom: 20px !important;
}

#help .ded-case-p {
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background-color: #f9fafb !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  display: inline-block !important;
  align-self: flex-start !important;
  border: 1px solid #f3f4f6 !important;
}

#help .ded-case-p b {
  color: #305a08 !important;
}

#help .ded-ask {
  text-align: center !important;
  font-size: 0.95rem !important;
  color: #4b5563 !important;
}

#help .ded-ask a {
  color: #305a08 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

#help .ded-ask a:hover {
  text-decoration: underline !important;
}

/*biznes-hosting faq*/


/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за .bz-faq и .bz-faq-i) */
.bz-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.bz-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.bz-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.bz-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.bz-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.bz-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.bz-faq-i .bz-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.bz-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.bz-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}

/*/reseller-hosting/ faq */

/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за .rs-faq и .rs-faq-i) */
.rs-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.rs-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.rs-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.rs-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.rs-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.rs-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.rs-faq-i .rs-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.rs-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.rs-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}

/* vps faq*/

/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за оригиналните класове) */
.vp-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.vp-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.vp-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.vp-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.vp-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.vp-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.vp-faq-i .vp-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.vp-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.vp-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}

/*menidzhar-vps/faq*/


/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за mv класове) */
.mv-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.mv-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.mv-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.mv-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.mv-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.mv-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.mv-faq-i .mv-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.mv-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.mv-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}

/*naeti-sarvari/ faq*/


/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за ded класове) */
.ded-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.ded-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.ded-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.ded-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.ded-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.ded-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.ded-faq-i .ded-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.ded-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.ded-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}


/*biznes-hosting/Какво казват фирмите*/

/* Стилът важи само за секцията с отзивите на фирмите */
section.sec:has(.bz-revs) {
  background: #ffffff !important;
  background-image:
    radial-gradient(circle at 10% 20%, rgba(152, 219, 28, 0.08) 0%, transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(152, 219, 28, 0.05) 0%, transparent 40%) !important;
  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
}

/* Контейнер */
section.sec:has(.bz-revs) .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Заглавна част */
section.sec:has(.bz-revs) .bz-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  margin-bottom: 50px !important;
  background: #ffffff !important;
  padding: 40px 30px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;
  position: relative !important;
}

/* Заглавие */
section.sec:has(.bz-revs) .bz-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 10px !important;
  letter-spacing: -0.5px !important;
}

/* Подзаглавие */
section.sec:has(.bz-revs) .bz-head p {
  font-size: 1.05rem !important;
  color: #4b5563 !important;
  margin-bottom: 0 !important;
}

/* Grid на отзивите */
section.sec:has(.bz-revs) .bz-revs {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 24px !important;
}

/* Карта на отзив */
section.sec:has(.bz-revs) .bz-rev {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

/* Hover ефект */
section.sec:has(.bz-revs) .bz-rev:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Звезди */
section.sec:has(.bz-revs) .bz-rev-stars {
  display: flex !important;
  gap: 4px !important;
  color: #f59e0b !important;
  width: 90px !important;
  height: 18px !important;
  margin-bottom: 16px !important;
}

/* SVG звездите */
section.sec:has(.bz-revs) .bz-rev-stars svg {
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0 !important;
}

/* Текст на отзива */
section.sec:has(.bz-revs) .bz-rev p {
  font-size: 0.98rem !important;
  color: #374151 !important;
  line-height: 1.6 !important;
  flex-grow: 1 !important;
  margin: 0 0 24px 0 !important;
}

/* Автор */
section.sec:has(.bz-revs) .bz-rev-who {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-top: 1px solid #f3f4f6 !important;
  padding-top: 16px !important;
}

/* Аватар */
section.sec:has(.bz-revs) .bz-rev-av {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #305a08, #69c90e) !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  flex-shrink: 0 !important;
}

/* Вторият ред при автора */
section.sec:has(.bz-revs) .bz-rev-who span span {
  display: block !important;
  font-size: 0.85rem !important;
  color: #6b7280 !important;
  font-weight: 400 !important;
  margin-top: 2px !important;
}

/* Име на автора */
section.sec:has(.bz-revs) .bz-rev-who b {
  font-size: 0.95rem !important;
  color: #111827 !important;
  font-weight: 600 !important;
}


/* =========================
   МОБИЛНА ВЕРСИЯ
   ========================= */

@media (max-width: 768px) {
  section.sec:has(.bz-revs) {
    padding: 70px 16px !important;
  }

  section.sec:has(.bz-revs) .bz-head {
    padding: 30px 20px !important;
    margin-bottom: 35px !important;
    border-radius: 20px !important;
  }

  section.sec:has(.bz-revs) .bz-head h2 {
    font-size: 1.8rem !important;
  }

  section.sec:has(.bz-revs) .bz-head p {
    font-size: 0.95rem !important;
  }

  section.sec:has(.bz-revs) .bz-revs {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  section.sec:has(.bz-revs) .bz-rev {
    padding: 26px 22px !important;
  }

  section.sec:has(.bz-revs) .bz-rev:hover {
    transform: none !important;
  }
}
section.sec:has(.bz-revs) .wrap-w {
  display: block !important;
}

section.sec:has(.bz-revs) .bz-head {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto 50px auto !important;
  padding: 40px 30px !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

section.sec:has(.bz-revs) .bz-head h2 {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto 10px auto !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
  position: static !important;
  transform: none !important;
}

section.sec:has(.bz-revs) .bz-head p {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
  position: static !important;
  transform: none !important;
}


/*reseller-hosting/Какво казват партньорите*/

 /* =========================================
    СТИЛ ЗА СЕКЦИЯ "КАКВО КАЗВАТ ПАРТНЬОРИТЕ"
    ========================================= */

section.sec:has(.rs-revs) {
  background: #ffffff !important;
  background-image:
    radial-gradient(
      circle at 10% 20%,
      rgba(152, 219, 28, 0.08) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 80%,
      rgba(152, 219, 28, 0.05) 0%,
      transparent 40%
    ) !important;

  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec:has(.rs-revs) .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
}


/* =========================================
   ЗАГЛАВНА ЧАСТ
   ========================================= */

section.sec:has(.rs-revs) .rs-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  box-sizing: border-box !important;

  text-align: center !important;

  margin: 0 auto 50px auto !important;
  padding: 40px 30px !important;

  background: #ffffff !important;

  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;

  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;

  position: relative !important;
}


/* Заглавие */

section.sec:has(.rs-revs) .rs-head h2 {
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 auto 10px auto !important;
  padding: 0 !important;

  text-align: center !important;

  font-size: 2.25rem !important;
  font-weight: 700 !important;

  color: #111827 !important;

  letter-spacing: -0.5px !important;

  float: none !important;
}


/* Подзаглавие */

section.sec:has(.rs-revs) .rs-head p {
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 auto !important;
  padding: 0 !important;

  text-align: center !important;

  font-size: 1.05rem !important;
  color: #4b5563 !important;

  float: none !important;
}


/* =========================================
   GRID НА ОТЗИВИТЕ
   ========================================= */

section.sec:has(.rs-revs) .rs-revs {
  display: grid !important;

  grid-template-columns: repeat(
    auto-fit,
    minmax(320px, 1fr)
  ) !important;

  gap: 24px !important;

  width: 100% !important;
}


/* =========================================
   КАРТА НА ОТЗИВА
   ========================================= */

section.sec:has(.rs-revs) .rs-rev {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 32px !important;

  display: flex !important;
  flex-direction: column !important;

  position: relative !important;

  transition: all 0.25s ease-in-out !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;

  box-sizing: border-box !important;
}


/* Hover */

section.sec:has(.rs-revs) .rs-rev:hover {
  transform: translateY(-6px) !important;

  border-color: rgba(105, 201, 14, 0.35) !important;

  background: #ffffff !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ЗВЕЗДИ
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-stars {
  display: flex !important;

  align-items: center !important;

  gap: 4px !important;

  color: #f59e0b !important;

  width: 90px !important;
  height: 18px !important;

  margin-bottom: 16px !important;
}


/* SVG */

section.sec:has(.rs-revs) .rs-rev-stars svg {
  width: 18px !important;
  height: 18px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ТЕКСТ НА ОТЗИВА
   ========================================= */

section.sec:has(.rs-revs) .rs-rev > p {
  font-size: 0.98rem !important;

  color: #374151 !important;

  line-height: 1.6 !important;

  flex-grow: 1 !important;

  margin: 0 0 24px 0 !important;

  padding: 0 !important;
}


/* =========================================
   АВТОР
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-who {
  display: flex !important;

  align-items: center !important;

  gap: 14px !important;

  border-top: 1px solid #f3f4f6 !important;

  padding-top: 16px !important;
}


/* =========================================
   АВАТАР
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-av {
  width: 42px !important;
  height: 42px !important;

  min-width: 42px !important;

  border-radius: 50% !important;

  background: linear-gradient(
    135deg,
    #305a08,
    #69c90e
  ) !important;

  color: #ffffff !important;

  display: flex !important;

  align-items: center !important;
  justify-content: center !important;

  font-weight: 700 !important;

  font-size: 0.9rem !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ИМЕ НА АВТОРА
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-who b {
  display: block !important;

  font-size: 0.95rem !important;

  color: #111827 !important;

  font-weight: 600 !important;
}


/* =========================================
   ОПИСАНИЕ ПОД ИМЕТО
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-who span span {
  display: block !important;

  font-size: 0.85rem !important;

  color: #6b7280 !important;

  font-weight: 400 !important;

  margin-top: 2px !important;
}


/* =========================================
   МОБИЛНА ВЕРСИЯ
   ========================================= */

@media (max-width: 768px) {

  section.sec:has(.rs-revs) {
    padding: 70px 16px !important;
  }

  section.sec:has(.rs-revs) .rs-head {
    padding: 30px 20px !important;

    margin-bottom: 35px !important;

    border-radius: 20px !important;
  }

  section.sec:has(.rs-revs) .rs-head h2 {
    font-size: 1.8rem !important;

    line-height: 1.25 !important;
  }

  section.sec:has(.rs-revs) .rs-head p {
    font-size: 0.95rem !important;

    line-height: 1.5 !important;
  }

  section.sec:has(.rs-revs) .rs-revs {
    grid-template-columns: 1fr !important;

    gap: 18px !important;
  }

  section.sec:has(.rs-revs) .rs-rev {
    padding: 26px 22px !important;
  }

  section.sec:has(.rs-revs) .rs-rev:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛКИ ТЕЛЕФОНИ
   ========================================= */

@media (max-width: 480px) {

  section.sec:has(.rs-revs) {
    padding: 55px 14px !important;
  }

  section.sec:has(.rs-revs) .rs-head {
    padding: 26px 16px !important;
  }

  section.sec:has(.rs-revs) .rs-head h2 {
    font-size: 1.55rem !important;
  }

  section.sec:has(.rs-revs) .rs-rev {
    padding: 22px 18px !important;
  }
}


/*vps/ Какво казват клиентите*/

 /* =========================================
    СТИЛ ЗА СЕКЦИЯ "КАКВО КАЗВАТ КЛИЕНТИТЕ"
    ========================================= */

section.sec:has(.vp-revs) {
  background: #ffffff !important;

  background-image:
    radial-gradient(
      circle at 10% 20%,
      rgba(152, 219, 28, 0.08) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 80%,
      rgba(152, 219, 28, 0.05) 0%,
      transparent 40%
    ) !important;

  padding: 100px 20px !important;

  font-family:
    'Inter',
    system-ui,
    -apple-system,
    sans-serif !important;

  color: #1e293b !important;

  overflow: hidden !important;

  position: relative !important;

  border-block:
    1px solid rgba(152, 219, 28, 0.2) !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec:has(.vp-revs) .wrap-w {
  max-width: 1200px !important;

  width: 100% !important;

  margin: 0 auto !important;

  position: relative !important;

  z-index: 1 !important;

  box-sizing: border-box !important;
}


/* =========================================
   ЗАГЛАВНА ЧАСТ
   ========================================= */

section.sec:has(.vp-revs) .vp-head {
  display: flex !important;

  flex-direction: column !important;

  align-items: center !important;

  justify-content: center !important;

  width: 100% !important;

  max-width: 100% !important;

  box-sizing: border-box !important;

  text-align: center !important;

  margin: 0 auto 50px auto !important;

  padding: 40px 30px !important;

  background: #ffffff !important;

  border-radius: 24px !important;

  border: 1px solid rgba(152, 219, 28, 0.4) !important;

  box-shadow:
    0 15px 35px rgba(0, 0, 0, 0.03) !important;

  position: relative !important;
}


/* =========================================
   ЗАГЛАВИЕ
   ========================================= */

section.sec:has(.vp-revs) .vp-head h2 {
  display: block !important;

  width: 100% !important;

  max-width: none !important;

  margin: 0 auto 10px auto !important;

  padding: 0 !important;

  text-align: center !important;

  font-size: 2.25rem !important;

  line-height: 1.25 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  letter-spacing: -0.5px !important;

  float: none !important;

  position: static !important;

  transform: none !important;
}


/* =========================================
   ПОДЗАГЛАВИЕ
   ========================================= */

section.sec:has(.vp-revs) .vp-head p {
  display: block !important;

  width: 100% !important;

  max-width: none !important;

  margin: 0 auto !important;

  padding: 0 !important;

  text-align: center !important;

  font-size: 1.05rem !important;

  line-height: 1.5 !important;

  color: #4b5563 !important;

  float: none !important;

  position: static !important;

  transform: none !important;
}


/* =========================================
   GRID НА ОТЗИВИТЕ
   ========================================= */

section.sec:has(.vp-revs) .vp-revs {
  display: grid !important;

  grid-template-columns:
    repeat(
      auto-fit,
      minmax(320px, 1fr)
    ) !important;

  gap: 24px !important;

  width: 100% !important;
}


/* =========================================
   КАРТА НА ОТЗИВА
   ========================================= */

section.sec:has(.vp-revs) .vp-rev {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 32px !important;

  display: flex !important;

  flex-direction: column !important;

  position: relative !important;

  box-sizing: border-box !important;

  transition:
    all 0.25s ease-in-out !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}


/* =========================================
   HOVER НА КАРТАТА
   ========================================= */

section.sec:has(.vp-revs) .vp-rev:hover {
  transform: translateY(-6px) !important;

  border-color:
    rgba(105, 201, 14, 0.35) !important;

  background: #ffffff !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ЗВЕЗДИ
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-stars {
  display: flex !important;

  align-items: center !important;

  gap: 4px !important;

  color: #f59e0b !important;

  width: 90px !important;

  height: 18px !important;

  margin-bottom: 16px !important;
}


/* SVG ЗВЕЗДИ */

section.sec:has(.vp-revs) .vp-rev-stars svg {
  width: 18px !important;

  height: 18px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ТЕКСТ НА ОТЗИВА
   ========================================= */

section.sec:has(.vp-revs) .vp-rev > p {
  font-size: 0.98rem !important;

  color: #374151 !important;

  line-height: 1.6 !important;

  flex-grow: 1 !important;

  margin: 0 0 24px 0 !important;

  padding: 0 !important;
}


/* =========================================
   АВТОР
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-who {
  display: flex !important;

  align-items: center !important;

  gap: 14px !important;

  border-top:
    1px solid #f3f4f6 !important;

  padding-top: 16px !important;
}


/* =========================================
   АВАТАР
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-av {
  width: 42px !important;

  height: 42px !important;

  min-width: 42px !important;

  border-radius: 50% !important;

  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  font-weight: 700 !important;

  font-size: 0.9rem !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ИМЕ НА КЛИЕНТА
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-who b {
  display: block !important;

  font-size: 0.95rem !important;

  color: #111827 !important;

  font-weight: 600 !important;
}


/* =========================================
   ОПИСАНИЕ ПОД ИМЕТО
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-who span span {
  display: block !important;

  font-size: 0.85rem !important;

  color: #6b7280 !important;

  font-weight: 400 !important;

  margin-top: 2px !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 768px) {

  section.sec:has(.vp-revs) {
    padding: 70px 16px !important;
  }

  section.sec:has(.vp-revs) .vp-head {
    padding: 30px 20px !important;

    margin-bottom: 35px !important;

    border-radius: 20px !important;
  }

  section.sec:has(.vp-revs) .vp-head h2 {
    font-size: 1.8rem !important;
  }

  section.sec:has(.vp-revs) .vp-head p {
    font-size: 0.95rem !important;
  }

  section.sec:has(.vp-revs) .vp-revs {
    grid-template-columns: 1fr !important;

    gap: 18px !important;
  }

  section.sec:has(.vp-revs) .vp-rev {
    padding: 26px 22px !important;
  }

  section.sec:has(.vp-revs) .vp-rev:hover {
    transform: none !important;
  }
}


/* =========================================
   МОБИЛЕН ТЕЛЕФОН
   ========================================= */

@media (max-width: 480px) {

  section.sec:has(.vp-revs) {
    padding: 55px 14px !important;
  }

  section.sec:has(.vp-revs) .vp-head {
    padding: 26px 16px !important;
  }

  section.sec:has(.vp-revs) .vp-head h2 {
    font-size: 1.55rem !important;

    line-height: 1.25 !important;
  }

  section.sec:has(.vp-revs) .vp-head p {
    font-size: 0.9rem !important;
  }

  section.sec:has(.vp-revs) .vp-rev {
    padding: 22px 18px !important;
  }
}
/*menidzhar-vps/Какво казват клиентите*/

/* =========================================
   СТИЛ ЗА СЕКЦИЯ "КАКВО КАЗВАТ КЛИЕНТИТЕ"
   ========================================= */

section.sec:has(.mv-revs) {
  background: #ffffff !important;
  background-image:
    radial-gradient(
      circle at 10% 20%,
      rgba(152, 219, 28, 0.08) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 80%,
      rgba(152, 219, 28, 0.05) 0%,
      transparent 40%
    ) !important;

  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec:has(.mv-revs) .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
}


/* =========================================
   ЗАГЛАВНА ЧАСТ
   ========================================= */

section.sec:has(.mv-revs) .mv-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;

  text-align: center !important;

  margin: 0 auto 50px auto !important;
  padding: 40px 30px !important;

  background: #ffffff !important;

  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;

  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;

  position: relative !important;
}


/* =========================================
   ЗАГЛАВИЕ
   ========================================= */

section.sec:has(.mv-revs) .mv-head h2 {
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 auto 10px auto !important;
  padding: 0 !important;

  text-align: center !important;

  font-size: 2.25rem !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;

  color: #111827 !important;
  letter-spacing: -0.5px !important;

  float: none !important;
  position: static !important;
  transform: none !important;
}


/* =========================================
   ПОДЗАГЛАВИЕ
   ========================================= */

section.sec:has(.mv-revs) .mv-head p {
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 auto !important;
  padding: 0 !important;

  text-align: center !important;

  font-size: 1.05rem !important;
  line-height: 1.5 !important;

  color: #4b5563 !important;

  float: none !important;
  position: static !important;
  transform: none !important;
}


/* =========================================
   GRID НА ОТЗИВИТЕ
   ========================================= */

section.sec:has(.mv-revs) .mv-revs {
  display: grid !important;

  grid-template-columns:
    repeat(
      auto-fit,
      minmax(320px, 1fr)
    ) !important;

  gap: 24px !important;

  width: 100% !important;
}


/* =========================================
   КАРТА НА ОТЗИВА
   ========================================= */

section.sec:has(.mv-revs) .mv-rev {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 32px !important;

  display: flex !important;
  flex-direction: column !important;

  position: relative !important;

  box-sizing: border-box !important;

  transition: all 0.25s ease-in-out !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}


/* =========================================
   HOVER
   ========================================= */

section.sec:has(.mv-revs) .mv-rev:hover {
  transform: translateY(-6px) !important;

  border-color:
    rgba(105, 201, 14, 0.35) !important;

  background: #ffffff !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ЗВЕЗДИ
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-stars {
  display: flex !important;

  align-items: center !important;

  gap: 4px !important;

  color: #f59e0b !important;

  width: 90px !important;
  height: 18px !important;

  margin-bottom: 16px !important;
}


/* SVG */

section.sec:has(.mv-revs) .mv-rev-stars svg {
  width: 18px !important;
  height: 18px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ТЕКСТ НА ОТЗИВА
   ========================================= */

section.sec:has(.mv-revs) .mv-rev > p {
  font-size: 0.98rem !important;

  color: #374151 !important;

  line-height: 1.6 !important;

  flex-grow: 1 !important;

  margin: 0 0 24px 0 !important;
  padding: 0 !important;
}


/* =========================================
   АВТОР
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-who {
  display: flex !important;

  align-items: center !important;

  gap: 14px !important;

  border-top:
    1px solid #f3f4f6 !important;

  padding-top: 16px !important;
}


/* =========================================
   АВАТАР
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-av {
  width: 42px !important;
  height: 42px !important;

  min-width: 42px !important;

  border-radius: 50% !important;

  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  display: flex !important;

  align-items: center !important;
  justify-content: center !important;

  font-weight: 700 !important;
  font-size: 0.9rem !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ИМЕ
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-who b {
  display: block !important;

  font-size: 0.95rem !important;

  color: #111827 !important;

  font-weight: 600 !important;
}


/* =========================================
   ОПИСАНИЕ ПОД ИМЕТО
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-who span span {
  display: block !important;

  font-size: 0.85rem !important;

  color: #6b7280 !important;

  font-weight: 400 !important;

  margin-top: 2px !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 768px) {

  section.sec:has(.mv-revs) {
    padding: 70px 16px !important;
  }

  section.sec:has(.mv-revs) .mv-head {
    padding: 30px 20px !important;

    margin-bottom: 35px !important;

    border-radius: 20px !important;
  }

  section.sec:has(.mv-revs) .mv-head h2 {
    font-size: 1.8rem !important;
  }

  section.sec:has(.mv-revs) .mv-head p {
    font-size: 0.95rem !important;
  }

  section.sec:has(.mv-revs) .mv-revs {
    grid-template-columns: 1fr !important;

    gap: 18px !important;
  }

  section.sec:has(.mv-revs) .mv-rev {
    padding: 26px 22px !important;
  }

  section.sec:has(.mv-revs) .mv-rev:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛЪК ТЕЛЕФОН
   ========================================= */

@media (max-width: 480px) {

  section.sec:has(.mv-revs) {
    padding: 55px 14px !important;
  }

  section.sec:has(.mv-revs) .mv-head {
    padding: 26px 16px !important;
  }

  section.sec:has(.mv-revs) .mv-head h2 {
    font-size: 1.55rem !important;
    line-height: 1.25 !important;
  }

  section.sec:has(.mv-revs) .mv-head p {
    font-size: 0.9rem !important;
  }

  section.sec:has(.mv-revs) .mv-rev {
    padding: 22px 18px !important;
  }
}


/*naeti-sarvari/Какво влиза в цената*/


/* =========================================
   СЕКЦИЯ "КАКВО ВЛИЗА В ЦЕНАТА"
   ========================================= */

section.sec:has(.ded-incl) {
  background: #ffffff !important;

  background-image:
    radial-gradient(
      circle at 10% 20%,
      rgba(152, 219, 28, 0.08) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 80%,
      rgba(152, 219, 28, 0.05) 0%,
      transparent 40%
    ) !important;

  padding: 100px 20px !important;

  font-family:
    'Inter',
    system-ui,
    -apple-system,
    sans-serif !important;

  color: #1e293b !important;

  overflow: hidden !important;

  position: relative !important;

  border-block:
    1px solid rgba(152, 219, 28, 0.2) !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec:has(.ded-incl) .wrap-w {
  max-width: 1200px !important;

  width: 100% !important;

  margin: 0 auto !important;

  position: relative !important;

  z-index: 1 !important;

  box-sizing: border-box !important;
}


/* =========================================
   HEADER
   ========================================= */

section.sec:has(.ded-incl) .ded-head {
  display: flex !important;

  flex-direction: column !important;

  align-items: center !important;

  justify-content: center !important;

  width: 100% !important;

  max-width: 100% !important;

  box-sizing: border-box !important;

  text-align: center !important;

  margin: 0 auto 50px auto !important;

  padding: 40px 30px !important;

  background: #ffffff !important;

  border-radius: 24px !important;

  border:
    1px solid rgba(152, 219, 28, 0.4) !important;

  box-shadow:
    0 15px 35px rgba(0, 0, 0, 0.03) !important;

  position: relative !important;
}


/* =========================================
   ЗАГЛАВИЕ
   ========================================= */

section.sec:has(.ded-incl) .ded-head h2 {
  display: block !important;

  width: 100% !important;

  max-width: none !important;

  margin: 0 auto 10px auto !important;

  padding: 0 !important;

  text-align: center !important;

  font-size: 2.25rem !important;

  line-height: 1.25 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  letter-spacing: -0.5px !important;

  float: none !important;

  position: static !important;

  transform: none !important;
}


/* =========================================
   ПОДЗАГЛАВИЕ
   ========================================= */

section.sec:has(.ded-incl) .ded-head p {
  display: block !important;

  width: 100% !important;

  max-width: none !important;

  margin: 0 auto !important;

  padding: 0 !important;

  text-align: center !important;

  font-size: 1.05rem !important;

  line-height: 1.5 !important;

  color: #4b5563 !important;

  float: none !important;

  position: static !important;

  transform: none !important;
}


/* =========================================
   GRID НА ЕЛЕМЕНТИТЕ
   ========================================= */

section.sec:has(.ded-incl) .ded-incl {
  display: grid !important;

  grid-template-columns:
    repeat(
      4,
      minmax(0, 1fr)
    ) !important;

  gap: 24px !important;

  width: 100% !important;
}


/* =========================================
   ИНДИВИДУАЛНА КАРТА
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-i {
  background: #ffffff !important;

  border:
    1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 32px !important;

  display: flex !important;

  flex-direction: column !important;

  align-items: flex-start !important;

  position: relative !important;

  box-sizing: border-box !important;

  transition:
    all 0.25s ease-in-out !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}


/* =========================================
   HOVER
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-i:hover {
  transform: translateY(-6px) !important;

  border-color:
    rgba(105, 201, 14, 0.35) !important;

  background: #ffffff !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ИКОНА
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-ic {
  width: 48px !important;

  height: 48px !important;

  min-width: 48px !important;

  border-radius: 14px !important;

  background:
    linear-gradient(
      135deg,
      rgba(48, 90, 8, 0.1),
      rgba(105, 201, 14, 0.18)
    ) !important;

  color: #305a08 !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  margin-bottom: 22px !important;

  border:
    1px solid rgba(105, 201, 14, 0.2) !important;

  transition:
    all 0.25s ease-in-out !important;
}


/* SVG икона */

section.sec:has(.ded-incl) .ded-incl-ic svg {
  width: 24px !important;

  height: 24px !important;

  display: block !important;
}


/* Hover икона */

section.sec:has(.ded-incl) .ded-incl-i:hover .ded-incl-ic {
  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  transform: scale(1.05) !important;
}


/* =========================================
   ЗАГЛАВИЕ НА ЕЛЕМЕНТА
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-i > b {
  display: block !important;

  font-size: 1.05rem !important;

  line-height: 1.35 !important;

  font-weight: 650 !important;

  color: #111827 !important;

  margin: 0 0 10px 0 !important;
}


/* =========================================
   ОПИСАНИЕ
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-i > p {
  display: block !important;

  font-size: 0.92rem !important;

  line-height: 1.6 !important;

  color: #6b7280 !important;

  margin: 0 !important;

  padding: 0 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 1000px) {

  section.sec:has(.ded-incl) .ded-incl {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;

    gap: 20px !important;
  }
}


/* =========================================
   МОБИЛНА ВЕРСИЯ
   ========================================= */

@media (max-width: 768px) {

  section.sec:has(.ded-incl) {
    padding: 70px 16px !important;
  }

  section.sec:has(.ded-incl) .ded-head {
    padding: 30px 20px !important;

    margin-bottom: 35px !important;

    border-radius: 20px !important;
  }

  section.sec:has(.ded-incl) .ded-head h2 {
    font-size: 1.8rem !important;
  }

  section.sec:has(.ded-incl) .ded-head p {
    font-size: 0.95rem !important;
  }

  section.sec:has(.ded-incl) .ded-incl {
    grid-template-columns: 1fr !important;

    gap: 18px !important;
  }

  section.sec:has(.ded-incl) .ded-incl-i {
    padding: 26px 22px !important;
  }

  section.sec:has(.ded-incl) .ded-incl-i:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛЪК ТЕЛЕФОН
   ========================================= */

@media (max-width: 480px) {

  section.sec:has(.ded-incl) {
    padding: 55px 14px !important;
  }

  section.sec:has(.ded-incl) .ded-head {
    padding: 26px 16px !important;
  }

  section.sec:has(.ded-incl) .ded-head h2 {
    font-size: 1.55rem !important;
  }

  section.sec:has(.ded-incl) .ded-head p {
    font-size: 0.9rem !important;
  }

  section.sec:has(.ded-incl) .ded-incl-i {
    padding: 22px 18px !important;
  }
}


/*biznes-hosting/Всички планове имат*/


/* =========================================
   "ВСИЧКИ ПЛАНОВЕ ИМАТ"
   Дизайн в стила на payment/case секцията
   ========================================= */

section.sec.bz-all-sec {
  background: #fafafa !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  box-sizing: border-box !important;
}


/* Контейнер */
section.sec.bz-all-sec .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}


/* =========================================
   ОСНОВНА КАРТА
   ========================================= */

section.sec.bz-all-sec .bz-all {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 40px !important;

  position: relative !important;

  box-sizing: border-box !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;

  transition:
    all 0.25s ease-in-out !important;
}


/* Лек hover ефект на цялата карта */

section.sec.bz-all-sec .bz-all:hover {
  border-color: rgba(105, 201, 14, 0.35) !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.07),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ГОРНА ЧАСТ
   ========================================= */

section.sec.bz-all-sec .bz-all-h {
  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  flex-wrap: wrap !important;

  gap: 12px !important;

  text-align: center !important;

  margin: 0 0 32px 0 !important;

  padding: 0 0 24px 0 !important;

  border-bottom: 1px solid #f3f4f6 !important;
}


/* Основният текст */

section.sec.bz-all-sec .bz-all-h > b {
  font-size: 1.25rem !important;

  line-height: 1.4 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  margin: 0 !important;
}


/* =========================================
   GREEN PILL
   ========================================= */

section.sec.bz-all-sec .bz-all-h .pill.p-ok {
  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.28) !important;

  border-radius: 999px !important;

  padding: 6px 12px !important;

  font-size: 0.82rem !important;

  line-height: 1.2 !important;

  font-weight: 700 !important;

  white-space: nowrap !important;

  box-sizing: border-box !important;
}


/* =========================================
   СПИСЪК
   ========================================= */

section.sec.bz-all-sec .bz-all-l {
  display: grid !important;

  grid-template-columns:
    repeat(3, minmax(0, 1fr)) !important;

  column-gap: 50px !important;

  row-gap: 18px !important;

  width: 100% !important;

  box-sizing: border-box !important;
}


/* Всеки ред */

section.sec.bz-all-sec .bz-all-l > div {
  display: flex !important;

  align-items: center !important;

  gap: 12px !important;

  min-width: 0 !important;

  padding: 10px 0 !important;

  color: #374151 !important;

  font-size: 0.95rem !important;

  line-height: 1.45 !important;

  box-sizing: border-box !important;

  transition:
    color 0.2s ease,
    transform 0.2s ease !important;
}


/* Hover върху отделен елемент */

section.sec.bz-all-sec .bz-all-l > div:hover {
  color: #305a08 !important;

  transform: translateX(4px) !important;
}


/* =========================================
   CHECK ИКОНА
   ========================================= */

section.sec.bz-all-sec .bz-fi {
  width: 34px !important;

  height: 34px !important;

  min-width: 34px !important;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  border-radius: 50% !important;

  background:
    rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border:
    1px solid rgba(152, 219, 28, 0.25) !important;

  box-sizing: border-box !important;

  transition:
    all 0.2s ease !important;
}


/* SVG */

section.sec.bz-all-sec .bz-fi svg {
  width: 17px !important;

  height: 17px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* Hover на check */

section.sec.bz-all-sec .bz-all-l > div:hover .bz-fi {
  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  border-color: transparent !important;
}


/* =========================================
   ТЕКСТЪТ В СПИСЪКА
   ========================================= */

section.sec.bz-all-sec .bz-all-l > div > span:last-child {
  display: block !important;

  color: inherit !important;

  font-weight: 500 !important;

  margin: 0 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 800px) {

  section.sec.bz-all-sec {
    padding: 65px 18px !important;
  }

  section.sec.bz-all-sec .bz-all {
    padding: 32px !important;
  }

  section.sec.bz-all-sec .bz-all-l {
    grid-template-columns: 1fr !important;

    row-gap: 12px !important;
  }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

  section.sec.bz-all-sec {
    padding: 55px 16px !important;
  }

  section.sec.bz-all-sec .bz-all {
    padding: 26px 20px !important;

    border-radius: 14px !important;
  }

  section.sec.bz-all-sec .bz-all-h {
    margin-bottom: 24px !important;

    padding-bottom: 20px !important;

    gap: 9px !important;
  }

  section.sec.bz-all-sec .bz-all-h > b {
    font-size: 1.1rem !important;
  }

  section.sec.bz-all-sec .bz-all-h .pill.p-ok {
    font-size: 0.78rem !important;

    padding: 5px 10px !important;
  }

  section.sec.bz-all-sec .bz-all-l > div {
    font-size: 0.9rem !important;

    gap: 10px !important;

    padding: 8px 0 !important;
  }

  section.sec.bz-all-sec .bz-fi {
    width: 32px !important;

    height: 32px !important;

    min-width: 32px !important;
  }

  section.sec.bz-all-sec .bz-fi svg {
    width: 16px !important;

    height: 16px !important;
  }

  section.sec.bz-all-sec .bz-all-l > div:hover {
    transform: none !important;
  }
}


/* =========================================
   МНОГО МАЛЪК ЕКРАН
   ========================================= */

@media (max-width: 400px) {

  section.sec.bz-all-sec {
    padding: 45px 12px !important;
  }

  section.sec.bz-all-sec .bz-all {
    padding: 22px 16px !important;
  }

  section.sec.bz-all-sec .bz-all-h {
    flex-direction: column !important;
  }

  section.sec.bz-all-sec .bz-all-h > b {
    font-size: 1.05rem !important;
  }
}

@media (max-width: 900px) {
  section.sec.bz-all-sec .bz-all-l {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 25px !important;
  }
}

@media (max-width: 600px) {
  section.sec.bz-all-sec .bz-all-l {
    grid-template-columns: 1fr !important;
    row-gap: 12px !important;
  }
}


/*reseller-hosting/Всички планове имат*/


/* =========================================
   RS — "ВСИЧКИ ПЛАНОВЕ ИМАТ"
   ========================================= */

section.sec.rs-all-sec {
  background: #fafafa !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  box-sizing: border-box !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec.rs-all-sec .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}


/* =========================================
   ОСНОВНА БЯЛА КАРТА
   ========================================= */

section.sec.rs-all-sec .rs-all {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 40px !important;

  position: relative !important;

  box-sizing: border-box !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;

  transition: all 0.25s ease-in-out !important;
}


/* Hover на основната карта */

section.sec.rs-all-sec .rs-all:hover {
  border-color: rgba(105, 201, 14, 0.35) !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.07),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ГОРНА ЧАСТ
   ========================================= */

section.sec.rs-all-sec .rs-all-h {
  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  flex-wrap: wrap !important;

  gap: 12px !important;

  text-align: center !important;

  margin: 0 0 32px 0 !important;

  padding: 0 0 24px 0 !important;

  border-bottom: 1px solid #f3f4f6 !important;
}


/* "Всички планове имат" */

section.sec.rs-all-sec .rs-all-h > b {
  font-size: 1.25rem !important;

  line-height: 1.4 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  margin: 0 !important;
}


/* =========================================
   GREEN PILL
   ========================================= */

section.sec.rs-all-sec .rs-all-h .pill.p-ok {
  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.28) !important;

  border-radius: 999px !important;

  padding: 6px 12px !important;

  font-size: 0.82rem !important;

  line-height: 1.2 !important;

  font-weight: 700 !important;

  white-space: nowrap !important;

  box-sizing: border-box !important;
}


/* =========================================
   СПИСЪК — 3 КОЛОНИ
   ========================================= */

section.sec.rs-all-sec .rs-all-l {
  display: grid !important;

  grid-template-columns:
    repeat(3, minmax(0, 1fr)) !important;

  column-gap: 40px !important;

  row-gap: 18px !important;

  width: 100% !important;

  box-sizing: border-box !important;
}


/* =========================================
   ВСЕКИ ЕЛЕМЕНТ
   ========================================= */

section.sec.rs-all-sec .rs-all-l > div {
  display: flex !important;

  align-items: center !important;

  gap: 12px !important;

  min-width: 0 !important;

  padding: 10px 0 !important;

  color: #374151 !important;

  font-size: 0.95rem !important;

  line-height: 1.45 !important;

  box-sizing: border-box !important;

  transition:
    color 0.2s ease,
    transform 0.2s ease !important;
}


/* Hover върху ред */

section.sec.rs-all-sec .rs-all-l > div:hover {
  color: #305a08 !important;

  transform: translateX(4px) !important;
}


/* =========================================
   CHECK ИКОНА
   ========================================= */

section.sec.rs-all-sec .rs-fi {
  width: 34px !important;

  height: 34px !important;

  min-width: 34px !important;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  border-radius: 50% !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.25) !important;

  box-sizing: border-box !important;

  transition: all 0.2s ease !important;
}


/* SVG */

section.sec.rs-all-sec .rs-fi svg {
  width: 17px !important;

  height: 17px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* Hover на иконката */

section.sec.rs-all-sec .rs-all-l > div:hover .rs-fi {
  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  border-color: transparent !important;
}


/* =========================================
   ТЕКСТ
   ========================================= */

section.sec.rs-all-sec .rs-all-l > div > span:last-child {
  display: block !important;

  color: inherit !important;

  font-weight: 500 !important;

  margin: 0 !important;
}


/* =========================================
   TABLET — 2 КОЛОНИ
   ========================================= */

@media (max-width: 900px) {

  section.sec.rs-all-sec {
    padding: 65px 18px !important;
  }

  section.sec.rs-all-sec .rs-all {
    padding: 32px !important;
  }

  section.sec.rs-all-sec .rs-all-l {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;

    column-gap: 25px !important;

    row-gap: 14px !important;
  }
}


/* =========================================
   MOBILE — 1 КОЛОНА
   ========================================= */

@media (max-width: 600px) {

  section.sec.rs-all-sec {
    padding: 55px 16px !important;
  }

  section.sec.rs-all-sec .rs-all {
    padding: 26px 20px !important;

    border-radius: 14px !important;
  }

  section.sec.rs-all-sec .rs-all-h {
    margin-bottom: 24px !important;

    padding-bottom: 20px !important;

    gap: 9px !important;
  }

  section.sec.rs-all-sec .rs-all-h > b {
    font-size: 1.1rem !important;
  }

  section.sec.rs-all-sec .rs-all-h .pill.p-ok {
    font-size: 0.78rem !important;

    padding: 5px 10px !important;
  }

  section.sec.rs-all-sec .rs-all-l {
    grid-template-columns: 1fr !important;

    row-gap: 12px !important;
  }

  section.sec.rs-all-sec .rs-all-l > div {
    font-size: 0.9rem !important;

    gap: 10px !important;

    padding: 8px 0 !important;
  }

  section.sec.rs-all-sec .rs-fi {
    width: 32px !important;

    height: 32px !important;

    min-width: 32px !important;
  }

  section.sec.rs-all-sec .rs-fi svg {
    width: 16px !important;

    height: 16px !important;
  }

  section.sec.rs-all-sec .rs-all-l > div:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛЪК ТЕЛЕФОН
   ========================================= */

@media (max-width: 400px) {

  section.sec.rs-all-sec {
    padding: 45px 12px !important;
  }

  section.sec.rs-all-sec .rs-all {
    padding: 22px 16px !important;
  }

  section.sec.rs-all-sec .rs-all-h {
    flex-direction: column !important;
  }

  section.sec.rs-all-sec .rs-all-h > b {
    font-size: 1.05rem !important;
  }
}


/*vps/Всички планове имат*/


/* =========================================
   VP — "ВСИЧКИ ПЛАНОВЕ ИМАТ"
   ========================================= */

section.sec.vp-all-sec {
  background: #fafafa !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  box-sizing: border-box !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec.vp-all-sec .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}


/* =========================================
   ОСНОВНА БЯЛА КАРТА
   ========================================= */

section.sec.vp-all-sec .vp-all {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 40px !important;

  position: relative !important;

  box-sizing: border-box !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;

  transition: all 0.25s ease-in-out !important;
}


/* Hover на картата */

section.sec.vp-all-sec .vp-all:hover {
  border-color: rgba(105, 201, 14, 0.35) !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.07),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ГОРНА ЧАСТ
   ========================================= */

section.sec.vp-all-sec .vp-all-h {
  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  flex-wrap: wrap !important;

  gap: 12px !important;

  text-align: center !important;

  margin: 0 0 32px 0 !important;

  padding: 0 0 24px 0 !important;

  border-bottom: 1px solid #f3f4f6 !important;
}


/* Заглавие */

section.sec.vp-all-sec .vp-all-h > b {
  font-size: 1.25rem !important;

  line-height: 1.4 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  margin: 0 !important;
}


/* =========================================
   GREEN PILL
   ========================================= */

section.sec.vp-all-sec .vp-all-h .pill.p-ok {
  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.28) !important;

  border-radius: 999px !important;

  padding: 6px 12px !important;

  font-size: 0.82rem !important;

  line-height: 1.2 !important;

  font-weight: 700 !important;

  white-space: nowrap !important;

  box-sizing: border-box !important;
}


/* =========================================
   СПИСЪК — 3 КОЛОНИ
   ========================================= */

section.sec.vp-all-sec .vp-all-l {
  display: grid !important;

  grid-template-columns:
    repeat(3, minmax(0, 1fr)) !important;

  column-gap: 40px !important;

  row-gap: 18px !important;

  width: 100% !important;

  box-sizing: border-box !important;
}


/* =========================================
   ВСЕКИ ЕЛЕМЕНТ
   ========================================= */

section.sec.vp-all-sec .vp-all-l > div {
  display: flex !important;

  align-items: center !important;

  gap: 12px !important;

  min-width: 0 !important;

  padding: 10px 0 !important;

  color: #374151 !important;

  font-size: 0.95rem !important;

  line-height: 1.45 !important;

  box-sizing: border-box !important;

  transition:
    color 0.2s ease,
    transform 0.2s ease !important;
}


/* Hover на ред */

section.sec.vp-all-sec .vp-all-l > div:hover {
  color: #305a08 !important;

  transform: translateX(4px) !important;
}


/* =========================================
   CHECK ИКОНА
   ========================================= */

section.sec.vp-all-sec .vp-fi {
  width: 34px !important;

  height: 34px !important;

  min-width: 34px !important;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  border-radius: 50% !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.25) !important;

  box-sizing: border-box !important;

  transition: all 0.2s ease !important;
}


/* SVG */

section.sec.vp-all-sec .vp-fi svg {
  width: 17px !important;

  height: 17px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* Hover на check */

section.sec.vp-all-sec .vp-all-l > div:hover .vp-fi {
  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  border-color: transparent !important;
}


/* =========================================
   ТЕКСТ
   ========================================= */

section.sec.vp-all-sec .vp-all-l > div > span:last-child {
  display: block !important;

  color: inherit !important;

  font-weight: 500 !important;

  margin: 0 !important;
}


/* =========================================
   TABLET — 2 КОЛОНИ
   ========================================= */

@media (max-width: 900px) {

  section.sec.vp-all-sec {
    padding: 65px 18px !important;
  }

  section.sec.vp-all-sec .vp-all {
    padding: 32px !important;
  }

  section.sec.vp-all-sec .vp-all-l {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;

    column-gap: 25px !important;

    row-gap: 14px !important;
  }
}


/* =========================================
   MOBILE — 1 КОЛОНА
   ========================================= */

@media (max-width: 600px) {

  section.sec.vp-all-sec {
    padding: 55px 16px !important;
  }

  section.sec.vp-all-sec .vp-all {
    padding: 26px 20px !important;

    border-radius: 14px !important;
  }

  section.sec.vp-all-sec .vp-all-h {
    margin-bottom: 24px !important;

    padding-bottom: 20px !important;

    gap: 9px !important;
  }

  section.sec.vp-all-sec .vp-all-h > b {
    font-size: 1.1rem !important;
  }

  section.sec.vp-all-sec .vp-all-h .pill.p-ok {
    font-size: 0.78rem !important;

    padding: 5px 10px !important;
  }

  section.sec.vp-all-sec .vp-all-l {
    grid-template-columns: 1fr !important;

    row-gap: 12px !important;
  }

  section.sec.vp-all-sec .vp-all-l > div {
    font-size: 0.9rem !important;

    gap: 10px !important;

    padding: 8px 0 !important;
  }

  section.sec.vp-all-sec .vp-fi {
    width: 32px !important;

    height: 32px !important;

    min-width: 32px !important;
  }

  section.sec.vp-all-sec .vp-fi svg {
    width: 16px !important;

    height: 16px !important;
  }

  section.sec.vp-all-sec .vp-all-l > div:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛЪК ТЕЛЕФОН
   ========================================= */

@media (max-width: 400px) {

  section.sec.vp-all-sec {
    padding: 45px 12px !important;
  }

  section.sec.vp-all-sec .vp-all {
    padding: 22px 16px !important;
  }

  section.sec.vp-all-sec .vp-all-h {
    flex-direction: column !important;
  }

  section.sec.vp-all-sec .vp-all-h > b {
    font-size: 1.05rem !important;
  }
}


.bz-mail-c i {
    width: 17px;
    height: 17px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    background: rgb(152 219 28);
    color: #000000;
}
.bz-notes i {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    background: rgb(152 219 28);
    color: #000000;
}

/*biznes-hosting/Колко струва един час без сайт*/


/* ==========================================================================
   COST SECTION — PREMIUM / HIGH-CONVERSION DESIGN
   ========================================================================== */

/* Основна секция */
section.sec:has(.bz-cost) {
    background:
        radial-gradient(circle at 8% 15%, rgba(152, 219, 28, 0.08), transparent 30%),
        radial-gradient(circle at 92% 85%, rgba(152, 219, 28, 0.06), transparent 32%),
        #f7f8f5 !important;
    padding: 100px 20px !important;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    color: #111827 !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Контейнер */
section.sec:has(.bz-cost) .wrap-w {
    max-width: 1180px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.bz-cost) .bz-head {
    max-width: 780px !important;
    margin: 0 auto 55px auto !important;
    text-align: center !important;
}

section.sec:has(.bz-cost) .bz-head h2 {
    margin: 0 0 14px 0 !important;
    font-size: clamp(2rem, 4vw, 2.8rem) !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    color: #111827 !important;
}

section.sec:has(.bz-cost) .bz-head p {
    max-width: 680px !important;
    margin: 0 auto !important;
    font-size: 1.05rem !important;
    line-height: 1.65 !important;
    color: #667085 !important;
}

/* ==========================================================================
   MAIN LAYOUT
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost {
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) !important;
    gap: 22px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   BIG COST CARD
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-box {
    background:
        radial-gradient(circle at 90% 5%, rgba(152, 219, 28, 0.18), transparent 32%),
        linear-gradient(145deg, #151a10 0%, #0d100a 100%) !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 24px !important;
    padding: 38px !important;
    position: relative !important;
    overflow: hidden !important;

    display: flex !important;
    flex-direction: column !important;

    box-shadow:
        0 20px 50px rgba(17, 24, 39, 0.14),
        inset 0 1px 0 rgba(255,255,255,0.05) !important;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease !important;
}

/* декоративна зелена линия */
section.sec:has(.bz-cost) .bz-cost-box::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 5px !important;
    height: 100% !important;
    background: linear-gradient(
        to bottom,
        #7cbf00,
        #69c90e,
        transparent
    ) !important;
}

/* декоративен glow */
section.sec:has(.bz-cost) .bz-cost-box::after {
    content: "" !important;
    position: absolute !important;
    width: 260px !important;
    height: 260px !important;
    right: -130px !important;
    bottom: -130px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.08) !important;
    filter: blur(10px) !important;
    pointer-events: none !important;
}

/* Hover */
section.sec:has(.bz-cost) .bz-cost-box:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(152, 219, 28, 0.5) !important;
    box-shadow:
        0 28px 60px rgba(17, 24, 39, 0.18),
        0 0 35px rgba(152, 219, 28, 0.08) !important;
}

/* Заглавие */
section.sec:has(.bz-cost) .bz-cost-h {
    position: relative !important;
    z-index: 2 !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.7px !important;

    color: #b8c0b0 !important;

    margin: 0 0 28px 0 !important;
}

/* ==========================================================================
   COST ROWS
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-r {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;

    padding: 17px 0 !important;

    border-bottom: 1px solid rgba(255,255,255,0.08) !important;

    position: relative !important;
    z-index: 2 !important;
}

section.sec:has(.bz-cost) .bz-cost-r span {
    font-size: 14px !important;
    line-height: 1.4 !important;
    color: #c8cec4 !important;
}

section.sec:has(.bz-cost) .bz-cost-r b {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   TOTAL — 215 €
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-t {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    gap: 20px !important;

    margin-top: auto !important;
    padding: 30px 0 5px 0 !important;
}

section.sec:has(.bz-cost) .bz-cost-t span {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
}

section.sec:has(.bz-cost) .bz-cost-t b {
    font-size: clamp(2.3rem, 5vw, 3.4rem) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: -2px !important;
    color: #7cbf00 !important;

    text-shadow:
        0 0 25px rgba(152,219,28,0.18) !important;
}

/* ==========================================================================
   NOTE
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-note {
    position: relative !important;
    z-index: 2 !important;

    margin: 22px 0 0 0 !important;
    padding: 18px 0 0 0 !important;

    border-top: 1px solid rgba(152,219,28,0.16) !important;

    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #8e9789 !important;
}

/* ==========================================================================
   RIGHT SIDE
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-l {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
}

/* ==========================================================================
   KPI CARDS
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-i {
    background: #ffffff !important;

    border: 1px solid #e3e7df !important;
    border-radius: 20px !important;

    padding: 28px !important;

    display: flex !important;
    align-items: flex-start !important;
    gap: 22px !important;

    position: relative !important;
    overflow: hidden !important;

    box-shadow:
        0 8px 25px rgba(16, 24, 40, 0.045) !important;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease !important;
}

/* зелена вертикална линия */
section.sec:has(.bz-cost) .bz-cost-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 22px !important;
    bottom: 22px !important;
    width: 3px !important;
    background: #7cbf00 !important;
    border-radius: 0 4px 4px 0 !important;
}

/* малък glow */
section.sec:has(.bz-cost) .bz-cost-i::after {
    content: "" !important;
    position: absolute !important;
    width: 100px !important;
    height: 100px !important;
    right: -50px !important;
    top: -50px !important;
    border-radius: 50% !important;
    background: rgba(152,219,28,0.08) !important;
}

/* Hover */
section.sec:has(.bz-cost) .bz-cost-i:hover {
    transform: translateX(6px) !important;
    border-color: rgba(105,201,14,0.45) !important;

    box-shadow:
        0 18px 35px rgba(105,201,14,0.10) !important;
}

/* ==========================================================================
   BIG KPI NUMBER
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-n {
    flex-shrink: 0 !important;

    min-width: 95px !important;

    font-size: 25px !important;
    line-height: 1 !important;
    font-weight: 900 !important;

    letter-spacing: -1px !important;

    color: #305a08 !important;
}

/* ==========================================================================
   KPI CONTENT
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-i > span:last-child {
    display: block !important;
    position: relative !important;
    z-index: 2 !important;
}

section.sec:has(.bz-cost) .bz-cost-i b {
    display: block !important;

    margin: 0 0 8px 0 !important;

    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;

    color: #111827 !important;

    transition: color 0.25s ease !important;
}

section.sec:has(.bz-cost) .bz-cost-i:hover b {
    color: #305a08 !important;
}

section.sec:has(.bz-cost) .bz-cost-i p {
    margin: 0 !important;

    font-size: 13px !important;
    line-height: 1.6 !important;

    color: #667085 !important;
}

/* ==========================================================================
   SPECIAL STYLE FOR 0 €
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-i:nth-child(3) .bz-cost-n {
    color: #69a90d !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.bz-cost) {
        padding: 75px 20px !important;
    }

    section.sec:has(.bz-cost) .bz-cost {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.bz-cost) .bz-cost-l {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 14px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i {
        flex-direction: column !important;
        gap: 15px !important;
        padding: 23px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-n {
        min-width: auto !important;
    }

}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 650px) {

    section.sec:has(.bz-cost) {
        padding: 60px 16px !important;
    }

    section.sec:has(.bz-cost) .bz-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.bz-cost) .bz-head h2 {
        font-size: 1.9rem !important;
        letter-spacing: -0.7px !important;
    }

    section.sec:has(.bz-cost) .bz-head p {
        font-size: 0.95rem !important;
    }

    section.sec:has(.bz-cost) .bz-cost-box {
        padding: 27px 22px !important;
        border-radius: 20px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-l {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i {
        flex-direction: row !important;
        align-items: flex-start !important;
        padding: 22px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-n {
        min-width: 78px !important;
        font-size: 21px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-t b {
        font-size: 2.6rem !important;
    }

}

/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 420px) {

    section.sec:has(.bz-cost) .bz-cost-r {
        gap: 10px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-r span {
        font-size: 13px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-r b {
        font-size: 15px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i {
        gap: 15px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-n {
        min-width: 70px !important;
        font-size: 19px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i b {
        font-size: 15px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i p {
        font-size: 12.5px !important;
    }

}


/**/



/* ==========================================================================
   СЧЕТОВОДСТВО / ДОКУМЕНТИ — PREMIUM DARK DESIGN
   Само за секцията с .bz-acc
   ========================================================================== */

/* Основна секция */
section.sec-wash {
    background: #fafafa;
    padding: 80px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Контейнер */
section.sec-wash .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec-wash .bz-head {
    max-width: 760px !important;
    margin: 0 auto 50px auto !important;
    text-align: center !important;
}

section.sec-wash .bz-head h2 {
    margin: 0 0 14px 0 !important;
    font-size: 2.25rem !important;
    line-height: 1.15 !important;
    font-weight: 750 !important;
    letter-spacing: -0.7px !important;
    color: #111827 !important;
}

section.sec-wash .bz-head p {
    margin: 0 !important;
    font-size: 1.05rem !important;
    line-height: 1.6 !important;
    color: #6b7280 !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec-wash .bz-acc {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

section.sec-wash .bz-acc-i {
    position: relative !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 20px !important;

    min-height: 175px !important;
    padding: 28px !important;

    background: #11140c !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    border-radius: 16px !important;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.025) !important;

    overflow: hidden !important;

    transition:
        transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),
        border-color 0.35s ease,
        box-shadow 0.35s ease,
        background 0.35s ease !important;
}

/* Зелен декоративен glow */
section.sec-wash .bz-acc-i::before {
    content: "" !important;
    position: absolute !important;
    width: 150px !important;
    height: 150px !important;
    top: -80px !important;
    right: -70px !important;

    background: rgba(152, 219, 28, 0.08) !important;
    border-radius: 50% !important;
    filter: blur(25px) !important;

    pointer-events: none !important;
}

/* Малка зелена линия отляво */
section.sec-wash .bz-acc-i::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 25px !important;
    bottom: 25px !important;
    width: 3px !important;

    background: #7cbf00 !important;
    border-radius: 0 4px 4px 0 !important;

    opacity: 0.7 !important;
    transition: opacity 0.3s ease, box-shadow 0.3s ease !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec-wash .bz-acc-ic {
    flex: 0 0 52px !important;
    width: 52px !important;
    height: 52px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 14px !important;

    background: rgba(152, 219, 28, 0.10) !important;
    border: 1px solid rgba(152, 219, 28, 0.22) !important;

    color: #7cbf00 !important;

    box-shadow:
        inset 0 0 15px rgba(152, 219, 28, 0.04),
        0 0 20px rgba(152, 219, 28, 0.04) !important;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease !important;
}

section.sec-wash .bz-acc-ic svg {
    width: 25px !important;
    height: 25px !important;
    stroke: currentColor !important;
}

/* ==========================================================================
   ТЕКСТОВА ЧАСТ
   ========================================================================== */

section.sec-wash .bz-acc-i > span:last-child {
    position: relative !important;
    z-index: 2 !important;
    flex: 1 !important;
    min-width: 0 !important;
}

section.sec-wash .bz-acc-i b {
    display: block !important;

    margin: 2px 0 10px 0 !important;

    font-size: 18px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;

    color: #ffffff !important;
    letter-spacing: -0.25px !important;

    transition: color 0.3s ease !important;
}

section.sec-wash .bz-acc-i p {
    margin: 0 !important;

    font-size: 14px !important;
    line-height: 1.6 !important;

    color: #b9c0b2 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec-wash .bz-acc-i:hover {
    transform: translateY(-7px) !important;

    background: #171c0f !important;

    border-color: rgba(152, 219, 28, 0.65) !important;

    box-shadow:
        0 18px 40px rgba(0, 0, 0, 0.38),
        0 0 30px rgba(152, 219, 28, 0.10) !important;
}

section.sec-wash .bz-acc-i:hover::after {
    opacity: 1 !important;

    box-shadow:
        0 0 12px rgba(152, 219, 28, 0.65),
        0 0 25px rgba(152, 219, 28, 0.25) !important;
}

section.sec-wash .bz-acc-i:hover .bz-acc-ic {
    background: rgba(152, 219, 28, 0.17) !important;
    border-color: rgba(152, 219, 28, 0.55) !important;

    transform: translateY(-2px) scale(1.04) !important;

    box-shadow:
        0 0 20px rgba(152, 219, 28, 0.15) !important;
}

section.sec-wash .bz-acc-i:hover b {
    color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec-wash .bz-acc {
        grid-template-columns: 1fr !important;
        max-width: 700px !important;
    }

    section.sec-wash .bz-acc-i {
        min-height: auto !important;
    }
}

/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 640px) {

    section.sec-wash {
        padding: 60px 16px !important;
    }

    section.sec-wash .bz-head {
        margin-bottom: 35px !important;
    }

    section.sec-wash .bz-head h2 {
        font-size: 1.8rem !important;
        line-height: 1.2 !important;
    }

    section.sec-wash .bz-head p {
        font-size: 0.95rem !important;
    }

    section.sec-wash .bz-acc {
        gap: 15px !important;
    }

    section.sec-wash .bz-acc-i {
        gap: 15px !important;
        padding: 22px 20px !important;
        border-radius: 14px !important;
    }

    section.sec-wash .bz-acc-ic {
        flex: 0 0 45px !important;
        width: 45px !important;
        height: 45px !important;
        border-radius: 12px !important;
    }

    section.sec-wash .bz-acc-ic svg {
        width: 22px !important;
        height: 22px !important;
    }

    section.sec-wash .bz-acc-i b {
        font-size: 16px !important;
        margin-bottom: 7px !important;
    }

    section.sec-wash .bz-acc-i p {
        font-size: 13px !important;
        line-height: 1.55 !important;
    }

    section.sec-wash .bz-acc-i::after {
        top: 20px !important;
        bottom: 20px !important;
    }
}

/* ==========================================================================
   МНОГО МАЛЪК ЕКРАН
   ========================================================================== */

@media (max-width: 420px) {

    section.sec-wash .bz-acc-i {
        padding: 20px 17px !important;
        gap: 13px !important;
    }

    section.sec-wash .bz-acc-ic {
        flex-basis: 42px !important;
        width: 42px !important;
        height: 42px !important;
    }

    section.sec-wash .bz-acc-i b {
        font-size: 15px !important;
    }

    section.sec-wash .bz-acc-i p {
        font-size: 12.5px !important;
    }
}


/*biznes-hosting/Отсреща има човек*/


/* ==========================================================================
   SUPPORT SECTION — LIGHT & INTERACTIVE
   Работи само със .bz-sup
   ========================================================================== */

section.sec:has(.bz-sup) {
    background: #f7f9f4 !important;
    padding: 90px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

section.sec:has(.bz-sup) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup {
    position: relative !important;

    display: grid !important;
    grid-template-columns: 0.95fr 1.05fr !important;
    gap: 55px !important;
    align-items: center !important;

    max-width: 1100px !important;
    margin: 0 auto !important;

    padding: 55px !important;

    background: #ffffff !important;
    border: 1px solid #e5eadf !important;
    border-radius: 24px !important;

    box-shadow:
        0 20px 50px rgba(40, 55, 25, 0.08),
        0 4px 12px rgba(40, 55, 25, 0.04) !important;

    overflow: hidden !important;
}

/* Декоративен зелен glow */
section.sec:has(.bz-sup) .bz-sup::before {
    content: "" !important;

    position: absolute !important;
    width: 300px !important;
    height: 300px !important;

    top: -180px !important;
    right: -100px !important;

    background: rgba(152, 219, 28, 0.13) !important;
    border-radius: 50% !important;
    filter: blur(10px) !important;

    pointer-events: none !important;
}

/* Малък декоративен glow долу */
section.sec:has(.bz-sup) .bz-sup::after {
    content: "" !important;

    position: absolute !important;
    width: 180px !important;
    height: 180px !important;

    bottom: -130px !important;
    left: -80px !important;

    background: rgba(152, 219, 28, 0.07) !important;
    border-radius: 50% !important;
    filter: blur(15px) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ЛЯВА ЧАСТ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup > div:first-child {
    position: relative !important;
    z-index: 2 !important;
}

section.sec:has(.bz-sup) .bz-sup h2 {
    margin: 0 0 15px 0 !important;

    font-size: 2.35rem !important;
    line-height: 1.15 !important;
    font-weight: 750 !important;

    color: #18210f !important;
    letter-spacing: -0.8px !important;
}

section.sec:has(.bz-sup) .bz-sup h2::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 4px !important;

    margin-top: 18px !important;

    background: #7cbf00 !important;
    border-radius: 10px !important;
}

section.sec:has(.bz-sup) .bz-sup > div:first-child > p {
    max-width: 500px !important;

    margin: 20px 0 32px 0 !important;

    font-size: 16px !important;
    line-height: 1.65 !important;

    color: #66705f !important;
}

/* ==========================================================================
   СТАТИСТИКИ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup-nums {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;

    max-width: 480px !important;
}

section.sec:has(.bz-sup) .bz-sup-n {
    position: relative !important;

    padding: 19px 20px !important;

    background: #f7f9f4 !important;

    border: 1px solid #e4eadc !important;
    border-radius: 14px !important;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease !important;
}

section.sec:has(.bz-sup) .bz-sup-n::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 15px !important;
    bottom: 15px !important;

    width: 3px !important;

    background: #7cbf00 !important;
    border-radius: 0 4px 4px 0 !important;
}

section.sec:has(.bz-sup) .bz-sup-n:hover {
    transform: translateY(-4px) !important;

    background: #ffffff !important;
    border-color: rgba(152, 219, 28, 0.45) !important;

    box-shadow:
        0 10px 25px rgba(80, 110, 45, 0.09) !important;
}

section.sec:has(.bz-sup) .bz-sup-n b {
    display: block !important;

    margin-bottom: 5px !important;

    font-size: 22px !important;
    font-weight: 800 !important;

    color: #305a08 !important;
    letter-spacing: -0.4px !important;
}

section.sec:has(.bz-sup) .bz-sup-n span {
    display: block !important;

    font-size: 12px !important;
    line-height: 1.4 !important;

    color: #7a8374 !important;
}

/* ==========================================================================
   ДЯСНА ЧАСТ — НАЧИНИ ЗА КОНТАКТ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup-ways {
    position: relative !important;
    z-index: 2 !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

/* Карта */
section.sec:has(.bz-sup) .bz-sup-w {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    min-height: 155px !important;
    padding: 21px !important;

    background: #ffffff !important;

    border: 1px solid #e4e9df !important;
    border-radius: 16px !important;

    box-shadow:
        0 5px 15px rgba(40, 55, 25, 0.04) !important;

    transition:
        transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1),
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease !important;

    overflow: hidden !important;
}

/* Малък зелен индикатор */
section.sec:has(.bz-sup) .bz-sup-w::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: #7cbf00 !important;

    transform: scaleX(0) !important;
    transform-origin: left !important;

    transition: transform 0.35s ease !important;
}

/* Hover */
section.sec:has(.bz-sup) .bz-sup-w:hover {
    transform: translateY(-7px) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    background: #fbfdf9 !important;

    box-shadow:
        0 15px 30px rgba(55, 80, 30, 0.10),
        0 0 0 4px rgba(152, 219, 28, 0.045) !important;
}

section.sec:has(.bz-sup) .bz-sup-w:hover::before {
    transform: scaleX(1) !important;
}

/* ==========================================================================
   ИКОНИ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup-w-ic {
    width: 45px !important;
    height: 45px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 16px !important;

    color: #4f8d0c !important;

    background: #f0f7e9 !important;
    border: 1px solid #dcebcf !important;

    border-radius: 12px !important;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        color 0.3s ease,
        box-shadow 0.3s ease !important;
}

section.sec:has(.bz-sup) .bz-sup-w-ic svg {
    width: 22px !important;
    height: 22px !important;
}

section.sec:has(.bz-sup) .bz-sup-w:hover .bz-sup-w-ic {
    transform: scale(1.08) rotate(-3deg) !important;

    background: #7cbf00 !important;
    color: #20300f !important;

    box-shadow:
        0 6px 16px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   ЗАГЛАВИЯ НА КОНТАКТИТЕ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup-w b {
    display: block !important;

    margin-bottom: 5px !important;

    font-size: 16px !important;
    font-weight: 750 !important;

    color: #1d2617 !important;

    transition: color 0.3s ease !important;
}

section.sec:has(.bz-sup) .bz-sup-w:hover b {
    color: #4f8d0c !important;
}

/* Вторичен текст */
section.sec:has(.bz-sup) .bz-sup-w > span:last-child {
    font-size: 12px !important;
    color: #7a8374 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 950px) {

    section.sec:has(.bz-sup) .bz-sup {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
        padding: 45px !important;
    }

    section.sec:has(.bz-sup) .bz-sup > div:first-child > p {
        max-width: 650px !important;
    }

    section.sec:has(.bz-sup) .bz-sup-nums {
        max-width: 600px !important;
    }

    section.sec:has(.bz-sup) .bz-sup-ways {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    section.sec:has(.bz-sup) .bz-sup-w {
        min-height: 160px !important;
    }
}

/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 700px) {

    section.sec:has(.bz-sup) {
        padding: 60px 16px !important;
    }

    section.sec:has(.bz-sup) .bz-sup {
        padding: 30px 22px !important;
        border-radius: 20px !important;
        gap: 32px !important;
    }

    section.sec:has(.bz-sup) .bz-sup h2 {
        font-size: 1.9rem !important;
    }

    section.sec:has(.bz-sup) .bz-sup > div:first-child > p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    section.sec:has(.bz-sup) .bz-sup-nums {
        grid-template-columns: 1fr 1fr !important;
    }

    section.sec:has(.bz-sup) .bz-sup-ways {
        grid-template-columns: 1fr 1fr !important;
    }

    section.sec:has(.bz-sup) .bz-sup-w {
        min-height: 145px !important;
        padding: 18px !important;
    }
}

/* ==========================================================================
   МНОГО МАЛЪК ТЕЛЕФОН
   ========================================================================== */

@media (max-width: 430px) {

    section.sec:has(.bz-sup) .bz-sup {
        padding: 26px 18px !important;
    }

    section.sec:has(.bz-sup) .bz-sup h2 {
        font-size: 1.7rem !important;
    }

    section.sec:has(.bz-sup) .bz-sup-nums {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.bz-sup) .bz-sup-ways {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.bz-sup) .bz-sup-w {
        min-height: auto !important;
    }
}


/*Имаш сайт и поща другаде?biznes-hosting/ */


/* ==========================================================================
   СЕКЦИЯ "ПРЕНАСЯНЕ" — СВЕТЪЛ И ИНТЕРАКТИВЕН ДИЗАЙН
   ========================================================================== */

#move {
    background: #fafafa !important;
    padding: 80px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

#move .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* Основен контейнер */
#move .bz-move {
    display: grid !important;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) !important;
    gap: 70px !important;
    align-items: center !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 24px !important;
    padding: 55px !important;
    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.04),
        0 2px 8px rgba(0, 0, 0, 0.03) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Декоративно зелено сияние */
#move .bz-move::before {
    content: "" !important;
    position: absolute !important;
    width: 300px !important;
    height: 300px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.08) !important;
    filter: blur(60px) !important;
    top: -160px !important;
    left: -120px !important;
    pointer-events: none !important;
}

#move .bz-move::after {
    content: "" !important;
    position: absolute !important;
    width: 260px !important;
    height: 260px !important;
    border-radius: 50% !important;
    background: rgba(105, 201, 14, 0.06) !important;
    filter: blur(60px) !important;
    bottom: -150px !important;
    right: -100px !important;
    pointer-events: none !important;
}

/* Лява част */
#move .bz-move > div:first-child {
    position: relative !important;
    z-index: 2 !important;
}

#move .bz-move h2 {
    font-size: clamp(28px, 3vw, 40px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    color: #111827 !important;
    margin: 0 0 18px 0 !important;
}

#move .bz-move h2::after {
    content: "" !important;
    display: block !important;
    width: 48px !important;
    height: 4px !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    margin-top: 18px !important;
}

#move .bz-move > div:first-child > p {
    font-size: 16px !important;
    line-height: 1.7 !important;
    color: #4b5563 !important;
    margin: 0 0 25px 0 !important;
    max-width: 520px !important;
}

/* Зелената гаранция */
#move .bz-move-safe {
    background: linear-gradient(
        135deg,
        #f3fbe7 0%,
        #f8fdf2 100%
    ) !important;
    border: 1px solid rgba(152, 219, 28, 0.3) !important;
    border-left: 4px solid #7cbf00 !important;
    border-radius: 12px !important;
    padding: 17px 19px !important;
    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    box-shadow: 0 5px 15px rgba(105, 201, 14, 0.06) !important;
}

#move .bz-move-safe b {
    color: #305a08 !important;
    font-weight: 800 !important;
}


/* ==========================================================================
   СТЪПКИ
   ========================================================================== */

#move .bz-move-steps {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Карта на стъпка */
#move .bz-move-s {
    min-height: 145px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 16px !important;
    padding: 22px !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 15px !important;
    position: relative !important;
    overflow: hidden !important;
    cursor: default !important;
    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease !important;
}

/* Малък зелен акцент */
#move .bz-move-s::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 3px !important;
    background: #7cbf00 !important;
    transform: scaleY(0) !important;
    transform-origin: bottom !important;
    transition: transform 0.3s ease !important;
}

/* Hover */
#move .bz-move-s:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.45) !important;
    background: #fbfff7 !important;
    box-shadow:
        0 15px 30px rgba(105, 201, 14, 0.10),
        0 3px 8px rgba(0, 0, 0, 0.04) !important;
}

#move .bz-move-s:hover::before {
    transform: scaleY(1) !important;
}


/* Номер */
#move .bz-move-n {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #f0f9df !important;
    border: 1px solid rgba(152, 219, 28, 0.35) !important;
    color: #305a08 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

#move .bz-move-s:hover .bz-move-n {
    background: #7cbf00 !important;
    color: #1f2d0c !important;
    transform: scale(1.08) !important;
}


/* Текст */
#move .bz-move-t {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

#move .bz-move-t b {
    font-size: 16px !important;
    line-height: 1.3 !important;
    color: #111827 !important;
    font-weight: 750 !important;
    transition: color 0.3s ease !important;
}

#move .bz-move-s:hover .bz-move-t b {
    color: #305a08 !important;
}

#move .bz-move-t > span {
    font-size: 13px !important;
    line-height: 1.55 !important;
    color: #6b7280 !important;
}


/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 1000px) {

    #move .bz-move {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
        padding: 40px !important;
    }

    #move .bz-move > div:first-child > p {
        max-width: 700px !important;
    }
}

@media (max-width: 650px) {

    #move {
        padding: 55px 15px !important;
    }

    #move .bz-move {
        padding: 28px 20px !important;
        border-radius: 18px !important;
        gap: 30px !important;
    }

    #move .bz-move h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    #move .bz-move-steps {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    #move .bz-move-s {
        min-height: auto !important;
        padding: 18px !important;
    }

    #move .bz-move-n {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
    }
}


/* Малко по-спокойно движение за хора,
   които са изключили анимациите */
@media (prefers-reduced-motion: reduce) {
    #move .bz-move-s,
    #move .bz-move-n,
    #move .bz-move-s::before {
        transition: none !important;
    }

    #move .bz-move-s:hover {
        transform: none !important;
    }
}


/*Кой план ми трябва?biznes-hosting/*/



/* ==========================================================================
   СЕКЦИЯ "КОЙ ПЛАН МИ ТРЯБВА?" — СВЕТЪЛ PREMIUM ДИЗАЙН
   ========================================================================== */

section.sec.sec-wash .bz-head {
    text-align: center !important;
    max-width: 760px !important;
    margin: 0 auto 48px auto !important;
}

section.sec.sec-wash .bz-head h2 {
    font-size: clamp(30px, 3vw, 40px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    color: #111827 !important;
    margin: 0 0 14px 0 !important;
}

section.sec.sec-wash .bz-head p {
    font-size: 16px !important;
    line-height: 1.65 !important;
    color: #6b7280 !important;
    margin: 0 !important;
}


/* ==========================================================================
   КАРТИ
   ========================================================================== */

section.sec.sec-wash .bz-cases {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
    margin: 0 0 35px 0 !important;
}

section.sec.sec-wash .bz-case {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    padding: 30px !important;
    min-height: 285px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    overflow: hidden !important;

    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.035),
        0 2px 6px rgba(0, 0, 0, 0.025) !important;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease !important;
}


/* Светъл декоративен ореол */
section.sec.sec-wash .bz-case::after {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.07) !important;
    filter: blur(45px) !important;
    right: -100px !important;
    top: -100px !important;
    pointer-events: none !important;
    opacity: 0 !important;
    transition: opacity 0.35s ease !important;
}


/* Зелената линия отляво */
section.sec.sec-wash .bz-case::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 4px !important;
    background: #7cbf00 !important;
    transform: scaleY(0) !important;
    transform-origin: bottom !important;
    transition: transform 0.3s ease !important;
}


/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec.sec-wash .bz-case-ic {
    width: 52px !important;
    height: 52px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #f1f9e4 !important;
    border: 1px solid rgba(152, 219, 28, 0.28) !important;
    border-radius: 14px !important;

    color: #5a8d13 !important;

    margin-bottom: 22px !important;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease !important;

    position: relative !important;
    z-index: 2 !important;
}

section.sec.sec-wash .bz-case-ic svg {
    width: 24px !important;
    height: 24px !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec.sec-wash .bz-case h3 {
    font-size: 19px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
    color: #111827 !important;

    margin: 0 0 12px 0 !important;

    position: relative !important;
    z-index: 2 !important;

    transition: color 0.3s ease !important;
}


/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

section.sec.sec-wash .bz-case > p {
    font-size: 14px !important;
    line-height: 1.65 !important;
    color: #6b7280 !important;

    margin: 0 0 24px 0 !important;

    flex-grow: 1 !important;

    position: relative !important;
    z-index: 2 !important;
}


/* ==========================================================================
   ДОЛЕН ЕТИКЕТ
   ========================================================================== */

section.sec.sec-wash .bz-case-p {
    display: inline-flex !important;
    align-items: center !important;

    background: #f7faf2 !important;
    border: 1px solid #e4edd4 !important;

    border-radius: 8px !important;
    padding: 9px 13px !important;

    color: #6b7280 !important;
    font-size: 13px !important;
    font-weight: 600 !important;

    position: relative !important;
    z-index: 2 !important;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease !important;
}

section.sec.sec-wash .bz-case-p b {
    color: #305a08 !important;
    font-weight: 800 !important;
    margin-left: 4px !important;
}


/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec.sec-wash .bz-case:hover {
    transform: translateY(-8px) !important;

    border-color: rgba(152, 219, 28, 0.45) !important;

    background: #ffffff !important;

    box-shadow:
        0 20px 40px rgba(105, 201, 14, 0.10),
        0 5px 12px rgba(0, 0, 0, 0.04) !important;
}

section.sec.sec-wash .bz-case:hover::before {
    transform: scaleY(1) !important;
}

section.sec.sec-wash .bz-case:hover::after {
    opacity: 1 !important;
}

section.sec.sec-wash .bz-case:hover .bz-case-ic {
    background: #7cbf00 !important;
    color: #243507 !important;

    transform: translateY(-2px) scale(1.04) !important;

    box-shadow:
        0 8px 18px rgba(152, 219, 28, 0.22) !important;
}

section.sec.sec-wash .bz-case:hover h3 {
    color: #305a08 !important;
}

section.sec.sec-wash .bz-case:hover .bz-case-p {
    background: #f0f9df !important;
    border-color: rgba(152, 219, 28, 0.35) !important;
    color: #4b5563 !important;
}


/* ==========================================================================
   ТЕКСТ "НЕ СИ СИГУРЕН?"
   ========================================================================== */

section.sec.sec-wash .bz-ask {
    text-align: center !important;

    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #6b7280 !important;

    max-width: 800px !important;
    margin: 0 auto !important;
}

section.sec.sec-wash .bz-ask a {
    color: #4f8010 !important;
    font-weight: 700 !important;
    text-decoration: none !important;

    border-bottom: 1px solid rgba(79, 128, 16, 0.3) !important;

    transition:
        color 0.2s ease,
        border-color 0.2s ease !important;
}

section.sec.sec-wash .bz-ask a:hover {
    color: #305a08 !important;
    border-color: #305a08 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 950px) {

    section.sec.sec-wash .bz-cases {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec.sec-wash .bz-case:last-child {
        grid-column: 1 / -1 !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec.sec-wash .bz-head {
        margin-bottom: 32px !important;
    }

    section.sec.sec-wash .bz-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec.sec-wash .bz-head p {
        font-size: 15px !important;
    }

    section.sec.sec-wash .bz-cases {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    section.sec.sec-wash .bz-case:last-child {
        grid-column: auto !important;
    }

    section.sec.sec-wash .bz-case {
        min-height: auto !important;
        padding: 24px !important;
        border-radius: 15px !important;
    }

    section.sec.sec-wash .bz-case-ic {
        width: 48px !important;
        height: 48px !important;
        margin-bottom: 18px !important;
    }

    section.sec.sec-wash .bz-case h3 {
        font-size: 18px !important;
    }
}


/* ==========================================================================
   ACCESSIBILITY — БЕЗ АНИМАЦИИ ПРИ НАСТРОЙКА REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec.sec-wash .bz-case,
    section.sec.sec-wash .bz-case-ic,
    section.sec.sec-wash .bz-case::before,
    section.sec.sec-wash .bz-case::after {
        transition: none !important;
    }

    section.sec.sec-wash .bz-case:hover {
        transform: none !important;
    }
}
/*reseller-hosting/Клиентът ти вижда теб, не нас*/



/* ==========================================================================
   WHITE-LABEL СЕКЦИЯ — "Клиентът ти вижда теб, не нас"
   Светъл, модерен и интерактивен дизайн
   ========================================================================== */

section.sec:has(.rs-white) {
    background: #f8faf6 !important;
    padding: 90px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

section.sec:has(.rs-white) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВНА ЧАСТ
   ========================================================================== */

section.sec:has(.rs-white) .rs-head {
    max-width: 760px !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section.sec:has(.rs-white) .rs-head h2 {
    margin: 0 0 14px !important;
    color: #17210f !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1.2px !important;
}

section.sec:has(.rs-white) .rs-head p {
    margin: 0 !important;
    color: #64705f !important;
    font-size: 17px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   ОСНОВЕН LAYOUT
   ========================================================================== */

section.sec:has(.rs-white) .rs-white {
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr) !important;
    gap: 55px !important;
    align-items: center !important;
}

/* ==========================================================================
   DASHBOARD MOCKUP
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-box {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #dfe8d8 !important;
    border-radius: 18px !important;
    padding: 0 !important;
    overflow: hidden !important;

    box-shadow:
        0 25px 60px rgba(35, 55, 25, 0.10),
        0 8px 20px rgba(35, 55, 25, 0.06) !important;

    transform: perspective(1200px) rotateY(0deg) rotateX(0deg) !important;
    transition:
        transform .45s ease,
        box-shadow .45s ease,
        border-color .45s ease !important;
}

/* Леко повдигане при hover */

section.sec:has(.rs-white) .rs-white-box:hover {
    transform: translateY(-8px) !important;

    border-color: rgba(152, 219, 28, .65) !important;

    box-shadow:
        0 35px 75px rgba(48, 90, 8, .14),
        0 10px 25px rgba(152, 219, 28, .08) !important;
}

/* Светещ декоративен ореол */

section.sec:has(.rs-white) .rs-white-box::after {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    right: -90px !important;
    bottom: -90px !important;
    background: rgba(152, 219, 28, .12) !important;
    border-radius: 50% !important;
    filter: blur(10px) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   BROWSER BAR
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-bar {
    height: 54px !important;
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 0 18px !important;

    background: #f4f7f1 !important;
    border-bottom: 1px solid #e2e9de !important;
}

/* Browser dots */

section.sec:has(.rs-white) .rs-white-dots {
    display: flex !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
}

section.sec:has(.rs-white) .rs-white-dots i {
    width: 9px !important;
    height: 9px !important;
    border-radius: 50% !important;
    background: #cbd5c5 !important;
    display: block !important;
}

section.sec:has(.rs-white) .rs-white-dots i:first-child {
    background: #7cbf00 !important;
}

section.sec:has(.rs-white) .rs-white-url {
    flex: 1 !important;
    min-width: 0 !important;

    padding: 8px 14px !important;
    border-radius: 8px !important;

    background: #ffffff !important;
    border: 1px solid #e2e8df !important;

    color: #7b8577 !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

section.sec:has(.rs-white) .rs-white-url b {
    color: #305a08 !important;
}

/* ==========================================================================
   DASHBOARD BODY
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-body {
    padding: 30px !important;
    background: #ffffff !important;
}

/* Logo */

section.sec:has(.rs-white) .rs-white-logo {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 28px !important;
}

section.sec:has(.rs-white) .rs-white-mark {
    width: 44px !important;
    height: 44px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    background: linear-gradient(
        135deg,
        #7cbf00,
        #69c90e
    ) !important;

    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;

    box-shadow: 0 7px 18px rgba(105, 201, 14, .22) !important;
}

section.sec:has(.rs-white) .rs-white-name {
    color: #1d2719 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   DASHBOARD ROWS
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-rows {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

section.sec:has(.rs-white) .rs-white-r {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;

    padding: 15px 16px !important;

    background: #f8faf7 !important;
    border: 1px solid #e7eee3 !important;
    border-radius: 10px !important;

    color: #667060 !important;
    font-size: 13px !important;

    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease !important;
}

section.sec:has(.rs-white) .rs-white-r:hover {
    transform: translateX(5px) !important;
    background: #f3f9ed !important;
    border-color: rgba(152, 219, 28, .45) !important;
}

section.sec:has(.rs-white) .rs-white-r b {
    color: #305a08 !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   ДЯСНА КОЛОНА — FEATURE CARDS
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-l {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

section.sec:has(.rs-white) .rs-white-i {
    position: relative !important;

    display: flex !important;
    align-items: flex-start !important;
    gap: 16px !important;

    padding: 20px !important;

    background: #ffffff !important;
    border: 1px solid #e2e9de !important;
    border-radius: 14px !important;

    box-shadow: 0 5px 18px rgba(35, 55, 25, .045) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}

/* Hover */

section.sec:has(.rs-white) .rs-white-i:hover {
    transform: translateX(7px) !important;

    background: #fbfef9 !important;

    border-color: rgba(152, 219, 28, .55) !important;

    box-shadow:
        0 12px 28px rgba(48, 90, 8, .09),
        0 0 0 3px rgba(152, 219, 28, .05) !important;
}

/* ==========================================================================
   ICONS
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-ic {
    width: 46px !important;
    height: 46px !important;

    flex: 0 0 46px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 12px !important;

    background: #f0f8e8 !important;
    color: #5da80b !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.rs-white) .rs-white-i:hover .rs-white-ic {
    background: #7cbf00 !important;
    color: #ffffff !important;
    transform: scale(1.08) rotate(-3deg) !important;
}

section.sec:has(.rs-white) .rs-white-ic svg {
    width: 21px !important;
    height: 21px !important;
}

/* ==========================================================================
   TEXT
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-i > span:last-child {
    display: block !important;
    min-width: 0 !important;
}

section.sec:has(.rs-white) .rs-white-i b {
    display: block !important;
    margin: 1px 0 6px !important;

    color: #1d2719 !important;

    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;

    transition: color .25s ease !important;
}

section.sec:has(.rs-white) .rs-white-i:hover b {
    color: #4f8d0b !important;
}

section.sec:has(.rs-white) .rs-white-i p {
    margin: 0 !important;

    color: #6b7567 !important;

    font-size: 13px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   ДЕКОРАТИВЕН АКЦЕНТ ПОД СЕКЦИЯТА
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-l::before {
    content: "WHITE-LABEL" !important;

    display: inline-flex !important;
    align-self: flex-start !important;

    margin-bottom: 4px !important;
    padding: 6px 10px !important;

    border-radius: 999px !important;

    background: #edf7e4 !important;
    color: #5b940e !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 1px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.rs-white) {
        padding: 70px 20px !important;
    }

    section.sec:has(.rs-white) .rs-white {
        grid-template-columns: 1fr !important;
        gap: 35px !important;
    }

    section.sec:has(.rs-white) .rs-white-l {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec:has(.rs-white) .rs-white-l::before {
        grid-column: 1 / -1 !important;
    }
}

/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.rs-white) {
        padding: 60px 16px !important;
    }

    section.sec:has(.rs-white) .rs-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.rs-white) .rs-head h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.rs-white) .rs-head p {
        font-size: 15px !important;
    }

    section.sec:has(.rs-white) .rs-white-l {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.rs-white) .rs-white-body {
        padding: 20px !important;
    }

    section.sec:has(.rs-white) .rs-white-bar {
        padding: 0 12px !important;
    }

    section.sec:has(.rs-white) .rs-white-url {
        font-size: 10px !important;
        padding: 7px 9px !important;
    }

    section.sec:has(.rs-white) .rs-white-r {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 5px !important;
    }

    section.sec:has(.rs-white) .rs-white-i {
        padding: 17px !important;
    }
}

/* ==========================================================================
   ACCESSIBILITY — REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.rs-white) *,
    section.sec:has(.rs-white) *::before,
    section.sec:has(.rs-white) *::after {
        transition: none !important;
        transform: none !important;
    }
}


/*reseller-hosting/Препродажбата не е за всеки*/


/* ==========================================================================
   СЕКЦИЯ "ПРЕПРОДАЖБАТА НЕ Е ЗА ВСЕКИ"
   ТЪМЕН PREMIUM / INTERACTIVE DESIGN
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) {
    background:
        radial-gradient(circle at 15% 20%, rgba(152, 219, 28, 0.07), transparent 30%),
        radial-gradient(circle at 85% 75%, rgba(152, 219, 28, 0.05), transparent 30%),
        #0d100a !important;

    padding: 95px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;

    position: relative !important;
    overflow: hidden !important;
}

/* Декоративна светлина */

section.sec.sec-wash:has(.rs-vs)::before {
    content: "" !important;
    position: absolute !important;

    width: 500px !important;
    height: 500px !important;

    top: -250px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    background: rgba(152, 219, 28, 0.055) !important;
    border-radius: 50% !important;
    filter: blur(80px) !important;

    pointer-events: none !important;
}

/* Контейнер */

section.sec.sec-wash:has(.rs-vs) .wrap-w {
    max-width: 1120px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 1 !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-head {
    max-width: 760px !important;
    margin: 0 auto 58px !important;
    text-align: center !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-head h2 {
    margin: 0 0 16px !important;

    color: #ffffff !important;
    font-size: clamp(31px, 4vw, 46px) !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    letter-spacing: -1.3px !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-head p {
    margin: 0 !important;

    color: #aab3a4 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   ДВЕТЕ КАРТИ
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
}

/* Основна карта */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    padding: 32px !important;

    background: #151a11 !important;
    border: 1px solid #293225 !important;
    border-radius: 18px !important;

    box-shadow:
        0 18px 45px rgba(0, 0, 0, .30),
        inset 0 1px 0 rgba(255,255,255,.025) !important;

    overflow: hidden !important;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease !important;
}

/* Горен декоративен слой */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: #30382b !important;
}

/* Hover */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i:hover {
    transform: translateY(-7px) !important;

    border-color: #3b4932 !important;

    background: #181e14 !important;

    box-shadow:
        0 25px 55px rgba(0, 0, 0, .42) !important;
}

/* ==========================================================================
   ПРЕПРОДАЖБА — АКЦЕНТИРАНА КАРТА
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i.is-this {
    background:
        linear-gradient(
            145deg,
            #19200f 0%,
            #12170e 55%,
            #10140c 100%
        ) !important;

    border-color: rgba(152, 219, 28, .35) !important;

    box-shadow:
        0 20px 55px rgba(0, 0, 0, .38),
        0 0 35px rgba(152, 219, 28, .055),
        inset 0 1px 0 rgba(152, 219, 28, .06) !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-vs-i.is-this::before {
    background: linear-gradient(
        90deg,
        #69c90e,
        #7cbf00,
        #69c90e
    ) !important;
}

/* Glow около препродажбата */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i.is-this::after {
    content: "" !important;

    position: absolute !important;

    width: 180px !important;
    height: 180px !important;

    top: -90px !important;
    right: -90px !important;

    background: rgba(152, 219, 28, .09) !important;
    border-radius: 50% !important;

    filter: blur(35px) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   CARD HEADER
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 15px !important;

    margin-bottom: 28px !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-vs-h b {
    color: #ffffff !important;

    font-size: 21px !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    letter-spacing: -.4px !important;
}

/* ==========================================================================
   BADGES
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .pill {
    display: inline-flex !important;
    align-items: center !important;

    padding: 6px 11px !important;

    border-radius: 999px !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .6px !important;
    text-transform: uppercase !important;

    white-space: nowrap !important;
}

/* Препродажба */

section.sec.sec-wash:has(.rs-vs) .pill.p-rose {
    background: rgba(152, 219, 28, .13) !important;
    border: 1px solid rgba(152, 219, 28, .25) !important;
    color: #a8e33d !important;

    box-shadow: 0 0 15px rgba(152, 219, 28, .08) !important;
}

/* Бизнес хостинг */

section.sec.sec-wash:has(.rs-vs) .pill.p-muted {
    background: #20261d !important;
    border: 1px solid #323a2f !important;
    color: #9ca596 !important;
}

/* ==========================================================================
   LIST
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-l {
    list-style: none !important;

    padding: 0 !important;
    margin: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 17px !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-vs-l li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 13px !important;

    color: #9fa89a !important;

    font-size: 14px !important;
    line-height: 1.6 !important;
}

/* Bold */

section.sec.sec-wash:has(.rs-vs) .rs-vs-l li b {
    color: #e7ebe4 !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   YES / NO ИКОНИ
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-d {
    width: 27px !important;
    height: 27px !important;

    flex: 0 0 27px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-top: 1px !important;

    border-radius: 50% !important;
}

/* Check */

section.sec.sec-wash:has(.rs-vs) .rs-d.yes {
    background: rgba(152, 219, 28, .11) !important;
    border: 1px solid rgba(152, 219, 28, .23) !important;
    color: #7cbf00 !important;
}

/* X */

section.sec.sec-wash:has(.rs-vs) .rs-d.no {
    background: rgba(255, 255, 255, .035) !important;
    border: 1px solid #343a32 !important;
    color: #737b70 !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-d svg {
    width: 14px !important;
    height: 14px !important;
}

/* ==========================================================================
   HOVER НА CHECK ИКОНИТЕ
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i:hover .rs-d.yes {
    background: #7cbf00 !important;
    color: #10150b !important;

    box-shadow: 0 0 16px rgba(152, 219, 28, .18) !important;
}

/* ==========================================================================
   CTA
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-go {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    margin-top: 28px !important;
    padding: 13px 18px !important;

    border-radius: 10px !important;

    background: transparent !important;
    border: 1px solid #3b4636 !important;

    color: #cbd2c6 !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    text-decoration: none !important;

    transition:
        background .3s ease,
        border-color .3s ease,
        color .3s ease,
        transform .3s ease,
        box-shadow .3s ease !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-vs-go:hover {
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;

    color: #10150b !important;

    transform: translateY(-2px) !important;

    box-shadow: 0 10px 25px rgba(152, 219, 28, .16) !important;
}

/* ==========================================================================
   ЛЕКА ВИЗУАЛНА РАЗДЕЛИТЕЛНА ЛИНИЯ
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs::before {
    content: "ИЛИ" !important;

    position: absolute !important;

    left: 50% !important;
    transform: translate(-50%, -50%) !important;

    margin-top: 220px !important;

    z-index: 5 !important;

    width: 38px !important;
    height: 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 50% !important;

    background: #11150e !important;
    border: 1px solid #30382b !important;

    color: #687160 !important;

    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: .5px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec.sec-wash:has(.rs-vs) {
        padding: 75px 20px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs::before {
        display: none !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec.sec-wash:has(.rs-vs) {
        padding: 60px 16px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-head {
        margin-bottom: 38px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-head h2 {
        font-size: 30px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs-i {
        padding: 24px 20px !important;
        border-radius: 15px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs-h {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 10px !important;
        margin-bottom: 23px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs-h b {
        font-size: 19px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs-l li {
        font-size: 13px !important;
        gap: 10px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-d {
        width: 25px !important;
        height: 25px !important;
        flex-basis: 25px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec.sec-wash:has(.rs-vs) *,
    section.sec.sec-wash:has(.rs-vs) *::before,
    section.sec.sec-wash:has(.rs-vs) *::after {
        transition: none !important;
        transform: none !important;
    }
}


/*Кой отговаря на клиента ти reseller-hosting/*/


/* ==========================================================================
   СЕКЦИЯ „КОЙ ОТГОВАРЯ НА КЛИЕНТА ТИ“ — СВЕТЪЛ ИНТЕРАКТИВЕН ДИЗАЙН
   ========================================================================== */

/* Основна секция */
section.sec:has(.rs-who) {
    background: #fafafa !important;
    padding: 80px 20px !important;
}

/* Контейнер */
section.sec:has(.rs-who) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* Заглавна част */
section.sec:has(.rs-who) .rs-head {
    max-width: 720px !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section.sec:has(.rs-who) .rs-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.rs-who) .rs-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}


/* ==========================================================================
   ДВЕТЕ ОСНОВНИ КАРТИ
   ========================================================================== */

.rs-who {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
}


/* Основна карта */
.rs-who .rs-who-i {
    position: relative !important;
    padding: 30px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    box-shadow:
        0 4px 12px rgba(17, 24, 39, 0.04),
        0 1px 3px rgba(17, 24, 39, 0.03) !important;
    overflow: hidden !important;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease !important;
}


/* Малък декоративен светъл фон */
.rs-who .rs-who-i::before {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    top: -100px !important;
    right: -80px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.08) !important;
    pointer-events: none !important;
    transition: transform 0.4s ease !important;
}


/* Hover */
.rs-who .rs-who-i:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow:
        0 18px 40px rgba(17, 24, 39, 0.08),
        0 5px 15px rgba(152, 219, 28, 0.08) !important;
}

.rs-who .rs-who-i:hover::before {
    transform: scale(1.35) !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

.rs-who .rs-who-h {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin-bottom: 25px !important;
    position: relative !important;
    z-index: 1 !important;
}

.rs-who .rs-who-h b {
    color: #111827 !important;
    font-size: 20px !important;
    font-weight: 750 !important;
    letter-spacing: -0.3px !important;
}


/* Иконка */
.rs-who .rs-who-ic {
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: #f1f8e8 !important;
    color: #4d7d0b !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    transition: all 0.3s ease !important;
}

.rs-who .rs-who-ic svg {
    width: 22px !important;
    height: 22px !important;
}

.rs-who .rs-who-i:hover .rs-who-ic {
    background: #7cbf00 !important;
    color: #ffffff !important;
    border-color: #7cbf00 !important;
    transform: scale(1.06) !important;
}


/* ==========================================================================
   СПИСЪК
   ========================================================================== */

.rs-who .rs-who-l {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
    position: relative !important;
    z-index: 1 !important;
}

.rs-who .rs-who-l li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}


/* Точката */
.rs-who .rs-who-l li i {
    width: 8px !important;
    height: 8px !important;
    flex: 0 0 8px !important;
    margin-top: 6px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 0 4px rgba(152, 219, 28, 0.12) !important;
}


/* Hover на ред */
.rs-who .rs-who-l li {
    transition: transform 0.25s ease, color 0.25s ease !important;
}

.rs-who .rs-who-l li:hover {
    transform: translateX(4px) !important;
    color: #1f2937 !important;
}


/* ==========================================================================
   РАЗЛИКА МЕЖДУ „ТИ“ И „НИЕ“
   ========================================================================== */

/* Твоята страна */
.rs-who .rs-who-i.you {
    border-top: 3px solid #d1d5db !important;
}


/* Нашата страна — леко подчертаваме */
.rs-who .rs-who-i.us {
    border-top: 3px solid #7cbf00 !important;
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #ffffff 75%,
            #f7fbea 100%
        ) !important;
}


/* Акцент върху „Ние“ */
.rs-who .rs-who-i.us .rs-who-ic {
    background: #edf8df !important;
    color: #4d7d0b !important;
}


/* ==========================================================================
   ДОЛНА ИНФОРМАЦИОННА ЛЕНТА
   ========================================================================== */

.rs-who-note {
    position: relative !important;
    margin-top: 28px !important;
    padding: 22px 26px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: #f1f8e8 !important;
    border: 1px solid rgba(152, 219, 28, 0.3) !important;
    border-radius: 14px !important;
    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    box-shadow: 0 5px 20px rgba(152, 219, 28, 0.05) !important;
}


/* Вертикален зелен акцент */
.rs-who-note::before {
    content: "" !important;
    width: 4px !important;
    height: 38px !important;
    flex: 0 0 4px !important;
    background: #7cbf00 !important;
    border-radius: 99px !important;
}


.rs-who-note b {
    color: #305a08 !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   ЛЕК HOVER НА ИНФОРМАЦИОННАТА ЛЕНТА
   ========================================================================== */

.rs-who-note {
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease !important;
}

.rs-who-note:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(152, 219, 28, 0.5) !important;
    box-shadow: 0 12px 28px rgba(152, 219, 28, 0.1) !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    .rs-who {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .rs-who .rs-who-i {
        padding: 26px !important;
    }

    .rs-who-note {
        align-items: flex-start !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec:has(.rs-who) {
        padding: 60px 16px !important;
    }

    section.sec:has(.rs-who) .rs-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.rs-who) .rs-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec:has(.rs-who) .rs-head p {
        font-size: 15px !important;
    }

    .rs-who .rs-who-i {
        padding: 22px !important;
        border-radius: 15px !important;
    }

    .rs-who .rs-who-h {
        margin-bottom: 20px !important;
    }

    .rs-who .rs-who-h b {
        font-size: 18px !important;
    }

    .rs-who .rs-who-ic {
        width: 42px !important;
        height: 42px !important;
        flex-basis: 42px !important;
    }

    .rs-who .rs-who-l {
        gap: 13px !important;
    }

    .rs-who .rs-who-l li {
        font-size: 13.5px !important;
    }

    .rs-who-note {
        padding: 18px !important;
        font-size: 13.5px !important;
        gap: 9px !important;
    }
}


/*vps/Първо реши това*/


 /* ==========================================================================
    VPS — „ПЪРВО РЕШИ ТОВА“ — СВЕТЪЛ ДИЗАЙН
    ========================================================================== */

section.sec:has(.vp-fork) {
    background: #fafafa !important;
    padding: 80px 20px !important;
}

section.sec:has(.vp-fork) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}


/* ==========================================================================
   ЗАГЛАВНА ЧАСТ
   ========================================================================== */

section.sec:has(.vp-fork) .vp-head {
    max-width: 720px !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section.sec:has(.vp-fork) .vp-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.vp-fork) .vp-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}


/* ==========================================================================
   ДВЕТЕ КАРТИ
   ========================================================================== */

.vp-fork {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
}


/* Основна карта */
.vp-fork .vp-fork-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 32px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    box-shadow:
        0 5px 16px rgba(17, 24, 39, 0.04),
        0 1px 3px rgba(17, 24, 39, 0.03) !important;
    overflow: hidden !important;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease !important;
}


/* Декоративен кръг */
.vp-fork .vp-fork-i::before {
    content: "" !important;
    position: absolute !important;
    width: 190px !important;
    height: 190px !important;
    top: -110px !important;
    right: -90px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.07) !important;
    transition: transform 0.4s ease !important;
    pointer-events: none !important;
}


/* Hover */
.vp-fork .vp-fork-i:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(152, 219, 28, 0.4) !important;
    box-shadow:
        0 20px 45px rgba(17, 24, 39, 0.08),
        0 5px 18px rgba(152, 219, 28, 0.08) !important;
}

.vp-fork .vp-fork-i:hover::before {
    transform: scale(1.35) !important;
}


/* ==========================================================================
   ГОРНА ЧАСТ НА КАРТИТЕ
   ========================================================================== */

.vp-fork .vp-fork-h {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin-bottom: 20px !important;
    position: relative !important;
    z-index: 1 !important;
}

.vp-fork .vp-fork-h b {
    color: #111827 !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    letter-spacing: -0.4px !important;
}


/* Иконка */
.vp-fork .vp-fork-ic {
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: #f3f4f6 !important;
    color: #4b5563 !important;
    border: 1px solid #e5e7eb !important;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

.vp-fork .vp-fork-ic svg {
    width: 23px !important;
    height: 23px !important;
}


/* Hover иконка */
.vp-fork .vp-fork-i:hover .vp-fork-ic {
    transform: scale(1.06) !important;
}


/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

.vp-fork .vp-fork-sub {
    position: relative !important;
    z-index: 1 !important;
    margin: 0 0 22px !important;
    color: #4b5563 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
}

.vp-fork .vp-fork-who {
    position: relative !important;
    z-index: 1 !important;
    margin-top: auto !important;
    padding: 17px 18px !important;
    background: #f9fafb !important;
    border: 1px solid #eef0f2 !important;
    border-radius: 11px !important;
    color: #6b7280 !important;
    font-size: 13.5px !important;
    line-height: 1.55 !important;
}

.vp-fork .vp-fork-who b {
    color: #374151 !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   „БЕЗ УПРАВЛЕНИЕ“
   ========================================================================== */

.vp-fork .vp-fork-i.self {
    border-top: 3px solid #d1d5db !important;
}

.vp-fork .vp-fork-i.self:hover {
    border-top-color: #9ca3af !important;
}


/* ==========================================================================
   „С УПРАВЛЕНИЕ“ — ПРЕПОРЪЧАН
   ========================================================================== */

.vp-fork .vp-fork-i.is-rec {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #ffffff 70%,
            #f4faea 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.4) !important;
    border-top: 3px solid #7cbf00 !important;

    box-shadow:
        0 8px 24px rgba(152, 219, 28, 0.08),
        0 2px 5px rgba(17, 24, 39, 0.04) !important;
}


/* Зелена иконка */
.vp-fork .vp-fork-i.is-rec .vp-fork-ic {
    background: #edf8df !important;
    color: #4d7d0b !important;
    border-color: rgba(152, 219, 28, 0.3) !important;
}

.vp-fork .vp-fork-i.is-rec:hover .vp-fork-ic {
    background: #7cbf00 !important;
    color: #ffffff !important;
    border-color: #7cbf00 !important;
}


/* Подчертаване на текста */
.vp-fork .vp-fork-i.is-rec .vp-fork-who {
    background: #f1f8e8 !important;
    border-color: rgba(152, 219, 28, 0.25) !important;
}

.vp-fork .vp-fork-i.is-rec .vp-fork-who b {
    color: #305a08 !important;
}


/* ==========================================================================
   БУТОН
   ========================================================================== */

.vp-fork .vp-fork-go {
    position: relative !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    margin-top: 18px !important;
    padding: 13px 20px !important;

    background: #7cbf00 !important;
    color: #203b05 !important;

    border: 1px solid #7cbf00 !important;
    border-radius: 10px !important;

    font-size: 14px !important;
    font-weight: 750 !important;
    text-decoration: none !important;

    box-shadow:
        0 5px 15px rgba(152, 219, 28, 0.2) !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease !important;
}

.vp-fork .vp-fork-go:hover {
    background: #86c917 !important;
    color: #172b04 !important;
    transform: translateY(-2px) !important;
    box-shadow:
        0 9px 22px rgba(152, 219, 28, 0.3) !important;
}


/* ==========================================================================
   БЕЛЕЖКА ПРИ „БЕЗ УПРАВЛЕНИЕ“
   ========================================================================== */

.vp-fork .vp-fork-note {
    position: relative !important;
    z-index: 1 !important;
    margin: 18px 0 0 !important;
    padding: 12px 15px !important;
    background: #f9fafb !important;
    border-radius: 9px !important;
    border-left: 3px solid #d1d5db !important;
    color: #6b7280 !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    .vp-fork {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .vp-fork .vp-fork-i {
        padding: 27px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec:has(.vp-fork) {
        padding: 60px 16px !important;
    }

    section.sec:has(.vp-fork) .vp-head {
        margin-bottom: 34px !important;
    }

    section.sec:has(.vp-fork) .vp-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec:has(.vp-fork) .vp-head p {
        font-size: 15px !important;
    }

    .vp-fork .vp-fork-i {
        padding: 22px !important;
        border-radius: 15px !important;
    }

    .vp-fork .vp-fork-h {
        margin-bottom: 17px !important;
    }

    .vp-fork .vp-fork-h b {
        font-size: 18px !important;
    }

    .vp-fork .vp-fork-ic {
        width: 43px !important;
        height: 43px !important;
        flex-basis: 43px !important;
    }

    .vp-fork .vp-fork-sub {
        font-size: 14px !important;
    }

    .vp-fork .vp-fork-who {
        font-size: 13px !important;
        padding: 15px !important;
    }
}


/*vps/ Двете неща, които самостоятелният сървър няма*/


/* ==========================================================================
   VPS — „ДВЕТЕ НЕЩА, КОИТО САМОСТОЯТЕЛНИЯТ СЪРВЪР НЯМА“
   DARK PREMIUM / TECH DESIGN
   ========================================================================== */

/* Основна секция */
section.sec:has(.vp-grow) {
    background:
        radial-gradient(
            circle at 15% 10%,
            rgba(152, 219, 28, 0.055),
            transparent 32%
        ),
        radial-gradient(
            circle at 85% 90%,
            rgba(105, 201, 14, 0.035),
            transparent 30%
        ),
        #0b0e09 !important;

    padding: 90px 20px !important;
    color: #ffffff !important;
}

section.sec:has(.vp-grow) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.vp-grow) .vp-head {
    max-width: 760px !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section.sec:has(.vp-grow) .vp-head h2 {
    margin: 0 0 15px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 43px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1.2px !important;
}

section.sec:has(.vp-grow) .vp-head p {
    margin: 0 !important;
    color: #9ca3af !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}


/* ==========================================================================
   ОСНОВЕН LAYOUT
   ========================================================================== */

.vp-grow {
    display: grid !important;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr) !important;
    gap: 24px !important;
    align-items: stretch !important;
}


/* ==========================================================================
   ЛЯВА КАРТА — РАСТЕЖ
   ========================================================================== */

.vp-grow .vp-grow-box {
    position: relative !important;
    min-height: 100% !important;
    padding: 32px !important;

    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #10140d 60%,
            #0e120c 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 18px !important;

    box-shadow:
        0 20px 50px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.025) !important;

    overflow: hidden !important;

    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease !important;
}


/* Светещ декоративен кръг */
.vp-grow .vp-grow-box::before {
    content: "" !important;
    position: absolute !important;
    width: 260px !important;
    height: 260px !important;
    right: -130px !important;
    top: -140px !important;
    border-radius: 50% !important;

    background: rgba(152, 219, 28, 0.08) !important;

    filter: blur(2px) !important;
    pointer-events: none !important;

    transition: transform 0.5s ease !important;
}

.vp-grow .vp-grow-box:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.5) !important;

    box-shadow:
        0 25px 60px rgba(0, 0, 0, 0.45),
        0 0 35px rgba(152, 219, 28, 0.07) !important;
}

.vp-grow .vp-grow-box:hover::before {
    transform: scale(1.25) !important;
}


/* Заглавие */
.vp-grow .vp-grow-h {
    position: relative !important;
    z-index: 1 !important;

    margin-bottom: 28px !important;

    color: #ffffff !important;
    font-size: 20px !important;
    font-weight: 750 !important;
    letter-spacing: -0.3px !important;
}


/* ==========================================================================
   STEP / PLAN
   ========================================================================== */

.vp-grow .vp-grow-steps {
    position: relative !important;
    z-index: 1 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin-bottom: 25px !important;
}

.vp-grow .vp-grow-s {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    padding: 18px 20px !important;

    background: #0b0f09 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    border-radius: 12px !important;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease !important;
}

.vp-grow .vp-grow-s:hover {
    transform: translateX(5px) !important;
    background: #11170d !important;
    border-color: rgba(152, 219, 28, 0.42) !important;
}

.vp-grow .vp-grow-s b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 750 !important;
}

.vp-grow .vp-grow-s span {
    color: #7cbf00 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}


/* ==========================================================================
   TIME / 60 СЕКУНДИ
   ========================================================================== */

.vp-grow .vp-grow-time {
    position: relative !important;
    z-index: 1 !important;

    display: flex !important;
    align-items: center !important;
    gap: 9px !important;

    margin-top: 15px !important;
    padding: 15px 17px !important;

    background: rgba(152, 219, 28, 0.07) !important;
    border: 1px solid rgba(152, 219, 28, 0.15) !important;
    border-radius: 11px !important;

    color: #9ca3af !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

.vp-grow .vp-grow-time svg {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
    color: #7cbf00 !important;
}

.vp-grow .vp-grow-time b {
    color: #d9f99d !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   ДЯСНА КОЛОНА — ПРЕДИМСТВА
   ========================================================================== */

.vp-grow .vp-grow-l {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
}


/* Individual feature */
.vp-grow .vp-grow-i {
    position: relative !important;

    display: flex !important;
    align-items: flex-start !important;
    gap: 17px !important;

    padding: 23px !important;

    background: #11140f !important;
    border: 1px solid #252a21 !important;
    border-radius: 15px !important;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.18) !important;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease !important;
}


/* Hover */
.vp-grow .vp-grow-i:hover {
    transform: translateX(6px) !important;

    background: #151a12 !important;
    border-color: rgba(152, 219, 28, 0.38) !important;

    box-shadow:
        0 12px 30px rgba(0, 0, 0, 0.3),
        -4px 0 20px rgba(152, 219, 28, 0.04) !important;
}


/* ==========================================================================
   ИКОНКИ
   ========================================================================== */

.vp-grow .vp-grow-ic {
    width: 45px !important;
    height: 45px !important;
    flex: 0 0 45px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 12px !important;

    background: rgba(152, 219, 28, 0.09) !important;
    border: 1px solid rgba(152, 219, 28, 0.2) !important;

    color: #7cbf00 !important;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease !important;
}

.vp-grow .vp-grow-ic svg {
    width: 21px !important;
    height: 21px !important;
}

.vp-grow .vp-grow-i:hover .vp-grow-ic {
    background: #7cbf00 !important;
    color: #172604 !important;
    transform: scale(1.08) !important;

    box-shadow:
        0 0 18px rgba(152, 219, 28, 0.2) !important;
}


/* ==========================================================================
   ТЕКСТ НА ПРЕДИМСТВАТА
   ========================================================================== */

.vp-grow .vp-grow-i > span:last-child {
    display: block !important;
    min-width: 0 !important;
}

.vp-grow .vp-grow-i b {
    display: block !important;

    margin: 1px 0 7px !important;

    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 750 !important;
    letter-spacing: -0.2px !important;
}

.vp-grow .vp-grow-i p {
    margin: 0 !important;

    color: #9ca3af !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
}


/* ==========================================================================
   ФИНА ЗЕЛЕНА ЛИНИЯ ПРИ HOVER
   ========================================================================== */

.vp-grow .vp-grow-i::after {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 18px !important;
    bottom: 18px !important;

    width: 2px !important;

    background: #7cbf00 !important;
    border-radius: 0 3px 3px 0 !important;

    opacity: 0 !important;
    transform: scaleY(0.4) !important;

    transition:
        opacity 0.3s ease,
        transform 0.3s ease !important;
}

.vp-grow .vp-grow-i:hover::after {
    opacity: 1 !important;
    transform: scaleY(1) !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .vp-grow {
        grid-template-columns: 1fr !important;
    }

    .vp-grow .vp-grow-box {
        min-height: auto !important;
    }

    .vp-grow .vp-grow-l {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.vp-grow) {
        padding: 65px 16px !important;
    }

    section.sec:has(.vp-grow) .vp-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.vp-grow) .vp-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec:has(.vp-grow) .vp-head p {
        font-size: 14.5px !important;
    }

    .vp-grow {
        gap: 16px !important;
    }

    .vp-grow .vp-grow-box {
        padding: 23px !important;
        border-radius: 15px !important;
    }

    .vp-grow .vp-grow-h {
        font-size: 18px !important;
        margin-bottom: 22px !important;
    }

    .vp-grow .vp-grow-l {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .vp-grow .vp-grow-i {
        padding: 19px !important;
        gap: 14px !important;
    }

    .vp-grow .vp-grow-ic {
        width: 41px !important;
        height: 41px !important;
        flex-basis: 41px !important;
    }

    .vp-grow .vp-grow-i b {
        font-size: 15px !important;
    }

    .vp-grow .vp-grow-i p {
        font-size: 13px !important;
    }

    .vp-grow .vp-grow-time {
        align-items: flex-start !important;
        font-size: 12.5px !important;
    }
}


/* ==========================================================================
   ACCESSIBILITY — REDUCE MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    .vp-grow *,
    .vp-grow *::before,
    .vp-grow *::after {
        transition: none !important;
        transform: none !important;
    }
}


/*vps/VPS ли ти трябва наистина?*/


/* ==========================================================================
   VPS — "VPS ли ти трябва наистина?"
   Светъл, модерен и интерактивен дизайн
   ========================================================================== */

section.sec .vp-where {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 42px !important;
    align-items: stretch !important;
}

/* --------------------------------------------------------------------------
   ОСНОВНИ КАРТИ
   -------------------------------------------------------------------------- */

section.sec .vp-where-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;

    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;

    padding: 30px !important;
    min-height: 320px !important;

    box-shadow:
        0 4px 12px rgba(15, 23, 42, 0.04),
        0 12px 30px rgba(15, 23, 42, 0.04) !important;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease,
        background 0.3s ease !important;

    overflow: hidden !important;
}

/* Декоративен светъл градиент */
section.sec .vp-where-i::before {
    content: "" !important;
    position: absolute !important;
    top: -80px !important;
    right: -80px !important;

    width: 180px !important;
    height: 180px !important;

    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.13) 0%,
        rgba(152, 219, 28, 0) 70%
    ) !important;

    pointer-events: none !important;
}

/* --------------------------------------------------------------------------
   HOVER
   -------------------------------------------------------------------------- */

section.sec .vp-where-i:hover {
    transform: translateY(-7px) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 10px 25px rgba(15, 23, 42, 0.07),
        0 20px 45px rgba(152, 219, 28, 0.10) !important;
}

/* --------------------------------------------------------------------------
   VPS — ОСНОВНА КАРТА
   -------------------------------------------------------------------------- */

section.sec .vp-where-i.is-this {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfff5 100%
        ) !important;

    border: 2px solid #7cbf00 !important;

    box-shadow:
        0 8px 25px rgba(152, 219, 28, 0.12),
        0 18px 45px rgba(15, 23, 42, 0.06) !important;

    transform: translateY(-4px) !important;
}

/* Лек glow при hover */
section.sec .vp-where-i.is-this:hover {
    transform: translateY(-10px) !important;

    box-shadow:
        0 12px 30px rgba(152, 219, 28, 0.16),
        0 25px 55px rgba(15, 23, 42, 0.08) !important;
}

/* Малък зелен акцент отгоре */
section.sec .vp-where-i.is-this::after {
    content: "ПРЕПОРЪЧАН" !important;

    position: absolute !important;
    top: 0 !important;
    right: 24px !important;

    background: #7cbf00 !important;
    color: #203000 !important;

    padding: 6px 12px !important;
    border-radius: 0 0 8px 8px !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.7px !important;
}

/* --------------------------------------------------------------------------
   ГОРНА ЧАСТ
   -------------------------------------------------------------------------- */

section.sec .vp-where-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 15px !important;

    margin-bottom: 22px !important;
    position: relative !important;
    z-index: 2 !important;
}

section.sec .vp-where-top b {
    font-size: 21px !important;
    line-height: 1.25 !important;
    font-weight: 750 !important;

    color: #111827 !important;

    letter-spacing: -0.4px !important;
}

/* VPS заглавие */
section.sec .vp-where-i.is-this .vp-where-top b {
    color: #305a08 !important;
}

/* --------------------------------------------------------------------------
   PILL
   -------------------------------------------------------------------------- */

section.sec .vp-where .pill {
    flex-shrink: 0 !important;

    display: inline-flex !important;
    align-items: center !important;

    padding: 6px 11px !important;
    border-radius: 999px !important;

    font-size: 11px !important;
    font-weight: 750 !important;

    white-space: nowrap !important;
}

/* Сивите */
section.sec .vp-where .pill.p-muted {
    background: #f3f4f6 !important;
    color: #4b5563 !important;
    border: 1px solid #e5e7eb !important;
}

/* VPS */
section.sec .vp-where .pill.p-rose {
    background: rgba(152, 219, 28, 0.14) !important;
    color: #4d750d !important;
    border: 1px solid rgba(152, 219, 28, 0.35) !important;
}

/* --------------------------------------------------------------------------
   ОПИСАНИЕ
   -------------------------------------------------------------------------- */

section.sec .vp-where-i > p {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 0 22px 0 !important;

    color: #4b5563 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
}

/* --------------------------------------------------------------------------
   "СТИГА ТИ / ВЗИМАШ ГО / ОТИВАШ"
   -------------------------------------------------------------------------- */

section.sec .vp-where-when {
    position: relative !important;
    z-index: 2 !important;

    margin-top: auto !important;
    margin-bottom: 22px !important;

    padding: 15px 16px !important;

    background: #f8fafc !important;
    border: 1px solid #edf0f3 !important;
    border-radius: 11px !important;

    color: #596273 !important;

    font-size: 13px !important;
    line-height: 1.55 !important;

    transition:
        background 0.25s ease,
        border-color 0.25s ease !important;
}

section.sec .vp-where-i:hover .vp-where-when {
    background: #f9fdf3 !important;
    border-color: rgba(152, 219, 28, 0.25) !important;
}

section.sec .vp-where-when b {
    color: #1f2937 !important;
    font-weight: 750 !important;
}

/* VPS вътрешен блок */
section.sec .vp-where-i.is-this .vp-where-when {
    background: rgba(152, 219, 28, 0.08) !important;
    border-color: rgba(152, 219, 28, 0.22) !important;
}

section.sec .vp-where-i.is-this .vp-where-when b {
    color: #305a08 !important;
}

/* --------------------------------------------------------------------------
   БУТОНИ
   -------------------------------------------------------------------------- */

section.sec .vp-where-go {
    position: relative !important;
    z-index: 3 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    align-self: flex-start !important;

    min-height: 42px !important;

    padding: 10px 17px !important;

    border-radius: 9px !important;

    background: #ffffff !important;
    color: #305a08 !important;

    border: 1px solid #dce4d2 !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    text-decoration: none !important;

    transition:
        all 0.25s ease !important;
}

/* Hover бутон */
section.sec .vp-where-go:hover {
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;
    color: #1e2b08 !important;

    transform: translateY(-2px) !important;

    box-shadow:
        0 7px 18px rgba(152, 219, 28, 0.25) !important;
}

/* --------------------------------------------------------------------------
   VPS КАРТА — лек визуален акцент
   -------------------------------------------------------------------------- */

section.sec .vp-where-i.is-this .vp-where-top {
    padding-right: 80px !important;
}

/* --------------------------------------------------------------------------
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   -------------------------------------------------------------------------- */

section.sec .vp-head {
    max-width: 760px !important;
    margin: 0 auto 0 auto !important;
    text-align: center !important;
}

section.sec .vp-head h2 {
    color: #111827 !important;

    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.12 !important;

    font-weight: 750 !important;
    letter-spacing: -1px !important;

    margin: 0 0 14px 0 !important;
}

section.sec .vp-head p {
    color: #667085 !important;

    font-size: 16px !important;
    line-height: 1.65 !important;

    margin: 0 !important;
}

/* --------------------------------------------------------------------------
   TABLET
   -------------------------------------------------------------------------- */

@media (max-width: 1000px) {

    section.sec .vp-where {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec .vp-where-i:last-child {
        grid-column: 1 / -1 !important;
        max-width: calc(50% - 12px) !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
}

/* --------------------------------------------------------------------------
   МОБИЛЕН
   -------------------------------------------------------------------------- */

@media (max-width: 680px) {

    section.sec .vp-where {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 30px !important;
    }

    section.sec .vp-where-i,
    section.sec .vp-where-i.is-this {
        min-height: auto !important;
        padding: 24px !important;
        transform: none !important;
    }

    section.sec .vp-where-i:hover,
    section.sec .vp-where-i.is-this:hover {
        transform: translateY(-4px) !important;
    }

    section.sec .vp-where-i:last-child {
        grid-column: auto !important;
        max-width: none !important;
    }

    section.sec .vp-where-top {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    section.sec .vp-where-i.is-this .vp-where-top {
        padding-right: 0 !important;
    }

    section.sec .vp-where-top b {
        font-size: 19px !important;
    }

    section.sec .vp-head h2 {
        font-size: 30px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec .vp-head p {
        font-size: 15px !important;
    }
}


/*Каква система искашvps/*/

/* ==========================================================================
   VPS OS — ТЪМНА ГАМА / КОРИГИРАН ДИЗАЙН
   ========================================================================== */

section.sec .vp-os {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-top: 35px !important;
}

/* Карта */
section.sec .vp-os-i {
    position: relative !important;
    min-width: 0 !important;
    min-height: 150px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;

    padding: 24px 20px !important;

    background:
        linear-gradient(
            145deg,
            #171b11 0%,
            #10130d 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 16px !important;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;

    overflow: visible !important;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease !important;
}

/* Зелената маркировка — вече е отгоре */
section.sec .vp-os-mark {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 42px !important;
    height: 42px !important;

    margin: 0 0 18px 0 !important;

    flex-shrink: 0 !important;

    background: rgba(152, 219, 28, 0.12) !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 11px !important;

    color: #7cbf00 !important;

    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.5px !important;

    box-shadow:
        0 0 18px rgba(152, 219, 28, 0.06) !important;
}

/* Контейнерът с името */
section.sec .vp-os-i > span:last-child {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
}

/* Име на системата */
section.sec .vp-os-i b {
    display: block !important;

    margin: 0 0 7px 0 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;

    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;

    letter-spacing: -0.2px !important;
}

/* Версиите */
section.sec .vp-os-i > span:last-child > span {
    display: block !important;

    color: #9ca3af !important;

    font-size: 13px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;

    white-space: normal !important;
}

/* Hover */
section.sec .vp-os-i:hover {
    transform: translateY(-7px) !important;

    background:
        linear-gradient(
            145deg,
            #1c2412 0%,
            #12170d 100%
        ) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 18px 40px rgba(0, 0, 0, 0.45),
        0 0 25px rgba(152, 219, 28, 0.08) !important;
}

/* Hover на маркировката */
section.sec .vp-os-i:hover .vp-os-mark {
    background: #7cbf00 !important;
    color: #10130d !important;

    border-color: #7cbf00 !important;

    box-shadow:
        0 0 20px rgba(152, 219, 28, 0.25) !important;
}

/* Hover на името */
section.sec .vp-os-i:hover b {
    color: #7cbf00 !important;
}

/* Текстът под картите */
section.sec .vp-os-note {
    margin: 28px 0 0 0 !important;

    color: #9ca3af !important;

    font-size: 14px !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

section.sec .vp-os-note b {
    color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1100px) {
    section.sec .vp-os {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 700px) {
    section.sec .vp-os {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
    }

    section.sec .vp-os-i {
        min-height: 145px !important;
        padding: 20px 17px !important;
    }

    section.sec .vp-os-mark {
        width: 38px !important;
        height: 38px !important;
        margin-bottom: 14px !important;
    }

    section.sec .vp-os-i b {
        font-size: 15px !important;
    }
}

/* ==========================================================================
   МАЛЪК ТЕЛЕФОН
   ========================================================================== */

@media (max-width: 430px) {
    section.sec .vp-os {
        grid-template-columns: 1fr !important;
    }

    section.sec .vp-os-i {
        min-height: auto !important;
    }
}


/*menidzhar-vps/Какво се прави, когато нищо не се случва*/


/* ==========================================================================
   MV WORK / ДНЕВНИК — СВЕТЪЛ ИНТЕРАКТИВЕН ДИЗАЙН
   ========================================================================== */

section.sec .mv-head {
    max-width: 760px !important;
    margin: 0 auto 45px !important;
    text-align: center !important;
}

section.sec .mv-head h2 {
    margin: 0 0 14px !important;
    color: #17200f !important;
    font-size: clamp(28px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec .mv-head p {
    margin: 0 !important;
    color: #68705f !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}


/* ==========================================================================
   СТАТИСТИКИ
   ========================================================================== */

section.sec .mv-work {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-bottom: 32px !important;
}

section.sec .mv-work-i {
    position: relative !important;
    min-width: 0 !important;

    padding: 27px 24px !important;

    background: #ffffff !important;
    border: 1px solid #e4e9df !important;
    border-radius: 18px !important;

    box-shadow:
        0 8px 25px rgba(30, 45, 20, 0.055),
        0 1px 2px rgba(30, 45, 20, 0.04) !important;

    overflow: hidden !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease !important;
}

/* декоративна зелена линия */
section.sec .mv-work-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #c5f36a
    ) !important;
}

/* леко зелено сияние */
section.sec .mv-work-i::after {
    content: "" !important;
    position: absolute !important;
    width: 90px !important;
    height: 90px !important;
    right: -45px !important;
    bottom: -45px !important;

    background: rgba(152, 219, 28, 0.08) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

section.sec .mv-work-i:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 18px 40px rgba(48, 90, 8, 0.10),
        0 0 0 4px rgba(152, 219, 28, 0.055) !important;
}

section.sec .mv-work-i b {
    display: block !important;

    margin-bottom: 7px !important;

    color: #305a08 !important;
    font-size: 32px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec .mv-work-i span {
    display: block !important;

    color: #70786a !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
}


/* ==========================================================================
   ДНЕВНИК
   ========================================================================== */

section.sec .mv-log {
    background: #ffffff !important;

    border: 1px solid #e2e8dc !important;
    border-radius: 20px !important;

    box-shadow:
        0 12px 35px rgba(30, 45, 20, 0.065) !important;

    overflow: hidden !important;
}


/* Заглавна лента */

section.sec .mv-log-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;

    padding: 21px 25px !important;

    background: #f7f9f4 !important;
    border-bottom: 1px solid #e5eadf !important;
}

section.sec .mv-log-h b {
    color: #1c2515 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}

section.sec .mv-log-h span {
    color: #858c7e !important;
    font-size: 12px !important;
}


/* ==========================================================================
   РЕДОВЕ
   ========================================================================== */

section.sec .mv-log-l {
    padding: 5px 0 !important;
}

section.sec .mv-log-r {
    display: grid !important;
    grid-template-columns: 65px 105px minmax(0, 1fr) 105px !important;
    align-items: center !important;
    gap: 18px !important;

    min-width: 0 !important;

    padding: 17px 25px !important;

    border-bottom: 1px solid #edf0ea !important;

    transition:
        background .2s ease,
        padding-left .2s ease !important;
}

section.sec .mv-log-r:last-child {
    border-bottom: 0 !important;
}

section.sec .mv-log-r:hover {
    background: #fbfdf9 !important;
    padding-left: 29px !important;
}


/* Дата */

section.sec .mv-log-date {
    color: #7b8374 !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
}


/* Вид операция */

section.sec .mv-log-kind {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: fit-content !important;

    padding: 5px 9px !important;

    border-radius: 7px !important;

    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .35px !important;
}


/* Цветове на типовете */

section.sec .mv-log-kind.sec {
    color: #315f0b !important;
    background: #eaf7d8 !important;
    border: 1px solid #d8efb9 !important;
}

section.sec .mv-log-kind.up {
    color: #49620e !important;
    background: #f2f8df !important;
    border: 1px solid #e4efc5 !important;
}

section.sec .mv-log-kind.fix {
    color: #875f12 !important;
    background: #fff5d9 !important;
    border: 1px solid #f4e6b8 !important;
}

section.sec .mv-log-kind.bak {
    color: #256b68 !important;
    background: #e3f5f2 !important;
    border: 1px solid #ccebe6 !important;
}


/* Описание */

section.sec .mv-log-r > span:nth-child(3) {
    min-width: 0 !important;

    color: #424a3d !important;

    font-size: 13px !important;
    line-height: 1.5 !important;
}


/* "Не си усетил" */

section.sec .mv-log-you {
    justify-self: end !important;

    color: #5f9b22 !important;

    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;

    opacity: .9 !important;
}


/* ==========================================================================
   ДОЛЕН РЕД
   ========================================================================== */

section.sec .mv-log-more {
    padding: 18px 25px !important;

    color: #78806f !important;

    background: #fafbf9 !important;
    border-top: 1px solid #edf0ea !important;

    font-size: 12px !important;
    line-height: 1.5 !important;
    text-align: center !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1000px) {

    section.sec .mv-work {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec .mv-log-r {
        grid-template-columns: 60px 100px minmax(0, 1fr) !important;
    }

    section.sec .mv-log-you {
        display: none !important;
    }
}


/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 650px) {

    section.sec .mv-head {
        margin-bottom: 30px !important;
    }

    section.sec .mv-head h2 {
        font-size: 28px !important;
        letter-spacing: -.6px !important;
    }

    section.sec .mv-head p {
        font-size: 14px !important;
    }

    section.sec .mv-work {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
        margin-bottom: 22px !important;
    }

    section.sec .mv-work-i {
        padding: 22px 18px !important;
        border-radius: 15px !important;
    }

    section.sec .mv-work-i b {
        font-size: 27px !important;
    }

    section.sec .mv-work-i span {
        font-size: 11px !important;
    }

    section.sec .mv-log {
        border-radius: 16px !important;
    }

    section.sec .mv-log-h {
        padding: 18px !important;
    }

    section.sec .mv-log-h span {
        display: none !important;
    }

    section.sec .mv-log-r {
        grid-template-columns: 48px minmax(0, 1fr) !important;
        gap: 8px 12px !important;

        padding: 16px 18px !important;
    }

    section.sec .mv-log-r:hover {
        padding-left: 18px !important;
    }

    section.sec .mv-log-date {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    section.sec .mv-log-kind {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }

    section.sec .mv-log-r > span:nth-child(3) {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;

        font-size: 12px !important;
    }

    section.sec .mv-log-more {
        padding: 16px 18px !important;
    }
}


/* ==========================================================================
   МНОГО МАЛЪК ЕКРАН
   ========================================================================== */

@media (max-width: 400px) {

    section.sec .mv-work {
        grid-template-columns: 1fr !important;
    }

    section.sec .mv-work-i {
        min-height: 105px !important;
    }
}

/*Пакетите*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СЕКЦИЯ "ПАКЕТИТЕ"
   ========================================================================== */

/* Основна секция */
section#packs.sec-wash {
    background: #0b0f08 !important;
    padding: 90px 20px !important;
    color: #f5f7f2 !important;
    overflow: hidden !important;
}

/* Лек светлинен ефект около секцията */
section#packs.sec-wash .wrap-w {
    position: relative !important;
    z-index: 1 !important;
}

section#packs.sec-wash::before {
    content: "" !important;
    position: absolute !important;
    width: 600px !important;
    height: 600px !important;
    left: 50% !important;
    top: 20% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.07) 0%,
        rgba(152, 219, 28, 0.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section#packs .mv-head {
    text-align: center !important;
    max-width: 760px !important;
    margin: 0 auto 55px !important;
}

section#packs .mv-head h2 {
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin: 0 0 15px !important;
}

section#packs .mv-head p {
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* Малък зелен акцент под заглавието */
section#packs .mv-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    margin: 24px auto 0 !important;
    box-shadow: 0 0 18px rgba(152, 219, 28, 0.45) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section#packs .mv-packs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   ОСНОВНИ КАРТИ
   ========================================================================== */

section#packs .mv-pack {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background: linear-gradient(
        145deg,
        #151a11 0%,
        #10140d 100%
    ) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 18px !important;
    padding: 30px !important;
    overflow: hidden !important;
    box-shadow:
        0 18px 45px rgba(0,0,0,0.28),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;
    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease !important;
}

/* Светлинна линия отгоре */
section#packs .mv-pack::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,0.25),
        transparent
    ) !important;
    opacity: 0 !important;
    transition: opacity .3s ease !important;
}

/* Hover */
section#packs .mv-pack:hover {
    transform: translateY(-8px) !important;
    border-color: rgba(152,219,28,0.35) !important;
    background: linear-gradient(
        145deg,
        #192011 0%,
        #11170d 100%
    ) !important;
    box-shadow:
        0 25px 55px rgba(0,0,0,0.4),
        0 0 30px rgba(152,219,28,0.06) !important;
}

section#packs .mv-pack:hover::before {
    opacity: 1 !important;
}

/* ==========================================================================
   ПРЕПОРЪЧИТЕЛЕН ПАКЕТ
   ========================================================================== */

section#packs .mv-pack.is-best {
    border-color: rgba(152,219,28,0.55) !important;
    background:
        linear-gradient(
            145deg,
            #18200f 0%,
            #10150c 100%
        ) !important;
    box-shadow:
        0 25px 60px rgba(0,0,0,0.4),
        0 0 40px rgba(152,219,28,0.08),
        inset 0 1px 0 rgba(152,219,28,0.08) !important;
    transform: translateY(-8px) !important;
}

section#packs .mv-pack.is-best:hover {
    transform: translateY(-12px) !important;
    border-color: #7cbf00 !important;
    box-shadow:
        0 30px 65px rgba(0,0,0,0.45),
        0 0 45px rgba(152,219,28,0.14) !important;
}

/* Зелен ореол около препоръчителната карта */
section#packs .mv-pack.is-best::before {
    opacity: 1 !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;
}

/* ==========================================================================
   BADGE "НАЙ-ЧЕСТО ВЗИМАН"
   ========================================================================== */

section#packs .mv-pack-tag {
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;
    margin-bottom: 16px !important;
    padding: 6px 11px !important;
    border-radius: 999px !important;
    background: rgba(152,219,28,0.12) !important;
    border: 1px solid rgba(152,219,28,0.28) !important;
    color: #7cbf00 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .7px !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА ПАКЕТА
   ========================================================================== */

section#packs .mv-pack-n {
    color: #ffffff !important;
    font-size: 25px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    margin: 0 0 8px !important;
    letter-spacing: -.5px !important;
}

section#packs .mv-pack-for {
    color: #ffffff !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    min-height: 45px !important;
    margin: 0 !important;
}

/* ==========================================================================
   SLA / ВРЕМЕ ЗА ОТГОВОР
   ========================================================================== */

section#packs .mv-pack-sla {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 25px 0 !important;
    padding: 13px 14px !important;
    background: rgba(255,255,255,0.035) !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    border-radius: 10px !important;
}

section#packs .mv-pack-sla b {
    color: #7cbf00 !important;
    font-size: 15px !important;
    white-space: nowrap !important;
}

section#packs .mv-pack-sla span {
    color: #8f9888 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

/* ==========================================================================
   ЦЕНА
   ========================================================================== */

section#packs .mv-pack-p {
    padding: 20px 0 !important;
    border-top: 1px solid rgba(255,255,255,0.07) !important;
    border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}

section#packs .mv-pack-p b {
    color: #ffffff !important;
    font-size: 34px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section#packs .mv-pack-p > span {
    color: #8f9888 !important;
    font-size: 13px !important;
    margin-left: 5px !important;
}

section#packs .mv-pack-p em {
    display: block !important;
    color: #687063 !important;
    font-size: 11px !important;
    font-style: normal !important;
    margin-top: 7px !important;
}

/* ==========================================================================
   СПИСЪК С ФУНКЦИИ
   ========================================================================== */

section#packs .mv-pack-f {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    padding: 24px 0 !important;
    flex-grow: 1 !important;
}

section#packs .mv-pack-f > div {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    color: #c7cec1 !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
}

section#packs .mv-pack-f b {
    color: #f3f6ef !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   CHECK ICON
   ========================================================================== */

section#packs .mv-fi {
    flex: 0 0 20px !important;
    width: 20px !important;
    height: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: rgba(152,219,28,0.12) !important;
    color: #7cbf00 !important;
    margin-top: 1px !important;
}

section#packs .mv-fi svg {
    width: 12px !important;
    height: 12px !important;
    stroke-width: 2.5 !important;
}

/* X иконка */
section#packs .mv-fi.no {
    background: rgba(255,255,255,0.05) !important;
    color: #626a5e !important;
}

/* ==========================================================================
   БУТОН
   ========================================================================== */

section#packs .mv-pack-go {
    margin-top: auto !important;
    padding-top: 20px !important;
}

section#packs .mv-pack-go .btn {
    width: 100% !important;
    min-height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    transition: all .3s ease !important;
}

/* Основен зелен бутон */
section#packs .mv-pack.is-best .mv-pack-go .btn {
    background: #7cbf00 !important;
    color: #11140c !important;
    border: 1px solid #7cbf00 !important;
    box-shadow: 0 8px 22px rgba(152,219,28,0.16) !important;
}

section#packs .mv-pack.is-best .mv-pack-go .btn:hover {
    background: #b1ed45 !important;
    border-color: #b1ed45 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 28px rgba(152,219,28,0.25) !important;
}

/* Ghost бутон */
section#packs .mv-pack:not(.is-best) .mv-pack-go .btn {
    background: rgba(255,255,255,0.025) !important;
    color: #dbe2d5 !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
}

section#packs .mv-pack:not(.is-best) .mv-pack-go .btn:hover {
    background: rgba(152,219,28,0.08) !important;
    border-color: rgba(152,219,28,0.45) !important;
    color: #7cbf00 !important;
    transform: translateY(-2px) !important;
}

/* ==========================================================================
   БЕЛЕЖКА ПОД БУТОНА
   ========================================================================== */

section#packs .mv-pack-note {
    display: block !important;
    text-align: center !important;
    margin-top: 10px !important;
    color: #697264 !important;
    font-size: 11px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1024px) {
    section#packs .mv-packs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section#packs .mv-pack.is-best {
        transform: none !important;
    }

    section#packs .mv-pack.is-best:hover {
        transform: translateY(-8px) !important;
    }

    section#packs .mv-pack:last-child {
        grid-column: 1 / -1 !important;
        max-width: calc(50% - 11px) !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 680px) {
    section#packs.sec-wash {
        padding: 65px 16px !important;
    }

    section#packs .mv-head {
        margin-bottom: 38px !important;
    }

    section#packs .mv-head h2 {
        font-size: 30px !important;
    }

    section#packs .mv-head p {
        font-size: 14px !important;
    }

    section#packs .mv-packs {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    section#packs .mv-pack {
        padding: 25px 22px !important;
        border-radius: 15px !important;
    }

    section#packs .mv-pack.is-best {
        transform: none !important;
    }

    section#packs .mv-pack.is-best:hover,
    section#packs .mv-pack:hover {
        transform: translateY(-4px) !important;
    }

    section#packs .mv-pack:last-child {
        grid-column: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    section#packs .mv-pack-p b {
        font-size: 30px !important;
    }
}
/*Кой какво прави*/


/* ==========================================================================
   СВЕТЪЛ ПРЕМИУМ ДИЗАЙН — "КОЙ КАКВО ПРАВИ"
   Само за .mv-split секцията
   ========================================================================== */

.mv-split {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 32px !important;
    align-items: stretch !important;
}

/* Основни карти */
.mv-split .mv-split-i {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    padding: 30px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 30px rgba(15, 23, 42, 0.06) !important;
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease !important;
}

/* Лек цветен фон в горната част */
.mv-split .mv-split-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #b8ed54
    ) !important;
}

/* Карта "Ние" */
.mv-split .mv-split-i.us {
    border-color: rgba(152, 219, 28, 0.28) !important;
    background:
        linear-gradient(
            180deg,
            rgba(152, 219, 28, 0.055) 0%,
            #ffffff 32%
        ) !important;
}

/* Карта "Ти" */
.mv-split .mv-split-i.you {
    background:
        linear-gradient(
            180deg,
            rgba(15, 23, 42, 0.025) 0%,
            #ffffff 32%
        ) !important;
}

/* Hover */
.mv-split .mv-split-i:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.55) !important;
    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.10),
        0 5px 18px rgba(152, 219, 28, 0.08) !important;
}

/* Заглавна част */
.mv-split .mv-split-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 24px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* Иконка */
.mv-split .mv-split-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152, 219, 28, 0.13) !important;
    color: #6da800 !important;
    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

.mv-split .mv-split-ic svg {
    width: 22px !important;
    height: 22px !important;
}

.mv-split .mv-split-i:hover .mv-split-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}

/* Заглавие */
.mv-split .mv-split-h b {
    font-size: 22px !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    color: #111827 !important;
    letter-spacing: -0.4px !important;
}

/* Списък */
.mv-split .mv-split-l {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
}

/* Всеки ред */
.mv-split .mv-split-l > li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
}

/* Зелената точка */
.mv-split .mv-split-l > li > i {
    position: relative !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin-top: 1px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.13) !important;
    border: 1px solid rgba(152, 219, 28, 0.30) !important;
}

/* Check в точката */
.mv-split .mv-split-l > li > i::after {
    content: "" !important;
    position: absolute !important;
    width: 7px !important;
    height: 4px !important;
    left: 5px !important;
    top: 5px !important;
    border-left: 2px solid #72a900 !important;
    border-bottom: 2px solid #72a900 !important;
    transform: rotate(-45deg) !important;
}

/* Hover върху ред */
.mv-split .mv-split-l > li {
    transition: transform 0.25s ease, color 0.25s ease !important;
}

.mv-split .mv-split-l > li:hover {
    transform: translateX(4px) !important;
    color: #1f2937 !important;
}

/* ==========================================================
   БЛОК "КАКВО НЕ ВЛИЗА"
   ========================================================== */

.mv-split .mv-split-not {
    margin-top: 28px !important;
    padding: 20px !important;
    border-radius: 14px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    position: relative !important;
}

/* Малък цветен акцент */
.mv-split .mv-split-not::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 14px !important;
    bottom: 14px !important;
    width: 3px !important;
    border-radius: 4px !important;
    background: #d1d5db !important;
}

/* Заглавие */
.mv-split .mv-split-not > b {
    display: block !important;
    margin-bottom: 13px !important;
    padding-left: 4px !important;
    color: #374151 !important;
    font-size: 14px !important;
    font-weight: 750 !important;
}

/* Подсписък */
.mv-split .mv-split-not ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    gap: 8px !important;
}

/* Елементи в "Какво не влиза" */
.mv-split .mv-split-not ul li {
    position: relative !important;
    padding-left: 20px !important;
    color: #6b7280 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* X */
.mv-split .mv-split-not ul li::before {
    content: "×" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    color: #9ca3af !important;
    font-size: 17px !important;
    line-height: 18px !important;
    font-weight: 600 !important;
}

/* ==========================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================== */

.mv-head {
    max-width: 850px !important;
}

.mv-head h2 {
    color: #111827 !important;
    letter-spacing: -0.7px !important;
}

.mv-head p {
    color: #6b7280 !important;
    line-height: 1.7 !important;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 900px) {
    .mv-split {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .mv-split .mv-split-i {
        padding: 26px !important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 640px) {
    .mv-split {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 24px !important;
    }

    .mv-split .mv-split-i {
        padding: 22px 18px !important;
        border-radius: 15px !important;
    }

    .mv-split .mv-split-h {
        margin-bottom: 20px !important;
        padding-bottom: 16px !important;
    }

    .mv-split .mv-split-ic {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
    }

    .mv-split .mv-split-h b {
        font-size: 19px !important;
    }

    .mv-split .mv-split-l {
        gap: 13px !important;
    }

    .mv-split .mv-split-l > li {
        font-size: 13.5px !important;
        line-height: 1.55 !important;
    }

    .mv-split .mv-split-not {
        margin-top: 22px !important;
        padding: 17px !important;
    }
}


/*А ако стане това?*/



/* ==========================================================================
   СВЕТЪЛ ИНТЕРАКТИВЕН ДИЗАЙН — "А АКО СТАНЕ ТОВА?"
   Само за .mv-cases
   ========================================================================== */

.mv-cases {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 34px !important;
}

/* ==========================================================
   CASE CARD
   ========================================================== */

.mv-cases .mv-case {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 20px !important;
    padding: 28px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.055) !important;
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease !important;
}

/* Горна зелена линия */
.mv-cases .mv-case::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 4px !important;
    background: linear-gradient(
        90deg,
        #7cbf00 0%,
        #b9ed59 50%,
        #e5f8c8 100%
    ) !important;
}

/* Светъл glow */
.mv-cases .mv-case::after {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    right: -100px !important;
    top: -100px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.07) !important;
    pointer-events: none !important;
    transition: transform 0.45s ease !important;
}

.mv-cases .mv-case:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.09),
        0 5px 20px rgba(152, 219, 28, 0.08) !important;
}

.mv-cases .mv-case:hover::after {
    transform: scale(1.5) !important;
}

/* ==========================================================
   ВЪПРОС / ЗАГЛАВИЕ
   ========================================================== */

.mv-cases .mv-case-q {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    position: relative !important;
    z-index: 2 !important;
    margin-bottom: 25px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #edf0f2 !important;
}

.mv-cases .mv-case-q b {
    color: #111827 !important;
    font-size: 18px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
    letter-spacing: -0.25px !important;
}

/* Иконка */
.mv-cases .mv-case-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    background: rgba(152, 219, 28, 0.12) !important;
    border: 1px solid rgba(152, 219, 28, 0.24) !important;
    color: #6d9f0b !important;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

.mv-cases .mv-case-ic svg {
    width: 22px !important;
    height: 22px !important;
}

.mv-cases .mv-case:hover .mv-case-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.07) rotate(-3deg) !important;
}

/* ==========================================================
   TIMELINE
   ========================================================== */

.mv-cases .mv-case-a {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    margin: 0 !important;
    padding-left: 4px !important;
}

/* Вертикална линия */
.mv-cases .mv-case-a::before {
    content: "" !important;
    position: absolute !important;
    left: 43px !important;
    top: 14px !important;
    bottom: 14px !important;
    width: 1px !important;
    background: linear-gradient(
        to bottom,
        rgba(152, 219, 28, 0.45),
        #e5e7eb
    ) !important;
}

/* Стъпка */
.mv-cases .mv-case-s {
    display: grid !important;
    grid-template-columns: 78px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 15px !important;
    position: relative !important;
    min-height: 48px !important;
    padding: 6px 0 !important;
    color: #596273 !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
}

/* Времеви маркер */
.mv-cases .mv-case-t {
    position: relative !important;
    z-index: 3 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 28px !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    background: #f3f8e9 !important;
    border: 1px solid rgba(152, 219, 28, 0.28) !important;
    color: #5f8509 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    transition:
        background 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease !important;
}

/* Точка върху timeline */
.mv-cases .mv-case-s::before {
    content: "" !important;
    position: absolute !important;
    left: 35px !important;
    top: 50% !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 0 0 1px rgba(152, 219, 28, 0.35) !important;
    transform: translateY(-50%) !important;
    z-index: 4 !important;
}

.mv-cases .mv-case-s:hover .mv-case-t {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: translateX(3px) !important;
}

/* ==========================================================
   ДОЛЕН ИНФО БЛОК
   ========================================================== */

.mv-cases .mv-case-who {
    position: relative !important;
    z-index: 2 !important;
    margin-top: 22px !important;
    padding: 15px 17px !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    border: 1px solid #e7eaee !important;
    color: #687181 !important;
    font-size: 12.5px !important;
    line-height: 1.55 !important;
    transition:
        background 0.3s ease,
        border-color 0.3s ease !important;
}

.mv-cases .mv-case:hover .mv-case-who {
    background: #f7fbeF !important;
    border-color: rgba(152, 219, 28, 0.25) !important;
}

.mv-cases .mv-case-who b {
    color: #374151 !important;
    font-weight: 750 !important;
}

/* ==========================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================== */

.mv-head {
    max-width: 850px !important;
}

.mv-head h2 {
    color: #111827 !important;
    letter-spacing: -0.7px !important;
}

.mv-head p {
    color: #6b7280 !important;
    line-height: 1.7 !important;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 900px) {
    .mv-cases {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .mv-cases .mv-case {
        padding: 26px !important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 640px) {
    .mv-cases {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 25px !important;
    }

    .mv-cases .mv-case {
        padding: 21px 17px !important;
        border-radius: 16px !important;
    }

    .mv-cases .mv-case-q {
        gap: 11px !important;
        margin-bottom: 20px !important;
        padding-bottom: 16px !important;
    }

    .mv-cases .mv-case-q b {
        font-size: 16px !important;
    }

    .mv-cases .mv-case-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    .mv-cases .mv-case-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    .mv-cases .mv-case-s {
        grid-template-columns: 68px minmax(0, 1fr) !important;
        gap: 13px !important;
        font-size: 13px !important;
    }

    .mv-cases .mv-case-a::before {
        left: 38px !important;
    }

    .mv-cases .mv-case-s::before {
        left: 30px !important;
    }

    .mv-cases .mv-case-t {
        font-size: 10px !important;
        padding: 4px 6px !important;
    }

    .mv-cases .mv-case-who {
        margin-top: 18px !important;
        padding: 13px 14px !important;
        font-size: 12px !important;
    }
}


/*Пакетите едно до друго*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СРАВНЕНИЕ НА ПАКЕТИТЕ
   Само за .mv-tbl
   ========================================================================== */

.mv-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    border-radius: 18px !important;
    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
}

/* Лека зелена светлина отгоре */
.mv-tbl::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent
    ) !important;
}

/* Таблица */
.mv-tbl table {
    width: 100% !important;
    min-width: 720px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    color: #d5d9cf !important;
    background: transparent !important;
}

/* ==========================================================
   HEADER
   ========================================================== */

.mv-tbl thead th {
    position: relative !important;
    padding: 20px 18px !important;
    background: #13180d !important;
    color: #f5f7f2 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.mv-tbl thead th:first-child {
    width: 32% !important;
    border-top-left-radius: 15px !important;
}

.mv-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* Колона Пълен */
.mv-tbl thead th.best {
    color: #a9e83a !important;
    background:
        linear-gradient(
            180deg,
            rgba(152, 219, 28, 0.16),
            rgba(152, 219, 28, 0.055)
        ) !important;
    box-shadow:
        inset 1px 0 rgba(152, 219, 28, 0.18),
        inset -1px 0 rgba(152, 219, 28, 0.18) !important;
}

/* Малък акцент под Пълен */
.mv-tbl thead th.best::after {
    content: "" !important;
    position: absolute !important;
    left: 18px !important;
    right: 18px !important;
    bottom: -1px !important;
    height: 2px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 12px rgba(152, 219, 28, 0.55) !important;
}

/* ==========================================================
   BODY
   ========================================================== */

.mv-tbl tbody td {
    padding: 17px 18px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;
    background: #0d1109 !important;
    transition:
        background 0.25s ease,
        color 0.25s ease !important;
}

/* Име на характеристиката */
.mv-tbl tbody td:first-child {
    color: #f0f2ec !important;
    font-size: 13.5px !important;
}

/* Удебелен текст */
.mv-tbl tbody td:first-child b {
    font-weight: 650 !important;
}

/* Mono стойности */
.mv-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;
    color: #aeb5a5 !important;
    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================
   BEST КОЛОНА
   ========================================================== */

.mv-tbl tbody td.best {
    position: relative !important;
    color: #c9f277 !important;
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.075),
            rgba(152, 219, 28, 0.045)
        ) !important;
    box-shadow:
        inset 1px 0 rgba(152, 219, 28, 0.13),
        inset -1px 0 rgba(152, 219, 28, 0.13) !important;
}

/* ==========================================================
   YES / NO
   ========================================================== */

/* Да */
.mv-tbl tbody td.mono:not(:first-child) {
    color: #aeb5a5 !important;
}

/* Всички "да" да изпъкват леко */
.mv-tbl tbody td.mono {
    transition:
        color 0.25s ease,
        background 0.25s ease !important;
}

/* Празни стойности */
.mv-tbl tbody td.mono:has(+ *) {
    /* Запазва структурата без агресивни промени */
}

/* ==========================================================
   HOVER НА РЕД
   ========================================================== */

.mv-tbl tbody tr {
    transition: transform 0.2s ease !important;
}

.mv-tbl tbody tr:hover td {
    background: #151b10 !important;
    color: #f4f7ed !important;
}

.mv-tbl tbody tr:hover td.best {
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.13),
            rgba(152, 219, 28, 0.075)
        ) !important;
    color: #000000 !important;
}

/* Последен ред */
.mv-tbl tbody tr:last-child td {
    border-bottom: 0 !important;
}

/* Цена */
.mv-tbl tbody tr:last-child td {
    background: #11160c !important;
}

.mv-tbl tbody tr:last-child td b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

.mv-tbl tbody tr:last-child td.best b {
    color: #6aa300  !important;
    text-shadow: 0 0 15px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================
   ПЪРВА КОЛОНА — ЛЕКО ОТДЕЛЕНА
   ========================================================== */

.mv-tbl tbody td:first-child {
    background: #10140d !important;
    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

/* ==========================================================
   SCROLLBAR
   ========================================================== */

.mv-tbl {
    scrollbar-width: thin !important;
    scrollbar-color: #4f671f #11150d !important;
}

.mv-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.mv-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.mv-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.mv-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================== */

.mv-head h2 {
    color: #f5f7f1 !important;
}

.mv-head p {
    color: #8e9689 !important;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 900px) {
    .mv-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .mv-tbl table {
        min-width: 680px !important;
    }

    .mv-tbl thead th,
    .mv-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .mv-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .mv-tbl table {
        min-width: 650px !important;
    }

    .mv-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .mv-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .mv-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .mv-tbl .mono {
        font-size: 11.5px !important;
    }
}


/*naeti-sarvari/Кога си струва, и кога не*/


/* ==========================================================================
   СВЕТЪЛ ПРЕМИУМ ДИЗАЙН — "КОГА СИ СТРУВА, И КОГА НЕ"
   Само за .ded-vs секцията
   ========================================================================== */

.ded-vs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 32px !important;
    align-items: stretch !important;
}

/* ==========================================================
   ОСНОВНИ КАРТИ
   ========================================================== */

.ded-vs .ded-vs-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    padding: 30px !important;
    overflow: hidden !important;

    box-shadow: 0 8px 30px rgba(15, 23, 42, 0.06) !important;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease !important;
}

/* Зелен акцент отгоре */
.ded-vs .ded-vs-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #b8ed54
    ) !important;
}

/* ==========================================================
   КАРТА "САМОСТОЯТЕЛЕН СЪРВЪР"
   ========================================================== */

.ded-vs .ded-vs-i.is-this {
    border-color: rgba(152, 219, 28, 0.28) !important;

    background:
        linear-gradient(
            180deg,
            rgba(152, 219, 28, 0.055) 0%,
            #ffffff 32%
        ) !important;
}

/* ==========================================================
   КАРТА "VPS"
   ========================================================== */

.ded-vs .ded-vs-i:not(.is-this) {
    background:
        linear-gradient(
            180deg,
            rgba(15, 23, 42, 0.025) 0%,
            #ffffff 32%
        ) !important;
}

/* ==========================================================
   HOVER
   ========================================================== */

.ded-vs .ded-vs-i:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.10),
        0 5px 18px rgba(152, 219, 28, 0.08) !important;
}

/* ==========================================================
   ЗАГЛАВНА ЧАСТ
   ========================================================== */

.ded-vs .ded-vs-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 13px !important;

    margin-bottom: 24px !important;
    padding-bottom: 20px !important;

    border-bottom: 1px solid #edf0f2 !important;
}

/* Заглавие */
.ded-vs .ded-vs-h > b {
    font-size: 22px !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    color: #111827 !important;
    letter-spacing: -0.4px !important;
}

/* ==========================================================
   PILL
   ========================================================== */

.ded-vs .pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 30px !important;
    padding: 6px 11px !important;

    border-radius: 999px !important;

    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    letter-spacing: 0.2px !important;

    white-space: nowrap !important;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease !important;
}

/* Pill — тази страница */
.ded-vs .pill.p-rose {
    color: #5f8f00 !important;
    background: rgba(152, 219, 28, 0.13) !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
}

/* Pill — VPS */
.ded-vs .pill.p-muted {
    color: #6b7280 !important;
    background: #f3f4f6 !important;
    border: 1px solid #e5e7eb !important;
}

/* ==========================================================
   СПИСЪК
   ========================================================== */

.ded-vs .ded-vs-l {
    list-style: none !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
}

/* Всеки ред */
.ded-vs .ded-vs-l > li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;

    transition:
        transform 0.25s ease,
        color 0.25s ease !important;
}

/* Hover върху ред */
.ded-vs .ded-vs-l > li:hover {
    transform: translateX(4px) !important;
    color: #1f2937 !important;
}

/* ==========================================================
   BOLD В ТЕКСТА
   ========================================================== */

.ded-vs .ded-vs-l > li > span:last-child b {
    color: #1f2937 !important;
    font-weight: 700 !important;
}

/* ==========================================================
   CHECK / X ИКОНКИ
   ========================================================== */

.ded-vs .ded-d {
    position: relative !important;

    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;

    margin-top: 2px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 50% !important;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

/* SVG */
.ded-vs .ded-d svg {
    width: 12px !important;
    height: 12px !important;
}

/* ==========================================================
   YES
   ========================================================== */

.ded-vs .ded-d.yes {
    color: #72a900 !important;

    background: rgba(152, 219, 28, 0.13) !important;
    border: 1px solid rgba(152, 219, 28, 0.30) !important;
}

/* ==========================================================
   NO
   ========================================================== */

.ded-vs .ded-d.no {
    color: #9ca3af !important;

    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
}

/* Иконката при hover */
.ded-vs .ded-vs-l > li:hover .ded-d {
    transform: scale(1.06) !important;
}

/* Check при hover */
.ded-vs .ded-vs-l > li:hover .ded-d.yes {
    background: #7cbf00 !important;
    color: #172000 !important;
}

/* X при hover */
.ded-vs .ded-vs-l > li:hover .ded-d.no {
    background: #f1f5f9 !important;
    color: #6b7280 !important;
}

/* ==========================================================
   VPS BUTTON
   ========================================================== */

.ded-vs .ded-vs-go {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    align-self: flex-start !important;

    margin-top: auto !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;

    border-radius: 10px !important;

    color: #374151 !important;
    background: #ffffff !important;
    border: 1px solid #dfe3e7 !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        color 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Button hover */
.ded-vs .ded-vs-go:hover {
    transform: translateY(-2px) !important;

    color: #172000 !important;
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;

    box-shadow:
        0 8px 20px rgba(152, 219, 28, 0.18) !important;
}

/* ==========================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================== */

.ded-head {
    max-width: 850px !important;
}

.ded-head h2 {
    color: #111827 !important;
    letter-spacing: -0.7px !important;
}

.ded-head p {
    color: #6b7280 !important;
    line-height: 1.7 !important;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 900px) {

    .ded-vs {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .ded-vs .ded-vs-i {
        padding: 26px !important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 640px) {

    .ded-vs {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 24px !important;
    }

    .ded-vs .ded-vs-i {
        padding: 22px 18px !important;
        border-radius: 15px !important;
    }

    .ded-vs .ded-vs-h {
        margin-bottom: 20px !important;
        padding-bottom: 16px !important;
        align-items: flex-start !important;
    }

    .ded-vs .ded-vs-h > b {
        font-size: 19px !important;
    }

    .ded-vs .pill {
        min-height: 27px !important;
        padding: 5px 9px !important;
        font-size: 10px !important;
    }

    .ded-vs .ded-vs-l {
        gap: 13px !important;
    }

    .ded-vs .ded-vs-l > li {
        font-size: 13.5px !important;
        line-height: 1.55 !important;
    }

    .ded-vs .ded-d {
        width: 20px !important;
        height: 20px !important;
        min-width: 20px !important;
    }

    .ded-vs .ded-vs-go {
        margin-top: 20px !important;
        width: 100% !important;
    }
}

/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .ded-vs .ded-vs-i,
    .ded-vs .ded-vs-l > li,
    .ded-vs .ded-d,
    .ded-vs .ded-vs-go,
    .ded-vs .pill {
        transition: none !important;
    }

    .ded-vs .ded-vs-i:hover,
    .ded-vs .ded-vs-l > li:hover,
    .ded-vs .ded-vs-go:hover {
        transform: none !important;
    }
}

/*naeti-sarvari/Всичко едно до друго*/

/* ==========================================================================
   DED TABLE — GRID CARD DESIGN
   Стил по подобие на .wp-all-l
   ========================================================================== */

/* ==========================================================
   СЕКЦИЯ / ЗАГЛАВИЕ
   ========================================================== */

.ded-head {
    max-width: 850px !important;
}

.ded-head h2 {
    color: #111827 !important;
    letter-spacing: -0.7px !important;
}

.ded-head p {
    color: #6b7280 !important;
    line-height: 1.7 !important;
}


/* ==========================================================
   ОСНОВНА ОБВИВКА
   ========================================================== */

.ded-tbl {
    position: relative !important;

    margin-top: 32px !important;

    width: 100% !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 32px !important;

    padding: 28px !important;

    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.03) !important;

    overflow: hidden !important;
}


/* ==========================================================
   TABLE → GRID
   ========================================================== */

.ded-tbl table {
    width: 100% !important;

    border: 0 !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    table-layout: fixed !important;
}


/* Header не ни е нужен визуално */

.ded-tbl thead {
    display: none !important;
}


/* ==========================================================
   BODY
   ========================================================== */

.ded-tbl tbody {
    display: grid !important;

    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;

    gap: 20px !important;

    width: 100% !important;
}


/* Всеки ред става invisible wrapper */

.ded-tbl tbody tr {
    display: contents !important;
}


/* ==========================================================
   ВСЯКА КЛЕТКА = CARD
   ========================================================== */

.ded-tbl tbody td {
    position: relative !important;

    min-height: 125px !important;

    padding: 24px !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;

    border: 1.5px solid #7cbf00 !important;

    border-radius: 26px !important;

    background: #5E9A000D !important;

    color: #4b5563 !important;

    font-size: 14px !important;

    line-height: 1.5 !important;

    overflow: hidden !important;

    box-shadow:
        0 4px 6px -1px rgba(0, 0, 0, 0.02) !important;

    transition:
        transform .22s cubic-bezier(.2, .9, .2, 1),
        box-shadow .22s,
        border-color .22s,
        background .22s !important;
}


/* ==========================================================
   GREEN DECORATIVE GLOW
   ========================================================== */

.ded-tbl tbody td::before {
    content: "" !important;

    position: absolute !important;

    width: 70px !important;
    height: 70px !important;

    right: -25px !important;
    top: -25px !important;

    border-radius: 50% !important;

    background: rgba(152, 219, 28, 0.10) !important;

    pointer-events: none !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.ded-tbl tbody td:hover {
    transform: translateY(-4px) !important;

    border-color: #69c90e !important;

    background: #ffffff !important;

    box-shadow:
        0 15px 30px rgba(105, 201, 14, 0.12) !important;
}


/* ==========================================================
   LABEL / ПЪРВА КОЛОНА
   ========================================================== */

.ded-tbl tbody td:first-child {
    background:
        linear-gradient(
            135deg,
            #efffd5,
            #f7ffe9
        ) !important;

    border-color: rgba(91, 137, 9, 0.55) !important;

    color: #305a08 !important;
}


/* Label hover */

.ded-tbl tbody td:first-child:hover {
    background: #ffffff !important;

    border-color: #69c90e !important;
}


/* ==========================================================
   LABEL TEXT
   ========================================================== */

.ded-tbl tbody td:first-child b {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    align-items: center !important;

    gap: 9px !important;

    color: #305a08 !important;

    font-size: 14px !important;

    font-weight: 700 !important;

    line-height: 1.35 !important;
}


/* Малка зелена точка */

.ded-tbl tbody td:first-child b::before {
    content: "" !important;

    width: 8px !important;
    height: 8px !important;

    flex: 0 0 8px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 0 5px rgba(152, 219, 28, 0.13) !important;
}


/* ==========================================================
   VALUE TEXT
   ========================================================== */

.ded-tbl tbody td:not(:first-child) {
    color: #374151 !important;

    font-size: 14px !important;

    font-weight: 500 !important;

    white-space: normal !important;

    overflow-wrap: anywhere !important;
}


/* Ако вътре има bold */

.ded-tbl tbody td:not(:first-child) b {
    color: #111827 !important;

    font-weight: 700 !important;
}


/* ==========================================================
   PRICE CARD
   ========================================================== */

.ded-tbl tbody tr:last-child td {
    background:
        linear-gradient(
            135deg,
            #f0ffd9,
            #ffffff
        ) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;
}


.ded-tbl tbody tr:last-child td:hover {
    background: #ffffff !important;

    border-color: #69c90e !important;

    box-shadow:
        0 15px 30px rgba(105, 201, 14, 0.15) !important;
}


/* ==========================================================
   MOBILE SCROLL НЕ Е НУЖЕН
   ========================================================== */

.ded-tbl {
    overflow: visible !important;
}


/* ==========================================================
   TABLET — 2 КАРТИ
   ========================================================== */

@media (max-width: 1024px) {

    .ded-tbl {
        padding: 24px !important;

        border-radius: 28px !important;
    }

    .ded-tbl tbody {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

        gap: 18px !important;
    }

    .ded-tbl tbody td {
        min-height: 115px !important;

        padding: 22px !important;
    }
}


/* ==========================================================
   MOBILE — 1 КАРТА
   ========================================================== */

@media (max-width: 640px) {

    .ded-tbl {
        margin-top: 24px !important;

        padding: 16px !important;

        border-radius: 24px !important;
    }

    .ded-tbl tbody {
        grid-template-columns: 1fr !important;

        gap: 14px !important;
    }

    .ded-tbl tbody td {
        min-height: 90px !important;

        padding: 20px !important;

        border-radius: 21px !important;

        font-size: 13px !important;
    }

    .ded-tbl tbody td:first-child b {
        font-size: 13px !important;
    }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .ded-tbl {
        padding: 12px !important;

        border-radius: 21px !important;
    }

    .ded-tbl tbody {
        gap: 12px !important;
    }

    .ded-tbl tbody td {
        padding: 18px !important;

        border-radius: 19px !important;
    }
}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .ded-tbl tbody td {
        transition: none !important;
    }

    .ded-tbl tbody td:hover {
        transform: none !important;
    }
}


/*добавки*/



/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СЕКЦИЯ "ДОБАВКИ"
   ========================================================================== */

/* ==========================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================== */

section.sec-wash:has(.ded-adds) {
    position: relative !important;

    background: #0b0f08 !important;

    padding: 90px 20px !important;

    color: #f5f7f2 !important;

    overflow: hidden !important;
}


/* Зелен ambient glow */

section.sec-wash:has(.ded-adds)::before {
    content: "" !important;

    position: absolute !important;

    width: 650px !important;
    height: 650px !important;

    left: 50% !important;
    top: 15% !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.075) 0%,
            rgba(152,219,28,0.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================
   WRAPPER
   ========================================================== */

section.sec-wash:has(.ded-adds) .wrap-n {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1180px !important;

    margin: 0 auto !important;
}


/* ==========================================================
   HEAD
   ========================================================== */

section.sec-wash:has(.ded-adds) .ded-head {
    max-width: 760px !important;

    margin: 0 auto 50px !important;

    text-align: center !important;
}


section.sec-wash:has(.ded-adds) .ded-head h2 {
    margin: 0 0 15px !important;

    color: #7cbf00 !important;

    font-size: clamp(30px, 4vw, 44px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec-wash:has(.ded-adds) .ded-head p {
    margin: 0 !important;

    color: #9ca694 !important;

    font-size: 16px !important;

    line-height: 1.65 !important;
}


/* Зелената линия */

section.sec-wash:has(.ded-adds) .ded-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 24px auto 0 !important;

    border-radius: 999px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 18px rgba(152,219,28,0.45) !important;
}


/* ==========================================================
   GRID
   ========================================================== */

.ded-adds {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 18px !important;

    align-items: stretch !important;
}


/* ==========================================================
   ADD CARD
   ========================================================== */

.ded-add {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    justify-content: space-between !important;

    min-height: 190px !important;

    padding: 25px !important;

    overflow: hidden !important;

    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #10140d 100%
        ) !important;

    border: 1px solid rgba(255,255,255,0.08) !important;

    border-radius: 20px !important;

    box-shadow:
        0 18px 45px rgba(0,0,0,0.28),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease !important;
}


/* ==========================================================
   TOP LIGHT LINE
   ========================================================== */

.ded-add::before {
    content: "" !important;

    position: absolute !important;

    left: 15% !important;
    right: 15% !important;
    top: 0 !important;

    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(152,219,28,0.55),
            transparent
        ) !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}


/* ==========================================================
   GREEN GLOW
   ========================================================== */

.ded-add::after {
    content: "" !important;

    position: absolute !important;

    width: 120px !important;
    height: 120px !important;

    right: -65px !important;
    top: -65px !important;

    border-radius: 50% !important;

    background:
        rgba(152,219,28,0.055) !important;

    filter: blur(12px) !important;

    pointer-events: none !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.ded-add:hover {
    transform: translateY(-7px) !important;

    background:
        linear-gradient(
            145deg,
            #192011 0%,
            #11170d 100%
        ) !important;

    border-color:
        rgba(152,219,28,0.38) !important;

    box-shadow:
        0 25px 55px rgba(0,0,0,0.40),
        0 0 30px rgba(152,219,28,0.06) !important;
}


.ded-add:hover::before {
    opacity: 1 !important;
}


/* ==========================================================
   TEXT AREA
   ========================================================== */

.ded-add-t {
    position: relative !important;

    z-index: 2 !important;

    display: flex !important;

    flex-direction: column !important;

    gap: 8px !important;
}


/* ==========================================================
   TITLE
   ========================================================== */

.ded-add-t > b {
    color: #ffffff !important;

    font-size: 17px !important;

    line-height: 1.3 !important;

    font-weight: 750 !important;

    letter-spacing: -.25px !important;
}


/* Малък зелен маркер */

.ded-add-t > b::before {
    content: "" !important;

    display: inline-block !important;

    width: 7px !important;
    height: 7px !important;

    margin-right: 8px !important;

    vertical-align: 2px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 10px rgba(152,219,28,0.35) !important;
}


/* ==========================================================
   DESCRIPTION
   ========================================================== */

.ded-add-t > span {
    color: #8f9888 !important;

    font-size: 13px !important;

    line-height: 1.55 !important;

    max-width: 95% !important;
}


/* ==========================================================
   PRICE
   ========================================================== */

.ded-add-p {
    position: relative !important;

    z-index: 2 !important;

    display: flex !important;

    align-items: baseline !important;

    flex-wrap: wrap !important;

    gap: 5px !important;

    margin-top: 22px !important;

    padding-top: 17px !important;

    border-top:
        1px solid rgba(255,255,255,0.07) !important;

    color: #7cbf00 !important;

    font-size: 22px !important;

    line-height: 1 !important;

    font-weight: 800 !important;

    letter-spacing: -.5px !important;
}


/* /месец */

.ded-add-p > span {
    color: #697264 !important;

    font-size: 11px !important;

    line-height: 1.3 !important;

    font-weight: 500 !important;

    letter-spacing: 0 !important;
}


/* ==========================================================
   FREE
   ========================================================== */

.ded-add-p.free {
    color: #b8ed54 !important;

    font-size: 18px !important;
}


.ded-add-p.free > span {
    color: #7d8876 !important;

    font-size: 11px !important;
}


/* ==========================================================
   FREE CARD — SPECIAL
   ========================================================== */

.ded-add:last-child {
    border-color:
        rgba(152,219,28,0.28) !important;

    background:
        linear-gradient(
            145deg,
            #17200f 0%,
            #10150c 100%
        ) !important;

    box-shadow:
        0 20px 50px rgba(0,0,0,0.30),
        0 0 30px rgba(152,219,28,0.045) !important;
}


.ded-add:last-child::before {
    opacity: 1 !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            #7cbf00,
            transparent
        ) !important;
}


.ded-add:last-child:hover {
    border-color: #7cbf00 !important;

    box-shadow:
        0 28px 60px rgba(0,0,0,0.42),
        0 0 35px rgba(152,219,28,0.10) !important;
}


/* ==========================================================
   TABLET — 2 КАРТИ
   ========================================================== */

@media (max-width: 1024px) {

    section.sec-wash:has(.ded-adds) {
        padding: 75px 20px !important;
    }

    .ded-adds {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 18px !important;
    }

    .ded-add {
        min-height: 180px !important;
    }
}


/* ==========================================================
   MOBILE — 1 КАРТА
   ========================================================== */

@media (max-width: 640px) {

    section.sec-wash:has(.ded-adds) {
        padding: 60px 16px !important;
    }

    section.sec-wash:has(.ded-adds) .ded-head {
        margin-bottom: 36px !important;
    }

    section.sec-wash:has(.ded-adds) .ded-head h2 {
        font-size: 30px !important;
    }

    section.sec-wash:has(.ded-adds) .ded-head p {
        font-size: 14px !important;
    }

    .ded-adds {
        grid-template-columns: 1fr !important;

        gap: 14px !important;
    }

    .ded-add {
        min-height: auto !important;

        padding: 23px 21px !important;

        border-radius: 17px !important;
    }

    .ded-add:hover {
        transform: translateY(-4px) !important;
    }

    .ded-add-t > b {
        font-size: 16px !important;
    }

    .ded-add-t > span {
        font-size: 13px !important;
    }

    .ded-add-p {
        margin-top: 19px !important;

        padding-top: 15px !important;

        font-size: 21px !important;
    }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .ded-add {
        padding: 21px 18px !important;

        border-radius: 15px !important;
    }

    .ded-add-t > b {
        font-size: 15px !important;
    }

    .ded-add-t > span {
        font-size: 12.5px !important;
    }

    .ded-add-p {
        font-size: 20px !important;
    }
}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .ded-add {
        transition: none !important;
    }

    .ded-add:hover {
        transform: none !important;
    }
}

/*Къде стои машината*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КЪДЕ СТОИ МАШИНАТА"
   ========================================================================== */

/* ==========================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================== */

section.sec:has(.ded-dc) {
    position: relative !important;

    background: #ffffff !important;

    padding: 85px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}


/* Лек зелен ambient ефект */

section.sec:has(.ded-dc)::before {
    content: "" !important;

    position: absolute !important;

    width: 520px !important;
    height: 520px !important;

    left: -220px !important;
    top: 10% !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.08) 0%,
            rgba(152,219,28,0.025) 42%,
            transparent 72%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================
   WRAPPER
   ========================================================== */

section.sec:has(.ded-dc) .wrap-w {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1180px !important;

    margin: 0 auto !important;
}


/* ==========================================================
   HEAD
   ========================================================== */

section.sec:has(.ded-dc) .ded-head {
    max-width: 800px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}


section.sec:has(.ded-dc) .ded-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 43px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec:has(.ded-dc) .ded-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент */

section.sec:has(.ded-dc) .ded-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 16px rgba(152,219,28,0.30) !important;
}


/* ==========================================================
   MAIN LAYOUT
   ========================================================== */

.ded-dc {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1.05fr)
        minmax(0, .95fr) !important;

    gap: 22px !important;

    align-items: stretch !important;
}


/* ==========================================================
   LEFT — LOCATION CARD
   ========================================================== */

.ded-dc-box {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-height: 100% !important;

    padding: 34px !important;

    overflow: hidden !important;

    border-radius: 26px !important;

    border: 1.5px solid rgba(91,137,9,0.42) !important;

    background:
        linear-gradient(
            145deg,
            #f5ffe6 0%,
            #ffffff 70%
        ) !important;

    box-shadow:
        0 12px 35px rgba(15,23,42,0.055),
        inset 0 1px 0 rgba(255,255,255,0.8) !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease !important;
}


.ded-dc-box:hover {
    transform: translateY(-5px) !important;

    border-color: #69c90e !important;

    box-shadow:
        0 20px 45px rgba(15,23,42,0.09),
        0 8px 25px rgba(105,201,14,0.08) !important;
}


/* Зелен декоративен glow */

.ded-dc-box::before {
    content: "" !important;

    position: absolute !important;

    width: 230px !important;
    height: 230px !important;

    right: -100px !important;
    top: -100px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.16),
            transparent 68%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================
   LOCATION TITLE
   ========================================================== */

.ded-dc-box h3 {
    position: relative !important;

    z-index: 2 !important;

    margin: 0 0 10px !important;

    color: #111827 !important;

    font-size: 27px !important;

    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -.6px !important;
}


.ded-dc-box h3::before {
    content: "" !important;

    display: inline-block !important;

    width: 10px !important;
    height: 10px !important;

    margin-right: 10px !important;

    vertical-align: 2px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 0 6px rgba(152,219,28,0.14),
        0 0 18px rgba(152,219,28,0.30) !important;
}


/* ==========================================================
   DESCRIPTION
   ========================================================== */

.ded-dc-box > p {
    position: relative !important;

    z-index: 2 !important;

    margin: 0 !important;

    max-width: 570px !important;

    color: #6b7280 !important;

    font-size: 14px !important;

    line-height: 1.65 !important;
}


/* ==========================================================
   LATENCY AREA
   ========================================================== */

.ded-dc-l {
    position: relative !important;

    z-index: 2 !important;

    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0,1fr)) !important;

    gap: 10px !important;

    margin-top: auto !important;

    padding-top: 28px !important;
}


/* ==========================================================
   LATENCY BUBBLES
   ========================================================== */

.ded-dc-r {
    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    gap: 12px !important;

    padding: 14px 15px !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,0.78) !important;

    border: 1px solid #e5e7eb !important;

    box-shadow:
        0 4px 12px rgba(15,23,42,0.025) !important;

    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease !important;
}


.ded-dc-r:hover {
    transform: translateY(-2px) !important;

    border-color:
        rgba(152,219,28,0.55) !important;

    box-shadow:
        0 8px 18px rgba(105,201,14,0.08) !important;
}


/* City */

.ded-dc-r b {
    color: #374151 !important;

    font-size: 12px !important;

    line-height: 1.3 !important;

    font-weight: 650 !important;
}


/* Ping */

.ded-dc-r span {
    flex: 0 0 auto !important;

    padding: 5px 9px !important;

    border-radius: 999px !important;

    background: #f0fdf4 !important;

    border: 1px solid rgba(152,219,28,0.32) !important;

    color: #7cbf00 !important;

    font-size: 11px !important;

    line-height: 1 !important;

    font-weight: 800 !important;
}


/* ==========================================================
   RIGHT — FACTS
   ========================================================== */

.ded-dc-facts {
    display: grid !important;

    grid-template-columns: 1fr 1fr !important;

    gap: 16px !important;

    align-content: stretch !important;
}


/* ==========================================================
   FACT CARD
   ========================================================== */

.ded-dc-f {
    position: relative !important;

    display: flex !important;

    align-items: flex-start !important;

    gap: 14px !important;

    padding: 22px !important;

    border-radius: 20px !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    box-shadow:
        0 8px 25px rgba(15,23,42,0.045) !important;

    transition:
        transform .28s ease,
        border-color .28s ease,
        box-shadow .28s ease,
        background .28s ease !important;
}


.ded-dc-f:hover {
    transform: translateY(-5px) !important;

    border-color:
        rgba(152,219,28,0.50) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fbfff6
        ) !important;

    box-shadow:
        0 16px 35px rgba(15,23,42,0.08),
        0 5px 18px rgba(152,219,28,0.06) !important;
}


/* ==========================================================
   ICON
   ========================================================== */

.ded-dc-ic {
    flex: 0 0 auto !important;

    width: 44px !important;
    height: 44px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    border-radius: 14px !important;

    background:
        rgba(152,219,28,0.12) !important;

    border:
        1px solid rgba(152,219,28,0.24) !important;

    color: #7cbf00 !important;

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease !important;
}


.ded-dc-ic svg {
    width: 21px !important;
    height: 21px !important;
}


.ded-dc-f:hover .ded-dc-ic {
    transform: scale(1.06) !important;

    background: #7cbf00 !important;

    color: #1d2a08 !important;
}


/* ==========================================================
   FACT TEXT
   ========================================================== */

.ded-dc-f > span:last-child {
    display: flex !important;

    flex-direction: column !important;

    gap: 6px !important;
}


.ded-dc-f b {
    color: #111827 !important;

    font-size: 14px !important;

    line-height: 1.35 !important;

    font-weight: 750 !important;
}


.ded-dc-f > span:last-child > span {
    color: #6b7280 !important;

    font-size: 12.5px !important;

    line-height: 1.55 !important;
}


/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 950px) {

    section.sec:has(.ded-dc) {
        padding: 70px 20px !important;
    }

    .ded-dc {
        grid-template-columns: 1fr !important;
    }

    .ded-dc-box {
        min-height: auto !important;
    }

    .ded-dc-l {
        margin-top: 25px !important;
    }

    .ded-dc-facts {
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    }
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 640px) {

    section.sec:has(.ded-dc) {
        padding: 60px 16px !important;
    }

    section.sec:has(.ded-dc) .ded-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.ded-dc) .ded-head h2 {
        font-size: 30px !important;
    }

    section.sec:has(.ded-dc) .ded-head p {
        font-size: 14px !important;
    }

    .ded-dc {
        gap: 14px !important;
    }

    .ded-dc-box {
        padding: 24px 20px !important;

        border-radius: 20px !important;
    }

    .ded-dc-box h3 {
        font-size: 23px !important;
    }

    .ded-dc-box > p {
        font-size: 13px !important;
    }

    .ded-dc-l {
        grid-template-columns: 1fr !important;

        gap: 8px !important;

        padding-top: 22px !important;
    }

    .ded-dc-r {
        padding: 13px 14px !important;
    }

    .ded-dc-facts {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    .ded-dc-f {
        padding: 19px !important;

        border-radius: 17px !important;
    }

    .ded-dc-ic {
        width: 41px !important;
        height: 41px !important;

        border-radius: 12px !important;
    }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .ded-dc-box {
        padding: 21px 17px !important;
    }

    .ded-dc-box h3 {
        font-size: 21px !important;
    }

    .ded-dc-f {
        padding: 17px !important;
    }

    .ded-dc-f b {
        font-size: 13px !important;
    }

    .ded-dc-f > span:last-child > span {
        font-size: 12px !important;
    }
}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .ded-dc-box,
    .ded-dc-f,
    .ded-dc-r,
    .ded-dc-ic {
        transition: none !important;
    }

    .ded-dc-box:hover,
    .ded-dc-f:hover,
    .ded-dc-r:hover {
        transform: none !important;
    }
}

/*proverka-na-domeyn/Какво влиза в цената*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАКВО ВЛИЗА В ЦЕНАТА"
   ========================================================================== */

/* ==========================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================== */

section.sec:has(.dwhy) {
    position: relative !important;

    background: #ffffff !important;

    padding: 85px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}


/* Лек зелен ambient glow */

section.sec:has(.dwhy)::before {
    content: "" !important;

    position: absolute !important;

    width: 600px !important;
    height: 600px !important;

    left: 50% !important;
    top: 0 !important;

    transform: translateX(-50%) !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.055) 0%,
            rgba(152,219,28,0.018) 40%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================
   WRAPPER
   ========================================================== */

section.sec:has(.dwhy) .wrap-w {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1180px !important;

    margin: 0 auto !important;
}


/* ==========================================================
   HEADER
   ========================================================== */

section.sec:has(.dwhy) .dsec-head {
    max-width: 800px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}


section.sec:has(.dwhy) .dsec-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 43px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec:has(.dwhy) .dsec-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент под заглавието */

section.sec:has(.dwhy) .dsec-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 999px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 17px rgba(152,219,28,0.30) !important;
}


/* ==========================================================
   GRID — 4 КАРТИ
   ========================================================== */

.dwhy {
    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;

    gap: 18px !important;

    align-items: stretch !important;
}


/* ==========================================================
   CARD
   ========================================================== */

.dwhy-i {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-height: 250px !important;

    padding: 25px !important;

    overflow: hidden !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfcfa 100%
        ) !important;

    border: 1.5px solid #e5e7eb !important;

    border-radius: 22px !important;

    box-shadow:
        0 8px 25px rgba(15,23,42,0.045),
        inset 0 1px 0 rgba(255,255,255,0.9) !important;

    transition:
        transform .3s cubic-bezier(.2,.9,.2,1),
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}


/* Горна зелена линия */

.dwhy-i::before {
    content: "" !important;

    position: absolute !important;

    left: 18% !important;
    right: 18% !important;

    top: 0 !important;

    height: 3px !important;

    border-radius: 0 0 999px 999px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(152,219,28,0.65),
            transparent
        ) !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}


/* ==========================================================
   DECORATIVE GLOW
   ========================================================== */

.dwhy-i::after {
    content: "" !important;

    position: absolute !important;

    width: 130px !important;
    height: 130px !important;

    right: -70px !important;
    top: -70px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.10),
            transparent 68%
        ) !important;

    pointer-events: none !important;

    transition:
        transform .35s ease,
        opacity .35s ease !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.dwhy-i:hover {
    transform: translateY(-7px) !important;

    border-color:
        rgba(105,201,14,0.50) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fafff4 100%
        ) !important;

    box-shadow:
        0 20px 42px rgba(15,23,42,0.08),
        0 6px 20px rgba(105,201,14,0.07) !important;
}


.dwhy-i:hover::before {
    opacity: 1 !important;
}


.dwhy-i:hover::after {
    transform: scale(1.25) !important;
}


/* ==========================================================
   ICON
   ========================================================== */

.dwhy-ic {
    position: relative !important;

    z-index: 2 !important;

    width: 50px !important;
    height: 50px !important;

    min-width: 50px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 22px !important;

    border-radius: 15px !important;

    background:
        rgba(152,219,28,0.12) !important;

    border:
        1px solid rgba(152,219,28,0.25) !important;

    color: #7cbf00 !important;

    box-shadow:
        0 5px 14px rgba(152,219,28,0.07) !important;

    transition:
        transform .28s ease,
        background .28s ease,
        color .28s ease,
        box-shadow .28s ease !important;
}


.dwhy-ic svg {
    width: 23px !important;
    height: 23px !important;
}


.dwhy-i:hover .dwhy-ic {
    transform: scale(1.07) rotate(-2deg) !important;

    background: #7cbf00 !important;

    color: #1c2907 !important;

    box-shadow:
        0 7px 18px rgba(152,219,28,0.20) !important;
}


/* ==========================================================
   TITLE
   ========================================================== */

.dwhy-i > b {
    position: relative !important;

    z-index: 2 !important;

    display: block !important;

    margin-bottom: 9px !important;

    color: #111827 !important;

    font-size: 16px !important;

    line-height: 1.35 !important;

    font-weight: 750 !important;

    letter-spacing: -.2px !important;
}


/* ==========================================================
   DESCRIPTION
   ========================================================== */

.dwhy-i > p {
    position: relative !important;

    z-index: 2 !important;

    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 13px !important;

    line-height: 1.6 !important;
}


/* ==========================================================
   SMALL GREEN NUMBER / MARKER
   ========================================================== */

.dwhy-i:nth-child(1)::marker,
.dwhy-i:nth-child(2)::marker,
.dwhy-i:nth-child(3)::marker,
.dwhy-i:nth-child(4)::marker {
    color: #7cbf00 !important;
}


/* ==========================================================
   ЛЕКО РАЗЛИЧИЕ МЕЖДУ КАРТИТЕ
   ========================================================== */

.dwhy-i:nth-child(1) {
    border-color:
        rgba(152,219,28,0.28) !important;
}

.dwhy-i:nth-child(1) .dwhy-ic {
    background:
        rgba(152,219,28,0.15) !important;
}


/* ==========================================================
   TABLET — 2 × 2
   ========================================================== */

@media (max-width: 1024px) {

    section.sec:has(.dwhy) {
        padding: 75px 20px !important;
    }

    .dwhy {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 18px !important;
    }

    .dwhy-i {
        min-height: 225px !important;
    }
}


/* ==========================================================
   MOBILE — 1 КОЛОНА
   ========================================================== */

@media (max-width: 640px) {

    section.sec:has(.dwhy) {
        padding: 60px 16px !important;
    }

    section.sec:has(.dwhy) .dsec-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.dwhy) .dsec-head h2 {
        font-size: 30px !important;
    }

    section.sec:has(.dwhy) .dsec-head p {
        font-size: 14px !important;
    }

    .dwhy {
        grid-template-columns: 1fr !important;

        gap: 13px !important;
    }

    .dwhy-i {
        min-height: auto !important;

        padding: 22px !important;

        border-radius: 18px !important;
    }

    .dwhy-ic {
        width: 45px !important;
        height: 45px !important;

        min-width: 45px !important;

        margin-bottom: 18px !important;

        border-radius: 13px !important;
    }

    .dwhy-i > b {
        font-size: 15px !important;
    }

    .dwhy-i > p {
        font-size: 13px !important;
    }

    .dwhy-i:hover {
        transform: translateY(-4px) !important;
    }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .dwhy-i {
        padding: 20px 18px !important;

        border-radius: 16px !important;
    }

    .dwhy-ic {
        width: 42px !important;
        height: 42px !important;

        min-width: 42px !important;
    }

    .dwhy-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    .dwhy-i > b {
        font-size: 14px !important;
    }

    .dwhy-i > p {
        font-size: 12.5px !important;
    }
}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .dwhy-i,
    .dwhy-ic {
        transition: none !important;
    }

    .dwhy-i:hover {
        transform: none !important;
    }
}

/*proverka-na-domeyn/faq*/

/* ==========================================================================
   FAQ — СВЕТЪЛ PREMIUM ДИЗАЙН
   Директно за .dfaq секцията
   ========================================================================== */


/* ==========================================================
   FAQ GRID — 2 КОЛОНИ
   ========================================================== */

.dfaq {
    display: grid !important;

    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 20px !important;

    margin-top: 40px !important;

    width: 100% !important;
}


/* ==========================================================
   FAQ КАРТИ
   ========================================================== */

.dfaq .dfaq-i {
    position: relative !important;

    display: block !important;

    width: 100% !important;

    box-sizing: border-box !important;

    background: #ffffff !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;

    border-radius: 16px !important;

    padding: 28px 25px !important;

    cursor: pointer !important;

    overflow: hidden !important;

    box-shadow:
        0 4px 15px rgba(48, 90, 8, 0.03) !important;

    transition:
        transform .4s cubic-bezier(.165,.84,.44,1),
        box-shadow .4s ease,
        border-color .4s ease,
        background .4s ease !important;
}


/* ==========================================================
   ЗЕЛЕНА ЛИНИЯ ОТГОРЕ
   ========================================================== */

.dfaq .dfaq-i::before {
    content: "" !important;

    position: absolute !important;

    left: 20px !important;

    right: 20px !important;

    top: 0 !important;

    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            #7cbf00,
            transparent
        ) !important;

    border-radius: 0 0 10px 10px !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}


/* ==========================================================
   ЛЕК GREEN GLOW
   ========================================================== */

.dfaq .dfaq-i::after {
    content: "" !important;

    position: absolute !important;

    width: 180px !important;

    height: 180px !important;

    right: -100px !important;

    top: -100px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.10) 0%,
            rgba(152,219,28,.035) 40%,
            transparent 70%
        ) !important;

    pointer-events: none !important;

    transition: transform .4s ease !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.dfaq .dfaq-i:hover {
    transform: translateY(-5px) !important;

    border-color:
        rgba(105, 201, 14, 0.55) !important;

    box-shadow:
        0 16px 30px rgba(48, 90, 8, 0.08),
        0 5px 18px rgba(152, 219, 28, 0.05) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fcfff8 100%
        ) !important;
}


.dfaq .dfaq-i:hover::before {
    opacity: 1 !important;
}


.dfaq .dfaq-i:hover::after {
    transform: scale(1.25) !important;
}


/* ==========================================================
   OPEN STATE
   ========================================================== */

.dfaq .dfaq-i.is-open {
    border-color:
        rgba(105, 201, 14, 0.55) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fafff5 100%
        ) !important;

    box-shadow:
        0 16px 32px rgba(48, 90, 8, 0.08),
        0 5px 20px rgba(152, 219, 28, 0.07) !important;
}


.dfaq .dfaq-i.is-open::before {
    opacity: 1 !important;
}


/* ==========================================================
   ЦЕНА / BADGE
   ========================================================== */

.dfaq .dfaq-n {
    position: relative !important;

    z-index: 2 !important;

    display: inline-flex !important;

    align-items: center !important;

    width: fit-content !important;

    box-sizing: border-box !important;

    margin: 0 0 12px !important;

    padding: 5px 11px !important;

    border-radius: 20px !important;

    background:
        rgba(183, 255, 53, 0.20) !important;

    border:
        1px solid rgba(152, 219, 28, 0.30) !important;

    color: #305a08 !important;

    font-size: 11px !important;

    line-height: 1.2 !important;

    font-weight: 700 !important;

    letter-spacing: .04em !important;

    text-transform: uppercase !important;
}


/* ==========================================================
   ЗАГЛАВИЕ / ВЪПРОС
   ========================================================== */

.dfaq .dfaq-i h3 {
    position: relative !important;

    z-index: 2 !important;

    margin: 0 !important;

    padding: 0 35px 0 0 !important;

    color: #1a2e05 !important;

    font-size: 1.15rem !important;

    line-height: 1.4 !important;

    font-weight: 700 !important;

    letter-spacing: -.2px !important;
}


/* ==========================================================
   PLUS
   ========================================================== */

.dfaq .dfaq-i h3::after {
    content: "+" !important;

    position: absolute !important;

    right: 0 !important;

    top: 50% !important;

    width: 29px !important;

    height: 29px !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    transform: translateY(-50%) !important;

    box-sizing: border-box !important;

    border-radius: 50% !important;

    background:
        rgba(152, 219, 28, 0.10) !important;

    border:
        1px solid rgba(152, 219, 28, 0.25) !important;

    color: #305a08 !important;

    font-size: 21px !important;

    line-height: 1 !important;

    font-weight: 400 !important;

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease !important;
}


/* ==========================================================
   OPEN — X
   ========================================================== */

.dfaq .dfaq-i.is-open h3::after {
    transform:
        translateY(-50%) rotate(45deg) !important;

    background: #7cbf00 !important;

    border-color: #7cbf00 !important;

    color: #1a2e05 !important;
}


/* ==========================================================
   ОТГОВОР
   ========================================================== */

.dfaq .dfaq-i p {
    position: relative !important;

    z-index: 2 !important;

    display: block !important;

    max-height: 0 !important;

    overflow: hidden !important;

    opacity: 0 !important;

    margin: 0 !important;

    padding: 0 !important;

    color: #4a5c3a !important;

    font-size: .95rem !important;

    line-height: 1.65 !important;

    transition:
        max-height .4s cubic-bezier(.165,.84,.44,1),
        opacity .3s ease,
        margin-top .3s ease !important;
}


/* ==========================================================
   ОТВОРЕН ОТГОВОР
   ========================================================== */

.dfaq .dfaq-i.is-open p {
    max-height: 500px !important;

    opacity: 1 !important;

    margin-top: 14px !important;
}


/* ==========================================================
   BOLD В ОТГОВОРА
   ========================================================== */

.dfaq .dfaq-i p b {
    color: #305a08 !important;

    font-weight: 700 !important;
}


/* ==========================================================
   HEADER НА СЕКЦИЯТА
   ========================================================== */

.dsec-head {
    max-width: 760px !important;

    margin: 0 auto !important;

    text-align: center !important;
}


.dsec-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 43px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


.dsec-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелената чертичка */

.dsec-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;

    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 18px rgba(152,219,28,.35) !important;
}


/* ==========================================================
   СЕКЦИЯ
   ========================================================== */

.sec.sec-wash {
    position: relative !important;

    background: #ffffff !important;

    padding: 85px 20px !important;

    overflow: hidden !important;
}


/* ==========================================================
   TABLET — 2 КАРТИ
   ========================================================== */

@media (max-width: 900px) {

    .dfaq {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 16px !important;
    }

    .dfaq .dfaq-i {
        padding: 24px 21px !important;
    }

}


/* ==========================================================
   MOBILE — 1 КАРТА
   ========================================================== */

@media (max-width: 640px) {

    .sec.sec-wash {
        padding: 60px 16px !important;
    }

    .dsec-head {
        margin-bottom: 0 !important;
    }

    .dsec-head h2 {
        font-size: 30px !important;
    }

    .dsec-head p {
        font-size: 14px !important;
    }

    .dfaq {
        grid-template-columns: 1fr !important;

        gap: 12px !important;

        margin-top: 32px !important;
    }

    .dfaq .dfaq-i {
        padding: 22px 19px !important;

        border-radius: 16px !important;
    }

    .dfaq .dfaq-i h3 {
        font-size: 15px !important;

        line-height: 1.4 !important;

        padding-right: 34px !important;
    }

    .dfaq .dfaq-i p {
        font-size: 13px !important;

        line-height: 1.6 !important;
    }

    .dfaq .dfaq-n {
        font-size: 10px !important;
    }

    .dfaq .dfaq-i h3::after {
        width: 27px !important;
        height: 27px !important;

        font-size: 19px !important;
    }

}


/* ==========================================================
   VERY SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .dfaq .dfaq-i {
        padding: 20px 17px !important;
    }

    .dfaq .dfaq-i h3 {
        font-size: 14px !important;
    }

    .dfaq .dfaq-i p {
        font-size: 12.5px !important;
    }

}

/*biskvitki/*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "ПОЛИТИКА ЗА БИСКВИТКИ"
   ========================================================================== */

/* Основна секция */
section.sec:has(.prose) {
    background: #f8faf7 !important;
    padding: 80px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Основен контейнер */
section.sec:has(.prose) .wrap-n {
    position: relative !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* Декоративен светлинен фон */
section.sec:has(.prose)::before {
    content: "" !important;
    position: absolute !important;
    width: 520px !important;
    height: 520px !important;
    top: -180px !important;
    right: -160px !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.09) 0%,
        rgba(152, 219, 28, 0.035) 38%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.prose) h1 {
    position: relative !important;
    margin: 0 0 12px !important;
    color: #111827 !important;
    font-size: clamp(32px, 5vw, 46px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1.2px !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.prose) h1::after {
    content: "" !important;
    display: block !important;
    width: 48px !important;
    height: 4px !important;
    margin-top: 20px !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 14px rgba(152, 219, 28, 0.25) !important;
}

/* Lead текст */
section.sec:has(.prose) > .wrap-n > .lead {
    margin: 0 0 42px !important;
    color: #6b7280 !important;
    font-size: 17px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   ОСНОВЕН PROSE БЛОК
   ========================================================================== */

section.sec:has(.prose) .prose {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 26px !important;
    padding: 38px !important;
    box-shadow:
        0 12px 35px rgba(15, 23, 42, 0.045),
        0 2px 8px rgba(15, 23, 42, 0.025) !important;
}

/* Зелената линия в горната част */
section.sec:has(.prose) .prose::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 4px !important;
    border-radius: 26px 26px 0 0 !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c2ef67,
        #7cbf00
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЯ В CONTENT
   ========================================================================== */

section.sec:has(.prose) .prose h2 {
    margin: 0 0 18px !important;
    color: #172000 !important;
    font-size: 22px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    letter-spacing: -0.4px !important;
}

/* Разстояние между отделните секции */
section.sec:has(.prose) .prose h2:not(:first-child) {
    margin-top: 38px !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.prose) .prose p {
    margin: 0 !important;
    color: #4b5563 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

section.sec:has(.prose) .prose p + p {
    margin-top: 14px !important;
}

/* ==========================================================================
   ТАБЛИЦА
   ========================================================================== */

section.sec:has(.prose) .cmp {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: 0 5px 18px rgba(15, 23, 42, 0.035) !important;
}

/* Header */
section.sec:has(.prose) .cmp thead th {
    padding: 16px 18px !important;
    background: #f4f8ee !important;
    color: #305a08 !important;
    border-bottom: 1px solid rgba(152, 219, 28, 0.25) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    letter-spacing: .5px !important;
}

/* Клетки */
section.sec:has(.prose) .cmp tbody td {
    padding: 18px !important;
    color: #4b5563 !important;
    background: #ffffff !important;
    border-bottom: 1px solid #eef0ec !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    vertical-align: middle !important;
}

/* Последен ред */
section.sec:has(.prose) .cmp tbody tr:last-child td {
    border-bottom: 0 !important;
}

/* Име на бисквитката */
section.sec:has(.prose) .cmp tbody td:first-child {
    color: #1a2e05 !important;
    font-weight: 750 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}

/* Срок */
section.sec:has(.prose) .cmp tbody td:last-child {
    color: #6b7280 !important;
    white-space: nowrap !important;
}

/* Hover върху ред */
section.sec:has(.prose) .cmp tbody tr {
    transition: background .2s ease !important;
}

section.sec:has(.prose) .cmp tbody tr:hover td {
    background: #fbfef8 !important;
}

/* ==========================================================================
   АКЦЕНТНИ ПАРАГРАФИ
   ========================================================================== */

section.sec:has(.prose) .prose h2 + p {
    position: relative !important;
    padding: 17px 20px !important;
    background: #f7faF4 !important;
    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 14px !important;
}

/* Ляв зелен акцент */
section.sec:has(.prose) .prose h2 + p::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 13px !important;
    bottom: 13px !important;
    width: 3px !important;
    border-radius: 5px !important;
    background: #7cbf00 !important;
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 700px) {

    section.sec:has(.prose) {
        padding: 60px 16px !important;
    }

    section.sec:has(.prose) h1 {
        font-size: 32px !important;
        letter-spacing: -.8px !important;
    }

    section.sec:has(.prose) > .wrap-n > .lead {
        font-size: 15px !important;
        margin-bottom: 30px !important;
    }

    section.sec:has(.prose) .prose {
        padding: 25px 18px !important;
        border-radius: 20px !important;
    }

    section.sec:has(.prose) .prose h2 {
        font-size: 20px !important;
    }

    section.sec:has(.prose) .prose h2:not(:first-child) {
        margin-top: 30px !important;
    }

    /* Таблицата става по-компактна */
    section.sec:has(.prose) .cmp {
        font-size: 13px !important;
    }

    section.sec:has(.prose) .cmp thead th,
    section.sec:has(.prose) .cmp tbody td {
        padding: 14px 12px !important;
    }

    section.sec:has(.prose) .cmp thead th {
        font-size: 10px !important;
    }

    section.sec:has(.prose) .cmp tbody td {
        font-size: 12.5px !important;
    }

    section.sec:has(.prose) .cmp tbody td:last-child {
        white-space: normal !important;
    }

    section.sec:has(.prose) .prose p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }
}

/*gdpr/*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — GDPR СЕКЦИЯ
   Работи директно със съществуващия HTML
   ========================================================================== */

/* Основна секция */
section.sec:has(.prose) {
    position: relative !important;
    background: #f8faf7 !important;
    padding: 80px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Декоративен зелен glow */
section.sec:has(.prose)::before {
    content: "" !important;
    position: absolute !important;
    width: 560px !important;
    height: 560px !important;
    top: -220px !important;
    right: -180px !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.10) 0%,
        rgba(152, 219, 28, 0.035) 38%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

/* Втори лек glow */
section.sec:has(.prose)::after {
    content: "" !important;
    position: absolute !important;
    width: 420px !important;
    height: 420px !important;
    left: -220px !important;
    bottom: -180px !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.055) 0%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.prose) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.prose) h1 {
    margin: 0 0 12px !important;
    color: #111827 !important;
    font-size: clamp(34px, 5vw, 48px) !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    letter-spacing: -1.3px !important;
}

/* Зелен акцент */
section.sec:has(.prose) h1::after {
    content: "" !important;
    display: block !important;
    width: 48px !important;
    height: 4px !important;
    margin-top: 20px !important;
    border-radius: 999px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c1ed67
    ) !important;
    box-shadow: 0 4px 15px rgba(152, 219, 28, 0.25) !important;
}

/* Подзаглавие */
section.sec:has(.prose) > .wrap-n > .lead {
    margin: 0 0 42px !important;
    color: #6b7280 !important;
    font-size: 17px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   ОСНОВЕН ДОКУМЕНТ
   ========================================================================== */

section.sec:has(.prose) .prose {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 26px !important;
    padding: 40px !important;
    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.055),
        0 3px 10px rgba(15, 23, 42, 0.025) !important;
}

/* Светла зелена линия отгоре */
section.sec:has(.prose) .prose::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 4px !important;
    border-radius: 26px 26px 0 0 !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c5ef70,
        #7cbf00
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЯ
   ========================================================================== */

section.sec:has(.prose) .prose h2 {
    position: relative !important;
    margin: 0 0 16px !important;
    padding-left: 17px !important;
    color: #172000 !important;
    font-size: 22px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
    letter-spacing: -0.4px !important;
}

/* Малка зелена черта пред всяко заглавие */
section.sec:has(.prose) .prose h2::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 3px !important;
    bottom: 3px !important;
    width: 4px !important;
    border-radius: 5px !important;
    background: #7cbf00 !important;
}

/* Разстояние между отделните блокове */
section.sec:has(.prose) .prose h2:not(:first-child) {
    margin-top: 38px !important;
}

/* ==========================================================================
   ОСНОВЕН ТЕКСТ
   ========================================================================== */

section.sec:has(.prose) .prose p {
    margin: 0 !important;
    color: #4b5563 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

/* Bold */
section.sec:has(.prose) .prose p b,
section.sec:has(.prose) .prose p strong {
    color: #273507 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   LEGAL WARNING
   ========================================================================== */

section.sec:has(.prose) .prose .legal-warn {
    position: relative !important;
    margin: 0 0 38px !important;
    padding: 18px 20px 18px 22px !important;
    background: #fffbea !important;
    border: 1px solid #f1df9b !important;
    border-radius: 15px !important;
    color: #66551a !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    box-shadow: 0 5px 16px rgba(120, 95, 20, 0.035) !important;
}

/* Ляв акцент на предупреждението */
section.sec:has(.prose) .prose .legal-warn::before {
    content: "!" !important;
    position: absolute !important;
    left: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 26px !important;
    height: 26px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #f4df82 !important;
    color: #66551a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Място за иконата */
section.sec:has(.prose) .prose .legal-warn {
    padding-left: 56px !important;
}

/* Текст в предупреждението */
section.sec:has(.prose) .prose .legal-warn strong {
    color: #554600 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ВИЗУАЛНО ОТДЕЛЯНЕ НА ПАРАГРАФИТЕ
   ========================================================================== */

section.sec:has(.prose) .prose h2 + p {
    padding: 18px 20px !important;
    background: #fbfdf9 !important;
    border: 1px solid #edf1e9 !important;
    border-radius: 14px !important;
    transition:
        border-color .25s ease,
        background .25s ease,
        transform .25s ease,
        box-shadow .25s ease !important;
}

/* Hover на информационния блок */
section.sec:has(.prose) .prose h2 + p:hover {
    background: #ffffff !important;
    border-color: rgba(152, 219, 28, 0.32) !important;
    transform: translateX(3px) !important;
    box-shadow: 0 8px 22px rgba(48, 90, 8, 0.045) !important;
}

/* ==========================================================================
   МАЛЪК GREEN ACCENT ВЪРХУ БЛОКОВЕТЕ
   ========================================================================== */

section.sec:has(.prose) .prose h2 + p::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec:has(.prose) {
        padding: 65px 18px !important;
    }

    section.sec:has(.prose) .prose {
        padding: 30px !important;
        border-radius: 22px !important;
    }

    section.sec:has(.prose) .prose h2 {
        font-size: 21px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec:has(.prose) {
        padding: 55px 15px !important;
    }

    section.sec:has(.prose) h1 {
        font-size: 32px !important;
        letter-spacing: -.8px !important;
    }

    section.sec:has(.prose) > .wrap-n > .lead {
        font-size: 14px !important;
        margin-bottom: 28px !important;
    }

    section.sec:has(.prose) .prose {
        padding: 24px 17px !important;
        border-radius: 19px !important;
    }

    section.sec:has(.prose) .prose h2 {
        font-size: 19px !important;
        padding-left: 14px !important;
    }

    section.sec:has(.prose) .prose h2:not(:first-child) {
        margin-top: 28px !important;
    }

    section.sec:has(.prose) .prose p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.prose) .prose h2 + p {
        padding: 15px 16px !important;
    }

    section.sec:has(.prose) .prose .legal-warn {
        padding: 16px 16px 16px 51px !important;
        margin-bottom: 30px !important;
        font-size: 13px !important;
    }

    section.sec:has(.prose) .prose .legal-warn::before {
        left: 14px !important;
        width: 25px !important;
        height: 25px !important;
    }
}
/*ssl-sertifikati/Какво не значи катинарчето*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАКВО НЕ ЗНАЧИ КАТИНАРЧЕТО"
   ========================================================================== */

/* Основна секция */
#myth {
    position: relative !important;
    background: #ffffff !important;
    padding: 80px 20px !important;
    overflow: hidden !important;
}

/* Лек декоративен зелен фон */
#myth::before {
    content: "" !important;
    position: absolute !important;
    width: 520px !important;
    height: 520px !important;
    left: 50% !important;
    top: 20% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.07) 0%,
        rgba(152, 219, 28, 0.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

#myth .wrap-w {
    position: relative !important;
    z-index: 1 !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

#myth .sl-head {
    max-width: 820px !important;
    margin: 0 auto 45px !important;
    text-align: center !important;
}

#myth .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

#myth .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}


/* Малък зелен акцент */
#myth .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 22px auto 0 !important;
    border-radius: 999px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 14px rgba(152, 219, 28, 0.25) !important;
}


/* ==========================================================================
   ДВЕТЕ КАРТИ
   ========================================================================== */

#myth .sl-myth {
    display: grid !important;
    grid-template-columns: minmax(0,.62fr) minmax(0,.62fr) minmax(0,1.76fr) !important;
    gap: 22px !important;
    align-items: stretch !important;
}


/* Основна карта */
#myth .sl-myth-i {
    position: relative !important;
    overflow: hidden !important;
    padding: 30px !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    box-shadow:
        0 8px 28px rgba(15, 23, 42, 0.05),
        0 2px 6px rgba(15, 23, 42, 0.025) !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease,
        background .3s ease !important;
}


/* Цветна линия отгоре */
#myth .sl-myth-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 4px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #b8ed54
    ) !important;
}


/* Hover */
#myth .sl-myth-i:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow:
        0 20px 45px rgba(15, 23, 42, 0.09),
        0 6px 18px rgba(152, 219, 28, 0.08) !important;
}


/* ==========================================================================
   КАРТА "НЕ"
   ========================================================================== */

#myth .sl-myth-i.no {
    background:
        linear-gradient(
            180deg,
            rgba(249, 250, 251, 0.95) 0%,
            #ffffff 38%
        ) !important;
}

#myth .sl-myth-i.no::before {
    background: linear-gradient(
        90deg,
        #d1d5db,
        #e5e7eb
    ) !important;
}


/* ==========================================================================
   КАРТА "ДА"
   ========================================================================== */

#myth .sl-myth-i.yes {
    border-color: rgba(152, 219, 28, 0.3) !important;
    background:
        linear-gradient(
            180deg,
            rgba(152, 219, 28, 0.055) 0%,
            #ffffff 38%
        ) !important;
}


/* ==========================================================================
   ЗАГЛАВНА ЧАСТ НА КАРТИТЕ
   ========================================================================== */

#myth .sl-myth-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 24px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #edf0f2 !important;
}

#myth .sl-myth-h b {
    color: #111827 !important;
    font-size: 21px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    letter-spacing: -0.35px !important;
}


/* ==========================================================================
   ИКОНКА
   ========================================================================== */

#myth .sl-myth-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 14px !important;

    background: rgba(152, 219, 28, 0.12) !important;
    color: #5f9008 !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

#myth .sl-myth-ic svg {
    width: 22px !important;
    height: 22px !important;
}


/* Иконка при hover */
#myth .sl-myth-i:hover .sl-myth-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}


/* ==========================================================================
   СПИСЪК
   ========================================================================== */

#myth .sl-myth-l {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}


/* Всеки ред */
#myth .sl-myth-l > li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;

    transition:
        transform .25s ease,
        color .25s ease !important;
}


/* Hover върху ред */
#myth .sl-myth-l > li:hover {
    transform: translateX(4px) !important;
    color: #1f2937 !important;
}


/* ==========================================================================
   ТОЧКИ
   ========================================================================== */

#myth .sl-myth-l > li > i {
    position: relative !important;

    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;

    margin-top: 2px !important;

    border-radius: 50% !important;

    background: rgba(152, 219, 28, 0.12) !important;
    border: 1px solid rgba(152, 219, 28, 0.28) !important;
}


/* Зелен check */
#myth .sl-myth-i.yes .sl-myth-l > li > i::after {
    content: "" !important;

    position: absolute !important;

    width: 7px !important;
    height: 4px !important;

    left: 5px !important;
    top: 5px !important;

    border-left: 2px solid #72a900 !important;
    border-bottom: 2px solid #72a900 !important;

    transform: rotate(-45deg) !important;
}


/* X за "НЕ" */
#myth .sl-myth-i.no .sl-myth-l > li > i {
    background: #f8fafc !important;
    border-color: #e5e7eb !important;
}

#myth .sl-myth-i.no .sl-myth-l > li > i::before,
#myth .sl-myth-i.no .sl-myth-l > li > i::after {
    content: "" !important;
    position: absolute !important;

    width: 8px !important;
    height: 1.5px !important;

    left: 5px !important;
    top: 9px !important;

    background: #9ca3af !important;
    border-radius: 2px !important;
}

#myth .sl-myth-i.no .sl-myth-l > li > i::before {
    transform: rotate(45deg) !important;
}

#myth .sl-myth-i.no .sl-myth-l > li > i::after {
    transform: rotate(-45deg) !important;
}


/* Bold текст */
#myth .sl-myth-l b {
    color: #1f2937 !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   ФИНАЛНО СЪОБЩЕНИЕ
   ========================================================================== */

#myth .sl-myth-end {
    position: relative !important;

    margin-top: 24px !important;
    padding: 20px 24px 20px 27px !important;

    border-radius: 17px !important;

    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;

    color: #6b7280 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;

    box-shadow: 0 5px 18px rgba(15, 23, 42, 0.025) !important;
}


/* Зелената вертикална линия */
#myth .sl-myth-end::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 14px !important;
    bottom: 14px !important;

    width: 4px !important;

    border-radius: 0 5px 5px 0 !important;

    background: #7cbf00 !important;
}


/* Bold във финалния блок */
#myth .sl-myth-end b {
    color: #1f2937 !important;
    font-weight: 800 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    #myth {
        padding: 65px 20px !important;
    }

    #myth .sl-myth {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    #myth .sl-myth-i {
        padding: 26px !important;
    }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    #myth {
        padding: 55px 16px !important;
    }

    #myth .sl-head {
        margin-bottom: 32px !important;
    }

    #myth .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    #myth .sl-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    #myth .sl-myth {
        gap: 15px !important;
    }

    #myth .sl-myth-i {
        padding: 22px 18px !important;
        border-radius: 17px !important;
    }

    #myth .sl-myth-h {
        margin-bottom: 19px !important;
        padding-bottom: 16px !important;
    }

    #myth .sl-myth-ic {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 12px !important;
    }

    #myth .sl-myth-h b {
        font-size: 18px !important;
    }

    #myth .sl-myth-l {
        gap: 12px !important;
    }

    #myth .sl-myth-l > li {
        font-size: 13.5px !important;
        line-height: 1.55 !important;
    }

    #myth .sl-myth-end {
        margin-top: 16px !important;
        padding: 17px 18px 17px 21px !important;
        font-size: 13px !important;
    }

}

/*Безплатен или платен?*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "БЕЗПЛАТЕН ИЛИ ПЛАТЕН?"
   ========================================================================== */

/* Основна секция */
#free {
    position: relative !important;
    background: #ffffff !important;
    padding: 80px 20px !important;
    overflow: hidden !important;
}

#free::before {
    content: "" !important;
    position: absolute !important;
    width: 560px !important;
    height: 560px !important;
    left: 50% !important;
    top: 10% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.07) 0%,
        rgba(152, 219, 28, 0.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

#free .wrap-w {
    position: relative !important;
    z-index: 1 !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

#free .sl-head {
    max-width: 820px !important;
    margin: 0 auto 45px !important;
    text-align: center !important;
}

#free .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

#free .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

#free .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 22px auto 0 !important;
    border-radius: 999px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 14px rgba(152, 219, 28, 0.25) !important;
}


/* ==========================================================================
   КОНТЕЙНЕР НА ТАБЛИЦАТА
   ========================================================================== */

#free .sl-cmp {
    position: relative !important;
    overflow: hidden !important;

    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 26px !important;

    box-shadow:
        0 12px 35px rgba(15, 23, 42, 0.055),
        0 3px 10px rgba(15, 23, 42, 0.025) !important;
}


/* ==========================================================================
   ТАБЛИЦА
   ========================================================================== */

#free .sl-cmp table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 0 !important;
    table-layout: fixed !important;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

#free .sl-cmp thead th {
    padding: 22px 24px !important;

    background: #f8fafc !important;
    color: #374151 !important;

    font-size: 14px !important;
    line-height: 1.4 !important;
    font-weight: 800 !important;

    text-align: center !important;

    border-bottom: 1px solid #e5e7eb !important;
}


/* Първата празна клетка */
#free .sl-cmp thead th:first-child {
    width: 42% !important;
    background: #ffffff !important;
    text-align: left !important;
}


/* Колона "Безплатен" */
#free .sl-cmp thead th.free {
    position: relative !important;

    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,0.13),
            rgba(152,219,28,0.055)
        ) !important;

    color: #305a08 !important;

    border-left: 1px solid rgba(152,219,28,0.18) !important;
    border-right: 1px solid rgba(152,219,28,0.18) !important;
}


/* Малък зелен маркер */
#free .sl-cmp thead th.free::before {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 0 !important;
    transform: translateX(-50%) !important;

    width: 50px !important;
    height: 3px !important;

    background: #7cbf00 !important;
    border-radius: 999px 999px 0 0 !important;
}


/* ==========================================================================
   BODY
   ========================================================================== */

#free .sl-cmp tbody td {
    padding: 18px 24px !important;

    color: #6b7280 !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;

    text-align: center !important;

    border-bottom: 1px solid #f0f2f4 !important;

    background: #ffffff !important;

    transition:
        background .25s ease,
        color .25s ease !important;
}


/* Първа колона */
#free .sl-cmp tbody td:first-child {
    color: #1f2937 !important;
    text-align: left !important;
    font-size: 14px !important;
}


/* Последен ред без линия */
#free .sl-cmp tbody tr:last-child td {
    border-bottom: 0 !important;
}


/* ==========================================================================
   ЗЕЛЕНА КОЛОНА
   ========================================================================== */

#free .sl-cmp tbody td.free {
    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,0.035),
            rgba(152,219,28,0.075),
            rgba(152,219,28,0.035)
        ) !important;

    color: #40552b !important;

    border-left: 1px solid rgba(152,219,28,0.13) !important;
    border-right: 1px solid rgba(152,219,28,0.13) !important;
}


/* ==========================================================================
   HOVER НА РЕД
   ========================================================================== */

#free .sl-cmp tbody tr {
    transition: transform .2s ease !important;
}

#free .sl-cmp tbody tr:hover td {
    background: #fafcf8 !important;
}

#free .sl-cmp tbody tr:hover td.free {
    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,0.06),
            rgba(152,219,28,0.11),
            rgba(152,219,28,0.06)
        ) !important;
}


/* ==========================================================================
   BOLD
   ========================================================================== */

#free .sl-cmp td b {
    color: #111827 !important;
    font-weight: 750 !important;
}

#free .sl-cmp td.free b {
    color: #305a08 !important;
}


/* ==========================================================================
   "ЕДНАКВО" / "ЕДНАКВА" БАЛОНЧЕ
   ========================================================================== */

#free .sl-same {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;

    min-height: 30px !important;
    padding: 5px 11px !important;

    border-radius: 999px !important;

    background: #f0fdf4 !important;
    border: 1px solid rgba(152,219,28,0.32) !important;

    color: #305a08 !important;

    font-size: 12px !important;
    font-weight: 750 !important;
    white-space: nowrap !important;
}


/* Check */
#free .sl-same svg {
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 auto !important;
    color: #6da800 !important;
    stroke-width: 2.5 !important;
}


/* ==========================================================================
   ФИНАЛНО СЪОБЩЕНИЕ
   ========================================================================== */

#free .sl-cmp-after {
    position: relative !important;

    margin-top: 22px !important;
    padding: 20px 24px 20px 28px !important;

    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 17px !important;

    color: #6b7280 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;

    box-shadow:
        0 5px 18px rgba(15,23,42,0.025) !important;
}


/* Зелената линия */
#free .sl-cmp-after::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 14px !important;
    bottom: 14px !important;

    width: 4px !important;

    border-radius: 0 5px 5px 0 !important;
    background: #7cbf00 !important;
}


/* Bold */
#free .sl-cmp-after b {
    color: #1f2937 !important;
    font-weight: 800 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    #free {
        padding: 65px 20px !important;
    }

    #free .sl-cmp {
        border-radius: 20px !important;
        overflow-x: auto !important;
    }

    #free .sl-cmp table {
        min-width: 720px !important;
    }

    #free .sl-cmp thead th,
    #free .sl-cmp tbody td {
        padding: 16px 18px !important;
    }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    #free {
        padding: 55px 16px !important;
    }

    #free .sl-head {
        margin-bottom: 32px !important;
    }

    #free .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    #free .sl-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    #free .sl-cmp {
        border-radius: 17px !important;
    }

    #free .sl-cmp table {
        min-width: 680px !important;
    }

    #free .sl-cmp thead th {
        padding: 17px 14px !important;
        font-size: 12px !important;
    }

    #free .sl-cmp tbody td {
        padding: 15px 14px !important;
        font-size: 12.5px !important;
    }

    #free .sl-cmp tbody td:first-child {
        font-size: 13px !important;
    }

    #free .sl-same {
        font-size: 11px !important;
        padding: 5px 9px !important;
    }

    #free .sl-same svg {
        width: 13px !important;
        height: 13px !important;
    }

    #free .sl-cmp-after {
        margin-top: 16px !important;
        padding: 17px 18px 17px 22px !important;
        font-size: 13px !important;
    }

}

/*Кога и как се подновява*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "КОГА И КАК СЕ ПОДНОВЯВА"
   ========================================================================== */


/* Основна секция */
section.sec.sec-wash {
    position: relative !important;
    padding: 90px 20px !important;
    color: #7cbf00 !important;
    overflow: hidden !important;
}

/* Светлинен ореол */
section.sec.sec-wash::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: 5% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,0.07) 0%,
        rgba(152,219,28,0.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec.sec-wash .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec.sec-wash .sl-head {
    max-width: 760px !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section.sec.sec-wash .sl-head h2 {
    margin: 0 0 15px !important;
    color: #7cbf00 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec.sec-wash .sl-head p {
    margin: 0 !important;
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелената чертичка */
section.sec.sec-wash .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152,219,28,0.45) !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec.sec-wash .sl-renew {
    position: relative !important;
    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #0f140c 100%
        ) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 24px !important;
    padding: 34px !important;
    box-shadow:
        0 25px 60px rgba(0,0,0,0.35),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;
    overflow: hidden !important;
}

/* Светеща линия отгоре */
section.sec.sec-wash .sl-renew::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 8% !important;
    right: 8% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;
    opacity: .75 !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА TIMELINE
   ========================================================================== */

section.sec.sec-wash .sl-renew-h {
    color: #ffffff !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    letter-spacing: -.3px !important;
    margin-bottom: 24px !important;
}

/* ==========================================================================
   TIMELINE
   ========================================================================== */

section.sec.sec-wash .sl-life {
    margin-bottom: 42px !important;
}

/* Лента */
section.sec.sec-wash .sl-life-bar {
    display: flex !important;
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: #0a0e08 !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    box-shadow:
        inset 0 1px 4px rgba(0,0,0,.35),
        0 8px 20px rgba(0,0,0,.2) !important;
}

/* Всички части */
section.sec.sec-wash .sl-life-p {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px 12px !important;
    color: #dfe7d9 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    transition: filter .3s ease, transform .3s ease !important;
}

/* Използван период */
section.sec.sec-wash .sl-life-p.used {
    background: linear-gradient(
        90deg,
        #27301e,
        #323d24
    ) !important;
    color: #aeb8a5 !important;
}

/* Активен период */
section.sec.sec-wash .sl-life-p.act {
    background:
        linear-gradient(
            90deg,
            #76ad15,
            #7cbf00
        ) !important;
    color: #101508 !important;
    box-shadow:
        0 0 25px rgba(152,219,28,.15) !important;
}

/* Запас */
section.sec.sec-wash .sl-life-p.left {
    background: #171d12 !important;
    color: #727b6b !important;
}

/* Hover върху сегмент */
section.sec.sec-wash .sl-life-p:hover {
    filter: brightness(1.12) !important;
}

/* Маркери */
section.sec.sec-wash .sl-life-marks {
    display: flex !important;
    justify-content: space-between !important;
    margin-top: 10px !important;
    padding: 0 4px !important;
    color: #687162 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

/* ==========================================================================
   СТЪПКИ
   ========================================================================== */

section.sec.sec-wash .sl-renew-l {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

/* Вертикална линия */
section.sec.sec-wash .sl-renew-l::before {
    content: "" !important;
    position: absolute !important;
    left: 53px !important;
    top: 20px !important;
    bottom: 20px !important;
    width: 1px !important;
    background: linear-gradient(
        180deg,
        rgba(152,219,28,.45),
        rgba(255,255,255,.07),
        rgba(152,219,28,.15)
    ) !important;
}

/* Всеки ред */
section.sec.sec-wash .sl-renew-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 82px minmax(0,1fr) !important;
    align-items: center !important;
    gap: 20px !important;
    padding: 17px 18px !important;
    background: rgba(255,255,255,.025) !important;
    border: 1px solid rgba(255,255,255,.055) !important;
    border-radius: 14px !important;
    transition:
        transform .3s ease,
        background .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Hover */
section.sec.sec-wash .sl-renew-r:hover {
    transform: translateX(5px) !important;
    background: rgba(152,219,28,.045) !important;
    border-color: rgba(152,219,28,.22) !important;
    box-shadow:
        0 12px 30px rgba(0,0,0,.22),
        0 0 20px rgba(152,219,28,.035) !important;
}

/* ==========================================================================
   ДАТА / ДЕН
   ========================================================================== */

section.sec.sec-wash .sl-renew-d {
    position: relative !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 32px !important;
    padding: 6px 9px !important;
    border-radius: 999px !important;
    background: rgba(152,219,28,.10) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    color: #7cbf00 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec.sec-wash .sl-renew-t {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
}

section.sec.sec-wash .sl-renew-t b {
    color: #f3f6ef !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

section.sec.sec-wash .sl-renew-t span {
    color: #8d9788 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   ФИНАЛНО ПОСЛАНИЕ
   ========================================================================== */

section.sec.sec-wash .sl-renew-end {
    position: relative !important;
    margin-top: 28px !important;
    padding: 20px 22px 20px 25px !important;
    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,.08),
            rgba(152,219,28,.025)
        ) !important;
    border: 1px solid rgba(152,219,28,.16) !important;
    border-radius: 14px !important;
    color: #9ca694 !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* Зелената линия */
section.sec.sec-wash .sl-renew-end::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 13px !important;
    bottom: 13px !important;
    width: 3px !important;
    border-radius: 5px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 12px rgba(152,219,28,.35) !important;
}

section.sec.sec-wash .sl-renew-end b {
    color: #dce6d5 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec.sec-wash {
        padding: 70px 18px !important;
    }

    section.sec.sec-wash .sl-renew {
        padding: 26px !important;
    }

    section.sec.sec-wash .sl-renew-r {
        grid-template-columns: 72px minmax(0,1fr) !important;
        gap: 16px !important;
    }

    section.sec.sec-wash .sl-renew-l::before {
        left: 47px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec.sec-wash {
        padding: 60px 14px !important;
    }

    section.sec.sec-wash .sl-head {
        margin-bottom: 35px !important;
    }

    section.sec.sec-wash .sl-head h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    section.sec.sec-wash .sl-head p {
        font-size: 14px !important;
    }

    section.sec.sec-wash .sl-renew {
        padding: 21px 17px !important;
        border-radius: 18px !important;
    }

    section.sec.sec-wash .sl-renew-h {
        font-size: 16px !important;
        margin-bottom: 20px !important;
    }

    /* Timeline на мобилен */
    section.sec.sec-wash .sl-life-bar {
        min-height: 42px !important;
    }

    section.sec.sec-wash .sl-life-p {
        font-size: 9px !important;
        padding: 7px 5px !important;
    }

    section.sec.sec-wash .sl-life-marks {
        font-size: 9px !important;
    }

    /* Стъпките стават вертикални */
    section.sec.sec-wash .sl-renew-l {
        gap: 10px !important;
    }

    section.sec.sec-wash .sl-renew-l::before {
        display: none !important;
    }

    section.sec.sec-wash .sl-renew-r {
        grid-template-columns: 1fr !important;
        gap: 9px !important;
        padding: 17px !important;
        border-radius: 13px !important;
    }

    section.sec.sec-wash .sl-renew-r:hover {
        transform: translateY(-3px) !important;
    }

    section.sec.sec-wash .sl-renew-d {
        width: fit-content !important;
    }

    section.sec.sec-wash .sl-renew-t b {
        font-size: 13px !important;
    }

    section.sec.sec-wash .sl-renew-t span {
        font-size: 11.5px !important;
    }

    section.sec.sec-wash .sl-renew-end {
        margin-top: 20px !important;
        padding: 17px 17px 17px 21px !important;
        font-size: 12px !important;
    }
}

/*Трите чести проблема*/

 /* ==========================================================================
    СВЕТЪЛ PREMIUM ДИЗАЙН — "ТРИТЕ ЧЕСТИ ПРОБЛЕМА"
    ========================================================================== */

/* Основна секция */
section.sec:has(.sl-probs) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен фон */
section.sec:has(.sl-probs)::before {
    content: "" !important;
    position: absolute !important;
    width: 650px !important;
    height: 650px !important;
    left: 50% !important;
    top: 0 !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-probs) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-probs) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-probs) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-probs) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.sl-probs) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   СПИСЪК С ПРОБЛЕМИ
   ========================================================================== */

section.sec:has(.sl-probs) .sl-probs {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
}

/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Зелената линия отгоре */
section.sec:has(.sl-probs) .sl-prob::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
    opacity: .7 !important;
}

/* Hover */
section.sec:has(.sl-probs) .sl-prob:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(105,201,14,.45) !important;
    box-shadow:
        0 18px 40px rgba(15,23,42,.08),
        0 5px 18px rgba(152,219,28,.07) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА ПРОБЛЕМА
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob-q {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 24px 26px !important;
    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.045),
            rgba(255,255,255,0)
        ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* Икона */
section.sec:has(.sl-probs) .sl-prob-ic {
    width: 45px !important;
    height: 45px !important;
    min-width: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.12) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #5f9008 !important;
    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.sl-probs) .sl-prob-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Hover икона */
section.sec:has(.sl-probs) .sl-prob:hover .sl-prob-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}

/* Заглавие */
section.sec:has(.sl-probs) .sl-prob-q > b {
    color: #172000 !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ОТГОВОР
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob-a {
    padding: 24px 26px 27px !important;
    background: #ffffff !important;
}

/* Параграфи */
section.sec:has(.sl-probs) .sl-prob-a p {
    margin: 0 0 13px !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

section.sec:has(.sl-probs) .sl-prob-a p:last-child {
    margin-bottom: 0 !important;
}

/* Bold */
section.sec:has(.sl-probs) .sl-prob-a b {
    color: #26351a !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   CODE БЛОК
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob-code {
    margin: 20px 0 !important;
    padding: 17px 19px !important;
    background: #f7faf4 !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    border-left: 3px solid #7cbf00 !important;
    border-radius: 12px !important;
    color: #596273 !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        "Liberation Mono",
        monospace !important;
    font-size: 12px !important;
    line-height: 1.8 !important;
    overflow-x: auto !important;
    box-shadow:
        inset 0 1px 2px rgba(15,23,42,.025) !important;
}

/* http */
section.sec:has(.sl-probs) .sl-prob-code b {
    color: #dc2626 !important;
    font-weight: 800 !important;
}

/* https */
section.sec:has(.sl-probs) .sl-prob-code br + * {
    color: inherit !important;
}

/* Последното https чрез контекст */
section.sec:has(.sl-probs) .sl-prob-code b:not(:first-of-type) {
    color: #5f9008 !important;
}

/* ==========================================================================
   РАЗЛИЧЕН АКЦЕНТ ЗА ВСЕКИ ПРОБЛЕМ
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob:nth-child(1) .sl-prob-ic {
    color: #b45309 !important;
    background: rgba(245,158,11,.10) !important;
    border-color: rgba(245,158,11,.22) !important;
}

section.sec:has(.sl-probs) .sl-prob:nth-child(1):hover .sl-prob-ic {
    background: #f59e0b !important;
    color: #ffffff !important;
}

section.sec:has(.sl-probs) .sl-prob:nth-child(2) .sl-prob-ic {
    color: #5f9008 !important;
}

section.sec:has(.sl-probs) .sl-prob:nth-child(3) .sl-prob-ic {
    color: #2563a8 !important;
    background: rgba(59,130,246,.09) !important;
    border-color: rgba(59,130,246,.20) !important;
}

section.sec:has(.sl-probs) .sl-prob:nth-child(3):hover .sl-prob-ic {
    background: #3b82f6 !important;
    color: #ffffff !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-probs) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-probs) .sl-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-q {
        padding: 21px 22px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-a {
        padding: 21px 22px 24px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-probs) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-probs) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-probs) .sl-head p {
        font-size: 14px !important;
    }

    section.sec:has(.sl-probs) .sl-probs {
        gap: 14px !important;
    }

    section.sec:has(.sl-probs) .sl-prob {
        border-radius: 16px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-q {
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-q > b {
        font-size: 14px !important;
        line-height: 1.45 !important;
        padding-top: 3px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-a {
        padding: 19px 17px 21px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-a p {
        font-size: 13px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-probs) .sl-prob-code {
        padding: 14px !important;
        margin: 17px 0 !important;
        font-size: 10.5px !important;
        line-height: 1.75 !important;
    }
}

/* Намалено движение за потребители, които го предпочитат */
@media (prefers-reduced-motion: reduce) {
    section.sec:has(.sl-probs) .sl-prob,
    section.sec:has(.sl-probs) .sl-prob-ic {
        transition: none !important;
    }

    section.sec:has(.sl-probs) .sl-prob:hover {
        transform: none !important;
    }
}

/*Трите вида, без жаргон*/

 /* ==========================================================================
    ТЪМЕН PREMIUM ДИЗАЙН — "ТРИТЕ ВИДА, БЕЗ ЖАРГОН"
    ========================================================================== */

/* Основна секция */
section.sec.sec-wash:has(.sl-kinds) {
    position: relative !important;
    background: #0b0f08 !important;
    padding: 90px 20px !important;
    color: #f5f7f2 !important;
    overflow: hidden !important;
}

/* Фонов светлинен ефект */
section.sec.sec-wash:has(.sl-kinds)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: 5% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec.sec-wash:has(.sl-kinds) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 52px !important;
    text-align: center !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-head h2 {
    margin: 0 0 15px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-head p {
    margin: 0 !important;
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Акцент */
section.sec.sec-wash:has(.sl-kinds) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152,219,28,.45) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kinds {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #10140d 100%
        ) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 20px !important;
    padding: 28px !important;
    overflow: hidden !important;
    box-shadow:
        0 20px 45px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.025) !important;
    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease !important;
}

/* Горна светлинна линия */
section.sec.sec-wash:has(.sl-kinds) .sl-kind::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 8% !important;
    right: 8% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,.35),
        transparent
    ) !important;
    opacity: 0 !important;
    transition: opacity .3s ease !important;
}

/* Hover */
section.sec.sec-wash:has(.sl-kinds) .sl-kind:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(152,219,28,.30) !important;
    background:
        linear-gradient(
            145deg,
            #192011 0%,
            #11170d 100%
        ) !important;
    box-shadow:
        0 28px 55px rgba(0,0,0,.38),
        0 0 30px rgba(152,219,28,.055) !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind:hover::before {
    opacity: 1 !important;
}

/* ==========================================================================
   КАРТА "ТВОЯТ DV"
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours {
    border-color: rgba(152,219,28,.50) !important;
    background:
        linear-gradient(
            145deg,
            #18200f 0%,
            #10150c 100%
        ) !important;
    box-shadow:
        0 24px 55px rgba(0,0,0,.36),
        0 0 35px rgba(152,219,28,.07),
        inset 0 1px 0 rgba(152,219,28,.07) !important;
    transform: translateY(-5px) !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours::before {
    opacity: 1 !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours:hover {
    transform: translateY(-10px) !important;
    border-color: #7cbf00 !important;
    box-shadow:
        0 30px 65px rgba(0,0,0,.42),
        0 0 42px rgba(152,219,28,.12) !important;
}

/* ==========================================================================
   ГОРНА ЧАСТ
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind-top {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 22px !important;
}

/* DV / OV / EV badge */
section.sec.sec-wash:has(.sl-kinds) .sl-kind-tag {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 45px !important;
    height: 32px !important;
    padding: 0 11px !important;
    border-radius: 9px !important;
    background: rgba(152,219,28,.11) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #7cbf00 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    letter-spacing: .8px !important;
}

/* Заглавие */
section.sec.sec-wash:has(.sl-kinds) .sl-kind-top > b {
    color: #f4f7f0 !important;
    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ОСНОВЕН ТЕКСТ
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind-what {
    margin: 0 !important;
    color: #9ba596 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    flex-grow: 1 !important;
}

/* ==========================================================================
   ДОЛЕН INFO БЛОК
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind-check {
    position: relative !important;
    margin-top: 24px !important;
    padding: 15px 16px 15px 19px !important;
    background: rgba(255,255,255,.035) !important;
    border: 1px solid rgba(255,255,255,.065) !important;
    border-radius: 12px !important;
    color: #7f8979 !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
}

/* Акцентна линия */
section.sec.sec-wash:has(.sl-kinds) .sl-kind-check::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 11px !important;
    bottom: 11px !important;
    width: 3px !important;
    border-radius: 5px !important;
    background: rgba(152,219,28,.55) !important;
}

/* Bold */
section.sec.sec-wash:has(.sl-kinds) .sl-kind-check b {
    color: #7cbf00 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   РАЗЛИЧАВАНЕ НА OV / EV
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind:not(.is-yours) .sl-kind-tag {
    background: rgba(255,255,255,.045) !important;
    border-color: rgba(255,255,255,.10) !important;
    color: #aeb7a8 !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind:not(.is-yours) .sl-kind-check {
    background: rgba(255,255,255,.025) !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind:not(.is-yours) .sl-kind-check b {
    color: #d2dacd !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec.sec-wash:has(.sl-kinds) {
        padding: 70px 18px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kinds {
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours {
        transform: none !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours:hover {
        transform: translateY(-7px) !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind:last-child {
        grid-column: 1 / -1 !important;
        max-width: calc(50% - 10px) !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 620px) {

    section.sec.sec-wash:has(.sl-kinds) {
        padding: 60px 14px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-head {
        margin-bottom: 36px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-head p {
        font-size: 14px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kinds {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind {
        padding: 23px 19px !important;
        border-radius: 16px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours {
        transform: none !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours:hover,
    section.sec.sec-wash:has(.sl-kinds) .sl-kind:hover {
        transform: translateY(-4px) !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind:last-child {
        grid-column: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-top {
        margin-bottom: 18px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-tag {
        min-width: 42px !important;
        height: 30px !important;
        font-size: 11px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-top > b {
        font-size: 15px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-what {
        font-size: 13px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-check {
        margin-top: 20px !important;
        padding: 14px 14px 14px 18px !important;
        font-size: 11.5px !important;
    }
}

/* Намалено движение */
@media (prefers-reduced-motion: reduce) {
    section.sec.sec-wash:has(.sl-kinds) .sl-kind {
        transition: none !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind:hover,
    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours:hover {
        transform: none !important;
    }
}
/*faq*/


/* ==========================================================================
   FAQ — СВЕТЪЛ PREMIUM ДИЗАЙН
   Работи директно с .sl-faq структурата
   ========================================================================== */

/* FAQ GRID */
.sl-faq {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-top: 40px !important;
    align-items: start !important;
}

/* ==========================================================================
   FAQ КАРТА
   ========================================================================== */

.sl-faq-i {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.24) !important;
    border-radius: 20px !important;
    padding: 24px 26px !important;
    overflow: hidden !important;
    cursor: pointer !important;

    box-shadow:
        0 4px 16px rgba(48, 90, 8, 0.035),
        0 1px 2px rgba(0, 0, 0, 0.02) !important;

    transition:
        transform .28s cubic-bezier(.2,.9,.2,1),
        box-shadow .28s ease,
        border-color .28s ease,
        background .28s ease !important;
}

/* Лека зелена линия отгоре */
.sl-faq-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 2px !important;

    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;

    opacity: 0 !important;
    transition: opacity .3s ease !important;
}

/* Hover */
.sl-faq-i:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(105, 201, 14, 0.5) !important;

    box-shadow:
        0 16px 34px rgba(48, 90, 8, 0.09),
        0 0 25px rgba(152, 219, 28, 0.045) !important;
}

.sl-faq-i:hover::before {
    opacity: 1 !important;
}

/* Отворена карта */
.sl-faq-i.is-open {
    border-color: rgba(105, 201, 14, 0.5) !important;
    box-shadow:
        0 12px 30px rgba(48, 90, 8, 0.075),
        0 0 25px rgba(152, 219, 28, 0.05) !important;
}

.sl-faq-i.is-open::before {
    opacity: 1 !important;
}

/* ==========================================================================
   BADGE
   ========================================================================== */

.sl-faq-i .sl-faq-n {
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;

    margin-bottom: 12px !important;
    padding: 5px 11px !important;

    border-radius: 999px !important;

    background: rgba(183, 255, 53, 0.16) !important;
    border: 1px solid rgba(152, 219, 28, 0.28) !important;

    color: #305a08 !important;

    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    letter-spacing: .6px !important;
}

/* ==========================================================================
   ВЪПРОС
   ========================================================================== */

.sl-faq-i h3 {
    position: relative !important;

    margin: 0 !important;
    padding: 0 34px 0 0 !important;

    color: #1a2e05 !important;

    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
    letter-spacing: -.2px !important;
}

/* Плюс */
.sl-faq-i h3::after {
    content: "+" !important;

    position: absolute !important;
    right: 0 !important;
    top: 50% !important;

    width: 27px !important;
    height: 27px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    transform: translateY(-50%) !important;

    border-radius: 50% !important;
    background: #f3fae9 !important;
    border: 1px solid rgba(152, 219, 28, 0.3) !important;

    color: #4d790d !important;

    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease !important;
}

/* При отваряне */
.sl-faq-i.is-open h3::after {
    transform: translateY(-50%) rotate(45deg) !important;
    background: #7cbf00 !important;
    color: #172306 !important;
}

/* ==========================================================================
   ОТГОВОР
   ========================================================================== */

.sl-faq-i p {
    max-height: 0 !important;
    overflow: hidden !important;

    opacity: 0 !important;

    margin: 0 !important;

    color: #526247 !important;

    font-size: 14px !important;
    line-height: 1.7 !important;

    transition:
        max-height .45s cubic-bezier(.2,.9,.2,1),
        opacity .3s ease,
        margin-top .3s ease !important;
}

/* Отворен отговор */
.sl-faq-i.is-open p {
    max-height: 500px !important;
    opacity: 1 !important;
    margin-top: 16px !important;
}

/* Bold в отговора */
.sl-faq-i p b {
    color: #243b0a !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   HEADER НА СЕКЦИЯТА
   ========================================================================== */

.sl-head {
    max-width: 760px !important;
    margin: 0 auto 10px !important;
}

.sl-head h2 {
    color: #172306 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin: 0 0 14px !important;
}

.sl-head p {
    color: #66745d !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* Зелен акцент под заглавието */
.sl-head::after {
    content: "" !important;
    display: block !important;

    width: 44px !important;
    height: 3px !important;

    margin-top: 22px !important;

    background: #7cbf00 !important;
    border-radius: 99px !important;

    box-shadow: 0 0 16px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   СЕКЦИЯ
   ========================================================================== */

section.sec:has(.sl-faq) {
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152, 219, 28, 0.045),
            transparent 45%
        ),
        #ffffff !important;

    padding: 85px 20px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .sl-faq {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    .sl-faq-i {
        padding: 22px 23px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.sl-faq) {
        padding: 60px 16px !important;
    }

    .sl-head {
        margin-bottom: 8px !important;
    }

    .sl-head h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    .sl-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    .sl-faq {
        margin-top: 32px !important;
        gap: 12px !important;
    }

    .sl-faq-i {
        padding: 20px !important;
        border-radius: 17px !important;
    }

    .sl-faq-i h3 {
        font-size: 16px !important;
        line-height: 1.4 !important;
        padding-right: 38px !important;
    }

    .sl-faq-i p {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
    }

    .sl-faq-i .sl-faq-n {
        font-size: 10px !important;
        padding: 5px 9px !important;
    }
}

/*Кога платеният има смисъл*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КОГА ПЛАТЕНИЯТ ИМА СМИСЪЛ"
   ========================================================================== */

/* Секция */
section.sec:has(.sl-when) {
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152, 219, 28, 0.045),
            transparent 48%
        ),
        #ffffff !important;

    padding: 85px 20px !important;
    overflow: hidden !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.sl-when) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 45px !important;
}

section.sec:has(.sl-when) .sl-head h2 {
    color: #172306 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin: 0 0 14px !important;
}

section.sec:has(.sl-when) .sl-head p {
    color: #66745d !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* Зелен акцент */
section.sec:has(.sl-when) .sl-head::after {
    content: "" !important;
    display: block !important;

    width: 44px !important;
    height: 3px !important;

    margin-top: 22px !important;

    background: #7cbf00 !important;
    border-radius: 999px !important;

    box-shadow: 0 0 16px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

.sl-when {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

.sl-when-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 22px !important;

    padding: 28px !important;

    overflow: hidden !important;

    box-shadow:
        0 5px 18px rgba(48, 90, 8, 0.035),
        0 1px 2px rgba(0, 0, 0, 0.02) !important;

    transition:
        transform .3s cubic-bezier(.2,.9,.2,1),
        box-shadow .3s ease,
        border-color .3s ease,
        background .3s ease !important;
}

/* Светеща линия отгоре */
.sl-when-i::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            #7cbf00,
            transparent
        ) !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}

/* Hover */
.sl-when-i:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(105, 201, 14, 0.5) !important;

    background: #ffffff !important;

    box-shadow:
        0 18px 38px rgba(48, 90, 8, 0.09),
        0 0 28px rgba(152, 219, 28, 0.05) !important;
}

.sl-when-i:hover::before {
    opacity: 1 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

.sl-when-ic {
    width: 50px !important;
    height: 50px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 auto !important;

    margin-bottom: 20px !important;

    border-radius: 15px !important;

    background:
        linear-gradient(
            135deg,
            #f1fbe6,
            #e9f8d8
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.3) !important;

    color: #4d790d !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.8),
        0 5px 12px rgba(105, 201, 14, 0.06) !important;

    transition:
        transform .3s ease,
        background .3s ease !important;
}

.sl-when-i:hover .sl-when-ic {
    transform: translateY(-2px) scale(1.04) !important;

    background:
        linear-gradient(
            135deg,
            #7cbf00,
            #b1ed45
        ) !important;

    color: #172306 !important;
}

.sl-when-ic svg {
    width: 23px !important;
    height: 23px !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

.sl-when-i > b {
    display: block !important;

    color: #1a2e05 !important;

    font-size: 18px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;

    margin: 0 0 10px !important;

    letter-spacing: -.2px !important;
}

/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

.sl-when-i > p {
    color: #617057 !important;

    font-size: 14px !important;
    line-height: 1.7 !important;

    margin: 0 !important;
}

/* ==========================================================================
   NOTE
   ========================================================================== */

.sl-when-note {
    max-width: 850px !important;

    margin: 30px auto 0 !important;
    padding: 19px 23px !important;

    text-align: center !important;

    background: #f6fbeF !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 16px !important;

    color: #526247 !important;

    font-size: 14px !important;
    line-height: 1.6 !important;

    box-shadow:
        0 4px 15px rgba(48, 90, 8, 0.025) !important;
}

.sl-when-note b {
    color: #305a08 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.sl-when) {
        padding: 70px 20px !important;
    }

    .sl-when {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .sl-when-i {
        padding: 24px !important;
    }

    .sl-when-i:last-child {
        grid-column: 1 / -1 !important;
        max-width: calc(50% - 8px) !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.sl-when) {
        padding: 60px 16px !important;
    }

    section.sec:has(.sl-when) .sl-head {
        margin-bottom: 32px !important;
    }

    section.sec:has(.sl-when) .sl-head h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-when) .sl-head p {
        font-size: 14px !important;
    }

    .sl-when {
        grid-template-columns: 1fr !important;
        gap: 13px !important;
    }

    .sl-when-i {
        padding: 22px !important;
        border-radius: 18px !important;
    }

    .sl-when-i:last-child {
        grid-column: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    .sl-when-ic {
        width: 46px !important;
        height: 46px !important;
        border-radius: 13px !important;
        margin-bottom: 17px !important;
    }

    .sl-when-i > b {
        font-size: 17px !important;
    }

    .sl-when-i > p {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
    }

    .sl-when-note {
        margin-top: 22px !important;
        padding: 17px 18px !important;
        font-size: 13px !important;
        border-radius: 14px !important;
    }
}

/*ddos-zashtita/Атака ли е, или просто е бавно?*/

/* ==========================================================================
   СВЕТЪЛ ДИЗАЙН — "АТАКА ЛИ Е, ИЛИ ПРОСТО Е БАВНО?"
   ========================================================================== */

section#tell {
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #17200f !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Лек зелен glow */
section#tell::before {
    content: "" !important;
    position: absolute !important;
    width: 560px !important;
    height: 560px !important;
    left: 50% !important;
    top: 10% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.07) 0%,
        rgba(152, 219, 28, 0.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

section#tell .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: none !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section#tell .dd-head {
    max-width: none !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section#tell .dd-head h2 {
    margin: 0 0 14px !important;
    color: #17200f !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section#tell .dd-head p {
    margin: 0 !important;
    color: #65705c !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}

/* Зелената чертичка */
section#tell .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 22px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   ДВЕТЕ ОСНОВНИ КАРТИ
   ========================================================================== */

section#tell .dd-tell {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;
    align-items: stretch !important;
}

section#tell .dd-tell-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 30px !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    border: 1px solid #e5eadf !important;
    box-shadow:
        0 8px 25px rgba(48, 90, 8, 0.045),
        0 2px 5px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Горна зелена линия */
section#tell .dd-tell-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;
    opacity: .55 !important;
}

/* Hover */
section#tell .dd-tell-i:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.55) !important;
    box-shadow:
        0 18px 38px rgba(48, 90, 8, 0.10),
        0 0 25px rgba(152, 219, 28, 0.05) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section#tell .dd-tell-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 24px !important;
}

section#tell .dd-tell-h b {
    color: #17200f !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
}

/* Иконка */
section#tell .dd-tell-ic {
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    background: #f1f9e8 !important;
    border: 1px solid rgba(152, 219, 28, 0.30) !important;
    color: #4f790d !important;
}

section#tell .dd-tell-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section#tell .dd-tell-l {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

section#tell .dd-tell-l li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 11px !important;
    color: #52604a !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

section#tell .dd-tell-l li b {
    color: #253718 !important;
    font-weight: 750 !important;
}

/* Малката точка */
section#tell .dd-tell-l li i {
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    flex: 0 0 7px !important;
    margin-top: 7px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 0 4px rgba(152, 219, 28, 0.10) !important;
}

/* ==========================================================================
   ДОЛЕН БЛОК "АКО Е ТОВА"
   ========================================================================== */

section#tell .dd-tell-what {
    margin-top: auto !important;
    padding: 17px 18px !important;
    margin-top: 27px !important;
    border-radius: 14px !important;
    background: #f6faef !important;
    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    color: #5b6753 !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
}

section#tell .dd-tell-what b {
    color: #365d08 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ЛЕКО РАЗЛИЧИЕ МЕЖДУ ДВАТА ТИПА
   ========================================================================== */

/* Атака */
section#tell .dd-tell-i.attack {
    border-color: rgba(152, 219, 28, 0.30) !important;
}

section#tell .dd-tell-i.attack .dd-tell-ic {
    background: #fff8ed !important;
    color: #b56b0b !important;
    border-color: rgba(245, 158, 11, 0.22) !important;
}

section#tell .dd-tell-i.attack .dd-tell-l li i {
    background: #f59e0b !important;
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.10) !important;
}

/* Бавно */
section#tell .dd-tell-i.slow .dd-tell-ic {
    background: #f1f9e8 !important;
    color: #4f790d !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {
    section#tell {
        padding: 70px 20px !important;
    }

    section#tell .dd-tell {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    section#tell .dd-tell-i {
        padding: 27px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    section#tell {
        padding: 60px 16px !important;
    }

    section#tell .dd-head {
        margin-bottom: 35px !important;
    }

    section#tell .dd-head h2 {
        font-size: 29px !important;
        letter-spacing: -.6px !important;
    }

    section#tell .dd-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    section#tell .dd-tell {
        gap: 15px !important;
    }

    section#tell .dd-tell-i {
        padding: 23px 20px !important;
        border-radius: 18px !important;
    }

    section#tell .dd-tell-h {
        gap: 11px !important;
        margin-bottom: 20px !important;
    }

    section#tell .dd-tell-h b {
        font-size: 17px !important;
    }

    section#tell .dd-tell-ic {
        width: 42px !important;
        height: 42px !important;
        flex-basis: 42px !important;
        border-radius: 12px !important;
    }

    section#tell .dd-tell-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section#tell .dd-tell-l {
        gap: 12px !important;
    }

    section#tell .dd-tell-l li {
        font-size: 13px !important;
    }

    section#tell .dd-tell-what {
        font-size: 12.5px !important;
        padding: 15px !important;
        border-radius: 12px !important;
    }
}
/*Къде спира какво*/


/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "КЪДЕ СПИРА КАКВО"
   ========================================================================== */

section.sec-wash:has(.dd-layers) {
    position: relative !important;
    background: #0b0f08 !important;
    color: #f5f7f2 !important;
    padding: 90px 20px !important;
    overflow: hidden !important;
}

/* Зелен атмосферен glow */
section.sec-wash:has(.dd-layers)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: 10% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.075) 0%,
        rgba(152, 219, 28, 0.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

section.sec-wash:has(.dd-layers) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-head {
    max-width: 780px !important;
    margin: 0 auto 52px !important;
    text-align: center !important;
}

section.sec-wash:has(.dd-layers) .dd-head h2 {
    margin: 0 0 14px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec-wash:has(.dd-layers) .dd-head p {
    margin: 0 !important;
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}

/* Акцент */
section.sec-wash:has(.dd-layers) .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 20px rgba(152, 219, 28, .45) !important;
}

/* ==========================================================================
   ОСНОВЕН FLOW КОНТЕЙНЕР
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layers {
    position: relative !important;
    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #0f140c 100%
        ) !important;
    border: 1px solid rgba(255,255,255,.075) !important;
    border-radius: 24px !important;
    padding: 30px !important;
    box-shadow:
        0 25px 60px rgba(0,0,0,.35),
        inset 0 1px 0 rgba(255,255,255,.025) !important;
    overflow: hidden !important;
}

/* Горна светлинна линия */
section.sec-wash:has(.dd-layers) .dd-layers::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 8% !important;
    right: 8% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,.7),
        transparent
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА FLOW
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layers-h {
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: -.1px !important;
    padding: 4px 4px 24px !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
}

/* ==========================================================================
   ЕДИНИЧЕН LAYER
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layer {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) 115px !important;
    align-items: center !important;
    gap: 20px !important;
    min-height: 105px !important;
    padding: 20px 4px !important;
    border-bottom: 1px solid rgba(255,255,255,.055) !important;
    transition:
        background .25s ease,
        padding .25s ease !important;
}

/* Hover ред */
section.sec-wash:has(.dd-layers) .dd-layer:hover {
    background: rgba(152,219,28,.025) !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* ==========================================================================
   НОМЕР
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layer-n {
    position: relative !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.10) !important;
    border: 1px solid rgba(152,219,28,.30) !important;
    color: #7cbf00 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    box-shadow:
        0 0 20px rgba(152,219,28,.05),
        inset 0 1px 0 rgba(255,255,255,.04) !important;
}

/* Вертикална линия между стъпките */
section.sec-wash:has(.dd-layers) .dd-layer:not(:last-of-type) .dd-layer-n::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: calc(100% + 1px) !important;
    width: 1px !important;
    height: 42px !important;
    transform: translateX(-50%) !important;
    background: linear-gradient(
        to bottom,
        rgba(152,219,28,.35),
        rgba(152,219,28,.04)
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layer-t {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    min-width: 0 !important;
}

section.sec-wash:has(.dd-layers) .dd-layer-t b {
    color: #f5f7f2 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

section.sec-wash:has(.dd-layers) .dd-layer-t span {
    color: #899184 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* ==========================================================================
   КОЛИЧЕСТВО ОТСТРАНЕН ТРАФИК
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layer-cut {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 3px !important;
    text-align: right !important;
    padding-left: 10px !important;
}

section.sec-wash:has(.dd-layers) .dd-layer-cut b {
    color: #7cbf00 !important;
    font-size: 18px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

section.sec-wash:has(.dd-layers) .dd-layer-cut span {
    color: #687063 !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: .7px !important;
    font-weight: 700 !important;
}

/* Последният ред */
section.sec-wash:has(.dd-layers) .dd-layer:last-of-type {
    border-bottom: 0 !important;
}

section.sec-wash:has(.dd-layers) .dd-layer:last-of-type .dd-layer-cut b {
    color: #ffffff !important;
}

/* ==========================================================================
   ФИНАЛЕН РЕЗУЛТАТ
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layers-end {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin-top: 18px !important;
    padding: 20px !important;
    border-radius: 15px !important;
    background:
        linear-gradient(
            135deg,
            rgba(152,219,28,.10),
            rgba(152,219,28,.035)
        ) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    color: #8f9888 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

section.sec-wash:has(.dd-layers) .dd-layers-end b {
    flex: 0 0 auto !important;
    color: #7cbf00 !important;
    font-size: 27px !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    letter-spacing: -1px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {
    section.sec-wash:has(.dd-layers) {
        padding: 70px 20px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers {
        padding: 24px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer {
        grid-template-columns: 42px minmax(0, 1fr) 95px !important;
        gap: 15px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {
    section.sec-wash:has(.dd-layers) {
        padding: 60px 16px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-head {
        margin-bottom: 35px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-head h2 {
        font-size: 29px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-head p {
        font-size: 14px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers {
        padding: 20px 16px !important;
        border-radius: 19px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers-h {
        padding-bottom: 20px !important;
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer {
        grid-template-columns: 38px minmax(0, 1fr) !important;
        gap: 13px !important;
        padding: 18px 0 !important;
        min-height: auto !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-n {
        width: 36px !important;
        height: 36px !important;
        border-radius: 11px !important;
        font-size: 13px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-t b {
        font-size: 14px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-t span {
        font-size: 12px !important;
        line-height: 1.5 !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-cut {
        grid-column: 2 !important;
        align-items: flex-start !important;
        text-align: left !important;
        padding: 10px 0 0 !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-cut b {
        font-size: 16px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-cut span {
        font-size: 9px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-n::after {
        height: 70px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers-end {
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 17px !important;
        font-size: 12px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers-end b {
        font-size: 23px !important;
    }
}


/*Как изглежда отвътре*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАК ИЗГЛЕЖДА ОТВЪТРЕ"
   ========================================================================== */

section.sec:has(.dd-att) {
    background: #f7f9f4 !important;
    padding: 90px 20px !important;
    color: #1a2e05 !important;
    overflow: hidden !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.dd-att) .dd-head {
    text-align: center !important;
    max-width: 760px !important;
    margin: 0 auto 55px !important;
}

section.sec:has(.dd-att) .dd-head h2 {
    color: #172505 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin: 0 0 15px !important;
}

section.sec:has(.dd-att) .dd-head p {
    color: #617052 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* Зелен акцент под заглавието */

section.sec:has(.dd-att) .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    margin: 24px auto 0 !important;
    box-shadow: 0 0 18px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ОСНОВНА КАРТА
   ========================================================================== */

section.sec:has(.dd-att) .dd-att {
    position: relative !important;
    max-width: 920px !important;
    margin: 0 auto !important;
    background: #ffffff !important;
    border: 1px solid rgba(48,90,8,.10) !important;
    border-radius: 20px !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-shadow:
        0 10px 35px rgba(48,90,8,.06),
        0 2px 8px rgba(0,0,0,.025) !important;
}

/* ==========================================================================
   ГОРНА ЛЕНТА
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 22px 28px !important;
    background: #f1f5ec !important;
    border-bottom: 1px solid rgba(48,90,8,.10) !important;
}

section.sec:has(.dd-att) .dd-att-h b {
    color: #1a2e05 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}

section.sec:has(.dd-att) .dd-att-h span {
    display: inline-flex !important;
    align-items: center !important;
    padding: 6px 11px !important;
    border-radius: 999px !important;
    background: rgba(94,154,0,.16) !important;
    border: 1px solid rgba(152,219,28,.28) !important;
    color: #305a08 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   TIMELINE
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-l {
    position: relative !important;
    padding: 26px 28px 10px !important;
}

/* Вертикална линия */

section.sec:has(.dd-att) .dd-att-l::before {
    content: "" !important;
    position: absolute !important;
    left: 82px !important;
    top: 42px !important;
    bottom: 42px !important;
    width: 2px !important;
    background: linear-gradient(
        to bottom,
        rgba(152,219,28,.35),
        rgba(152,219,28,.12)
    ) !important;
}

/* ==========================================================================
   РЕД
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 55px 28px minmax(0,1fr) !important;
    align-items: flex-start !important;
    gap: 14px !important;
    padding: 15px 0 !important;
    z-index: 1 !important;
}

/* Час */

section.sec:has(.dd-att) .dd-att-t {
    color: #647254 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 20px !important;
    text-align: right !important;
    white-space: nowrap !important;
}

/* Точка */

section.sec:has(.dd-att) .dd-att-d {
    position: relative !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2 !important;
}

section.sec:has(.dd-att) .dd-att-d i {
    display: block !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    border: 3px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(152,219,28,.45),
        0 3px 8px rgba(48,90,8,.12) !important;
}

/* ==========================================================================
   СЪДЪРЖАНИЕ НА СЪБИТИЕТО
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-x {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    min-width: 0 !important;
    padding: 2px 0 4px !important;
}

section.sec:has(.dd-att) .dd-att-x b {
    color: #203208 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section.sec:has(.dd-att) .dd-att-x span {
    color: #69785f !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   АТАКА — ЧЕРВЕН АКЦЕНТ
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-r.is-bad {
    margin: 0 -10px !important;
    padding: 15px 10px !important;
    border-radius: 12px !important;
    background: #fff6f5 !important;
    border: 1px solid rgba(210,70,55,.10) !important;
}

section.sec:has(.dd-att) .dd-att-r.is-bad .dd-att-t {
    color: #b44a3e !important;
}

section.sec:has(.dd-att) .dd-att-r.is-bad .dd-att-d i {
    background: #df624f !important;
    box-shadow:
        0 0 0 1px rgba(210,70,55,.35),
        0 3px 8px rgba(210,70,55,.15) !important;
}

section.sec:has(.dd-att) .dd-att-r.is-bad .dd-att-x b {
    color: #8f3026 !important;
}

/* ==========================================================================
   УСПЕШЕН КРАЙ
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-r.is-ok {
    margin-top: 5px !important;
    padding-top: 20px !important;
    padding-bottom: 18px !important;
    border-top: 1px dashed rgba(48,90,8,.12) !important;
}

section.sec:has(.dd-att) .dd-att-r.is-ok .dd-att-t {
    color: #4f7c18 !important;
}

section.sec:has(.dd-att) .dd-att-r.is-ok .dd-att-d i {
    background: #7cbf00 !important;
    box-shadow:
        0 0 0 1px rgba(152,219,28,.45),
        0 3px 8px rgba(152,219,28,.18) !important;
}

section.sec:has(.dd-att) .dd-att-r.is-ok .dd-att-x b {
    color: #31590b !important;
}

/* ==========================================================================
   ФИНАЛНА БЕЛЕЖКА
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-end {
    margin: 8px 28px 28px !important;
    padding: 18px 20px !important;
    border-radius: 12px !important;
    background: #f1f7e9 !important;
    border: 1px solid rgba(152,219,28,.20) !important;
    color: #627052 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

section.sec:has(.dd-att) .dd-att-end b {
    color: #305a08 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-r:not(.is-bad):not(.is-ok) {
    transition:
        background .25s ease,
        transform .25s ease !important;
    border-radius: 12px !important;
}

section.sec:has(.dd-att) .dd-att-r:not(.is-bad):not(.is-ok):hover {
    background: #f8faf5 !important;
    transform: translateX(4px) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.dd-att) {
        padding: 70px 16px !important;
    }

    section.sec:has(.dd-att) .dd-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.dd-att) .dd-head h2 {
        font-size: 30px !important;
    }

    section.sec:has(.dd-att) .dd-head p {
        font-size: 14px !important;
    }

    section.sec:has(.dd-att) .dd-att-h {
        padding: 18px 20px !important;
    }

    section.sec:has(.dd-att) .dd-att-l {
        padding: 20px 20px 8px !important;
    }

    section.sec:has(.dd-att) .dd-att-l::before {
        left: 65px !important;
    }

    section.sec:has(.dd-att) .dd-att-r {
        grid-template-columns: 48px 24px minmax(0,1fr) !important;
        gap: 10px !important;
    }

    section.sec:has(.dd-att) .dd-att-d {
        width: 24px !important;
    }

    section.sec:has(.dd-att) .dd-att-x b {
        font-size: 13px !important;
    }

    section.sec:has(.dd-att) .dd-att-x span {
        font-size: 11.5px !important;
    }

    section.sec:has(.dd-att) .dd-att-end {
        margin: 8px 20px 20px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 520px) {

    section.sec:has(.dd-att) {
        padding: 60px 14px !important;
    }

    section.sec:has(.dd-att) .dd-att {
        border-radius: 16px !important;
    }

    section.sec:has(.dd-att) .dd-att-h {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 9px !important;
        padding: 18px !important;
    }

    section.sec:has(.dd-att) .dd-att-l {
        padding: 15px 16px 5px !important;
    }

    section.sec:has(.dd-att) .dd-att-l::before {
        left: 57px !important;
        top: 35px !important;
        bottom: 35px !important;
    }

    section.sec:has(.dd-att) .dd-att-r {
        grid-template-columns: 40px 22px minmax(0,1fr) !important;
        gap: 8px !important;
        padding: 13px 0 !important;
    }

    section.sec:has(.dd-att) .dd-att-t {
        font-size: 10px !important;
    }

    section.sec:has(.dd-att) .dd-att-d {
        width: 22px !important;
    }

    section.sec:has(.dd-att) .dd-att-d i {
        width: 9px !important;
        height: 9px !important;
    }

    section.sec:has(.dd-att) .dd-att-x b {
        font-size: 12.5px !important;
        line-height: 1.4 !important;
    }

    section.sec:has(.dd-att) .dd-att-x span {
        font-size: 11px !important;
        line-height: 1.5 !important;
    }

    section.sec:has(.dd-att) .dd-att-r.is-bad {
        margin: 0 -5px !important;
        padding: 13px 5px !important;
    }

    section.sec:has(.dd-att) .dd-att-end {
        margin: 6px 16px 16px !important;
        padding: 15px 16px !important;
        font-size: 12px !important;
    }
}
/*Какво не обещаваме*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "КАКВО НЕ ОБЕЩАВАМЕ"
   ========================================================================== */

section#limits.sec-wash {
    position: relative !important;
    background: #0b0f08 !important;
    padding: 90px 20px !important;
    color: #f5f7f2 !important;
    overflow: hidden !important;
}

/* Лек зелен ореол */

section#limits.sec-wash::before {
    content: "" !important;
    position: absolute !important;
    width: 620px !important;
    height: 620px !important;
    left: 50% !important;
    top: 10% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.055) 0%,
        rgba(152,219,28,.018) 38%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

section#limits.sec-wash .wrap-n {
    position: relative !important;
    z-index: 1 !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section#limits .dd-head {
    max-width: none !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section#limits .dd-head h2 {
    margin: 0 0 15px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section#limits .dd-head p {
    margin: 0 !important;
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}

/* Зелената черта */

section#limits .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    box-shadow: 0 0 18px rgba(152,219,28,.4) !important;
}

/* ==========================================================================
   ОСНОВНА КАРТА
   ========================================================================== */

section#limits .dd-limits {
    position: relative !important;
    max-width: 920px !important;
    margin: 0 auto !important;
    background: linear-gradient(
        145deg,
        #151a11 0%,
        #10140d 100%
    ) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow:
        0 22px 55px rgba(0,0,0,.35),
        inset 0 1px 0 rgba(255,255,255,.025) !important;
}

/* Светла линия отгоре */

section#limits .dd-limits::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,.55),
        transparent
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВНА ЛЕНТА
   ========================================================================== */

section#limits .dd-limits-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    padding: 23px 28px !important;
    background: rgba(255,255,255,.025) !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
}

section#limits .dd-limits-h b {
    color: #f4f7ef !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section#limits .dd-limits-ic {
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 11px !important;
    background: rgba(152,219,28,.10) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    color: #7cbf00 !important;
}

section#limits .dd-limits-ic svg {
    width: 19px !important;
    height: 19px !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section#limits .dd-limits-l {
    display: flex !important;
    flex-direction: column !important;
    padding: 8px 28px 12px !important;
}

/* ==========================================================================
   ЕЛЕМЕНТ
   ========================================================================== */

section#limits .dd-limits-i {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 9px minmax(0,1fr) !important;
    gap: 16px !important;
    padding: 24px 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

section#limits .dd-limits-i:last-child {
    border-bottom: 0 !important;
}

/* Зелената точка */

section#limits .dd-limits-i > i {
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    margin-top: 7px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow:
        0 0 0 4px rgba(152,219,28,.08),
        0 0 14px rgba(152,219,28,.22) !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section#limits .dd-limits-i > span {
    display: block !important;
    min-width: 0 !important;
}

section#limits .dd-limits-i > span > b {
    display: block !important;
    margin: 0 0 7px !important;
    color: #f1f5ed !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section#limits .dd-limits-i p {
    margin: 0 !important;
    color: #8f998a !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section#limits .dd-limits-i {
    transition:
        background .3s ease,
        padding-left .3s ease !important;
}

section#limits .dd-limits-i:hover {
    background: rgba(152,219,28,.025) !important;
}

section#limits .dd-limits-i:hover > i {
    background: #b1ed45 !important;
    box-shadow:
        0 0 0 5px rgba(152,219,28,.08),
        0 0 18px rgba(152,219,28,.3) !important;
}

section#limits .dd-limits-i:hover > span > b {
    color: #ffffff !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section#limits.sec-wash {
        padding: 70px 16px !important;
    }

    section#limits .dd-head {
        margin-bottom: 38px !important;
    }

    section#limits .dd-head h2 {
        font-size: 30px !important;
    }

    section#limits .dd-head p {
        font-size: 14px !important;
    }

    section#limits .dd-limits-h {
        padding: 20px 22px !important;
    }

    section#limits .dd-limits-l {
        padding: 5px 22px 8px !important;
    }

    section#limits .dd-limits-i {
        padding: 21px 0 !important;
        gap: 14px !important;
    }

    section#limits .dd-limits-i > span > b {
        font-size: 14px !important;
    }

    section#limits .dd-limits-i p {
        font-size: 12.5px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 520px) {

    section#limits.sec-wash {
        padding: 60px 14px !important;
    }

    section#limits .dd-limits {
        border-radius: 16px !important;
    }

    section#limits .dd-limits-h {
        padding: 18px !important;
        gap: 11px !important;
    }

    section#limits .dd-limits-ic {
        flex-basis: 34px !important;
        width: 34px !important;
        height: 34px !important;
        border-radius: 9px !important;
    }

    section#limits .dd-limits-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    section#limits .dd-limits-h b {
        font-size: 14px !important;
    }

    section#limits .dd-limits-l {
        padding: 4px 18px 7px !important;
    }

    section#limits .dd-limits-i {
        grid-template-columns: 8px minmax(0,1fr) !important;
        gap: 13px !important;
        padding: 19px 0 !important;
    }

    section#limits .dd-limits-i > i {
        width: 6px !important;
        height: 6px !important;
        margin-top: 6px !important;
    }

    section#limits .dd-limits-i > span > b {
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    section#limits .dd-limits-i p {
        font-size: 11.5px !important;
        line-height: 1.6 !important;
    }
}
/*Какво трябва да направиш ти*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАКВО ТРЯБВА ДА НАПРАВИШ ТИ"
   ========================================================================== */

section.sec:has(.dd-you) {
    position: relative !important;
    background: #f7f9f4 !important;
    padding: 90px 20px !important;
    color: #1a2e05 !important;
    overflow: hidden !important;
}

/* Лек декоративен зелен ореол */

section.sec:has(.dd-you)::before {
    content: "" !important;
    position: absolute !important;
    width: 580px !important;
    height: 580px !important;
    left: 50% !important;
    top: 15% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.055) 0%,
        rgba(152,219,28,.018) 40%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

section.sec:has(.dd-you) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.dd-you) .dd-head {
    max-width: 760px !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section.sec:has(.dd-you) .dd-head h2 {
    margin: 0 0 15px !important;
    color: #172505 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.dd-you) .dd-head p {
    margin: 0 !important;
    color: #617052 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}

/* Зелен акцент */

section.sec:has(.dd-you) .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    box-shadow: 0 0 18px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec:has(.dd-you) .dd-you {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
    align-items: stretch !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    min-height: 230px !important;
    padding: 28px 26px !important;
    background: #ffffff !important;
    border: 1px solid rgba(48,90,8,.10) !important;
    border-radius: 17px !important;
    box-shadow:
        0 5px 18px rgba(48,90,8,.035),
        0 1px 3px rgba(0,0,0,.025) !important;
    overflow: hidden !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}

/* Горна зелена линия */

section.sec:has(.dd-you) .dd-you-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,.55),
        transparent
    ) !important;
    opacity: 0 !important;
    transition: opacity .3s ease !important;
}

/* ==========================================================================
   ОСНОВНА КАРТА "НИЩО"
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i.big {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f5f9ef 100%
        ) !important;
    border-color: rgba(152,219,28,.32) !important;
    box-shadow:
        0 10px 30px rgba(48,90,8,.06),
        0 0 28px rgba(152,219,28,.045),
        inset 0 1px 0 rgba(152,219,28,.10) !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-ic {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 21px !important;
    border-radius: 12px !important;
    background: rgba(152,219,28,.12) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #4a780e !important;
}

section.sec:has(.dd-you) .dd-you-ic svg {
    width: 20px !important;
    height: 20px !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i > b {
    display: block !important;
    margin: 0 0 9px !important;
    color: #1b3006 !important;
    font-size: 18px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i > p {
    margin: 0 !important;
    color: #65745d !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(105,201,14,.35) !important;
    box-shadow:
        0 16px 32px rgba(48,90,8,.08),
        0 0 24px rgba(152,219,28,.045) !important;
}

section.sec:has(.dd-you) .dd-you-i:hover::before {
    opacity: 1 !important;
}

section.sec:has(.dd-you) .dd-you-i:hover .dd-you-ic {
    background: rgba(152,219,28,.18) !important;
    border-color: rgba(152,219,28,.40) !important;
    color: #305a08 !important;
}

/* Основната карта да изпъква */

section.sec:has(.dd-you) .dd-you-i.big:hover {
    border-color: rgba(105,201,14,.50) !important;
    box-shadow:
        0 18px 38px rgba(48,90,8,.10),
        0 0 30px rgba(152,219,28,.07) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.dd-you) {
        padding: 75px 18px !important;
    }

    section.sec:has(.dd-you) .dd-you {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec:has(.dd-you) .dd-you-i.big {
        grid-column: 1 / -1 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec:has(.dd-you) {
        padding: 60px 16px !important;
    }

    section.sec:has(.dd-you) .dd-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.dd-you) .dd-head h2 {
        font-size: 30px !important;
    }

    section.sec:has(.dd-you) .dd-head p {
        font-size: 14px !important;
    }

    section.sec:has(.dd-you) .dd-you {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    section.sec:has(.dd-you) .dd-you-i,
    section.sec:has(.dd-you) .dd-you-i.big {
        grid-column: auto !important;
        min-height: auto !important;
        padding: 24px 21px !important;
        border-radius: 15px !important;
    }

    section.sec:has(.dd-you) .dd-you-ic {
        width: 39px !important;
        height: 39px !important;
        flex-basis: 39px !important;
        margin-bottom: 17px !important;
    }

    section.sec:has(.dd-you) .dd-you-i > b {
        font-size: 17px !important;
    }

    section.sec:has(.dd-you) .dd-you-i > p {
        font-size: 12px !important;
        line-height: 1.6 !important;
    }

    section.sec:has(.dd-you) .dd-you-i:hover {
        transform: translateY(-4px) !important;
    }
}

/*Кой обикновено бива атакуван*/


/* =========================================
   DD-WHO — светъл фон + тъмни боксове
   ========================================= */

.dd-who {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.dd-who-i {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;

  background: #18220f !important;
  border: 1px solid rgba(183, 255, 53, 0.18) !important;
  border-radius: 18px !important;

  padding: 28px 24px !important;
  min-height: 230px !important;

  box-shadow:
    0 8px 24px rgba(20, 30, 10, 0.10) !important;

  transition:
    transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),
    border-color 0.35s ease,
    box-shadow 0.35s ease !important;
}

.dd-who-i:hover {
  transform: translateY(-5px) !important;

  border-color: rgba(183, 255, 53, 0.55) !important;

  box-shadow:
    0 18px 38px rgba(20, 30, 10, 0.16),
    0 0 0 1px rgba(183, 255, 53, 0.05) !important;
}

/* Иконка */

.dd-who-ic {
  width: 46px !important;
  height: 46px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin-bottom: 22px !important;

  color: #b7ff35 !important;
  background: rgba(183, 255, 53, 0.10) !important;

  border: 1px solid rgba(183, 255, 53, 0.18) !important;
  border-radius: 13px !important;

  flex-shrink: 0 !important;
}

.dd-who-ic svg {
  width: 22px !important;
  height: 22px !important;
}

/* Заглавие */

.dd-who-i > b {
  display: block !important;

  margin: 0 0 10px !important;

  color: #ffffff !important;

  font-size: 1.05rem !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}

/* Описание */

.dd-who-i > p {
  margin: 0 !important;

  color: rgba(255, 255, 255, 0.68) !important;

  font-size: 0.94rem !important;
  line-height: 1.65 !important;
}

/* Светъл фон на самата секция */
.sec.sec-wash {
  background: #f7f9f3 !important;
}

/* Заглавие над боксовете */

.sec.sec-wash .dd-head h2 {
  color: #7cb316 !important;
}

.sec.sec-wash .dd-head p {
  color: #7cb316 !important;
}


/* =========================================
   Responsive
   ========================================= */

@media (max-width: 1050px) {
  .dd-who {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 600px) {
  .dd-who {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    margin-top: 30px !important;
  }

  .dd-who-i {
    min-height: auto !important;
    padding: 24px 21px !important;
  }

  .dd-who-ic {
    width: 42px !important;
    height: 42px !important;
    margin-bottom: 18px !important;
  }

  .dd-who-i > b {
    font-size: 1rem !important;
  }

  .dd-who-i > p {
    font-size: 0.92rem !important;
  }
}

/*faq*/


/* =========================================
   DD FAQ — светъл дизайн
   ========================================= */

.dd-faq {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.dd-faq-i {
  position: relative !important;

  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;

  padding: 28px 25px !important;

  cursor: pointer !important;

  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;

  transition:
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    transform 0.35s ease !important;
}

.dd-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.55) !important;

  box-shadow:
    0 16px 30px rgba(48, 90, 8, 0.08) !important;

  transform: translateY(-2px) !important;
}


/* =========================================
   Заглавие
   ========================================= */

.dd-faq-i h3 {
  position: relative !important;

  margin: 0 !important;
  padding: 0 32px 0 0 !important;

  color: #1a2e05 !important;

  font-size: 1.08rem !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
}


/* =========================================
   Плюс / минус
   ========================================= */

.dd-faq-i h3::after {
  content: '+' !important;

  position: absolute !important;
  right: 0 !important;
  top: 50% !important;

  transform: translateY(-50%) !important;

  width: 25px !important;
  height: 25px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  color: #305a08 !important;

  font-size: 1.35rem !important;
  line-height: 1 !important;
  font-weight: 400 !important;

  transition: transform 0.3s ease !important;
}

.dd-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}


/* =========================================
   Малък етикет
   ========================================= */

.dd-faq-i .dd-faq-n {
  display: inline-block !important;

  margin: 0 0 12px !important;
  padding: 4px 10px !important;

  border-radius: 20px !important;

  background: rgba(183, 255, 53, 0.20) !important;

  color: #305a08 !important;

  font-size: 0.75rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;

  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}


/* =========================================
   Отговор
   ========================================= */

.dd-faq-i p {
  max-height: 0 !important;

  overflow: hidden !important;

  opacity: 0 !important;

  margin: 0 !important;

  color: #4a5c3a !important;

  font-size: 0.95rem !important;
  line-height: 1.65 !important;

  transition:
    max-height 0.45s cubic-bezier(0.165, 0.84, 0.44, 1),
    opacity 0.3s ease,
    margin-top 0.3s ease !important;
}

.dd-faq-i.is-open p {
  max-height: 500px !important;

  opacity: 1 !important;

  margin-top: 15px !important;
}


/* =========================================
   Bold вътре в отговора
   ========================================= */

.dd-faq-i p b {
  color: #1a2e05 !important;
  font-weight: 700 !important;
}


/* =========================================
   Светъл фон на секцията
   ========================================= */

.sec:has(.dd-faq) {
  background: #f7f9f3 !important;
}

.sec:has(.dd-faq) .dd-head h2 {
  color: #1a2e05 !important;
}

.sec:has(.dd-faq) .dd-head p {
  color: #617052 !important;
}


/* =========================================
   Responsive
   ========================================= */

@media (max-width: 800px) {
  .dd-faq {
    grid-template-columns: 1fr !important;
    gap: 15px !important;
    margin-top: 30px !important;
  }

  .dd-faq-i {
    padding: 23px 20px !important;
  }
}

@media (max-width: 480px) {
  .dd-faq-i h3 {
    font-size: 1rem !important;
  }

  .dd-faq-i p {
    font-size: 0.92rem !important;
    line-height: 1.6 !important;
  }

  .dd-faq-i .dd-faq-n {
    font-size: 0.7rem !important;
  }
}

/*kontakti/faq*/

/* =========================================
   KT FAQ — светъл дизайн
   ========================================= */

.kt-faq {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.kt-faq-i {
  position: relative !important;

  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;

  padding: 28px 25px !important;

  cursor: pointer !important;

  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;

  transition:
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    transform 0.35s ease !important;
}

.kt-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.55) !important;

  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;

  transform: translateY(-2px) !important;
}


/* =========================================
   Въпрос
   ========================================= */

.kt-faq-i h3 {
  position: relative !important;

  margin: 0 !important;
  padding: 0 35px 0 0 !important;

  color: #1a2e05 !important;

  font-size: 1.08rem !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
}


/* =========================================
   Плюс / минус
   ========================================= */

.kt-faq-i h3::after {
  content: '+' !important;

  position: absolute !important;
  right: 0 !important;
  top: 50% !important;

  transform: translateY(-50%) !important;

  width: 26px !important;
  height: 26px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  color: #305a08 !important;

  font-size: 1.35rem !important;
  line-height: 1 !important;
  font-weight: 400 !important;

  transition: transform 0.3s ease !important;
}

.kt-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}


/* =========================================
   Отговор
   ========================================= */

.kt-faq-i p {
  max-height: 0 !important;

  overflow: hidden !important;

  opacity: 0 !important;

  margin: 0 !important;

  color: #4a5c3a !important;

  font-size: 0.95rem !important;
  line-height: 1.65 !important;

  transition:
    max-height 0.45s cubic-bezier(0.165, 0.84, 0.44, 1),
    opacity 0.3s ease,
    margin-top 0.3s ease !important;
}

.kt-faq-i.is-open p {
  max-height: 300px !important;

  opacity: 1 !important;

  margin-top: 15px !important;
}


/* =========================================
   Bold в отговора
   ========================================= */

.kt-faq-i p b {
  color: #1a2e05 !important;
  font-weight: 700 !important;
}


/* =========================================
   Светъл фон на секцията
   ========================================= */

.sec.sec-wash:has(.kt-faq) {
  background: #f7f9f3 !important;
}

.sec.sec-wash:has(.kt-faq) .kt-head h2 {
  color: #1a2e05 !important;
}


/* =========================================
   Responsive
   ========================================= */

@media (max-width: 800px) {
  .kt-faq {
    grid-template-columns: 1fr !important;
    gap: 15px !important;
    margin-top: 30px !important;
  }

  .kt-faq-i {
    padding: 23px 20px !important;
  }
}

@media (max-width: 480px) {
  .kt-faq-i h3 {
    font-size: 1rem !important;
  }

  .kt-faq-i p {
    font-size: 0.92rem !important;
    line-height: 1.6 !important;
  }
}

/*Данни за фактури*/

/* =========================================
   СВЕТЪЛ ДИЗАЙН — ДАННИ ЗА ФАКТУРИ
   ========================================= */

.kt-firm {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
    margin-top: 40px !important;
}

.kt-firm-i {
    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 16px !important;
    padding: 28px 26px !important;
    position: relative !important;
    box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
    transition:
        transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),
        border-color 0.35s ease,
        box-shadow 0.35s ease !important;
}

.kt-firm-i:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(105, 201, 14, 0.5) !important;
    box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

/* Заглавие на картата */
.kt-firm-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 22px !important;
    color: #1a2e05 !important;
}

.kt-firm-h b {
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    color: #1a2e05 !important;
}

/* Иконка */
.kt-firm-ic {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: rgba(183, 255, 53, 0.18) !important;
    color: #305a08 !important;
}

.kt-firm-ic svg {
    width: 21px !important;
    height: 21px !important;
}

/* Списък с данните */
.kt-firm-l {
    display: flex !important;
    flex-direction: column !important;
    border-top: 1px solid #edf2e8 !important;
}

/* Един ред */
.kt-firm-r {
    display: grid !important;
    grid-template-columns: 115px minmax(0, 1fr) !important;
    gap: 18px !important;
    align-items: start !important;
    padding: 14px 0 !important;
    border-bottom: 1px solid #edf2e8 !important;
}

.kt-firm-r > span:first-child {
    color: #718064 !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
}

.kt-firm-r > span:last-child {
    color: #26351c !important;
    font-size: 0.94rem !important;
    line-height: 1.5 !important;
    font-weight: 500 !important;
}

/* Данни като IBAN / BIC / ЕИК */
.kt-firm-r .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        "Liberation Mono",
        monospace !important;
    font-size: 0.86rem !important;
    color: #305a08 !important;
    letter-spacing: 0.01em !important;
    overflow-wrap: anywhere !important;
}

/* Долна бележка */
.kt-firm-note {
    margin-top: 20px !important;
    padding: 15px 16px !important;
    background: #f5faef !important;
    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 11px !important;
    color: #59684e !important;
    font-size: 0.9rem !important;
    line-height: 1.6 !important;
}

.kt-firm-note b {
    display: block !important;
    margin-bottom: 3px !important;
    color: #305a08 !important;
    font-weight: 700 !important;
}


/* =========================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================= */

.kt-head {
    margin-bottom: 0 !important;
}

.kt-head h2 {
    color: #1a2e05 !important;
}

.kt-head p {
    color: #66755c !important;
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 800px) {
    .kt-firm {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 30px !important;
    }

    .kt-firm-i {
        padding: 24px 20px !important;
    }
}

@media (max-width: 520px) {
    .kt-firm-h {
        margin-bottom: 18px !important;
    }

    .kt-firm-h b {
        font-size: 1.05rem !important;
    }

    .kt-firm-r {
        grid-template-columns: 1fr !important;
        gap: 4px !important;
        padding: 12px 0 !important;
    }

    .kt-firm-r > span:first-child {
        font-size: 0.8rem !important;
        text-transform: uppercase !important;
        letter-spacing: 0.04em !important;
    }

    .kt-firm-r > span:last-child {
        font-size: 0.9rem !important;
    }

    .kt-firm-note {
        font-size: 0.86rem !important;
        padding: 13px 14px !important;
    }
}
/*Къде сме*/ 

/* =========================================
   KT PLACE — ТЪМЕН ДИЗАЙН
   ========================================= */

.kt-place {
    margin-top: 40px !important;
}

.kt-place-in {
    display: grid !important;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) !important;
    min-height: 470px !important;
    overflow: hidden !important;
    border: 1px solid rgba(183, 255, 53, 0.14) !important;
    border-radius: 20px !important;
    background: #111a0d !important;
    box-shadow: 0 20px 45px rgba(20, 35, 8, 0.12) !important;
}

/* =========================================
   ЛЯВА ИНФОРМАЦИОННА ЧАСТ
   ========================================= */

.kt-place-t {
    padding: 38px !important;
    background:
        radial-gradient(
            circle at 15% 10%,
            rgba(183, 255, 53, 0.08),
            transparent 35%
        ),
        #111a0d !important;
    color: #ffffff !important;
}

.kt-place-t h3 {
    margin: 0 0 30px !important;
    color: #ffffff !important;
    font-size: 1.45rem !important;
    font-weight: 700 !important;
}

/* Контактни редове */
.kt-addr {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
}

.kt-addr-r {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    padding: 17px 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.kt-addr-r:first-child {
    padding-top: 0 !important;
}

.kt-addr-ic {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 11px !important;
    color: #b7ff35 !important;
    background: rgba(183, 255, 53, 0.09) !important;
}

.kt-addr-ic svg {
    width: 19px !important;
    height: 19px !important;
}

.kt-addr-r > span:last-child {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    color: #c3cdbb !important;
    font-size: 0.93rem !important;
    line-height: 1.55 !important;
}

.kt-addr-r > span:last-child > b {
    color: #ffffff !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}

.kt-addr-r a {
    color: #b7ff35 !important;
    text-decoration: none !important;
    transition: color 0.25s ease !important;
}

.kt-addr-r a:hover {
    color: #d1ff83 !important;
    text-decoration: underline !important;
}

/* =========================================
   СЪОБЩЕНИЕ
   ========================================= */

.kt-place-say {
    margin-top: 25px !important;
    padding: 16px 17px !important;
    border: 1px solid rgba(183, 255, 53, 0.14) !important;
    border-radius: 12px !important;
    background: rgba(183, 255, 53, 0.055) !important;
    color: #aeb9a6 !important;
    font-size: 0.88rem !important;
    line-height: 1.6 !important;
}

.kt-place-say b {
    color: #d9ff9c !important;
}


/* =========================================
   MAP
   ========================================= */

.kt-map {
    position: relative !important;
    min-height: 470px !important;
    overflow: hidden !important;
    background:
        radial-gradient(
            circle at 50% 45%,
            rgba(183, 255, 53, 0.06),
            transparent 34%
        ),
        #182216 !important;
}

/* Мрежа на картата */
.kt-map-grid {
    position: absolute !important;
    inset: 0 !important;
    opacity: 0.55 !important;
    background-image:
        linear-gradient(
            rgba(183, 255, 53, 0.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(183, 255, 53, 0.055) 1px,
            transparent 1px
        ) !important;
    background-size: 38px 38px !important;
}

/* Леко затъмняване по краищата */
.kt-map::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        radial-gradient(
            circle at center,
            transparent 30%,
            rgba(7, 12, 6, 0.38) 100%
        ) !important;
}

/* =========================================
   УСЛОВНИ ПЪТИЩА
   ========================================= */

.kt-map-road {
    position: absolute !important;
    height: 2px !important;
    background: rgba(255, 255, 255, 0.09) !important;
    transform-origin: left center !important;
}

.kt-map-road.r1 {
    width: 115% !important;
    left: -8% !important;
    top: 31% !important;
    transform: rotate(8deg) !important;
}

.kt-map-road.r2 {
    width: 90% !important;
    left: 13% !important;
    top: 57% !important;
    transform: rotate(-18deg) !important;
}

.kt-map-road.r3 {
    width: 80% !important;
    left: 4% !important;
    top: 70% !important;
    transform: rotate(25deg) !important;
}

.kt-map-road.r4 {
    width: 75% !important;
    left: 36% !important;
    top: 8% !important;
    transform: rotate(72deg) !important;
}


/* =========================================
   PIN
   ========================================= */

.kt-map-pin {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    z-index: 3 !important;
    transform: translate(-50%, -50%) !important;
    text-align: center !important;
}

.kt-map-dot {
    width: 18px !important;
    height: 18px !important;
    margin: 0 auto 13px !important;
    border-radius: 50% !important;
    background: #b7ff35 !important;
    border: 4px solid rgba(183, 255, 53, 0.18) !important;
    box-shadow:
        0 0 0 8px rgba(183, 255, 53, 0.08),
        0 0 30px rgba(183, 255, 53, 0.35) !important;
}

.kt-map-name {
    color: #ffffff !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    margin-bottom: 4px !important;
}

.kt-map-city {
    color: #aab5a2 !important;
    font-size: 0.8rem !important;
}


/* =========================================
   MAP BUTTON
   ========================================= */

.kt-map-go {
    position: absolute !important;
    z-index: 5 !important;
    right: 22px !important;
    bottom: 22px !important;
}

.kt-map-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    padding: 9px 16px !important;
    border-radius: 9px !important;
    border: 1px solid rgba(183, 255, 53, 0.2) !important;
    background: #b7ff35 !important;
    color: #182506 !important;
    font-size: 0.84rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2) !important;
    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease !important;
}

.kt-map-go .btn:hover {
    transform: translateY(-2px) !important;
    background: #c9ff69 !important;
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.28) !important;
}


/* =========================================
   ЗАГЛАВИЕ — СВЕТЛО, ЗА ДА СЕ ВИЖДА
   ========================================= */

.kt-head h2 {
    color: #7db713!important;
}

.kt-head p {
    color: #7db713!important;
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 850px) {
    .kt-place-in {
        grid-template-columns: 1fr !important;
    }

    .kt-map {
        min-height: 400px !important;
    }

    .kt-place-t {
        padding: 30px 25px !important;
    }
}

@media (max-width: 520px) {
    .kt-place {
        margin-top: 28px !important;
    }

    .kt-place-in {
        border-radius: 16px !important;
    }

    .kt-place-t {
        padding: 25px 20px !important;
    }

    .kt-place-t h3 {
        margin-bottom: 24px !important;
        font-size: 1.25rem !important;
    }

    .kt-map {
        min-height: 340px !important;
    }

    .kt-map-go {
        right: 15px !important;
        bottom: 15px !important;
    }

    .kt-map-go .btn {
        min-height: 38px !important;
        padding: 8px 13px !important;
        font-size: 0.8rem !important;
    }
}

/*kontakti/*/

/* =========================================
   KT FORM — СВЕТЪЛ ДИЗАЙН
   ========================================= */

.kt-form-wrap {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 330px !important;
    gap: 24px !important;
    margin-top: 40px !important;
    align-items: start !important;
}

/* =========================================
   ОСНОВНА ФОРМА
   ========================================= */

.kt-form {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 18px !important;
    padding: 32px !important;
    box-shadow: 0 5px 20px rgba(48, 90, 8, 0.04) !important;
}

.kt-trap {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* =========================================
   ПОЛЕТА
   ========================================= */

.kt-one,
.kt-row {
    margin-bottom: 21px !important;
}

.kt-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
}

.kt-l {
    display: block !important;
    margin-bottom: 8px !important;
    color: #27361e !important;
    font-size: 0.86rem !important;
    font-weight: 700 !important;
}

.kt-l em {
    color: #87947e !important;
    font-style: normal !important;
    font-weight: 500 !important;
}


/* =========================================
   INPUTS
   ========================================= */

.kt-in,
.kt-sel,
.kt-ta {
    width: 100% !important;
    box-sizing: border-box !important;
    border: 1px solid #dce5d7 !important;
    border-radius: 10px !important;
    background: #fbfdf9 !important;
    color: #24321c !important;
    font-family: inherit !important;
    font-size: 0.94rem !important;
    outline: none !important;
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease !important;
}

.kt-in,
.kt-sel {
    height: 48px !important;
    padding: 0 14px !important;
}

.kt-ta {
    min-height: 145px !important;
    padding: 13px 14px !important;
    resize: vertical !important;
    line-height: 1.55 !important;
}

.kt-in::placeholder,
.kt-ta::placeholder {
    color: #a1aba0 !important;
}

.kt-in:hover,
.kt-sel:hover,
.kt-ta:hover {
    border-color: #c6d5bc !important;
}

.kt-in:focus,
.kt-sel:focus,
.kt-ta:focus {
    border-color: #8dcc20 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(152, 219, 28, 0.14) !important;
}


/* =========================================
   SELECT
   ========================================= */

.kt-sel {
    appearance: none !important;
    cursor: pointer !important;
    padding-right: 42px !important;
    background-image:
        linear-gradient(45deg, transparent 50%, #5d6d52 50%),
        linear-gradient(135deg, #5d6d52 50%, transparent 50%) !important;
    background-position:
        calc(100% - 18px) 20px,
        calc(100% - 13px) 20px !important;
    background-size: 5px 5px, 5px 5px !important;
    background-repeat: no-repeat !important;
}


/* =========================================
   HINT
   ========================================= */

.kt-hint {
    margin: 7px 0 0 !important;
    color: #7a8871 !important;
    font-size: 0.78rem !important;
    line-height: 1.5 !important;
}


/* =========================================
   EXTRA DOMAIN BOX
   ========================================= */

.kt-extra {
    margin: 4px 0 22px !important;
    padding: 19px !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 12px !important;
    background: #f6faef !important;
}

.kt-extra-h {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 15px !important;
    color: #305a08 !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
}

.kt-extra-h svg {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 auto !important;
}


/* =========================================
   CHECKBOX
   ========================================= */

.kt-check {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin: 5px 0 24px !important;
    color: #66735f !important;
    font-size: 0.82rem !important;
    line-height: 1.5 !important;
    cursor: pointer !important;
}

.kt-check input {
    width: 17px !important;
    height: 17px !important;
    min-width: 17px !important;
    margin: 1px 0 0 !important;
    accent-color: #72ad16 !important;
    cursor: pointer !important;
}

.kt-check a {
    color: #4e850b !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.kt-check a:hover {
    text-decoration: underline !important;
}


/* =========================================
   SUBMIT
   ========================================= */

.kt-go {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex-wrap: wrap !important;
}

.kt-go .btn {
    min-height: 48px !important;
    padding: 0 24px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: #72ad16 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 0.92rem !important;
    cursor: pointer !important;
    box-shadow: 0 7px 18px rgba(83, 133, 13, 0.18) !important;
    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease !important;
}

.kt-go .btn:hover {
    transform: translateY(-2px) !important;
    background: #60960f !important;
    box-shadow: 0 11px 24px rgba(83, 133, 13, 0.24) !important;
}

.kt-note {
    color: #7a8871 !important;
    font-size: 0.78rem !important;
    line-height: 1.45 !important;
}

.kt-note b {
    color: #305a08 !important;
}


/* =========================================
   ДЯСНА КОЛОНА
   ========================================= */

.kt-aside {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

.kt-card {
    padding: 22px !important;
    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 15px !important;
    background: #ffffff !important;
    box-shadow: 0 5px 18px rgba(48, 90, 8, 0.04) !important;
    color: #596650 !important;
}

.kt-card.urgent {
    border-color: rgba(152, 219, 28, 0.4) !important;
    background: #f5faed !important;
}

.kt-card.blue {
    background: #ffffff !important;
}

.kt-card-h {
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
    margin-bottom: 13px !important;
}

.kt-card-h b {
    color: #1a2e05 !important;
    font-size: 1rem !important;
}

.kt-card-ic {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 10px !important;
    color: #4e850b !important;
    background: rgba(183, 255, 53, 0.17) !important;
}

.kt-card-ic svg {
    width: 19px !important;
    height: 19px !important;
}

.kt-card p {
    margin: 0 0 17px !important;
    color: #697663 !important;
    font-size: 0.86rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   БУТОНИ В SIDEBAR
   ========================================= */

.kt-card .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 0 17px !important;
    border-radius: 9px !important;
    background: #72ad16 !important;
    color: #ffffff !important;
    font-size: 0.84rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition:
        transform 0.25s ease,
        background 0.25s ease !important;
}

.kt-card .btn:hover {
    transform: translateY(-2px) !important;
    background: #60960f !important;
}

.kt-card .btn-ghost {
    background: #f3f8ed !important;
    border: 1px solid rgba(114, 173, 22, 0.25) !important;
    color: #4e850b !important;
}

.kt-card .btn-ghost:hover {
    background: #eaf4df !important;
}


/* =========================================
   РАБОТНО ВРЕМЕ
   ========================================= */

.kt-hours {
    border-top: 1px solid #edf2e8 !important;
}

.kt-hours-r {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 15px !important;
    padding: 11px 0 !important;
    border-bottom: 1px solid #edf2e8 !important;
    color: #74806d !important;
    font-size: 0.83rem !important;
}

.kt-hours-r:last-child {
    border-bottom: 0 !important;
}

.kt-hours-r b {
    color: #2d3d23 !important;
    font-weight: 700 !important;
}

.kt-hours-r.all b {
    color: #4e850b !important;
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 900px) {
    .kt-form-wrap {
        grid-template-columns: 1fr !important;
    }

    .kt-aside {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 700px) {
    .kt-form {
        padding: 24px 20px !important;
    }

    .kt-row {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }

    .kt-aside {
        grid-template-columns: 1fr !important;
    }

    .kt-go {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .kt-go .btn {
        width: 100% !important;
    }
}

@media (max-width: 480px) {
    .kt-form-wrap {
        margin-top: 28px !important;
    }

    .kt-form {
        border-radius: 15px !important;
        padding: 21px 17px !important;
    }

    .kt-card {
        padding: 19px !important;
    }

    .kt-extra {
        padding: 16px !important;
    }
}

/*kontakti/*/


/* =========================================================
   KT HERO — DARK + ELECTRIC GREEN
   ========================================================= */

.kt-hero {
    position: relative;
    overflow: hidden;
    padding: 80px 0;
    background: #11151b;
    color: #f2f4f7;
    border-top: 1px solid rgba(255,255,255,.04);
    border-bottom: 1px solid rgba(255,255,255,.04);
}

.kt-hero .wrap-w {
    position: relative;
    z-index: 1;
}

/* =========================================================
   HEADER
   ========================================================= */

.kt-hero h1 {
    margin: 0 0 14px;
    color: #ffffff;
    font-size: clamp(40px, 5vw, 64px);
    line-height: 1.05;
    letter-spacing: -.045em;
    font-weight: 500;
}

.kt-hero > .wrap-w > p {
    max-width: 680px;
    margin: 0 0 38px;
    color: #9ca5b2;
    font-size: 17px;
    line-height: 1.65;
}

/* =========================================================
   CONTACT CARDS
   ========================================================= */

.kt-big {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin: 0;
}

.kt-big-i {
    position: relative;
    display: block;
    min-height: 190px;
    padding: 25px;

    color: #e9edf2;
    text-decoration: none;

    background: #191e25;
    border: 1px solid #2a313b;
    border-radius: 12px;

    transition:
        background .2s ease,
        border-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.kt-big-i:hover {
    color: #fff;
    background: #1c2329;
    border-color: rgba(82,255,145,.55);
    transform: translateY(-2px);
    box-shadow:
        0 10px 30px rgba(0,0,0,.20),
        0 0 0 1px rgba(82,255,145,.05);
}

/* =========================================================
   CARD TOP
   ========================================================= */

.kt-big-top {
    display: flex;
    align-items: center;
    gap: 11px;

    color: #aeb7c3;
    font-size: 13px;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.kt-big-top b {
    color: #d1d7df;
    font-weight: 700;
}

.kt-big-ic {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;
    flex: 0 0 38px;

    color: #52ff91;
    background: rgba(82,255,145,.07);
    border: 1px solid rgba(82,255,145,.22);
    border-radius: 9px;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.kt-big-i:hover .kt-big-ic {
    color: #11151b;
    background: #52ff91;
    border-color: #52ff91;
}

.kt-big-ic svg {
    width: 19px;
    height: 19px;
}

/* =========================================================
   MAIN CONTACT VALUE
   ========================================================= */

.kt-big-v {
    margin-top: 30px;

    color: #ffffff;
    font-size: 26px;
    line-height: 1.2;
    letter-spacing: -.025em;
    font-weight: 750;

    overflow-wrap: anywhere;
}

.kt-big-i:first-child .kt-big-v {
    font-size: 32px;
    letter-spacing: -.035em;
}

/* =========================================================
   DESCRIPTION
   ========================================================= */

.kt-big-w {
    margin-top: 10px;

    color: #7f8997;
    font-size: 13px;
    line-height: 1.5;
}

/* =========================================================
   ONLINE STATUS
   ========================================================= */

.kt-now {
    display: flex;
    align-items: center;
    gap: 10px;

    width: fit-content;
    max-width: 100%;

    margin-top: 18px;
    padding: 11px 15px;

    color: #929ca9;

    background: #191e25;
    border: 1px solid #2a313b;
    border-radius: 8px;

    font-size: 13px;
    line-height: 1.45;
}

.kt-now b {
    color: #d9dee5;
}

.kt-now-dot {
    position: relative;

    width: 8px;
    height: 8px;
    flex: 0 0 8px;

    background: #52ff91;
    border-radius: 50%;

    box-shadow:
        0 0 0 3px rgba(82,255,145,.10),
        0 0 12px rgba(82,255,145,.35);
}

/* =========================================================
   SUBTLE GREEN LINE
   ========================================================= */

.kt-now::before {
    content: "";
    width: 1px;
    height: 18px;
    margin-left: 1px;
    background: rgba(82,255,145,.18);
    order: 2;
}

.kt-now-dot {
    order: 1;
}

.kt-now > span:last-child {
    order: 3;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

    .kt-hero {
        padding: 65px 0;
    }

    .kt-big {
        grid-template-columns: 1fr;
    }

    .kt-big-i {
        min-height: auto;
    }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .kt-hero {
        padding: 52px 0;
    }

    .kt-hero h1 {
        font-size: 42px;
        line-height: 1.05;
    }

    .kt-hero > .wrap-w > p {
        margin-bottom: 28px;
        font-size: 15px;
        line-height: 1.6;
    }

    .kt-big {
        gap: 12px;
    }

    .kt-big-i {
        padding: 20px;
        border-radius: 10px;
    }

    .kt-big-v,
    .kt-big-i:first-child .kt-big-v {
        margin-top: 24px;
        font-size: 24px;
    }

    .kt-big-w {
        font-size: 12px;
    }

    .kt-now {
        width: 100%;
        box-sizing: border-box;
        align-items: flex-start;
        border-radius: 8px;
    }

    .kt-now::before {
        display: none;
    }
}

/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.kt-big-i:focus-visible {
    outline: 2px solid #52ff91;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .kt-big-i,
    .kt-big-ic {
        transition: none;
    }

    .kt-big-i:hover {
        transform: none;
    }
}

/*начална*/


```css
/* =========================================
   КАКВО КАЗВАТ КЛИЕНТИТЕ
   ========================================= */

.rev-head {
    display: block;
    margin-bottom: 36px;
}

.rev-head h2 {
    margin: 0 0 24px;
}


/* ТРИТЕ БОКСА — ВИНАГИ НА ЕДИН РЕД */

.rev-scores {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px;
    width: 100%;
    max-width: none;
    margin: 0;
}

.rev-score {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;

    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 9px;

    padding: 15px 17px;

    background: #fff;
    border: 1px solid rgba(20, 28, 38, .10);
    border-radius: 12px;

    box-shadow: none;
}

.rev-score .src {
    flex: 0 0 100%;

    font-size: 11px;
    line-height: 1.2;
    font-weight: 700;
    color: #737c85;

    text-transform: uppercase;
    letter-spacing: .05em;
}

.rev-score .stars {
    display: inline-flex;
    align-items: center;
    gap: 2px;

    color: #b7ff00;
}

.rev-score .stars svg {
    width: 14px;
    height: 14px;
    display: block;
}

.rev-score > b {
    font-size: 20px;
    line-height: 1;
    font-weight: 800;
    color: #151c23;
}

.rev-score > span:last-child {
    flex: 0 0 100%;

    font-size: 11px;
    line-height: 1.3;
    color: #8a929a;
}


/* =========================================
   ЦИТАТИТЕ — 4 НА ЕДИН РЕД
   ========================================= */

.rev-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px;
}

.rev-card {
    min-width: 0;
}


/* =========================================
   ТАБЛЕТ
   ========================================= */

@media (max-width: 900px) {

    .rev-scores {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 10px;
    }

    .rev-score {
        padding: 13px;
    }

    .rev-score > b {
        font-size: 18px;
    }

    .rev-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}


/* =========================================
   ТЕЛЕФОН
   ========================================= */

@media (max-width: 600px) {

    .rev-scores {
        grid-template-columns: 1fr !important;
    }

    .rev-grid {
        grid-template-columns: 1fr !important;
    }
}
```
/*spodelen-hosting/Всичко едно до друго*/


/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СРАВНЕНИЕ НА ПАКЕТИТЕ
   Само за .sh-tbl / .sh-head
   ========================================================================== */

.sh-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    border-radius: 18px !important;
    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;

    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* Електриково зелена линия отгоре */
.sh-tbl::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 30%,
        #c4f76b 50%,
        #7cbf00 70%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.sh-tbl table {
    width: 100% !important;
    min-width: 720px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: transparent !important;
    color: #d5d9cf !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.sh-tbl thead th {
    position: relative !important;
    padding: 20px 18px !important;
    background: #13180d !important;
    color: #f5f7f2 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;

    font-size: 14px !important;
    font-weight: 750 !important;
    line-height: 1.3 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.sh-tbl thead th:first-child {
    width: 32% !important;
    border-top-left-radius: 15px !important;
}

.sh-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.sh-tbl tbody td {
    padding: 17px 18px !important;
    background: #0d1109 !important;

    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;

    color: #aeb5a5 !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;

    transition:
        background 0.25s ease,
        color 0.25s ease !important;
}

/* Първа колона */
.sh-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;

    font-size: 13.5px !important;
    font-weight: 650 !important;

    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

/* Имена на параметрите */
.sh-tbl tbody td:first-child b {
    color: #f0f2ec !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.sh-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #aeb5a5 !important;
    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.sh-tbl tbody tr {
    transition: transform 0.2s ease !important;
}

.sh-tbl tbody tr:hover td {
    background: #151b10 !important;
    color: #f4f7ed !important;
}

.sh-tbl tbody tr:hover td:first-child {
    background: #171d11 !important;
    color: #ffffff !important;
}

.sh-tbl tbody tr:hover .mono {
    color: #d9e1d1 !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — ЦЕНИ
   ========================================================================== */

.sh-tbl tbody tr:last-child td {
    background: #11160c !important;
    border-bottom: 0 !important;
    border-top: 1px solid rgba(152, 219, 28, 0.14) !important;
}

.sh-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
    color: #ffffff !important;
}

.sh-tbl tbody tr:last-child td b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Цена при hover */
.sh-tbl tbody tr:last-child:hover td {
    background: #171d10 !important;
}

.sh-tbl tbody tr:last-child:hover td:first-child {
    background: #191f12 !important;
}

/* ==========================================================================
   ЛЕК ЗЕЛЕН АКЦЕНТ ВЪРХУ ЦЕНИТЕ
   ========================================================================== */

.sh-tbl tbody tr:last-child td:not(:first-child) b {
    color: #a9e83a !important;
    text-shadow: 0 0 15px rgba(152, 219, 28, 0.20) !important;
}

/* ==========================================================================
   DASH / ЛИПСВАЩИ СТОЙНОСТИ
   ========================================================================== */

.sh-tbl tbody td {
    text-rendering: optimizeLegibility !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.sh-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.sh-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.sh-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.sh-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================================== */

.sh-head h2 {
    color: #f5f7f1 !important;
}

.sh-head p {
    color: #8e9689 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .sh-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .sh-tbl table {
        min-width: 680px !important;
    }

    .sh-tbl thead th,
    .sh-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .sh-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .sh-tbl table {
        min-width: 650px !important;
    }

    .sh-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .sh-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .sh-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .sh-tbl .mono {
        font-size: 11.5px !important;
    }
}





/* ==========================================================================
   HOVER — FORCE / PRIORITY
   Постави този блок НАЙ-НАКРАЯ след останалия .sh-tbl CSS
   ========================================================================== */

.sh-tbl tbody tr {
    transition: all 0.22s ease !important;
}

/* Целият ред */
.sh-tbl tbody tr:hover > td {
    background: #1a2113 !important;
    color: #f7faF2 !important;
    border-bottom-color: rgba(152, 219, 28, 0.18) !important;
}

/* Първата колона */
.sh-tbl tbody tr:hover > td:first-child {
    background: #1d2515 !important;
    color: #ffffff !important;
}

/* Името на параметъра */
.sh-tbl tbody tr:hover > td:first-child b {
    color: #ffffff !important;
}

/* Всички стойности */
.sh-tbl tbody tr:hover > td.mono {
    color: #e4ebdf !important;
}

/* Цена при hover */
.sh-tbl tbody tr:last-child:hover > td {
    background: #1b2412 !important;
}

.sh-tbl tbody tr:last-child:hover > td:first-child {
    background: #202a15 !important;
}

.sh-tbl tbody tr:last-child:hover > td:not(:first-child) b {
    color: #c4f76b !important;
    text-shadow:
        0 0 8px rgba(152, 219, 28, 0.35),
        0 0 18px rgba(152, 219, 28, 0.18) !important;
}

/* Лек зелен акцент по левия ръб на активния ред */
.sh-tbl tbody tr:hover > td:first-child {
    box-shadow:
        inset 3px 0 0 #7cbf00 !important;
}

/* Малко по-силен hover за самата стойност */
.sh-tbl tbody tr:hover > td.mono {
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.045),
            rgba(152, 219, 28, 0.02)
        ) !important;
}

/* Първата клетка да запази собствения си фон */
.sh-tbl tbody tr:hover > td:first-child {
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.10),
            #1d2515 35%
        ) !important;
}

/* Плавност */
.sh-tbl tbody td {
    transition:
        background-color 0.22s ease,
        color 0.22s ease,
        box-shadow 0.22s ease !important;
}



/* ==========================================================================
   SH-TBL — ЧЕТИМ HOVER
   ========================================================================== */

.sh-tbl tbody tr {
    transition: all 0.2s ease !important;
}

.sh-tbl tbody tr:hover > td {
    background: #202719 !important;
    color: #f5f8f1 !important;
}

/* Първа колона */
.sh-tbl tbody tr:hover > td:first-child {
    background: #252d1b !important;
    color: #ffffff !important;
    box-shadow: inset 3px 0 0 #7cbf00 !important;
}

.sh-tbl tbody tr:hover > td:first-child b {
    color: #ffffff !important;
}

/* Всички стойности */
.sh-tbl tbody tr:hover > td.mono {
    background: #202719 !important;
    color: #e9eee5 !important;
}

/* По-ясни bold елементи */
.sh-tbl tbody tr:hover > td b {
    color: #ffffff !important;
}

/* Последният ред — цени */
.sh-tbl tbody tr:last-child:hover > td {
    background: #222c17 !important;
    color: #ffffff !important;
}

.sh-tbl tbody tr:last-child:hover > td:first-child {
    background: #29351b !important;
}

.sh-tbl tbody tr:last-child:hover > td:not(:first-child) b {
    color: #bdf45a !important;
    text-shadow: 0 0 10px rgba(152, 219, 28, 0.25) !important;
}

/* Границата на активния ред */
.sh-tbl tbody tr:hover > td {
    border-bottom-color: rgba(152, 219, 28, 0.16) !important;
}

/* Плавен преход */
.sh-tbl tbody td {
    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        box-shadow 0.2s ease !important;
}

/*таблица*/


/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — WORDPRESS СРАВНЕНИЕ НА ПАКЕТИТЕ
   Само за .wp-tbl
   ========================================================================== */

.wp-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    border-radius: 18px !important;
    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* Горен зелен акцент */
.wp-tbl::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.wp-tbl table {
    width: 100% !important;
    min-width: 720px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    color: #d5d9cf !important;
    background: transparent !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.wp-tbl thead th {
    position: relative !important;
    padding: 20px 18px !important;
    background: #13180d !important;
    color: #f5f7f2 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.wp-tbl thead th:first-child {
    width: 32% !important;
    border-top-left-radius: 15px !important;
}

.wp-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.wp-tbl tbody td {
    padding: 17px 18px !important;
    background: #0d1109 !important;
    color: #cbd1c4 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;

    transition:
        background-color 0.22s ease,
        color 0.22s ease !important;
}

/* Име на характеристиката */
.wp-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

.wp-tbl tbody td:first-child b {
    color: inherit !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.wp-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #b7beb0 !important;
    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ВАЖНО: всички текстове стават светли, за да се четат
   ========================================================================== */

.wp-tbl tbody tr {
    transition: none !important;
}

.wp-tbl tbody tr:hover td {
    background: #20291a !important;
    color: #ffffff !important;
}

.wp-tbl tbody tr:hover td:first-child {
    background: #26321d !important;
    color: #ffffff !important;
}

.wp-tbl tbody tr:hover td:first-child b {
    color: #ffffff !important;
}

.wp-tbl tbody tr:hover td.mono {
    color: #e9f5dc !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — ЦЕНИ
   ========================================================================== */

.wp-tbl tbody tr:last-child td {
    background: #11160c !important;
    border-bottom: 0 !important;
}

.wp-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
}

.wp-tbl tbody tr:last-child td b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Hover върху ценовия ред */
.wp-tbl tbody tr:last-child:hover td {
    background: #26321d !important;
    color: #ffffff !important;
}

.wp-tbl tbody tr:last-child:hover td:first-child {
    background: #2c391f !important;
}

.wp-tbl tbody tr:last-child:hover td b {
    color: #c4f76b !important;
}

/* ==========================================================================
   ПРАЗНИ СТОЙНОСТИ
   ========================================================================== */

.wp-tbl tbody td.mono {
    color: #aeb5a5 !important;
}

.wp-tbl tbody tr:hover td.mono {
    color: #e9f5dc !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.wp-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.wp-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.wp-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.wp-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {
    .wp-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .wp-tbl table {
        min-width: 680px !important;
    }

    .wp-tbl thead th,
    .wp-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .wp-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .wp-tbl table {
        min-width: 650px !important;
    }

    .wp-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .wp-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .wp-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .wp-tbl .mono {
        font-size: 11.5px !important;
    }
}
/*таблица biznes-hosting/*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СРАВНЕНИЕ НА ПАКЕТА
   Само за .bz-tbl
   ========================================================================== */

.bz-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    border-radius: 18px !important;
    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* Зелен светлинен акцент отгоре */
.bz-tbl::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.bz-tbl table {
    width: 100% !important;
    min-width: 620px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    color: #d5d9cf !important;
    background: transparent !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.bz-tbl thead th {
    position: relative !important;
    padding: 20px 18px !important;
    background: #13180d !important;
    color: #f5f7f2 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.bz-tbl thead th:first-child {
    width: 55% !important;
    border-top-left-radius: 15px !important;
}

.bz-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.bz-tbl tbody td {
    padding: 17px 18px !important;
    background: #0d1109 !important;
    color: #cbd1c4 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;

    transition:
        background-color 0.22s ease,
        color 0.22s ease !important;
}

/* Първа колона */
.bz-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

.bz-tbl tbody td:first-child b {
    color: inherit !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.bz-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #b7beb0 !important;
    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.bz-tbl tbody tr:hover td {
    background: #20291a !important;
    color: #ffffff !important;
}

.bz-tbl tbody tr:hover td:first-child {
    background: #26321d !important;
    color: #ffffff !important;
}

.bz-tbl tbody tr:hover td:first-child b {
    color: #ffffff !important;
}

.bz-tbl tbody tr:hover td.mono {
    color: #e9f5dc !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — ЦЕНА
   ========================================================================== */

.bz-tbl tbody tr:last-child td {
    background: #11160c !important;
    border-bottom: 0 !important;
}

.bz-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
}

.bz-tbl tbody tr:last-child td b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Hover на цената */
.bz-tbl tbody tr:last-child:hover td {
    background: #26321d !important;
    color: #ffffff !important;
}

.bz-tbl tbody tr:last-child:hover td:first-child {
    background: #2c391f !important;
}

.bz-tbl tbody tr:last-child:hover td b {
    color: #c4f76b !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.bz-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.bz-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.bz-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.bz-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {
    .bz-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .bz-tbl table {
        min-width: 580px !important;
    }

    .bz-tbl thead th,
    .bz-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .bz-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .bz-tbl table {
        min-width: 540px !important;
    }

    .bz-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .bz-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .bz-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .bz-tbl .mono {
        font-size: 11.5px !important;
    }
}

/*таблица vps/*/

```css
/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — V1 SSD СРАВНЕНИЕ
   Само за .vp-tbl
   ========================================================================== */

.vp-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;

    border-radius: 18px !important;

    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;

    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;

    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* ==========================================================================
   ЗЕЛЕН ГОРЕН АКЦЕНТ
   ========================================================================== */

.vp-tbl::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.vp-tbl table {
    width: 100% !important;
    min-width: 620px !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    background: #0d1109 !important;
    color: #d5d9cf !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.vp-tbl thead th {
    position: relative !important;

    padding: 20px 18px !important;

    background: #13180d !important;
    color: #f5f7f2 !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;

    font-size: 14px !important;
    font-weight: 750 !important;

    text-align: left !important;
    white-space: nowrap !important;
}

.vp-tbl thead th:first-child {
    width: 55% !important;
    border-top-left-radius: 15px !important;
}

.vp-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.vp-tbl tbody td {
    padding: 17px 18px !important;

    background: #0d1109 !important;
    color: #cbd1c4 !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;

    font-size: 13px !important;
    line-height: 1.4 !important;

    vertical-align: middle !important;

    transition:
        background-color 0.22s ease,
        color 0.22s ease !important;
}

/* ==========================================================================
   ПЪРВА КОЛОНА
   ========================================================================== */

.vp-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;

    font-size: 13.5px !important;
    font-weight: 650 !important;

    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

.vp-tbl tbody td:first-child b {
    color: #f0f2ec !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.vp-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #b7beb0 !important;

    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.vp-tbl tbody tr:hover td {
    background: #20291a !important;
    color: #ffffff !important;
}

.vp-tbl tbody tr:hover td:first-child {
    background: #26321d !important;
    color: #ffffff !important;
}

.vp-tbl tbody tr:hover td:first-child b {
    color: #ffffff !important;
}

.vp-tbl tbody tr:hover td.mono {
    background: #20291a !important;
    color: #ffffff !important;
}

/* ==========================================================================
   ЦЕНОВИ РЕД
   Последният ред е "На месец"
   ========================================================================== */

.vp-tbl tbody tr:last-child td {
    background: #11160c !important;
    color: #ffffff !important;

    border-bottom: 0 !important;
}

.vp-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
}

.vp-tbl tbody tr:last-child td b {
    color: #ffffff !important;

    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Hover върху ценовия ред */
.vp-tbl tbody tr:last-child:hover td {
    background: #26321d !important;
    color: #ffffff !important;
}

.vp-tbl tbody tr:last-child:hover td:first-child {
    background: #2c391f !important;
}

.vp-tbl tbody tr:last-child:hover td b {
    color: #c4f76b !important;

    text-shadow:
        0 0 15px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   ПРАЗНИ СТОЙНОСТИ
   ========================================================================== */

.vp-tbl tbody td.mono {
    color: #aeb5a5 !important;
}

.vp-tbl tbody tr:hover td.mono {
    color: #e9f5dc !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.vp-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.vp-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.vp-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.vp-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .vp-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .vp-tbl table {
        min-width: 580px !important;
    }

    .vp-tbl thead th,
    .vp-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .vp-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;

        -webkit-overflow-scrolling: touch !important;
    }

    .vp-tbl table {
        min-width: 540px !important;
    }

    .vp-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .vp-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .vp-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .vp-tbl .mono {
        font-size: 11.5px !important;
    }
}
```

/*таблица */

```css
/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — RS1 СРАВНЕНИЕ
   Само за .rs-tbl
   ========================================================================== */

.rs-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;

    border-radius: 18px !important;

    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;

    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;

    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* ==========================================================================
   ЗЕЛЕН ГОРЕН АКЦЕНТ
   ========================================================================== */

.rs-tbl::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.rs-tbl table {
    width: 100% !important;
    min-width: 620px !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    background: #0d1109 !important;
    color: #d5d9cf !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.rs-tbl thead th {
    position: relative !important;

    padding: 20px 18px !important;

    background: #13180d !important;
    color: #f5f7f2 !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;

    font-size: 14px !important;
    font-weight: 750 !important;

    text-align: left !important;
    white-space: nowrap !important;
}

.rs-tbl thead th:first-child {
    width: 55% !important;
    border-top-left-radius: 15px !important;
}

.rs-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.rs-tbl tbody td {
    padding: 17px 18px !important;

    background: #0d1109 !important;
    color: #cbd1c4 !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;

    font-size: 13px !important;
    line-height: 1.4 !important;

    vertical-align: middle !important;

    transition:
        background-color 0.22s ease,
        color 0.22s ease !important;
}

/* ==========================================================================
   ПЪРВА КОЛОНА
   ========================================================================== */

.rs-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;

    font-size: 13.5px !important;
    font-weight: 650 !important;

    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

.rs-tbl tbody td:first-child b {
    color: #f0f2ec !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.rs-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #aeb5a5 !important;

    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.rs-tbl tbody tr:hover td {
    background: #20291a !important;
    color: #ffffff !important;
}

.rs-tbl tbody tr:hover td:first-child {
    background: #26321d !important;
    color: #ffffff !important;
}

.rs-tbl tbody tr:hover td:first-child b {
    color: #ffffff !important;
}

.rs-tbl tbody tr:hover td.mono {
    background: #20291a !important;
    color: #e9f5dc !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — ЦЕНА
   ========================================================================== */

.rs-tbl tbody tr:last-child td {
    background: #11160c !important;
    color: #ffffff !important;

    border-bottom: 0 !important;
}

.rs-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
}

.rs-tbl tbody tr:last-child td b {
    color: #ffffff !important;

    font-size: 14px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   HOVER НА ЦЕНАТА
   ========================================================================== */

.rs-tbl tbody tr:last-child:hover td {
    background: #26321d !important;
    color: #ffffff !important;
}

.rs-tbl tbody tr:last-child:hover td:first-child {
    background: #2c391f !important;
}

.rs-tbl tbody tr:last-child:hover td b {
    color: #c4f76b !important;

    text-shadow:
        0 0 15px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.rs-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.rs-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.rs-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.rs-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .rs-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .rs-tbl table {
        min-width: 580px !important;
    }

    .rs-tbl thead th,
    .rs-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .rs-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;

        -webkit-overflow-scrolling: touch !important;
    }

    .rs-tbl table {
        min-width: 540px !important;
    }

    .rs-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .rs-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .rs-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .rs-tbl .mono {
        font-size: 11.5px !important;
    }
}
```

/*za-nas/*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "ЕДНА ВЕЧЕР, В КОЯТО СГРЕШИХМЕ"
   Само за .zn-oops
   ========================================================================== */

.zn-oops {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 18px !important;
    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(152, 219, 28, 0.055),
            transparent 32%
        ),
        #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
}

/* Горен електриково-зелен акцент */
.zn-oops::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 30%,
        #c4f76b 50%,
        #7cbf00 70%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   HEADER НА КАРТАТА
   ========================================================================== */

.zn-oops-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 20px 24px !important;
    background: #13180d !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
}

.zn-oops-h b {
    color: #c4f76b !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    letter-spacing: 0.01em !important;
}

.zn-oops-h span {
    color: #858d80 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   ОСНОВНО СЪДЪРЖАНИЕ
   ========================================================================== */

.zn-oops-b {
    padding: 30px 32px 32px !important;
    background: #0d1109 !important;
}

.zn-oops-b > p {
    margin: 0 0 18px !important;
    max-width: 900px !important;
    color: #bfc6b8 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.zn-oops-b > p:last-of-type {
    margin-bottom: 0 !important;
}

/* Удебелените части */
.zn-oops-b p b {
    color: #f1f5ec !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   БЛОК "КАКВО СЕ ПРОМЕНИ"
   ========================================================================== */

.zn-oops-after {
    margin-top: 30px !important;
    padding: 23px 24px 22px !important;
    position: relative !important;
    background:
        linear-gradient(
            135deg,
            rgba(152, 219, 28, 0.075),
            rgba(152, 219, 28, 0.025)
        ) !important;
    border: 1px solid rgba(152, 219, 28, 0.14) !important;
    border-radius: 14px !important;
    box-shadow:
        inset 3px 0 0 #7cbf00,
        0 8px 25px rgba(0, 0, 0, 0.18) !important;
}

.zn-oops-after > b {
    display: block !important;
    margin-bottom: 17px !important;
    color: #f2f6ed !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

.zn-oops-l {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.zn-oops-l li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 11px !important;
    min-width: 0 !important;
    color: #aeb6a7 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

.zn-oops-l li i {
    flex: 0 0 7px !important;
    width: 7px !important;
    height: 7px !important;
    margin-top: 7px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow:
        0 0 0 3px rgba(152, 219, 28, 0.08),
        0 0 12px rgba(152, 219, 28, 0.35) !important;
}

.zn-oops-l li span {
    color: #adb5a5 !important;
}

.zn-oops-l li span b {
    color: #e8f2df !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-oops-l li {
    transition:
        color 0.2s ease,
        transform 0.2s ease !important;
}

.zn-oops-l li:hover {
    transform: translateX(3px) !important;
}

.zn-oops-l li:hover span {
    color: #dce5d6 !important;
}

.zn-oops-l li:hover i {
    background: #c4f76b !important;
    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.09),
        0 0 16px rgba(152, 219, 28, 0.5) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .zn-oops {
        margin-top: 26px !important;
        border-radius: 16px !important;
    }

    .zn-oops-h {
        padding: 18px 20px !important;
    }

    .zn-oops-b {
        padding: 25px 24px 27px !important;
    }

    .zn-oops-b > p {
        font-size: 14px !important;
        line-height: 1.7 !important;
    }

    .zn-oops-after {
        padding: 21px !important;
    }

    .zn-oops-l {
        gap: 13px 20px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-oops {
        margin-top: 22px !important;
        border-radius: 14px !important;
    }

    .zn-oops-h {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 6px !important;
        padding: 17px 17px !important;
    }

    .zn-oops-h b {
        font-size: 12px !important;
    }

    .zn-oops-h span {
        font-size: 11px !important;
    }

    .zn-oops-b {
        padding: 22px 17px 19px !important;
    }

    .zn-oops-b > p {
        margin-bottom: 16px !important;
        font-size: 13px !important;
        line-height: 1.7 !important;
    }

    .zn-oops-after {
        margin-top: 24px !important;
        padding: 19px 17px 18px !important;
        border-radius: 12px !important;
    }

    .zn-oops-after > b {
        margin-bottom: 15px !important;
        font-size: 13px !important;
    }

    .zn-oops-l {
        grid-template-columns: 1fr !important;
        gap: 13px !important;
    }

    .zn-oops-l li {
        font-size: 12.5px !important;
        line-height: 1.55 !important;
    }
}


/*за нас*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — ЕКИП
   Само за .zn-crew
   ========================================================================== */

.zn-crew {
    width: 100% !important;
    margin-top: 32px !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

.zn-crew {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

.zn-crew-i {
    position: relative !important;
    min-width: 0 !important;
    padding: 26px 22px 23px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    background: #ffffff !important;
    border: 1px solid #e4e8df !important;
    border-radius: 16px !important;

    box-shadow:
        0 8px 25px rgba(20, 28, 15, 0.055),
        0 1px 2px rgba(20, 28, 15, 0.04) !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Зелен акцент отгоре */
.zn-crew-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 22px !important;
    right: 22px !important;
    height: 2px !important;
    border-radius: 0 0 4px 4px !important;
    background: #7cbf00 !important;
    opacity: 0.75 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-crew-i:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(152, 219, 28, 0.42) !important;
    box-shadow:
        0 16px 35px rgba(20, 28, 15, 0.09),
        0 0 0 3px rgba(152, 219, 28, 0.055) !important;
}

.zn-crew-i:hover::before {
    opacity: 1 !important;
    box-shadow: 0 0 10px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   АВАТАР
   ========================================================================== */

.zn-crew-av {
    width: 48px !important;
    height: 48px !important;
    margin-bottom: 17px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background:
        linear-gradient(
            135deg,
            #dff7a7 0%,
            #b9ea61 100%
        ) !important;

    color: #24310f !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    letter-spacing: 0.02em !important;

    border: 1px solid rgba(152, 219, 28, 0.3) !important;

    box-shadow:
        0 5px 15px rgba(152, 219, 28, 0.13) !important;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease !important;
}

.zn-crew-i:hover .zn-crew-av {
    transform: scale(1.05) !important;
    box-shadow:
        0 7px 20px rgba(152, 219, 28, 0.22) !important;
}

/* ==========================================================================
   ИМЕ
   ========================================================================== */

.zn-crew-i > b {
    display: block !important;
    margin-bottom: 7px !important;

    color: #171c14 !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ДЛЪЖНОСТ
   ========================================================================== */

.zn-crew-role {
    display: block !important;

    color: #626b5d !important;
    font-size: 12.5px !important;
    line-height: 1.6 !important;
}

/* ==========================================================================
   ОТ КОГА
   ========================================================================== */

.zn-crew-since {
    display: inline-flex !important;
    align-items: center !important;

    margin-top: 18px !important;
    padding: 5px 9px !important;

    border-radius: 999px !important;

    background: #f2f6ec !important;
    border: 1px solid #e2eacc !important;

    color: #617329 !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   БЕЛЕЖКА ПОД ЕКИПА
   ========================================================================== */

.zn-crew-note {
    grid-column: 1 / -1 !important;

    margin: 6px 0 0 !important;
    padding: 18px 22px !important;

    color: #667064 !important;
    background: #f7f9f4 !important;

    border: 1px solid #e4e8df !important;
    border-radius: 13px !important;

    font-size: 12.5px !important;
    line-height: 1.65 !important;
}

.zn-crew-note b {
    color: #283021 !important;
    font-weight: 750 !important;
}

/* Малка зелена линия в бележката */
.zn-crew-note::before {
    content: "" !important;
    display: inline-block !important;
    width: 6px !important;
    height: 6px !important;
    margin-right: 9px !important;
    vertical-align: 1px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 8px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1000px) {

    .zn-crew {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
    }

    .zn-crew-i {
        padding: 23px 20px 21px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-crew {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        margin-top: 22px !important;
    }

    .zn-crew-i {
        padding: 21px 18px 19px !important;
        border-radius: 14px !important;
    }

    .zn-crew-i::before {
        left: 18px !important;
        right: 18px !important;
    }

    .zn-crew-av {
        width: 44px !important;
        height: 44px !important;
        margin-bottom: 14px !important;
        border-radius: 11px !important;
        font-size: 12px !important;
    }

    .zn-crew-i > b {
        font-size: 14px !important;
    }

    .zn-crew-role {
        font-size: 12px !important;
    }

    .zn-crew-since {
        margin-top: 15px !important;
    }

    .zn-crew-note {
        margin-top: 3px !important;
        padding: 16px 17px !important;
        font-size: 12px !important;
    }
}
/*за нас*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — DATA CENTER
   Само за .zn-dc
   ========================================================================== */

.zn-dc {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr) !important;
    gap: 24px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   ЛЯВА ЧАСТ
   ========================================================================== */

.zn-dc > div:first-child {
    position: relative !important;
    padding: 32px !important;
    background: #ffffff !important;
    border: 1px solid #e4e8df !important;
    border-radius: 18px !important;
    box-shadow:
        0 10px 30px rgba(20, 28, 15, 0.055),
        0 1px 2px rgba(20, 28, 15, 0.04) !important;
}

/* Зелената линия отгоре */
.zn-dc > div:first-child::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 28px !important;
    right: 28px !important;
    height: 2px !important;
    border-radius: 0 0 5px 5px !important;
    background: #7cbf00 !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

.zn-dc > div:first-child h2 {
    margin: 0 0 10px !important;
    color: #171c14 !important;
    font-size: 22px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
}

.zn-dc > div:first-child > p {
    margin: 0 !important;
    max-width: 720px !important;
    color: #626b5d !important;
    font-size: 13.5px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

.zn-dc-l {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 24px !important;
    margin-top: 27px !important;
}

.zn-dc-r {
    display: flex !important;
    align-items: flex-start !important;
    gap: 11px !important;
    min-width: 0 !important;
    padding: 13px 0 !important;
    border-top: 1px solid #edf0ea !important;
}

.zn-dc-r i {
    flex: 0 0 7px !important;
    width: 7px !important;
    height: 7px !important;
    margin-top: 7px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.09),
        0 0 10px rgba(152, 219, 28, 0.22) !important;
}

.zn-dc-r span {
    color: #626b5d !important;
    font-size: 12.5px !important;
    line-height: 1.6 !important;
}

.zn-dc-r b {
    color: #252c20 !important;
    font-weight: 750 !important;
}

/* Hover на ред */
.zn-dc-r {
    transition:
        transform 0.2s ease,
        border-color 0.2s ease !important;
}

.zn-dc-r:hover {
    transform: translateX(3px) !important;
    border-color: rgba(152, 219, 28, 0.4) !important;
}

.zn-dc-r:hover i {
    background: #7fbe0d !important;
    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.11),
        0 0 13px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   PING КАРТА
   ========================================================================== */

.zn-ping {
    position: relative !important;
    padding: 27px 26px 24px !important;
    background: #f8faf6 !important;
    border: 1px solid #dfe5d9 !important;
    border-radius: 18px !important;
    box-shadow:
        0 10px 30px rgba(20, 28, 15, 0.055),
        0 1px 2px rgba(20, 28, 15, 0.035) !important;
    overflow: hidden !important;
}

/* Зелен акцент */
.zn-ping::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;
    height: 2px !important;
    border-radius: 0 0 5px 5px !important;
    background: #7cbf00 !important;
}

/* Лек glow */
.zn-ping::after {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    top: -100px !important;
    right: -70px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.08) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   PING HEADER
   ========================================================================== */

.zn-ping-h {
    margin-bottom: 23px !important;
    color: #20271b !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   PING РЕДОВЕ
   ========================================================================== */

.zn-ping-r {
    display: grid !important;
    grid-template-columns: 82px minmax(0, 1fr) 43px !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 14px !important;
}

.zn-ping-city {
    color: #4e5749 !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
}

.zn-ping-bar {
    position: relative !important;
    display: block !important;
    height: 7px !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    background: #e4e9df !important;
}

.zn-ping-fill {
    display: block !important;
    height: 100% !important;
    border-radius: inherit !important;
    background:
        linear-gradient(
            90deg,
            #79b80d,
            #7cbf00
        ) !important;
    box-shadow: 0 0 8px rgba(152, 219, 28, 0.25) !important;
}

.zn-ping-fill.far {
    background: #aeb6a5 !important;
    box-shadow: none !important;
}

.zn-ping-ms {
    color: #27301f !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    text-align: right !important;
}

/* ==========================================================================
   HOVER НА PING РЕД
   ========================================================================== */

.zn-ping-r {
    transition:
        transform 0.2s ease,
        opacity 0.2s ease !important;
}

.zn-ping-r:hover {
    transform: translateX(3px) !important;
}

.zn-ping-r:hover .zn-ping-city,
.zn-ping-r:hover .zn-ping-ms {
    color: #1c2417 !important;
}

.zn-ping-r:hover .zn-ping-fill:not(.far) {
    background: #7fbe0d !important;
}

/* ==========================================================================
   ОБЯСНЕНИЕ
   ========================================================================== */

.zn-ping-note {
    margin: 20px 0 0 !important;
    padding: 14px 15px !important;

    color: #747d70 !important;
    background: #ffffff !important;

    border: 1px solid #e5e9e1 !important;
    border-radius: 11px !important;

    font-size: 11px !important;
    line-height: 1.6 !important;
}

.zn-ping-note::before {
    content: "" !important;
    display: inline-block !important;
    width: 5px !important;
    height: 5px !important;
    margin-right: 7px !important;
    vertical-align: 1px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 950px) {

    .zn-dc {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .zn-dc > div:first-child {
        padding: 28px 26px !important;
    }

    .zn-ping {
        padding: 25px 24px 22px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-dc {
        gap: 12px !important;
    }

    .zn-dc > div:first-child {
        padding: 24px 18px !important;
        border-radius: 14px !important;
    }

    .zn-dc > div:first-child::before {
        left: 18px !important;
        right: 18px !important;
    }

    .zn-dc > div:first-child h2 {
        font-size: 19px !important;
    }

    .zn-dc > div:first-child > p {
        font-size: 12.5px !important;
        line-height: 1.65 !important;
    }

    .zn-dc-l {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
        margin-top: 21px !important;
    }

    .zn-dc-r {
        padding: 12px 0 !important;
    }

    .zn-dc-r span {
        font-size: 12px !important;
    }

    .zn-ping {
        padding: 22px 17px 18px !important;
        border-radius: 14px !important;
    }

    .zn-ping::before {
        left: 18px !important;
        right: 18px !important;
    }

    .zn-ping-h {
        margin-bottom: 20px !important;
    }

    .zn-ping-r {
        grid-template-columns: 70px minmax(0, 1fr) 39px !important;
        gap: 9px !important;
        margin-bottom: 13px !important;
    }

    .zn-ping-city,
    .zn-ping-ms {
        font-size: 10.5px !important;
    }

    .zn-ping-bar {
        height: 6px !important;
    }

    .zn-ping-note {
        margin-top: 17px !important;
        padding: 12px 13px !important;
        font-size: 10.5px !important;
    }
}

/*за нас */


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — КАК ПЕЧЕЛИМ ПАРИ
   Само за .zn-money
   ========================================================================== */

.zn-money {
    width: 100% !important;
    margin-top: 32px !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

.zn-money {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
}

.zn-money-i {
    position: relative !important;
    padding: 26px 24px !important;
    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 18px !important;
    box-shadow:
        0 10px 30px rgba(18, 25, 12, 0.07),
        0 1px 2px rgba(18, 25, 12, 0.04) !important;
    overflow: hidden !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease !important;
}

/* Зелената линия отгоре */
.zn-money-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;
    height: 3px !important;
    border-radius: 0 0 5px 5px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 14px rgba(152, 219, 28, 0.25) !important;
}

/* Hover */
.zn-money-i:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(152, 219, 28, 0.55) !important;
    box-shadow:
        0 18px 42px rgba(18, 25, 12, 0.11),
        0 0 0 1px rgba(152, 219, 28, 0.08) !important;
}

/* ==========================================================================
   HEADER НА КАРТАТА
   ========================================================================== */

.zn-money-h {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 15px !important;
}

.zn-money-h b {
    color: #171b15 !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

.zn-money-ic {
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 11px !important;

    background: rgba(152, 219, 28, 0.13) !important;
    color: #5f8f08 !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;
}

.zn-money-ic svg {
    width: 19px !important;
    height: 19px !important;
    display: block !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

.zn-money-i p {
    margin: 0 !important;
    color: #687064 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   КАРТИ "НЕ"
   ========================================================================== */

.zn-money-i.no {
    background: #f8faf7 !important;
    border-color: #e0e5dc !important;
}

.zn-money-i.no::before {
    background: #7cbf00 !important;
}

.zn-money-i.no .zn-money-ic {
    background: #eef5e8 !important;
    color: #668d18 !important;
    border-color: #dce8d2 !important;
}

.zn-money-i.no:hover {
    background: #ffffff !important;
}

/* ==========================================================================
   ДОЛЕН ТЕКСТ
   ========================================================================== */

.zn-money-end {
    grid-column: 1 / -1 !important;

    margin-top: 2px !important;
    padding: 22px 26px !important;

    background: #f3f6f0 !important;
    border: 1px solid #dfe6d9 !important;
    border-left: 4px solid #7cbf00 !important;
    border-radius: 15px !important;

    color: #5f685b !important;
    font-size: 14px !important;
    line-height: 1.7 !important;

    box-shadow:
        0 8px 24px rgba(18, 25, 12, 0.045) !important;
}

.zn-money-end b {
    color: #1c2319 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .zn-money {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 15px !important;
    }

    .zn-money-i {
        padding: 23px 21px !important;
    }

    .zn-money-end {
        grid-column: 1 / -1 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-money {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin-top: 24px !important;
    }

    .zn-money-i {
        padding: 22px 20px !important;
        border-radius: 15px !important;
    }

    .zn-money-i::before {
        left: 20px !important;
        right: 20px !important;
    }

    .zn-money-h {
        gap: 10px !important;
        margin-bottom: 12px !important;
    }

    .zn-money-h b {
        font-size: 15px !important;
    }

    .zn-money-i p {
        font-size: 13.5px !important;
        line-height: 1.6 !important;
    }

    .zn-money-ic {
        width: 35px !important;
        height: 35px !important;
        flex-basis: 35px !important;
        border-radius: 10px !important;
    }

    .zn-money-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    .zn-money-end {
        padding: 19px 18px !important;
        font-size: 13.5px !important;
        line-height: 1.65 !important;
        border-radius: 13px !important;
    }
}


/**/


 /* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — ЗА КОГО НЕ СМЕ
   Само за .zn-notfor
   ========================================================================== */

.zn-notfor {
    width: 100% !important;
    margin-top: 32px !important;
    padding: 28px !important;

    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 20px !important;

    box-shadow:
        0 12px 35px rgba(18, 25, 12, 0.07),
        0 1px 2px rgba(18, 25, 12, 0.04) !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.zn-notfor-h {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;

    padding-bottom: 22px !important;
    margin-bottom: 22px !important;

    border-bottom: 1px solid #e7ebe4 !important;
}

.zn-notfor-h b {
    color: #171b15 !important;
    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

.zn-notfor-ic {
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    color: #638e13 !important;
    background: rgba(152, 219, 28, 0.13) !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
}

.zn-notfor-ic svg {
    width: 20px !important;
    height: 20px !important;
    display: block !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

.zn-notfor-l {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

/* ==========================================================================
   ITEM
   ========================================================================== */

.zn-notfor-i {
    position: relative !important;

    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;

    padding: 21px 20px !important;

    background: #f7f9f5 !important;
    border: 1px solid #e3e8df !important;
    border-radius: 15px !important;

    transition:
        transform 0.25s ease,
        background-color 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Малък зелен индикатор */
.zn-notfor-i > i {
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    flex: 0 0 7px !important;

    margin-top: 7px !important;

    border-radius: 50% !important;
    background: #7cbf00 !important;

    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.12),
        0 0 12px rgba(152, 219, 28, 0.22) !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

.zn-notfor-i > span {
    min-width: 0 !important;
    display: block !important;
}

.zn-notfor-i > span > b {
    display: block !important;

    margin: 0 0 7px !important;

    color: #1a2017 !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
}

.zn-notfor-i p {
    margin: 0 !important;

    color: #697166 !important;
    font-size: 13.5px !important;
    line-height: 1.62 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-notfor-i:hover {
    transform: translateY(-3px) !important;

    background: #ffffff !important;
    border-color: rgba(152, 219, 28, 0.48) !important;

    box-shadow:
        0 12px 28px rgba(18, 25, 12, 0.08),
        0 0 0 1px rgba(152, 219, 28, 0.06) !important;
}

.zn-notfor-i:hover > i {
    background: #7cbf00 !important;

    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.14),
        0 0 16px rgba(152, 219, 28, 0.35) !important;
}

.zn-notfor-i:hover > span > b {
    color: #11150e !important;
}

.zn-notfor-i:hover p {
    color: #596253 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .zn-notfor {
        padding: 23px !important;
        border-radius: 17px !important;
    }

    .zn-notfor-l {
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;
    }

    .zn-notfor-i {
        padding: 19px 17px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-notfor {
        margin-top: 24px !important;
        padding: 18px !important;
        border-radius: 15px !important;
    }

    .zn-notfor-h {
        gap: 10px !important;
        padding-bottom: 18px !important;
        margin-bottom: 18px !important;
    }

    .zn-notfor-h b {
        font-size: 15px !important;
    }

    .zn-notfor-ic {
        width: 36px !important;
        height: 36px !important;
        flex-basis: 36px !important;
        border-radius: 10px !important;
    }

    .zn-notfor-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .zn-notfor-l {
        grid-template-columns: 1fr !important;
        gap: 11px !important;
    }

    .zn-notfor-i {
        gap: 12px !important;
        padding: 18px 16px !important;
        border-radius: 13px !important;
    }

    .zn-notfor-i > span > b {
        font-size: 14px !important;
        margin-bottom: 6px !important;
    }

    .zn-notfor-i p {
        font-size: 13px !important;
        line-height: 1.58 !important;
    }

    .zn-notfor-i > i {
        width: 6px !important;
        height: 6px !important;
        flex-basis: 6px !important;
        margin-top: 6px !important;
    }
}

/*за нас*/

 /* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — КАК СТИГНАХМЕ ДОТУК
   Само за .zn-road
   ========================================================================== */

.zn-road {
    width: 100% !important;
    margin-top: 34px !important;
    position: relative !important;
}

/* ==========================================================================
   TIMELINE
   ========================================================================== */

.zn-road-r {
    display: grid !important;
    grid-template-columns: 90px 34px minmax(0, 1fr) !important;
    column-gap: 18px !important;
    position: relative !important;
    min-height: 108px !important;
}

/* ==========================================================================
   ГОДИНА
   ========================================================================== */

.zn-road-y {
    display: block !important;
    padding-top: 4px !important;

    color: #66705f !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2px !important;
    text-align: right !important;
}

/* Днешната година */
.zn-road-r.now .zn-road-y {
    color: #6d9c0b !important;
}

/* ==========================================================================
   ЦЕНТРАЛНА ЛИНИЯ
   ========================================================================== */

.zn-road-d {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    width: 34px !important;
}

/* Вертикална линия */
.zn-road-d::before {
    content: "" !important;
    position: absolute !important;

    top: 12px !important;
    bottom: -12px !important;
    left: 50% !important;

    width: 1px !important;
    transform: translateX(-50%) !important;

    background: #dce3d7 !important;
}

/* Премахване на линията от последния елемент */
.zn-road-r:last-child .zn-road-d::before {
    display: none !important;
}

/* ==========================================================================
   ТОЧКА
   ========================================================================== */

.zn-road-d i {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    width: 12px !important;
    height: 12px !important;

    margin-top: 4px !important;

    border-radius: 50% !important;

    background: #ffffff !important;
    border: 3px solid #7cbf00 !important;

    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.12),
        0 0 12px rgba(152, 219, 28, 0.18) !important;
}

/* Активна точка за "днес" */
.zn-road-r.now .zn-road-d i {
    width: 14px !important;
    height: 14px !important;
    margin-top: 3px !important;

    background: #7cbf00 !important;
    border-color: #7cbf00 !important;

    box-shadow:
        0 0 0 5px rgba(152, 219, 28, 0.14),
        0 0 18px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   СЪДЪРЖАНИЕ
   ========================================================================== */

.zn-road-t {
    display: block !important;

    margin-bottom: 22px !important;
    padding: 20px 22px !important;

    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 15px !important;

    box-shadow:
        0 8px 25px rgba(18, 25, 12, 0.055),
        0 1px 2px rgba(18, 25, 12, 0.03) !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Заглавие */
.zn-road-t > b {
    display: block !important;

    margin-bottom: 7px !important;

    color: #171c15 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* Описание */
.zn-road-t > span {
    display: block !important;

    color: #697267 !important;
    font-size: 13.5px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-road-r:hover .zn-road-t {
    transform: translateX(4px) !important;

    border-color: rgba(152, 219, 28, 0.5) !important;

    box-shadow:
        0 12px 30px rgba(18, 25, 12, 0.08),
        0 0 0 1px rgba(152, 219, 28, 0.05) !important;
}

.zn-road-r:hover .zn-road-d i {
    background: #7cbf00 !important;

    box-shadow:
        0 0 0 5px rgba(152, 219, 28, 0.14),
        0 0 18px rgba(152, 219, 28, 0.3) !important;
}

.zn-road-r:hover .zn-road-y {
    color: #628c0a !important;
}

/* ==========================================================================
   ДНЕШЕН ЕЛЕМЕНТ
   ========================================================================== */

.zn-road-r.now .zn-road-t {
    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbfdf9 100%
        ) !important;

    border-color: rgba(152, 219, 28, 0.4) !important;

    box-shadow:
        0 10px 30px rgba(18, 25, 12, 0.07),
        0 0 0 1px rgba(152, 219, 28, 0.06) !important;
}

.zn-road-r.now .zn-road-t > b {
    color: #253018 !important;
}

/* Малък зелен акцент в днешната карта */
.zn-road-r.now .zn-road-t::before {
    content: "" !important;
    display: block !important;

    width: 34px !important;
    height: 3px !important;

    margin-bottom: 14px !important;

    border-radius: 4px !important;
    background: #7cbf00 !important;

    box-shadow: 0 0 10px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .zn-road {
        margin-top: 28px !important;
    }

    .zn-road-r {
        grid-template-columns: 72px 30px minmax(0, 1fr) !important;
        column-gap: 14px !important;
        min-height: 105px !important;
    }

    .zn-road-d {
        width: 30px !important;
    }

    .zn-road-t {
        padding: 18px 19px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-road {
        margin-top: 24px !important;
    }

    .zn-road-r {
        grid-template-columns: 52px 25px minmax(0, 1fr) !important;
        column-gap: 10px !important;
        min-height: 0 !important;
    }

    .zn-road-y {
        padding-top: 3px !important;
        font-size: 11px !important;
    }

    .zn-road-d {
        width: 25px !important;
    }

    .zn-road-d i {
        width: 10px !important;
        height: 10px !important;
        margin-top: 4px !important;
        border-width: 2px !important;
    }

    .zn-road-r.now .zn-road-d i {
        width: 12px !important;
        height: 12px !important;
    }

    .zn-road-t {
        margin-bottom: 14px !important;
        padding: 17px 16px !important;
        border-radius: 13px !important;
    }

    .zn-road-t > b {
        font-size: 14px !important;
        line-height: 1.4 !important;
        margin-bottom: 6px !important;
    }

    .zn-road-t > span {
        font-size: 12.5px !important;
        line-height: 1.6 !important;
    }

    .zn-road-r:hover .zn-road-t {
        transform: none !important;
    }

    .zn-road-r.now .zn-road-t::before {
        width: 28px !important;
        height: 2px !important;
        margin-bottom: 12px !important;
    }
}

/*за нас*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — ФИРМАТА, ОФИЦИАЛНО
   Само за .zn-firm
   ========================================================================== */

.zn-firm {
    width: 100% !important;
    position: relative !important;
    padding: 30px 32px !important;
    border-radius: 18px !important;

    background: #ffffff !important;
    border: 1px solid #e5e9e1 !important;

    box-shadow:
        0 14px 40px rgba(25, 35, 20, 0.08),
        0 2px 8px rgba(25, 35, 20, 0.04) !important;

    box-sizing: border-box !important;
}

/* Зелен акцент отгоре */
.zn-firm::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 3px !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    border-radius: 18px 18px 0 0 !important;

    background: linear-gradient(
        90deg,
        transparent 0%,
        #7fbe16 30%,
        #7cbf00 50%,
        #7fbe16 70%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.zn-firm-h {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;

    padding-bottom: 22px !important;
    margin-bottom: 4px !important;

    color: #20261c !important;
    border-bottom: 1px solid #edf0eb !important;
}

.zn-firm-h b {
    color: #20261c !important;
    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
}

/* Иконка */
.zn-firm-ic {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    color: #6d9f13 !important;
    background: #f1f8e6 !important;
    border: 1px solid #dcebc3 !important;
}

.zn-firm-ic svg {
    width: 20px !important;
    height: 20px !important;
    display: block !important;
}

/* ==========================================================================
   INFORMATION GRID
   ========================================================================== */

.zn-firm-g {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 42px !important;
}

/* ==========================================================================
   ROW
   ========================================================================== */

.zn-firm-r {
    min-height: 64px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;

    padding: 16px 16px !important;

    border-bottom: 1px solid #edf0eb !important;

    transition:
        background-color 0.2s ease,
        padding-left 0.2s ease,
        padding-right 0.2s ease !important;
}

.zn-firm-r span {
    color: #7b8376 !important;
    font-size: 13px !important;
    font-weight: 550 !important;
    white-space: nowrap !important;
}

.zn-firm-r b {
    color: #252b22 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-align: right !important;
    line-height: 1.4 !important;
}

/* ==========================================================================
   MONO
   ========================================================================== */

.zn-firm-r .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #536047 !important;
    font-size: 13px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-firm-r:hover {
    background: #f7faF3 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    border-radius: 8px !important;
}

.zn-firm-r:hover span {
    color: #68715f !important;
}

.zn-firm-r:hover b {
    color: #5f8e0e !important;
}

.zn-firm-r:hover .mono {
    color: #5f8e0e !important;
}

/* ==========================================================================
   ПОСЛЕДНИТЕ РЕДОВЕ
   ========================================================================== */

.zn-firm-r:nth-last-child(-n+2) {
    border-bottom: 0 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {
    .zn-firm {
        padding: 26px 24px !important;
        border-radius: 16px !important;
    }

    .zn-firm-g {
        column-gap: 28px !important;
    }

    .zn-firm-r {
        gap: 14px !important;
    }

    .zn-firm-r b {
        font-size: 13.5px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {
    .zn-firm {
        padding: 22px 18px !important;
        border-radius: 14px !important;
    }

    .zn-firm-h {
        padding-bottom: 18px !important;
    }

    .zn-firm-h b {
        font-size: 15px !important;
    }

    .zn-firm-ic {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        border-radius: 9px !important;
    }

    .zn-firm-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .zn-firm-g {
        grid-template-columns: 1fr !important;
    }

    .zn-firm-r {
        min-height: auto !important;
        padding: 14px 0 !important;
        align-items: flex-start !important;
    }

    .zn-firm-r span {
        font-size: 12px !important;
    }

    .zn-firm-r b {
        max-width: 60% !important;
        font-size: 13px !important;
    }

    .zn-firm-r .mono {
        font-size: 12px !important;
    }

    .zn-firm-r:nth-last-child(-n+2) {
        border-bottom: 1px solid #edf0eb !important;
    }

    .zn-firm-r:last-child {
        border-bottom: 0 !important;
    }

    .zn-firm-r:hover {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}


/*za-agencii/*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — СТЪПАЛА ЗА ОТСТЪПКА
   Само за #stapala
   ========================================================================== */

#stapala {
    position: relative !important;
}

/* ==========================================================================
   HEADER — само вътре в тази секция
   ========================================================================== */

#stapala .sh {
    margin-bottom: 32px !important;
}

#stapala .sh h2 {
    margin-bottom: 10px !important;
    color: #20261c !important;
}

#stapala .sh p {
    color: #737b6e !important;
}

/* ==========================================================================
   TIERS CONTAINER
   ========================================================================== */

#stapala .ptiers {
    width: 100% !important;

    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;

    align-items: stretch !important;
}

/* ==========================================================================
   TIER CARD
   ========================================================================== */

#stapala .ptier {
    position: relative !important;

    min-width: 0 !important;
    min-height: 220px !important;
    padding: 28px 26px 25px !important;

    display: flex !important;
    flex-direction: column !important;

    border-radius: 17px !important;
    border: 1px solid #e3e8df !important;

    background: #ffffff !important;

    box-shadow:
        0 12px 35px rgba(28, 38, 23, 0.06),
        0 2px 7px rgba(28, 38, 23, 0.035) !important;

    box-sizing: border-box !important;

    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease,
        border-color 0.22s ease,
        background-color 0.22s ease !important;
}

/* Малък зелен акцент в горната част */
#stapala .ptier::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;

    height: 3px !important;

    border-radius: 0 0 5px 5px !important;

    background: #dfe8d1 !important;

    transition:
        background 0.22s ease,
        box-shadow 0.22s ease !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

#stapala .ptier:hover {
    transform: translateY(-5px) !important;

    border-color: #cbdcab !important;

    box-shadow:
        0 18px 45px rgba(55, 75, 35, 0.10),
        0 4px 12px rgba(55, 75, 35, 0.05) !important;
}

#stapala .ptier:hover::before {
    background: #7cbf00 !important;
    box-shadow: 0 0 12px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   АКТИВНА / НАЙ-ЧЕСТО КАРТА
   ========================================================================== */

#stapala .ptier.is-on {
    border-color: rgba(126, 174, 32, 0.42) !important;

    background:
        linear-gradient(
            180deg,
            #fbfef7 0%,
            #ffffff 100%
        ) !important;

    box-shadow:
        0 16px 42px rgba(83, 112, 40, 0.11),
        0 0 0 1px rgba(152, 219, 28, 0.06) inset !important;
}

#stapala .ptier.is-on::before {
    background: linear-gradient(
        90deg,
        #7fbd14,
        #7cbf00,
        #7fbd14
    ) !important;

    box-shadow:
        0 0 14px rgba(152, 219, 28, 0.30) !important;
}

#stapala .ptier.is-on:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(126, 174, 32, 0.62) !important;

    box-shadow:
        0 22px 50px rgba(83, 112, 40, 0.14),
        0 0 0 1px rgba(152, 219, 28, 0.08) inset !important;
}

/* ==========================================================================
   TAG — НАЙ-ЧЕСТО
   ========================================================================== */

#stapala .ptier-tag {
    position: absolute !important;
    top: 17px !important;
    right: 18px !important;

    display: inline-flex !important;
    align-items: center !important;

    padding: 5px 9px !important;

    border-radius: 999px !important;

    background: #eef8df !important;
    border: 1px solid #dcebc2 !important;

    color: #67940f !important;

    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: 0.25px !important;
    text-transform: uppercase !important;
}

/* ==========================================================================
   TIER NAME
   ========================================================================== */

#stapala .ptier-n {
    margin-bottom: 17px !important;
    padding-right: 85px !important;

    color: #252b21 !important;

    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
margin-top: 20px;
}

/* ==========================================================================
   PRICE / DISCOUNT
   ========================================================================== */

#stapala .ptier-p {
    margin: 0 0 15px !important;

    color: #737c6d !important;

    font-size: 14px !important;
    line-height: 1.3 !important;
    font-weight: 550 !important;
}

#stapala .ptier-p b {
    color: #6d9f12 !important;

    font-size: 30px !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    letter-spacing: -0.8px !important;
}

/* Активната карта — малко по-силен зелен акцент */
#stapala .ptier.is-on .ptier-p b {
    color: #609000 !important;

    text-shadow:
        0 0 18px rgba(152, 219, 28, 0.15) !important;
}

/* ==========================================================================
   DESCRIPTION
   ========================================================================== */

#stapala .ptier p {
    margin: auto 0 0 !important;

    padding-top: 18px !important;

    color: #737b70 !important;

    font-size: 13px !important;
    line-height: 1.65 !important;
    font-weight: 450 !important;

    border-top: 1px solid #edf0eb !important;
}

#stapala .ptier:hover p {
    color: #626b5e !important;
}

/* ==========================================================================
   NOTE
   ========================================================================== */

#stapala .plan-note {
    margin: 20px 0 0 !important;

    color: #899185 !important;

    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    #stapala .ptiers {
        gap: 14px !important;
    }

    #stapala .ptier {
        min-height: 210px !important;
        padding: 25px 20px 22px !important;
    }

    #stapala .ptier-n {
        padding-right: 65px !important;
        font-size: 14px !important;
    }

    #stapala .ptier-p b {
        font-size: 27px !important;
    }

    #stapala .ptier p {
        font-size: 12.5px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 680px) {

    #stapala .sh {
        margin-bottom: 24px !important;
    }

    #stapala .ptiers {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    #stapala .ptier {
        min-height: auto !important;
        padding: 25px 22px 22px !important;
    }

    #stapala .ptier:hover,
    #stapala .ptier.is-on:hover {
        transform: translateY(-3px) !important;
    }

    #stapala .ptier-n {
        padding-right: 100px !important;
    }

    #stapala .ptier-p b {
        font-size: 29px !important;
    }

    #stapala .ptier p {
        margin-top: 4px !important;
    }
}

/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 420px) {

    #stapala .ptier {
        padding: 23px 18px 20px !important;
        border-radius: 15px !important;
    }

    #stapala .ptier::before {
        left: 18px !important;
        right: 18px !important;
    }

    #stapala .ptier-tag {
        top: 14px !important;
        right: 14px !important;
        font-size: 9px !important;
    }

    #stapala .ptier-n {
        padding-right: 80px !important;
        font-size: 13.5px !important;
    }

    #stapala .ptier-p b {
        font-size: 27px !important;
    }
}
/**/



/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — КОЙ ПЛАЩА
   Само за .ppays / .ppay
   ========================================================================== */

.ppays {
    width: 100% !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;

    align-items: stretch !important;
}

/* ==========================================================================
   PAYMENT CARD
   ========================================================================== */

.ppay {
    position: relative !important;

    min-width: 0 !important;
    padding: 30px 28px 27px !important;

    display: flex !important;
    flex-direction: column !important;

    box-sizing: border-box !important;

    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 18px !important;

    box-shadow:
        0 12px 35px rgba(28, 38, 23, 0.06),
        0 2px 8px rgba(28, 38, 23, 0.035) !important;

    transition:
        transform 0.22s ease,
        border-color 0.22s ease,
        box-shadow 0.22s ease,
        background-color 0.22s ease !important;

    overflow: hidden !important;
}

/* Зелената линия отгоре */
.ppay::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;

    height: 3px !important;

    border-radius: 0 0 5px 5px !important;

    background: #dfe8d1 !important;

    transition:
        background 0.22s ease,
        box-shadow 0.22s ease !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.ppay:hover {
    transform: translateY(-5px) !important;

    border-color: #cbdcab !important;

    box-shadow:
        0 19px 45px rgba(55, 75, 35, 0.10),
        0 4px 12px rgba(55, 75, 35, 0.05) !important;
}

.ppay:hover::before {
    background: linear-gradient(
        90deg,
        #7fbd14,
        #7cbf00,
        #7fbd14
    ) !important;

    box-shadow:
        0 0 13px rgba(152, 219, 28, 0.30) !important;
}

/* ==========================================================================
   ICON
   ========================================================================== */

.ppay .fi {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 20px !important;

    border-radius: 12px !important;

    background: #f1f8e6 !important;
    border: 1px solid #dcebc3 !important;

    color: #6d9f13 !important;

    transition:
        background-color 0.22s ease,
        border-color 0.22s ease,
        color 0.22s ease,
        transform 0.22s ease !important;
}

.ppay .fi svg {
    width: 22px !important;
    height: 22px !important;

    display: block !important;

    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.ppay:hover .fi {
    background: #eaf6d8 !important;
    border-color: #cfe5a9 !important;
    color: #5f900b !important;
    transform: translateY(-1px) !important;
}

/* ==========================================================================
   TITLE
   ========================================================================== */

.ppay h3 {
    margin: 0 0 12px !important;

    color: #252b21 !important;

    font-size: 18px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;

    transition: color 0.22s ease !important;
}

.ppay:hover h3 {
    color: #5f8e0e !important;
}

/* ==========================================================================
   DESCRIPTION
   ========================================================================== */

.ppay p {
    margin: 0 !important;

    color: #737b70 !important;

    font-size: 13.5px !important;
    line-height: 1.7 !important;
    font-weight: 450 !important;

    transition: color 0.22s ease !important;
}

.ppay:hover p {
    color: #626b5e !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    .ppays {
        gap: 14px !important;
    }

    .ppay {
        padding: 26px 22px 24px !important;
    }

    .ppay h3 {
        font-size: 16px !important;
    }

    .ppay p {
        font-size: 13px !important;
        line-height: 1.6 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .ppays {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .ppay {
        padding: 25px 21px 23px !important;
        border-radius: 15px !important;
    }

    .ppay::before {
        left: 20px !important;
        right: 20px !important;
    }

    .ppay:hover {
        transform: translateY(-3px) !important;
    }

    .ppay .fi {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        margin-bottom: 17px !important;
        border-radius: 10px !important;
    }

    .ppay .fi svg {
        width: 20px !important;
        height: 20px !important;
    }

    .ppay h3 {
        font-size: 16px !important;
        margin-bottom: 10px !important;
    }

    .ppay p {
        font-size: 12.5px !important;
        line-height: 1.65 !important;
    }
}
/**/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — ПАРТНЬОРСКИ ПАНЕЛ
   Само за .psplit
   ========================================================================== */

.psplit {
    position: relative !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) !important;
    gap: 55px !important;

    align-items: center !important;

    padding: 34px 0 !important;
}

/* ==========================================================================
   LEFT CONTENT
   ========================================================================== */

.psplit > div {
    min-width: 0 !important;
}

.psplit > div h2 {
    margin: 0 0 14px !important;

    color: #252b21 !important;

    font-size: 27px !important;
    line-height: 1.2 !important;
    font-weight: 780 !important;
    letter-spacing: -0.45px !important;
}

.psplit > div p {
    margin: 0 !important;

    max-width: 650px !important;

    color: #737b70 !important;

    font-size: 14px !important;
    line-height: 1.75 !important;
    font-weight: 450 !important;
}

/* ==========================================================================
   CHECKLIST
   ========================================================================== */

.psplit .ptick {
    position: relative !important;

    margin: 0 !important;
    padding: 8px 0 !important;

    list-style: none !important;

    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 17px !important;

    box-shadow:
        0 12px 35px rgba(28, 38, 23, 0.06),
        0 2px 8px rgba(28, 38, 23, 0.035) !important;

    overflow: hidden !important;
}

/* Зелената линия отгоре */
.psplit .ptick::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;

    height: 3px !important;

    border-radius: 0 0 5px 5px !important;

    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00 50%,
        transparent
    ) !important;
}

/* ==========================================================================
   CHECK ITEM
   ========================================================================== */

.psplit .ptick li {
    position: relative !important;

    display: flex !important;
    align-items: center !important;

    min-height: 54px !important;

    margin: 0 !important;
    padding: 13px 22px 13px 57px !important;

    box-sizing: border-box !important;

    color: #4f584b !important;

    font-size: 13.5px !important;
    line-height: 1.5 !important;
    font-weight: 550 !important;

    border-bottom: 1px solid #edf0eb !important;

    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        padding-left 0.2s ease !important;
}

/* Последният ред няма разделител */
.psplit .ptick li:last-child {
    border-bottom: 0 !important;
}

/* ==========================================================================
   GREEN CHECK
   ========================================================================== */

.psplit .ptick li::before {
    content: "✓" !important;

    position: absolute !important;
    left: 21px !important;
    top: 50% !important;

    width: 24px !important;
    height: 24px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    transform: translateY(-50%) !important;

    border-radius: 50% !important;

    background: #f0f8e5 !important;
    border: 1px solid #dcebc3 !important;

    color: #6d9f13 !important;

    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 850 !important;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.psplit .ptick li:hover {
    background: #f8faf5 !important;
    color: #252b21 !important;

    padding-left: 62px !important;
}

.psplit .ptick li:hover::before {
    background: #eaf6d8 !important;
    border-color: #cfe5a9 !important;
    color: #5f900b !important;

    transform:
        translateY(-50%)
        scale(1.08) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .psplit {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 32px !important;
    }

    .psplit > div h2 {
        font-size: 24px !important;
    }

    .psplit > div p {
        font-size: 13.5px !important;
    }

    .psplit .ptick li {
        padding-left: 53px !important;
        padding-right: 16px !important;
        font-size: 13px !important;
    }

    .psplit .ptick li:hover {
        padding-left: 57px !important;
    }

    .psplit .ptick li::before {
        left: 18px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 680px) {

    .psplit {
        grid-template-columns: 1fr !important;
        gap: 25px !important;

        padding: 20px 0 !important;
    }

    .psplit > div h2 {
        margin-bottom: 11px !important;
        font-size: 22px !important;
        line-height: 1.25 !important;
    }

    .psplit > div p {
        font-size: 13px !important;
        line-height: 1.7 !important;
    }

    .psplit .ptick {
        border-radius: 15px !important;
    }

    .psplit .ptick::before {
        left: 20px !important;
        right: 20px !important;
    }

    .psplit .ptick li {
        min-height: 52px !important;

        padding: 13px 17px 13px 52px !important;

        font-size: 12.5px !important;
    }

    .psplit .ptick li:hover {
        padding-left: 55px !important;
    }

    .psplit .ptick li::before {
        left: 18px !important;
        width: 23px !important;
        height: 23px !important;
    }
}
/**/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — КАКВО ВЛИЗА В ПРОГРАМАТА
   Само за .pfeat
   ========================================================================== */

.pfeat {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-top: 32px !important;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.pfeat-card {
    position: relative !important;
    min-width: 0 !important;
    padding: 28px 24px !important;

    background:
        linear-gradient(
            145deg,
            #141a0e 0%,
            #0d1109 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.14) !important;
    border-radius: 18px !important;

    box-shadow:
        0 16px 40px rgba(0, 0, 0, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.018) inset !important;

    overflow: hidden !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Фин зелен акцент отгоре */
.pfeat-card::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;
    height: 2px !important;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(152, 219, 28, 0.65),
        transparent
    ) !important;

    opacity: 0.75 !important;
}

/* ==========================================================================
   ICON
   ========================================================================== */

.pfeat-card .fi {
    width: 46px !important;
    height: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 20px !important;

    color: #7cbf00 !important;

    background:
        rgba(152, 219, 28, 0.09) !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 12px !important;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.18),
        inset 0 0 15px rgba(152, 219, 28, 0.035) !important;

    transition:
        color 0.25s ease,
        background 0.25s ease,
        border-color 0.25s ease,
        transform 0.25s ease !important;
}

.pfeat-card .fi svg {
    width: 23px !important;
    height: 23px !important;

    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

/* ==========================================================================
   TITLE
   ========================================================================== */

.pfeat-card h3 {
    margin: 0 0 10px 0 !important;

    color: #f4f7ef !important;

    font-size: 17px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;

    letter-spacing: -0.15px !important;
}

/* ==========================================================================
   DESCRIPTION
   ========================================================================== */

.pfeat-card p {
    margin: 0 !important;

    color: #aeb6a6 !important;

    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
}

/* ==========================================================================
   HOVER
   ВАЖНО: текстът остава светъл и четим
   ========================================================================== */

.pfeat-card:hover {
    transform: translateY(-4px) !important;

    background:
        linear-gradient(
            145deg,
            #1b2412 0%,
            #11170c 100%
        ) !important;

    border-color: rgba(152, 219, 28, 0.34) !important;

    box-shadow:
        0 22px 48px rgba(0, 0, 0, 0.38),
        0 0 25px rgba(152, 219, 28, 0.055),
        inset 0 0 0 1px rgba(152, 219, 28, 0.035) !important;
}

.pfeat-card:hover::before {
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;

    opacity: 1 !important;
}

.pfeat-card:hover .fi {
    color: #c4f76b !important;

    background:
        rgba(152, 219, 28, 0.14) !important;

    border-color: rgba(152, 219, 28, 0.34) !important;

    transform: translateY(-2px) !important;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.22),
        0 0 18px rgba(152, 219, 28, 0.08) !important;
}

/* Заглавието остава бяло */
.pfeat-card:hover h3 {
    color: #ffffff !important;
}

/* Описанието става още по-светло */
.pfeat-card:hover p {
    color: #e0e7d9 !important;
}

/* ==========================================================================
   SECTION HEAD
   Ако .sh вече има глобален стил, този блок НЕ го променя.
   ========================================================================== */

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1000px) {
    .pfeat {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .pfeat-card {
        padding: 24px 21px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .pfeat {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin-top: 24px !important;
    }

    .pfeat-card {
        padding: 23px 20px !important;
        border-radius: 15px !important;
    }

    .pfeat-card .fi {
        width: 42px !important;
        height: 42px !important;
        margin-bottom: 17px !important;
    }

    .pfeat-card .fi svg {
        width: 21px !important;
        height: 21px !important;
    }

    .pfeat-card h3 {
        font-size: 16px !important;
        margin-bottom: 8px !important;
    }

    .pfeat-card p {
        font-size: 13.5px !important;
        line-height: 1.6 !important;
    }
}
/**/


/* ==========================================================================
   PREMIUM LIGHT DESIGN — .pwho
   ========================================================================== */

.pwho {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
    margin: 32px 0 0 !important;
    padding: 0 !important;
}

/* ==========================================================================
   CARDS
   ========================================================================== */

.pwho > div {
    position: relative !important;
    display: block !important;

    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 30px 26px !important;

    background: #ffffff !important;
    border: 1px solid #e1e6dc !important;
    border-radius: 18px !important;

    box-shadow:
        0 12px 35px rgba(25, 35, 15, 0.07),
        0 2px 8px rgba(25, 35, 15, 0.04) !important;

    overflow: hidden !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease !important;
}

/* ==========================================================================
   GREEN TOP LINE
   ========================================================================== */

.pwho > div::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;

    height: 3px !important;

    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 50%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   CARD TITLE
   ========================================================================== */

.pwho > div > b {
    display: block !important;

    margin: 0 0 11px 0 !important;
    padding: 0 !important;

    color: #1d2518 !important;
    background: transparent !important;

    font-family: inherit !important;
    font-size: 17px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;

    text-align: left !important;
}

/* ==========================================================================
   CARD TEXT
   ========================================================================== */

.pwho > div > span {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #697365 !important;
    background: transparent !important;

    font-family: inherit !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;

    text-align: left !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.pwho > div:hover {
    transform: translateY(-5px) !important;

    background: #fbfef8 !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 20px 45px rgba(25, 35, 15, 0.12),
        0 0 0 1px rgba(152, 219, 28, 0.06) !important;
}

.pwho > div:hover > b {
    color: #17200f !important;
}

.pwho > div:hover > span {
    color: #4d5849 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {
    .pwho {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .pwho > div {
        padding: 26px 22px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .pwho {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin-top: 24px !important;
    }

    .pwho > div {
        padding: 24px 20px !important;
        border-radius: 15px !important;
    }

    .pwho > div > b {
        font-size: 16px !important;
    }

    .pwho > div > span {
        font-size: 13.5px !important;
        line-height: 1.6 !important;
    }
}

/**/

/* ==========================================================================
   PREMIUM DESIGN — ФОРМА "КАНДИДАТСТВАЙ"
   Само за #kandidatstvane .pform
   ========================================================================== */

#kandidatstvane .pform {
    position: relative !important;

    width: 100% !important;
    max-width: 920px !important;

    margin: 34px auto 0 !important;
    padding: 34px !important;

    box-sizing: border-box !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf8 100%
        ) !important;

    border: 1px solid #e1e7dc !important;
    border-radius: 22px !important;

    box-shadow:
        0 24px 65px rgba(25, 35, 15, 0.10),
        0 5px 18px rgba(25, 35, 15, 0.05) !important;

    overflow: hidden !important;
}

/* Зелената декоративна линия */

#kandidatstvane .pform::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;

    height: 4px !important;

    background: linear-gradient(
        90deg,
        #6fae0d 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        #6fae0d 100%
    ) !important;
}

/* ==========================================================================
   TWO COLUMN ROWS
   ========================================================================== */

#kandidatstvane .pform-2 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 18px !important;

    margin: 0 0 18px !important;
}

/* ==========================================================================
   LABEL
   ========================================================================== */

#kandidatstvane .pf {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 0 18px !important;
    padding: 0 !important;
}

#kandidatstvane .pf > span {
    display: block !important;

    margin: 0 0 8px !important;
    padding: 0 !important;

    color: #273020 !important;

    font-family: inherit !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;

    letter-spacing: 0.01em !important;
}

/* ==========================================================================
   INPUTS / SELECT / TEXTAREA
   ========================================================================== */

#kandidatstvane .pf input,
#kandidatstvane .pf select,
#kandidatstvane .pf textarea {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    box-sizing: border-box !important;

    margin: 0 !important;
    padding: 13px 15px !important;

    color: #20271a !important;
    background: #f7f9f5 !important;

    border: 1px solid #dce3d6 !important;
    border-radius: 11px !important;

    outline: none !important;

    font-family: inherit !important;
    font-size: 14px !important;
    line-height: 1.45 !important;

    box-shadow:
        inset 0 1px 2px rgba(20, 30, 10, 0.025) !important;

    transition:
        border-color 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease !important;
}

/* Placeholder */

#kandidatstvane .pf input::placeholder,
#kandidatstvane .pf textarea::placeholder {
    color: #9aa397 !important;
    opacity: 1 !important;
}

/* ==========================================================================
   FOCUS
   ========================================================================== */

#kandidatstvane .pf input:focus,
#kandidatstvane .pf select:focus,
#kandidatstvane .pf textarea:focus {
    color: #18200f !important;

    background: #ffffff !important;

    border-color: #7cbf00 !important;

    box-shadow:
        0 0 0 3px rgba(152, 219, 28, 0.13),
        0 5px 15px rgba(25, 35, 15, 0.05) !important;
}

/* Hover върху полето */

#kandidatstvane .pf input:hover,
#kandidatstvane .pf select:hover,
#kandidatstvane .pf textarea:hover {
    border-color: #bcc8b4 !important;
    background: #ffffff !important;
}

/* ==========================================================================
   SELECT
   ========================================================================== */

#kandidatstvane .pf select {
    cursor: pointer !important;
    min-height: 46px !important;
}

/* ==========================================================================
   TEXTAREA
   ========================================================================== */

#kandidatstvane .pf textarea {
    min-height: 118px !important;

    resize: vertical !important;
}

/* ==========================================================================
   REQUIRED LABELS
   ========================================================================== */

#kandidatstvane .pf.req > span::after {
    content: " *" !important;
    color: #7aaa18 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   CHECKBOX
   ========================================================================== */

#kandidatstvane .pchk {
    display: flex !important;
    align-items: flex-start !important;
    gap: 11px !important;

    margin: 4px 0 22px !important;
    padding: 0 !important;

    cursor: pointer !important;
}

#kandidatstvane .pchk input {
    flex: 0 0 auto !important;

    width: 18px !important;
    height: 18px !important;

    margin: 1px 0 0 !important;

    accent-color: #82bd16 !important;

    cursor: pointer !important;
}

#kandidatstvane .pchk > span {
    display: block !important;

    color: #697365 !important;

    font-family: inherit !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* ==========================================================================
   BUTTON
   ========================================================================== */

#kandidatstvane .pform .btn {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 50px !important;

    margin: 0 !important;
    padding: 13px 28px !important;

    color: #142006 !important;
    background:
        linear-gradient(
            135deg,
            #7cbf00 0%,
            #b5ed45 100%
        ) !important;

    border: 0 !important;
    border-radius: 11px !important;

    box-shadow:
        0 9px 24px rgba(117, 167, 18, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.35) !important;

    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 800 !important;

    cursor: pointer !important;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        filter 0.2s ease !important;
}

/* Бутон hover */

#kandidatstvane .pform .btn:hover {
    transform: translateY(-2px) !important;

    color: #0e1606 !important;

    background:
        linear-gradient(
            135deg,
            #a7e92e 0%,
            #c5f76b 100%
        ) !important;

    box-shadow:
        0 13px 30px rgba(117, 167, 18, 0.30),
        0 0 0 1px rgba(152, 219, 28, 0.18) !important;

    filter: none !important;
}

/* Бутон active */

#kandidatstvane .pform .btn:active {
    transform: translateY(0) !important;

    box-shadow:
        0 6px 15px rgba(117, 167, 18, 0.20) !important;
}

/* ==========================================================================
   AUTOFILL — Chrome
   ========================================================================== */

#kandidatstvane .pform input:-webkit-autofill,
#kandidatstvane .pform input:-webkit-autofill:hover,
#kandidatstvane .pform input:-webkit-autofill:focus {
    -webkit-text-fill-color: #20271a !important;

    -webkit-box-shadow:
        0 0 0 1000px #ffffff inset !important;

    border-color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    #kandidatstvane .pform {
        padding: 27px 23px !important;
        border-radius: 18px !important;
    }

    #kandidatstvane .pform-2 {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
        margin-bottom: 0 !important;
    }

    #kandidatstvane .pf {
        margin-bottom: 17px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 480px) {

    #kandidatstvane .pform {
        margin-top: 25px !important;
        padding: 24px 17px !important;
        border-radius: 16px !important;
    }

    #kandidatstvane .pf > span {
        font-size: 12.5px !important;
    }

    #kandidatstvane .pf input,
    #kandidatstvane .pf select,
    #kandidatstvane .pf textarea {
        padding: 12px 13px !important;
        font-size: 13.5px !important;
        border-radius: 10px !important;
    }

    #kandidatstvane .pform .btn {
        width: 100% !important;
        min-height: 49px !important;
    }

    #kandidatstvane .pchk > span {
        font-size: 12.5px !important;
    }
}

/**/


/* ==========================================================================
   FAQ — СВЕТЪЛ PREMIUM ДИЗАЙН
   За секцията .pfaq
   ========================================================================== */

.pfaq {
    width: 100%;
    max-width: 920px;
    margin: 34px auto 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ==========================================================================
   ВЪПРОС
   ========================================================================== */

.pfaq details {
    position: relative;
    margin: 0;
    padding: 0;
    background: #ffffff !important;
    border: 1px solid #e5e9df !important;
    border-radius: 16px;
    overflow: hidden;
    box-shadow:
        0 6px 20px rgba(20, 30, 10, 0.05),
        0 1px 2px rgba(20, 30, 10, 0.03);

    transition:
        border-color 0.22s ease,
        box-shadow 0.22s ease,
        transform 0.22s ease;
}

/* Зелената линия отляво */
.pfaq details::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #7cbf00;
    opacity: 0;
    transition: opacity 0.22s ease;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.pfaq details:hover {
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow:
        0 12px 30px rgba(30, 45, 15, 0.08),
        0 0 0 3px rgba(152, 219, 28, 0.06);
    transform: translateY(-1px);
}

.pfaq details:hover::before {
    opacity: 1;
}

/* ==========================================================================
   OPEN
   ========================================================================== */

.pfaq details[open] {
    border-color: rgba(152, 219, 28, 0.55) !important;
    box-shadow:
        0 14px 35px rgba(30, 45, 15, 0.09),
        0 0 0 3px rgba(152, 219, 28, 0.07);
}

.pfaq details[open]::before {
    opacity: 1;
}

/* ==========================================================================
   SUMMARY / ВЪПРОС
   ========================================================================== */

.pfaq summary {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    min-height: 68px;
    padding: 20px 58px 20px 24px;

    cursor: pointer;
    list-style: none;

    color: #20251b !important;
    background: #ffffff !important;

    font-size: 15px;
    line-height: 1.45;
    font-weight: 750;

    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

/* Премахва стандартния marker */
.pfaq summary::-webkit-details-marker {
    display: none;
}

.pfaq summary::marker {
    display: none;
    content: "";
}

/* Hover върху въпроса */
.pfaq summary:hover {
    background: #fbfcf9 !important;
    color: #151a11 !important;
}

/* ==========================================================================
   ИКОНА + / -
   ========================================================================== */

.pfaq summary::after {
    content: "+";

    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);

    width: 30px;
    height: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #f0f5e9;
    color: #6f9e14;

    font-size: 21px;
    line-height: 1;
    font-weight: 400;

    transition:
        transform 0.22s ease,
        background-color 0.22s ease,
        color 0.22s ease;
}

/* При отворен въпрос */
.pfaq details[open] summary::after {
    content: "−";
    background: #7cbf00;
    color: #142006;
    transform: translateY(-50%) rotate(180deg);
}

/* ==========================================================================
   ОТГОВОР
   ========================================================================== */

.pfaq details p {
    margin: 0 !important;
    padding: 0 58px 24px 24px;

    color: #596052 !important;
    background: #ffffff !important;

    font-size: 14px;
    line-height: 1.75;
    font-weight: 400;
}

/* Удебелен текст в отговора */
.pfaq details p b,
.pfaq details p strong {
    color: #252b20 !important;
    font-weight: 700;
}

/* ==========================================================================
   OPEN STATE — ЛЕКО ОТДЕЛЯНЕ НА ОТГОВОРА
   ========================================================================== */

.pfaq details[open] summary {
    background: #fcfdfb !important;
    color: #151a11 !important;
    border-bottom: 1px solid #edf0e9;
}

/* ==========================================================================
   FOCUS — ДОСТЪПНОСТ
   ========================================================================== */

.pfaq summary:focus-visible {
    outline: 3px solid rgba(152, 219, 28, 0.35);
    outline-offset: -3px;
    border-radius: 14px;
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 700px) {

    .pfaq {
        margin-top: 26px;
        gap: 10px;
    }

    .pfaq details {
        border-radius: 14px;
    }

    .pfaq summary {
        min-height: 62px;
        padding: 17px 52px 17px 18px;

        font-size: 14px;
        line-height: 1.5;
    }

    .pfaq summary::after {
        right: 15px;

        width: 28px;
        height: 28px;

        font-size: 19px;
    }

    .pfaq details p {
        padding: 0 18px 20px;

        font-size: 13px;
        line-height: 1.7;
    }
}

/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 420px) {

    .pfaq {
        gap: 8px;
    }

    .pfaq summary {
        padding: 16px 48px 16px 16px;
        font-size: 13.5px;
    }

    .pfaq details p {
        padding: 0 16px 18px;
        font-size: 13px;
    }

    .pfaq summary::after {
        right: 13px;
        width: 26px;
        height: 26px;
    }
}

/**/
```css
/* ==========================================================================
   FAQ — PREMIUM СВЕТЪЛ ДИЗАЙН
   Адаптиран директно за .pfaq + <details>
   ========================================================================== */

/* ==========================================================================
   FAQ GRID / CONTAINER
   ========================================================================== */

.pfaq {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-top: 40px !important;
    align-items: start !important;
}


/* ==========================================================================
   FAQ CARD
   ========================================================================== */

.pfaq details {
    position: relative !important;

    margin: 0 !important;
    padding: 24px 26px !important;

    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.24) !important;
    border-radius: 20px !important;

    overflow: hidden !important;

    box-shadow:
        0 4px 16px rgba(48, 90, 8, 0.035),
        0 1px 2px rgba(0, 0, 0, 0.02) !important;

    transition:
        transform .28s cubic-bezier(.2,.9,.2,1),
        box-shadow .28s ease,
        border-color .28s ease,
        background .28s ease !important;
}


/* ==========================================================================
   GREEN TOP ACCENT
   ========================================================================== */

.pfaq details::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 2px !important;

    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}


/* ==========================================================================
   HOVER
   ========================================================================== */

.pfaq details:hover {
    transform: translateY(-4px) !important;

    border-color: rgba(105, 201, 14, 0.5) !important;

    background: #ffffff !important;

    box-shadow:
        0 16px 34px rgba(48, 90, 8, 0.09),
        0 0 25px rgba(152, 219, 28, 0.045) !important;
}

.pfaq details:hover::before {
    opacity: 1 !important;
}


/* ==========================================================================
   OPEN CARD
   ========================================================================== */

.pfaq details[open] {
    border-color: rgba(105, 201, 14, 0.5) !important;

    background: #ffffff !important;

    box-shadow:
        0 12px 30px rgba(48, 90, 8, 0.075),
        0 0 25px rgba(152, 219, 28, 0.05) !important;
}

.pfaq details[open]::before {
    opacity: 1 !important;
}


/* ==========================================================================
   SUMMARY / QUESTION
   ========================================================================== */

.pfaq summary {
    position: relative !important;

    display: block !important;

    margin: 0 !important;
    padding: 0 38px 0 0 !important;

    cursor: pointer !important;
    list-style: none !important;

    color: #1a2e05 !important;
    background: transparent !important;

    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
    letter-spacing: -.2px !important;

    transition:
        color .25s ease !important;
}


/* Remove browser marker */

.pfaq summary::-webkit-details-marker {
    display: none !important;
}

.pfaq summary::marker {
    display: none !important;
    content: "" !important;
}


/* ==========================================================================
   PLUS ICON
   ========================================================================== */

.pfaq summary::after {
    content: "+" !important;

    position: absolute !important;

    right: 0 !important;
    top: 50% !important;

    width: 27px !important;
    height: 27px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    transform: translateY(-50%) !important;

    border-radius: 50% !important;

    background: #f3fae9 !important;
    border: 1px solid rgba(152, 219, 28, 0.3) !important;

    color: #4d790d !important;

    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease !important;
}


/* ==========================================================================
   OPEN ICON
   ========================================================================== */

.pfaq details[open] summary::after {
    content: "+" !important;

    transform:
        translateY(-50%)
        rotate(45deg) !important;

    background: #7cbf00 !important;
    border-color: #7cbf00 !important;

    color: #172306 !important;
}


/* ==========================================================================
   SUMMARY HOVER
   ========================================================================== */

.pfaq summary:hover {
    color: #305a08 !important;
}


/* ==========================================================================
   ANSWER
   ========================================================================== */

.pfaq details p {
    max-height: 0 !important;

    overflow: hidden !important;

    opacity: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #526247 !important;

    background: transparent !important;

    font-size: 14px !important;
    line-height: 1.7 !important;
    font-weight: 400 !important;

    transition:
        max-height .45s cubic-bezier(.2,.9,.2,1),
        opacity .3s ease,
        margin-top .3s ease !important;
}


/* ==========================================================================
   OPEN ANSWER
   ========================================================================== */

.pfaq details[open] p {
    max-height: 600px !important;

    opacity: 1 !important;

    margin-top: 16px !important;
}


/* ==========================================================================
   BOLD TEXT
   ========================================================================== */

.pfaq details p b,
.pfaq details p strong {
    color: #243b0a !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   SECTION HEADER
   Работи и ако заглавието е .sh
   ========================================================================== */

section.sec:has(.pfaq) .sh {
    max-width: 760px !important;
    margin: 0 auto 10px !important;
}

section.sec:has(.pfaq) .sh h2 {
    color: #172306 !important;

    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;

    font-weight: 800 !important;
    letter-spacing: -1px !important;

    margin: 0 0 14px !important;
}

section.sec:has(.pfaq) .sh p {
    color: #66745d !important;

    font-size: 16px !important;
    line-height: 1.65 !important;

    margin: 0 !important;
}


/* ==========================================================================
   GREEN TITLE ACCENT
   ========================================================================== */

section.sec:has(.pfaq) .sh::after {
    content: "" !important;

    display: block !important;

    width: 44px !important;
    height: 3px !important;

    margin-top: 22px !important;

    background: #7cbf00 !important;

    border-radius: 99px !important;

    box-shadow:
        0 0 16px rgba(152, 219, 28, 0.35) !important;
}


/* ==========================================================================
   FAQ SECTION BACKGROUND
   ========================================================================== */

section.sec:has(.pfaq) {
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152, 219, 28, 0.045),
            transparent 45%
        ),
        #ffffff !important;

    padding-top: 85px !important;
    padding-bottom: 85px !important;
}


/* ==========================================================================
   FOCUS
   ========================================================================== */

.pfaq summary:focus-visible {
    outline: 3px solid rgba(152, 219, 28, 0.35) !important;
    outline-offset: 4px !important;
    border-radius: 8px !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .pfaq {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    .pfaq details {
        padding: 22px 23px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.pfaq) {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }

    section.sec:has(.pfaq) .sh {
        margin-bottom: 8px !important;
    }

    section.sec:has(.pfaq) .sh h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.pfaq) .sh p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    .pfaq {
        margin-top: 32px !important;
        gap: 12px !important;
    }

    .pfaq details {
        padding: 20px !important;
        border-radius: 17px !important;
    }

    .pfaq summary {
        font-size: 16px !important;
        line-height: 1.4 !important;
        padding-right: 38px !important;
    }

    .pfaq details p {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
    }

    .pfaq summary::after {
        width: 27px !important;
        height: 27px !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 420px) {

    .pfaq {
        gap: 10px !important;
    }

    .pfaq details {
        padding: 18px !important;
        border-radius: 15px !important;
    }

    .pfaq summary {
        font-size: 14.5px !important;
        padding-right: 36px !important;
    }

    .pfaq details p {
        font-size: 13px !important;
    }
}
```



/*baza-znaniya/*/


/* =========================================
   KNOWLEDGE BASE — СВЕТЪЛ KT СТИЛ
   ========================================= */

.sec .wrap-n {
    position: relative !important;
}


/* =========================================
   CATEGORY CHIPS
   ========================================= */

.kb-chips {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 9px !important;
    margin-bottom: 24px !important;
}

.kb-chip {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;

    min-height: 40px !important;
    padding: 0 13px !important;

    border: 1px solid #dce5d7 !important;
    border-radius: 10px !important;

    background: #ffffff !important;
    color: #66735f !important;

    font-family: inherit !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;

    cursor: pointer !important;

    box-shadow: 0 3px 12px rgba(48, 90, 8, 0.025) !important;

    transition:
        background 0.22s ease,
        border-color 0.22s ease,
        color 0.22s ease,
        transform 0.22s ease,
        box-shadow 0.22s ease !important;
}

.kb-chip:hover {
    border-color: #bfd3b2 !important;
    background: #f9fcf7 !important;
    color: #4e850b !important;
    transform: translateY(-1px) !important;
}

.kb-chip.is-on {
    border-color: rgba(114, 173, 22, 0.42) !important;
    background: #f3f8ed !important;
    color: #4e850b !important;
    box-shadow: 0 4px 14px rgba(83, 133, 13, 0.07) !important;
}

.kb-chip svg {
    width: 17px !important;
    height: 17px !important;
    flex: 0 0 auto !important;
}

.kb-chip b {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 21px !important;
    height: 21px !important;
    padding: 0 5px !important;

    border-radius: 6px !important;

    background: #eef3ea !important;
    color: #72806c !important;

    font-size: 0.7rem !important;
    font-weight: 800 !important;
}

.kb-chip.is-on b {
    background: rgba(114, 173, 22, 0.14) !important;
    color: #4e850b !important;
}


/* =========================================
   FAQ LIST
   ========================================= */

.kb-items {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}


/* =========================================
   FAQ CARD
   ========================================= */

.kb-item {
    overflow: hidden !important;

    border: 1px solid #dfe7da !important;
    border-radius: 15px !important;

    background: #ffffff !important;

    box-shadow: 0 5px 18px rgba(48, 90, 8, 0.035) !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease !important;
}

.kb-item:hover {
    border-color: rgba(152, 219, 28, 0.38) !important;
    box-shadow: 0 8px 24px rgba(48, 90, 8, 0.055) !important;
}

.kb-item[open] {
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow: 0 9px 28px rgba(48, 90, 8, 0.07) !important;
}


/* =========================================
   QUESTION HEADER
   ========================================= */

.kb-q {
    position: relative !important;

    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) auto 24px !important;
    align-items: center !important;

    gap: 13px !important;

    min-height: 76px !important;
    padding: 13px 20px !important;

    list-style: none !important;
    cursor: pointer !important;
}

.kb-q::-webkit-details-marker {
    display: none !important;
}

.kb-q::marker {
    display: none !important;
    content: "" !important;
}


/* =========================================
   QUESTION ICON
   ========================================= */

.kb-q-ic {
    width: 42px !important;
    height: 42px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    background: rgba(183, 255, 53, 0.14) !important;
    color: #4e850b !important;

    transition:
        background 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease !important;
}

.kb-q-ic svg {
    width: 19px !important;
    height: 19px !important;
}

.kb-item:hover .kb-q-ic,
.kb-item[open] .kb-q-ic {
    background: rgba(152, 219, 28, 0.19) !important;
}

.kb-item[open] .kb-q-ic {
    transform: scale(1.04) !important;
}


/* =========================================
   QUESTION TEXT
   ========================================= */

.kb-q-t {
    min-width: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.kb-q-t b {
    color: #27361e !important;

    font-size: 0.94rem !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;

    transition: color 0.2s ease !important;
}

.kb-item:hover .kb-q-t b,
.kb-item[open] .kb-q-t b {
    color: #305a08 !important;
}

.kb-q-t span {
    color: #7a8871 !important;

    font-size: 0.78rem !important;
    line-height: 1.45 !important;
}


/* =========================================
   READING TIME
   ========================================= */

.kb-q-min {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;

    white-space: nowrap !important;

    color: #899485 !important;

    font-size: 0.73rem !important;
    font-weight: 600 !important;
}

.kb-q-min svg {
    width: 15px !important;
    height: 15px !important;
}


/* =========================================
   ARROW
   ========================================= */

.kb-q-arr {
    width: 24px !important;
    height: 24px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #7b8973 !important;

    transition:
        transform 0.25s ease,
        color 0.25s ease !important;
}

.kb-q-arr svg {
    width: 17px !important;
    height: 17px !important;
}

.kb-item[open] .kb-q-arr {
    transform: rotate(180deg) !important;
    color: #4e850b !important;
}


/* =========================================
   ANSWER AREA
   ========================================= */

.kb-a {
    padding: 0 20px 23px 75px !important;

    border-top: 1px solid #edf2e8 !important;

    color: #596650 !important;

    font-size: 0.87rem !important;
    line-height: 1.65 !important;
}


/* =========================================
   STEPS
   ========================================= */

.kb-step {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) !important;
    gap: 11px !important;

    margin-top: 18px !important;
}

.kb-step-n {
    width: 28px !important;
    height: 28px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 8px !important;

    background: #f1f6eb !important;
    color: #4e850b !important;

    font-size: 0.74rem !important;
    font-weight: 800 !important;
}

.kb-step span:last-child {
    padding-top: 2px !important;
}

.kb-step b {
    color: #35452d !important;
    font-weight: 750 !important;
}


/* =========================================
   CODE BOX
   ========================================= */

.kb-code {
    overflow-x: auto !important;

    margin: 18px 0 0 !important;
    padding: 17px 18px !important;

    border: 1px solid #e0e8dc !important;
    border-radius: 10px !important;

    background: #f7faf5 !important;
    color: #40523a !important;

    font-family:
        "SFMono-Regular",
        Consolas,
        "Liberation Mono",
        monospace !important;

    font-size: 0.79rem !important;
    line-height: 1.7 !important;

    white-space: pre !important;
}


/* =========================================
   WARNING BOX
   ========================================= */

.kb-warn {
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    gap: 11px !important;
    align-items: start !important;

    margin-top: 18px !important;
    padding: 15px 16px !important;

    border: 1px solid rgba(152, 219, 28, 0.23) !important;
    border-radius: 11px !important;

    background: #f8fbed !important;

    color: #65715f !important;

    font-size: 0.82rem !important;
    line-height: 1.58 !important;
}

.kb-warn-ic {
    width: 32px !important;
    height: 32px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 8px !important;

    background: rgba(152, 219, 28, 0.14) !important;
    color: #60960f !important;
}

.kb-warn-ic svg {
    width: 17px !important;
    height: 17px !important;
}

.kb-warn b {
    color: #3f551f !important;
    font-weight: 750 !important;
}


/* =========================================
   SUCCESS BOX
   ========================================= */

.kb-ok {
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    gap: 11px !important;
    align-items: start !important;

    margin-top: 14px !important;
    padding: 15px 16px !important;

    border: 1px solid rgba(114, 173, 22, 0.22) !important;
    border-radius: 11px !important;

    background: #f4f9ef !important;

    color: #5e6d57 !important;

    font-size: 0.82rem !important;
    line-height: 1.58 !important;
}

.kb-ok-ic {
    width: 32px !important;
    height: 32px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 8px !important;

    background: rgba(114, 173, 22, 0.14) !important;
    color: #4e850b !important;
}

.kb-ok-ic svg {
    width: 17px !important;
    height: 17px !important;
}

.kb-ok b {
    color: #365d0b !important;
}


/* =========================================
   "NOTHING FOUND"
   ========================================= */

.kb-none {
    margin-top: 18px !important;
    padding: 28px !important;

    border: 1px solid #dfe8db !important;
    border-radius: 15px !important;

    background: #ffffff !important;

    text-align: center !important;

    box-shadow: 0 5px 18px rgba(48, 90, 8, 0.035) !important;
}

.kb-none b {
    display: block !important;
    margin-bottom: 6px !important;

    color: #27361e !important;
    font-size: 1rem !important;
}

.kb-none p {
    margin: 0 0 16px !important;

    color: #7a8871 !important;
    font-size: 0.84rem !important;
    line-height: 1.55 !important;
}

.kb-none .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 42px !important;
    padding: 0 18px !important;

    border-radius: 9px !important;
    border: 0 !important;

    background: #72ad16 !important;
    color: #ffffff !important;

    font-size: 0.84rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;

    box-shadow: 0 6px 16px rgba(83, 133, 13, 0.16) !important;

    transition:
        transform 0.22s ease,
        background 0.22s ease !important;
}

.kb-none .btn:hover {
    transform: translateY(-2px) !important;
    background: #60960f !important;
}


/* =========================================
   RESPONSIVE — TABLET
   ========================================= */

@media (max-width: 800px) {

    .kb-chips {
        gap: 7px !important;
    }

    .kb-chip {
        min-height: 38px !important;
        padding: 0 11px !important;
    }

    .kb-q {
        grid-template-columns: 40px minmax(0, 1fr) 22px !important;
        gap: 11px !important;
        padding: 13px 16px !important;
    }

    .kb-q-min {
        display: none !important;
    }

    .kb-q-ic {
        width: 40px !important;
        height: 40px !important;
    }

    .kb-a {
        padding-left: 67px !important;
        padding-right: 17px !important;
    }
}


/* =========================================
   RESPONSIVE — MOBILE
   ========================================= */

@media (max-width: 600px) {

    .kb-chips {
        margin-bottom: 18px !important;

        flex-wrap: nowrap !important;
        overflow-x: auto !important;

        padding-bottom: 4px !important;

        scrollbar-width: none !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .kb-chips::-webkit-scrollbar {
        display: none !important;
    }

    .kb-chip {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    .kb-items {
        gap: 10px !important;
    }

    .kb-item {
        border-radius: 13px !important;
    }

    .kb-q {
        grid-template-columns: 38px minmax(0, 1fr) 21px !important;

        min-height: 70px !important;

        gap: 10px !important;
        padding: 12px 13px !important;
    }

    .kb-q-ic {
        width: 38px !important;
        height: 38px !important;
        border-radius: 10px !important;
    }

    .kb-q-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    .kb-q-t b {
        font-size: 0.88rem !important;
        line-height: 1.35 !important;
    }

    .kb-q-t span {
        font-size: 0.74rem !important;
        line-height: 1.4 !important;
    }

    .kb-q-arr svg {
        width: 16px !important;
        height: 16px !important;
    }

    .kb-a {
        padding: 0 13px 18px !important;
    }

    .kb-step {
        grid-template-columns: 27px minmax(0, 1fr) !important;
        gap: 9px !important;

        margin-top: 15px !important;
    }

    .kb-step-n {
        width: 27px !important;
        height: 27px !important;
    }

    .kb-code {
        margin-top: 15px !important;
        padding: 14px !important;

        font-size: 0.72rem !important;
        line-height: 1.65 !important;
    }

    .kb-warn,
    .kb-ok {
        grid-template-columns: 29px minmax(0, 1fr) !important;
        gap: 9px !important;

        padding: 13px !important;

        font-size: 0.79rem !important;
    }

    .kb-warn-ic,
    .kb-ok-ic {
        width: 29px !important;
        height: 29px !important;
    }

    .kb-warn-ic svg,
    .kb-ok-ic svg {
        width: 15px !important;
        height: 15px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .kb-q {
        grid-template-columns: 35px minmax(0, 1fr) 19px !important;
        gap: 8px !important;
        padding: 11px !important;
    }

    .kb-q-ic {
        width: 35px !important;
        height: 35px !important;
    }

    .kb-q-t b {
        font-size: 0.84rem !important;
    }

    .kb-q-t span {
        font-size: 0.71rem !important;
    }

    .kb-a {
        padding-left: 11px !important;
        padding-right: 11px !important;
    }
}
/**/

/* =========================================
   KB HOW — СВЕТЪЛ KT СТИЛ
   ========================================= */

.kb-head {
    max-width: 720px !important;
    margin: 0 auto 30px !important;
    text-align: center !important;
}

.kb-head h2 {
    margin: 0 0 9px !important;

    color: #27361e !important;

    font-family: inherit !important;
    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
}

.kb-head p {
    margin: 0 !important;

    color: #7a8871 !important;

    font-size: 0.9rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   HOW CARDS
   ========================================= */

.kb-how {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
}


/* =========================================
   SINGLE CARD
   ========================================= */

.kb-how-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    min-width: 0 !important;

    padding: 25px 23px 24px !important;

    border: 1px solid rgba(152, 219, 28, 0.24) !important;
    border-radius: 15px !important;

    background: #ffffff !important;

    box-shadow: 0 5px 18px rgba(48, 90, 8, 0.045) !important;

    color: #65715f !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease !important;
}

.kb-how-i:hover {
    transform: translateY(-3px) !important;

    border-color: rgba(152, 219, 28, 0.42) !important;

    background: #fefffd !important;

    box-shadow: 0 10px 28px rgba(48, 90, 8, 0.075) !important;
}


/* =========================================
   ICON
   ========================================= */

.kb-how-ic {
    width: 44px !important;
    height: 44px !important;

    min-width: 44px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 18px !important;

    border-radius: 11px !important;

    background: rgba(183, 255, 53, 0.15) !important;
    color: #4e850b !important;

    transition:
        background 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease !important;
}

.kb-how-ic svg {
    width: 20px !important;
    height: 20px !important;
}

.kb-how-i:hover .kb-how-ic {
    background: rgba(152, 219, 28, 0.2) !important;
    color: #3f7207 !important;
    transform: translateY(-1px) !important;
}


/* =========================================
   CARD TITLE
   ========================================= */

.kb-how-i > b {
    display: block !important;

    margin-bottom: 8px !important;

    color: #27361e !important;

    font-size: 0.94rem !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;

    transition: color 0.2s ease !important;
}

.kb-how-i:hover > b {
    color: #305a08 !important;
}


/* =========================================
   CARD TEXT
   ========================================= */

.kb-how-i > p {
    margin: 0 !important;

    color: #6f7c69 !important;

    font-size: 0.82rem !important;
    line-height: 1.65 !important;
}


/* =========================================
   SUBTLE TOP ACCENT
   ========================================= */

.kb-how-i::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 23px !important;
    right: 23px !important;

    height: 2px !important;

    border-radius: 0 0 4px 4px !important;

    background: linear-gradient(
        90deg,
        rgba(152, 219, 28, 0),
        rgba(152, 219, 28, 0.38),
        rgba(152, 219, 28, 0)
    ) !important;

    opacity: 0 !important;

    transition: opacity 0.25s ease !important;
}

.kb-how-i:hover::before {
    opacity: 1 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 850px) {

    .kb-how {
        grid-template-columns: 1fr !important;
        gap: 13px !important;
    }

    .kb-how-i {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) !important;
        column-gap: 15px !important;
        padding: 21px !important;
    }

    .kb-how-ic {
        grid-row: span 2 !important;

        margin-bottom: 0 !important;
    }

    .kb-how-i > b {
        margin-bottom: 5px !important;
    }

    .kb-how-i > p {
        grid-column: 2 !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .kb-head {
        margin-bottom: 22px !important;
        padding: 0 5px !important;
    }

    .kb-head h2 {
        font-size: 1.4rem !important;
    }

    .kb-head p {
        font-size: 0.82rem !important;
        line-height: 1.55 !important;
    }

    .kb-how {
        gap: 10px !important;
    }

    .kb-how-i {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        column-gap: 12px !important;

        padding: 18px !important;

        border-radius: 13px !important;
    }

    .kb-how-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;

        border-radius: 10px !important;
    }

    .kb-how-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .kb-how-i > b {
        font-size: 0.87rem !important;
        line-height: 1.4 !important;
    }

    .kb-how-i > p {
        font-size: 0.77rem !important;
        line-height: 1.58 !important;
    }

    .kb-how-i::before {
        left: 18px !important;
        right: 18px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .kb-how-i {
        grid-template-columns: 36px minmax(0, 1fr) !important;
        column-gap: 10px !important;

        padding: 16px !important;
    }

    .kb-how-ic {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
    }

    .kb-how-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    .kb-how-i > b {
        font-size: 0.84rem !important;
    }

    .kb-how-i > p {
        font-size: 0.74rem !important;
    }

    .kb-how-i::before {
        left: 16px !important;
        right: 16px !important;
    }
}
/**/


/* =========================================
   KB MISS — CTA / CONTACT
   СВЕТЪЛ KT СТИЛ
   ========================================= */

.sec-wash {
    position: relative !important;
    overflow: hidden !important;

    background:
        linear-gradient(
            135deg,
            #f5faef 0%,
            #fbfdf9 52%,
            #f1f8e9 100%
        ) !important;
}


/* =========================================
   MAIN CTA
   ========================================= */

.kb-miss {
    position: relative !important;
    overflow: hidden !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;

    gap: 45px !important;

    padding: 42px 46px !important;

    border: 1px solid rgba(152, 219, 28, 0.28) !important;
    border-radius: 20px !important;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.96),
            rgba(247,251,241,0.96)
        ) !important;

    box-shadow:
        0 12px 35px rgba(48, 90, 8, 0.065),
        0 2px 8px rgba(48, 90, 8, 0.025) !important;
}


/* =========================================
   DECORATIVE LIGHT
   ========================================= */

.kb-miss::before {
    content: "" !important;

    position: absolute !important;

    width: 280px !important;
    height: 280px !important;

    right: -105px !important;
    top: -145px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.20) 0%,
            rgba(183, 255, 53, 0.08) 42%,
            rgba(183, 255, 53, 0) 72%
        ) !important;

    pointer-events: none !important;
}


/* =========================================
   SECOND DECORATIVE SHAPE
   ========================================= */

.kb-miss::after {
    content: "" !important;

    position: absolute !important;

    width: 120px !important;
    height: 120px !important;

    left: -55px !important;
    bottom: -65px !important;

    border: 1px solid rgba(152, 219, 28, 0.14) !important;
    border-radius: 50% !important;

    pointer-events: none !important;
}


/* =========================================
   TEXT AREA
   ========================================= */

.kb-miss > div:first-child {
    position: relative !important;
    z-index: 2 !important;

    min-width: 0 !important;
}

.kb-miss h2 {
    margin: 0 0 9px !important;

    color: #27361e !important;

    font-family: inherit !important;

    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;
}

.kb-miss h2::after {
    content: "" !important;

    display: block !important;

    width: 42px !important;
    height: 3px !important;

    margin-top: 13px !important;

    border-radius: 10px !important;

    background: #72ad16 !important;
}

.kb-miss p {
    max-width: 680px !important;

    margin: 0 !important;

    color: #6f7c69 !important;

    font-size: 0.88rem !important;
    line-height: 1.65 !important;
}


/* =========================================
   CHECK LIST
   ========================================= */

.kb-miss-l {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    gap: 9px 14px !important;

    margin-top: 24px !important;
}

.kb-miss-r {
    display: flex !important;
    align-items: flex-start !important;

    gap: 9px !important;

    color: #5f6d59 !important;

    font-size: 0.77rem !important;
    line-height: 1.45 !important;
}


/* =========================================
   CHECK ICON
   ========================================= */

.kb-miss-r i {
    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-top: 0 !important;

    border-radius: 7px !important;

    background: rgba(114, 173, 22, 0.13) !important;
    color: #4e850b !important;

    font-style: normal !important;
}

.kb-miss-r i svg {
    width: 13px !important;
    height: 13px !important;
}


/* =========================================
   BUTTON AREA
   ========================================= */

.kb-miss-go {
    position: relative !important;
    z-index: 3 !important;

    display: flex !important;
    flex-direction: column !important;

    gap: 10px !important;

    min-width: 145px !important;
}


/* =========================================
   PRIMARY BUTTON
   ========================================= */

.kb-miss-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 48px !important;

    padding: 0 24px !important;

    border-radius: 10px !important;

    font-family: inherit !important;
    font-size: 0.86rem !important;
    font-weight: 750 !important;

    text-decoration: none !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease !important;
}


/* =========================================
   LIGHT BUTTON
   ========================================= */

.kb-miss-go .btn-light {
    border: 0 !important;

    background: #72ad16 !important;
    color: #ffffff !important;

    box-shadow:
        0 7px 18px rgba(83, 133, 13, 0.18) !important;
}

.kb-miss-go .btn-light:hover {
    transform: translateY(-2px) !important;

    background: #60960f !important;

    box-shadow:
        0 11px 24px rgba(83, 133, 13, 0.24) !important;
}


/* =========================================
   PHONE / GHOST BUTTON
   ========================================= */

.kb-miss-go .kb-miss-ghost {
    border: 1px solid rgba(114, 173, 22, 0.25) !important;

    background: #ffffff !important;

    color: #4e850b !important;

    box-shadow:
        0 3px 12px rgba(48, 90, 8, 0.035) !important;
}

.kb-miss-go .kb-miss-ghost:hover {
    transform: translateY(-2px) !important;

    border-color: rgba(114, 173, 22, 0.42) !important;

    background: #f4f9ef !important;

    box-shadow:
        0 7px 18px rgba(48, 90, 8, 0.065) !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 900px) {

    .kb-miss {
        grid-template-columns: minmax(0, 1fr) 140px !important;

        gap: 28px !important;

        padding: 34px 34px !important;
    }

    .kb-miss-l {
        grid-template-columns: 1fr !important;

        gap: 8px !important;
    }

    .kb-miss-go {
        min-width: 130px !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 650px) {

    .kb-miss {
        grid-template-columns: 1fr !important;

        gap: 25px !important;

        padding: 29px 24px !important;

        border-radius: 16px !important;
    }

    .kb-miss h2 {
        font-size: 1.4rem !important;
    }

    .kb-miss p {
        font-size: 0.81rem !important;
        line-height: 1.6 !important;
    }

    .kb-miss-l {
        margin-top: 20px !important;

        gap: 9px !important;
    }

    .kb-miss-r {
        font-size: 0.76rem !important;
    }

    .kb-miss-go {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;

        gap: 9px !important;

        width: 100% !important;
    }

    .kb-miss-go .btn {
        width: 100% !important;

        padding: 0 13px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .kb-miss {
        padding: 24px 18px !important;
    }

    .kb-miss-go {
        grid-template-columns: 1fr !important;
    }

    .kb-miss-go .btn {
        min-height: 45px !important;
    }

    .kb-miss::before {
        width: 210px !important;
        height: 210px !important;

        right: -100px !important;
        top: -110px !important;
    }
}
/*obshti-usloviya/*

/* =========================================
   OU GIST — СВЕТЪЛ KT СТИЛ
   ========================================= */

.ou-gist {
    position: relative !important;
    overflow: hidden !important;

    max-width: 980px !important;
    margin: 0 auto !important;

    padding: 32px 34px 26px !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 20px !important;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbfdf9 58%,
            #f5faef 100%
        ) !important;

    box-shadow:
        0 12px 35px rgba(48, 90, 8, 0.055),
        0 2px 8px rgba(48, 90, 8, 0.025) !important;

    color: #6f7c69 !important;
}


/* =========================================
   DECORATIVE SHAPE
   ========================================= */

.ou-gist::before {
    content: "" !important;

    position: absolute !important;

    width: 260px !important;
    height: 260px !important;

    top: -145px !important;
    right: -90px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.17) 0%,
            rgba(183, 255, 53, 0.07) 42%,
            rgba(183, 255, 53, 0) 72%
        ) !important;

    pointer-events: none !important;
}


/* =========================================
   SECOND DECORATION
   ========================================= */

.ou-gist::after {
    content: "" !important;

    position: absolute !important;

    width: 100px !important;
    height: 100px !important;

    left: -55px !important;
    bottom: -55px !important;

    border: 1px solid rgba(152, 219, 28, 0.13) !important;
    border-radius: 50% !important;

    pointer-events: none !important;
}


/* =========================================
   HEADER
   ========================================= */

.ou-gist-h {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    align-items: center !important;

    gap: 13px !important;

    margin-bottom: 24px !important;

    color: #27361e !important;

    font-size: 1.05rem !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;

    letter-spacing: -0.015em !important;
}


/* =========================================
   HEADER ICON
   ========================================= */

.ou-gist-ic {
    width: 43px !important;
    height: 43px !important;

    min-width: 43px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    background: rgba(183, 255, 53, 0.15) !important;

    color: #4e850b !important;

    box-shadow:
        inset 0 0 0 1px rgba(152, 219, 28, 0.08) !important;
}

.ou-gist-ic svg {
    width: 20px !important;
    height: 20px !important;
}


/* =========================================
   LIST
   ========================================= */

.ou-gist-l {
    position: relative !important;
    z-index: 2 !important;

    display: grid !important;

    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 12px !important;
}


/* =========================================
   SINGLE ROW
   ========================================= */

.ou-gist-r {
    position: relative !important;

    display: flex !important;
    align-items: flex-start !important;

    gap: 14px !important;

    min-width: 0 !important;

    padding: 17px 18px !important;

    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    border-radius: 13px !important;

    background: rgba(255, 255, 255, 0.86) !important;

    box-shadow:
        0 4px 13px rgba(48, 90, 8, 0.025) !important;

    transition:
        transform 0.23s ease,
        border-color 0.23s ease,
        box-shadow 0.23s ease,
        background 0.23s ease !important;
}

.ou-gist-r:hover {
    transform: translateY(-2px) !important;

    border-color: rgba(152, 219, 28, 0.34) !important;

    background: #ffffff !important;

    box-shadow:
        0 8px 22px rgba(48, 90, 8, 0.06) !important;
}


/* =========================================
   NUMBER
   ========================================= */

.ou-gist-n {
    width: 31px !important;
    height: 31px !important;

    min-width: 31px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-top: 1px !important;

    border-radius: 9px !important;

    background:
        linear-gradient(
            135deg,
            #b7ff35,
            #7cbf00
        ) !important;

    color: #305a08 !important;

    font-size: 0.76rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;

    box-shadow:
        0 4px 10px rgba(114, 173, 22, 0.13) !important;
}


/* =========================================
   TEXT AREA
   ========================================= */

.ou-gist-t {
    display: block !important;

    min-width: 0 !important;
}


/* =========================================
   TITLE
   ========================================= */

.ou-gist-t > b {
    display: block !important;

    margin: 0 0 5px !important;

    color: #27361e !important;

    font-size: 0.86rem !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;

    letter-spacing: -0.005em !important;
}


/* =========================================
   DESCRIPTION
   ========================================= */

.ou-gist-t > p {
    margin: 0 !important;

    color: #6f7c69 !important;

    font-size: 0.76rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   LINKS
   ========================================= */

.ou-gist-t > p a {
    display: inline-block !important;

    margin-left: 3px !important;

    color: #60960f !important;

    font-weight: 700 !important;

    text-decoration: none !important;

    border-bottom: 1px solid rgba(114, 173, 22, 0.28) !important;

    transition:
        color 0.2s ease,
        border-color 0.2s ease !important;
}

.ou-gist-t > p a:hover {
    color: #3f7207 !important;

    border-color: rgba(63, 114, 7, 0.55) !important;
}


/* =========================================
   BOTTOM NOTICE
   ========================================= */

.ou-gist-say {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin-top: 17px !important;
    padding: 13px 16px !important;

    border-left: 3px solid #7cbf00 !important;
    border-radius: 0 9px 9px 0 !important;

    background: rgba(183, 255, 53, 0.08) !important;

    color: #7a8871 !important;

    font-size: 0.71rem !important;
    line-height: 1.55 !important;
}

.ou-gist-say b {
    color: #53654a !important;

    font-weight: 750 !important;
}


/* =========================================
   SUBTLE TOP ACCENT
   ========================================= */

.ou-gist-h::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    bottom: -13px !important;

    width: 38px !important;
    height: 2px !important;

    border-radius: 5px !important;

    background: #72ad16 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 800px) {

    .ou-gist {
        padding: 28px 26px 23px !important;
    }

    .ou-gist-l {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .ou-gist-r {
        padding: 16px 17px !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .ou-gist {
        padding: 24px 18px 20px !important;

        border-radius: 16px !important;
    }

    .ou-gist-h {
        gap: 11px !important;

        margin-bottom: 20px !important;

        font-size: 0.94rem !important;
    }

    .ou-gist-ic {
        width: 39px !important;
        height: 39px !important;
        min-width: 39px !important;

        border-radius: 10px !important;
    }

    .ou-gist-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .ou-gist-l {
        gap: 9px !important;
    }

    .ou-gist-r {
        gap: 11px !important;

        padding: 14px !important;

        border-radius: 12px !important;
    }

    .ou-gist-n {
        width: 29px !important;
        height: 29px !important;
        min-width: 29px !important;

        border-radius: 8px !important;

        font-size: 0.71rem !important;
    }

    .ou-gist-t > b {
        font-size: 0.82rem !important;
        line-height: 1.4 !important;
    }

    .ou-gist-t > p {
        font-size: 0.73rem !important;
        line-height: 1.57 !important;
    }

    .ou-gist-say {
        margin-top: 13px !important;
        padding: 11px 13px !important;

        font-size: 0.68rem !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .ou-gist {
        padding: 21px 14px 17px !important;

        border-radius: 14px !important;
    }

    .ou-gist-h {
        font-size: 0.88rem !important;
    }

    .ou-gist-ic {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
    }

    .ou-gist-r {
        gap: 9px !important;
        padding: 12px !important;
    }

    .ou-gist-n {
        width: 27px !important;
        height: 27px !important;
        min-width: 27px !important;

        font-size: 0.68rem !important;
    }

    .ou-gist-t > b {
        font-size: 0.79rem !important;
    }

    .ou-gist-t > p {
        font-size: 0.7rem !important;
    }
}
/**/

/* =========================================================
   OU DOCUMENT — СВЕТЪЛ KT СТИЛ
   Съдържание + дълъг документ
   ========================================================= */

.ou-doc {
    display: grid !important;
    grid-template-columns: 245px minmax(0, 1fr) !important;
    gap: 28px !important;
    align-items: start !important;
}


/* =========================================================
   TABLE OF CONTENTS
   ========================================================= */

.ou-toc {
    position: sticky !important;
    top: 25px !important;

    padding: 18px !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 15px !important;

    background: #ffffff !important;

    box-shadow:
        0 5px 18px rgba(48, 90, 8, 0.045) !important;
}

.ou-toc-h {
    margin: 2px 4px 13px !important;

    color: #27361e !important;

    font-size: 0.86rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em !important;
}

.ou-toc-l {
    display: flex !important;
    flex-direction: column !important;

    gap: 3px !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

.ou-toc-l li {
    margin: 0 !important;
    padding: 0 !important;
}

.ou-toc-l a {
    position: relative !important;

    display: block !important;

    padding: 9px 10px 9px 13px !important;

    border-radius: 8px !important;

    color: #6f7c69 !important;

    font-size: 0.74rem !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;

    text-decoration: none !important;

    transition:
        color 0.2s ease,
        background 0.2s ease,
        padding 0.2s ease !important;
}

.ou-toc-l a::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 50% !important;

    width: 3px !important;
    height: 0 !important;

    border-radius: 5px !important;

    background: #72ad16 !important;

    transform: translateY(-50%) !important;

    transition: height 0.2s ease !important;
}

.ou-toc-l a:hover {
    color: #4e850b !important;
    background: #f5faef !important;
    padding-left: 15px !important;
}

.ou-toc-l a:hover::before {
    height: 15px !important;
}

.ou-toc-l a.on {
    color: #4e850b !important;

    background:
        linear-gradient(
            90deg,
            #f1f8e9,
            #f8fbf5
        ) !important;

    font-weight: 750 !important;
}

.ou-toc-l a.on::before {
    height: 18px !important;
}


/* =========================================================
   DOCUMENT BODY
   ========================================================= */

.ou-body {
    min-width: 0 !important;

    padding: 0 !important;
}


/* =========================================================
   INDIVIDUAL SECTION
   ========================================================= */

.ou-part {
    position: relative !important;

    margin: 0 0 18px !important;
    padding: 29px 31px 30px !important;

    border: 1px solid rgba(152, 219, 28, 0.20) !important;
    border-radius: 16px !important;

    background: #ffffff !important;

    box-shadow:
        0 5px 18px rgba(48, 90, 8, 0.035) !important;

    scroll-margin-top: 30px !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

.ou-part:hover {
    border-color: rgba(152, 219, 28, 0.30) !important;

    box-shadow:
        0 8px 24px rgba(48, 90, 8, 0.055) !important;
}


/* =========================================================
   SMALL SECTION LABEL
   ========================================================= */

.ou-part-n {
    display: inline-flex !important;
    align-items: center !important;

    margin-bottom: 10px !important;
    padding: 5px 9px !important;

    border-radius: 7px !important;

    background: rgba(183, 255, 53, 0.14) !important;
    color: #4e850b !important;

    font-size: 0.67rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;

    letter-spacing: 0.02em !important;
}


/* =========================================================
   HEADINGS
   ========================================================= */

.ou-part h2 {
    position: relative !important;

    margin: 0 0 19px !important;

    padding-bottom: 16px !important;

    color: #27361e !important;

    font-family: inherit !important;

    font-size: clamp(1.25rem, 2vw, 1.55rem) !important;
    line-height: 1.25 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;
}

.ou-part h2::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    bottom: 0 !important;

    width: 38px !important;
    height: 3px !important;

    border-radius: 10px !important;

    background: #72ad16 !important;
}


/* =========================================================
   PARAGRAPHS
   ========================================================= */

.ou-part > p {
    max-width: 850px !important;

    margin: 0 0 14px !important;

    color: #687565 !important;

    font-size: 0.84rem !important;
    line-height: 1.72 !important;
}

.ou-part > p:last-child {
    margin-bottom: 0 !important;
}

.ou-part p b {
    color: #3c512f !important;
    font-weight: 750 !important;
}


/* =========================================================
   LINKS
   ========================================================= */

.ou-part a:not(.ou-toc-l a) {
    color: #5c970c !important;

    font-weight: 700 !important;

    text-decoration:
        underline !important;

    text-decoration-color:
        rgba(114, 173, 22, 0.30) !important;

    text-underline-offset: 3px !important;

    transition:
        color 0.2s ease,
        text-decoration-color 0.2s ease !important;
}

.ou-part a:not(.ou-toc-l a):hover {
    color: #3f7207 !important;

    text-decoration-color:
        rgba(114, 173, 22, 0.65) !important;
}


/* =========================================================
   "С ПРОСТИ ДУМИ" BOX
   ========================================================= */

.ou-plain {
    position: relative !important;

    margin: 0 0 20px !important;
    padding: 16px 18px 16px 19px !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 11px !important;

    background:
        linear-gradient(
            135deg,
            #f5faef 0%,
            #fbfdf9 100%
        ) !important;

    color: #667362 !important;

    font-size: 0.81rem !important;
    line-height: 1.62 !important;
}

.ou-plain::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 13px !important;
    bottom: 13px !important;

    width: 3px !important;

    border-radius: 0 5px 5px 0 !important;

    background: #72ad16 !important;
}

.ou-plain b {
    display: block !important;

    margin-bottom: 5px !important;

    color: #3f7207 !important;

    font-size: 0.72rem !important;
    font-weight: 800 !important;

    text-transform: uppercase !important;
    letter-spacing: 0.035em !important;
}


/* =========================================================
   NUMBER STATISTICS
   ========================================================= */

.ou-nums {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    gap: 10px !important;

    margin: 21px 0 22px !important;
}

.ou-num {
    position: relative !important;

    min-width: 0 !important;

    padding: 17px 16px !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 11px !important;

    background: #fbfdf9 !important;
}

.ou-num::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 16px !important;
    right: 16px !important;

    height: 2px !important;

    border-radius: 0 0 4px 4px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(114, 173, 22, 0.55),
            transparent
        ) !important;
}

.ou-num b {
    display: block !important;

    margin-bottom: 4px !important;

    color: #4e850b !important;

    font-size: 1.15rem !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
}

.ou-num span {
    display: block !important;

    color: #7a8871 !important;

    font-size: 0.69rem !important;
    line-height: 1.45 !important;
}


/* =========================================================
   MARK / IMPORTANT BOX
   ========================================================= */

.ou-mark {
    position: relative !important;

    margin: 20px 0 !important;
    padding: 16px 18px 16px 20px !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 11px !important;

    background:
        linear-gradient(
            135deg,
            #f4f9ed,
            #fbfdf9
        ) !important;

    color: #65715f !important;

    font-size: 0.8rem !important;
    line-height: 1.65 !important;
}

.ou-mark::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 12px !important;
    bottom: 12px !important;

    width: 3px !important;

    border-radius: 0 5px 5px 0 !important;

    background: #72ad16 !important;
}

.ou-mark > b {
    color: #3c512f !important;
    font-weight: 800 !important;
}


/* =========================================================
   LISTS
   ========================================================= */

.ou-part ul,
.ou-part ol {
    margin: 15px 0 18px !important;
    padding: 0 !important;

    list-style: none !important;
}

.ou-part ul li,
.ou-part ol li {
    position: relative !important;

    margin: 0 0 9px !important;
    padding: 10px 13px 10px 36px !important;

    border: 1px solid rgba(152, 219, 28, 0.12) !important;
    border-radius: 9px !important;

    background: #fbfdf9 !important;

    color: #667362 !important;

    font-size: 0.8rem !important;
    line-height: 1.55 !important;
}

.ou-part ul li::before {
    content: "" !important;

    position: absolute !important;

    left: 14px !important;
    top: 17px !important;

    width: 7px !important;
    height: 7px !important;

    border-radius: 50% !important;

    background: #72ad16 !important;

    box-shadow:
        0 0 0 4px rgba(114, 173, 22, 0.09) !important;
}

.ou-part ol {
    counter-reset: ou-counter !important;
}

.ou-part ol li {
    counter-increment: ou-counter !important;
}

.ou-part ol li::before {
    content: counter(ou-counter) !important;

    position: absolute !important;

    left: 10px !important;
    top: 9px !important;

    width: 20px !important;
    height: 20px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 6px !important;

    background: rgba(183, 255, 53, 0.15) !important;
    color: #4e850b !important;

    font-size: 0.65rem !important;
    font-weight: 800 !important;
}


/* =========================================================
   LISTS INSIDE MARK
   ========================================================= */

.ou-mark ul {
    margin: 10px 0 5px !important;
}

.ou-mark ul li {
    margin-bottom: 6px !important;

    padding-top: 7px !important;
    padding-bottom: 7px !important;

    background: rgba(255,255,255,0.55) !important;
}


/* =========================================================
   FIRST SECTION — LITTLE EXTRA ACCENT
   ========================================================= */

.ou-part:first-child {
    border-top-color: rgba(114, 173, 22, 0.38) !important;
}

.ou-part:first-child::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 30px !important;
    right: 30px !important;

    height: 2px !important;

    border-radius: 0 0 5px 5px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(114, 173, 22, 0.45),
            transparent
        ) !important;
}


/* =========================================================
   SECTION SPACING
   ========================================================= */

.ou-part + .ou-part {
    margin-top: 18px !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 950px) {

    .ou-doc {
        grid-template-columns: 205px minmax(0, 1fr) !important;
        gap: 18px !important;
    }

    .ou-toc {
        padding: 14px !important;
    }

    .ou-toc-l a {
        padding: 8px 8px 8px 11px !important;

        font-size: 0.7rem !important;
    }

    .ou-part {
        padding: 25px 26px !important;
    }

    .ou-nums {
        gap: 8px !important;
    }
}


/* =========================================================
   TABLET / SMALL
   ========================================================= */

@media (max-width: 760px) {

    .ou-doc {
        display: block !important;
    }

    .ou-toc {
        position: relative !important;
        top: auto !important;

        margin-bottom: 15px !important;

        padding: 15px !important;
    }

    .ou-toc-h {
        margin-bottom: 10px !important;
    }

    .ou-toc-l {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

        gap: 3px 5px !important;
    }

    .ou-toc-l a {
        font-size: 0.7rem !important;
    }

    .ou-part {
        padding: 24px !important;
    }

    .ou-nums {
        grid-template-columns: 1fr !important;
    }

    .ou-num {
        display: grid !important;
        grid-template-columns: 90px minmax(0, 1fr) !important;
        align-items: center !important;

        gap: 10px !important;
    }

    .ou-num b {
        margin: 0 !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .ou-toc {
        border-radius: 13px !important;
    }

    .ou-toc-l {
        grid-template-columns: 1fr !important;
    }

    .ou-toc-l a {
        padding: 8px 9px 8px 12px !important;

        font-size: 0.72rem !important;
    }

    .ou-part {
        margin-bottom: 11px !important;
        padding: 21px 18px 22px !important;

        border-radius: 13px !important;
    }

    .ou-part h2 {
        margin-bottom: 16px !important;
        padding-bottom: 13px !important;

        font-size: 1.25rem !important;
    }

    .ou-part > p {
        margin-bottom: 12px !important;

        font-size: 0.79rem !important;
        line-height: 1.67 !important;
    }

    .ou-part-n {
        margin-bottom: 8px !important;

        font-size: 0.63rem !important;
    }

    .ou-plain {
        margin-bottom: 17px !important;

        padding: 14px 15px 14px 17px !important;

        font-size: 0.76rem !important;
        line-height: 1.6 !important;
    }

    .ou-mark {
        margin: 17px 0 !important;

        padding: 14px 15px 14px 17px !important;

        font-size: 0.75rem !important;
        line-height: 1.6 !important;
    }

    .ou-part ul,
    .ou-part ol {
        margin: 13px 0 15px !important;
    }

    .ou-part ul li,
    .ou-part ol li {
        padding: 9px 11px 9px 33px !important;

        font-size: 0.75rem !important;
    }

    .ou-part ul li::before {
        left: 12px !important;
        top: 16px !important;
    }

    .ou-part ol li::before {
        left: 8px !important;
        top: 8px !important;
    }

    .ou-num {
        grid-template-columns: 82px minmax(0, 1fr) !important;

        padding: 14px !important;
    }

    .ou-num b {
        font-size: 1rem !important;
    }

    .ou-num span {
        font-size: 0.66rem !important;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 400px) {

    .ou-part {
        padding: 19px 15px 20px !important;
    }

    .ou-part h2 {
        font-size: 1.15rem !important;
    }

    .ou-part > p {
        font-size: 0.76rem !important;
    }

    .ou-plain,
    .ou-mark {
        font-size: 0.73rem !important;
    }

    .ou-num {
        grid-template-columns: 75px minmax(0, 1fr) !important;
    }

    .ou-num b {
        font-size: 0.94rem !important;
    }
}
/**/

/* =========================================
   OU HISTORY — DARK KT STYLE
   ========================================= */

.ou-hist {
    position: relative !important;
    overflow: hidden !important;

    max-width: 900px !important;
    margin: 28px auto 0 !important;

    padding: 0 !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 18px !important;

    background:
        linear-gradient(
            145deg,
            #20291b 0%,
            #182116 55%,
            #151d13 100%
        ) !important;

    box-shadow:
        0 14px 40px rgba(15, 25, 8, 0.20),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;

    color: #dce6d5 !important;
}


/* =========================================
   DECORATIVE GLOW
   ========================================= */

.ou-hist::before {
    content: "" !important;

    position: absolute !important;

    width: 260px !important;
    height: 260px !important;

    right: -100px !important;
    top: -150px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.13) 0%,
            rgba(183, 255, 53, 0.045) 40%,
            rgba(183, 255, 53, 0) 72%
        ) !important;

    pointer-events: none !important;
}


/* =========================================
   SECOND DECORATION
   ========================================= */

.ou-hist::after {
    content: "" !important;

    position: absolute !important;

    width: 100px !important;
    height: 100px !important;

    left: -55px !important;
    bottom: -55px !important;

    border: 1px solid rgba(152, 219, 28, 0.10) !important;

    border-radius: 50% !important;

    pointer-events: none !important;
}


/* =========================================
   HISTORY HEADER
   ========================================= */

.ou-hist-h {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 20px !important;

    padding: 20px 24px !important;

    border-bottom: 1px solid rgba(255,255,255,0.065) !important;

    background:
        rgba(255,255,255,0.018) !important;
}


/* TITLE */

.ou-hist-h > b {
    color: #f0f5eb !important;

    font-size: 0.92rem !important;
    line-height: 1.3 !important;

    font-weight: 800 !important;

    letter-spacing: -0.01em !important;
}


/* SMALL LABEL */

.ou-hist-h > span {
    display: inline-flex !important;
    align-items: center !important;

    padding: 6px 10px !important;

    border: 1px solid rgba(152, 219, 28, 0.15) !important;
    border-radius: 999px !important;

    background: rgba(152, 219, 28, 0.055) !important;

    color: #91a485 !important;

    font-size: 0.68rem !important;
    line-height: 1 !important;
}


/* =========================================
   HISTORY ROW
   ========================================= */

.ou-hist-r {
    position: relative !important;
    z-index: 2 !important;

    display: grid !important;
    grid-template-columns: 135px minmax(0, 1fr) !important;

    gap: 25px !important;

    padding: 21px 24px !important;

    border-bottom: 1px solid rgba(255,255,255,0.055) !important;

    transition:
        background 0.22s ease,
        padding-left 0.22s ease !important;
}


/* REMOVE LAST BORDER */

.ou-hist-r:last-child {
    border-bottom: 0 !important;
}


/* =========================================
   ROW HOVER
   ========================================= */

.ou-hist-r:hover {
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.045),
            rgba(152, 219, 28, 0.012)
        ) !important;

    padding-left: 28px !important;
}


/* =========================================
   DATE
   ========================================= */

.ou-hist-d {
    position: relative !important;

    display: inline-flex !important;
    align-items: flex-start !important;

    padding-top: 2px !important;

    color: #8fa284 !important;

    font-size: 0.72rem !important;
    line-height: 1.5 !important;

    font-weight: 650 !important;
}


/* DATE DOT */

.ou-hist-d::before {
    content: "" !important;

    width: 7px !important;
    height: 7px !important;

    min-width: 7px !important;

    margin: 5px 9px 0 0 !important;

    border-radius: 50% !important;

    background: #72ad16 !important;

    box-shadow:
        0 0 0 4px rgba(114, 173, 22, 0.09) !important;
}


/* =========================================
   TEXT AREA
   ========================================= */

.ou-hist-t {
    display: flex !important;
    flex-direction: column !important;

    min-width: 0 !important;

    gap: 5px !important;
}


/* VERSION TITLE */

.ou-hist-t > b {
    color: #eaf2e4 !important;

    font-size: 0.84rem !important;
    line-height: 1.45 !important;

    font-weight: 750 !important;

    transition: color 0.2s ease !important;
}


.ou-hist-r:hover .ou-hist-t > b {
    color: #b7ff35 !important;
}


/* DESCRIPTION */

.ou-hist-t > span {
    color: #84937c !important;

    font-size: 0.75rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   LEAD TEXT ABOVE HISTORY
   ========================================= */

.ou-lead {
    max-width: 680px !important;

    margin: 9px auto 0 !important;

    color: #7a8871 !important;

    font-size: 0.88rem !important;
    line-height: 1.6 !important;

    text-align: center !important;
}


/* =========================================
   SECTION TITLE
   ========================================= */

.wrap-n > h2 {
    color: #27361e !important;

    font-family: inherit !important;

    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;

    text-align: center !important;

    margin-bottom: 0 !important;
}


/* =========================================
   SUBTLE TOP ACCENT
   ========================================= */

.ou-hist-h::before {
    content: "" !important;

    position: absolute !important;

    left: 24px !important;
    top: 0 !important;

    width: 45px !important;
    height: 2px !important;

    border-radius: 0 0 5px 5px !important;

    background:
        linear-gradient(
            90deg,
            #72ad16,
            #b7ff35
        ) !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 700px) {

    .ou-hist {
        margin-top: 24px !important;

        border-radius: 16px !important;
    }

    .ou-hist-r {
        grid-template-columns: 115px minmax(0, 1fr) !important;

        gap: 18px !important;

        padding: 19px 20px !important;
    }

    .ou-hist-r:hover {
        padding-left: 23px !important;
    }

    .ou-hist-h {
        padding: 18px 20px !important;
    }

    .ou-hist-h::before {
        left: 20px !important;
    }

    .ou-hist-d {
        font-size: 0.69rem !important;
    }

    .ou-hist-t > b {
        font-size: 0.81rem !important;
    }

    .ou-hist-t > span {
        font-size: 0.73rem !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 560px) {

    .ou-hist {
        margin-top: 21px !important;

        border-radius: 14px !important;
    }

    .ou-hist-h {
        align-items: flex-start !important;
        flex-direction: column !important;

        gap: 9px !important;

        padding: 17px 17px !important;
    }

    .ou-hist-h > b {
        font-size: 0.86rem !important;
    }

    .ou-hist-h > span {
        font-size: 0.64rem !important;
    }

    .ou-hist-h::before {
        left: 17px !important;
    }


    .ou-hist-r {
        display: flex !important;
        flex-direction: column !important;

        gap: 7px !important;

        padding: 17px !important;
    }

    .ou-hist-r:hover {
        padding-left: 20px !important;
    }


    .ou-hist-d {
        padding-top: 0 !important;

        font-size: 0.67rem !important;

        color: #91a485 !important;
    }

    .ou-hist-d::before {
        width: 6px !important;
        height: 6px !important;

        min-width: 6px !important;

        margin-top: 5px !important;
        margin-right: 8px !important;
    }


    .ou-hist-t {
        gap: 4px !important;
    }

    .ou-hist-t > b {
        font-size: 0.79rem !important;
        line-height: 1.42 !important;
    }

    .ou-hist-t > span {
        font-size: 0.72rem !important;
        line-height: 1.55 !important;
    }


    .ou-lead {
        padding: 0 8px !important;

        font-size: 0.81rem !important;
        line-height: 1.55 !important;
    }

    .wrap-n > h2 {
        font-size: 1.4rem !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .ou-hist-h {
        padding: 15px !important;
    }

    .ou-hist-r {
        padding: 15px !important;
    }

    .ou-hist-r:hover {
        padding-left: 18px !important;
    }

    .ou-hist-h::before {
        left: 15px !important;
    }

    .ou-hist-t > b {
        font-size: 0.76rem !important;
    }

    .ou-hist-t > span {
        font-size: 0.69rem !important;
    }
}
/**/

/* =========================================
   OU ASK — LIGHT KT STYLE
   ========================================= */

.ou-ask {
    position: relative !important;
    overflow: hidden !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;

    gap: 40px !important;

    padding: 34px 40px !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 18px !important;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f8fbf5 55%,
            #f1f8e9 100%
        ) !important;

    box-shadow:
        0 10px 32px rgba(48, 90, 8, 0.06),
        0 2px 8px rgba(48, 90, 8, 0.025) !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease !important;
}


/* =========================================
   DECORATIVE GLOW
   ========================================= */

.ou-ask::before {
    content: "" !important;

    position: absolute !important;

    width: 260px !important;
    height: 260px !important;

    right: -110px !important;
    top: -135px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.20) 0%,
            rgba(183, 255, 53, 0.08) 42%,
            rgba(183, 255, 53, 0) 72%
        ) !important;

    pointer-events: none !important;
}


/* =========================================
   SECOND DECORATIVE CIRCLE
   ========================================= */

.ou-ask::after {
    content: "" !important;

    position: absolute !important;

    width: 105px !important;
    height: 105px !important;

    left: -55px !important;
    bottom: -60px !important;

    border: 1px solid rgba(152, 219, 28, 0.14) !important;

    border-radius: 50% !important;

    pointer-events: none !important;
}


/* =========================================
   TEXT AREA
   ========================================= */

.ou-ask > div:first-child {
    position: relative !important;
    z-index: 2 !important;

    min-width: 0 !important;
}


.ou-ask h2 {
    position: relative !important;

    margin: 0 0 10px !important;

    color: #27361e !important;

    font-family: inherit !important;

    font-size: clamp(1.45rem, 2.4vw, 1.9rem) !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;
}


/* SMALL GREEN ACCENT */

.ou-ask h2::after {
    content: "" !important;

    display: block !important;

    width: 40px !important;
    height: 3px !important;

    margin-top: 12px !important;

    border-radius: 10px !important;

    background:
        linear-gradient(
            90deg,
            #72ad16,
            #b7ff35
        ) !important;
}


.ou-ask p {
    max-width: 700px !important;

    margin: 0 !important;

    color: #6f7c69 !important;

    font-size: 0.86rem !important;
    line-height: 1.65 !important;
}


/* =========================================
   BUTTON AREA
   ========================================= */

.ou-ask-go {
    position: relative !important;
    z-index: 3 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 135px !important;
}


/* =========================================
   BUTTON
   ========================================= */

.ou-ask-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 48px !important;

    padding: 0 25px !important;

    border: 0 !important;
    border-radius: 10px !important;

    background: #72ad16 !important;
    color: #ffffff !important;

    font-family: inherit !important;

    font-size: 0.84rem !important;
    font-weight: 750 !important;

    line-height: 1 !important;

    text-decoration: none !important;

    box-shadow:
        0 7px 18px rgba(83, 133, 13, 0.18) !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease !important;
}


.ou-ask-go .btn:hover {
    transform: translateY(-2px) !important;

    background: #60960f !important;

    color: #ffffff !important;

    box-shadow:
        0 11px 25px rgba(83, 133, 13, 0.25) !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 750px) {

    .ou-ask {
        grid-template-columns: minmax(0, 1fr) auto !important;

        gap: 25px !important;

        padding: 30px 30px !important;
    }

    .ou-ask-go {
        min-width: 120px !important;
    }

    .ou-ask-go .btn {
        padding: 0 21px !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .ou-ask {
        grid-template-columns: 1fr !important;

        gap: 22px !important;

        padding: 27px 23px !important;

        border-radius: 16px !important;
    }


    .ou-ask h2 {
        font-size: 1.38rem !important;
    }


    .ou-ask p {
        font-size: 0.79rem !important;

        line-height: 1.6 !important;
    }


    .ou-ask-go {
        width: 100% !important;

        justify-content: flex-start !important;
    }


    .ou-ask-go .btn {
        width: 100% !important;

        min-height: 46px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .ou-ask {
        padding: 23px 18px !important;

        border-radius: 14px !important;
    }

    .ou-ask h2 {
        font-size: 1.28rem !important;
    }

    .ou-ask p {
        font-size: 0.75rem !important;
    }

    .ou-ask::before {
        width: 210px !important;
        height: 210px !important;

        right: -100px !important;
        top: -105px !important;
    }
}
/**/

/* =========================================
   OU DOCS — LIGHT DOCUMENT CARDS
   ========================================= */

.ou-docs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    gap: 16px !important;

    margin-top: 28px !important;
}


/* =========================================
   DOCUMENT CARD
   ========================================= */

.ou-doc-i {
    position: relative !important;
    overflow: hidden !important;

    display: flex !important;
    flex-direction: column !important;

    min-width: 0 !important;

    min-height: 205px !important;

    padding: 25px 23px 23px !important;

    border: 1px solid rgba(152, 219, 28, 0.20) !important;
    border-radius: 17px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 60%,
            #f4f9ef 100%
        ) !important;

    color: #27361e !important;

    text-decoration: none !important;

    box-shadow:
        0 6px 20px rgba(48, 90, 8, 0.045) !important;

    transition:
        transform 0.28s ease,
        border-color 0.28s ease,
        box-shadow 0.28s ease,
        background 0.28s ease !important;
}


/* =========================================
   TOP GREEN LINE
   ========================================= */

.ou-doc-i::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 22px !important;

    width: 42px !important;
    height: 3px !important;

    border-radius: 0 0 6px 6px !important;

    background:
        linear-gradient(
            90deg,
            #72ad16,
            #b7ff35
        ) !important;

    transition:
        width 0.28s ease !important;
}


/* =========================================
   DECORATIVE CIRCLE
   ========================================= */

.ou-doc-i::after {
    content: "" !important;

    position: absolute !important;

    width: 125px !important;
    height: 125px !important;

    right: -60px !important;
    bottom: -65px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.12),
            rgba(183, 255, 53, 0)
        ) !important;

    pointer-events: none !important;

    transition:
        transform 0.35s ease,
        opacity 0.35s ease !important;
}


/* =========================================
   HOVER
   ========================================= */

.ou-doc-i:hover {
    transform: translateY(-5px) !important;

    border-color: rgba(114, 173, 22, 0.38) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f9fcf5 50%,
            #eef7e6 100%
        ) !important;

    box-shadow:
        0 14px 32px rgba(48, 90, 8, 0.085),
        0 3px 8px rgba(48, 90, 8, 0.035) !important;
}

.ou-doc-i:hover::before {
    width: 72px !important;
}

.ou-doc-i:hover::after {
    transform: scale(1.25) !important;
}


/* =========================================
   ICON
   ========================================= */

.ou-doc-ic {
    position: relative !important;
    z-index: 2 !important;

    width: 46px !important;
    height: 46px !important;

    min-width: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 22px !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 12px !important;

    background:
        rgba(183, 255, 53, 0.12) !important;

    color: #4e850b !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.7) !important;

    transition:
        transform 0.28s ease,
        background 0.28s ease,
        color 0.28s ease,
        border-color 0.28s ease !important;
}


.ou-doc-ic svg {
    width: 21px !important;
    height: 21px !important;
}


.ou-doc-i:hover .ou-doc-ic {
    transform: translateY(-2px) rotate(-2deg) !important;

    background: rgba(152, 219, 28, 0.19) !important;

    border-color: rgba(114, 173, 22, 0.30) !important;

    color: #3f7207 !important;
}


/* =========================================
   TITLE
   ========================================= */

.ou-doc-i > b {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin-bottom: 7px !important;

    padding-right: 28px !important;

    color: #27361e !important;

    font-size: 0.91rem !important;
    line-height: 1.4 !important;

    font-weight: 800 !important;

    letter-spacing: -0.01em !important;

    transition:
        color 0.22s ease !important;
}


.ou-doc-i:hover > b {
    color: #4e850b !important;
}


/* =========================================
   DESCRIPTION
   ========================================= */

.ou-doc-i > span:last-child {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    max-width: 290px !important;

    color: #71806b !important;

    font-size: 0.77rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   ARROW
   ========================================= */

.ou-doc-i > b::after {
    content: "→" !important;

    position: absolute !important;

    right: 0 !important;
    top: 50% !important;

    color: #72ad16 !important;

    font-size: 1rem !important;
    font-weight: 500 !important;

    opacity: 0.35 !important;

    transform:
        translateY(-50%)
        translateX(-4px) !important;

    transition:
        opacity 0.25s ease,
        transform 0.25s ease !important;
}


.ou-doc-i:hover > b::after {
    opacity: 1 !important;

    transform:
        translateY(-50%)
        translateX(2px) !important;
}


/* =========================================
   SECTION HEADING
   ========================================= */

.wrap-w > h2 {
    color: #7bb118;

    font-family: inherit !important;

    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;

    text-align: center !important;

    margin-bottom: 0 !important;
}


/* =========================================
   LEAD
   ========================================= */

.wrap-w > .ou-lead {
    max-width: 600px !important;

    margin: 9px auto 0 !important;

    color: #7a8871 !important;

    font-size: 0.86rem !important;
    line-height: 1.6 !important;

    text-align: center !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 850px) {

    .ou-docs {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    .ou-doc-i {
        min-height: auto !important;

        display: grid !important;
        grid-template-columns: 46px minmax(0, 1fr) !important;
        column-gap: 17px !important;

        padding: 21px !important;
    }

    .ou-doc-ic {
        grid-row: span 2 !important;

        margin-bottom: 0 !important;
    }

    .ou-doc-i > b {
        align-self: end !important;

        margin-bottom: 3px !important;
    }

    .ou-doc-i > span:last-child {
        align-self: start !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .ou-docs {
        gap: 10px !important;

        margin-top: 22px !important;
    }

    .ou-doc-i {
        grid-template-columns: 40px minmax(0, 1fr) !important;

        column-gap: 13px !important;

        padding: 18px !important;

        border-radius: 14px !important;
    }

    .ou-doc-ic {
        width: 40px !important;
        height: 40px !important;

        min-width: 40px !important;

        border-radius: 10px !important;
    }

    .ou-doc-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .ou-doc-i > b {
        font-size: 0.84rem !important;

        padding-right: 23px !important;
    }

    .ou-doc-i > span:last-child {
        font-size: 0.73rem !important;

        line-height: 1.55 !important;
    }

    .ou-doc-i::before {
        left: 18px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .ou-doc-i {
        grid-template-columns: 36px minmax(0, 1fr) !important;

        column-gap: 11px !important;

        padding: 16px !important;
    }

    .ou-doc-ic {
        width: 36px !important;
        height: 36px !important;

        min-width: 36px !important;
    }

    .ou-doc-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    .ou-doc-i > b {
        font-size: 0.81rem !important;
    }

    .ou-doc-i > span:last-child {
        font-size: 0.70rem !important;
    }

    .ou-doc-i::before {
        left: 16px !important;
    }
}
/**/
/* =========================================
   PV NOTS — KT LIGHT / NUMBERED CARDS
   ========================================= */

.pv-head {
    max-width: 720px !important;
    margin: 0 auto 30px !important;
    text-align: center !important;
}

.pv-head h2 {
    margin: 0 0 9px !important;

    color: #27361e !important;

    font-family: inherit !important;
    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
}

.pv-head p {
    margin: 0 !important;

    color: #7a8871 !important;

    font-size: 0.9rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   GRID
   ========================================= */

.pv-nots {
    display: grid !important;

    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 16px !important;

    max-width: 980px !important;

    margin: 0 auto !important;
}


/* =========================================
   CARD
   ========================================= */

.pv-not {
    position: relative !important;
    overflow: hidden !important;

    display: grid !important;

    grid-template-columns: 46px minmax(0, 1fr) !important;
    column-gap: 16px !important;

    min-width: 0 !important;

    padding: 23px 24px !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 15px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 100%
        ) !important;

    box-shadow:
        0 5px 18px rgba(48, 90, 8, 0.045) !important;

    color: #65715f !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease !important;
}


/* =========================================
   HOVER
   ========================================= */

.pv-not:hover {
    transform: translateY(-3px) !important;

    border-color: rgba(114, 173, 22, 0.38) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f8fcef 100%
        ) !important;

    box-shadow:
        0 11px 28px rgba(48, 90, 8, 0.075) !important;
}


/* =========================================
   DECORATIVE GLOW
   ========================================= */

.pv-not::before {
    content: "" !important;

    position: absolute !important;

    width: 150px !important;
    height: 150px !important;

    top: -85px !important;
    right: -75px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.15) 0%,
            rgba(183, 255, 53, 0.05) 45%,
            transparent 72%
        ) !important;

    pointer-events: none !important;

    opacity: 0.65 !important;

    transition:
        transform 0.3s ease,
        opacity 0.3s ease !important;
}

.pv-not:hover::before {
    transform: scale(1.2) !important;

    opacity: 1 !important;
}


/* =========================================
   NUMBER
   ========================================= */

.pv-not-ic {
    position: relative !important;
    z-index: 2 !important;

    width: 46px !important;
    height: 46px !important;

    min-width: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    grid-row: span 2 !important;

    margin: 0 !important;

    border-radius: 12px !important;

    background:
        rgba(152, 219, 28, 0.11) !important;

    border: 1px solid rgba(152, 219, 28, 0.16) !important;

    color: #4e850b !important;

    font-family: inherit !important;
    font-size: 0 !important;
    font-weight: 800 !important;

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.45) !important;

    transition:
        background 0.25s ease,
        border-color 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease !important;
}


/* Hide original SVG */

.pv-not-ic svg {
    display: none !important;
}


/* Generate numbers */

.pv-not:nth-child(1) .pv-not-ic::before {
    content: "01" !important;
}

.pv-not:nth-child(2) .pv-not-ic::before {
    content: "02" !important;
}

.pv-not:nth-child(3) .pv-not-ic::before {
    content: "03" !important;
}

.pv-not:nth-child(4) .pv-not-ic::before {
    content: "04" !important;
}

.pv-not-ic::before {
    display: block !important;

    font-size: 0.78rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;

    letter-spacing: 0.03em !important;
}


/* Number hover */

.pv-not:hover .pv-not-ic {
    transform: translateY(-2px) !important;

    background:
        rgba(152, 219, 28, 0.18) !important;

    border-color:
        rgba(114, 173, 22, 0.28) !important;

    color: #3f7207 !important;
}


/* =========================================
   TITLE
   ========================================= */

.pv-not > b {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin: 1px 0 6px !important;

    color: #27361e !important;

    font-size: 0.94rem !important;
    line-height: 1.4 !important;

    font-weight: 750 !important;

    transition: color 0.2s ease !important;
}

.pv-not:hover > b {
    color: #4e850b !important;
}


/* =========================================
   DESCRIPTION
   ========================================= */

.pv-not > span:last-child {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    color: #6f7c69 !important;

    font-size: 0.79rem !important;
    line-height: 1.62 !important;
}


/* =========================================
   TOP ACCENT
   ========================================= */

.pv-not::after {
    content: "" !important;

    position: absolute !important;

    left: 24px !important;
    right: 24px !important;
    top: 0 !important;

    height: 2px !important;

    border-radius: 0 0 5px 5px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(114, 173, 22, 0.48),
            transparent
        ) !important;

    opacity: 0 !important;

    transition: opacity 0.25s ease !important;
}

.pv-not:hover::after {
    opacity: 1 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 750px) {

    .pv-nots {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    .pv-not {
        padding: 20px 21px !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .pv-head {
        margin-bottom: 22px !important;

        padding: 0 5px !important;
    }

    .pv-head h2 {
        font-size: 1.4rem !important;
    }

    .pv-head p {
        font-size: 0.82rem !important;

        line-height: 1.55 !important;
    }

    .pv-nots {
        gap: 10px !important;
    }

    .pv-not {
        grid-template-columns: 40px minmax(0, 1fr) !important;

        column-gap: 13px !important;

        padding: 18px !important;

        border-radius: 13px !important;
    }

    .pv-not-ic {
        width: 40px !important;
        height: 40px !important;

        min-width: 40px !important;

        border-radius: 10px !important;
    }

    .pv-not-ic::before {
        font-size: 0.72rem !important;
    }

    .pv-not > b {
        font-size: 0.87rem !important;

        line-height: 1.4 !important;
    }

    .pv-not > span:last-child {
        font-size: 0.76rem !important;

        line-height: 1.58 !important;
    }

    .pv-not::after {
        left: 18px !important;
        right: 18px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .pv-not {
        grid-template-columns: 36px minmax(0, 1fr) !important;

        column-gap: 10px !important;

        padding: 16px !important;
    }

    .pv-not-ic {
        width: 36px !important;
        height: 36px !important;

        min-width: 36px !important;
    }

    .pv-not-ic::before {
        font-size: 0.68rem !important;
    }

    .pv-not > b {
        font-size: 0.84rem !important;
    }

    .pv-not > span:last-child {
        font-size: 0.73rem !important;
    }

    .pv-not::after {
        left: 16px !important;
        right: 16px !important;
    }
}
/**/

/* ==========================================================================
   PV DATA — PREMIUM СВЕТЪЛ ДИЗАЙН
   Вдъхновен от SL PROBS стила
   ========================================================================== */

/* ==========================================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================================== */

section.sec:has(.pv-data) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.pv-data)::before {
    content: "" !important;

    position: absolute !important;

    width: 700px !important;
    height: 700px !important;

    left: 50% !important;
    top: -180px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.075) 0%,
            rgba(152,219,28,.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-data) .wrap-w {
    position: relative !important;
    z-index: 1 !important;

    max-width: 1120px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-data) .pv-head {
    max-width: 760px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}

section.sec:has(.pv-data) .pv-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}

section.sec:has(.pv-data) .pv-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.pv-data) .pv-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.25) !important;
}


/* ==========================================================================
   TABLE WRAPPER
   ========================================================================== */

section.sec:has(.pv-data) .pv-data {
    position: relative !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 20px !important;

    overflow: hidden !important;

    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;
}

/* Зелена линия отгоре */
section.sec:has(.pv-data) .pv-data::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c
        ) !important;

    opacity: .8 !important;

    z-index: 3 !important;
}


/* ==========================================================================
   TABLE
   ========================================================================== */

section.sec:has(.pv-data) table {
    width: 100% !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    background: #ffffff !important;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.pv-data) thead {
    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.055),
            rgba(255,255,255,0)
        ) !important;
}

section.sec:has(.pv-data) th {
    padding: 20px 19px !important;

    border-bottom: 1px solid #e5e7eb !important;

    color: #374151 !important;

    font-size: 11px !important;
    line-height: 1.3 !important;

    font-weight: 800 !important;

    letter-spacing: .055em !important;

    text-align: left !important;

    text-transform: uppercase !important;
}

section.sec:has(.pv-data) th:first-child {
    padding-left: 24px !important;
}

section.sec:has(.pv-data) th:last-child {
    padding-right: 24px !important;
}


/* ==========================================================================
   TABLE ROWS
   ========================================================================== */

section.sec:has(.pv-data) tbody tr {
    position: relative !important;

    transition:
        background .25s ease !important;
}

section.sec:has(.pv-data) tbody tr:hover {
    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,.045),
            rgba(152,219,28,.012)
        ) !important;
}


/* Хоризонтални линии */
section.sec:has(.pv-data) tbody td {
    padding: 20px 19px !important;

    border-bottom: 1px solid #edf0f2 !important;

    color: #596273 !important;

    font-size: 13px !important;

    line-height: 1.6 !important;

    vertical-align: middle !important;
}

section.sec:has(.pv-data) tbody tr:last-child td {
    border-bottom: 0 !important;
}

section.sec:has(.pv-data) tbody td:first-child {
    padding-left: 24px !important;
}

section.sec:has(.pv-data) tbody td:last-child {
    padding-right: 24px !important;
}


/* ==========================================================================
   FIRST COLUMN
   ========================================================================== */

section.sec:has(.pv-data) tbody td:first-child {
    min-width: 190px !important;
}

section.sec:has(.pv-data) tbody td:first-child b {
    display: block !important;

    margin-bottom: 3px !important;

    color: #172000 !important;

    font-size: 13px !important;

    font-weight: 750 !important;
}

section.sec:has(.pv-data) tbody td:first-child span {
    display: block !important;

    color: #9aa3ad !important;

    font-size: 11px !important;

    line-height: 1.45 !important;
}


/* ==========================================================================
   SECOND COLUMN
   ========================================================================== */

section.sec:has(.pv-data) tbody td:nth-child(2) {
    color: #596273 !important;
}


/* ==========================================================================
   BASIS BADGES
   ========================================================================== */

section.sec:has(.pv-data) .pv-basis {
    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    min-height: 28px !important;

    padding: 5px 10px !important;

    border-radius: 8px !important;

    font-size: 10px !important;

    line-height: 1 !important;

    font-weight: 800 !important;

    letter-spacing: .02em !important;

    white-space: nowrap !important;
}


/* Договор */
section.sec:has(.pv-data) .pv-basis.c {
    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.25) !important;

    color: #5f9008 !important;
}


/* Закон */
section.sec:has(.pv-data) .pv-basis.l {
    background: rgba(59,130,246,.08) !important;

    border: 1px solid rgba(59,130,246,.17) !important;

    color: #2563a8 !important;
}


/* Интерес */
section.sec:has(.pv-data) .pv-basis.i {
    background: rgba(245,158,11,.09) !important;

    border: 1px solid rgba(245,158,11,.18) !important;

    color: #b45309 !important;
}


/* Съгласие */
section.sec:has(.pv-data) .pv-basis.s {
    background: rgba(139,92,246,.08) !important;

    border: 1px solid rgba(139,92,246,.17) !important;

    color: #7048b5 !important;
}


/* ==========================================================================
   RETENTION / KEEP
   ========================================================================== */

section.sec:has(.pv-data) .pv-keep {
    display: block !important;

    margin-bottom: 3px !important;

    color: #26351a !important;

    font-size: 13px !important;

    font-weight: 800 !important;

    line-height: 1.3 !important;
}

section.sec:has(.pv-data) tbody td:last-child > span:not(.pv-keep) {
    display: block !important;

    color: #9aa3ad !important;

    font-size: 10px !important;

    line-height: 1.4 !important;
}


/* ==========================================================================
   LEGEND
   ========================================================================== */

section.sec:has(.pv-data) .pv-legend {
    display: flex !important;

    flex-wrap: wrap !important;
    align-items: center !important;

    gap: 9px 20px !important;

    margin-top: 18px !important;

    padding: 0 4px !important;

    color: #7b8491 !important;

    font-size: 11px !important;

    line-height: 1.5 !important;
}

section.sec:has(.pv-data) .pv-legend > span {
    display: inline-flex !important;

    align-items: center !important;

    gap: 6px !important;
}

section.sec:has(.pv-data) .pv-legend .pv-basis {
    min-height: 23px !important;

    padding: 4px 8px !important;

    border-radius: 7px !important;

    font-size: 9px !important;
}


/* ==========================================================================
   ЛЕК HOVER АКЦЕНТ НА РЕДА
   ========================================================================== */

section.sec:has(.pv-data) tbody tr::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;

    width: 2px !important;

    background: #7cbf00 !important;

    opacity: 0 !important;

    transition: opacity .25s ease !important;
}

section.sec:has(.pv-data) tbody tr:hover::after {
    opacity: .8 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.pv-data) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-data) .pv-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.pv-data) th,
    section.sec:has(.pv-data) tbody td {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    section.sec:has(.pv-data) th:first-child,
    section.sec:has(.pv-data) tbody td:first-child {
        padding-left: 18px !important;
    }

    section.sec:has(.pv-data) th:last-child,
    section.sec:has(.pv-data) tbody td:last-child {
        padding-right: 18px !important;
    }

    section.sec:has(.pv-data) tbody td {
        font-size: 12px !important;
    }
}


/* ==========================================================================
   MOBILE — ТАБЛИЦАТА СТАВА НА КАРТИ
   ========================================================================== */

@media (max-width: 700px) {

    section.sec:has(.pv-data) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-data) .pv-head h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-data) .pv-head p {
        font-size: 14px !important;
    }

    section.sec:has(.pv-data) .pv-data {
        border: 0 !important;

        background: transparent !important;

        box-shadow: none !important;

        overflow: visible !important;
    }

    section.sec:has(.pv-data) .pv-data::before {
        display: none !important;
    }

    section.sec:has(.pv-data) table,
    section.sec:has(.pv-data) thead,
    section.sec:has(.pv-data) tbody,
    section.sec:has(.pv-data) tr,
    section.sec:has(.pv-data) th,
    section.sec:has(.pv-data) td {
        display: block !important;
    }

    /* Скриваме оригиналния header */
    section.sec:has(.pv-data) thead {
        display: none !important;
    }

    section.sec:has(.pv-data) tbody {
        display: grid !important;

        gap: 14px !important;
    }

    /* Всяка таблица = отделна карта */
    section.sec:has(.pv-data) tbody tr {
        position: relative !important;

        padding: 20px 18px !important;

        background: #ffffff !important;

        border: 1px solid #e5e7eb !important;

        border-radius: 17px !important;

        overflow: hidden !important;

        box-shadow:
            0 7px 22px rgba(15,23,42,.045),
            0 1px 3px rgba(15,23,42,.025) !important;

        transition:
            transform .25s ease,
            border-color .25s ease,
            box-shadow .25s ease !important;
    }

    section.sec:has(.pv-data) tbody tr::before {
        content: "" !important;

        position: absolute !important;

        left: 0 !important;
        top: 0 !important;

        width: 100% !important;
        height: 3px !important;

        background:
            linear-gradient(
                90deg,
                #7cbf00,
                #c3f36c
            ) !important;

        opacity: .75 !important;
    }

    section.sec:has(.pv-data) tbody tr:hover {
        transform: translateY(-3px) !important;

        border-color: rgba(105,201,14,.4) !important;

        box-shadow:
            0 15px 32px rgba(15,23,42,.07),
            0 4px 14px rgba(152,219,28,.055) !important;
    }

    /* Премахваме старите граници */
    section.sec:has(.pv-data) tbody td {
        position: relative !important;

        width: 100% !important;

        min-width: 0 !important;

        padding: 0 !important;

        border: 0 !important;

        font-size: 13px !important;
    }

    section.sec:has(.pv-data) tbody td:not(:last-child) {
        margin-bottom: 15px !important;

        padding-bottom: 15px !important;

        border-bottom: 1px solid #edf0f2 !important;
    }

    /* Първи ред — основна информация */
    section.sec:has(.pv-data) tbody td:first-child {
        padding-left: 0 !important;
    }

    section.sec:has(.pv-data) tbody td:first-child b {
        margin-bottom: 4px !important;

        font-size: 14px !important;

        color: #172000 !important;
    }

    section.sec:has(.pv-data) tbody td:first-child span {
        font-size: 11px !important;
    }

    /* Етикети пред останалите полета */
    section.sec:has(.pv-data) tbody td:nth-child(2)::before {
        content: "За какво" !important;
    }

    section.sec:has(.pv-data) tbody td:nth-child(3)::before {
        content: "Основание" !important;
    }

    section.sec:has(.pv-data) tbody td:nth-child(4)::before {
        content: "Колко дълго" !important;
    }

    section.sec:has(.pv-data) tbody td:nth-child(2)::before,
    section.sec:has(.pv-data) tbody td:nth-child(3)::before,
    section.sec:has(.pv-data) tbody td:nth-child(4)::before {
        display: block !important;

        margin-bottom: 6px !important;

        color: #9aa3ad !important;

        font-size: 9px !important;

        font-weight: 800 !important;

        letter-spacing: .07em !important;

        text-transform: uppercase !important;
    }

    /* Второ поле */
    section.sec:has(.pv-data) tbody td:nth-child(2) {
        color: #596273 !important;

        line-height: 1.6 !important;
    }

    /* Последно поле */
    section.sec:has(.pv-data) tbody td:last-child {
        margin-bottom: 0 !important;

        padding-bottom: 0 !important;
    }

    /* Legend */
    section.sec:has(.pv-data) .pv-legend {
        display: grid !important;

        grid-template-columns: 1fr 1fr !important;

        gap: 8px !important;

        margin-top: 16px !important;

        padding: 0 !important;
    }

    section.sec:has(.pv-data) .pv-legend > span {
        align-items: flex-start !important;

        font-size: 10px !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 430px) {

    section.sec:has(.pv-data) {
        padding: 52px 12px !important;
    }

    section.sec:has(.pv-data) .pv-head {
        margin-bottom: 30px !important;
    }

    section.sec:has(.pv-data) .pv-head h2 {
        font-size: 27px !important;
    }

    section.sec:has(.pv-data) tbody {
        gap: 11px !important;
    }

    section.sec:has(.pv-data) tbody tr {
        padding: 18px 16px !important;

        border-radius: 15px !important;
    }

    section.sec:has(.pv-data) tbody td {
        font-size: 12px !important;
    }

    section.sec:has(.pv-data) tbody td:first-child b {
        font-size: 13px !important;
    }

    section.sec:has(.pv-data) .pv-legend {
        grid-template-columns: 1fr !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-data) tbody tr,
    section.sec:has(.pv-data) tbody tr::after {
        transition: none !important;
    }

    section.sec:has(.pv-data) tbody tr:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV WHO — ТЪМНА СЕКЦИЯ + СВЕТЛИ БОКСОВЕ
   ========================================================================== */

section.sec:has(.pv-who) {
    position: relative !important;
    background: #111827 !important;
    padding: 90px 20px !important;
    color: #ffffff !important;
    overflow: hidden !important;
}


/* ==========================================================================
   ФОНОВ СВЕТЛИНЕН АКЦЕНТ
   ========================================================================== */

section.sec:has(.pv-who)::before {
    content: "" !important;

    position: absolute !important;

    width: 700px !important;
    height: 700px !important;

    left: 50% !important;
    top: -260px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.11) 0%,
            rgba(152,219,28,.045) 35%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* Допълнителен лек светлинен ореол */

section.sec:has(.pv-who)::after {
    content: "" !important;

    position: absolute !important;

    width: 320px !important;
    height: 320px !important;

    right: -150px !important;
    bottom: -150px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.07),
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-who) .wrap-w {
    position: relative !important;

    z-index: 2 !important;

    max-width: 1050px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-who) .pv-head {
    max-width: 760px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}

section.sec:has(.pv-who) .pv-head h2 {
    margin: 0 0 14px !important;

    color: #ffffff !important;

    font-size: clamp(30px, 4vw, 42px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}

section.sec:has(.pv-who) .pv-head p {
    margin: 0 !important;

    color: #aeb8c7 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент под заглавието */

section.sec:has(.pv-who) .pv-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 14px rgba(152,219,28,.28) !important;
}


/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section.sec:has(.pv-who) .pv-who {
    display: grid !important;

    grid-template-columns: 1fr !important;

    gap: 14px !important;
}


/* ==========================================================================
   БОКС
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-i {
    position: relative !important;

    display: grid !important;

    grid-template-columns: 48px minmax(0, 1fr) auto !important;

    align-items: center !important;

    gap: 18px !important;

    padding: 21px 23px !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 17px !important;

    overflow: hidden !important;

    box-shadow:
        0 7px 25px rgba(0,0,0,.12),
        0 2px 5px rgba(0,0,0,.05) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}


/* Зелена линия отгоре */

section.sec:has(.pv-who) .pv-who-i::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c
        ) !important;

    opacity: .65 !important;
}


/* Hover */

section.sec:has(.pv-who) .pv-who-i:hover {
    transform: translateY(-4px) !important;

    border-color: rgba(152,219,28,.48) !important;

    box-shadow:
        0 17px 38px rgba(0,0,0,.18),
        0 5px 18px rgba(152,219,28,.07) !important;
}


/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-ic {
    width: 48px !important;
    height: 48px !important;

    min-width: 48px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.25) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.pv-who) .pv-who-ic svg {
    width: 22px !important;
    height: 22px !important;
}


/* Hover икона */

section.sec:has(.pv-who) .pv-who-i:hover .pv-who-ic {
    background: #7cbf00 !important;

    color: #172000 !important;

    transform: scale(1.06) !important;
}


/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-t {
    display: flex !important;

    flex-direction: column !important;

    min-width: 0 !important;
}

section.sec:has(.pv-who) .pv-who-t > b {
    display: block !important;

    margin-bottom: 5px !important;

    color: #172000 !important;

    font-size: 16px !important;

    line-height: 1.4 !important;

    font-weight: 750 !important;
}

section.sec:has(.pv-who) .pv-who-t > span {
    display: block !important;

    color: #596273 !important;

    font-size: 13.5px !important;

    line-height: 1.65 !important;
}


/* ==========================================================================
   ЛОКАЦИЯ
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-where {
    min-width: 105px !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: flex-end !important;

    gap: 3px !important;

    padding-left: 18px !important;

    border-left: 1px solid #e5e7eb !important;

    text-align: right !important;
}

section.sec:has(.pv-who) .pv-who-where > b {
    color: #4f7e08 !important;

    font-size: 12px !important;

    line-height: 1.3 !important;

    font-weight: 800 !important;

    text-transform: uppercase !important;

    letter-spacing: .04em !important;
}

section.sec:has(.pv-who) .pv-who-where > span {
    color: #8a94a3 !important;

    font-size: 11px !important;

    line-height: 1.4 !important;
}


/* ==========================================================================
   ДОЛЕН NOTE БОКС
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-note {
    position: relative !important;

    margin-top: 20px !important;

    padding: 19px 22px !important;

    border: 1px solid rgba(152,219,28,.22) !important;

    border-radius: 15px !important;

    background:
        linear-gradient(
            135deg,
            rgba(152,219,28,.09),
            rgba(255,255,255,.045)
        ) !important;

    color: #aeb8c7 !important;

    font-size: 13px !important;

    line-height: 1.65 !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035) !important;
}

section.sec:has(.pv-who) .pv-who-note::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 15px !important;
    bottom: 15px !important;

    width: 3px !important;

    border-radius: 0 4px 4px 0 !important;

    background: #7cbf00 !important;
}

section.sec:has(.pv-who) .pv-who-note > b {
    color: #d8ff9b !important;

    font-weight: 800 !important;
}


/* ==========================================================================
   РАЗЛИЧНИ АКЦЕНТИ
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-i:nth-child(2) .pv-who-ic {
    color: #2563a8 !important;

    background: rgba(59,130,246,.09) !important;

    border-color: rgba(59,130,246,.20) !important;
}

section.sec:has(.pv-who) .pv-who-i:nth-child(2):hover .pv-who-ic {
    background: #3b82f6 !important;

    color: #ffffff !important;
}


section.sec:has(.pv-who) .pv-who-i:nth-child(3) .pv-who-ic {
    color: #7c3aed !important;

    background: rgba(124,58,237,.09) !important;

    border-color: rgba(124,58,237,.20) !important;
}

section.sec:has(.pv-who) .pv-who-i:nth-child(3):hover .pv-who-ic {
    background: #7c3aed !important;

    color: #ffffff !important;
}


section.sec:has(.pv-who) .pv-who-i:nth-child(4) .pv-who-ic {
    color: #b45309 !important;

    background: rgba(245,158,11,.10) !important;

    border-color: rgba(245,158,11,.22) !important;
}

section.sec:has(.pv-who) .pv-who-i:nth-child(4):hover .pv-who-ic {
    background: #f59e0b !important;

    color: #ffffff !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-who) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-who) .pv-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.pv-who) .pv-who-i {
        padding: 20px !important;

        gap: 15px !important;
    }

    section.sec:has(.pv-who) .pv-who-where {
        min-width: 90px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-who) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-who) .pv-head {
        margin-bottom: 30px !important;
    }

    section.sec:has(.pv-who) .pv-head h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-who) .pv-head p {
        font-size: 14px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-who) .pv-who {
        gap: 12px !important;
    }

    section.sec:has(.pv-who) .pv-who-i {
        grid-template-columns: 40px minmax(0, 1fr) !important;

        align-items: start !important;

        gap: 12px !important;

        padding: 18px 16px !important;

        border-radius: 15px !important;
    }

    section.sec:has(.pv-who) .pv-who-ic {
        width: 40px !important;
        height: 40px !important;

        min-width: 40px !important;

        border-radius: 11px !important;
    }

    section.sec:has(.pv-who) .pv-who-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    section.sec:has(.pv-who) .pv-who-t > b {
        font-size: 14px !important;

        line-height: 1.45 !important;
    }

    section.sec:has(.pv-who) .pv-who-t > span {
        font-size: 12.5px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-who) .pv-who-where {
        grid-column: 2 !important;

        align-items: flex-start !important;

        min-width: 0 !important;

        margin-top: 3px !important;

        padding: 8px 0 0 !important;

        border-left: 0 !important;

        border-top: 1px solid #e5e7eb !important;

        text-align: left !important;
    }

    section.sec:has(.pv-who) .pv-who-where > b {
        font-size: 10px !important;
    }

    section.sec:has(.pv-who) .pv-who-where > span {
        font-size: 10px !important;
    }

    section.sec:has(.pv-who) .pv-who-note {
        margin-top: 15px !important;

        padding: 17px 18px !important;

        font-size: 12px !important;

        line-height: 1.6 !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 390px) {

    section.sec:has(.pv-who) {
        padding: 52px 12px !important;
    }

    section.sec:has(.pv-who) .pv-who-i {
        padding: 16px 14px !important;
    }

    section.sec:has(.pv-who) .pv-who-ic {
        width: 38px !important;
        height: 38px !important;

        min-width: 38px !important;
    }

    section.sec:has(.pv-who) .pv-who-t > b {
        font-size: 13.5px !important;
    }

    section.sec:has(.pv-who) .pv-who-t > span {
        font-size: 12px !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-who) .pv-who-i,
    section.sec:has(.pv-who) .pv-who-ic {
        transition: none !important;
    }

    section.sec:has(.pv-who) .pv-who-i:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV RIGHTS — СВЕТЪЛ PREMIUM ДИЗАЙН
   ========================================================================== */

section.sec:has(.pv-rights) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}


/* ==========================================================================
   ЛЕК ЗЕЛЕН ФОН
   ========================================================================== */

section.sec:has(.pv-rights)::before {
    content: "" !important;

    position: absolute !important;

    width: 700px !important;
    height: 700px !important;

    left: 50% !important;
    top: -260px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.075) 0%,
            rgba(152,219,28,.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-rights) .wrap-w {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1050px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-rights) .pv-head {
    max-width: 760px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}

section.sec:has(.pv-rights) .pv-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 42px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}

section.sec:has(.pv-rights) .pv-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент */

section.sec:has(.pv-rights) .pv-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.25) !important;
}


/* ==========================================================================
   GRID
   ========================================================================== */

section.sec:has(.pv-rights) .pv-rights {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;

    gap: 18px !important;
}


/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-width: 0 !important;

    padding: 24px 24px 21px !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 19px !important;

    overflow: hidden !important;

    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}


/* Зелена линия */

section.sec:has(.pv-rights) .pv-right::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c
        ) !important;

    opacity: .7 !important;
}


/* Hover */

section.sec:has(.pv-rights) .pv-right:hover {
    transform: translateY(-5px) !important;

    border-color: rgba(105,201,14,.42) !important;

    box-shadow:
        0 18px 40px rgba(15,23,42,.075),
        0 5px 18px rgba(152,219,28,.065) !important;
}


/* ==========================================================================
   HEADER НА КАРТАТА
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-h {
    display: flex !important;

    align-items: center !important;

    gap: 14px !important;

    margin-bottom: 14px !important;
}


/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-ic {
    width: 46px !important;
    height: 46px !important;

    min-width: 46px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.24) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.pv-rights) .pv-right-ic svg {
    width: 21px !important;
    height: 21px !important;
}


/* Hover icon */

section.sec:has(.pv-rights) .pv-right:hover .pv-right-ic {
    background: #7cbf00 !important;

    color: #172000 !important;

    transform: scale(1.06) !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ НА ПРАВОТО
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-h > b {
    color: #172000 !important;

    font-size: 16px !important;

    line-height: 1.4 !important;

    font-weight: 750 !important;
}


/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right > p {
    margin: 0 !important;

    color: #596273 !important;

    font-size: 13.5px !important;

    line-height: 1.7 !important;
}


/* ==========================================================================
   ДОЛНА ЧАСТ — ACTION
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-go {
    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    gap: 12px !important;

    margin-top: 21px !important;

    padding-top: 16px !important;

    border-top: 1px solid #edf0f2 !important;
}


/* ==========================================================================
   БУТОНИ
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-go .btn {
    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    min-height: 38px !important;

    padding: 0 17px !important;

    border-radius: 9px !important;

    font-family: inherit !important;

    font-size: 12px !important;

    font-weight: 750 !important;

    line-height: 1 !important;

    text-decoration: none !important;

    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease,
        box-shadow .25s ease !important;
}


/* Зелен бутон */

section.sec:has(.pv-rights) .pv-right-go .btn:not(.btn-ghost) {
    background: #72ad16 !important;

    border: 1px solid #72ad16 !important;

    color: #ffffff !important;

    box-shadow:
        0 5px 14px rgba(83,133,13,.16) !important;
}

section.sec:has(.pv-rights) .pv-right-go .btn:not(.btn-ghost):hover {
    transform: translateY(-2px) !important;

    background: #60960f !important;

    border-color: #60960f !important;

    box-shadow:
        0 8px 19px rgba(83,133,13,.22) !important;
}


/* Ghost бутон */

section.sec:has(.pv-rights) .pv-right-go .btn-ghost {
    background: #ffffff !important;

    border: 1px solid rgba(114,173,22,.28) !important;

    color: #4e850b !important;

    box-shadow:
        0 3px 10px rgba(48,90,8,.025) !important;
}

section.sec:has(.pv-rights) .pv-right-go .btn-ghost:hover {
    transform: translateY(-2px) !important;

    background: #f4f9ef !important;

    border-color: rgba(114,173,22,.45) !important;
}


/* ==========================================================================
   СРОК
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-when {
    display: inline-flex !important;

    align-items: center !important;

    min-height: 28px !important;

    padding: 0 10px !important;

    border-radius: 7px !important;

    background: #f5f8f2 !important;

    color: #6f7c69 !important;

    font-size: 10.5px !important;

    line-height: 1 !important;

    font-weight: 700 !important;

    white-space: nowrap !important;
}


/* ==========================================================================
   РАЗЛИЧНИ АКЦЕНТИ
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right:nth-child(2) .pv-right-ic,
section.sec:has(.pv-rights) .pv-right:nth-child(5) .pv-right-ic,
section.sec:has(.pv-rights) .pv-right:nth-child(6) .pv-right-ic {
    color: #2563a8 !important;

    background: rgba(59,130,246,.08) !important;

    border-color: rgba(59,130,246,.19) !important;
}

section.sec:has(.pv-rights) .pv-right:nth-child(2):hover .pv-right-ic,
section.sec:has(.pv-rights) .pv-right:nth-child(5):hover .pv-right-ic,
section.sec:has(.pv-rights) .pv-right:nth-child(6):hover .pv-right-ic {
    background: #3b82f6 !important;

    color: #ffffff !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-rights) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-rights) .pv-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.pv-rights) .pv-rights {
        gap: 14px !important;
    }

    section.sec:has(.pv-rights) .pv-right {
        padding: 21px 21px 19px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-rights) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-rights) .pv-head {
        margin-bottom: 30px !important;
    }

    section.sec:has(.pv-rights) .pv-head h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-rights) .pv-head p {
        font-size: 14px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-rights) .pv-rights {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    section.sec:has(.pv-rights) .pv-right {
        padding: 19px 17px 17px !important;

        border-radius: 16px !important;
    }

    section.sec:has(.pv-rights) .pv-right-h {
        gap: 12px !important;

        margin-bottom: 12px !important;
    }

    section.sec:has(.pv-rights) .pv-right-ic {
        width: 41px !important;
        height: 41px !important;

        min-width: 41px !important;

        border-radius: 11px !important;
    }

    section.sec:has(.pv-rights) .pv-right-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    section.sec:has(.pv-rights) .pv-right-h > b {
        font-size: 14px !important;

        line-height: 1.4 !important;
    }

    section.sec:has(.pv-rights) .pv-right > p {
        font-size: 12.5px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-rights) .pv-right-go {
        margin-top: 17px !important;

        padding-top: 13px !important;
    }

    section.sec:has(.pv-rights) .pv-right-go .btn {
        min-height: 36px !important;

        padding: 0 14px !important;

        font-size: 11.5px !important;
    }

    section.sec:has(.pv-rights) .pv-right-when {
        font-size: 10px !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 390px) {

    section.sec:has(.pv-rights) {
        padding: 52px 12px !important;
    }

    section.sec:has(.pv-rights) .pv-right {
        padding: 17px 15px 16px !important;
    }

    section.sec:has(.pv-rights) .pv-right-h > b {
        font-size: 13.5px !important;
    }

    section.sec:has(.pv-rights) .pv-right > p {
        font-size: 12px !important;
    }

    section.sec:has(.pv-rights) .pv-right-go .btn {
        padding: 0 12px !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-rights) .pv-right,
    section.sec:has(.pv-rights) .pv-right-ic,
    section.sec:has(.pv-rights) .pv-right-go .btn {
        transition: none !important;
    }

    section.sec:has(.pv-rights) .pv-right:hover {
        transform: none !important;
    }
}
/**/


/* ==========================================================================
   PV COOK — СВЕТЪЛ PREMIUM ДИЗАЙН
   ========================================================================== */

/* ==========================================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================================== */

section.sec:has(.pv-cook) {
    position: relative !important;

    background: #ffffff !important;

    padding: 90px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}


/* Лек зелен светлинен ефект */

section.sec:has(.pv-cook)::before {
    content: "" !important;

    position: absolute !important;

    width: 650px !important;
    height: 650px !important;

    left: 50% !important;
    top: -100px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.075) 0%,
            rgba(152,219,28,.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-cook) .wrap-w {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1050px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook {
    position: relative !important;

    padding: 42px !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 22px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 55%,
            #f7fbf3 100%
        ) !important;

    box-shadow:
        0 10px 35px rgba(15,23,42,.045),
        0 2px 8px rgba(15,23,42,.025) !important;

    overflow: hidden !important;

    transition:
        border-color .3s ease,
        box-shadow .3s ease !important;
}


/* Горна зелена линия */

section.sec:has(.pv-cook) .pv-cook::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c,
            #7cbf00
        ) !important;

    opacity: .8 !important;
}


/* Декоративен кръг */

section.sec:has(.pv-cook) .pv-cook::after {
    content: "" !important;

    position: absolute !important;

    width: 260px !important;
    height: 260px !important;

    right: -130px !important;
    top: -150px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.11),
            rgba(152,219,28,0) 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-cook) h2 {
    position: relative !important;

    margin: 0 0 12px !important;

    color: #172000 !important;

    font-size: clamp(28px, 4vw, 40px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec:has(.pv-cook) h2::after {
    content: "" !important;

    display: block !important;

    width: 43px !important;
    height: 3px !important;

    margin-top: 18px !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.25) !important;
}


/* Intro */

section.sec:has(.pv-cook) > .wrap-w > .pv-cook > p {
    max-width: 720px !important;

    margin: 0 0 30px !important;

    color: #697386 !important;

    font-size: 15px !important;

    line-height: 1.7 !important;
}


/* ==========================================================================
   COOKIE КАРТИ
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-l {
    position: relative !important;

    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 15px !important;

    margin-top: 28px !important;
}


/* ==========================================================================
   SINGLE CARD
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-i {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-width: 0 !important;

    min-height: 175px !important;

    padding: 22px 21px 21px !important;

    border: 1px solid #e3e7df !important;

    border-radius: 16px !important;

    background: #ffffff !important;

    box-shadow:
        0 6px 20px rgba(15,23,42,.035),
        0 1px 3px rgba(15,23,42,.025) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;

    overflow: hidden !important;
}


/* Горна линия на картата */

section.sec:has(.pv-cook) .pv-cook-i::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,.15),
            rgba(152,219,28,.65),
            rgba(152,219,28,.15)
        ) !important;

    opacity: .65 !important;
}


/* Hover */

section.sec:has(.pv-cook) .pv-cook-i:hover {
    transform: translateY(-5px) !important;

    border-color:
        rgba(105,201,14,.38) !important;

    background:
        linear-gradient(
            180deg,
            #ffffff,
            #fbfdf8
        ) !important;

    box-shadow:
        0 16px 35px rgba(15,23,42,.07),
        0 5px 18px rgba(152,219,28,.065) !important;
}


/* ==========================================================================
   TAG
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-tag {
    display: inline-flex !important;

    align-items: center !important;

    align-self: flex-start !important;

    min-height: 25px !important;

    padding: 4px 9px !important;

    margin-bottom: 16px !important;

    border-radius: 7px !important;

    font-size: 10px !important;

    line-height: 1 !important;

    font-weight: 800 !important;

    letter-spacing: .035em !important;

    text-transform: uppercase !important;
}


/* Задължителни */

section.sec:has(.pv-cook) .pv-cook-tag.need {
    background: rgba(152,219,28,.13) !important;

    border: 1px solid rgba(152,219,28,.24) !important;

    color: #527e08 !important;
}


/* По избор */

section.sec:has(.pv-cook) .pv-cook-tag.opt {
    background: rgba(59,130,246,.07) !important;

    border: 1px solid rgba(59,130,246,.15) !important;

    color: #37699e !important;
}


/* ==========================================================================
   CARD TITLE
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-i > b {
    display: block !important;

    margin-bottom: 8px !important;

    color: #172000 !important;

    font-size: 15px !important;

    line-height: 1.4 !important;

    font-weight: 750 !important;

    transition: color .25s ease !important;
}


section.sec:has(.pv-cook) .pv-cook-i:hover > b {
    color: #4f7908 !important;
}


/* ==========================================================================
   CARD TEXT
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-i > span:last-child {
    display: block !important;

    margin-top: auto !important;

    color: #687284 !important;

    font-size: 12.5px !important;

    line-height: 1.65 !important;
}


/* ==========================================================================
   BOTTOM CTA
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-go {
    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    gap: 20px !important;

    margin-top: 25px !important;

    padding-top: 23px !important;

    border-top: 1px solid #e8ece5 !important;
}


/* ==========================================================================
   BUTTON
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-go .btn {
    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    min-height: 45px !important;

    padding: 0 21px !important;

    border: 0 !important;

    border-radius: 10px !important;

    background: #72ad16 !important;

    color: #ffffff !important;

    font-family: inherit !important;

    font-size: 13px !important;

    font-weight: 750 !important;

    text-decoration: none !important;

    box-shadow:
        0 7px 18px rgba(83,133,13,.16) !important;

    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease !important;
}


section.sec:has(.pv-cook) .pv-cook-go .btn:hover {
    transform: translateY(-2px) !important;

    background: #60960f !important;

    box-shadow:
        0 11px 24px rgba(83,133,13,.22) !important;
}


/* ==========================================================================
   INFO TEXT
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-say {
    color: #7a8492 !important;

    font-size: 11.5px !important;

    line-height: 1.55 !important;

    text-align: right !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 850px) {

    section.sec:has(.pv-cook) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-cook) .pv-cook {
        padding: 34px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-l {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i {
        min-height: 0 !important;

        padding: 20px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-go {
        align-items: flex-start !important;

        flex-direction: column !important;
    }

    section.sec:has(.pv-cook) .pv-cook-say {
        text-align: left !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-cook) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-cook) .pv-cook {
        padding: 27px 18px !important;

        border-radius: 17px !important;
    }

    section.sec:has(.pv-cook) h2 {
        font-size: 28px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-cook) > .wrap-w > .pv-cook > p {
        font-size: 13px !important;

        line-height: 1.65 !important;

        margin-bottom: 23px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-l {
        gap: 10px !important;

        margin-top: 21px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i {
        padding: 18px !important;

        border-radius: 14px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-tag {
        margin-bottom: 13px !important;

        font-size: 9px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i > b {
        font-size: 14px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i > span:last-child {
        font-size: 12px !important;

        line-height: 1.6 !important;
    }

    section.sec:has(.pv-cook) .pv-cook-go {
        gap: 13px !important;

        margin-top: 21px !important;

        padding-top: 20px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-go .btn {
        width: 100% !important;

        min-height: 44px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-say {
        font-size: 10.5px !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-cook) .pv-cook-i,
    section.sec:has(.pv-cook) .pv-cook-go .btn {
        transition: none !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i:hover,
    section.sec:has(.pv-cook) .pv-cook-go .btn:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV LEAK — СВЕТЪЛ PREMIUM ДИЗАЙН
   ========================================================================== */

/* ==========================================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================================== */

section.sec:has(.pv-leak) {
    position: relative !important;

    background: #ffffff !important;

    padding: 90px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}


/* Лек зелен фон */

section.sec:has(.pv-leak)::before {
    content: "" !important;

    position: absolute !important;

    width: 680px !important;
    height: 680px !important;

    left: 50% !important;
    top: -120px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.075) 0%,
            rgba(152,219,28,.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-leak) .wrap-n {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1050px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.pv-leak) .pv-head {
    max-width: 760px !important;

    margin: 0 auto 46px !important;

    text-align: center !important;
}


section.sec:has(.pv-leak) .pv-head h2 {
    margin: 0 0 13px !important;

    color: #111827 !important;

    font-size: clamp(29px, 4vw, 42px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec:has(.pv-leak) .pv-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 15px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент под заглавието */

section.sec:has(.pv-leak) .pv-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 22px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.25) !important;
}


/* ==========================================================================
   MAIN CARD
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak {
    position: relative !important;

    padding: 0 !important;

    border: 1px solid #e3e7df !important;

    border-radius: 21px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 100%
        ) !important;

    box-shadow:
        0 10px 35px rgba(15,23,42,.045),
        0 2px 8px rgba(15,23,42,.025) !important;

    overflow: hidden !important;
}


/* Горна зелена линия */

section.sec:has(.pv-leak) .pv-leak::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c,
            #7cbf00
        ) !important;

    opacity: .8 !important;
}


/* ==========================================================================
   CARD HEADER
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-h {
    display: flex !important;

    align-items: center !important;

    gap: 15px !important;

    padding: 25px 28px !important;

    border-bottom: 1px solid #e8ece5 !important;

    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.055),
            rgba(255,255,255,0)
        ) !important;
}


/* ==========================================================================
   ICON
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-ic {
    width: 45px !important;
    height: 45px !important;

    min-width: 45px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background: rgba(245,158,11,.09) !important;

    border: 1px solid rgba(245,158,11,.20) !important;

    color: #b45309 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}


section.sec:has(.pv-leak) .pv-leak-ic svg {
    width: 22px !important;
    height: 22px !important;
}


section.sec:has(.pv-leak) .pv-leak:hover .pv-leak-ic {
    background: #f59e0b !important;

    color: #ffffff !important;

    transform: scale(1.05) !important;
}


/* Заглавие */

section.sec:has(.pv-leak) .pv-leak-h > b {
    color: #172000 !important;

    font-size: 17px !important;

    line-height: 1.4 !important;

    font-weight: 750 !important;
}


/* ==========================================================================
   LIST
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-l {
    display: grid !important;

    grid-template-columns: 1fr !important;

    padding: 8px 28px 13px !important;
}


/* ==========================================================================
   SINGLE ROW
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-r {
    display: grid !important;

    grid-template-columns: 105px minmax(0, 1fr) !important;

    align-items: start !important;

    gap: 20px !important;

    padding: 21px 0 !important;

    border-bottom: 1px solid #edf0ec !important;

    transition:
        background .25s ease,
        padding-left .25s ease !important;
}


section.sec:has(.pv-leak) .pv-leak-r:last-child {
    border-bottom: 0 !important;
}


/* ==========================================================================
   HOVER ROW
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-r:hover {
    padding-left: 8px !important;
}


/* ==========================================================================
   TIME BADGE
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-t {
    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    width: fit-content !important;

    min-width: 82px !important;

    min-height: 29px !important;

    padding: 5px 10px !important;

    border-radius: 8px !important;

    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.22) !important;

    color: #527e08 !important;

    font-size: 11px !important;

    line-height: 1 !important;

    font-weight: 800 !important;

    white-space: nowrap !important;

    text-transform: uppercase !important;

    letter-spacing: .025em !important;
}


/* Първият срок е най-важен */

section.sec:has(.pv-leak) .pv-leak-r:first-child .pv-leak-t {
    background: rgba(245,158,11,.10) !important;

    border-color: rgba(245,158,11,.22) !important;

    color: #a65a0a !important;
}


/* ==========================================================================
   TEXT
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-x {
    display: block !important;

    color: #596273 !important;

    font-size: 13.5px !important;

    line-height: 1.7 !important;
}


section.sec:has(.pv-leak) .pv-leak-x b {
    color: #26351a !important;

    font-weight: 750 !important;
}


/* ==========================================================================
   ЛЕК АКЦЕНТ НА ВСЕКИ РЕД
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-r::before {
    content: "" !important;

    position: absolute !important;
}


section.sec:has(.pv-leak) .pv-leak-r {
    position: relative !important;
}


/* Малка зелена точка */

section.sec:has(.pv-leak) .pv-leak-r::after {
    content: "" !important;

    position: absolute !important;

    left: -28px !important;

    top: 31px !important;

    width: 5px !important;
    height: 5px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 0 3px rgba(152,219,28,.10) !important;

    opacity: .8 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-leak) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-leak) .pv-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-h {
        padding: 22px 23px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-l {
        padding-left: 23px !important;
        padding-right: 23px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r {
        grid-template-columns: 90px minmax(0, 1fr) !important;

        gap: 16px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r::after {
        left: -23px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-leak) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-leak) .pv-head {
        margin-bottom: 32px !important;
    }

    section.sec:has(.pv-leak) .pv-head h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-leak) .pv-head p {
        font-size: 14px !important;
    }

    section.sec:has(.pv-leak) .pv-leak {
        border-radius: 17px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-h {
        align-items: flex-start !important;

        gap: 12px !important;

        padding: 19px 17px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-ic {
        width: 40px !important;
        height: 40px !important;

        min-width: 40px !important;

        border-radius: 11px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-h > b {
        padding-top: 3px !important;

        font-size: 14px !important;

        line-height: 1.45 !important;
    }

    section.sec:has(.pv-leak) .pv-leak-l {
        padding: 5px 17px 9px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r {
        grid-template-columns: 1fr !important;

        gap: 9px !important;

        padding: 17px 0 !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r:hover {
        padding-left: 0 !important;
    }

    section.sec:has(.pv-leak) .pv-leak-t {
        min-height: 27px !important;

        font-size: 10px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-x {
        font-size: 12.5px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r::after {
        display: none !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 400px) {

    section.sec:has(.pv-leak) {
        padding: 52px 12px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-h {
        padding: 18px 15px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-l {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-x {
        font-size: 12px !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-leak) .pv-leak-ic,
    section.sec:has(.pv-leak) .pv-leak-r {
        transition: none !important;
    }

    section.sec:has(.pv-leak) .pv-leak:hover .pv-leak-ic {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV ASK — DARK PREMIUM / 2 КАРТИ
   ========================================================================== */

section.sec:has(.pv-ask) {
    position: relative !important;
    background:
        radial-gradient(
            circle at 20% 20%,
            rgba(152,219,28,.09),
            transparent 34%
        ),
        radial-gradient(
            circle at 85% 80%,
            rgba(152,219,28,.055),
            transparent 32%
        ),
        #101713 !important;

    padding: 90px 20px !important;
    overflow: hidden !important;
}

/* Финален зелен отблясък */
section.sec:has(.pv-ask)::before {
    content: "" !important;
    position: absolute !important;
    width: 500px !important;
    height: 500px !important;
    left: -180px !important;
    top: -220px !important;
    border-radius: 50% !important;
    background: rgba(152,219,28,.055) !important;
    filter: blur(20px) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.pv-ask) .wrap-w {
    position: relative !important;
    z-index: 2 !important;
    max-width: 1050px !important;
}

/* ==========================================================================
   ОСНОВНА СТРУКТУРА — САМО 2 КАРТИ
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask {
    position: relative !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;

    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ==========================================================================
   ДВАТА ОСНОВНИ БОКСА
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask-c {
    position: relative !important;

    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,.9) !important;
    border-radius: 22px !important;

    padding: 32px !important;

    box-shadow:
        0 20px 55px rgba(0,0,0,.22),
        0 3px 12px rgba(0,0,0,.08) !important;

    overflow: hidden !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease !important;
}

/* Зелената линия */
section.sec:has(.pv-ask) .pv-ask-c::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 4px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #c4f36b
    ) !important;
}

/* Лек вътрешен зелен glow */
section.sec:has(.pv-ask) .pv-ask-c::after {
    content: "" !important;

    position: absolute !important;
    width: 180px !important;
    height: 180px !important;

    right: -90px !important;
    top: -90px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.055) !important;

    pointer-events: none !important;
}

/* Hover */
section.sec:has(.pv-ask) .pv-ask-c:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(152,219,28,.45) !important;

    box-shadow:
        0 28px 65px rgba(0,0,0,.28),
        0 8px 22px rgba(152,219,28,.08) !important;
}

/* ==========================================================================
   ЗАГЛАВИЯ
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask-c h3 {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 0 12px !important;

    color: #172000 !important;

    font-size: clamp(21px, 2vw, 25px) !important;
    line-height: 1.25 !important;

    font-weight: 800 !important;
    letter-spacing: -.4px !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask-c > p {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 0 24px !important;

    color: #596273 !important;

    font-size: 14px !important;
    line-height: 1.75 !important;
}

section.sec:has(.pv-ask) .pv-ask-c > p b {
    color: #26351a !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ВЪТРЕШНИЯТ pv-ask-box ВЕЧЕ НЕ Е БОКС
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask-box {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 !important;
    padding: 18px 0 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid #e7ebdf !important;
    border-radius: 0 !important;

    color: #596273 !important;

    font-size: 14px !important;
    line-height: 1.75 !important;

    box-shadow: none !important;
}

/* Име на организацията */
section.sec:has(.pv-ask) .pv-ask-box b {
    display: block !important;

    margin-bottom: 4px !important;

    color: #172000 !important;

    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Линкове */
section.sec:has(.pv-ask) .pv-ask-box a {
    display: inline-block !important;

    margin-top: 5px !important;

    color: #5f9008 !important;

    font-weight: 750 !important;
    text-decoration: none !important;

    transition: color .2s ease !important;
}

section.sec:has(.pv-ask) .pv-ask-box a:hover {
    color: #3f6500 !important;
    text-decoration: underline !important;
}

/* ==========================================================================
   РАЗЛИЧЕН АКЦЕНТ ЗА ДВАТА КАРТА
   ========================================================================== */

/* Първа — контакт */
section.sec:has(.pv-ask) .pv-ask-c:first-child::before {
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c8f56e
    ) !important;
}

/* Втора — жалба */
section.sec:has(.pv-ask) .pv-ask-c:last-child::before {
    background: linear-gradient(
        90deg,
        #6fb91a,
        #7cbf00
    ) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-ask) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-ask) .pv-ask {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c {
        padding: 27px !important;
        border-radius: 18px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-ask) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-ask) .pv-ask {
        gap: 15px !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c {
        padding: 23px 20px !important;
        border-radius: 16px !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c h3 {
        font-size: 20px !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c > p,
    section.sec:has(.pv-ask) .pv-ask-box {
        font-size: 13px !important;
        line-height: 1.7 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-ask) .pv-ask-c {
        transition: none !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV CARE — LIGHT PREMIUM
   ========================================================================== */

section.sec:has(.pv-care) {
    position: relative !important;
    background: #ffffff !important;
    padding: 75px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.pv-care)::before {
    content: "" !important;

    position: absolute !important;
    width: 500px !important;
    height: 500px !important;

    left: 50% !important;
    top: 50% !important;

    transform: translate(-50%, -50%) !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.035) 38%,
        transparent 72%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-care) .wrap-n {
    position: relative !important;
    z-index: 2 !important;

    max-width: 900px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.pv-care) .pv-care {
    position: relative !important;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbfdf8 100%
        ) !important;

    border: 1px solid #e2e8df !important;
    border-radius: 22px !important;

    padding: 32px 36px !important;

    box-shadow:
        0 14px 40px rgba(15,23,42,.055),
        0 2px 8px rgba(15,23,42,.025) !important;

    overflow: hidden !important;

    transition:
        border-color .3s ease,
        box-shadow .3s ease,
        transform .3s ease !important;
}

/* Зелена вертикална линия */
section.sec:has(.pv-care) .pv-care::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;

    width: 4px !important;

    background: linear-gradient(
        180deg,
        #7cbf00,
        #c4f36b
    ) !important;
}

/* Деликатен glow вътре */
section.sec:has(.pv-care) .pv-care::after {
    content: "" !important;

    position: absolute !important;

    width: 240px !important;
    height: 240px !important;

    right: -130px !important;
    top: -130px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.055) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.pv-care) .pv-care-h {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    align-items: center !important;

    gap: 14px !important;

    margin-bottom: 22px !important;
}

/* Икона */
section.sec:has(.pv-care) .pv-care-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background: rgba(152,219,28,.12) !important;

    border: 1px solid rgba(152,219,28,.25) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.pv-care) .pv-care-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Заглавие */
section.sec:has(.pv-care) .pv-care-h > b {
    color: #172000 !important;

    font-size: 20px !important;
    line-height: 1.3 !important;

    font-weight: 800 !important;
    letter-spacing: -.3px !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.pv-care) .pv-care > p {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 !important;
    padding: 17px 0 !important;

    color: #596273 !important;

    font-size: 14px !important;
    line-height: 1.75 !important;

    border-top: 1px solid #edf0eb !important;
}

/* Първият параграф */
section.sec:has(.pv-care) .pv-care > p:first-of-type {
    padding-top: 0 !important;
    border-top: 0 !important;
}

/* Bold */
section.sec:has(.pv-care) .pv-care > p b {
    color: #26351a !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.pv-care) .pv-care:hover {
    transform: translateY(-3px) !important;

    border-color: rgba(152,219,28,.4) !important;

    box-shadow:
        0 20px 48px rgba(15,23,42,.08),
        0 5px 18px rgba(152,219,28,.07) !important;
}

section.sec:has(.pv-care) .pv-care:hover .pv-care-ic {
    background: #7cbf00 !important;
    color: #172000 !important;

    transform: scale(1.05) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-care) {
        padding: 65px 18px !important;
    }

    section.sec:has(.pv-care) .pv-care {
        padding: 28px 30px !important;
        border-radius: 18px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-care) {
        padding: 55px 14px !important;
    }

    section.sec:has(.pv-care) .pv-care {
        padding: 24px 20px 24px 22px !important;
        border-radius: 16px !important;
    }

    section.sec:has(.pv-care) .pv-care-h {
        gap: 11px !important;
        margin-bottom: 18px !important;
    }

    section.sec:has(.pv-care) .pv-care-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.pv-care) .pv-care-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    section.sec:has(.pv-care) .pv-care-h > b {
        font-size: 17px !important;
    }

    section.sec:has(.pv-care) .pv-care > p {
        font-size: 13px !important;
        line-height: 1.7 !important;
        padding: 15px 0 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-care) .pv-care,
    section.sec:has(.pv-care) .pv-care-ic {
        transition: none !important;
    }

    section.sec:has(.pv-care) .pv-care:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV DOCS — LIGHT PREMIUM DOCUMENT NAVIGATION
   ========================================================================== */

section.sec:has(.pv-docs) {
    position: relative !important;

    background: #ffffff !important;

    padding: 85px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}

/* Лек зелен фон */
section.sec:has(.pv-docs)::before {
    content: "" !important;

    position: absolute !important;

    width: 620px !important;
    height: 620px !important;

    left: 50% !important;
    top: 50% !important;

    transform: translate(-50%, -50%) !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 40%,
        transparent 72%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   CONTAINER
   ========================================================================== */

section.sec:has(.pv-docs) .wrap-w {
    position: relative !important;

    z-index: 2 !important;

    max-width: 1100px !important;

    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-docs) .wrap-w > h2 {
    margin: 0 0 9px !important;

    color: #111827 !important;

    font-size: clamp(29px, 4vw, 40px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}

/* Подзаглавие */
section.sec:has(.pv-docs) .pv-lead {
    margin: 0 0 38px !important;

    color: #6b7280 !important;

    font-size: 15px !important;

    line-height: 1.65 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.pv-docs) .pv-lead::after {
    content: "" !important;

    display: block !important;

    width: 42px !important;
    height: 3px !important;

    margin-top: 18px !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.22) !important;
}

/* ==========================================================================
   DOCUMENT GRID
   ========================================================================== */

section.sec:has(.pv-docs) .pv-docs {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 18px !important;
}

/* ==========================================================================
   DOCUMENT CARD
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-height: 225px !important;

    padding: 26px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf8 100%
        ) !important;

    border: 1px solid #e3e8df !important;

    border-radius: 20px !important;

    color: #111827 !important;

    text-decoration: none !important;

    overflow: hidden !important;

    box-shadow:
        0 8px 28px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}

/* Горна зелена линия */
section.sec:has(.pv-docs) .pv-doc-i::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #c5f36e
    ) !important;

    opacity: .75 !important;
}

/* Светъл зелен glow */
section.sec:has(.pv-docs) .pv-doc-i::after {
    content: "" !important;

    position: absolute !important;

    width: 170px !important;
    height: 170px !important;

    right: -95px !important;
    top: -95px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.055) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ICON
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-ic {
    position: relative !important;

    z-index: 2 !important;

    width: 48px !important;
    height: 48px !important;

    min-width: 48px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 22px !important;

    border-radius: 14px !important;

    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.24) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease,
        border-color .3s ease !important;
}

section.sec:has(.pv-docs) .pv-doc-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* ==========================================================================
   TITLE
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i > b {
    position: relative !important;

    z-index: 2 !important;

    display: block !important;

    margin-bottom: 8px !important;

    color: #172000 !important;

    font-size: 17px !important;

    line-height: 1.35 !important;

    font-weight: 800 !important;
}

/* ==========================================================================
   DESCRIPTION
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i > span:last-child {
    position: relative !important;

    z-index: 2 !important;

    display: block !important;

    color: #697386 !important;

    font-size: 13px !important;

    line-height: 1.65 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(152,219,28,.48) !important;

    background: #ffffff !important;

    box-shadow:
        0 18px 42px rgba(15,23,42,.085),
        0 6px 18px rgba(152,219,28,.07) !important;
}

section.sec:has(.pv-docs) .pv-doc-i:hover .pv-doc-ic {
    background: #7cbf00 !important;

    border-color: #7cbf00 !important;

    color: #172000 !important;

    transform: translateY(-2px) scale(1.04) !important;
}

/* ==========================================================================
   ACTIVE / FOCUS
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i:focus-visible {
    outline: 3px solid rgba(152,219,28,.35) !important;

    outline-offset: 4px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 850px) {

    section.sec:has(.pv-docs) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-docs) .pv-docs {
        grid-template-columns: 1fr 1fr !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i:last-child {
        grid-column: 1 / -1 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-docs) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-docs) .wrap-w > h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-docs) .pv-lead {
        font-size: 14px !important;

        margin-bottom: 30px !important;
    }

    section.sec:has(.pv-docs) .pv-docs {
        grid-template-columns: 1fr !important;

        gap: 14px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i:last-child {
        grid-column: auto !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i {
        min-height: auto !important;

        padding: 22px !important;

        border-radius: 16px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-ic {
        width: 43px !important;
        height: 43px !important;

        min-width: 43px !important;

        margin-bottom: 18px !important;

        border-radius: 12px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i > b {
        font-size: 16px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i > span:last-child {
        font-size: 13px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-docs) .pv-doc-i,
    section.sec:has(.pv-docs) .pv-doc-ic {
        transition: none !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "КАК МЕРИМ"
   ========================================================================== */

section.sec:has(.sl-how) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.sl-how)::before {
    content: "" !important;
    position: absolute !important;
    width: 650px !important;
    height: 650px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.sl-how) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-how) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-how) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-how) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.sl-how) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.sl-how) .sl-how {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 6px rgba(15,23,42,.025) !important;
}

/* Горна зелена линия */
section.sec:has(.sl-how) .sl-how::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-h {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 25px 28px !important;
    background: linear-gradient(
        180deg,
        rgba(152,219,28,.055),
        rgba(255,255,255,0)
    ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* Икона */
section.sec:has(.sl-how) .sl-how-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.12) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #5f9008 !important;
}

section.sec:has(.sl-how) .sl-how-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Заглавие */
section.sec:has(.sl-how) .sl-how-h > b {
    color: #172000 !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-l {
    padding: 8px 28px 18px !important;
}

/* ==========================================================================
   СТЪПКА
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-r {
    display: grid !important;
    grid-template-columns: 48px 1fr !important;
    gap: 18px !important;
    position: relative !important;
    padding: 24px 0 !important;
    border-bottom: 1px solid #edf0f2 !important;
}

section.sec:has(.sl-how) .sl-how-r:last-child {
    border-bottom: 0 !important;
}

/* ==========================================================================
   НОМЕР
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-n {
    width: 42px !important;
    height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: #f4f9ed !important;
    border: 1px solid rgba(152,219,28,.28) !important;
    color: #5f9008 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-t {
    min-width: 0 !important;
}

section.sec:has(.sl-how) .sl-how-t > b {
    display: block !important;
    margin: 2px 0 7px !important;
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section.sec:has(.sl-how) .sl-how-t p {
    margin: 0 !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   CODE
   ========================================================================== */

section.sec:has(.sl-how) code {
    display: inline-block !important;
    padding: 2px 7px !important;
    border-radius: 6px !important;
    background: #f3f7ed !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #527d08 !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;
    font-size: .88em !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   ТОЧКИ ЗА МОНИТОРИНГ
   ========================================================================== */

section.sec:has(.sl-how) .sl-spots {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 14px !important;
}

section.sec:has(.sl-how) .sl-spot {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 7px 11px !important;
    background: #f8faf7 !important;
    border: 1px solid #e4e9df !important;
    border-radius: 999px !important;
    color: #4b5563 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 650 !important;
}

section.sec:has(.sl-how) .sl-spot i {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 0 3px rgba(152,219,28,.12) !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-r {
    transition: background .25s ease !important;
}

section.sec:has(.sl-how) .sl-how-r:hover {
    background: linear-gradient(
        90deg,
        rgba(152,219,28,.025),
        transparent
    ) !important;
}

section.sec:has(.sl-how) .sl-how-r:hover .sl-how-n {
    background: #7cbf00 !important;
    color: #172000 !important;
    border-color: #7cbf00 !important;
    box-shadow: 0 5px 15px rgba(152,219,28,.20) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-how) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-how) .sl-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.sl-how) .sl-how-h {
        padding: 22px !important;
    }

    section.sec:has(.sl-how) .sl-how-l {
        padding: 6px 22px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-how) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-how) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-how) .sl-head p {
        font-size: 14px !important;
    }

    section.sec:has(.sl-how) .sl-how {
        border-radius: 17px !important;
    }

    section.sec:has(.sl-how) .sl-how-h {
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-how) .sl-how-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.sl-how) .sl-how-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.sl-how) .sl-how-h > b {
        font-size: 14px !important;
    }

    section.sec:has(.sl-how) .sl-how-l {
        padding: 4px 17px 8px !important;
    }

    section.sec:has(.sl-how) .sl-how-r {
        grid-template-columns: 40px 1fr !important;
        gap: 13px !important;
        padding: 19px 0 !important;
    }

    section.sec:has(.sl-how) .sl-how-n {
        width: 36px !important;
        height: 36px !important;
        border-radius: 10px !important;
        font-size: 13px !important;
    }

    section.sec:has(.sl-how) .sl-how-t > b {
        font-size: 14px !important;
        margin-top: 1px !important;
    }

    section.sec:has(.sl-how) .sl-how-t p {
        font-size: 13px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-how) .sl-spots {
        gap: 6px !important;
        margin-top: 12px !important;
    }

    section.sec:has(.sl-how) .sl-spot {
        padding: 6px 9px !important;
        font-size: 11px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-how) .sl-how-r,
    section.sec:has(.sl-how) .sl-how-n {
        transition: none !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "КОЛКО ПОЛУЧАВАШ"
   ========================================================================== */

section.sec:has(.sl-tiers) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.sl-tiers)::before {
    content: "" !important;
    position: absolute !important;
    width: 650px !important;
    height: 650px !important;
    left: 50% !important;
    top: -170px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.sl-tiers) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-tiers) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-tiers) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-tiers) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.sl-tiers) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ТАБЛИЦА
   ========================================================================== */

section.sec:has(.sl-tiers) .sl-tiers {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 6px rgba(15,23,42,.025) !important;
}

/* Зелена линия */
section.sec:has(.sl-tiers) .sl-tiers::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
    z-index: 2 !important;
}

section.sec:has(.sl-tiers) table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    table-layout: fixed !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.sl-tiers) thead th {
    padding: 20px 22px !important;
    background: #f7faf4 !important;
    color: #26351a !important;
    border-bottom: 1px solid #e3e9dd !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    font-weight: 800 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
}

section.sec:has(.sl-tiers) thead th:nth-child(n+3) {
    text-align: center !important;
}

/* ==========================================================================
   КЛЕТКИ
   ========================================================================== */

section.sec:has(.sl-tiers) tbody td {
    padding: 21px 22px !important;
    border-bottom: 1px solid #edf0f2 !important;
    background: #ffffff !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    vertical-align: middle !important;
    transition:
        background .25s ease,
        color .25s ease !important;
}

section.sec:has(.sl-tiers) tbody tr:last-child td {
    border-bottom: 0 !important;
}

section.sec:has(.sl-tiers) tbody td:nth-child(n+3) {
    text-align: center !important;
}

/* Основен процент */
section.sec:has(.sl-tiers) tbody td:first-child {
    color: #172000 !important;
}

section.sec:has(.sl-tiers) tbody td:first-child b {
    font-weight: 750 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.sl-tiers) tbody tr:hover td {
    background: #fbfdf9 !important;
}

section.sec:has(.sl-tiers) tbody tr:hover td:first-child {
    color: #527d08 !important;
}

/* ==========================================================================
   MINUTES / MONO
   ========================================================================== */

section.sec:has(.sl-tiers) .mono {
    color: #6b7280 !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;
    font-size: 12px !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   ПРОЦЕНТИ
   ========================================================================== */

section.sec:has(.sl-tiers) .sl-pct {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 58px !important;
    height: 34px !important;
    padding: 0 12px !important;
    border-radius: 9px !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    border: 1px solid transparent !important;
}

/* 10% */
section.sec:has(.sl-tiers) .sl-pct.p10 {
    color: #527d08 !important;
    background: rgba(152,219,28,.10) !important;
    border-color: rgba(152,219,28,.24) !important;
}

/* 25% */
section.sec:has(.sl-tiers) .sl-pct.p25 {
    color: #477200 !important;
    background: rgba(152,219,28,.16) !important;
    border-color: rgba(152,219,28,.32) !important;
}

/* 50% */
section.sec:has(.sl-tiers) .sl-pct.p50 {
    color: #3e6200 !important;
    background: rgba(152,219,28,.23) !important;
    border-color: rgba(152,219,28,.38) !important;
}

/* 100% */
section.sec:has(.sl-tiers) .sl-pct.p100 {
    color: #172000 !important;
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.18) !important;
}

/* ==========================================================================
   DASH
   ========================================================================== */

section.sec:has(.sl-tiers) tbody td:has(> :not(*)) {
    text-align: center !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-tiers) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-tiers) .sl-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.sl-tiers) .sl-tiers {
        border-radius: 18px !important;
        overflow-x: auto !important;
    }

    section.sec:has(.sl-tiers) table {
        min-width: 720px !important;
    }

    section.sec:has(.sl-tiers) thead th,
    section.sec:has(.sl-tiers) tbody td {
        padding: 17px 16px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-tiers) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-tiers) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-tiers) .sl-head p {
        font-size: 14px !important;
    }

    section.sec:has(.sl-tiers) .sl-tiers {
        border-radius: 16px !important;
        margin: 0 -1px !important;
    }

    section.sec:has(.sl-tiers) table {
        min-width: 650px !important;
    }

    section.sec:has(.sl-tiers) thead th {
        padding: 15px 13px !important;
        font-size: 10px !important;
    }

    section.sec:has(.sl-tiers) tbody td {
        padding: 16px 13px !important;
        font-size: 13px !important;
    }

    section.sec:has(.sl-tiers) .mono {
        font-size: 11px !important;
    }

    section.sec:has(.sl-tiers) .sl-pct {
        min-width: 52px !important;
        height: 31px !important;
        padding: 0 9px !important;
        border-radius: 8px !important;
        font-size: 12px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-tiers) tbody td {
        transition: none !important;
    }
}
/**/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "КОЛКО ПРАВИ ТОВА НА ПРАКТИКА"
   ========================================================================== */

section.sec:has(.sl-calc) {
    position: relative !important;
    background: #111827 !important;
    padding: 90px 20px !important;
    color: #f8fafc !important;
    overflow: hidden !important;
}

/* Зелен glow */
section.sec:has(.sl-calc)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -250px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(94,154,0,.16) 0%,
        rgba(152,219,28,.055) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Допълнителен мек фон */
section.sec:has(.sl-calc)::after {
    content: "" !important;
    position: absolute !important;
    width: 380px !important;
    height: 380px !important;
    right: -180px !important;
    bottom: -180px !important;
    background: rgba(152,219,28,.035) !important;
    border-radius: 50% !important;
    filter: blur(20px) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.sl-calc) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 900px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc {
    position: relative !important;
    background: #ffffff !important;
    color: #111827 !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 24px !important;
    padding: clamp(28px, 5vw, 48px) !important;
    overflow: hidden !important;
    box-shadow:
        0 25px 70px rgba(0,0,0,.28),
        0 4px 16px rgba(0,0,0,.12) !important;
}

/* Горна зелена линия */
section.sec:has(.sl-calc) .sl-calc::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 4px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc h2 {
    margin: 0 0 12px !important;
    color: #111827 !important;
    font-size: clamp(28px, 4vw, 38px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -.8px !important;
}

section.sec:has(.sl-calc) .sl-calc > p {
    max-width: 700px !important;
    margin: 0 0 30px !important;
    color: #687384 !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   КАЛКУЛАТОР
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-box {
    position: relative !important;
    background: #f7faf4 !important;
    border: 1px solid #e1e8da !important;
    border-radius: 17px !important;
    overflow: hidden !important;
}

/* ==========================================================================
   РЕДОВЕ
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-r {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 18px 21px !important;
    border-bottom: 1px solid #e4e9df !important;
}

section.sec:has(.sl-calc) .sl-calc-r span {
    color: #667085 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

section.sec:has(.sl-calc) .sl-calc-r b {
    color: #172000 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    text-align: right !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — КРЕДИТ
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-t {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 23px 21px !important;
    background: #7cbf00 !important;
    color: #172000 !important;
}

section.sec:has(.sl-calc) .sl-calc-t span {
    font-size: 13px !important;
    font-weight: 750 !important;
}

section.sec:has(.sl-calc) .sl-calc-t b {
    font-size: 22px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
}

/* ==========================================================================
   ОБЯСНЕНИЕ
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-say {
    margin-top: 24px !important;
    padding: 18px 20px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    border-left: 3px solid #7cbf00 !important;
    border-radius: 12px !important;
    color: #687384 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

section.sec:has(.sl-calc) .sl-calc-say b {
    color: #26351a !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ЛЕК HOVER
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-box {
    transition:
        box-shadow .3s ease,
        transform .3s ease !important;
}

section.sec:has(.sl-calc) .sl-calc-box:hover {
    box-shadow:
        0 12px 30px rgba(15,23,42,.07),
        0 3px 10px rgba(152,219,28,.05) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-calc) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-calc) .sl-calc {
        border-radius: 20px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-calc) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-calc) .sl-calc {
        padding: 25px 17px 22px !important;
        border-radius: 17px !important;
    }

    section.sec:has(.sl-calc) .sl-calc h2 {
        font-size: 27px !important;
        letter-spacing: -.6px !important;
    }

    section.sec:has(.sl-calc) .sl-calc > p {
        font-size: 13px !important;
        line-height: 1.65 !important;
        margin-bottom: 24px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-r {
        padding: 15px 16px !important;
        gap: 14px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-r span {
        font-size: 12px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-r b {
        font-size: 13px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-t {
        padding: 19px 16px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-t span {
        font-size: 12px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-t b {
        font-size: 20px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-say {
        margin-top: 18px !important;
        padding: 15px 16px !important;
        font-size: 12px !important;
        line-height: 1.65 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-calc) .sl-calc-box {
        transition: none !important;
    }
}
/**/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАКВО НЕ СЕ БРОИ"
   ========================================================================== */

/* Основна секция */
section.sec:has(.sl-exc) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.sl-exc)::before {
    content: "" !important;
    position: absolute !important;
    width: 680px !important;
    height: 680px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-exc) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-exc) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-exc) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-exc) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелената черта */
section.sec:has(.sl-exc) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ОСНОВЕН БОКС
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 7px rgba(15,23,42,.025) !important;
}

/* Зелена линия отгоре */
section.sec:has(.sl-exc) .sl-exc::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА БОКСА
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-h {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 25px 28px !important;
    background: linear-gradient(
        180deg,
        rgba(152,219,28,.055),
        rgba(255,255,255,0)
    ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* Икона */
section.sec:has(.sl-exc) .sl-exc-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.12) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #5f9008 !important;
}

section.sec:has(.sl-exc) .sl-exc-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Заглавие */
section.sec:has(.sl-exc) .sl-exc-h > b {
    color: #172000 !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ВЪВЕДЕНИЕ
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-lead {
    margin: 0 !important;
    padding: 22px 28px 8px !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-l {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
    padding: 18px 28px 28px !important;
}

/* ==========================================================================
   ОТДЕЛЕН ЕЛЕМЕНТ
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-i {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    padding: 20px !important;
    background: #f8faf7 !important;
    border: 1px solid #e7ece3 !important;
    border-radius: 15px !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        background .3s ease,
        box-shadow .3s ease !important;
}

/* Hover */
section.sec:has(.sl-exc) .sl-exc-i:hover {
    transform: translateY(-3px) !important;
    background: #ffffff !important;
    border-color: rgba(152,219,28,.42) !important;
    box-shadow:
        0 10px 25px rgba(15,23,42,.055),
        0 4px 12px rgba(152,219,28,.06) !important;
}

/* Зелена точка вместо тежки икони */
section.sec:has(.sl-exc) .sl-exc-i > i {
    position: relative !important;
    display: block !important;
    width: 9px !important;
    height: 9px !important;
    min-width: 9px !important;
    margin-top: 6px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 0 5px rgba(152,219,28,.12) !important;
}

/* Текст */
section.sec:has(.sl-exc) .sl-exc-i > span {
    min-width: 0 !important;
}

section.sec:has(.sl-exc) .sl-exc-i b {
    display: block !important;
    margin: 0 0 7px !important;
    color: #26351a !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section.sec:has(.sl-exc) .sl-exc-i p {
    margin: 0 !important;
    color: #687281 !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   ДОЛЕН АКЦЕНТ
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-count {
    margin: 0 28px 28px !important;
    padding: 18px 20px !important;
    background: rgba(152,219,28,.065) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    border-left: 3px solid #7cbf00 !important;
    border-radius: 12px !important;
    color: #596273 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

section.sec:has(.sl-exc) .sl-exc-count b {
    color: #26351a !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec:has(.sl-exc) {
        padding: 75px 18px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-l {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.sl-exc) .sl-exc-h {
        padding: 23px 23px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-lead {
        padding: 21px 23px 8px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-l {
        padding: 17px 23px 24px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-count {
        margin: 0 23px 23px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-exc) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-exc) .sl-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.sl-exc) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-exc) .sl-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-exc) .sl-exc {
        border-radius: 17px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-h {
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-h > b {
        font-size: 14px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-lead {
        padding: 19px 17px 5px !important;
        font-size: 13px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-l {
        gap: 11px !important;
        padding: 14px 17px 19px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-i {
        padding: 17px !important;
        border-radius: 13px !important;
        gap: 13px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-i b {
        font-size: 13px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-i p {
        font-size: 12.5px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-exc) .sl-exc-count {
        margin: 0 17px 19px !important;
        padding: 15px 16px !important;
        font-size: 12px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-exc) .sl-exc-i {
        transition: none !important;
    }

    section.sec:has(.sl-exc) .sl-exc-i:hover {
        transform: none !important;
    }
}
/**/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАК СЕ ИСКА НАМАЛЕНИЕ"
   ========================================================================== */

/* Основна секция */
section.sec:has(.sl-claim) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.sl-claim)::before {
    content: "" !important;
    position: absolute !important;
    width: 680px !important;
    height: 680px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.07) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-claim) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-claim) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section.sec:has(.sl-claim) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-claim) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.sl-claim) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ТРИТЕ СТЪПКИ
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim {
    position: relative !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 18px !important;
}

/* Линия между стъпките */
section.sec:has(.sl-claim) .sl-claim::before {
    content: "" !important;
    position: absolute !important;
    top: 31px !important;
    left: 11% !important;
    right: 11% !important;
    height: 1px !important;
    background: linear-gradient(
        90deg,
        rgba(152,219,28,.15),
        rgba(152,219,28,.65),
        rgba(152,219,28,.15)
    ) !important;
    z-index: 0 !important;
}

/* ==========================================================================
   СТЪПКА
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim-i {
    position: relative !important;
    z-index: 1 !important;
    background: #ffffff !important;
    border: 1px solid #e4e8e1 !important;
    border-radius: 20px !important;
    padding: 28px 25px 27px !important;
    box-shadow:
        0 8px 28px rgba(15,23,42,.045),
        0 2px 6px rgba(15,23,42,.025) !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Горна зелена линия */
section.sec:has(.sl-claim) .sl-claim-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 20px !important;
    right: 20px !important;
    height: 3px !important;
    border-radius: 0 0 99px 99px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
    opacity: .75 !important;
}

/* Hover */
section.sec:has(.sl-claim) .sl-claim-i:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(152,219,28,.45) !important;
    box-shadow:
        0 18px 40px rgba(15,23,42,.075),
        0 5px 18px rgba(152,219,28,.07) !important;
}

/* ==========================================================================
   НОМЕР
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim-n {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 62px !important;
    height: 62px !important;
    margin-bottom: 21px !important;
    border-radius: 17px !important;
    background: #7cbf00 !important;
    color: #172000 !important;
    font-size: 22px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    box-shadow:
        0 8px 18px rgba(152,219,28,.20),
        inset 0 1px 0 rgba(255,255,255,.35) !important;
    transition:
        transform .3s ease,
        box-shadow .3s ease !important;
}

/* Hover номер */
section.sec:has(.sl-claim) .sl-claim-i:hover .sl-claim-n {
    transform: scale(1.05) !important;
    box-shadow:
        0 11px 24px rgba(152,219,28,.27),
        inset 0 1px 0 rgba(255,255,255,.35) !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim-i > b {
    display: block !important;
    margin: 0 0 9px !important;
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 800 !important;
}

section.sec:has(.sl-claim) .sl-claim-i > p {
    margin: 0 !important;
    color: #667085 !important;
    font-size: 13.5px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   ЗАЩО НЕ Е АВТОМАТИЧНО
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim-why {
    position: relative !important;
    margin-top: 22px !important;
    padding: 22px 25px 22px 27px !important;
    background: #f7faf4 !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    border-left: 4px solid #7cbf00 !important;
    border-radius: 15px !important;
    color: #5d6875 !important;
    font-size: 13.5px !important;
    line-height: 1.75 !important;
    box-shadow:
        inset 0 1px 2px rgba(15,23,42,.02) !important;
}

/* Заглавие в долния блок */
section.sec:has(.sl-claim) .sl-claim-why > b {
    display: block !important;
    margin-bottom: 5px !important;
    color: #26351a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 850px) {

    section.sec:has(.sl-claim) {
        padding: 75px 18px !important;
    }

    section.sec:has(.sl-claim) .sl-claim {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    section.sec:has(.sl-claim) .sl-claim::before {
        display: none !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i {
        padding: 24px 23px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-n {
        width: 52px !important;
        height: 52px !important;
        margin-bottom: 17px !important;
        border-radius: 14px !important;
        font-size: 19px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-claim) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-claim) .sl-head {
        margin-bottom: 36px !important;
    }

    section.sec:has(.sl-claim) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-claim) .sl-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-claim) .sl-claim {
        gap: 12px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i {
        border-radius: 16px !important;
        padding: 20px 18px 21px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i::before {
        left: 17px !important;
        right: 17px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-n {
        width: 44px !important;
        height: 44px !important;
        margin-bottom: 15px !important;
        border-radius: 12px !important;
        font-size: 17px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i > b {
        font-size: 14px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i > p {
        font-size: 13px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-claim) .sl-claim-why {
        margin-top: 14px !important;
        padding: 17px 17px 18px 19px !important;
        border-radius: 13px !important;
        font-size: 12.5px !important;
        line-height: 1.7 !important;
    }

    section.sec:has(.sl-claim) .sl-claim-why > b {
        font-size: 13px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-claim) .sl-claim-i,
    section.sec:has(.sl-claim) .sl-claim-n {
        transition: none !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i:hover {
        transform: none !important;
    }
}
/**/
/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КОЛКО СМЕ ПЛАТИЛИ ДОСЕГА"
   ========================================================================== */

/* Основна секция */
section.sec:has(.sl-paid) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Мек зелен glow */
section.sec:has(.sl-paid)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-paid) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-paid) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-paid) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-paid) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.sl-paid) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 7px rgba(15,23,42,.025) !important;
}

/* Зелена линия отгоре */
section.sec:has(.sl-paid) .sl-paid::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c5f36c
    ) !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 25px 28px !important;
    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.055),
            rgba(255,255,255,0)
        ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

section.sec:has(.sl-paid) .sl-paid-h b {
    color: #172000 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: -.1px !important;
}

section.sec:has(.sl-paid) .sl-paid-h span {
    color: #7b8491 !important;
    font-size: 13px !important;
}

/* ==========================================================================
   РЕДОВЕ
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 85px minmax(0, 1fr) 120px !important;
    align-items: center !important;
    gap: 25px !important;
    padding: 24px 28px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #edf0f2 !important;
    transition:
        background .25s ease,
        padding-left .25s ease !important;
}

/* Последният ред няма долна граница */
section.sec:has(.sl-paid) .sl-paid-r:last-child {
    border-bottom: 0 !important;
}

/* Hover */
section.sec:has(.sl-paid) .sl-paid-r:hover {
    background: #fbfdf8 !important;
    padding-left: 32px !important;
}

/* ==========================================================================
   ГОДИНА
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-y {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: fit-content !important;
    min-width: 58px !important;
    padding: 7px 10px !important;
    border-radius: 9px !important;
    background: rgba(152,219,28,.11) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    color: #5f9008 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-t {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    min-width: 0 !important;
}

section.sec:has(.sl-paid) .sl-paid-t b {
    color: #172000 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

section.sec:has(.sl-paid) .sl-paid-t span {
    color: #697386 !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   СУМА
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-s {
    justify-self: end !important;
    color: #172000 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    letter-spacing: -.3px !important;
    white-space: nowrap !important;
}

/* Сумата за 0 € */
section.sec:has(.sl-paid) .sl-paid-s.zero {
    color: #9ca3af !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   АКЦЕНТ ПРИ HOVER НА СУМАТА
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-r:hover .sl-paid-s:not(.zero) {
    color: #5f9008 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-paid) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-paid) .sl-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-h {
        padding: 22px 23px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r {
        grid-template-columns: 70px minmax(0, 1fr) 105px !important;
        gap: 18px !important;
        padding: 22px 23px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r:hover {
        padding-left: 26px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-s {
        font-size: 16px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-paid) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-paid) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-paid) .sl-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-paid) .sl-paid {
        border-radius: 17px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-h {
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-h b {
        font-size: 13px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-h span {
        font-size: 12px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r {
        grid-template-columns: 54px minmax(0, 1fr) !important;
        gap: 13px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r:hover {
        padding-left: 19px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-y {
        min-width: 50px !important;
        padding: 7px 7px !important;
        font-size: 11px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-t b {
        font-size: 13px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-t span {
        font-size: 12px !important;
        line-height: 1.5 !important;
    }

    section.sec:has(.sl-paid) .sl-paid-s {
        grid-column: 2 !important;
        justify-self: start !important;
        margin-top: -4px !important;
        font-size: 15px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-paid) .sl-paid-r {
        transition: none !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r:hover {
        padding-left: 28px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r:hover .sl-paid-s:not(.zero) {
        color: #172000 !important;
    }
}
/**/

/* ==========================================================================
   ТЪМНА PREMIUM CTA СЕКЦИЯ — "АКО ТИ ТРЯБВА ПОВЕЧЕ"
   ========================================================================== */

section.sec:has(.sl-more) {
    position: relative !important;
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152,219,28,.10) 0%,
            rgba(152,219,28,.035) 32%,
            transparent 68%
        ),
        #101713 !important;
    padding: 85px 20px !important;
    color: #ffffff !important;
    overflow: hidden !important;
}

/* Декоративен зелен glow */
section.sec:has(.sl-more)::before {
    content: "" !important;
    position: absolute !important;
    width: 520px !important;
    height: 520px !important;
    left: 50% !important;
    top: -320px !important;
    transform: translateX(-50%) !important;
    background: rgba(152,219,28,.10) !important;
    filter: blur(90px) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-more) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН СВЕТЪЛ БОКС
   ========================================================================== */

section.sec:has(.sl-more) .sl-more {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 45px !important;
    padding: 38px 42px !important;

    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,.8) !important;
    border-radius: 22px !important;

    box-shadow:
        0 25px 70px rgba(0,0,0,.28),
        0 8px 25px rgba(0,0,0,.16) !important;

    overflow: hidden !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease !important;
}

/* Зелената линия отгоре */
section.sec:has(.sl-more) .sl-more::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 4px !important;

    background: linear-gradient(
        90deg,
        #7fbd0c,
        #7cbf00,
        #c4f36a
    ) !important;
}

/* Мек зелен фон вътре в картата */
section.sec:has(.sl-more) .sl-more::after {
    content: "" !important;
    position: absolute !important;
    width: 350px !important;
    height: 350px !important;
    right: -180px !important;
    top: -180px !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.09),
        transparent 68%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.sl-more) .sl-more > div:first-child {
    position: relative !important;
    z-index: 2 !important;
}

section.sec:has(.sl-more) .sl-more h3 {
    margin: 0 0 11px !important;

    color: #172000 !important;
    font-size: clamp(22px, 3vw, 29px) !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: -.6px !important;
}

section.sec:has(.sl-more) .sl-more p {
    max-width: 700px !important;
    margin: 0 !important;

    color: #5f6875 !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}

/* ==========================================================================
   БУТОН
   ========================================================================== */

section.sec:has(.sl-more) .sl-more-go {
    position: relative !important;
    z-index: 3 !important;
    flex-shrink: 0 !important;
}

section.sec:has(.sl-more) .sl-more-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 125px !important;
    min-height: 48px !important;
    padding: 12px 22px !important;

    background: #7cbf00 !important;
    border: 1px solid #7cbf00 !important;
    border-radius: 11px !important;

    color: #172000 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-decoration: none !important;

    box-shadow:
        0 8px 20px rgba(152,219,28,.22) !important;

    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease !important;
}

/* Hover бутон */
section.sec:has(.sl-more) .sl-more-go .btn:hover {
    background: #a9eb32 !important;
    border-color: #a9eb32 !important;
    color: #172000 !important;

    transform: translateY(-2px) !important;

    box-shadow:
        0 12px 26px rgba(152,219,28,.30) !important;
}

/* Hover карта */
section.sec:has(.sl-more) .sl-more:hover {
    transform: translateY(-3px) !important;

    box-shadow:
        0 30px 80px rgba(0,0,0,.32),
        0 10px 30px rgba(152,219,28,.06) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-more) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-more) .sl-more {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
        padding: 32px 30px !important;
        border-radius: 19px !important;
    }

    section.sec:has(.sl-more) .sl-more-go {
        justify-self: start !important;
    }

    section.sec:has(.sl-more) .sl-more-go .btn {
        min-width: 135px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-more) {
        padding: 58px 14px !important;
    }

    section.sec:has(.sl-more) .sl-more {
        gap: 22px !important;
        padding: 28px 21px 25px !important;
        border-radius: 17px !important;
    }

    section.sec:has(.sl-more) .sl-more h3 {
        font-size: 22px !important;
        letter-spacing: -.4px !important;
        line-height: 1.25 !important;
    }

    section.sec:has(.sl-more) .sl-more p {
        font-size: 13px !important;
        line-height: 1.7 !important;
    }

    section.sec:has(.sl-more) .sl-more-go {
        width: 100% !important;
    }

    section.sec:has(.sl-more) .sl-more-go .btn {
        width: 100% !important;
        min-height: 46px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-more) .sl-more,
    section.sec:has(.sl-more) .sl-more-go .btn {
        transition: none !important;
    }

    section.sec:has(.sl-more) .sl-more:hover {
        transform: none !important;
    }

    section.sec:has(.sl-more) .sl-more-go .btn:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "ДРУГИТЕ ДОКУМЕНТИ"
   ========================================================================== */

section.sec:has(.sl-docs) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Мек зелен glow */
section.sec:has(.sl-docs)::before {
    content: "" !important;
    position: absolute !important;
    width: 650px !important;
    height: 650px !important;
    left: 50% !important;
    top: -300px !important;
    transform: translateX(-50%) !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.025) 40%,
        transparent 70%
    ) !important;

    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-docs) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-docs) h2 {
    margin: 0 0 10px !important;

    color: #111827 !important;
    font-size: clamp(30px, 4vw, 40px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-docs) .sl-lead {
    margin: 0 0 42px !important;

    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Малък зелен акцент */
section.sec:has(.sl-docs) h2::after {
    content: "" !important;
    display: block !important;

    width: 42px !important;
    height: 3px !important;

    margin-top: 18px !important;
    border-radius: 99px !important;

    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.22) !important;
}

/* ==========================================================================
   ДОКУМЕНТИ
   ========================================================================== */

section.sec:has(.sl-docs) .sl-docs {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 18px !important;
}

/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    min-height: 210px !important;
    padding: 25px 24px 23px !important;

    background: #ffffff !important;
    border: 1px solid #e4e8ec !important;
    border-radius: 18px !important;

    text-decoration: none !important;
    color: inherit !important;

    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;

    overflow: hidden !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Зелената линия */
section.sec:has(.sl-docs) .sl-doc-i::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #c4f36c
    ) !important;

    opacity: .8 !important;
}

/* Лек вътрешен glow */
section.sec:has(.sl-docs) .sl-doc-i::after {
    content: "" !important;

    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    right: -100px !important;
    bottom: -100px !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.09),
        transparent 70%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-ic {
    position: relative !important;
    z-index: 1 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;

    margin-bottom: 22px !important;

    border-radius: 13px !important;

    background: rgba(152,219,28,.11) !important;
    border: 1px solid rgba(152,219,28,.23) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.sl-docs) .sl-doc-ic svg {
    width: 21px !important;
    height: 21px !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-i b {
    position: relative !important;
    z-index: 1 !important;

    display: block !important;

    margin-bottom: 8px !important;

    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 800 !important;
}

/* Описание */
section.sec:has(.sl-docs) .sl-doc-i > span:last-child {
    position: relative !important;
    z-index: 1 !important;

    color: #707987 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-i:hover {
    transform: translateY(-5px) !important;

    border-color: rgba(105,201,14,.45) !important;

    box-shadow:
        0 18px 40px rgba(15,23,42,.08),
        0 5px 18px rgba(152,219,28,.07) !important;
}

section.sec:has(.sl-docs) .sl-doc-i:hover .sl-doc-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}

/* ==========================================================================
   РАЗЛИЧЕН АКЦЕНТ ЗА ТРИТЕ
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-i:nth-child(1) .sl-doc-ic {
    color: #5f9008 !important;
}

section.sec:has(.sl-docs) .sl-doc-i:nth-child(2) .sl-doc-ic {
    background: rgba(59,130,246,.08) !important;
    border-color: rgba(59,130,246,.18) !important;
    color: #2563a8 !important;
}

section.sec:has(.sl-docs) .sl-doc-i:nth-child(2):hover .sl-doc-ic {
    background: #3b82f6 !important;
    color: #ffffff !important;
}

section.sec:has(.sl-docs) .sl-doc-i:nth-child(3) .sl-doc-ic {
    background: rgba(245,158,11,.09) !important;
    border-color: rgba(245,158,11,.20) !important;
    color: #b45309 !important;
}

section.sec:has(.sl-docs) .sl-doc-i:nth-child(3):hover .sl-doc-ic {
    background: #f59e0b !important;
    color: #ffffff !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec:has(.sl-docs) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-docs) .sl-docs {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i {
        min-height: auto !important;
        padding: 22px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-ic {
        margin-bottom: 17px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-docs) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-docs) h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-docs) .sl-lead {
        margin-bottom: 30px !important;
        font-size: 14px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i {
        padding: 20px 18px !important;
        border-radius: 16px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-ic {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 11px !important;
        margin-bottom: 15px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i b {
        font-size: 14px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i > span:last-child {
        font-size: 12.5px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-docs) .sl-doc-i,
    section.sec:has(.sl-docs) .sl-doc-ic {
        transition: none !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "КАКВО НЕ БИВА"
   ========================================================================== */

section.sec:has(.ap-stop) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.ap-stop)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.035) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.ap-stop) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.ap-stop) .ap-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.ap-stop) .ap-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-stop) .ap-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.ap-stop) .ap-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
}

/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-i {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 20px !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Зелена линия отгоре */
section.sec:has(.ap-stop) .ap-stop-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
    opacity: .7 !important;
}

/* Hover */
section.sec:has(.ap-stop) .ap-stop-i:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(105,201,14,.42) !important;
    box-shadow:
        0 18px 40px rgba(15,23,42,.08),
        0 5px 18px rgba(152,219,28,.07) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-h {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 23px 24px !important;
    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.045),
            rgba(255,255,255,0)
        ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-ic {
    width: 45px !important;
    height: 45px !important;
    min-width: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.11) !important;
    border: 1px solid rgba(152,219,28,.24) !important;
    color: #5f9008 !important;
    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.ap-stop) .ap-stop-ic svg {
    width: 21px !important;
    height: 21px !important;
}

/* Hover икона */
section.sec:has(.ap-stop) .ap-stop-i:hover .ap-stop-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ ТЕКСТ
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-h > b {
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-i > p {
    margin: 0 !important;
    padding: 21px 24px 25px !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   ЛЕКО РАЗНООБРАЗИЕ НА ИКОНИТЕ
   ========================================================================== */

/* 1 — незаконно съдържание */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(1) .ap-stop-ic {
    color: #5f9008 !important;
}

/* 2 — spam */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(2) .ap-stop-ic {
    color: #2563a8 !important;
    background: rgba(59,130,246,.08) !important;
    border-color: rgba(59,130,246,.18) !important;
}

section.sec:has(.ap-stop) .ap-stop-i:nth-child(2):hover .ap-stop-ic {
    background: #3b82f6 !important;
    color: #ffffff !important;
}

/* 3 — измами */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(3) .ap-stop-ic {
    color: #5f9008 !important;
}

/* 4 — malware */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(4) .ap-stop-ic {
    color: #b45309 !important;
    background: rgba(245,158,11,.09) !important;
    border-color: rgba(245,158,11,.20) !important;
}

section.sec:has(.ap-stop) .ap-stop-i:nth-child(4):hover .ap-stop-ic {
    background: #f59e0b !important;
    color: #ffffff !important;
}

/* 5 — авторски права */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(5) .ap-stop-ic {
    color: #5f9008 !important;
}

/* 6 — деца */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(6) .ap-stop-ic {
    color: #7c3aed !important;
    background: rgba(124,58,237,.08) !important;
    border-color: rgba(124,58,237,.18) !important;
}

section.sec:has(.ap-stop) .ap-stop-i:nth-child(6):hover .ap-stop-ic {
    background: #7c3aed !important;
    color: #ffffff !important;
}

/* 7 — атаки */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(7) .ap-stop-ic {
    color: #2563a8 !important;
    background: rgba(59,130,246,.08) !important;
    border-color: rgba(59,130,246,.18) !important;
}

section.sec:has(.ap-stop) .ap-stop-i:nth-child(7):hover .ap-stop-ic {
    background: #3b82f6 !important;
    color: #ffffff !important;
}

/* ==========================================================================
   ПОСЛЕДНАТА КАРТА — ЦЯЛ РЕД
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-i:nth-child(7) {
    grid-column: 1 / -1 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.ap-stop) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-stop) .ap-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.ap-stop) .ap-stop {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i:nth-child(7) {
        grid-column: auto !important;
    }

    section.sec:has(.ap-stop) .ap-stop-h {
        padding: 21px 22px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i > p {
        padding: 20px 22px 23px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-stop) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-stop) .ap-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-stop) .ap-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.ap-stop) .ap-stop {
        gap: 13px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i {
        border-radius: 16px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-h {
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-h > b {
        font-size: 14px !important;
        line-height: 1.45 !important;
        padding-top: 3px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i > p {
        padding: 18px 17px 21px !important;
        font-size: 13px !important;
        line-height: 1.65 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-stop) .ap-stop-i,
    section.sec:has(.ap-stop) .ap-stop-ic {
        transition: none !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM DARK DESIGN — "А ТОВА ВЛИЗА ЛИ?"
   ========================================================================== */

section.sec:has(.ap-grey) {
    position: relative !important;
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152,219,28,.08) 0,
            rgba(152,219,28,.025) 30%,
            transparent 62%
        ),
        #101612 !important;
    padding: 90px 20px !important;
    color: #ffffff !important;
    overflow: hidden !important;
}

/* Декоративен зелен glow */
section.sec:has(.ap-grey)::after {
    content: "" !important;
    position: absolute !important;
    width: 500px !important;
    height: 500px !important;
    right: -220px !important;
    bottom: -260px !important;
    background: rgba(152,219,28,.06) !important;
    filter: blur(70px) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.ap-grey) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.ap-grey) .ap-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.ap-grey) .ap-head h2 {
    margin: 0 0 14px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-grey) .ap-head p {
    margin: 0 !important;
    color: #a9b5aa !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.ap-grey) .ap-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152,219,28,.35) !important;
}

/* ==========================================================================
   MAIN PANEL
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey {
    position: relative !important;
    background: #f7f9f5 !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow:
        0 25px 70px rgba(0,0,0,.28),
        0 5px 20px rgba(0,0,0,.15) !important;
}

/* Горна зелена линия */
section.sec:has(.ap-grey) .ap-grey::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #78b90d,
        #7cbf00,
        #c5f36c
    ) !important;
}

/* ==========================================================================
   PANEL HEADER
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-h {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 25px 27px !important;
    background:
        linear-gradient(
            135deg,
            #ffffff,
            #f2f6ef
        ) !important;
    border-bottom: 1px solid #e1e7df !important;
}

/* Икона */
section.sec:has(.ap-grey) .ap-grey-ic {
    width: 45px !important;
    height: 45px !important;
    min-width: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.13) !important;
    border: 1px solid rgba(152,219,28,.28) !important;
    color: #5f9008 !important;
}

section.sec:has(.ap-grey) .ap-grey-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Заглавие */
section.sec:has(.ap-grey) .ap-grey-h > b {
    color: #172000 !important;
    font-size: 17px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   QUESTIONS LIST
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-l {
    display: flex !important;
    flex-direction: column !important;
}

/* ==========================================================================
   QUESTION ROW
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 21px 27px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e8ece7 !important;
    transition:
        background .25s ease,
        padding-left .25s ease !important;
}

section.sec:has(.ap-grey) .ap-grey-r:last-child {
    border-bottom: 0 !important;
}

/* Hover */
section.sec:has(.ap-grey) .ap-grey-r:hover {
    background: #fbfdf9 !important;
    padding-left: 31px !important;
}

/* ==========================================================================
   QUESTION MARK
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-q {
    width: 38px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 11px !important;
    background: #f1f5ed !important;
    border: 1px solid #dfe7d9 !important;
    color: #5f9008 !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease !important;
}

section.sec:has(.ap-grey) .ap-grey-r:hover .ap-grey-q {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.05) !important;
}

/* ==========================================================================
   TEXT
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-t {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
}

section.sec:has(.ap-grey) .ap-grey-t > b {
    color: #172000 !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section.sec:has(.ap-grey) .ap-grey-t > span {
    color: #667164 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

/* ==========================================================================
   STATUS BADGES
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 78px !important;
    padding: 8px 13px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

/* МОЖЕ */
section.sec:has(.ap-grey) .ap-grey-a.yes {
    color: #477000 !important;
    background: #eef8df !important;
    border: 1px solid #d5eab4 !important;
}

/* ПИТАЙ НИ */
section.sec:has(.ap-grey) .ap-grey-a.ask {
    color: #56615a !important;
    background: #f1f3f1 !important;
    border: 1px solid #dfe3df !important;
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.ap-grey) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-grey) .ap-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.ap-grey) .ap-grey {
        border-radius: 20px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-h {
        padding: 21px 22px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-r {
        grid-template-columns: 40px minmax(0, 1fr) auto !important;
        gap: 13px !important;
        padding: 19px 22px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-r:hover {
        padding-left: 22px !important;
    }
}

/* ==========================================================================
   MOBILE SMALL
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-grey) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-grey) .ap-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-grey) .ap-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.ap-grey) .ap-grey {
        border-radius: 17px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-h {
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-h > b {
        font-size: 14px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-r {
        grid-template-columns: 36px minmax(0, 1fr) !important;
        gap: 11px !important;
        padding: 17px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-r:hover {
        padding-left: 17px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-q {
        width: 36px !important;
        height: 36px !important;
        border-radius: 10px !important;
        font-size: 14px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-t > b {
        font-size: 13.5px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-t > span {
        font-size: 12.5px !important;
        line-height: 1.6 !important;
    }

    /* Статусът слиза под текста */
    section.sec:has(.ap-grey) .ap-grey-a {
        grid-column: 2 !important;
        justify-self: start !important;
        min-width: 72px !important;
        padding: 7px 11px !important;
        margin-top: 2px !important;
        font-size: 11px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-grey) .ap-grey-r,
    section.sec:has(.ap-grey) .ap-grey-q {
        transition: none !important;
    }
}
/**/
/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "ГРАНИЦИТЕ, С ЧИСЛА"
   ========================================================================== */

/* Основна секция */
section.sec:has(.ap-lim) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #172000 !important;
    overflow: hidden !important;
}

/* Лек зелен ореол */
section.sec:has(.ap-lim)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 500px !important;
    left: 50% !important;
    top: -120px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 42%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.ap-lim) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1080px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.ap-lim) .ap-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.ap-lim) .ap-head h2 {
    margin: 0 0 14px !important;
    color: #172000 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-lim) .ap-head p {
    margin: 0 !important;
    color: #697264 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.ap-lim) .ap-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 14px rgba(152,219,28,.28) !important;
}

/* ==========================================================================
   ТАБЛИЦА
   ========================================================================== */

section.sec:has(.ap-lim) .ap-lim {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e4e9df !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 7px rgba(15,23,42,.025) !important;
}

/* Горна зелена линия */
section.sec:has(.ap-lim) .ap-lim::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00 0%,
        #c4f36c 50%,
        #7cbf00 100%
    ) !important;
}

/* Самата таблица */
section.sec:has(.ap-lim) .ap-lim table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    background: #ffffff !important;
}

/* Заглавия */
section.sec:has(.ap-lim) .ap-lim thead th {
    padding: 20px 22px !important;
    background: #f6f9f3 !important;
    color: #536044 !important;
    border-bottom: 1px solid #e3e9df !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .65px !important;
    text-align: left !important;
}

/* Първата колона */
section.sec:has(.ap-lim) .ap-lim thead th:first-child {
    width: 34% !important;
}

/* Клетки */
section.sec:has(.ap-lim) .ap-lim tbody td {
    padding: 21px 22px !important;
    border-bottom: 1px solid #edf0eb !important;
    color: #59635a !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    vertical-align: middle !important;
    background: #ffffff !important;
}

/* Последен ред */
section.sec:has(.ap-lim) .ap-lim tbody tr:last-child td {
    border-bottom: 0 !important;
}

/* Име на параметъра */
section.sec:has(.ap-lim) .ap-lim tbody td:first-child {
    color: #26351a !important;
    font-size: 14px !important;
    font-weight: 750 !important;
}

/* Zebra ефект */
section.sec:has(.ap-lim) .ap-lim tbody tr:nth-child(even) td {
    background: #fbfcfa !important;
}

/* Hover */
section.sec:has(.ap-lim) .ap-lim tbody tr {
    transition: background .25s ease !important;
}

section.sec:has(.ap-lim) .ap-lim tbody tr:hover td {
    background: #f5faef !important;
}

/* ==========================================================================
   ЧИСЛА / MONO
   ========================================================================== */

section.sec:has(.ap-lim) .ap-lim .mono {
    color: #354228 !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        "Liberation Mono",
        monospace !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: -.15px !important;
}

/* Втори ред под числото */
section.sec:has(.ap-lim) .ap-lim .mono span {
    display: block !important;
    margin-top: 4px !important;
    color: #8a9385 !important;
    font-family:
        Inter,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif !important;
    font-size: 11px !important;
    line-height: 1.45 !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
}

/* ==========================================================================
   NOTE / ОБЯСНЕНИЕ
   ========================================================================== */

section.sec:has(.ap-lim) .ap-lim-note {
    position: relative !important;
    margin-top: 18px !important;
    padding: 22px 24px 22px 27px !important;
    background: #f7faf4 !important;
    border: 1px solid #e1ead9 !important;
    border-left: 3px solid #7cbf00 !important;
    border-radius: 15px !important;
    color: #65705f !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    box-shadow: 0 5px 18px rgba(15,23,42,.025) !important;
}

/* Заглавие на note */
section.sec:has(.ap-lim) .ap-lim-note b {
    display: block !important;
    margin-bottom: 6px !important;
    color: #26351a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.ap-lim) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-lim) .ap-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.ap-lim) .ap-lim {
        border-radius: 17px !important;
    }

    section.sec:has(.ap-lim) .ap-lim thead th,
    section.sec:has(.ap-lim) .ap-lim tbody td {
        padding: 17px 16px !important;
    }

    section.sec:has(.ap-lim) .ap-lim-note {
        padding: 20px 21px 20px 23px !important;
    }
}

/* ==========================================================================
   MOBILE — хоризонтално превъртане само на таблицата
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-lim) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-lim) .ap-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-lim) .ap-head p {
        font-size: 14px !important;
    }

    section.sec:has(.ap-lim) .ap-lim {
        overflow-x: auto !important;
        border-radius: 16px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    section.sec:has(.ap-lim) .ap-lim table {
        min-width: 690px !important;
    }

    section.sec:has(.ap-lim) .ap-lim thead th {
        padding: 16px 14px !important;
        font-size: 10px !important;
    }

    section.sec:has(.ap-lim) .ap-lim tbody td {
        padding: 17px 14px !important;
        font-size: 13px !important;
    }

    section.sec:has(.ap-lim) .ap-lim tbody td:first-child {
        font-size: 13px !important;
    }

    section.sec:has(.ap-lim) .ap-lim .mono {
        font-size: 12px !important;
    }

    section.sec:has(.ap-lim) .ap-lim .mono span {
        font-size: 10px !important;
    }

    section.sec:has(.ap-lim) .ap-lim-note {
        margin-top: 14px !important;
        padding: 18px 18px 19px 20px !important;
        font-size: 12.5px !important;
        line-height: 1.65 !important;
        border-radius: 14px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-lim) .ap-lim tbody tr {
        transition: none !important;
    }
}
/**/
/* ==========================================================================
   AP FLOW — DARK PREMIUM GRID
   2 КАРТИ НА РЕД • БЕЗ ТОЧКИ • БЕЗ ВЕРТИКАЛНА ЛИНИЯ
   ========================================================================== */

/* Тъмна секция */
section.sec:has(.ap-flow) {
    position: relative !important;
    background: #0b0f0d !important;
    color: #ffffff !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.ap-flow)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -280px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.10) 0%,
        rgba(152,219,28,.035) 38%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.ap-flow) .wrap-n {
    position: relative !important;
    z-index: 2 !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.ap-flow) .ap-head {
    max-width: 780px !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section.sec:has(.ap-flow) .ap-head h2 {
    margin: 0 0 14px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-flow) .ap-head p {
    margin: 0 !important;
    color: #aeb8b1 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.ap-flow) .ap-head::after {
    content: "" !important;
    display: block !important;
    width: 48px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin: 0 !important;
}

/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    align-items: start !important;
    min-height: 190px !important;
    padding: 26px !important;
    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 18px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(0,0,0,.18),
        0 2px 8px rgba(0,0,0,.10) !important;
    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease !important;
}

/* Зелена горна линия */
section.sec:has(.ap-flow) .ap-flow-r::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c4f36d
    ) !important;
}

/* Hover */
section.sec:has(.ap-flow) .ap-flow-r:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(152,219,28,.35) !important;
    box-shadow:
        0 18px 45px rgba(0,0,0,.24),
        0 8px 25px rgba(152,219,28,.08) !important;
}

/* ==========================================================================
   МАХАМЕ ТОЧКИТЕ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-d {
    display: none !important;
}

section.sec:has(.ap-flow) .ap-flow-r::before {
    display: none !important;
    content: none !important;
}

/* ==========================================================================
   НОМЕР / ЕТИКЕТ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-t {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 58px !important;
    min-height: 34px !important;
    padding: 7px 9px !important;
    box-sizing: border-box !important;
    border-radius: 9px !important;
    background: #f1f7e9 !important;
    border: 1px solid #dcebc8 !important;
    color: #557c0b !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: .3px !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-x {
    display: block !important;
    min-width: 0 !important;
}

section.sec:has(.ap-flow) .ap-flow-x b {
    display: block !important;
    margin: 2px 0 9px !important;
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
}

section.sec:has(.ap-flow) .ap-flow-x p {
    margin: 0 !important;
    color: #626b64 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   ПЪРВИ ЕЛЕМЕНТ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-r.start {
    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f7faF3 100%
        ) !important;
}

/* ==========================================================================
   ПОСЛЕДЕН / УСПЕШЕН ЕЛЕМЕНТ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-r.good {
    background:
        linear-gradient(
            135deg,
            #f7fceF 0%,
            #ffffff 100%
        ) !important;
    border-color: rgba(152,219,28,.30) !important;
}

section.sec:has(.ap-flow) .ap-flow-r.good .ap-flow-t {
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;
    color: #172000 !important;
}

/* ==========================================================================
   БЪРЗИ СПИРАНИЯ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-fast {
    margin-top: 22px !important;
    padding: 25px 28px !important;
    background: #151b17 !important;
    border: 1px solid rgba(152,219,28,.20) !important;
    border-radius: 18px !important;
    color: #dce4de !important;
    box-shadow: 0 12px 35px rgba(0,0,0,.18) !important;
}

section.sec:has(.ap-flow) .ap-flow-fast > b {
    display: block !important;
    margin-bottom: 8px !important;
    color: #ffffff !important;
    font-size: 16px !important;
}

section.sec:has(.ap-flow) .ap-flow-fast > p {
    margin: 0 0 12px !important;
    color: #9da9a1 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

section.sec:has(.ap-flow) .ap-flow-fast ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
}

section.sec:has(.ap-flow) .ap-flow-fast li {
    position: relative !important;
    padding: 12px 14px 12px 32px !important;
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(255,255,255,.07) !important;
    border-radius: 10px !important;
    color: #d7dfda !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

section.sec:has(.ap-flow) .ap-flow-fast li::before {
    content: "!" !important;
    position: absolute !important;
    left: 11px !important;
    top: 12px !important;
    width: 15px !important;
    height: 15px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    color: #172000 !important;
    font-size: 10px !important;
    font-weight: 900 !important;
}

section.sec:has(.ap-flow) .ap-fast-after {
    margin: 15px 0 0 !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(255,255,255,.07) !important;
    color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec:has(.ap-flow) .ap-flow {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.ap-flow) .ap-flow-r {
        min-height: auto !important;
    }

    section.sec:has(.ap-flow) .ap-flow-fast ul {
        grid-template-columns: 1fr !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-flow) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-flow) .ap-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.ap-flow) .ap-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-flow) .ap-head p {
        font-size: 14px !important;
    }

    section.sec:has(.ap-flow) .ap-flow {
        gap: 13px !important;
    }

    section.sec:has(.ap-flow) .ap-flow-r {
        grid-template-columns: 62px minmax(0, 1fr) !important;
        padding: 21px 18px !important;
        border-radius: 15px !important;
    }

    section.sec:has(.ap-flow) .ap-flow-t {
        width: 52px !important;
        min-height: 31px !important;
        font-size: 10px !important;
    }

    section.sec:has(.ap-flow) .ap-flow-x b {
        font-size: 14px !important;
        margin-bottom: 7px !important;
    }

    section.sec:has(.ap-flow) .ap-flow-x p {
        font-size: 12.5px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.ap-flow) .ap-flow-fast {
        padding: 21px 18px !important;
        border-radius: 15px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-flow) .ap-flow-r {
        transition: none !important;
    }

    section.sec:has(.ap-flow) .ap-flow-r:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   AP APPEAL — CLEAN EDITORIAL DESIGN
   ========================================================================== */

section.sec:has(.ap-appeal) {
    position: relative !important;
    background: #f8faf7 !important;
    color: #172000 !important;
    overflow: hidden !important;
}

/* Лек зелен фон */
section.sec:has(.ap-appeal)::before {
    content: "" !important;
    position: absolute !important;
    width: 720px !important;
    height: 720px !important;
    top: -380px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.11) 0%,
        rgba(152,219,28,.035) 42%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.ap-appeal) .ap-appeal {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1060px !important;
    margin: 0 auto !important;
    padding: clamp(32px, 5vw, 55px) !important;
    background: #ffffff !important;
    border: 1px solid #e4e9e2 !important;
    border-radius: 24px !important;
    box-shadow:
        0 20px 55px rgba(15,23,42,.06),
        0 3px 10px rgba(15,23,42,.025) !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.ap-appeal) .ap-appeal > h2 {
    margin: 0 0 12px !important;
    color: #111827 !important;
    text-align: center !important;
    font-size: clamp(29px, 4vw, 41px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-appeal) .ap-appeal > p {
    max-width: 720px !important;
    margin: 0 auto !important;
    color: #68736b !important;
    text-align: center !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
}

/* Малък зелен акцент */
section.sec:has(.ap-appeal) .ap-appeal > p::after {
    content: "" !important;
    display: block !important;
    width: 42px !important;
    height: 3px !important;
    margin: 22px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
}

/* ==========================================================================
   ПРОЦЕС
   ========================================================================== */

section.sec:has(.ap-appeal) .ap-appeal-l {
    position: relative !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    margin-top: 48px !important;
    border-top: 1px solid #e5e9e4 !important;
    border-bottom: 1px solid #e5e9e4 !important;
}

/* Хоризонтална линия между стъпките */
section.sec:has(.ap-appeal) .ap-appeal-i {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 48px 1fr !important;
    column-gap: 17px !important;
    min-height: 145px !important;
    padding: 28px 30px !important;
    box-sizing: border-box !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Разделител */
section.sec:has(.ap-appeal) .ap-appeal-i:not(:last-child) {
    border-right: 1px solid #e5e9e4 !important;
}

/* Номер */
section.sec:has(.ap-appeal) .ap-appeal-n {
    grid-row: 1 / span 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    color: #172000 !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    box-shadow: 0 5px 14px rgba(152,219,28,.20) !important;
}

/* Заглавие */
section.sec:has(.ap-appeal) .ap-appeal-i > b {
    display: block !important;
    align-self: end !important;
    margin: 0 0 6px !important;
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
}

/* Описание */
section.sec:has(.ap-appeal) .ap-appeal-i > span:last-child {
    display: block !important;
    align-self: start !important;
    color: #69736b !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* Без hover движение */
section.sec:has(.ap-appeal) .ap-appeal-i:hover {
    transform: none !important;
}

/* ==========================================================================
   ДОЛЕН АКЦЕНТ
   ========================================================================== */

section.sec:has(.ap-appeal) .ap-appeal-say {
    position: relative !important;
    margin-top: 25px !important;
    padding: 19px 24px 19px 25px !important;
    background: #f3f8ec !important;
    border: 1px solid #dce8cf !important;
    border-radius: 13px !important;
    color: #59645b !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

/* Лява зелена черта */
section.sec:has(.ap-appeal) .ap-appeal-say::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 11px !important;
    bottom: 11px !important;
    width: 3px !important;
    border-radius: 0 3px 3px 0 !important;
    background: #7cbf00 !important;
}

section.sec:has(.ap-appeal) .ap-appeal-say b {
    color: #26351a !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 820px) {

    section.sec:has(.ap-appeal) .ap-appeal {
        padding: 35px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-l {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i {
        min-height: 0 !important;
        padding: 23px 0 !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i:not(:last-child) {
        border-right: 0 !important;
        border-bottom: 1px solid #e5e9e4 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-appeal) {
        padding: 55px 14px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal {
        padding: 27px 19px !important;
        border-radius: 18px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal > h2 {
        font-size: 28px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal > p {
        font-size: 14px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-l {
        margin-top: 34px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i {
        grid-template-columns: 42px 1fr !important;
        column-gap: 14px !important;
        padding: 20px 0 !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-n {
        width: 38px !important;
        height: 38px !important;
        font-size: 13px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i > b {
        font-size: 14px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i > span:last-child {
        font-size: 12.5px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-say {
        margin-top: 18px !important;
        padding: 17px 17px 17px 20px !important;
        font-size: 12.5px !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "ПОДАЙ СИГНАЛ"
   Full-width информационен блок
   ========================================================================== */

section.sec:has(.ap-rep) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Зелен декоративен glow */
section.sec:has(.ap-rep)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -280px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.035) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.ap-rep) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 45px !important;
    align-items: center !important;

    padding: clamp(32px, 5vw, 55px) !important;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbfdf9 55%,
            #f5faee 100%
        ) !important;

    border: 1px solid #e1e7dc !important;
    border-radius: 24px !important;

    box-shadow:
        0 20px 55px rgba(15,23,42,.07),
        0 4px 12px rgba(15,23,42,.035) !important;

    overflow: hidden !important;
}

/* Горна зелена линия */
section.sec:has(.ap-rep) .ap-rep::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 4px !important;

    background: linear-gradient(
        90deg,
        #7fbe0c 0%,
        #7cbf00 45%,
        #c7f56c 100%
    ) !important;
}

/* Декоративен кръг */
section.sec:has(.ap-rep) .ap-rep::after {
    content: "" !important;
    position: absolute !important;
    width: 280px !important;
    height: 280px !important;
    right: -130px !important;
    bottom: -160px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.075) !important;
    border: 1px solid rgba(152,219,28,.12) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ЛЯВА ЧАСТ
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep > div:first-child {
    position: relative !important;
    z-index: 2 !important;
    min-width: 0 !important;
}

section.sec:has(.ap-rep) .ap-rep h3 {
    margin: 0 0 13px !important;

    color: #172000 !important;

    font-size: clamp(25px, 3vw, 34px) !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: -.7px !important;
}

section.sec:has(.ap-rep) .ap-rep p {
    max-width: 720px !important;

    margin: 0 !important;

    color: #596273 !important;

    font-size: 15px !important;
    line-height: 1.75 !important;
}

section.sec:has(.ap-rep) .ap-rep p b {
    color: #385900 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   НОВИЯТ FULL-WIDTH BOX
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep-box {
    position: relative !important;
    z-index: 2 !important;

    width: 100% !important;
    max-width: none !important;

    box-sizing: border-box !important;

    display: grid !important;
    grid-template-columns: 3fr 3fr 3fr 3fr 3fr !important;
    align-items: center !important;
    gap: 22px !important;

    margin-top: 30px !important;
    padding: 18px 22px !important;

    background: #f3f8ed !important;

    border: 1px solid #dce8d0 !important;
    border-left: 4px solid #7cbf00 !important;

    border-radius: 14px !important;

    box-shadow:
        0 5px 18px rgba(40,65,10,.045) !important;
}

/* Малък етикет */
section.sec:has(.ap-rep) .ap-rep-box > b:first-child {
    display: inline-flex !important;
    align-items: center !important;

    margin: 0 !important;

    padding: 7px 11px !important;

    background: #ffffff !important;
    border: 1px solid #dce7d3 !important;
    border-radius: 8px !important;

    color: #557d0a !important;

    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .5px !important;
    white-space: nowrap !important;
}

/* Email */
section.sec:has(.ap-rep) .ap-rep-box a {
    color: #172000 !important;

    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;

    text-decoration: none !important;

    transition:
        color .2s ease,
        transform .2s ease !important;
}

section.sec:has(.ap-rep) .ap-rep-box a:hover {
    color: #6da800 !important;
}

/* Текст след <br> */
section.sec:has(.ap-rep) .ap-rep-box br {
    display: none !important;
}

section.sec:has(.ap-rep) .ap-rep-box a + * {
    color: #687361 !important;
}

/* Последният bold — 24 часа */
section.sec:has(.ap-rep) .ap-rep-box > b:last-child {
    color: #385900 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ДЯСНА ЧАСТ / БУТОН
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep-go {
    position: relative !important;
    z-index: 3 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex-shrink: 0 !important;
}

section.sec:has(.ap-rep) .ap-rep-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 145px !important;
    min-height: 50px !important;

    padding: 0 23px !important;

    background: #7cbf00 !important;
    border: 1px solid #7cbf00 !important;
    border-radius: 12px !important;

    color: #172000 !important;

    font-size: 14px !important;
    font-weight: 800 !important;
    text-decoration: none !important;

    box-shadow:
        0 8px 20px rgba(152,219,28,.22) !important;

    transition:
        transform .2s ease,
        background .2s ease,
        box-shadow .2s ease !important;
}

section.sec:has(.ap-rep) .ap-rep-go .btn:hover {
    background: #a8e832 !important;

    transform: translateY(-2px) !important;

    box-shadow:
        0 12px 28px rgba(152,219,28,.30) !important;
}

section.sec:has(.ap-rep) .ap-rep-go .btn:active {
    transform: translateY(0) !important;
}

/* ==========================================================================
   МАЛЪК GREEN INDICATOR
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep-box::before {
    content: "" !important;

    width: 8px !important;
    height: 8px !important;

    position: absolute !important;
    right: 18px !important;
    top: 12px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 0 4px rgba(152,219,28,.12) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 820px) {

    section.sec:has(.ap-rep) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-rep) .ap-rep {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
        padding: 34px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-go {
        justify-content: flex-start !important;
    }

    section.sec:has(.ap-rep) .ap-rep-go .btn {
        min-width: 170px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box {
        grid-template-columns: auto 1fr!important;
    }

    section.sec:has(.ap-rep) .ap-rep-box a {
        justify-self: start !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-rep) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-rep) .ap-rep {
        gap: 25px !important;
        padding: 27px 20px 24px !important;
        border-radius: 18px !important;
    }

    section.sec:has(.ap-rep) .ap-rep h3 {
        font-size: 26px !important;
        letter-spacing: -.5px !important;
    }

    section.sec:has(.ap-rep) .ap-rep p {
        font-size: 14px !important;
        line-height: 1.7 !important;
    }

    /* Full-width info panel на мобилен */
    section.sec:has(.ap-rep) .ap-rep-box {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 9px !important;

        margin-top: 24px !important;
        padding: 17px !important;

        border-radius: 13px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box > b:first-child {
        font-size: 10px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box a {
        font-size: 16px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box br {
        display: block !important;
    }

    section.sec:has(.ap-rep) .ap-rep-go {
        width: 100% !important;
    }

    section.sec:has(.ap-rep) .ap-rep-go .btn {
        width: 100% !important;
        min-width: 0 !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box::before {
        right: 14px !important;
        top: 14px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-rep) .ap-rep-go .btn,
    section.sec:has(.ap-rep) .ap-rep-box a {
        transition: none !important;
    }
}

/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "ДРУГИТЕ ДОКУМЕНТИ"
   ========================================================================== */

section.sec:has(.ap-docs) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Зелен декоративен glow */
section.sec:has(.ap-docs)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -320px !important;
    transform: translateX(-50%) !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.035) 35%,
        transparent 70%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.ap-docs) .wrap-w {
    position: relative !important;
    z-index: 1 !important;

    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.ap-docs) h2 {
    margin: 0 0 10px !important;

    color: #172000 !important;

    font-size: clamp(28px, 4vw, 38px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -.8px !important;

    text-align: center !important;
}

/* ==========================================================================
   ПОДЗАГЛАВИЕ — ЦЕНТРИРАНО
   ========================================================================== */

section.sec:has(.ap-docs) .ap-lead {
    max-width: 680px !important;

    margin: 0 auto 32px !important;

    color: #687361 !important;

    font-size: 15px !important;
    line-height: 1.7 !important;

    text-align: center !important;
}

/* ==========================================================================
   ДОКУМЕНТИ — GRID
   ========================================================================== */

section.sec:has(.ap-docs) .ap-docs {
    position: relative !important;
    z-index: 2 !important;

    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    gap: 20px !important;

    margin-top: 30px !important;
}

/* ==========================================================================
   ДОКУМЕНТ — КАРТА
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    min-width: 0 !important;
    box-sizing: border-box !important;

    padding: 28px 26px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 55%,
            #f5faee 100%
        ) !important;

    border: 1px solid #e1e7dc !important;
    border-radius: 18px !important;

    color: #172000 !important;
    text-decoration: none !important;

    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 3px 10px rgba(15,23,42,.025) !important;

    overflow: hidden !important;

    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease,
        background .22s ease !important;
}

/* Горна зелена линия */
section.sec:has(.ap-docs) .ap-doc-i::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        #7fbe0c 0%,
        #7cbf00 50%,
        #c7f56c 100%
    ) !important;

    opacity: .9 !important;
}

/* Декоративен кръг */
section.sec:has(.ap-docs) .ap-doc-i::after {
    content: "" !important;

    position: absolute !important;

    width: 150px !important;
    height: 150px !important;

    right: -75px !important;
    bottom: -85px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.055) !important;
    border: 1px solid rgba(152,219,28,.09) !important;

    pointer-events: none !important;

    transition:
        transform .25s ease,
        background .25s ease !important;
}

/* Hover */
section.sec:has(.ap-docs) .ap-doc-i:hover {
    transform: translateY(-4px) !important;

    border-color: #cbdcaf !important;

    box-shadow:
        0 18px 42px rgba(15,23,42,.085),
        0 5px 14px rgba(70,100,20,.045) !important;
}

section.sec:has(.ap-docs) .ap-doc-i:hover::after {
    transform: scale(1.15) !important;
    background: rgba(152,219,28,.08) !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-ic {
    position: relative !important;
    z-index: 2 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 48px !important;
    height: 48px !important;

    margin-bottom: 20px !important;

    box-sizing: border-box !important;

    background: #f3f8ed !important;

    border: 1px solid #dce8d0 !important;
    border-radius: 12px !important;

    color: #6da800 !important;

    box-shadow:
        0 5px 15px rgba(70,100,20,.055) !important;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease !important;
}

section.sec:has(.ap-docs) .ap-doc-i:hover .ap-doc-ic {
    background: #7cbf00 !important;
    color: #172000 !important;

    transform: translateY(-2px) !important;
}

/* SVG */
section.sec:has(.ap-docs) .ap-doc-ic svg {
    width: 23px !important;
    height: 23px !important;

    display: block !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА ДОКУМЕНТА
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i > b {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin: 0 0 9px !important;

    color: #172000 !important;

    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
    letter-spacing: -.2px !important;
}

/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i > span:last-child {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin: 0 !important;

    color: #687361 !important;

    font-size: 14px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   GREEN INDICATOR
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i {
    --doc-dot: #7cbf00;
}

section.sec:has(.ap-docs) .ap-doc-i > b::after {
    content: "" !important;

    display: inline-block !important;

    width: 6px !important;
    height: 6px !important;

    margin-left: 8px !important;

    vertical-align: middle !important;

    border-radius: 50% !important;

    background: var(--doc-dot) !important;

    box-shadow:
        0 0 0 3px rgba(152,219,28,.10) !important;

    opacity: .85 !important;
}

/* ==========================================================================
   FOCUS ACCESSIBILITY
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i:focus-visible {
    outline: 3px solid rgba(152,219,28,.35) !important;
    outline-offset: 4px !important;

    border-color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 820px) {

    section.sec:has(.ap-docs) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-docs) .ap-docs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-i {
        padding: 25px 22px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-docs) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-docs) h2 {
        font-size: 27px !important;
        letter-spacing: -.5px !important;
    }

    section.sec:has(.ap-docs) .ap-lead {
        margin: 0 auto 25px !important;

        font-size: 14px !important;
        line-height: 1.65 !important;

        text-align: center !important;
    }

    section.sec:has(.ap-docs) .ap-docs {
        grid-template-columns: 1fr !important;

        gap: 14px !important;

        margin-top: 24px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-i {
        padding: 22px 20px !important;

        border-radius: 15px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-ic {
        width: 44px !important;
        height: 44px !important;

        margin-bottom: 17px !important;

        border-radius: 11px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-i > b {
        font-size: 16px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-i > span:last-child {
        font-size: 13.5px !important;
        line-height: 1.6 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-docs) .ap-doc-i,
    section.sec:has(.ap-docs) .ap-doc-i::after,
    section.sec:has(.ap-docs) .ap-doc-ic {
        transition: none !important;
    }
}

/**/


/* ==========================================================================
   ONLY HORIZONTAL SCROLL FIX
   Не променя ширини, размери или layout
   ========================================================================== */

html {
    overflow-x: hidden !important;
}

body {
    overflow-x: hidden !important;
}

/*
 * ═══ ШАПКАТА ОСТАВА ГОРЕ ═══
 *
 * Правилото на ред 180 е вярно, но нещо по-надолу го отменя.
 *
 * Тук то се повтаря в края на файла — последното написано печели.
 *
 * РОДИТЕЛИТЕ СЪЩО СЕ ОПРАВЯТ: лепкавото спира да работи, ако някой от
 * тях има „overflow“ различен от обичайното. Затова те се връщат към
 * него изрично.
 */
/*
 * НИЩО НЕ СЕ ПИПА ПО „body“.
 *
 * „overflow-x“ на него — с каквато и стойност — може да направи от
 * него контейнер за превъртане. Тогава лепкавото се лепи ЗА НЕГО, а
 * не за прозореца, и не се вижда.
 */


/* Шапката остава горе при превъртане. */
.site-header{position:sticky;top:0;z-index:80}

.site-header{position:fixed;top:0;left:0;right:0;z-index:80}
body{padding-top:var(--hd-h, 76px)}

/* Шапката се връща на мястото си, под лентите. */
body{padding-top:0}
.site-header{position:sticky;top:0;z-index:80;left:auto;right:auto}

/* Когато скриптът я закачи · заема мястото на изгубената височина. */
.site-header.is-stuck{position:fixed;top:0;left:0;right:0;z-index:80}
.hd-spacer{display:none}
.hd-spacer.is-on{display:block}










/*
 * ═══ ПАДАЩИТЕ МЕНЮТА СЕ ОТВАРЯТ ПРИ ПОСОЧВАНЕ ═══
 *
 * На голям екран щракането е излишно — мишката вече е там.
 *
 * НА ТЕЛЕФОН ОСТАВА ЩРАКАНЕТО: там няма посочване, а пръст.
 */
@media (min-width:1101px){
  .nav>li.has-drop:hover>.nav-drop,
  .nav>li.has-drop:hover>.drop,
  .nav>li.has-drop:hover>.mega,
  .nav>li.has-drop:focus-within>.nav-drop,
  .nav>li.has-drop:focus-within>.drop,
  .nav>li.has-drop:focus-within>.mega{
    display:block;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
}

/*
 * ═══ МЕНЮТО · ЕДНО ПОВЕДЕНИЕ, НЕ ДВЕ ═══
 *
 * Дотук работеха и посочването, и щракането. Щом човек щракне, менюто
 * оставаше заключено отворено, а после посочването не го затваряше.
 *
 * НА ГОЛЯМ ЕКРАН · само посочване. Класът от щракането се пренебрегва.
 * НА ТЕЛЕФОН · само щракане, защото там няма мишка.
 */
@media (min-width:1101px){
  .nav>li.has-drop:hover>.nav-drop,
  .nav>li.has-drop:hover>.drop,
  .nav>li.has-drop:focus-within>.nav-drop,
  .nav>li.has-drop:focus-within>.drop{display:block}

  .nav>li.has-drop:hover>.mega,
  .nav>li.has-drop:focus-within>.mega{display:grid}

  /* Щракането не оставя менюто отворено. */
  .nav>li.has-drop.is-open:not(:hover):not(:focus-within)>.nav-drop,
  .nav>li.has-drop.is-open:not(:hover):not(:focus-within)>.drop,
  .nav>li.has-drop.is-open:not(:hover):not(:focus-within)>.mega{display:none}
}

/*
 * ═══ БУТОНЪТ НЕ СЕ ЩРАКА НА ГОЛЯМ ЕКРАН ═══
 *
 * Щом менюто пада при посочване, щракането е излишно — а излишното
 * щракане обърква: човек не знае дали е трябвало, или не.
 *
 * НА ТЕЛЕФОН ОСТАВА · там няма посочване.
 */
@media (min-width:1101px){
  .nav>li.has-drop>.nav-top{
    pointer-events:none;
    cursor:default;
  }

  /*
   * Цялото поле остава чувствително · иначе менюто не би се отваряло
   * изобщо. Само самият надпис не се щрака.
   */
  .nav>li.has-drop{pointer-events:auto}
}

/* Иконките в стил „двоен ръб“ · тънка линия, заоблени краища. */
.fi svg,
.nav-drop .fi svg,
.drop .fi svg,
.mega .fi svg{stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ── Шапката на телефон ── */
@media (max-width:1100px){
  .site-header{background:#000}

  .site-header .nav-cart,
  .site-header .nav-toggle,
  .site-header .nav-actions .btn{
    width:42px;height:42px;min-width:42px;min-height:42px;
    padding:0;border-radius:11px;flex:0 0 auto;box-sizing:border-box;
    background:#7cbf00;border-color:#7cbf00;color:#000;
  }

  .site-header .nav-cart svg,
  .site-header .nav-toggle svg{width:19px;height:19px;color:#000}

  .site-header .nav-actions .btn{
    display:grid !important;place-items:center;font-size:0;
    background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:center;background-size:19px 19px;
    box-shadow:none;
  }
  .site-header .nav-actions .btn::before,
  .site-header .nav-actions .btn::after{content:none !important}

  .site-header .nav-actions{gap:8px}

  /* Отвореното меню · тъмен текст на бяло. */
  .nav.is-open{background:#fff}
  .nav.is-open>li>a,
  .nav.is-open>li>.nav-top{color:var(--ink) !important}
  .nav.is-open .nav-drop a,
  .nav.is-open .mega a,
  .nav.is-open .nav-drop b,
  .nav.is-open .mega b{color:var(--ink)}

  /* Горната лента · телефон, помощен център, флагчета. */
  .utilbar{display:block}
  .utilbar .wrap-w{display:flex;align-items:center;justify-content:space-between;
                   gap:10px;padding-block:6px;flex-wrap:nowrap}
  .utilbar .wrap-w > span:not(:first-child){display:none}
  .utilbar .r{margin-left:auto;gap:10px}
  .utilbar .r > a[href^="mailto"]{display:none}
  .utilbar a[hreflang] svg.lang-f{width:22px;height:22px}
}

/*
 * ═══ МЕНЮТО НА ТЕЛЕФОН · ПОД ШАПКАТА, НЕ ВЪРХУ НЕЯ ═══
 *
 * Дотук то се отваряше насред екрана и покриваше логото и копчетата.
 *
 * Сега тръгва точно под шапката и заема цялата ширина.
 */
@media (max-width:1100px){
  .nav{
    position:fixed;
    top:var(--hd-h, 104px);
    left:0;
    right:0;
    bottom:auto;
    width:100%;
    max-height:calc(100dvh - var(--hd-h, 104px));
    overflow-y:auto;
    margin:0;
    padding:8px 0;
    border-radius:0;
    border-top:1px solid var(--line);
    box-shadow:0 12px 28px rgba(0,0,0,.28);
    transform:none;
    display:none;
  }

  .nav.is-open{display:block}

  .nav>li{width:100%}

  .nav>li>a,
  .nav>li>.nav-top{
    width:100%;
    padding:15px 20px;
    font-size:16px;
    border-radius:0;
    justify-content:space-between;
  }

  /* Тънка чертичка между редовете. */
  .nav>li + li>a,
  .nav>li + li>.nav-top{border-top:1px solid var(--line)}

  /* Подменютата · подредени навътре. */
  .nav-drop,
  .drop,
  .mega{
    position:static;
    width:100%;
    min-width:0;
    box-shadow:none;
    border:0;
    border-radius:0;
    padding:0;
    background:var(--wash);
  }

  .nav-drop li a,
  .drop li a,
  .mega li a{padding:13px 20px 13px 34px}
}

/*
 * МЕНЮТО СТОИ В ПОТОКА, не се измерва.
 *
 * Измерването с число винаги бърка при друга височина на шапката.
 * Тук менюто е под нея по естествен ред — не може да я покрие.
 */
@media (max-width:1100px){
  .site-header{position:relative;z-index:80}

  .site-header .wrap-w{position:relative}

  .nav{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    width:auto;
    max-height:calc(100dvh - 100%);
  }
}

/*
 * ═══ БЕЗ КУТИЙКИ · САМО ИКОНКАТА ═══
 *
 * Цветното квадратче отвличаше вниманието от самия знак и правеше
 * всички редове еднакви.
 *
 * ИКОНКАТА ЗАЕМА ЦЯЛОТО МЯСТО на кутийката — така се вижда какво е.
 */
.nav-drop .fi,
.drop .fi,
.mega .fi{
  background:none !important;
  border:0 !important;
  width:38px;
  height:38px;
}

.nav-drop .fi svg,
.drop .fi svg,
.mega .fi svg{
  width:34px;
  height:34px;
  stroke-width:1.4;
}

/*
 * ═══ ИКОНКИТЕ СЕ НАГАЖДАТ КЪМ ФОНА ═══
 *
 * Зеленото беше за тъмната лента. На белия фон на падащото меню то
 * избледнява и знакът се губи.
 *
 * ТУК ТЕ СА ТЪМНИ · същия цвят като текста до тях.
 */
.nav-drop .fi svg,
.drop .fi svg,
.mega .fi svg{color:var(--ink)}

/*
 * ПРИ ПОСОЧВАНЕ · зеленото се връща като акцент.
 *
 * Така то казва „това гледаш“, вместо да стои постоянно.
 */
.nav-drop a:hover .fi svg,
.drop a:hover .fi svg,
.mega a:hover .fi svg{color:#6fa310}



/*
 * ОБЯСНИТЕЛНАТА КУТИЯ ЗА СКОРОСТТА.
 *
 * ЗАГЛАВИЕТО Е ЦЕНТРИРАНО, текстът е подравнен вляво · центриран
 * абзац от пет реда се чете трудно, защото окото губи началото.
 */
.speedbox{
  max-width:141ch;
  margin:0 auto;
}

.speedbox h2{
  margin:0 0 16px;
  font-size:clamp(1.35rem, 2.6vw, 1.85rem);
  line-height:1.25;
  letter-spacing:-.03em;
  text-align:center;
}

.speedbox p{
  margin:0;
  font-size:15.5px;
  line-height:1.75;
  color:var(--ink-2);
}

@media (max-width:640px){
  .speedbox p{font-size:14.5px;line-height:1.7}
}

/* ==== speedbox: начало ==== */
.sb{
  position:relative;overflow:hidden;
  padding:clamp(44px,5.5vw,72px) clamp(22px,4vw,48px);
  background:
    radial-gradient(900px 400px at 88% -10%, rgba(94,154,0,.16), transparent 60%),
    linear-gradient(165deg, #F8FBF2 0%, var(--wash-2) 100%);
}
.sb-in{max-width:1020px;margin:0 auto}

.sb-h{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:end;
      margin-bottom:clamp(26px,3.5vw,40px)}
.sb-h h2{margin:0;font:800 clamp(1.4rem,3vw,2.15rem)/1.15 var(--sans);
         letter-spacing:-.038em;max-width:20ch}

.sb-num{text-align:right}
.sb-num b{display:block;font:900 clamp(2.4rem,6vw,4rem)/1 var(--mono);
          letter-spacing:-.05em;
          background:linear-gradient(160deg,#7cbf00,#7CC00A);
          -webkit-background-clip:text;background-clip:text;color:transparent}
.sb-num span{display:block;font-size:11.5px;color:var(--ink-3);margin-top:4px}

.sb-body{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,4vw,44px)}
.sb-txt{margin:0;font-size:15px;line-height:1.72;color:var(--ink-2)}

.sb-cards{display:grid;grid-template-columns:1fr 1fr;gap:11px;align-content:start}

.sb-c{position:relative;overflow:hidden;padding:16px 15px;border-radius:15px;
      background:var(--paper);border:1px solid var(--line);
      transition:transform .2s cubic-bezier(.2,.9,.2,1),box-shadow .2s}
.sb-c:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(14,39,69,.09)}
.sb-c::before{content:'';position:absolute;top:-34px;right:-34px;
  width:96px;height:96px;border-radius:50%;background:#7cbf00;opacity:.1;
  transition:transform .3s cubic-bezier(.2,.9,.2,1)}
.sb-c:hover::before{transform:scale(1.5)}
.sb-c svg{width:20px;height:20px;color:#7cbf00;position:relative;
          margin-bottom:9px;display:block}
.sb-c b{position:relative;display:block;font:700 13px/1.35 var(--sans)}

@media (max-width:900px){
  .sb-body{grid-template-columns:1fr}
  .sb-h{grid-template-columns:1fr;gap:16px}
  .sb-num{text-align:left}
}
@media (max-width:560px){.sb-cards{grid-template-columns:1fr}}
/* ==== speedbox: край ==== */


/* ==== dtip: начало ==== */
.dtip{padding:clamp(22px,2.6vw,32px);background:var(--wash);border-radius:16px;
      display:flex;flex-direction:column;justify-content:center}

.dtip-k{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;
        font:700 10px/1 var(--sans);letter-spacing:.11em;text-transform:uppercase;
        color:#7cbf00}
.dtip-k::before{content:'';width:20px;height:2px;background:currentColor}

.dtip-h{margin:0 0 16px;font:800 1.12rem/1.24 var(--sans);letter-spacing:-.028em}

.dtip-g{display:grid;grid-template-columns:1fr 1fr;gap:10px}

.dtip-c{position:relative;overflow:hidden;padding:15px 14px;border-radius:14px;
        background:var(--paper);border:1px solid var(--line);
        transition:transform .18s cubic-bezier(.2,.9,.2,1),box-shadow .18s}
.dtip-c:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(14,39,69,.09)}
.dtip-c::before{content:'';position:absolute;top:-30px;right:-30px;
  width:86px;height:86px;border-radius:50%;background:#7cbf00;opacity:.09;
  transition:transform .3s cubic-bezier(.2,.9,.2,1)}
.dtip-c:hover::before{transform:scale(1.45)}
.dtip-c svg{position:relative;width:18px;height:18px;color:#7cbf00;
            margin-bottom:9px;display:block}
.dtip-c b{position:relative;display:block;font:700 12.5px/1.32 var(--sans);
          margin-bottom:3px}
.dtip-c span{position:relative;display:block;font-size:11px;line-height:1.45;
             color:var(--ink-3)}

.dtip-c.is-warm::before{background:#B8862B}
.dtip-c.is-warm svg{color:#B8862B}

.dtip-f{margin:14px 0 0;font-size:12px;color:var(--ink-3)}

@media (max-width:460px){.dtip-g{grid-template-columns:1fr}}
/* ==== dtip: край ==== */

/* ==== shirina: начало ==== */

/*
 * ═══ ПО ЦЯЛАТА ШИРИНА ═══
 *
 * Само таваните. За връщане · махни блока между маркерите.
 */
.wrap-w{max-width:1680px}
.sb-in{max-width:1440px}

/* Правилото на ред 31313 има „important“ и стяга разделите с фон. */
section.sec.sec-wash .wrap-w{max-width:1680px !important}

/* Решетките с точен брой колони · иначе плочките се скупчват вляво. */
@media (min-width:1300px){
  .rev-grid{grid-template-columns:repeat(3,1fr)}
  .pay-grid{grid-template-columns:repeat(3,1fr)}
}

/* ==== shirina: край ==== */

/*
 * ДВЕТЕ КОЛОНИ · равни вместо втората да е на 420.
 *
 * При 420 пиксела четирите подсказки не се побират и падат под
 * търсенето.
 */
/*
 * ПЪРВО ТЕСНИЯТ ЕКРАН, ПОСЛЕ ШИРОКИЯТ.
 *
 * При обратен ред правилото за телефон стои последно и отменя онова
 * за голям екран — затова двете колони падаха една под друга.
 */
@media (max-width:860px){
  .dsearch .wrap-w{grid-template-columns:1fr}
}

@media (min-width:861px){
  .dsearch .wrap-w{grid-template-columns:1.05fr .95fr;align-items:stretch}
}

/*
 * ДВЕТЕ КОЛОНИ · със същия избирач като онзи на ред 2314.
 *
 * Там стои „.dsearch > .wrap-w{grid-template-columns:1fr}“, който е
 * по-специфичен от обикновения и печелеше.
 */
@media (min-width:861px){
  .dsearch > .wrap-w{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:clamp(18px,2.4vw,32px);
    align-items:stretch;
  }
}

/* Двете колони · окончателно. */
section.dsearch > .wrap-w{
  display:grid !important;
  grid-template-columns:1.05fr .95fr !important;
  gap:clamp(18px,2.4vw,32px) !important;
  align-items:stretch !important;
}

@media (max-width:860px){
  section.dsearch > .wrap-w{grid-template-columns:1fr !important}
}

/* Текстът в подсказките · тъмен, окончателно. */
.dsearch .dtip .dtip-h,
.dsearch .dtip .dtip-c b{color:var(--ink) !important}

.dsearch .dtip .dtip-c span,
.dsearch .dtip .dtip-f{color:var(--ink-2) !important}

/* Трите оценки · по-широко разделени, за да не се сливат. */
.rev-scores{gap:clamp(26px,4vw,64px)}

/* Разделителна черта между тях · само на широк екран. */
@media (min-width:900px){
  .rev-score + .rev-score{
    padding-left:clamp(26px,4vw,64px);
    border-left:1px solid var(--line);
    margin-left:calc(-1 * clamp(26px,4vw,64px) / 2);
  }
}

/*
 * ТРИТЕ ОЦЕНКИ · равни разстояния.
 *
 * Предното правило местеше всяка втора наляво и затова разстоянията
 * излизаха различни. Тук няма отместване — само отстъп и черта.
 */
.rev-scores{gap:0}

.rev-score{padding-inline:clamp(18px,3vw,42px)}
.rev-score:first-child{padding-left:0}
.rev-score:last-child{padding-right:0}

@media (min-width:900px){
  .rev-score + .rev-score{
    border-left:1px solid var(--line);
    margin-left:0;
  }
}

@media (max-width:899px){
  .rev-scores{gap:clamp(18px,3vw,32px)}
  .rev-score{padding-inline:0}
  .rev-score + .rev-score{border-left:0}
}


/* ==== poddrujka: начало ==== */

/*
 * ═══ ПОДДРЪЖКАТА · ПОРТРЕТ И ВЪПРОСИ ═══
 *
 * Кръгъл портрет отляво със значка върху него; отдясно заглавието и
 * въпросите, които се отварят. Дотук секцията беше абзац до снимка ·
 * нищо за пипане и нищо, което да отговори на въпроса „а моят случай?“.
 *
 * Отварянето е на „details“ · част от HTML, работи без скрипт и с
 * клавиатура. Появяването при скролване се включва от скрипта — не се
 * ли зареди, всичко просто си стои видимо.
 */
/*
 * Фонът е зает от секцията „как хостингът влияе“ · същото меко
 * сияние горе вдясно и същият преход · за да не изглеждат двете
 * секции като от различни сайтове.
 */
.pd-sec{
  position:relative;overflow:hidden;
  background:
    radial-gradient(900px 400px at 88% -10%, rgba(94,154,0,.16), transparent 60%),
    linear-gradient(165deg, #F8FBF2 0%, var(--wash-2) 100%);
}

.pd{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:clamp(28px,5vw,60px);
  align-items:center;
}

.pd-i{order:1;display:flex;justify-content:center}
.pd-t{order:2}

.pd-kick{
  display:inline-block;margin:0 0 10px;
  font:700 11.5px/1 var(--sans);letter-spacing:.14em;
  text-transform:uppercase;color:#7cbf00;
}

.pd-t h2{
  margin:0 0 14px;
  font:800 clamp(1.35rem,2.7vw,1.95rem)/1.2 var(--sans);
  letter-spacing:-.035em;max-width:24ch;
}

.pd-t p{margin:0;font-size:15.5px;line-height:1.72;color:var(--ink-2);max-width:56ch}

/* ── портретът ── */
.pd-ph{position:relative;width:100%;max-width:420px}

.pd-ph picture{display:block}

.pd-ph img{
  /*
   * „height:auto“ НЕ Е излишно.
   *
   * В разметката снимката носи height="933" · това е подсказка към
   * браузъра и действа като „height:933px“, който побеждава
   * „aspect-ratio“. Кръгът се разтягаше на висока елипса.
   */
  width:100%;height:auto;aspect-ratio:1 / 1;
  object-fit:cover;object-position:50% 28%;
  border-radius:50%;
  box-shadow:var(--sh-l);
  display:block;
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
}

.pd-ph:hover img{transform:scale(1.02)}

.pd-badge{
  position:absolute;right:-6px;bottom:22px;
  display:flex;align-items:center;gap:8px;
  padding:8px 14px;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:100px;
  box-shadow:var(--sh);
  font:600 12.5px/1 var(--sans);
  white-space:nowrap;
}

.pd-badge b{font-weight:600}

.pd-dot{
  position:relative;flex:none;
  width:8px;height:8px;border-radius:50%;background:var(--ok);
}

.pd-dot::after{
  content:'';position:absolute;inset:-4px;
  border-radius:50%;border:1.5px solid var(--ok);
  animation:pdPulse 2.4s ease-out infinite;
}

@keyframes pdPulse{
  0%{transform:scale(.6);opacity:.6}
  70%{transform:scale(1.3);opacity:0}
  100%{opacity:0}
}

/* ── въпросите ── */
.pd-qa{margin:26px 0 0;display:grid;gap:10px}

/* Всеки въпрос е карта · заоблена като съседните секции. */
.pd-qa details{
  position:relative;overflow:hidden;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:15px;
  transition:transform .2s cubic-bezier(.2,.9,.2,1),box-shadow .2s,border-color .2s;
}

.pd-qa details:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(14,39,69,.09);
  border-color:#7cbf0033;
}

/* Петното в ъгъла · расте при отваряне, както при картите. */
.pd-qa details::before{
  content:'';position:absolute;top:-34px;right:-34px;
  width:110px;height:110px;border-radius:50%;
  background:#5E9A00;opacity:.07;
  transition:transform .35s cubic-bezier(.2,.9,.2,1);
}

.pd-qa details[open]::before{transform:scale(1.5)}
.pd-qa details > *{position:relative;z-index:1}

.pd-qa summary{
  list-style:none;cursor:pointer;
  position:relative;
  padding:16px 44px 16px 18px;
  font:600 14.5px/1.4 var(--sans);
  transition:color .2s ease;
}

.pd-qa summary::-webkit-details-marker{display:none}
.pd-qa summary:hover{color:#7cbf00}
.pd-qa summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:var(--r)}

.pd-qa summary::after{
  content:'';position:absolute;right:18px;top:50%;
  width:9px;height:9px;
  border:solid var(--ink-3);border-width:0 1.8px 1.8px 0;
  transform:translateY(-70%) rotate(45deg);
  transition:transform .25s ease;
}

.pd-qa details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}

.pd-qa p{
  margin:0 18px 16px;
  font-size:14.5px;line-height:1.7;color:var(--ink-2);max-width:60ch;
  animation:pdIn .26s ease both;
}

@keyframes pdIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* ── появяване при скролване ── */
.pd-anim .pd-ph{opacity:0;transform:scale(1.015)}
.pd-anim .pd-t > *{opacity:0;transform:translateY(14px)}

.pd-anim.pd-in .pd-ph{
  opacity:1;transform:none;
  transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1);
}

.pd-anim.pd-in .pd-t > *{
  opacity:1;transform:none;
  transition:opacity .55s ease var(--d,0s),transform .6s cubic-bezier(.2,.8,.2,1) var(--d,0s);
}

.pd-t > *:nth-child(1){--d:.14s}
.pd-t > *:nth-child(2){--d:.22s}
.pd-t > *:nth-child(3){--d:.30s}
.pd-t > *:nth-child(4){--d:.38s}

@media (prefers-reduced-motion:reduce){
  .pd-ph img,.pd-qa summary,.pd-qa summary::after{transition:none}
  .pd-ph:hover img{transform:none}
  .pd-dot::after{animation:none;opacity:.3}
  .pd-qa p{animation:none}
  .pd-anim .pd-ph,.pd-anim .pd-t > *{opacity:1;transform:none;transition:none}
}

/* ── тесен екран ── */
@media (max-width:860px){
  .pd{grid-template-columns:1fr;gap:26px}
  .pd-ph{max-width:320px}
  .pd-badge{right:0;bottom:14px}
}

/* ==== poddrujka: край ==== */

/*
 * ═══ ЗАГЛАВИЕТО С ОЦЕНКИТЕ · БЕЗ КУТИЯ ═══
 *
 * Рамката около заглавието и белият фон под оценките ги отделяха от
 * останалото без нужда.
 */
.rev-head{
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
}

.rev-score{
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  padding-block:0 !important;
}







/* ==== welc: начало ==== */

/*
 * ═══ ДОБРЕ ДОШЛИ · ВМЕСТО ПЛОЧКИТЕ ═══
 *
 * Текст отляво, рисуван човек отдясно.
 *
 * ЗА ВРЪЩАНЕ · махни блока между маркерите.
 */
.welc{
  position:relative;
  overflow:hidden;
  padding:clamp(48px,6vw,92px) clamp(20px,4vw,44px);
  background:#F5F8FC;
}

/* Косото зелено петно · дава посока на равнината. */
.welc::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(195deg, rgba(152,219,28,.11) 0 34%, transparent 34%);
}

.welc-in{position:relative;z-index:1;max-width:1180px;margin:0 auto}

.welc-g{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(30px,5vw,64px);
  align-items:center;
}

/* ── текстът ── */
.welc-kick{
  display:inline-block;
  margin-bottom:16px;
  font:700 11px/1 var(--sans);
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#7cbf00;
}

.welc h2{
  margin:0 0 15px;
  font:800 clamp(1.8rem,4vw,2.6rem)/1.1 var(--sans);
  letter-spacing:-.042em;
  max-width:17ch;
}

.welc-lead{
  margin:0 0 26px;
  font-size:15.5px;
  line-height:1.72;
  color:var(--ink-2);
  max-width:44ch;
}

/* ── трите стъпки ── */
.welc-steps{display:grid;gap:14px;margin-bottom:28px}

.welc-st{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:15px;
  align-items:start;
}

.welc-st i{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:10px;
  flex:0 0 auto;
  background:#F4FCE3;
  color:#7cbf00;
  font:800 13px/1 var(--mono);
  font-style:normal;
}

.welc-st b{
  display:block;
  margin-bottom:3px;
  font:700 14.5px/1.4 var(--sans);
}

.welc-st span{
  display:block;
  font-size:13.5px;
  line-height:1.55;
  color:var(--ink-2);
}

/* ── бутонът ── */
.welc-go{display:flex;gap:12px;flex-wrap:wrap;align-items:center}

.welc-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  height:50px;
  padding:0 28px;
  border-radius:12px;
  text-decoration:none;
  background:linear-gradient(135deg,#B4E845,#7cbf00 52%,#7cbf00);
  color:#16250A;
  font:700 14.5px/1 var(--sans);
  box-shadow:0 10px 26px -6px rgba(152,219,28,.55);
  transition:transform .2s, box-shadow .2s;
}
.welc-btn:hover{transform:translateY(-2px);text-decoration:none;color:#16250A}

.welc-btn svg{width:16px;height:16px;transition:transform .25s}
.welc-btn:hover svg{transform:translateX(3px)}

.welc-from{font-size:13px;color:var(--ink-3)}
.welc-from b{
  font:800 1.1rem/1 var(--mono);
  color:var(--ink);
  letter-spacing:-.03em;
}

/* ── рисунката ── */
.welc-art{position:relative}
.welc-art svg{width:100%;height:auto;display:block;overflow:visible}

/*
 * ═══ ДВИЖЕНИЯТА ═══
 *
 * Всяко е поотделно и с различна дължина, за да не съвпадат —
 * иначе човекът би изглеждал като едно люлеене.
 */

/* Дишането · цялото тяло се вдига и спуска. */
@keyframes welc-dishane{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}
.welc-body{
  animation:welc-dishane 4s ease-in-out infinite;
  transform-origin:center bottom;
}

/* Кимането · само главата. */
@keyframes welc-kimane{
  0%,100%{transform:rotate(0deg)}
  30%{transform:rotate(3deg)}
  60%{transform:rotate(-2deg)}
}
.welc-head{
  animation:welc-kimane 5.4s ease-in-out infinite;
  transform-origin:50% 100%;
}

/* Мигането · клепачите се спускат за миг. */
@keyframes welc-migane{
  0%,92%,100%{transform:scaleY(1)}
  96%{transform:scaleY(.08)}
}
.welc-eye{
  animation:welc-migane 4.8s ease-in-out infinite;
  transform-origin:center;
}

/* Махането · само ръката, от рамото. */
@keyframes welc-mahane{
  0%,100%{transform:rotate(0deg)}
  25%{transform:rotate(-18deg)}
  75%{transform:rotate(-6deg)}
}
.welc-wave{
  animation:welc-mahane 2.2s ease-in-out infinite;
  transform-origin:top left;
}

/* Трите знака · пулсират един след друг. */
@keyframes welc-puls{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(1.3);opacity:.6}
}
.welc-dot{animation:welc-puls 2.4s ease-in-out infinite}
.welc-dot:nth-of-type(2){animation-delay:.5s}
.welc-dot:nth-of-type(3){animation-delay:1s}

/*
 * ЗА ХОРАТА, КОИТО НЕ ИСКАТ ДВИЖЕНИЕ.
 *
 * Някои се чувстват зле от движещи се неща на екрана. Браузърът
 * знае това и го казва — тук го уважаваме.
 */
@media (prefers-reduced-motion:reduce){
  .welc-body,.welc-head,.welc-eye,.welc-wave,.welc-dot{animation:none}
}

@media (max-width:980px){
  .welc-g{grid-template-columns:1fr}
  .welc-art{order:-1;max-width:400px;margin:0 auto}
}

/* ==== welc: край ==== */

/* ==== plan-c: начало ==== */

/*
 * ═══ ПЛОЧКИТЕ С ПЛАНОВЕ · РЕДОВЕ С ФОН ПРЕЗ ЕДИН ═══
 *
 * Всеки ред заема цялата ширина: отметка, име отляво, число отдясно.
 * Всеки втори е със сив фон, затова окото го следва без усилие.
 *
 * ЗА ВРЪЩАНЕ · махни блока между маркерите и върни старата функция.
 */

.plan-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  align-items:stretch;
}

.plan-card{
  position:relative;
  display:flex;
  flex-direction:column;
  height:100%;
  overflow:hidden;
  padding:0;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:0 1px 3px rgba(10,22,40,.06), 0 10px 28px -12px rgba(10,22,40,.16);
  transition:transform .24s cubic-bezier(.2,.9,.2,1), box-shadow .24s;
}
.plan-card:hover{
  transform:translateY(-5px);
  box-shadow:0 2px 5px rgba(10,22,40,.07), 0 24px 52px -16px rgba(10,22,40,.24);
}
.plan-card.is-featured{border-color:#7cbf00;border-width:2px}

/* ── лентата „най-често избиран“ ── */
.pl-top{
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:1;
  padding:7px;
  text-align:center;
  background:linear-gradient(90deg,#7cbf00,#7cbf00 52%,#7cbf00);
  color:#16250A;
  font:800 10px/1 var(--sans);
  letter-spacing:.1em;
  text-transform:uppercase;
}

/* ── отстъпката в ъгъла ── */
.pl-off{
  position:absolute;
  top:0;
  right:0;
  z-index:2;
  padding:7px 13px;
  border-radius:0 15px 0 12px;
  background:#D93A5C;
  color:#fff;
  font:800 12px/1 var(--mono);
  letter-spacing:-.02em;
}

/* ── име и описание ── */
.pl-head{padding:24px 22px 20px;border-bottom:1px solid var(--line)}
.plan-card.is-featured .pl-head{padding-top:42px}

.pl-head h3{
  margin:0 0 4px;
  font:800 1.3rem/1.08 var(--sans);
  letter-spacing:-.034em;
}
.pl-head p{
  margin:0;
  font-size:12px;
  line-height:1.45;
  color:var(--ink-3);
  height:35px;
  overflow:hidden;
}

/* ── цената ── */
.plan-card .pl-price{
  padding:20px 22px 18px;
  border-bottom:1px solid var(--line);
  background:none;
  border-radius:0;
}
.plan-card.is-featured .pl-price{
  background:linear-gradient(160deg,#F4FCE3,rgba(244,252,227,.35));
}

.pl-price .n{display:flex;align-items:baseline;gap:4px;margin-bottom:4px}
.pl-price .n b{font:800 2.3rem/1 var(--mono);letter-spacing:-.058em}
.plan-card.is-featured .pl-price .n b{color:#7cbf00}
.pl-price .n i{font-style:normal;font:700 1.1rem/1 var(--mono);color:var(--ink-2)}
.pl-price .n span{margin-left:3px;font-size:12.5px;color:var(--ink-3);font-weight:600}

.pl-price .old{display:block;font-size:12px;color:var(--ink-3);height:18px}
.pl-price .old s{margin-right:6px}
.pl-price .old em{font-style:normal;color:#D93A5C;font-weight:700}

/* ── редът с подновяването ── */
.pl-ren{
  padding:12px 22px;
  background:var(--wash);
  border-bottom:1px solid var(--line);
  font-size:11.5px;
  line-height:1.5;
  color:var(--ink-3);
}
.pl-ren b{color:var(--ink);font-weight:700}
.plan-card.is-featured .pl-ren{background:rgba(244,252,227,.5)}

/* ── подаръкът ── */
.pl-gift{
  display:flex;
  align-items:center;
  gap:9px;
  padding:12px 22px;
  background:linear-gradient(90deg,rgba(240,168,30,.12),rgba(240,168,30,.03));
  border-bottom:1px solid var(--line);
  font:700 12px/1.4 var(--sans);
  color:#8A5E10;
}
.pl-gift svg{width:15px;height:15px;color:#F0A81E;flex:0 0 auto}

/* ── тялото ── */
.pl-body{
  padding:18px 22px 20px;
  flex:1;
  display:flex;
  flex-direction:column;
}

/*
 * СПИСЪКЪТ · всеки втори ред е със сив фон.
 *
 * Така окото следва реда от името до числото, без да се губи по
 * средата — особено при широка карта.
 */
.pl-list{
  border-radius:11px;
  overflow:hidden;
  margin-bottom:16px;
  border:1px solid var(--line);
}

.pl-r{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 14px;
  font-size:12.5px;
  color:var(--ink-2);
  background:var(--paper);
}
.pl-r:nth-child(odd){background:var(--wash)}
.plan-card.is-featured .pl-r:nth-child(odd){background:rgba(244,252,227,.55)}

.pl-r span{min-width:0}
.pl-r b{
  margin-left:auto;
  font:700 13px/1 var(--mono);
  color:var(--ink);
  white-space:nowrap;
}
.pl-r svg{width:14px;height:14px;color:#7cbf00;flex:0 0 auto}

.pl-r.is-no b,
.pl-r.is-no svg{color:var(--line-2, #C9D3E0)}

/* Подзаглавието на групата · вътре в списъка, без да губи място. */
.pl-h{
  padding:8px 14px;
  background:var(--ink);
  color:#fff;
  font:700 8.5px/1.5 var(--sans);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.plan-card.is-featured .pl-h{background:#7cbf00}

/* ── бутонът ── */
.pl-go{margin-top:auto;padding-top:16px}

.pl-go a{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  height:46px;
  border-radius:10px;
  text-decoration:none;
  background:var(--navy, #0A1628);
  color:#fff;
  font:700 14px/1 var(--sans);
  transition:transform .2s, box-shadow .2s;
}
.pl-go a:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px -6px rgba(10,22,40,.34);
  text-decoration:none;
  color:#fff;
}
.plan-card.is-featured .pl-go a{
  background:linear-gradient(135deg,#B4E845,#7cbf00 52%,#7cbf00);
  color:#16250A;
  box-shadow:0 8px 22px -6px rgba(152,219,28,.5);
}
.plan-card.is-featured .pl-go a:hover{color:#16250A}

.pl-go a svg{width:15px;height:15px;transition:transform .25s}
.pl-go a:hover svg{transform:translateX(3px)}

@media (max-width:1400px){
  .plan-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:660px){
  .plan-grid{grid-template-columns:1fr}
  .pl-head p{height:auto}
}

/* ==== plan-c: край ==== */

/*
 * ТОЧНИТЕ ЦВЕТОВЕ ОТ МАКЕТА.
 *
 * Дотук стилът ползваше променливите на сайта, а те са други —
 * затова се разминаваше. Тук стойностите са вписани направо.
 */
.plan-card{background:#fff !important;border-color:#E6EBF2 !important}
.plan-card.is-featured{border-color:#7cbf00 !important}

.pl-head{border-bottom-color:#E6EBF2 !important}
.pl-head h3{color:#0A1628 !important}
.pl-head p{color:#8494AC !important}

.plan-card .pl-price{border-bottom-color:#E6EBF2 !important;background:none !important}
.plan-card.is-featured .pl-price{
  background:linear-gradient(160deg,#F4FCE3,rgba(244,252,227,.35)) !important}
.pl-price .n b{color:#0A1628 !important}
.plan-card.is-featured .pl-price .n b{color:#7cbf00 !important}
.pl-price .n i{color:#44526B !important}
.pl-price .n span{color:#8494AC !important}
.pl-price .old{color:#8494AC !important}

.pl-ren{background:#F7F9FC !important;border-bottom-color:#E6EBF2 !important;
        color:#8494AC !important}
.pl-ren b{color:#0A1628 !important}
.plan-card.is-featured .pl-ren{background:rgba(244,252,227,.5) !important}

.pl-gift{border-bottom-color:#E6EBF2 !important;color:#8A5E10 !important}

.pl-list{border-color:#E6EBF2 !important}
.pl-r{background:#fff !important;color:#44526B !important}
.pl-r:nth-child(odd){background:#F7F9FC !important}
.plan-card.is-featured .pl-r:nth-child(odd){background:rgba(244,252,227,.55) !important}
.pl-r b{color:#0A1628 !important}
.pl-r svg{color:#7cbf00 !important}
.pl-r.is-no b,.pl-r.is-no svg{color:#C9D3E0 !important}

.pl-h{background:#0A1628 !important;color:#fff !important}
.plan-card.is-featured .pl-h{background:#7cbf00 !important}

.pl-go a{background:#0A1628 !important;color:#fff !important}
.plan-card.is-featured .pl-go a{
  background:linear-gradient(135deg,#B4E845,#7cbf00 52%,#7cbf00) !important;
  color:#16250A !important}

/*
 * ЧЕРВЕНОТО И ЗЕЛЕНОТО ОТ МАКЕТА.
 *
 * Отстъпката е червена, лентата „най-често избиран“ е зелена
 * преливка, фонът на раздела е светлосин с ореол.
 */

/* Отстъпката в ъгъла · червена. */
.pl-off{background:#D93A5C !important;color:#fff !important}

/* Лентата отгоре · зелена преливка. */
.pl-top{
  background:linear-gradient(90deg,#7cbf00,#7cbf00 52%,#7cbf00) !important;
  color:#16250A !important;
}

/* Спестеното · червено, за да личи. */
.pl-price .old em{color:#D93A5C !important}

/* Подаръкът · златна лента. */
.pl-gift{
  background:linear-gradient(90deg,rgba(240,168,30,.12),rgba(240,168,30,.03)) !important;
}
.pl-gift svg{color:#F0A81E !important}

/*
 * ФОНЪТ НА РАЗДЕЛА · светлосин с меко зелено сияние.
 *
 * В макета разделът има свой фон, не бял.
 */
.sec:has(.plan-grid),
.sec-wash:has(.plan-grid),
section:has(> .wrap-w > .plan-grid){
  position:relative;
  background:linear-gradient(180deg,#FBFCFE,#EDF2F8) !important;
}

section:has(.plan-grid)::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(900px 440px at 50% -12%,
             rgba(152,219,28,.13), transparent 60%);
}

section:has(.plan-grid) > *{position:relative;z-index:1}

/*
 * ═══ ЕДНО КЪМ ЕДНО С МАКЕТА ═══
 *
 * Старият стил на сайта правеше имената с главни букви и центрирани.
 * Тук се връщат както са в макета: нормални букви, подравнени вляво.
 */
.plan-card .pl-head{text-align:left !important}

.plan-card .pl-head h3{
  text-transform:none !important;
  text-align:left !important;
  font:800 1.3rem/1.08 var(--sans) !important;
  letter-spacing:-.034em !important;
  color:#0A1628 !important;
  margin:0 0 4px !important;
}

.plan-card .pl-head p{
  text-align:left !important;
  font:400 12px/1.45 var(--sans) !important;
  color:#8494AC !important;
  margin:0 !important;
}

/* Празното описание не заема място. */
.plan-card .pl-head p:empty{display:none}

/* Цената · подравнена вляво, както в макета. */
.plan-card .pl-price{text-align:left !important}
.plan-card .pl-price .n{justify-content:flex-start !important}

/* Редът „плащате X за 12 месеца“ · под цената. */
.pl-once{
  padding:10px 22px;
  background:#F7F9FC;
  border-bottom:1px solid #E6EBF2;
  font-size:11.5px;
  line-height:1.5;
  color:#8494AC;
}
.pl-once b{color:#0A1628;font-weight:700}
.plan-card.is-featured .pl-once{background:rgba(244,252,227,.5)}

/* Спестеното · червено, до зачертаната цена. */
.plan-card .pl-price .old{
  display:flex !important;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  font-size:12px;
  color:#8494AC;
  height:auto;
}
.plan-card .pl-price .old s{
  color:#8494AC;
  text-decoration:line-through;
}
.plan-card .pl-price .old em{
  font-style:normal;
  color:#D93A5C !important;
  font-weight:700;
}

/* Спестеното · червено, окончателно. */
.plan-card .pl-price span.old,
.plan-card .pl-price .old{
  display:flex !important;
  align-items:baseline !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  height:auto !important;
  font-size:12px !important;
  color:#8494AC !important;
}

.plan-card .pl-price .old s{
  color:#8494AC !important;
  text-decoration:line-through !important;
  font-weight:400 !important;
}

.plan-card .pl-price .old em,
.plan-card .pl-price span.old em{
  font-style:normal !important;
  color:#D93A5C !important;
  font-weight:700 !important;
  display:inline !important;
}

/* ==== sh-more: начало ==== */

/* Скритите редове на таблицата. */
.sh-tbl tr.hid{display:none}
.sh-tbl.is-open tr.hid{display:table-row}

/* Бутонът за разгъване. */
.sh-more{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:100%;
  margin-top:14px;
  padding:14px;
  border:1px solid #C9D3E0;
  border-radius:11px;
  background:#fff;
  cursor:pointer;
  font:700 13.5px/1 var(--sans);
  color:#0A1628;
  transition:background .2s, border-color .2s;
}
.sh-more:hover{background:#F7F9FC;border-color:#8494AC}

.sh-more svg{width:16px;height:16px;transition:transform .26s}
.sh-tbl.is-open + .sh-more svg,
.sh-more.is-open svg{transform:rotate(180deg)}

/* ==== sh-more: край ==== */

/*
 * ═══ КРЪГЛАТА СТРЕЛКА ═══
 *
 * Седи върху долния ръб на таблицата, наполовина вътре и наполовина
 * навън — като копче на капак.
 */
.sh-tbl{position:relative;padding-bottom:26px}

.sh-more{
  position:absolute !important;
  bottom:0;
  left:50%;
  transform:translate(-50%, 50%);
  z-index:2;

  display:grid !important;
  place-items:center;
  width:52px !important;
  height:52px;
  padding:0 !important;
  margin:0 !important;
  border-radius:50% !important;

  background:#fff;
  border:1px solid #C9D3E0;
  box-shadow:0 2px 6px rgba(10,22,40,.08), 0 10px 26px -8px rgba(10,22,40,.24);
  cursor:pointer;
  transition:transform .24s cubic-bezier(.2,.9,.2,1),
             box-shadow .24s, border-color .2s;
}
.sh-more:hover{
  transform:translate(-50%, 50%) scale(1.08);
  border-color:#7cbf00;
  box-shadow:0 3px 8px rgba(10,22,40,.1), 0 14px 32px -8px rgba(10,22,40,.3);
}

/* Надписът се скрива · остава само стрелката. */
.sh-more span{display:none}

.sh-more svg{
  width:20px !important;
  height:20px !important;
  color:#0A1628;
  transition:transform .3s cubic-bezier(.2,.9,.2,1);
}
.sh-more.is-open svg{transform:rotate(180deg)}

/* Мястото под таблицата, когато е разгъната. */
.sh-tbl.is-open{padding-bottom:26px}

/*
 * ═══ КРЪГЛОТО КОПЧЕ · плътно, върху линията ═══
 *
 * Зелена преливка вместо бяло с рамка. Линията минава точно през
 * средата му, затова изглежда като част от таблицата, не залепено
 * отгоре.
 */
.sh-tbl{position:relative;padding-bottom:0 !important}

/* Линията, през която минава копчето. */
.sh-tbl::after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:26px;
  height:1px;
  background:#E6EBF2;
  pointer-events:none;
}
.sh-tbl.is-open::after{display:none}

.sh-more{
  position:absolute !important;
  bottom:0 !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  z-index:3;

  display:grid !important;
  place-items:center;
  width:52px !important;
  height:52px !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:50% !important;

  background:linear-gradient(140deg,#B4E845,#7cbf00 50%,#7cbf00) !important;
  box-shadow:0 4px 14px -2px rgba(152,219,28,.55),
             0 0 0 5px #fff !important;
  cursor:pointer;
  transition:transform .26s cubic-bezier(.2,.9,.2,1), box-shadow .26s;
}
.sh-more:hover{
  transform:translateX(-50%) translateY(2px) !important;
  box-shadow:0 8px 22px -2px rgba(152,219,28,.7),
             0 0 0 5px #fff !important;
}

.sh-more span{display:none !important}

.sh-more svg{
  width:22px !important;
  height:22px !important;
  color:#16250A !important;
  stroke-width:3 !important;
  transition:transform .32s cubic-bezier(.2,.9,.2,1);
}
.sh-more.is-open svg{transform:rotate(180deg)}

/* Копчето · на долния ръб на целия блок, не върху реда с цените. */
.sh-tbl{position:relative;padding-bottom:30px}
.sh-tbl table{margin-bottom:0}

.sh-more{
  position:absolute !important;
  left:50% !important;
  bottom:0 !important;
  transform:translate(-50%, 50%) !important;
}
.sh-more:hover{transform:translate(-50%, 50%) scale(1.08) !important}

/* ==== sh-tbl-mob: начало ==== */

/*
 * ═══ ТАБЛИЦАТА НА ТЕЛЕФОН ═══
 *
 * Пет колони не се побират на екран от 360 пиксела. Таблицата се
 * плъзга настрани, а първата колона с имената остава закована —
 * иначе човек забравя кой ред гледа.
 */
@media (max-width:900px){

  .sh-tbl{
    overflow-x:auto;
    overflow-y:visible;
    -webkit-overflow-scrolling:touch;

    /* Меко избледняване вдясно · подсказва, че има още. */
    -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);
    mask-image:linear-gradient(90deg,#000 88%,transparent);
  }

  .sh-tbl.is-end{
    -webkit-mask-image:none;
    mask-image:none;
  }

  .sh-tbl table{
    min-width:600px;
    font-size:13px;
  }

  /* Първата колона остава на място при плъзгане. */
  .sh-tbl th:first-child,
  .sh-tbl td:first-child{
    position:sticky;
    left:0;
    z-index:2;
    background:#fff;
    min-width:132px;
    max-width:132px;
    box-shadow:6px 0 12px -6px rgba(10,22,40,.16);
  }

  .sh-tbl thead th:first-child{z-index:3}

  .sh-tbl td:first-child b{
    font-size:12px;
    line-height:1.35;
    display:block;
  }

  .sh-tbl th,
  .sh-tbl td{
    padding:10px 12px;
    white-space:nowrap;
  }

  /* Копчето се маха от плъзгащата се част. */
  .sh-more{
    position:static !important;
    transform:none !important;
    width:100% !important;
    height:46px !important;
    border-radius:11px !important;
    margin-top:14px !important;
  }
  .sh-more:hover{transform:none !important}
  .sh-more span{display:inline !important;font:700 13.5px/1 var(--sans)}
  .sh-tbl{padding-bottom:0 !important}
  .sh-tbl::after{display:none}
}

@media (max-width:520px){
  .sh-tbl table{min-width:520px;font-size:12.5px}

  .sh-tbl th:first-child,
  .sh-tbl td:first-child{min-width:116px;max-width:116px}

  .sh-tbl th,
  .sh-tbl td{padding:9px 10px}
}

/* ==== sh-tbl-mob: край ==== */

/*
 * БЕЗ ИЗРЯЗВАНЕ НА ТЕЛЕФОН.
 *
 * Мекото избледняване вдясно скриваше част от последната колона.
 * Вместо него · тънка сянка, която подсказва, че има още, без да
 * крие съдържание.
 */
@media (max-width:900px){
  .sh-tbl{
    -webkit-mask-image:none !important;
    mask-image:none !important;

    /* Сянката се появява само докато има накъде да се плъзга. */
    background:
      linear-gradient(90deg, #fff 30%, rgba(255,255,255,0)) left center,
      linear-gradient(90deg, rgba(255,255,255,0), #fff 70%) right center,
      radial-gradient(farthest-side at 0 50%,
        rgba(10,22,40,.12), rgba(10,22,40,0)) left center,
      radial-gradient(farthest-side at 100% 50%,
        rgba(10,22,40,.12), rgba(10,22,40,0)) right center;
    background-repeat:no-repeat;
    background-size:36px 100%, 36px 100%, 14px 100%, 14px 100%;
    background-attachment:local, local, scroll, scroll;
  }
}

/*
 * ПЛЪЗГАНЕТО НА ТЕЛЕФОН · окончателно.
 *
 * По-ранно правило слагаше „overflow:visible !important“ заради
 * кръглото копче. На телефон то спираше плъзгането и таблицата се
 * режеше.
 *
 * Тук копчето излиза от плъзгащата се част, затова видимостта вече
 * не е нужна.
 */
@media (max-width:900px){
  .sh-tbl{
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    padding-bottom:0 !important;
    position:static !important;
  }

  .sh-tbl table{min-width:640px !important}

  /* Копчето излиза извън таблицата · обикновен бутон отдолу. */
  .sh-more{
    position:static !important;
    display:flex !important;
    width:100% !important;
    height:48px !important;
    margin:14px 0 0 !important;
    padding:0 18px !important;
    border-radius:11px !important;
    transform:none !important;
    box-shadow:0 6px 18px -4px rgba(152,219,28,.45) !important;
  }
  .sh-more:hover{transform:none !important}

  .sh-more span{
    display:inline !important;
    font:700 13.5px/1 var(--sans);
    color:#16250A;
  }

  .sh-tbl::after{display:none !important}
}

/*
 * КРЪГЛОТО КОПЧЕ И НА ТЕЛЕФОН.
 *
 * Същото както на компютър · зелено кръгче с бял ръб, на долния край
 * на таблицата.
 *
 * Стои извън плъзгащата се част, затова не пречи на прелистването.
 */
@media (max-width:900px){
  .sh-more{
    display:grid !important;
    place-items:center !important;
    width:52px !important;
    height:52px !important;
    padding:0 !important;
    margin:-26px auto 0 !important;
    border-radius:50% !important;
    position:relative !important;
    z-index:3;

    background:linear-gradient(140deg,#B4E845,#7cbf00 50%,#7cbf00) !important;
    box-shadow:0 4px 14px -2px rgba(152,219,28,.55),
               0 0 0 5px #fff !important;
  }

  .sh-more span{display:none !important}

  .sh-more svg{
    width:22px !important;
    height:22px !important;
    color:#16250A !important;
    stroke-width:3 !important;
  }
  .sh-more.is-open svg{transform:rotate(180deg)}

  /* Място под таблицата, за да има къде да седне копчето. */
  .sh-tbl{margin-bottom:26px !important}
}

/*
 * КОПЧЕТО ИЗЛИЗА ОТ ПЛЪЗГАЩАТА СЕ ЧАСТ.
 *
 * Дотук стоеше вътре в таблицата и се местеше с нея при прелистване
 * настрани — стигаше почти извън екрана.
 *
 * Тук цялата обвивка получава собствено място, а копчето сяда под
 * нея и не мърда.
 */
@media (max-width:900px){

  /* Плъзга се само таблицата, не обвивката. */
  .sh-tbl{
    overflow-x:auto;
    overflow-y:hidden;
    position:relative !important;
    margin-bottom:0 !important;
    padding-bottom:30px !important;
  }

  /* Самата таблица влиза в своя плъзгаща се кутия. */
  .sh-tbl table{
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    min-width:0 !important;
    width:100%;
  }

  .sh-tbl table tbody,
  .sh-tbl table thead{
    display:table;
    width:640px;
  }

  /* Копчето стои под таблицата и не се плъзга. */
  .sh-more{
    position:absolute !important;
    left:50% !important;
    bottom:0 !important;
    transform:translate(-50%, 50%) !important;
    margin:0 !important;
    z-index:4;
  }
  .sh-more:hover{transform:translate(-50%, 50%) !important}
}

/* ==== sh-tbl-svet: начало ==== */

/*
 * ═══ ТАБЛИЦАТА ПО-СВЕТЛА ═══
 *
 * Черната глава притискаше цялата таблица. Тук е светла с тънка
 * линия отдолу, а редовете се редуват през един — окото следва
 * реда, без стените да го гнетят.
 */
.sh-tbl table{
  border-collapse:separate !important;
  border-spacing:0;
  border-radius:14px;
  overflow:hidden;
  border:1px solid #E6EBF2;
  background:#fff;
}

/* ── главата ── */
.sh-tbl thead th{
  background:#F7F9FC !important;
  color:#0A1628 !important;
  border-bottom:2px solid #E6EBF2 !important;
  padding:16px 14px !important;
  font:700 13.5px/1.3 var(--sans) !important;
  letter-spacing:-.01em;
  text-transform:none !important;
}

/* Колоната на препоръчания · светлозелена. */
.sh-tbl thead th.best{
  background:#F4FCE3 !important;
  color:#3E5A0C !important;
  border-bottom-color:#7cbf00 !important;
}

.sh-tbl thead th:first-child{background:#F7F9FC !important}

/* ── редовете ── */
.sh-tbl tbody tr:nth-child(even) td{background:#FBFCFE}
.sh-tbl tbody tr:hover td{background:#F4F7FB}

.sh-tbl tbody td{
  padding:13px 14px !important;
  border-bottom:1px solid #EEF2F7 !important;
  color:#44526B !important;
  font-size:13.5px;
  background:#fff;
  transition:background .18s;
}
.sh-tbl tbody tr:last-child td{border-bottom:0 !important}

/* Имената на редовете. */
.sh-tbl tbody td:first-child{
  background:#FAFBFD !important;
  color:#0A1628 !important;
}
.sh-tbl tbody tr:nth-child(even) td:first-child{background:#F6F8FB !important}
.sh-tbl tbody td:first-child b{
  font:600 13px/1.4 var(--sans) !important;
  color:#0A1628 !important;
}

/* Колоната на препоръчания · лек зелен оттенък. */
.sh-tbl tbody td.best{background:#FCFEF7 !important}
.sh-tbl tbody tr:nth-child(even) td.best{background:#F8FDEF !important}
.sh-tbl tbody tr:hover td.best{background:#F2FBE0 !important}

/* Числата · едноширочинен шрифт, за да се подреждат. */
.sh-tbl td.mono{
  font:600 13px/1 var(--mono) !important;
  color:#0A1628 !important;
  letter-spacing:-.02em;
}

/* Отметките и кръстчетата. */
.sh-tbl i.yes{
  color:#7cbf00 !important;
  font-style:normal;
  font-size:16px;
  font-weight:700;
}
.sh-tbl i.no{
  color:#C9D3E0 !important;
  font-style:normal;
  font-size:15px;
}

/* ==== sh-tbl-svet: край ==== */



/* Подзаглавията вътре в таблицата · също светли. */
.sh-tbl .grp td,
.sh-tbl tr.grp td,
.sh-tbl td.grp,
.sh-tbl .sh-grp{
  background:#EEF2F7 !important;
  color:#44526B !important;
}

/* Тялото. */
.sh-tbl tbody td{
  background:#fff !important;
  color:#44526B !important;
  border-bottom:1px solid #EEF2F7 !important;
}
.sh-tbl tbody tr:nth-child(even) td{background:#FBFCFE !important}
.sh-tbl tbody tr:hover td{background:#F4F7FB !important}

/* Първата колона · с едва доловим оттенък. */
.sh-tbl tbody td:first-child{background:#FAFBFD !important}
.sh-tbl tbody tr:nth-child(even) td:first-child{background:#F6F8FB !important}
.sh-tbl tbody td:first-child b{color:#0A1628 !important}

/* Препоръчаната колона · зелен оттенък, не тъмнина. */
.sh-tbl tbody td.best{background:#FCFEF7 !important}
.sh-tbl tbody tr:nth-child(even) td.best{background:#F8FDEF !important}
.sh-tbl tbody tr:hover td.best{background:#F2FBE0 !important}

/* Числата и знаците. */
.sh-tbl td.mono,
.sh-tbl td.mono b{color:#0A1628 !important}
.sh-tbl i.yes{color:#7cbf00 !important}
.sh-tbl i.no{color:#C9D3E0 !important}

/*
 * ═══ ТАБЛИЦАТА И КАРТИТЕ НА ТЕЛЕФОН ═══
 *
 * Само за тесни екрани · на компютър нищо не се мени.
 */
@media (max-width:900px){

  /* ── таблицата се плъзга цялата, без изрязване ── */
  .sh-tbl{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    -webkit-mask-image:none;
    mask-image:none;
  }

  .sh-tbl table{min-width:620px}

  .sh-tbl th,
  .sh-tbl td{
    padding:11px 12px;
    font-size:12.5px;
    white-space:normal;
    word-break:normal;
    overflow-wrap:anywhere;
    hyphens:auto;
  }

  /* Имената на редовете · пренасят се на два реда вместо да излизат. */
  .sh-tbl td:first-child{min-width:140px;max-width:160px}
  .sh-tbl td:first-child b{
    font-size:12px;
    line-height:1.35;
    display:block;
    white-space:normal;
  }

  /* Числата не се пренасят · те са къси. */
  .sh-tbl td.mono{white-space:nowrap}

  /* ── дългите текстове в плочките ── */
  .pl-r{flex-wrap:wrap;align-items:flex-start}
  .pl-r span{
    flex:1 1 auto;
    min-width:0;
    white-space:normal;
    overflow-wrap:anywhere;
    line-height:1.4;
  }
  .pl-r b{
    flex:0 0 auto;
    margin-left:auto;
    white-space:nowrap;
  }

  .pl-head h3,
  .pl-head p,
  .pl-gift,
  .pl-ren{overflow-wrap:anywhere}

  .pl-price .old{
    flex-wrap:wrap;
    line-height:1.5;
  }
}

@media (max-width:520px){
  .sh-tbl table{min-width:540px}

  .sh-tbl th,
  .sh-tbl td{padding:10px;font-size:12px}

  .sh-tbl td:first-child{min-width:126px;max-width:140px}
}

/*
 * ═══ ТЕЛЕФОН · таблицата се плъзга, копчето е извън нея ═══
 *
 * Досега копчето седеше вътре в таблицата. Щом тя получи плъзгане,
 * всичко извън ръба ѝ се отрязваше — включително половината копче.
 *
 * Тук плъзга се само вътрешна обвивка, а копчето стои под нея.
 */
@media (max-width:900px){

  .sh-tbl{
    overflow:visible !important;
    position:relative !important;
    padding-bottom:0 !important;
    margin-bottom:66px !important;
  }

  /* Плъзга се самата таблица, не обвивката. */
  .sh-tbl table{
    display:block !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    width:100% !important;
    min-width:0 !important;
    border-radius:14px;
  }

  .sh-tbl thead,
  .sh-tbl tbody{
    display:table !important;
    width:620px !important;
  }

  /*
   * Копчето · изцяло под таблицата, както на компютър.
   *
   * При -26 половината му стоеше върху реда с цената; при -52 слиза
   * цялото под него.
   */
  .sh-more{
    position:absolute !important;
    left:50% !important;
    bottom:-52px !important;
    transform:translateX(-50%) !important;
    z-index:5;
    margin:0 !important;
  }
  .sh-more:hover{transform:translateX(-50%) !important}
}

@media (max-width:520px){
  .sh-tbl thead,
  .sh-tbl tbody{width:540px !important}
}

/*
 * ТРИ ПЛАНА СЕ РАЗПЪВАТ ОТ КРАЙ ДО КРАЙ.
 *
 * Решетката е за четири колони. При три те просто стават три и се
 * разпъват на цялата ширина — същите като при споделения хостинг,
 * само по-широки.
 */
.plan-grid:has(> .plan-card:nth-child(3):last-child){
  grid-template-columns:repeat(3, minmax(0, 1fr));
}

.plan-grid:has(> .plan-card:nth-child(2):last-child){
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

@media (max-width:1400px){
  .plan-grid:has(> .plan-card:nth-child(3):last-child){
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:660px){
  .plan-grid:has(> .plan-card:nth-child(3):last-child),
  .plan-grid:has(> .plan-card:nth-child(2):last-child){
    grid-template-columns:minmax(0, 1fr);
  }
}
* ==========================================================================
   MaxBG · витрина

   Похватите са взети от това, което реално работи на българския пазар:
   планове по брой посещения, промо ивица с обратно броене, телефон в
   шапката, отзиви с оценки, партньорски лога, подробна таблица.

   Имената на класовете са запазени, за да наследят промяната всички
   страници наведнъж.
   ========================================================================== */

/*
 * Шрифтовете се зареждат само ако файловете наистина ги има.
 *
 * Липсващ woff2 не чупи страницата, но пълни лога с грешки при всяко
 * зареждане и бави рисуването, докато браузърът чака отговор.
 * Резервните са системни — четими навсякъде, без изтегляне.
 *
 * За да сложиш истинските:
 *   mkdir -p /var/www/maxbg.net/public/fonts
 *   и копирай onest.woff2 и jetbrains-mono.woff2 там
 */
@font-face{
  font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;
  src:url(/fonts/onest-cyrillic-400-normal.woff2) format('woff2');
}
@font-face{
  font-family:'JetBrains Mono';font-style:normal;font-weight:500 700;font-display:swap;
  src:url(/fonts/jetbrains-mono-cyrillic-wght-normal.woff2) format('woff2');
}

:root{
  /* --- мастило и хартия --- */
  --navy:#0E2745; --navy-2:#173654; --navy-3:#22496D; --navy-deep:#0A1D33;
  --paper:#FFFFFF; --wash:#F5F7FA; --wash-2:#EDF1F6;
  --line:#DFE5EC; --line-2:#C7D1DD; --line-3:#AEBBCB;
  --ink:#0E2745; --ink-2:#48586C; --ink-3:#7A8899;

  /* --- акцент: казанлъшка роза --- */
  --rose:#C0335C; --rose-2:#A32949; --rose-w:#FDF1F4;

  /* --- състояния --- */
  --ok:#127A55; --ok-w:#E7F5EF;
  --warn:#9A6A12; --warn-w:#FBF4E4;
  --bad:#B0342C; --bad-w:#FDF0EE;
  --blue:#1C5FA8; --blue-w:#EAF2FB;
  --star:#F0A81E;

  /* Резервните са изброени нарочно: при липсващ woff2 текстът пак
     изглежда прилично, вместо да падне на Times. */
  --sans:'Onest',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,'DejaVu Sans Mono',monospace;

  --r:6px; --r-md:8px; --r-lg:10px;
  --sh-s:0 1px 2px rgba(14,39,69,.05);
  --sh:0 2px 10px rgba(14,39,69,.06);
  --sh-l:0 16px 44px rgba(14,39,69,.14);
  --sh-xl:0 24px 60px rgba(14,39,69,.2);
}

/* ==========================================================================
   Основа
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}

body{
  margin:0;background:var(--paper);color:var(--ink);
  font:400 15px/1.55 var(--sans);
  font-variant-numeric:tabular-nums;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}

h1,h2,h3,h4,h5{margin:0;font-weight:800;letter-spacing:-.035em;line-height:1.2}
h1{font-size:clamp(1.6rem,3.2vw,2.2rem)}
h2{font-size:clamp(1.35rem,2.6vw,1.75rem)}
h3{font-size:1.08rem}
h4{font-size:.95rem}
p{margin:0}
ul,ol{margin:0;padding:0}

a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
button{font-family:inherit}
img,svg,video{display:block;max-width:100%}
table{border-collapse:collapse}

::selection{background:var(--rose-w);color:var(--rose-2)}
:focus-visible{outline:2px solid var(--rose);outline-offset:2px;border-radius:3px}

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.mono{font-family:var(--mono)}
.ta-r,.tb-right{text-align:right}

.wrap-w{max-width:1280px;margin-inline:auto;padding-inline:22px}
.wrap-n{max-width:840px;margin-inline:auto;padding-inline:22px}

/* ==========================================================================
   Бутони
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font:600 15px/1 var(--sans);padding:12px 22px;border-radius:var(--r);
  background:var(--rose);color:#fff;border:1px solid var(--rose);
  cursor:pointer;white-space:nowrap;text-decoration:none;
  transition:background .14s,border-color .14s,color .14s,box-shadow .14s;
}
.btn:hover{background:var(--rose-2);border-color:var(--rose-2);color:#fff;text-decoration:none}
.btn:active{transform:translateY(.5px)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn svg{width:15px;height:15px;flex:0 0 auto;stroke-width:2}

.btn-sm{font-size:14px;padding:9px 15px}
.btn-lg{font-size:16px;padding:14px 28px}

.btn-ghost{background:none;color:#060606;border-color:#7cbf00;}
.btn-ghost:hover{background:none;color:var(--ink);border-color:var(--ink-3)}

.btn-light{background:#fff;color:var(--navy);border-color:#fff}
.btn-light:hover{background:var(--wash-2);border-color:var(--wash-2);color:#ffffff;}

.btn-navy{background:var(--navy);border-color:var(--navy)}
.btn-navy:hover{background:var(--navy-2);border-color:var(--navy-2)}

.link-back{font-size:14px;color:var(--ink-2);font-weight:500}
.link-back:hover{color:var(--rose)}
.link-danger{
  background:none;border:0;padding:0;cursor:pointer;font:500 14px/1 var(--sans);
  color:var(--ink-2);text-decoration:underline;text-underline-offset:3px;
}
.link-danger:hover{color:var(--bad)}

/* ==========================================================================
   Промо ивица
   ========================================================================== */
.topbar{
  background:linear-gradient(90deg,var(--rose) 0%,#8E2544 100%);color:#fff;font-size:13.5px;
}
.topbar .wrap-w{display:flex;align-items:center;gap:14px;padding-block:6px;min-height:48px;flex-wrap:wrap}
.topbar a{color:#fff;text-decoration:underline;text-underline-offset:3px;font-weight:600}
.topbar b{font-weight:700}
.topbar .tag{
  background:rgba(255,255,255,.22);border-radius:4px;padding:3px 9px;
  font:700 11px/1 var(--mono);letter-spacing:.06em;flex:0 0 auto;
}
.topbar .cd{margin-left:auto;display:flex;align-items:center;gap:5px;font-size:12.5px}
.topbar .cd i{
  font-style:normal;background:rgba(0,0,0,.2);border-radius:4px;padding:4px 7px;
  font:700 13px/1 var(--mono);
}

/* ==========================================================================
   Служебна лента
   ========================================================================== */
.utilbar{background:#7cbf00;color:rgb(0 0 0);font-size:12.5px}
.utilbar .wrap-w{display:flex;align-items:center;gap:22px;padding-block:7px;flex-wrap:wrap}
.utilbar a{color:rgb(0 0 0);text-decoration:none}
.utilbar a:hover{color:#fff;text-decoration:none}
.utilbar .r{margin-left:auto;display:flex;gap:18px;align-items:center}
.utilbar span{display:flex;align-items:center;gap:7px}
.utilbar svg{width:13px;height:13px;stroke-width:2}
.utilbar .dot{
  width:7px;height:7px;border-radius:50%;background:#ffffff;flex:0 0 auto;
  box-shadow:0 0 0 0 rgba(63,210,147,.5);animation:mb-pulse 2.6s infinite;
}
@keyframes mb-pulse{
  0%{box-shadow:0 0 0 0 rgba(63,210,147,.45)}
  70%{box-shadow:0 0 0 7px rgba(63,210,147,0)}
  100%{box-shadow:0 0 0 0 rgba(63,210,147,0)}
}

/* ==========================================================================
   Шапка
   ========================================================================== */
.site-header{
  border-bottom:1px solid var(--line);background:#000000;
  position:sticky;top:0;z-index:60;
}
.site-header .wrap-w{display:flex;align-items:center;gap:24px;padding-block:13px}

.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand:hover{text-decoration:none}
.brand img{height:55px;width:auto}
.brand-mark{
  width:34px;height:34px;border-radius:7px;background:var(--navy);color:#fff;
  display:grid;place-items:center;font:800 16px/1 var(--sans);letter-spacing:-.05em;flex:0 0 auto;
}
.brand b{font-size:19px;font-weight:800;letter-spacing:-.04em;color:var(--ink)}
.brand i{color:var(--rose);font-style:normal}

/* --- главно меню --- */
.nav{display:flex;gap:2px;list-style:none}
.nav>li{position:relative}
.nav>li>a{
  display:flex;align-items:center;gap:6px;padding:10px 13px;border-radius:var(--r);
  font-size:15px;font-weight:600;color:#ffffff;text-decoration:none;
}
.nav>li>a:hover,.nav>li.has-drop:hover>a{background:var(--wash);color:var(--ink);text-decoration:none}
.nav>li>a[aria-current]{color:var(--ink);background:var(--wash)}
.nav>li>a svg{width:11px;height:11px;stroke-width:2.4;opacity:.55}

.nav-drop,.drop,.mega{
  position:absolute;top:100%;left:0;min-width:346px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--sh-l);padding:7px;list-style:none;

  /* Над всичко останало в шапката. Пет беше достатъчно на теория,
     но не оставя място за грешка при добавяне на нов слой. */
  z-index:80;
  /*
   * Скрито с display, не с прозрачност.
   *
   * Прозрачността оставя менюто на страницата — то заема място, лови
   * щраквания и зависи от вериги правила, които лесно се чупят.
   * display:none е недвусмислено: или го има, или го няма.
   */
  display:none;
}
.has-drop.is-open>.nav-drop,
.has-drop.is-open>.drop,
.has-drop.is-open>.mega{
  display:block;
}
.has-drop.is-open>.mega{display:grid}
.mega-col{list-style:none}
.mega-col h4{
  font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);padding:10px 11px 5px;
}

.nav-drop a,.drop a,.mega a{
  display:flex;gap:12px;padding:10px 11px;border-radius:var(--r);
  color:var(--ink);text-decoration:none;

  /* Изрично: нищо да не отменя приемането на щраквания. */
  pointer-events:auto;position:relative;z-index:1;
}
.nav-drop a:hover,.drop a:hover,.mega a:hover{background:var(--wash);text-decoration:none}
.nav-drop .fi,.drop .fi,.mega .fi{
  width:32px;height:32px;border-radius:var(--r);flex:0 0 auto;
  display:grid;place-items:center;background:#000000!mportant;color:#9dff1e!mportant;
}
.nav-drop .fi svg,.drop .fi svg,.mega .fi svg{width:16px;height:16px;stroke-width:1.8}
.nav-drop b,.drop b,.mega b{display:block;font-size:14.5px;font-weight:700;margin-bottom:2px}
.nav-drop span,.drop span,.mega span{display:block;font-size:12.5px;color:var(--ink-2);line-height:1.4}
.plan-badge,.free-badge{
  display:inline-block;font:700 9.5px/1 var(--sans);letter-spacing:.06em;
  text-transform:uppercase;background:var(--ok-w);color:var(--ok);
  padding:3px 6px;border-radius:3px;margin-bottom:4px;
}

.nav-actions{margin-left:auto;display:flex;align-items:center;gap:13px}
.nav-tel{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15.5px;color:var(--ink);text-decoration:none}
.nav-tel:hover{text-decoration:none;color:var(--rose)}
.nav-tel svg{width:16px;height:16px;color:var(--rose);stroke-width:2;flex:0 0 auto}
.nav-tel span{display:block}
.nav-tel small{display:block;font-size:11px;font-weight:500;color:var(--ink-3);margin-top:1px}

.lang,.lang-switch{display:flex;gap:5px;align-items:center}
.lang a,.lang-switch a{
  font-size:13px;font-weight:600;color:var(--ink-3);padding:5px 8px;border-radius:4px;
  text-decoration:none;
}
.lang a:hover,.lang-switch a:hover{background:var(--wash);color:var(--ink);text-decoration:none}
.lang a[aria-current],.lang-switch a[aria-current]{background:var(--navy);color:#fff}

.nav-toggle{
  display:none;width:40px;height:40px;border:1px solid var(--line-2);border-radius:var(--r);
  background:none;cursor:pointer;place-items:center;color:var(--ink);
}
.nav-toggle svg{width:19px;height:19px;stroke-width:2}

/* ==========================================================================
   Секции
   ========================================================================== */
.sec{padding-block:100px}
.sec-wash{background:var(--wash);border-block:1px solid var(--line)}
.sec-head{margin-bottom:24px}
.sec-head.is-center{text-align:center}
.sec-head h1,.sec-head h2{margin-bottom:9px}
.sec-head p,.lead{color:var(--ink-2);font-size:16.5px;line-height:1.6;max-width:70ch}
.sec-head.is-center p,.sec-head.is-center .lead{margin-inline:auto}
.sec-more{margin-top:22px;text-align:center}
.eyebrow{
  display:block;font:700 11.5px/1 var(--sans);letter-spacing:.14em;
  text-transform:uppercase;color:var(--rose);margin-bottom:12px;
}
.crumb{font-size:13.5px;color:var(--ink-3);margin-bottom:14px}
.crumb a{color:var(--ink-2)}
.crumb span{margin-inline:7px;opacity:.5}

/* ==========================================================================
   Герой на вътрешните страници
   ========================================================================== */
.hero-lite{
  background:var(--wash);border-bottom:1px solid var(--line);
  padding-block:34px 30px;
}
.hero-lite h1{margin-bottom:11px}
.hero-lite .lead{font-size:17px}
.hero-cta{display:flex;gap:11px;flex-wrap:wrap;margin-top:20px}

.hero-home{
  background:#cffb804f;border-bottom:1px solid var(--line);padding-block:70px 38px;
}
.hero-home .sec-head{margin-bottom:22px}

/* ==========================================================================
   Планове — продавани по брой посещения
   ========================================================================== */
.plan-cycle{display:flex;justify-content:center;margin-bottom:22px}
.plan-cycle .cyc-box,.plan-cycle>div{
  display:flex;background:var(--paper);border:1px solid var(--line);
  border-radius:7px;padding:3px;gap:2px;
}
.plan-cycle button,.cyc-opt{
  border:0;background:none;cursor:pointer;padding:8px 16px;border-radius:5px;
  font:600 13.5px/1 var(--sans);color:var(--ink-2);
  display:flex;align-items:center;gap:7px;
}
.plan-cycle button:hover,.cyc-opt:hover{color:var(--ink)}
.plan-cycle button.is-on,.cyc-opt.is-on,.plan-cycle button[aria-pressed="true"]{
  background:var(--navy);color:#fff;
}
.cyc-label{font-weight:600}
.cyc-price,.plan-cycle .save{
  font:700 10px/1 var(--sans);background:var(--ok-w);color:var(--ok);
  padding:3px 6px;border-radius:3px;letter-spacing:.04em;
}
.plan-cycle button.is-on .cyc-price,.cyc-opt.is-on .cyc-price,
.plan-cycle button[aria-pressed="true"] .save{background:rgba(255,255,255,.2);color:#fff}

.plan-grid,.cyc-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:start;
}

.plan-card{
  background:var(--paper);border:1px solid var(--line);border-radius:9px;
  display:flex;flex-direction:column;position:relative;
}
.plan-card.is-featured{border:2px solid var(--rose);box-shadow:0 10px 32px rgba(192,51,92,.13)}
.plan-card .plan-top{
  position:absolute;top:-11px;left:50%;transform:translateX(-50%);
  background:var(--rose);color:#fff;border-radius:4px;padding:4px 12px;
  font:700 10.5px/1 var(--sans);letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;
}
.plan-card .plan-gift{
  display:block;text-align:center;background:var(--ok-w);color:var(--ok);
  font:700 11px/1 var(--sans);padding:7px;border-radius:8px 8px 0 0;
}
.plan-card.is-featured .plan-gift{border-radius:6px 6px 0 0}

.plan-card h3{
  padding:18px 20px 0;text-align:center;
  font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);
}
.plan-card .plan-name{
  display:block;text-align:center;padding:4px 20px 0;
  font-size:1.28rem;font-weight:800;letter-spacing:-.035em;color:var(--ink);
}

/* --- главната мярка --- */
.plan-sum,.plan-visits{
  margin:16px 20px;padding:14px;background:#7cbf00;border-radius:7px;text-align:center;
}
.plan-sum b,.plan-visits b{
  display:block;font:700 1.6rem/1 var(--mono);letter-spacing:-.045em;
  color:var(--navy);margin-bottom:4px;
}
.plan-sum span,.plan-visits span{display:block;font-size:12.5px;color:var(--ink-2)}
.plan-card.is-featured .plan-sum,.plan-card.is-featured .plan-visits{background:var(--rose-w)}
.plan-card.is-featured .plan-sum b,.plan-card.is-featured .plan-visits b{color:var(--rose)}

.plan-spec{text-align:center;padding:0 20px 16px;border-bottom:1px solid var(--line)}
.plan-spec b{font:700 1.05rem/1 var(--mono);letter-spacing:-.03em}
.plan-spec span{display:block;font-size:12.5px;color:var(--ink-2);margin-top:4px}

.plan-list,.tick-list{
  list-style:none;margin:0;padding:16px 20px;display:grid;gap:9px;font-size:13.5px;flex:1;
}
.plan-list li,.tick-list li{display:flex;gap:9px;align-items:flex-start;color:var(--ink-2)}
.plan-list li::before,.tick-list li::before{
  content:"";width:14px;height:14px;flex:0 0 auto;margin-top:3px;
  background:currentColor;color:var(--ok);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
}
.plan-list li b,.tick-list li b{color:var(--ink);font-weight:600}
.plan-list li.no{color:var(--ink-3)}
.plan-list li.no::before{color:var(--line-2);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
}

.plan-price{padding:16px 20px 18px;text-align:center;border-top:1px solid var(--line)}
.plan-old{font:600 14px/1 var(--mono);color:var(--ink-3);text-decoration:line-through}
.plan-price .now{display:flex;align-items:baseline;justify-content:center;gap:5px;margin:5px 0 3px}
.plan-price .now b,.plan-price>b{font:700 2.15rem/1 var(--mono);letter-spacing:-.05em}
.plan-price .now span{font-size:14px;color:var(--ink-3)}
.plan-vat{font-size:12.5px;color:var(--ink-3);margin-bottom:14px}
.plan-btn{width:100%}
.plan-note{margin-top:20px;text-align:center;font-size:13.5px;color:var(--ink-3)}
.plan-idx{
  display:inline-block;font:700 11px/1 var(--mono);color:var(--ink-3);
}

/* ==========================================================================
   Лента „включено във всеки план“
   ========================================================================== */
.incl-bar{padding-block:24px;border-bottom:1px solid var(--line)}
.incl-bar .wrap-w{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.incl-bar h2{font-size:15px;flex:0 0 auto;letter-spacing:-.02em}
.incl-bar ul{list-style:none;display:flex;gap:24px;flex-wrap:wrap}
.incl-bar li{display:flex;align-items:center;gap:9px;font-size:14px;color:#7CFF00;}
.incl-bar li svg{width:16px;height:16px;color:#ffffff;stroke-width:2.4;flex:0 0 auto}

/* ==========================================================================
   Търсене на домейн
   ========================================================================== */
.dsearch{background:var(--navy);color:#fff;padding-block:34px}
.dsearch .wrap-w{display:grid;grid-template-columns:1fr 420px;gap:38px;align-items:center}
.dsearch h2{margin-bottom:8px;color:#4a4a4a;}
.dsearch p{color:rgba(255,255,255,.7);font-size:15.5px;margin-bottom:18px;max-width:52ch}
.dsearch-form{display:flex;gap:8px;margin-bottom:14px}
.dsearch-form input,.dm-input{
  flex:1;min-width:0;border:0;border-radius:var(--r);padding:14px 16px;
  font:500 16px/1 var(--sans);color:var(--ink);outline:none;background:#fff;
}
.dsearch-form input:focus{box-shadow:0 0 0 3px rgba(192,51,92,.4)}
.dm-note,.dsearch .note{font-size:13px;color:rgba(255,255,255,.55)}

.tld-chips{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.tld-chip{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r);padding:11px 14px;
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
}
.tld-chip b{font:700 15px/1 var(--mono);color:#fff}
.tld-chip .p{text-align:right}
.tld-chip .p s{display:block;font:500 11.5px/1 var(--mono);color:rgba(255,255,255,.4)}
.tld-chip .p em{font-style:normal;font:700 14px/1 var(--mono);color:#7CE0B4}
.tld-chip.is-hot{background:rgba(192,51,92,.24);border-color:rgba(255,92,135,.4)}

/* --- резултати от търсенето --- */
.dres{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;margin-bottom:16px;
}
.dres-row,.dres>div{
  display:flex;align-items:center;gap:16px;padding:15px 18px;
  border-bottom:1px solid var(--line);flex-wrap:wrap;
}
.dres>div:last-child{border-bottom:0}
.dres-name{font:700 17px/1.2 var(--mono);letter-spacing:-.02em;flex:1;min-width:0;word-break:break-all}
.dres-status{
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  padding:5px 10px;border-radius:4px;white-space:nowrap;
}
.dres-status.is-good{background:var(--ok-w);color:var(--ok)}
.dres-status.is-bad{background:var(--bad-w);color:var(--bad)}
.dres-price{font:700 17px/1 var(--mono);letter-spacing:-.03em;white-space:nowrap}
.dres-price small{display:block;font:400 12px/1 var(--sans);color:var(--ink-3);margin-top:4px}

.sug-list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.sug-list>div{background:var(--paper);display:flex;align-items:center;gap:14px;padding:12px 16px}
.sug-title{font:700 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
.sug-name{font:600 15px/1 var(--mono);flex:1}
.sug-price{font:700 15px/1 var(--mono);white-space:nowrap}

.dm-opts{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}

/* --- таблица с цени по разширения --- */
.tld-table{width:100%;font-size:14.5px}
.tld-table th,.tld-table td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left}
.tld-table thead th{
  background:var(--wash);font-size:12px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--ink-2);border-bottom:1px solid var(--line);
}
.tld-table td:first-child{font-family:var(--mono);font-weight:700}
.tld-table td:not(:first-child){font-family:var(--mono);text-align:right}
.tld-table tbody tr:hover{background:var(--wash)}

/* ==========================================================================
   Отзиви и оценки
   ========================================================================== */
.rev-head{display:flex;align-items:center;gap:26px;margin-bottom:20px;flex-wrap:wrap}
.rev-scores{margin-left:auto;display:flex;gap:22px;flex-wrap:wrap}
.rev-score{display:flex;align-items:center;gap:10px}
.rev-score .src{font:700 13px/1 var(--sans);color:var(--ink-2)}
.rev-score b{font:700 15px/1 var(--mono)}
.rev-score span{font-size:12px;color:var(--ink-3)}
.stars{display:flex;gap:2px}
.stars svg{width:14px;height:14px;color:var(--star)}

.rev-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:14px}
.rev-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:18px}
.rev-card .who{display:flex;align-items:center;gap:11px;margin-bottom:11px}
.rev-card .av{
  width:38px;height:38px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  font:700 14px/1 var(--sans);color:#fff;background:var(--navy);
}
.rev-card .who b{display:block;font-size:14.5px;font-weight:700}
.rev-card .who .stars{margin-top:3px}
.rev-card p{font-size:14px;color:var(--ink-2);line-height:1.55}
.rev-card .src{
  display:block;margin-top:12px;padding-top:11px;border-top:1px solid var(--line);
  font-size:12px;color:var(--ink-3);
}

/* ==========================================================================
   Сравнителна таблица
   ========================================================================== */
.cmp-wrap{border:1px solid var(--line);border-radius:var(--r-md);overflow:auto}
.cmp{width:100%;min-width:760px}
.cmp th,.cmp td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:center}
.cmp thead th{
  background:var(--navy);color:#fff;font-size:13px;font-weight:700;border-bottom:0;
  position:sticky;top:0;z-index:2;
}
.cmp thead th.is-featured{background:var(--rose)}
.cmp thead th small{display:block;font-weight:500;font-size:11.5px;color:rgba(255,255,255,.7);margin-top:3px}
.cmp thead th:first-child{text-align:left;background:var(--navy-2)}
.cmp tbody th{
  text-align:left;font-weight:600;font-size:13.5px;color:var(--ink-2);
  background:var(--wash);width:262px;
}
.cmp tbody th em{display:block;font-style:normal;font-size:12px;color:var(--ink-3);margin-top:2px;font-weight:400}
.cmp td{font:600 14px/1.4 var(--mono)}
.cmp tbody tr:hover td{background:var(--wash)}
.cmp .is-good,.cmp .y{color:var(--ok)}
.cmp .is-bad,.cmp .n{color:var(--line-2)}
.cmp svg{width:16px;height:16px;stroke-width:2.6;margin-inline:auto}
.cmp tr.cmp-buy td{padding:16px 14px}
.cmp tr.cmp-buy th{background:var(--wash)}

/* ==========================================================================
   Карти с предимства
   ========================================================================== */
.feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:16px}
.feat-card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:22px;
}
.sec-wash .feat-card{background:var(--paper)}
.feat-card .fi{
  width:42px;height:42px;border-radius:var(--r-md);background:var(--navy);color:#fff;
  display:grid;place-items:center;margin-bottom:14px;
}
.feat-card .fi svg{width:20px;height:20px;stroke-width:1.75}
.feat-card h3{font-size:16px;margin-bottom:7px}
.feat-card p{font-size:14px;color:var(--ink-2);line-height:1.55}
.feat-idx{
  display:block;font:700 12px/1 var(--mono);color:var(--rose);
  letter-spacing:.1em;margin-bottom:11px;
}

/* ==========================================================================
   Локации и партньори
   ========================================================================== */
.loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}
.loc-list{display:flex;gap:10px;flex-wrap:wrap}
.loc-item{
  display:flex;align-items:center;gap:9px;background:var(--wash);
  border:1px solid var(--line);border-radius:var(--r);padding:9px 14px;
  font-size:14px;font-weight:600;
}
.loc-item i{font-style:normal;font-size:17px}
.loc-item.is-main{background:var(--rose-w);border-color:#F0CFDA;color:var(--rose)}

.partner-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.partner{
  border:1px solid var(--line);border-radius:7px;padding:16px;
  display:flex;align-items:center;gap:12px;background:var(--paper);
}
.partner svg{width:24px;height:24px;color:var(--blue);stroke-width:1.6;flex:0 0 auto}
.partner b{display:block;font-size:14px;font-weight:700}
.partner span{display:block;font-size:12px;color:var(--ink-3);margin-top:2px}

/* ==========================================================================
   Начини на плащане
   ========================================================================== */
.pay-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.pay-opt{background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:15px}
.pay-opt b{display:block;font-size:14px;font-weight:700;margin-bottom:5px}
.pay-opt p{font-size:12.5px;color:var(--ink-2);line-height:1.5}
.pay-note{font-size:13px;color:var(--ink-3);margin-top:12px}

/* ==========================================================================
   Въпроси
   ========================================================================== */
.faq-list{display:grid;grid-template-columns:1fr 1fr;gap:0 38px}
.faq-list>div{min-width:0}
.qa{border-bottom:1px solid var(--line)}
.qa summary{
  padding:15px 0;cursor:pointer;font-size:15.5px;font-weight:600;
  display:flex;align-items:center;gap:12px;list-style:none;
}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{
  content:"";margin-left:auto;width:9px;height:9px;flex:0 0 auto;
  border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);
  transform:rotate(45deg);transition:transform .18s;
}
.qa[open] summary::after{transform:rotate(-135deg)}
.qa p{padding:0 0 16px;font-size:14.5px;color:var(--ink-2);line-height:1.6}

/* ==========================================================================
   Призив накрая
   ========================================================================== */
.cta-band{background:var(--navy);color:#fff;padding-block:40px}
.cta-band .wrap-w{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center}
.cta-band h2{margin-bottom:9px;color:#fff}
.cta-band p{color:rgba(255,255,255,.7);font-size:16px;max-width:56ch}
.cta-band .hero-cta{margin-top:0}

/* ==========================================================================
   Съдържание, блог, помощ
   ========================================================================== */
.prose{font-size:16px;line-height:1.7;color:var(--ink-2);max-width:174ch}
.prose h2{margin:32px 0 12px;color:var(--ink)}
.prose h3{margin:26px 0 10px;color:var(--ink)}
.prose p{margin-bottom:16px}
.prose ul,.prose ol{margin:0 0 16px 22px;display:grid;gap:8px}
.prose li{padding-left:2px}
.prose a{text-decoration:underline;text-underline-offset:3px}
.prose blockquote{
  margin:20px 0;padding:14px 20px;border-left:3px solid var(--rose);
  background:var(--wash);color:var(--ink);font-style:italic;
}
.prose code{
  font-family:var(--mono);font-size:13.5px;background:var(--wash-2);
  padding:2px 6px;border-radius:4px;
}
.prose pre{
  background:var(--navy-deep);color:#D7E1EE;padding:16px;border-radius:var(--r-md);
  overflow-x:auto;font-family:var(--mono);font-size:13px;line-height:1.6;
}
.prose pre code{background:none;padding:0;color:inherit}
.prose img{border-radius:var(--r-md);margin-block:18px}
.prose table{width:100%;font-size:14.5px;margin-bottom:18px}
.prose th,.prose td{padding:10px 12px;border:1px solid var(--line);text-align:left}
.prose th{background:var(--wash);font-weight:700}

.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(288px,1fr));gap:18px}
.post{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .15s,border-color .15s;
}
.post:hover{border-color:var(--line-2);box-shadow:var(--sh)}
.thumb{aspect-ratio:16/9;overflow:hidden;background:var(--wash-2)}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb-ph{
  aspect-ratio:16/9;background:linear-gradient(135deg,var(--navy),var(--navy-3));
  display:grid;place-items:center;color:rgba(255,255,255,.3);
  font:800 2rem/1 var(--sans);letter-spacing:-.05em;
}
.post .post-b{padding:18px;display:flex;flex-direction:column;flex:1}
.post time{font:500 12px/1 var(--mono);color:var(--ink-3);margin-bottom:8px;display:block}
.post h3{font-size:17px;margin-bottom:8px;letter-spacing:-.028em}
.post h3 a{color:var(--ink);text-decoration:none}
.post h3 a:hover{color:var(--rose)}
.post p{font-size:14px;color:var(--ink-2);line-height:1.55;margin-bottom:14px}
.post .more{margin-top:auto;font-size:13.5px;font-weight:600;color:var(--rose)}

/* --- помощни статии --- */
.kb-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.kb-cat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:20px}
.kb-cat h3{font-size:15.5px;margin-bottom:12px}
.kb-cat ul{list-style:none;display:grid;gap:9px}
.kb-cat li a{font-size:14px;color:var(--ink-2);display:flex;gap:9px;align-items:flex-start;text-decoration:none}
.kb-cat li a:hover{color:var(--blue)}
.kb-note{
  background:var(--blue-w);border:1px solid #CDE0F4;border-radius:var(--r-md);
  padding:16px 20px;font-size:14.5px;color:#154D89;line-height:1.6;
}

/* ==========================================================================
   Форми
   ========================================================================== */
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.f-row.is-single{grid-template-columns:1fr}
/*
 * Общото правило за полета във форма.
 *
 * Изключват се изборите с кръгче: там надписът стои СРЕЩУ кръгчето,
 * не над него, и блоковият вид ги подрежда един под друг.
 */
.order-form label:not(.dopt):not(.term):not(.co-tab),
.co-form label:not(.co-tab),
.contact-form label{
  display:flex;flex-direction:column;gap:7px;
  font-size:13px;font-weight:600;color:var(--ink);
}
.order-form input,.order-form select,.order-form textarea,
.co-form input,.co-form select,.co-form textarea,
.contact-form input,.contact-form select,.contact-form textarea,
.dm-input,.f-input{
  border:1px solid var(--line-2);border-radius:var(--r);padding:11px 14px;
  font:400 15px/1.4 var(--sans);color:var(--ink);background:var(--paper);
  transition:border-color .14s,box-shadow .14s;
}
.order-form input:hover,.co-form input:hover,.contact-form input:hover{border-color:var(--line-3)}
.order-form input:focus,.order-form select:focus,.order-form textarea:focus,
.co-form input:focus,.co-form select:focus,.co-form textarea:focus,
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{
  outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(14,39,69,.09);
}
.order-form textarea,.co-form textarea,.contact-form textarea{
  resize:vertical;min-height:118px;line-height:1.6;
}
.order-form select,.co-form select{
  cursor:pointer;appearance:none;padding-right:34px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237A8899' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
}
.f-check,.f-radio{
  display:flex;align-items:flex-start;gap:11px;font-size:14.5px;font-weight:400;
  line-height:1.5;cursor:pointer;
}
.f-check input,.f-radio input{
  accent-color:var(--navy);width:17px;height:17px;flex:0 0 auto;margin-top:2px;
}
.form-error{
  background:var(--bad-w);border:1px solid #F1D2CE;color:#8E2A23;
  border-radius:var(--r);padding:12px 16px;font-size:14px;margin-bottom:16px;
}
.note{font-size:13px;color:var(--ink-3);line-height:1.5}
.vat-note{font-size:12.5px;color:var(--ink-3)}

/* ==========================================================================
   Поръчка и плащане
   ========================================================================== */
.checkout-grid{display:grid;grid-template-columns:1fr 340px;gap:26px;align-items:start}
.co-side{position:sticky;top:96px}
.co-sum{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;
}
.co-sum h3{padding:15px 18px;border-bottom:1px solid var(--line);font-size:15px;background:var(--wash)}
.cs-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:12px 18px;border-bottom:1px solid var(--line);font-size:14px;
}
.cs-row:last-of-type{border-bottom:0}
.cs-row span{color:var(--ink-2)}
.cs-row b{font-family:var(--mono);font-weight:600}
.cs-row.is-total{background:var(--wash);font-size:15.5px}
.cs-row.is-total b{font-size:1.24rem;font-weight:700;letter-spacing:-.035em}
.order-feat{list-style:none;display:grid;gap:9px;margin-top:16px;font-size:13.5px;color:var(--ink-2)}
.order-no{font:700 1.3rem/1 var(--mono);letter-spacing:-.03em}
.of-step{
  display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line);
}
.of-step:last-child{border-bottom:0}
.of-step .n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 12px/1 var(--mono);
}
.of-step b{display:block;font-size:15px;margin-bottom:3px}
.of-step p{font-size:14px;color:var(--ink-2)}
.note-manual{
  background:var(--warn-w);border:1px solid #EDDDB8;border-radius:var(--r);
  padding:13px 16px;font-size:14px;color:#7A5410;line-height:1.55;
}

/* ==========================================================================
   Празни състояния, съобщения, 404
   ========================================================================== */
.empty-box{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  padding:48px 30px;text-align:center;
}
.empty-box h2{font-size:1.1rem;margin-bottom:8px}
.empty-box p{color:var(--ink-2);max-width:46ch;margin:0 auto 18px;font-size:14.5px}

.sec-404,.e404{text-align:center;padding-block:70px}
.e404{font:800 clamp(4rem,14vw,8rem)/1 var(--mono);letter-spacing:-.06em;color:var(--wash-2)}
.sec-404 h1{margin-top:-14px;margin-bottom:12px}

.sec-done{text-align:center;padding-block:52px}
.sec-done .tick{
  width:64px;height:64px;border-radius:50%;background:var(--ok-w);color:var(--ok);
  display:grid;place-items:center;margin:0 auto 20px;
}
.sec-done .tick svg{width:30px;height:30px;stroke-width:2.6}

.legal-warn{
  background:var(--warn-w);border:1px solid #EDDDB8;border-left:3px solid var(--warn);
  border-radius:var(--r);padding:14px 18px;margin-bottom:20px;
  font-size:14.5px;color:#7A5410;line-height:1.6;
}

.split-2{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.contact-grid{display:grid;grid-template-columns:1fr 340px;gap:32px;align-items:start}
.contact-box{
  background:var(--wash);border:1px solid var(--line);border-radius:var(--r-md);padding:22px;
}
.contact-box .line{
  display:flex;align-items:flex-start;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);
}
.contact-box .line:last-child{border-bottom:0}
.contact-box svg{width:18px;height:18px;color:var(--rose);stroke-width:1.9;flex:0 0 auto;margin-top:2px}
.contact-box b{display:block;font-size:14.5px;font-weight:600}
.contact-box span{display:block;font-size:13px;color:var(--ink-3);margin-top:2px}

.hp-row{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.hp-body{font-size:15px;color:var(--ink-2);line-height:1.65}

/* ==========================================================================
   Подвал
   ========================================================================== */
.site-footer{background:var(--navy-deep);color:rgba(255,255,255,.62);padding-block:36px 22px;font-size:13.5px}
.site-footer a{color:rgba(255,255,255,.62);text-decoration:none}
.site-footer a:hover{color:#fff;text-decoration:none}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:28px;margin-bottom:28px}
.foot-brand .brand b{color:#fff}
.foot-brand .brand-mark{background:rgba(255,255,255,.12)}
.foot-brand p{margin-top:12px;font-size:13.5px;line-height:1.6;max-width:34ch}
.foot-col h4{font-size:13px;color:#fff;margin-bottom:12px;letter-spacing:.02em}
.foot-col ul{list-style:none;display:grid;gap:8px}
.foot-social{display:flex;gap:10px;margin-top:16px}
.foot-social a{
  width:32px;height:32px;border-radius:var(--r);background:rgba(255,255,255,.08);
  display:grid;place-items:center;
}
.foot-social a:hover{background:rgba(255,255,255,.16)}
.foot-social svg{width:16px;height:16px;stroke-width:1.9}
.foot-bottom{
  border-top:1px solid rgba(255,255,255,.1);padding-top:18px;
  display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-size:12.5px;
}
.foot-bottom .r{margin-left:auto;display:flex;gap:16px}
.foot-reg{font-size:12.5px;color:rgba(255,255,255,.45);line-height:1.6}

/* ==========================================================================
   Адаптивност
   ========================================================================== */
@media (max-width:1120px){
  .plan-grid,.cyc-grid{grid-template-columns:repeat(2,1fr)}
  .dsearch .wrap-w,.loc-grid,.cta-band .wrap-w,.checkout-grid,
  .contact-grid,.split-2,.hp-row{grid-template-columns:1fr;gap:24px}
  .co-side{position:static}
  .faq-list{grid-template-columns:1fr;gap:0}
  .foot-grid{grid-template-columns:repeat(3,1fr)}
  .foot-brand{grid-column:1 / -1}
  .mega{grid-template-columns:1fr;min-width:346px}
}

@media (max-width:860px){
  .utilbar{display:none}
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;gap:0;background:var(--paper);
    border-bottom:1px solid var(--line);box-shadow:var(--sh-l);
    padding:8px;max-height:calc(100dvh - 60px);overflow-y:auto;
  }
  .nav.is-open{display:flex}
  .nav>li>a{padding:13px 14px;font-size:16px}
  /*
   * На телефон менюто е част от потока, не изскачащо. Показването
   * пак се решава от is-open — иначе всичките три списъка биха
   * стояли отворени наведнъж.
   */
  .nav-drop,.drop,.mega{
    position:static;box-shadow:none;border:0;
    border-left:2px solid var(--line);border-radius:0;
    margin-left:14px;min-width:0;padding:0;
  }
  .mega{grid-template-columns:1fr}
  .nav-toggle{display:grid}
  .nav-tel small{display:none}
  .site-header .wrap-w{position:relative;gap:12px}

  .plan-grid,.cyc-grid{grid-template-columns:1fr}
  .tld-chips{grid-template-columns:1fr}
  .partner-grid{grid-template-columns:1fr}
  .f-row{grid-template-columns:1fr}
  .rev-scores{margin-left:0;gap:16px}
  .incl-bar .wrap-w{gap:14px}
  .incl-bar ul{gap:12px 20px}
  .topbar .cd{margin-left:0;width:100%}
  .sec{padding-block:30px}
  .wrap-w,.wrap-n{padding-inline:16px}
  .dres-row,.dres>div{gap:10px}
  .dres-price{width:100%;text-align:left}
  .foot-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:460px){
  .foot-grid{grid-template-columns:1fr}
  .cta-band .hero-cta{flex-direction:column}
  .cta-band .hero-cta .btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

@media print{
  .topbar,.utilbar,.site-header,.site-footer,.cta-band,.hero-cta,.btn{display:none}
  body{background:#fff;font-size:12pt}
  .sec{padding-block:12px}
  .cmp-wrap,.feat-card,.plan-card{border-color:#CCC;box-shadow:none}
}

/* ==========================================================================
   Класове от съществуващите страници
   ========================================================================== */

/* --- прескачане към съдържанието --- */
.skip{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--navy);color:#fff;padding:11px 18px;border-radius:0 0 var(--r) 0;
  font-size:14px;font-weight:600;
}
.skip:focus{left:0;text-decoration:none}

/* --- лого и шапка --- */
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo img{height:30px;width:auto}
.logo:hover{text-decoration:none}
.burger{
  display:none;width:40px;height:40px;border:1px solid var(--line-2);border-radius:var(--r);
  background:none;cursor:pointer;place-items:center;color:var(--ink);
}
.burger svg{width:19px;height:19px;stroke-width:2}
.nav-login{display:flex;align-items:center;gap:10px}

/* --- телефон и контакти в лентите --- */
.tb-phone{display:flex;align-items:center;gap:7px;font-weight:600}
.tb-phone svg{width:13px;height:13px;stroke-width:2}
.tb-contact{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.foot-contact{display:grid;gap:9px;font-size:13.5px;margin-top:14px}
.foot-contact a{display:flex;align-items:center;gap:9px}
.foot-contact svg{width:15px;height:15px;stroke-width:1.9;flex:0 0 auto;opacity:.7}

/* --- герой с панел отстрани --- */
.hero-grid{display:grid;grid-template-columns:1fr 420px;gap:40px;align-items:center}
.hero-left{min-width:0}
.hero-panel{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:22px;box-shadow:var(--sh);
}
.hero-trust{
  display:flex;gap:22px;flex-wrap:wrap;margin-top:22px;
  font-size:13.5px;color:var(--ink-2);
}
.hero-trust span{display:flex;align-items:center;gap:8px}
.hero-trust svg{width:15px;height:15px;color:var(--ok);stroke-width:2.4;flex:0 0 auto}

/* --- обещания и точки --- */
.promise{
  display:grid;gap:10px;list-style:none;font-size:14.5px;color:var(--ink-2);
}
.promise li{display:flex;gap:10px;align-items:flex-start}
.promise li svg{width:16px;height:16px;color:var(--ok);stroke-width:2.4;margin-top:2px;flex:0 0 auto}
.hp-dot{
  width:5px;height:5px;border-radius:50%;background:var(--ink-3);
  display:inline-block;vertical-align:middle;margin-inline:8px;flex:0 0 auto;
}
.hp-sep{
  border:0;border-top:1px solid var(--line);margin-block:26px;
}

/* --- състояния --- */
.is-warn{background:var(--warn-w);color:var(--warn)}
.yes{color:var(--ok);font-weight:700}
.tag-manual{
  display:inline-block;font:700 10.5px/1 var(--sans);letter-spacing:.06em;
  text-transform:uppercase;background:var(--warn-w);color:var(--warn);
  padding:4px 8px;border-radius:3px;
}

/* --- съобщения при вход и форми --- */
.af-msg{
  padding:12px 16px;border-radius:var(--r);font-size:14px;line-height:1.55;
  margin-bottom:16px;border:1px solid;
}
.af-msg.is-ok{background:var(--ok-w);border-color:#BEE5D3;color:#0E6B4A}
.af-msg.is-bad{background:var(--bad-w);border-color:#F1D2CE;color:#8E2A23}
.af-msg.is-warn{background:var(--warn-w);border-color:#EDDDB8;color:#7A5410}

/* --- поръчка --- */
.co-main{min-width:0}
.co-who{
  background:var(--wash);border:1px solid var(--line);border-radius:var(--r-md);
  padding:16px 18px;margin-bottom:20px;font-size:14.5px;
}
.co-who b{display:block;font-weight:700;margin-bottom:3px}
.co-who span{color:var(--ink-2)}

/* --- начини на плащане в поръчката --- */
.pm-list{display:grid;gap:10px}
.pm-opt{
  border:1.5px solid var(--line);border-radius:var(--r-md);padding:15px 17px;
  cursor:pointer;transition:border-color .14s,background .14s;
}
.pm-opt:hover{border-color:var(--line-3)}
.pm-opt:has(input:checked){border-color:var(--rose);background:var(--rose-w)}
.pm-opt label{display:flex;align-items:flex-start;gap:12px;cursor:pointer}
.pm-opt input{accent-color:var(--rose);width:18px;height:18px;flex:0 0 auto;margin-top:2px}
.pm-opt b{display:block;font-size:15px;font-weight:700;margin-bottom:3px}
.pm-body{font-size:13.5px;color:var(--ink-2);line-height:1.55}

/* --- категории --- */
.cat{
  display:inline-block;font:700 11px/1 var(--sans);letter-spacing:.06em;
  text-transform:uppercase;background:var(--blue-w);color:var(--blue);
  padding:4px 9px;border-radius:3px;
}

/* --- основен блок --- */
main{display:block;min-height:40vh}

@media (max-width:1120px){
  .hero-grid{grid-template-columns:1fr;gap:26px}
}
@media (max-width:860px){
  .burger{display:grid}
  .tb-contact{gap:12px}
}

/* --- подвалът ползва h3 за заглавия на колоните --- */
.foot-col h3{font-size:13px;color:#fff;margin-bottom:12px;letter-spacing:.02em;font-weight:700}
.foot-brand img{height:30px;width:auto;filter:brightness(0) invert(1);opacity:.9}
.foot-social span{font-size:12.5px;margin-right:4px;align-self:center}
.foot-social{align-items:center}

/* --- иконките: квадратчето е върху обвивката, не върху SVG-то --- */
.feat-card .fi{
  display:grid;place-items:center;
  width:42px;height:42px;border-radius:var(--r-md);
  background:var(--navy);color:#fff;margin-bottom:14px;flex:0 0 auto;
}
.feat-card .fi svg{width:20px;height:20px;stroke-width:1.75;display:block}
.feat-card svg:not(.fi svg){width:20px;height:20px}

/* Иконките в падащото меню и в останалите места остават малки. */
.nav-drop .fi,.drop .fi,.mega .fi{
  display:grid;place-items:center;
  width:32px;height:32px;border-radius:var(--r);
  background:#000000;color:#8bff0e;flex:0 0 auto;
}
.nav-drop .fi svg,.drop .fi svg,.mega .fi svg{width:16px;height:16px;display:block}

.partner svg,.contact-box svg,.incl-bar li svg,.hero-trust svg,.promise li svg{flex:0 0 auto}

/* --- призивът: текст отляво, бутони отдясно --- */
.cta-band .hero-cta{margin-top:0;flex-wrap:nowrap}
.cta-band .btn{flex:0 0 auto}
.btn-ghost-w{background:none;color:#fff;border-color:rgba(255,255,255,.32)}
.btn-ghost-w:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.55);color:#fff}

@media (max-width:1120px){
  .cta-band .hero-cta{flex-wrap:wrap}
}

/* ==========================================================================
   Начини на плащане — емблема и кога тръгва услугата
   ========================================================================== */
.sub-line{margin:0 0 20px;color:var(--ink-2);font-size:15px}

.pay-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(224px,1fr));gap:12px}

.pay-opt{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  padding:18px;display:flex;flex-direction:column;
  transition:border-color .15s, box-shadow .15s;
}
.pay-opt:hover{border-color:var(--line-2);box-shadow:0 4px 16px rgba(14,39,69,.07)}

.pay-top{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:10px;margin-bottom:12px;
}

/* --- емблемата: разпознава се без четене --- */
.pay-mark{
  height:34px;min-width:52px;padding:0 10px;border-radius:var(--r);flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash-2);
  font:800 12.5px/1 var(--sans);letter-spacing:-.02em;color:var(--navy);
}
.pay-mark.is-card{background:var(--navy);color:#fff}
.pay-mark.is-pp{background:#F0F5FB;color:#1B4C8C}
.pay-mark.is-ep{background:var(--rose-w);color:var(--rose)}

/* --- значка кога тръгва --- */
.when{
  display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;
  font:700 10.5px/1 var(--sans);letter-spacing:.05em;text-transform:uppercase;
  padding:4px 8px;border-radius:3px;white-space:nowrap;
}
.when.now{background:var(--ok-w);color:var(--ok)}
.when.wait{background:var(--warn-w);color:var(--warn)}
.when svg{width:11px;height:11px;stroke-width:2.6;flex:0 0 auto}

.pay-opt b{display:block;font-size:15px;font-weight:700;margin-bottom:5px}
.pay-opt p{margin:0 0 14px;font-size:13px;color:var(--ink-2);line-height:1.5;flex:1}
.pay-foot{
  padding-top:12px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--ink-3);
}

@media (max-width:460px){
  .pay-grid{grid-template-columns:1fr}
}

/* ==========================================================================
   Мега меню — две изравнени колони
   ========================================================================== */
/*
 * Тук се задава само ПОДРЕДБАТА. Дали менюто се вижда се решава на
 * едно място отгоре, с is-open. Ако display стои и тук, скритото
 * меню се показва въпреки скриването — точно това го чупеше.
 */
.mega{
  grid-template-columns:repeat(2,minmax(300px,1fr));
  gap:4px;min-width:640px;padding:10px;
}
.mega-col{min-width:0}
.mega-col>h4{
  font:700 10px/1 var(--sans);letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-3);padding:8px 11px 7px;margin:0;
  border-bottom:1px solid var(--line);margin-bottom:5px;
}
.mega-col>ul{list-style:none;margin:0;padding:0;display:grid;gap:1px}
.mega-col>ul>li{min-width:0}

/* Всяка връзка заема еднаква височина, за да са изравнени двете колони. */
.mega a{
  display:flex;gap:12px;align-items:flex-start;
  padding:10px 11px;border-radius:var(--r);
  color:var(--ink);text-decoration:none;height:100%;
}
.mega a:hover{background:var(--wash);text-decoration:none}
.mega a>span:last-child{min-width:0;display:block}
.mega b{
  display:block;font-size:14.5px;font-weight:700;margin-bottom:2px;letter-spacing:-.015em;
}
.mega a>span:last-child>span{
  display:block;font-size:12.5px;color:var(--ink-2);line-height:1.4;
}
.mega .plan-badge{margin-bottom:5px}

@media (max-width:860px){
  .mega{grid-template-columns:1fr;min-width:0;padding:0;gap:0}
  .mega-col>h4{
    border-bottom:0;padding:12px 14px 4px;margin-bottom:0;
  }
  .mega a{padding:11px 14px}
}

/* --- заглавията на разделите не водят никъде, само отварят менюто --- */
.nav>li>.nav-top{
  display:flex;align-items:center;gap:6px;
  padding:10px 13px;border:0;border-radius:var(--r);background:none;
  font:600 15px/1 var(--sans);color:#ffffff;cursor:default;
}
.nav>li:hover>.nav-top,
.nav>li:focus-within>.nav-top{background:var(--wash);color:var(--ink)}
.nav>li>.nav-top svg{width:11px;height:11px;stroke-width:2.4;opacity:.55;transition:transform .16s;}
.nav>li:hover>.nav-top svg,
.nav>li:focus-within>.nav-top svg{transform:rotate(180deg)}
.nav>li>.nav-top:focus-visible{outline:2px solid var(--rose);outline-offset:-2px}

@media (max-width:860px){
  .nav>li>.nav-top{width:100%;padding:13px 14px;font-size:16px;cursor:pointer}
  .nav>li:hover>.nav-top svg,
  .nav>li:focus-within>.nav-top svg{transform:none}
}

/* --- „Без лимит“ е по-къс от число, затова е по-едър --- */
.plan-sum.is-unlimited b{font-size:1.5rem;letter-spacing:-.035em}

/* --- дълъг списък с характеристики не бива да разкъсва мрежата --- */
.plan-list{max-height:none}
.plan-card{align-self:stretch}
.plan-grid{align-items:stretch}

/* ==========================================================================
   Мост над празнината под менюто
   ========================================================================== */

/*
 * Мостът над празнината отпадна.
 *
 * Беше невидима лента под бутона, която задържаше посочването. Но тя
 * лежеше ВЪРХУ горния ръб на менюто и поглъщаше щраквания. Изчакването
 * от 220 мс в скрипта върши същата работа, без да закрива нищо.
 */
.nav>li.has-drop{position:relative}

/* Самото меню тръгва плътно до моста. */


/*
 * Отварянето остава и докато мишката е ВЪТРЕ в менюто. Без това
 * преминаването от една връзка към друга го затваря.
 */


/* Връзките заемат цялата ширина, за да няма мъртви ивици между тях. */
.nav-drop li,.drop li,.mega li{display:block;width:100%}
.nav-drop a,.drop a,.mega a{width:100%}

@media (max-width:860px){
  .nav-drop,.drop,.mega{top:auto}
}


.nav>li.has-drop.is-open>.nav-top{background:#7cbf00;color:var(--ink)}
.nav>li.has-drop.is-open>.nav-top svg{transform:rotate(180deg)}

/* --- покана за хостинг при поръчка на домейн --- */
.add-host{
  background:var(--wash);border:1px solid var(--line);border-radius:var(--r-md);
  padding:13px 16px;font-size:14.5px;color:var(--ink-2);margin:0 0 20px;
}
.add-host a{font-weight:600}

/* --- домейн, пренесен от предишната стъпка --- */
.dm-kept{
  background:var(--ok-w);border:1px solid #C9E4D8;border-radius:var(--r);
  padding:9px 13px;font-size:13.5px;color:var(--ok);margin:0 0 12px;
}

/* ==========================================================================
   Количка
   ========================================================================== */
.cart-note{
  background:var(--ok-w);border:1px solid #C9E4D8;border-radius:var(--r-md);
  padding:11px 15px;font-size:14px;color:var(--ok);margin-bottom:18px;
}

.cart-lines{
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;
  margin-bottom:16px;background:var(--paper);
}

.cart-line{
  display:grid;grid-template-columns:auto 1fr auto auto;
  gap:14px;align-items:center;padding:16px 18px;
  border-bottom:1px solid var(--line);
}
.cart-line:last-child{border-bottom:0}

.cl-icon{
  width:38px;height:38px;border-radius:var(--r);flex:0 0 auto;
  display:grid;place-items:center;background:var(--navy);color:#fff;
}
.cl-icon svg{width:19px;height:19px}

.cl-body{min-width:0}
.cl-body b{display:block;font-size:15.5px;font-weight:700;letter-spacing:-.015em}
.cl-body>span{display:block;font-size:13px;color:var(--ink-2);margin-top:2px}

.cl-cycle{margin-top:9px}
.cl-cycle .control{
  padding:6px 30px 6px 10px;font-size:13.5px;height:auto;max-width:260px;
}

.cl-price{
  font-family:var(--mono);font-size:16px;font-weight:600;
  white-space:nowrap;letter-spacing:-.02em;
}

/* Кръстчето е бледо, докато не го посочиш — махането не бива да
   изглежда като главното действие на страницата. */
.cl-remove{
  width:30px;height:30px;border:0;background:none;cursor:pointer;
  display:grid;place-items:center;border-radius:var(--r);
  color:var(--ink-3);transition:background .15s,color .15s;
}
.cl-remove:hover{background:var(--rose-w);color:var(--rose)}
.cl-remove svg{width:15px;height:15px}
.cl-act{min-width:30px}

.cart-sum{
  border:1px solid var(--line);border-radius:var(--r-md);
  padding:16px 18px;background:var(--wash);margin-bottom:18px;
}
.cart-go{margin-bottom:10px}
.cart-go .btn{width:100%}

.cyc-select{max-width:340px;margin-bottom:6px}

@media (max-width:560px){
  .cart-line{grid-template-columns:auto 1fr auto;row-gap:8px}
  .cl-icon{grid-row:span 2}
  .cl-price{grid-column:2/4;text-align:right}
}


/* ==========================================================================
   Домейн и срок на един ред
   ========================================================================== */

/*
 * Трите полета се четат като изречение: какво правим, с кое име, за
 * колко време. Затова стоят едно до друго, а не едно под друго.
 */
.dm-row{
  display:grid;
  grid-template-columns:minmax(220px,1fr) minmax(170px,auto);
  gap:12px;align-items:end;margin-bottom:10px;
}

.dm-cell{min-width:0}
.dm-cell label{
  display:block;font-size:13px;font-weight:600;color:var(--ink-2);
  margin-bottom:5px;
}
.dm-cell .control{width:100%}

.dm-name .control{font-family:var(--mono);font-size:15px}

@media (max-width:640px){
  .dm-row{grid-template-columns:1fr;gap:14px}
}

/* ==========================================================================
   Конфигурация на домейна
   ========================================================================== */
.dc-head{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;margin-bottom:26px;
}
.dc-head .dc-cell{background:var(--paper);padding:14px 16px}

.dc-cell .k{
  display:block;font-size:12px;font-weight:600;color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:5px;
}
.dc-cell b{font-size:15.5px;font-weight:700;letter-spacing:-.015em}

/* Липсващият хостинг е покана, не тревога — затова е розово, не червено. */
.dc-add{
  display:inline-block;font-size:14.5px;font-weight:600;color:var(--rose);
}
.dc-add:hover{text-decoration:underline}

.dc-form h2{font-size:1.15rem;margin:0 0 6px}
.dc-note{
  font-size:14px;color:var(--ink-2);line-height:1.6;
  margin:0 0 18px;max-width:72ch;
}

.dc-err{
  background:var(--rose-w);border:1px solid #F0CBD6;border-radius:var(--r-md);
  padding:11px 15px;font-size:14px;color:var(--rose);margin-bottom:16px;
}

.dc-ns{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;margin-bottom:24px;
}
.dc-ns label{
  display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:5px;
}
.dc-ns label em{font-style:normal;font-weight:400;color:var(--ink-3)}
.dc-ns .control{width:100%;font-size:14.5px}

.dc-go{display:inline-flex;align-items:center;gap:9px}
.dc-go svg{width:17px;height:17px}

@media (max-width:520px){
  .dc-ns{grid-template-columns:1fr}
}

/* ==========================================================================
   ПОРЪЧКА — единен вид за целия поток
   ==========================================================================
   Същите токени като витрината: същият ръб, същото розово, същият
   шрифт за числата. Поръчката не бива да изглежда като чужд сайт,
   залепен накрая.
   ========================================================================== */

/* --------------------------------------------------- лента на стъпките */
.steps{
  background:var(--wash);border-bottom:1px solid var(--line);
  padding:16px 0;margin-bottom:6px;
}
.steps ol{
  max-width:1280px;margin-inline:auto;padding-inline:22px;
  display:flex;align-items:center;gap:8px;list-style:none;
  counter-reset:none;flex-wrap:wrap;
}

.st{
  display:flex;align-items:center;gap:9px;
  font-size:13.5px;color:var(--ink-3);flex:0 0 auto;
}

/* Чертичка между стъпките: показва посоката, без да заема място. */
.st + .st::before{
  content:"";width:22px;height:1px;background:var(--line-2);
  margin-right:5px;flex:0 0 auto;
}

.st-n{
  width:24px;height:24px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--wash-2);color:var(--ink-3);
  font:700 12px/1 var(--sans);
}
.st-n svg{width:12px;height:12px}

.st.is-now{color:var(--ink);font-weight:600}
.st.is-now .st-n{background:var(--rose);color:#fff}

.st.is-done{color:var(--ok)}
.st.is-done .st-n{background:var(--ok-w);color:var(--ok)}

@media (max-width:700px){
  /* На тесен екран остава само текущата — останалите са само номера. */
  .st-l{display:none}
  .st.is-now .st-l{display:inline}
  .st + .st::before{width:14px}
}

/* ------------------------------------------------------- обща рамка */
.of-step{
  font-size:1.05rem;font-weight:700;letter-spacing:-.02em;
  margin:26px 0 12px;padding-bottom:9px;
  border-bottom:1px solid var(--line);
}
.of-step:first-of-type{margin-top:0}

/* --------------------------------------------- обобщение над формата */
.dc-head{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;margin-bottom:24px;
}
.dc-head .dc-cell{background:var(--paper);padding:14px 16px}

/* ------------------------------------------------------ редовете в количката */
.cart-line{background:var(--paper)}
.cart-line:hover{background:var(--wash)}

/* ------------------------------------------------------------- сметката */
.cart-sum,.checkout-sum{
  border:1px solid var(--line);border-radius:var(--r-md);
  padding:18px 20px;background:var(--paper);
}
.cs-row{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:16px;padding:7px 0;font-size:14.5px;color:var(--ink-2);
}
.cs-row b{font-family:var(--mono);color:var(--ink);font-weight:600}
.cs-row.is-total{
  border-top:1px solid var(--line);margin-top:8px;padding-top:14px;
  font-size:16px;color:var(--ink);font-weight:600;
}
.cs-row.is-total b{font-size:20px;letter-spacing:-.03em}

/* ------------------------------------------------------------ бутоните */
.cart-go .btn,.dc-go{margin-top:4px}

.link-back{
  display:inline-block;margin-top:14px;font-size:13.5px;color:var(--ink-3);
}
.link-back:hover{color:var(--rose)}

.vat-note{font-size:12.5px;color:var(--ink-3);margin-top:10px}

/* ------------------------------------------------------- страницата за данни */
.checkout-grid{
  display:grid;grid-template-columns:1fr minmax(300px,360px);
  gap:28px;align-items:start;
}
@media (max-width:900px){
  .checkout-grid{grid-template-columns:1fr}
}

/* ==========================================================================
   Поръчка в две колони
   ========================================================================== */
.ord-grid{
  display:grid;grid-template-columns:1fr minmax(290px,340px);
  gap:30px;align-items:start;
}
.ord-main{min-width:0}

/* Обобщението пътува с превъртането — сметката трябва да се вижда
   през цялото време, а не само в началото. */
.ord-aside{position:sticky;top:96px}

.oa-box{
  border:1px solid var(--line);border-radius:var(--r-md);
  background:var(--paper);padding:20px;
}
.oa-box h3{
  font-size:1.02rem;margin:0 0 14px;padding-bottom:11px;
  border-bottom:1px solid var(--line);letter-spacing:-.02em;
}

.oa-empty{font-size:13.5px;color:var(--ink-3);line-height:1.6;margin:0}

.oa-lines{display:grid;gap:1px;margin-bottom:14px}

.oa-line{
  display:grid;grid-template-columns:auto 1fr auto;
  gap:11px;align-items:center;padding:9px 0;
}
.oa-line + .oa-line{border-top:1px solid var(--line)}

.oa-ico{
  width:30px;height:30px;border-radius:var(--r);flex:0 0 auto;
  display:grid;place-items:center;background:var(--navy);color:#fff;
}
.oa-ico svg{width:15px;height:15px}

.oa-body{min-width:0}
.oa-body b{
  display:block;font-size:14px;font-weight:700;letter-spacing:-.015em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.oa-body span{display:block;font-size:12px;color:var(--ink-3);margin-top:1px}

.oa-p{font-family:var(--mono);font-size:14px;font-weight:600;white-space:nowrap}

.oa-sum{border-top:1px solid var(--line);padding-top:10px}
.oa-sum .cs-row{padding:5px 0;font-size:13.5px}
.oa-sum .cs-row.is-total{font-size:15px;padding-top:11px}
.oa-sum .cs-row.is-total b{font-size:18px}

.oa-edit{
  display:block;margin-top:14px;font-size:13px;color:var(--ink-3);
  text-align:center;
}
.oa-edit:hover{color:var(--rose)}

@media (max-width:900px){
  .ord-grid{grid-template-columns:1fr;gap:22px}

  /* Отгоре, за да се види преди формата, а не след нея. */
  .ord-aside{position:static;order:-1}
}

/*
 * Без обобщение решетката се свива в една колона и се стеснява.
 *
 * Инак формата се разлива по цялата ширина и полетата стават дълги
 * колкото екрана, а човек ги чете по-трудно, отколкото ако бяха
 * събрани.
 */
.ord-grid:not(:has(.ord-aside)){
  grid-template-columns:minmax(0,840px);
  justify-content:center;
}

/* ==========================================================================
   Първа стъпка — вид на плана
   ========================================================================== */

/* Ключовите числа под заглавието. Разделени с преградки, за да се
   четат като таблица, а не като изречение. */
.plan-facts{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;margin:18px 0 26px;
}
.pf-item{background:var(--paper);padding:14px 16px}
.pf-item b{
  display:block;font-family:var(--mono);font-size:1.25rem;font-weight:600;
  letter-spacing:-.035em;color:var(--ink);
}
.pf-item span{
  display:block;font-size:12.5px;color:var(--ink-3);margin-top:3px;
}

/* --------------------------------------------------- характеристиките */
.of-feat{margin-top:28px}

.order-feat{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:2px 22px;margin:0;
}
.order-feat li{
  display:flex;gap:9px;align-items:flex-start;
  padding:7px 0;font-size:14.5px;color:var(--ink-2);
  border-bottom:1px solid var(--line);
}
.order-feat li::before{
  content:"";flex:0 0 auto;width:16px;height:16px;margin-top:2px;
  background:var(--ok);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M5 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M5 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* ------------------------------------------------------------- бутонът */
.of-go{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  margin-top:28px;padding-top:22px;border-top:1px solid var(--line);
}
.of-go .btn{flex:0 0 auto}
.of-go .vat-note{margin:0}

@media (max-width:520px){
  .order-feat{grid-template-columns:1fr}
  .of-go .btn{width:100%}
}

/* ==========================================================================
   Поръчков поток по образеца
   ========================================================================== */

/* --- лентата: стъпките заемат равна ширина и си сочат една друга --- */
.steps ol{display:flex;gap:0;padding-inline:22px}
.st{flex:1;justify-content:center;padding:15px 10px;position:relative;gap:9px}
.st + .st::before{
  content:"";position:absolute;left:0;top:50%;width:7px;height:7px;
  border-top:1px solid var(--line-2);border-right:1px solid var(--line-2);
  transform:translateY(-50%) rotate(45deg);margin:0;background:none;
}
.st.is-now{box-shadow:inset 0 -2px 0 var(--rose)}

/* --- карта за секция --- */
.o-card{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-md);padding:24px;margin-bottom:16px;
}
.o-card>h2{margin:0 0 4px;font-size:1.12rem;font-weight:700;letter-spacing:-.025em}
.o-card>p.sub{margin:0 0 18px;font-size:14px;color:var(--ink-2)}

/* --- добавки --- */
.adds{display:grid;gap:10px}
.add{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;
  align-items:center;border:1px solid var(--line);border-radius:var(--r-md);
  padding:15px 17px;margin:0;
}
.add.is-on{border-color:var(--ok);background:var(--ok-w)}
.a-ic{
  width:36px;height:36px;border-radius:var(--r);display:grid;place-items:center;
  background:var(--wash-2);color:var(--navy);flex:0 0 auto;
}
.add.is-on .a-ic{background:var(--ok);color:#fff}
.a-ic svg{width:18px;height:18px}
.a-body{min-width:0}
.a-body b{display:block;font-size:14.5px;font-weight:700}
.a-body>span{display:block;font-size:13px;color:var(--ink-2);margin-top:2px}
.a-pr{font-family:var(--mono);font-size:14px;font-weight:600;white-space:nowrap}
.btn-ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn-ok:hover{background:#0F6A4A;border-color:#0F6A4A;color:#fff}

/* --- промо код --- */
.promo-box{
  display:grid;grid-template-columns:1fr auto;gap:9px;
  background:var(--blue-w);border:1px dashed #B9D3EE;
  border-radius:var(--r-md);padding:15px 17px;margin-bottom:16px;
}
.pb-lab{
  grid-column:1/-1;font-size:13.5px;color:var(--blue);
  font-weight:600;margin-bottom:2px;
}

/* --- начини на плащане в прегледа --- */
.pays{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px}
.pm{
  border:1px solid var(--line);border-radius:var(--r-md);padding:14px;
  cursor:pointer;display:block;position:relative;
}
.pm:has(input:checked){border-color:var(--rose);box-shadow:0 0 0 1px var(--rose) inset}
.pm input{position:absolute;opacity:0;pointer-events:none}
.pm .mk{
  height:32px;border-radius:var(--r);display:grid;place-items:center;
  background:var(--wash-2);font:800 12.5px/1 var(--sans);color:var(--navy);margin-bottom:9px;
}
.pm .mk.is-card{background:var(--navy);color:#fff}
.pm .mk.is-pp{background:#F0F5FB;color:#1B4C8C}
.pm .mk.is-ep{background:var(--rose-w);color:var(--rose)}
.pm b{display:block;font-size:13.5px;font-weight:600}
.pm .when{margin-top:7px}

.terms-check{margin:18px 0 4px}

/* --- отстъпка в обобщението --- */
.cs-row.is-disc span,.cs-row.is-disc b{color:var(--ok)}

@media (max-width:640px){
  .add{grid-template-columns:auto 1fr;row-gap:10px}
  .a-pr,.add .btn{grid-column:2}
  .st-l{display:none}
  .st.is-now .st-l{display:inline}
}

/* ==========================================================================
   Първа стъпка по макета
   ========================================================================== */

/* --- избраният план, тъмна лента --- */
.picked{
  display:grid;grid-template-columns:auto 1fr auto;gap:15px;align-items:center;
  background:var(--navy);color:#fff;border-radius:var(--r-md);
  padding:17px 20px;margin-bottom:16px;
}
.pk-ic{
  width:40px;height:40px;border-radius:var(--r);display:grid;place-items:center;
  background:rgba(255,255,255,.12);flex:0 0 auto;
}
.pk-ic svg{width:20px;height:20px}
.picked b{display:block;font-size:17px;font-weight:700;letter-spacing:-.02em}
.picked>div>span{display:block;font-size:13px;color:rgba(255,255,255,.62);margin-top:2px}
.picked a{color:#fff;font-size:13px;text-decoration:underline;opacity:.82;white-space:nowrap}
.picked a:hover{opacity:1;color:#fff}

/* --- период като плочки --- */
.terms{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.term{
  border:1px solid var(--line);border-radius:var(--r-md);padding:16px 15px;
  cursor:pointer;position:relative;text-align:center;display:block;
}
.term:has(input:checked){border-color:var(--rose);box-shadow:0 0 0 1px var(--rose) inset}
.term input{position:absolute;opacity:0;pointer-events:none}
.t-p{display:block;font:600 1.28rem/1 var(--mono);letter-spacing:-.035em}
.t-u{display:block;font-size:12px;color:var(--ink-3);margin-top:5px}
.t-save{
  display:inline-block;margin-top:10px;font:700 10.5px/1 var(--sans);
  text-transform:uppercase;letter-spacing:.05em;
  background:var(--ok-w);color:var(--ok);padding:4px 8px;border-radius:3px;
}
.t-tag{
  position:absolute;top:-9px;left:50%;transform:translateX(-50%);
  background:var(--rose);color:#fff;font:700 10px/1 var(--sans);
  text-transform:uppercase;letter-spacing:.05em;padding:4px 10px;
  border-radius:3px;white-space:nowrap;
}

/* --- избор какво правим с домейна --- */
.dopt{
  display:flex;gap:10px;align-items:flex-start;padding:13px 0;
  border-bottom:1px solid var(--line);cursor:pointer;
}
.dopt:last-of-type{border-bottom:0;padding-bottom:16px}
.dopt input{position:absolute;opacity:0;pointer-events:none}
.d-radio{
  width:19px;height:19px;border:2px solid var(--line-2);border-radius:50%;
  flex:0 0 auto;margin-top:1px;display:grid;place-items:center;
}
.dopt:has(input:checked) .d-radio{border-color:var(--rose)}
.dopt:has(input:checked) .d-radio::after{
  content:"";width:9px;height:9px;border-radius:50%;background:var(--rose);
}
.dopt b{display:block;font-size:14.5px;font-weight:600}
.dopt>span>span{display:block;font-size:13px;color:var(--ink-2);margin-top:2px}

/* --- резултат от проверката --- */
.d-res{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;
  align-items:center;padding:12px 15px;border-radius:var(--r);margin-top:12px;
}
.d-res.is-free{background:var(--ok-w);border:1px solid #C9E4D8}
.d-res.is-taken{background:var(--rose-w);border:1px solid #F0CBD6}
.d-res.is-warn{background:var(--warn-w);border:1px solid #EDDDB8}
.d-dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
.d-res.is-free .d-dot{background:var(--ok)}
.d-res.is-taken .d-dot{background:var(--rose)}
.d-res.is-warn .d-dot{background:var(--warn)}
.d-res b{font-family:var(--mono);font-size:14.5px;font-weight:600}
.d-pr{font-family:var(--mono);font-size:14px;font-weight:600;white-space:nowrap}
.d-st{font-size:13px;white-space:nowrap}
.d-res.is-free .d-st{color:var(--ok)}
.d-res.is-taken .d-st{color:var(--rose)}
.d-res.is-warn .d-st{color:var(--warn)}

@media (max-width:640px){
  .picked{grid-template-columns:auto 1fr;row-gap:9px}
  .picked a{grid-column:2}
  .d-res{grid-template-columns:auto 1fr;row-gap:6px}
  .d-pr,.d-st{grid-column:2}
}

/* --- същата лента, но като покана за хостинг --- */
.picked.is-empty{
  background:var(--paper);color:var(--ink);
  border:1px solid var(--line);
}
.picked.is-empty .pk-ic{background:var(--wash-2);color:var(--navy)}
.picked.is-empty>div>span{color:var(--ink-2)}
.picked.is-empty a{color:var(--rose);font-weight:600;opacity:1;text-decoration:none}
.picked.is-empty a:hover{text-decoration:underline;color:var(--rose)}

/* ==========================================================================
   Данни за фактура
   ========================================================================== */

/* Раздели вместо отметки: изборът решава кои полета изобщо трябват. */
.co-tabs{
  display:flex;gap:2px;background:var(--wash-2);padding:3px;
  border-radius:var(--r);margin-bottom:20px;width:fit-content;
}
.co-tab{
  padding:8px 18px;border-radius:3px;font-size:14px;font-weight:600;
  color:var(--ink-2);cursor:pointer;position:relative;
}
.co-tab input{position:absolute;opacity:0;pointer-events:none}
.co-tab:has(input:checked){
  background:var(--paper);color:var(--ink);box-shadow:0 1px 3px rgba(14,39,69,.1);
}

.co-two{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}

.co-form .field{margin-bottom:14px}
.co-form label{
  display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:5px;
}
.co-form .control{width:100%}

.co-note{
  font-size:13.5px;color:var(--ink-2);margin:4px 0 0;line-height:1.6;
}

.co-who{
  display:flex;align-items:center;gap:14px;justify-content:space-between;
  background:var(--wash);border-radius:var(--r);padding:14px 16px;
}
.co-who b{display:block;font-size:15px;font-weight:700}
.co-who span{display:block;font-size:13px;color:var(--ink-2);margin-top:1px}

/*
 * Данните на фирмата се скриват, докато не е избрано „Фирма“.
 * Полета, които не трябват, объркват повече от липсващи.
 */
.co-form:has(input[name="type"][value="company"]:checked) .co-company{display:block}
.co-company{display:none}
.co-company.is-on{display:block}

@media (max-width:640px){
  .co-two{grid-template-columns:1fr}
}

/* --- изборите с кръгче: надписът е СРЕЩУ него, не над него --- */
.dopt{
  display:flex!important;flex-direction:row!important;
  align-items:flex-start;gap:11px;
}
.dopt>span:last-child{
  flex:1 1 auto;min-width:0;display:block;
  font-weight:400;color:var(--ink);
}

/* Плочките за период също са със свой строеж. */
.term{display:block!important;flex-direction:initial!important}

/* Разделите физическо лице / фирма — също. */
.co-tab{display:block!important;flex-direction:initial!important}



















































/* ==== domain-search: начало ==== */

/* ══════════════════════════════════════════════════════════
   ПРОВЕРКА НА ДОМЕЙН · значки и процедура
   ══════════════════════════════════════════════════════════ */

/*
 * ЗНАЧКАТА КАЗВА СЪСТОЯНИЕТО с една дума, преди окото да стигне до
 * цената.
 */
.dres-pills{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin-bottom:12px;
}

.dpill{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px;border-radius:99px;
  font:700 11.5px/1 var(--sans);white-space:nowrap;
}
.dpill i{
  width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 auto;
}

.dpill-ok{background:#E7F5EF;color:var(--up)}
.dpill-muted{background:var(--mist);color:var(--steel)}
.dpill-warn{background:#FBF4E4;color:var(--warn)}
.dpill-bad{background:#FDF0EE;color:var(--down)}
.dpill-blue{background:#EAF2FB;color:#1C5FA8}

/* Плътната значка: само за най-евтиния ред. */
.dpill-solid{background:var(--rose);color:#fff}

/*
 * Цената за подновяване стои ПОД тази за първата година.
 *
 * „9 сега, 14 догодина“ е различно от „11 и 11“, а само първото число
 * не го казва.
 */
.dres-renew{
  display:block;font:400 11.5px/1.3 var(--sans);font-style:normal;
  color:var(--steel);margin-top:5px;
}

/* ══════════════════════════════════════════════════════════
   „.bg“ · процедурата
   ══════════════════════════════════════════════════════════ */
/*
 * Казва се ПРЕДВАРИТЕЛНО: четирите стъпки и колко трае всяка.
 *
 * Взаимствано от българските регистратори — при тях това стои в
 * помощните страници, а човек го открива след плащането.
 */
.dproc{
  border-radius:var(--r-lg, 16px);margin-top:14px;overflow:hidden;
  border:1px solid rgba(154,101,18,.22);background:#FBF4E4;
}

.dproc-h{display:flex;gap:13px;align-items:flex-start;padding:16px 18px}

.dproc-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--warn);color:#fff;
}
.dproc-ic svg{width:16px;height:16px}

.dproc-t{flex:1;font-size:13.5px;color:var(--warn);line-height:1.6}
.dproc-t b{display:block;font-weight:700;margin-bottom:4px}

.dproc-steps{
  background:var(--paper);border-top:1px solid rgba(154,101,18,.18);
  padding:18px;
}

.dpstep{
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:start;
  padding:13px 0;border-bottom:1px solid var(--line);
}
.dpstep:first-child{padding-top:0}
.dpstep:last-child{border-bottom:0;padding-bottom:0}

.dpstep-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:#FDF1F4;color:var(--rose);
  font:700 12.5px/1 var(--mono);
}

.dpstep-t{font-size:13.5px;line-height:1.55;color:var(--ink-soft)}
.dpstep-t b{display:block;color:var(--ink);font-weight:700;margin-bottom:3px}

/* Колко трае: то отговаря на въпроса „кога ще работи“. */
.dpstep-w{
  font:600 11px/1 var(--sans);color:var(--steel-lt);
  white-space:nowrap;padding-top:6px;
}

.dproc-warn-wrap{padding:0 18px 18px;background:var(--paper)}

/*
 * НАЙ-ВАЖНОТО: плащането само по себе си не запазва домейна.
 *
 * Клиент, който плати и мисли, че е негов, се обажда ядосан седмица
 * по-късно.
 */
.dproc-warn{
  padding:12px 14px;border-radius:var(--r, 10px);
  background:#FDF0EE;border:1px solid rgba(185,59,51,.2);
  font-size:13px;color:var(--down);line-height:1.55;
}
.dproc-warn b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   Алтернативите
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-ЕВТИНИЯТ носи ръб и плътна значка.
 *
 * Без нея човек чете пет цени и ги сравнява наум.
 */
.sug-list li.is-best{
  border-color:var(--rose);background:#FDF1F4;
}

/* Подновяването под цената, по-дребно. */
.sug-price em{
  display:block;font:400 11px/1.3 var(--sans);font-style:normal;
  color:var(--steel);margin-top:4px;
}

/* ── по екрани ── */
@media (max-width:620px){
  /* Часът минава на свой ред: три колони не се събират. */
  .dpstep{grid-template-columns:auto 1fr}
  .dpstep-w{grid-column:2;padding-top:2px}

  .dproc-h{padding:14px}
  .dproc-steps{padding:14px}
  .dproc-warn-wrap{padding:0 14px 14px}
}


/* ══════════════════════════════════════════════════════════
   РЕЗУЛТАТЪТ · един ред, не четири
   ══════════════════════════════════════════════════════════ */
/*
 * Дотук име, цена и бутон бяха на ОТДЕЛНИ РЕДОВЕ и заемаха половин
 * екран за три думи.
 */
.dres.is-good,
.dres.is-bad,
.dres.is-warn{
  display:block;padding:clamp(18px,2.6vw,24px);
  border-radius:var(--r-lg, 16px);
}

.dres .dres-body{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
}

/*
 * Името НЕ разтяга реда.
 *
 * С „flex:1“ то избутваше цената и бутона чак в другия край — между
 * тях зееше празнота, а окото трябваше да минава разстояние за три
 * думи.
 *
 * Сега трите стоят ЕДНО ДО ДРУГО, а празното остава отдясно.
 */
.dres .dres-name{
  margin:0;min-width:0;
  font:800 clamp(1.15rem,2.5vw,1.5rem)/1.12 var(--mono);
  letter-spacing:-.035em;word-break:break-all;
}

/* Празното е ТУК, след бутона. */
.dres .dres-body::after{content:'';flex:1;order:9}

.dres .dres-price{
  margin:0;flex:0 0 auto;
  font:800 clamp(1.25rem,2.6vw,1.5rem)/1 var(--mono);letter-spacing:-.035em;
  padding-left:6px;
}
.dres .dres-price span{
  font:400 11.5px/1 var(--sans);color:var(--steel);margin-left:4px;
}

/* Бутонът е ПОСЛЕДЕН и се долепя вдясно. */
.dres .btn{flex:0 0 auto;order:10;margin-left:auto}

/*
 * МИГАЩА ТОЧКА · само където нещо СЕ СЛУЧВА.
 *
 * Мигане навсякъде значи мигане никъде: окото свиква и спира да го
 * вижда.
 */
.dpill-live i{animation:dblink 1.6s ease-in-out infinite}

@keyframes dblink{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.35;transform:scale(.82)}
}

/* Дишащ ръб при най-евтиния; спира при посочване, за да не пречи. */
.dpill-solid.dpill-pulse{position:relative}
.dpill-solid.dpill-pulse::after{
  content:'';position:absolute;inset:-3px;border-radius:99px;
  border:2px solid currentColor;opacity:0;
  animation:dring 2.4s ease-out infinite;
}
.dpill-solid.dpill-pulse:hover::after{animation:none}

@keyframes dring{
  0%{opacity:.5;transform:scale(.94)}
  70%{opacity:0;transform:scale(1.12)}
  100%{opacity:0}
}

/* ══════════════════════════════════════════════════════════
   Стъпките · четири колонки
   ══════════════════════════════════════════════════════════ */
/*
 * Четири РЕДА правят стена от текст; четири КОЛОНКИ се четат наведнъж.
 */
.dproc-steps{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}

.dpstep{
  display:block;position:relative;padding:0 0 0 34px;border:0;
}

.dpstep-n{position:absolute;left:0;top:0}

.dpstep-t{display:block;font-size:12.5px}
.dpstep-t b{display:block;font:700 13px/1.35 var(--sans);margin-bottom:4px}

.dpstep-w{
  display:inline-block;margin-top:7px;padding:3px 8px;border-radius:99px;
  background:var(--wash, #F5F7FA);
  font:700 10.5px/1 var(--sans);color:var(--steel-lt);
}

/* ══════════════════════════════════════════════════════════
   Вместо таблицата
   ══════════════════════════════════════════════════════════ */
.dsec-head{max-width:640px;margin:0 0 clamp(24px,3.5vw,36px)}
.dsec-head h2{margin:0 0 12px}
.dsec-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ── четирите предимства ── */
.dwhy{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.dwhy-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.dwhy-ic{
  width:40px;height:40px;border-radius:12px;margin-bottom:14px;
  display:grid;place-items:center;
  background:#FDF1F4;color:var(--rose);
}
.dwhy-ic svg{width:19px;height:19px}

.dwhy-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:6px}
.dwhy-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ── въпросите ── */
/*
 * ЗА ТЪРСАЧКИТЕ: те хващат питания като „колко струва .bg домейн“ и
 * излизат разгънати в резултатите.
 *
 * Числото в началото се вижда ПРЕДИ текста.
 */
.dfaq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.dfaq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

.dfaq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);
  font:700 12px/1 var(--mono);
}

.dfaq-i h3{font:700 15.5px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.dfaq-i p{margin:0;font-size:14px;color:var(--ink-soft);line-height:1.65}
.dfaq-i b{color:var(--ink);font-weight:700}

/* ── по екрани ── */
@media (max-width:1000px){
  .dproc-steps{grid-template-columns:1fr 1fr}
  .dwhy{grid-template-columns:1fr 1fr}
  .dfaq{grid-template-columns:1fr}
}

@media (max-width:620px){
  .dproc-steps{grid-template-columns:1fr}
  .dwhy{grid-template-columns:1fr}

  /* Цената и бутонът заемат цял ред: заедно с името не се събират. */
  .dres .dres-price{min-width:100%;text-align:left}
  .dres .btn{width:100%}
}


/* ══════════════════════════════════════════════════════════
   ГЛАВАТА · тъмна, с плочките отдясно
   ══════════════════════════════════════════════════════════ */
.dsearch{
  background:var(--navy, #0E2745);color:#fff;
  padding:clamp(36px,6vw,64px) 0 clamp(34px,5vw,56px);
}

/*
 * Двете колони: полето отляво, плочките отдясно.
 *
 * Едно под друго, плочките изглеждат като списък с цени, а полето се
 * губи най-горе.
 */
.dsearch > .wrap-w{
  display:grid;grid-template-columns:1.25fr 1fr;
  gap:clamp(24px,4vw,48px);align-items:start;
}

.dsearch h1,
.dsearch h2{
  font:800 clamp(1.9rem,4vw,2.7rem)/1.08 var(--sans);
  letter-spacing:-.035em;margin:0 0 12px;color:#343434;
}

.dsearch > .wrap-w > div > p{
  color:rgb(6 6 6 / 72%);font-size:clamp(14.5px,1.7vw,16px);
  margin:0 0 22px;max-width:480px;line-height:1.6;
}

/* ── полето ── */
.dsearch-form{
  display:flex;gap:9px;flex-wrap:wrap;
  padding:6px;border-radius:var(--r-lg, 16px);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);
}

.dsearch-form input{
  flex:1;min-width:190px;
  padding:14px 17px;border:0;border-radius:var(--r, 10px);
  background:#fff;color:var(--ink, #0E2745);
  font:600 clamp(15.5px,1.9vw,17px)/1.3 var(--sans);letter-spacing:-.01em;
}
.dsearch-form input:focus{outline:2px solid var(--rose);outline-offset:1px}
.dsearch-form input::placeholder{color:var(--steel-lt);font-weight:400}

.dsearch-form .btn{padding:14px 28px;font-size:15.5px;flex:0 0 auto}

/*
 * ТРИ ОБЕЩАНИЯ вместо изречение.
 *
 * Те отговарят на въпросите, преди да са зададени.
 */
.dsearch-notes{
  display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;
  font-size:13px;color:rgb(0 0 0);
}
.dsearch-notes span{display:inline-flex;align-items:center;gap:7px}

.dsearch-notes i{
  width:15px;height:15px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:#61b511;color:#ffffff;
}
.dsearch-notes svg{width:9px;height:9px}

/* ── плочките ── */
.tld-chips{display:grid;grid-template-columns:1fr 1fr;gap:9px}

.tld-chip{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 15px;border-radius:var(--r, 10px);text-decoration:none;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  transition:background .15s,border-color .15s;
}
.tld-chip:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.26)}

/* „.bg“ е с розов ръб: той е причината повечето хора да са тук. */
.tld-chip.is-hot{background:rgba(192,51,92,.16);border-color:rgba(192,51,92,.55)}

.tld-chip b{font:700 14px/1 var(--mono);color:#fff;letter-spacing:-.02em}

.tld-chip .p{text-align:right;white-space:nowrap}
.tld-chip .p s{
  display:block;font:400 11px/1 var(--mono);
  color:rgba(255,255,255,.42);text-decoration:line-through;margin-bottom:4px;
}
.tld-chip .p em{font:700 13.5px/1 var(--mono);font-style:normal;color:#61b511;}

/* Всички останали: зад една връзка, не под плочките. */
.tld-chip-more{
  grid-column:1 / -1;
  padding:11px;border-radius:var(--r, 10px);text-align:center;text-decoration:none;
  border:1px dashed rgba(255,255,255,.13);
  font:600 12.5px/1 var(--sans);color:rgba(255,255,255,.62);
}
.tld-chip-more:hover{border-color:rgba(255,255,255,.3);color:#101010;}

@media (max-width:1000px){
  .dsearch > .wrap-w{grid-template-columns:1fr}
}

@media (max-width:620px){
  .tld-chips{grid-template-columns:1fr}
  .dsearch-form .btn{width:100%}
}


/* ══════════════════════════════════════════════════════════
   Списъкът с алтернативи · целият
   ══════════════════════════════════════════════════════════ */
/*
 * ПРОПУСНАТО ПЪРВИЯ ПЪТ.
 *
 * Писах само правилото за най-евтиния ред, а самата решетка беше в
 * „site.css“ — файл, който страницата НЕ ЧЕТЕ. Затова редовете се
 * разпадаха: име, цена и бутон падаха един под друг.
 */
.sug-title{
  font:700 1.1rem/1.3 var(--sans);letter-spacing:-.02em;
  margin:28px 0 14px;color:var(--ink, #0E2745);
}

.sug-list{
  list-style:none;padding:0;margin:0;
  display:grid;gap:8px;
}

.sug-list li{
  display:grid;grid-template-columns:1fr auto auto auto;
  gap:16px;align-items:center;
  padding:14px 18px;border-radius:var(--r, 10px);
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  transition:border-color .15s,box-shadow .15s;
}
.sug-list li:hover{
  border-color:var(--steel-lt, #7385A0);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Най-евтиният носи ръб: без него човек сравнява пет цени наум. */
.sug-list li.is-best{border-color:var(--rose, #C0335C);background:#FDF1F4}

.sug-name{
  font:500 15.5px/1 var(--mono);letter-spacing:-.02em;
  word-break:break-all;min-width:0;color:var(--ink, #0E2745);
}

.sug-price{
  font:700 15.5px/1 var(--mono);letter-spacing:-.02em;
  white-space:nowrap;text-align:right;color:var(--ink, #0E2745);
}

/* Подновяването под цената, по-дребно. */
.sug-price em{
  display:block;font:400 11px/1.3 var(--sans);font-style:normal;
  color:var(--steel, #56677F);margin-top:5px;
}

/* ══════════════════════════════════════════════════════════
   Зает домейн · трите пътя
   ══════════════════════════════════════════════════════════ */
.dcard{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 16px);padding:clamp(18px,2.6vw,24px);
  margin-top:14px;
}

.dcard h2{
  font:700 1.05rem/1.3 var(--sans);letter-spacing:-.02em;
  margin:0 0 16px;color:var(--ink, #0E2745);
}

.dsteps{display:grid;gap:13px}

/*
 * Номерът е ОТСТРАНИ, не слепен за текста.
 *
 * Без решетка той се лепи за първата дума: „1Вземи го в друго
 * разширение“.
 */
.dstep{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  font-size:14px;line-height:1.55;color:var(--ink-soft, #3A4A63);
}

.dstep-n{
  width:25px;height:25px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;
  background:#FDF1F4;color:var(--rose, #C0335C);
  font:700 12px/1 var(--mono);
}

.dstep b{color:var(--ink, #0E2745);font-weight:700}

/* Съобщението при мълчащ регистър. */
.dres-msg{
  flex:1;min-width:200px;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft, #3A4A63);
}

@media (max-width:620px){
  /* Редът се разпада на две: име и значка горе, цена и бутон долу. */
  .sug-list li{grid-template-columns:1fr auto;gap:12px}
  .sug-list li .btn{grid-column:1 / -1;text-align:center;justify-content:center}
}


/* ══════════════════════════════════════════════════════════
   КОЛИЧКАТА · лентата долу
   ══════════════════════════════════════════════════════════ */
/*
 * ЗАЛЕПЕНА ДОЛУ: човек, който търси пет имена, не бива да превърта
 * нагоре, за да види какво е избрал.
 */
.cartbar{
  position:sticky;bottom:0;z-index:30;
  padding:0 0 16px;pointer-events:none;
}

.cartbar-in{
  max-width:1180px;margin:0 auto;
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding:16px 22px;border-radius:var(--r-lg, 16px);
  background:var(--navy, #0E2745);color:#fff;
  box-shadow:0 10px 32px rgba(14,39,69,.32);
  pointer-events:auto;
}

.cartbar-t{flex:1;min-width:180px;font-size:13px;color:rgba(255,255,255,.66)}
.cartbar-t b{display:block;color:#fff;font-weight:700;font-size:14px;margin-bottom:3px}

.cartbar-sum{
  font:800 1.3rem/1 var(--mono);letter-spacing:-.03em;
  flex:0 0 auto;text-align:right;
}

/* Следващата година: показва се само когато е различна. */
.cartbar-sum em{
  display:block;font:400 11px/1 var(--sans);font-style:normal;
  color:rgba(255,255,255,.55);margin-top:6px;
}

.cartbar .btn-ghost{
  background:transparent;border-color:rgba(255,255,255,.24);color:#fff;
}
.cartbar .btn-ghost:hover{
  background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.4);
}

/* Формата за добавяне не разтяга реда. */
.cart-add{display:contents}

/* Вече вътре: казва го, вместо да мълчи при втори натиск. */
.btn.is-in{gap:6px;color:var(--ok, #127A55);border-color:rgba(18,122,85,.3)}
.btn.is-in svg{width:13px;height:13px}
.btn.is-in:hover{background:#E7F5EF}

/* ══════════════════════════════════════════════════════════
   Стъпките · връзки назад
   ══════════════════════════════════════════════════════════ */
/*
 * Минатите стъпки са ВРЪЗКИ: човек, който е сгрешил плана, не бива да
 * започва отначало.
 *
 * Напред остава заключено — стъпка, до която още не се е стигнало, няма
 * какво да покаже.
 */
.st-back{
  display:inherit;align-items:inherit;gap:inherit;
  color:inherit;text-decoration:none;
}
.st-back:hover .st-l{color:var(--rose, #C0335C);text-decoration:underline}
.st-back:hover .st-n{border-color:var(--rose, #C0335C)}

/* Показалецът казва, че се щрака — иначе изглежда като картинка. */
.st.is-done .st-back{cursor:pointer}

@media (max-width:620px){
  .cartbar{padding:0 12px 12px}
  .cartbar-in{flex-direction:column;align-items:stretch;padding:14px 16px}
  .cartbar-sum{text-align:left}
  .cartbar .btn{width:100%}
}


/* ══════════════════════════════════════════════════════════
   Количката · списъкът в страницата
   ══════════════════════════════════════════════════════════ */
.cart-box{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 16px);padding:20px 22px;margin-bottom:18px;
}

.cart-box-h{
  display:flex;align-items:center;gap:12px;
  margin-bottom:14px;
}
.cart-box-h h2{
  flex:1;margin:0;font:700 1.05rem/1.3 var(--sans);letter-spacing:-.02em;
}

/* „Изпразни“ е дребно: то не бива да се натиска по погрешка. */
.cart-clear{
  border:0;background:0;cursor:pointer;padding:4px 8px;
  font:600 12px/1 var(--sans);color:var(--steel-lt, #7385A0);
}
.cart-clear:hover{color:var(--bad, #B0342C);text-decoration:underline}

.cart-list{list-style:none;padding:0;margin:0;display:grid}

.cart-list li{
  display:grid;grid-template-columns:1fr auto auto;
  gap:16px;align-items:center;
  padding:13px 0;border-bottom:1px solid var(--line, #DFE5EC);
}
.cart-list li:last-child{border-bottom:0}

.cart-n{
  font:600 15px/1 var(--mono);letter-spacing:-.02em;
  word-break:break-all;min-width:0;
}

.cart-p{
  font:700 15px/1 var(--mono);letter-spacing:-.02em;
  white-space:nowrap;text-align:right;
}
.cart-p em{
  display:block;font:400 11px/1.3 var(--sans);font-style:normal;
  color:var(--steel, #56677F);margin-top:5px;
}

.cart-rm{display:flex}
.cart-rm button{
  width:30px;height:30px;border-radius:8px;cursor:pointer;
  display:grid;place-items:center;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  color:var(--steel-lt, #7385A0);
}
.cart-rm button:hover{
  border-color:var(--bad, #B0342C);color:var(--bad, #B0342C);background:#FDF0EE;
}
.cart-rm svg{width:14px;height:14px}

.cart-sum{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  margin-top:16px;padding-top:16px;border-top:2px solid var(--ink, #0E2745);
  font-size:14px;
}
.cart-sum b{font:800 1.25rem/1 var(--mono);letter-spacing:-.03em}

.cart-note{
  margin:10px 0 0;font-size:12.5px;color:var(--steel, #56677F);
}

/* „.bg“ иска заявка: казва се ТУК, преди плащането. */
.cart-warn{
  margin:14px 0 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:13px;color:var(--warn, #9A6A12);line-height:1.55;
}
.cart-warn b{font-weight:700}

.cart-go{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}

@media (max-width:620px){
  .cart-list li{grid-template-columns:1fr auto}
  .cart-rm{grid-column:2}
  .cart-go .btn{flex:1}
}


/* ══════════════════════════════════════════════════════════
   Количката в шапката
   ══════════════════════════════════════════════════════════ */
/*
 * ПОКАЗВА СЕ САМО КОГАТО ИМА НЕЩО ВЪТРЕ.
 *
 * Празна иконка е шум, който окото се научава да пропуска — и после не
 * я вижда и когато има какво.
 */
.nav-cart{
  position:relative;flex:0 0 auto;
  width:38px;height:38px;border-radius:var(--r, 10px);
  display:grid;place-items:center;
  background:#7cbf00;
  color:var(--ink, #0E2745);text-decoration:none;
  transition:border-color .15s,background .15s;
}
.nav-cart:hover{border-color:var(--rose, #C0335C);background:#FDF1F4}
.nav-cart svg{width:18px;height:18px}

/* Числото е ВЪРХУ иконката: до нея то се чете като цена. */
.nav-cart b{
  position:absolute;top:-6px;right:-6px;
  min-width:19px;height:19px;padding:0 5px;border-radius:99px;
  display:grid;place-items:center;
  background:var(--rose, #C0335C);color:#fff;
  font:700 11px/1 var(--mono);
}

/* ══════════════════════════════════════════════════════════
   Предложение за хостинг
   ══════════════════════════════════════════════════════════ */
/*
 * В САМАТА СТЪПКА, не бутон накрая.
 *
 * Досега водеше към плановете — това изхвърля човека от поръчката и той
 * се връща рядко.
 */
.hoffer{
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  padding:20px 22px;border-radius:var(--r-lg, 16px);margin:18px 0;
  background:#EAF2FB;border:1px solid rgba(28,95,168,.22);
}

.hoffer-t{flex:1;min-width:220px}
.hoffer-t b{
  display:block;font:700 15px/1.3 var(--sans);margin-bottom:5px;
  color:var(--blue, #1C5FA8);
}
.hoffer-t p{
  margin:0;font-size:13.5px;line-height:1.55;color:var(--ink-soft, #3A4A63);
}

.hoffer-p{
  text-align:right;flex:0 0 auto;
  padding-right:20px;border-right:1px solid rgba(28,95,168,.2);
}
.hoffer-name{
  display:block;font:600 12.5px/1 var(--sans);
  color:var(--steel, #56677F);margin-bottom:7px;
}
.hoffer-price{
  display:block;font:800 1.3rem/1 var(--mono);letter-spacing:-.03em;
  color:var(--ink, #0E2745);
}
.hoffer-price em{
  display:block;font:400 11px/1 var(--sans);font-style:normal;
  color:var(--steel, #56677F);margin-top:5px;
}

.hoffer-go{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;flex:0 0 auto;
}

/*
 * „Продължи без“ Е ВИДИМО, не скрито.
 *
 * Скрито, човек се чуди дали изобщо може да мине без хостинг — и се
 * отказва от целия ред.
 */
.hoffer-skip{
  font:600 13px/1 var(--sans);color:var(--steel, #56677F);
  text-decoration:underline;text-underline-offset:3px;
}
.hoffer-skip:hover{color:var(--ink, #0E2745)}

@media (max-width:720px){
  .hoffer-p{
    padding-right:0;border-right:0;text-align:left;
    padding-bottom:14px;border-bottom:1px solid rgba(28,95,168,.2);
    min-width:100%;
  }
  .hoffer-go{min-width:100%;justify-content:space-between}
}


/* ══════════════════════════════════════════════════════════
   Показалецът · „Домейни“
   ══════════════════════════════════════════════════════════ */
/*
 * ВРЪЗКА, НЕ БУТОН.
 *
 * „.nav-top“ е правено за бутон на падащо меню — то не носи показалец,
 * защото при бутон браузърът не го слага сам.
 *
 * Сега „Домейни“ е връзка и трябва да се държи като „Блог“ и
 * „Контакти“: ръчичка, за да личи, че се щрака.
 */
/*
 * ТЕЖЕСТТА ТРЯБВА ДА НАДДЕЛЕЕ.
 *
 * Съществуващото правило е „.nav>li>.nav-top“ — три части. Моето
 * „a.nav-top“ е две и губи, каквото и да пише в него.
 *
 * Затова тук е със същия път.
 */
.nav>li>a.nav-top{cursor:pointer}

/*
 * Стрелката се маха при връзка.
 *
 * Тя обещава падащо меню, каквото вече няма — а обещание, което не се
 * изпълнява, дразни повече от липсата му.
 */
.nav>li>a.nav-top svg{display:none}

/* ── количката: винаги видима ── */
/*
 * Празната е по-блед: тя стои, но не вика.
 *
 * Скрита, изчезва точно когато човек я търси — за да провери дали
 * изобщо е добавил нещо.
 */
.nav-cart{color:#000000;}
.nav-cart.has-items{color:var(--ink, #0E2745);border-color:var(--rose, #C0335C)}


/* ══════════════════════════════════════════════════════════
   МЕНЮТО · чекмедже отдясно
   ══════════════════════════════════════════════════════════ */
/*
 * ОТДЯСНО, НЕ ОТГОРЕ.
 *
 * Падащото отгоре бута страницата и се затваря при най-лекото
 * превъртане. Чекмеджето стои, докато не го затвориш — и палецът стига
 * до него, защото телефонът се държи с дясната ръка.
 */
@media (max-width:860px){
  .nav{
    position:fixed;top:0;right:0;bottom:0;left:auto;
    width:min(86vw, 340px);
    display:flex;flex-direction:column;gap:0;
    background:var(--paper);
    border-bottom:0;border-left:1px solid var(--line);
    box-shadow:-8px 0 32px rgba(14,39,69,.18);
    padding:70px 12px 24px;
    max-height:none;height:100dvh;overflow-y:auto;
    z-index:60;

    /* Извън екрана, докато не се отвори. */
    transform:translateX(100%);
    transition:transform .24s ease;
  }

  .nav.is-open{display:flex;transform:translateX(0)}

  /*
   * Затъмнение отзад.
   *
   * Без него менюто виси върху страницата и окото не знае кое е отпред.
   */
  .nav::before{content:none}

  .nav-veil{
    position:fixed;inset:0;z-index:55;
    background:rgba(14,39,69,.45);
    opacity:0;pointer-events:none;transition:opacity .24s;
  }
  .nav-veil.is-open{opacity:1;pointer-events:auto}

  /* Бутонът остава ОТГОРЕ, върху менюто: с него се затваря. */
  .nav-toggle{
    position:relative;z-index:70;
    width:42px;height:42px;
  }

  .nav.is-open ~ .nav-toggle,
  .nav-toggle[aria-expanded="true"]{
    color:var(--rose);
  }

  .nav>li>a,
  .nav>li>.nav-top{
    width:100%;padding:14px;font-size:16px;
    justify-content:space-between;
  }

  /* Подменютата са затворени по подразбиране. */
  .nav-drop,
  .mega{display:none}

  .nav-drop.is-open{display:block}
  .mega.is-open{display:grid}

  /* Стрелката се обръща: тя казва накъде води. */
  .nav>li>.nav-top svg{transition:transform .18s}
  .nav>li>.nav-top[aria-expanded="true"] svg{transform:rotate(180deg)}

  .nav-drop li a,
  .mega li a{padding:11px 14px}

  /* Страницата отдолу не се превърта. */
  body.nav-locked{overflow:hidden}

  /*
   * Количката остава ВИДИМА до бутона за меню.
   *
   * Скрита вътре, тя иска две натискания за нещо, което се гледа
   * най-често.
   */
  .nav-cart{order:-1}

  .site-header .wrap-w{gap:10px}
}

/*
 * ПОД 460: най-тесните телефони.
 */
@media (max-width:460px){
  .site-header .wrap-w{gap:8px}

  .brand img{width:118px;height:auto}

  /* Бутоните се смаляват, но остават четими. */
  .nav-actions .btn{padding:9px 13px;font-size:12.5px}

  /* Лентата с количката: числото под сумата, не до нея. */
  .cartbar-in{padding:12px 14px;gap:12px}
  .cartbar-t{font-size:12px}
  .cartbar-sum{font-size:1.15rem}

  /* Резултатът: името цял ред, за да не се реже. */
  .dres-name{min-width:100%}
  .dres-price{min-width:100%}
  .dres .btn{width:100%}

  /* Стъпките: само числата, без надписи — те не се събират. */
  .steps .st-l{display:none}
  .steps ol{gap:6px}

  /* Предложението за хостинг: всичко отвесно. */
  .hoffer{padding:16px;gap:14px}
  .hoffer-go{flex-direction:column;align-items:stretch}
  .hoffer-go .btn{width:100%}
  .hoffer-skip{text-align:center}
}

/*
 * ПОД 380: най-малките, които още се ползват.
 *
 * Тук вече се жертва украса, не съдържание.
 */
@media (max-width:380px){
  .dpill{padding:4px 9px;font-size:10.5px}
  .dres-pills{gap:6px}

  .cart-list li{gap:10px}
  .cart-n{font-size:13.5px}

  .tld-chip{padding:11px 13px}
  .tld-chip b{font-size:13px}
}


/* ══════════════════════════════════════════════════════════
   МЕНЮТО ВДЯСНО · на широк екран
   ══════════════════════════════════════════════════════════ */
/*
 * Досега менюто беше залепено ЗА ЛОГОТО, а вдясно зееше празно.
 *
 * Сега то се долепя до бутоните: окото минава от логото направо към
 * действията, а не през списък по средата.
 */
@media (min-width:861px){
  .site-header .wrap-w{
    display:flex;align-items:center;gap:clamp(16px, 2.5vw, 32px);
  }

  /*
   * ПРАЗНОТО СЕ МЕСТИ СЛЕД ЛОГОТО.
   *
   * Сега „.nav-actions“ има „margin-left:auto“ — то бута само бутоните
   * вдясно, а менюто остава залепено за логото.
   *
   * Тук празното отива веднага след логото: тогава и менюто, и
   * бутоните се долепят вдясно, един до друг.
   */
  .site-header .wrap-w > .brand{flex:0 0 auto;margin-right:auto}

  .site-header .wrap-w > .nav{flex:0 0 auto}

  /* „auto“ отпада: празното вече е при логото. */
  .site-header .wrap-w > .nav-actions{flex:0 0 auto;margin-left:0}
}


/* ══════════════════════════════════════════════════════════
   ВТОРА СТЪПКА · настройка на домейните
   ══════════════════════════════════════════════════════════ */
/*
 * ВСЕКИ ДОМЕЙН Е ОТДЕЛНА КУТИЯ.
 *
 * Настройките са различни за всеки, а обща форма кара човек да мисли,
 * че важат за всички.
 */
.dcfg{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 16px);padding:18px 20px;margin-bottom:12px;
}

.dcfg-h{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding-bottom:14px;margin-bottom:4px;
  border-bottom:1px solid var(--line, #DFE5EC);
}
.dcfg-h b{font:700 16px/1 var(--mono);letter-spacing:-.02em}

.dcfg-p{
  margin-left:auto;font:800 16px/1 var(--mono);letter-spacing:-.03em;
}

.dcfg-row{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:13px 0;border-bottom:1px solid var(--line, #DFE5EC);
}
.dcfg-row:last-child{border-bottom:0;padding-bottom:0}

.dcfg-l{flex:1;min-width:200px;font:600 14px/1.3 var(--sans)}
.dcfg-l span{
  display:block;font:400 12px/1.5 var(--sans);
  color:var(--steel, #56677F);margin-top:4px;
}

/* ── години ── */
.dcfg-years{display:flex;gap:6px;flex:0 0 auto}
.dcfg-y{display:contents}

.dcfg-yb{
  width:38px;height:38px;border-radius:9px;cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:700 14px/1 var(--mono);color:var(--ink, #0E2745);
}
.dcfg-yb:hover{border-color:var(--steel-lt, #7385A0)}
.dcfg-yb.is-on{
  background:var(--rose, #C0335C);border-color:var(--rose, #C0335C);color:#fff;
}

/* ── плъзгач ── */
.dcfg-t{display:flex;flex:0 0 auto}

.tgl{
  width:44px;height:25px;border-radius:99px;cursor:pointer;padding:0;
  border:0;background:var(--line, #DFE5EC);position:relative;
  transition:background .18s;
}
.tgl i{
  position:absolute;top:3px;left:3px;
  width:19px;height:19px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(14,39,69,.28);transition:transform .18s;
}
.tgl.is-on{background:var(--ok, #127A55)}
.tgl.is-on i{transform:translateX(19px)}

/* ══════════════════════════════════════════════════════════
   Потвържденията
   ══════════════════════════════════════════════════════════ */
/*
 * НЕЗАДАДЕНОТО НЕ Е „НЕ“.
 *
 * Обикновен плъзгач не става: изключен, той изглежда като отговорен с
 * „не“, а човек просто не го е пипал.
 *
 * Затова са два бутона и трето състояние — незададено, с жълт ръб.
 */
.dcfg-ask{border-color:rgba(28,95,168,.24);background:#EAF2FB}

.dcfg-intro{
  margin:12px 0 16px;font-size:13.5px;line-height:1.6;
  color:var(--ink-soft, #3A4A63);
}

.dcfg-ask-i{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r, 10px);padding:16px 18px;margin-bottom:10px;
}
.dcfg-ask-i:last-child{margin-bottom:0}

/* Незададеното е с жълт ръб: то спира продължаването. */
.dcfg-ask-i.is-unset{border-left:3px solid var(--warn, #9A6A12)}

.dcfg-ask-q{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.dcfg-ask-q b{font:700 14px/1 var(--mono);color:var(--rose, #C0335C)}
.dcfg-ask-q span{flex:1;min-width:200px;font:600 14px/1.4 var(--sans)}

.dcfg-ask-b{display:flex;gap:8px}
.dcfg-ask-b form{display:contents}

.dcfg-ask-btn{
  min-width:74px;padding:9px 16px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:700 13.5px/1 var(--sans);color:var(--ink-soft, #3A4A63);
}
.dcfg-ask-btn:hover{border-color:var(--steel-lt, #7385A0)}

.dcfg-ask-btn.is-yes{
  background:var(--ok, #127A55);border-color:var(--ok, #127A55);color:#fff;
}
.dcfg-ask-btn.is-no{
  background:var(--steel, #56677F);border-color:var(--steel, #56677F);color:#fff;
}

/*
 * Обяснителният ред се МЕНИ според отговора.
 *
 * „Какво следва“ е по-полезно от повторение на въпроса.
 */
.dcfg-ask-n{
  margin:12px 0 0;font-size:12.5px;line-height:1.6;
  color:var(--steel, #56677F);
}
.dcfg-ask-n b{color:var(--ink, #0E2745);font-weight:700}

.dcfg-ask-n.is-ok{color:var(--ok, #127A55)}
.dcfg-ask-n.is-ok b{color:var(--ok, #127A55)}

.dcfg-ask-n.is-warn{color:var(--bad, #B0342C)}
.dcfg-ask-n.is-warn b{color:var(--bad, #B0342C)}

/* ── заключеният бутон ── */
/*
 * ИЗГЛЕЖДА КАТО БУТОН, но не води никъде.
 *
 * Скрит, човек търси къде е „напред“. Блед и неподвижен, той казва
 * „има още нещо“.
 */
.btn.is-locked{
  opacity:.45;cursor:not-allowed;pointer-events:none;
}

.cart-locked-why{
  margin:12px 0 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:13px;color:var(--warn, #9A6A12);line-height:1.55;
}
.cart-locked-why b{font-weight:700}

@media (max-width:620px){
  .dcfg-row{gap:12px}
  .dcfg-l{min-width:100%}
  .dcfg-years{width:100%;justify-content:space-between}
  .dcfg-yb{flex:1}
  .dcfg-ask-b form,
  .dcfg-ask-b{width:100%}
  .dcfg-ask-btn{flex:1}
}


/* ══════════════════════════════════════════════════════════
   ПЛАЩАНЕ · всички методи на ЕДИН ред
   ══════════════════════════════════════════════════════════ */
/*
 * ПЛОЧКИ ЕДНА ДО ДРУГА, не списък отгоре надолу.
 *
 * Пет метода в стълб заемат половин екран за нещо, което се избира с
 * едно щракане. Наредени в ред, се виждат наведнъж.
 */
.pays{
  display:flex;gap:8px;flex-wrap:wrap;
}

.pm{
  flex:1 1 0;min-width:96px;
  display:flex;flex-direction:column;align-items:center;gap:7px;
  padding:12px 8px;border-radius:var(--r, 9px);cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  text-align:center;transition:border-color .15s, background .15s;
}
/*
 * ТЕЖЕСТТА ТРЯБВА ДА НАДДЕЛЕЕ.
 *
 * „.pm“ вече съществува в сайта — с „:has(input:checked)“, което е
 * по-силно от голото „:hover“. Моето правило стоеше и мълчеше.
 *
 * Затова тук е през „.pays“: с родителя става по-специфично.
 */
.pays .pm:hover{border-color:var(--steel-lt, #7385A0)}

.pays .pm:has(input:checked){
  border-color:var(--rose, #C0335C);background:#FDF1F4;
  box-shadow:0 0 0 1px var(--rose, #C0335C) inset;
}

/* Кръгчето е скрито: избраната плочка се вижда по ръба. */
.pm input{position:absolute;opacity:0;width:0;height:0}

.pm-marks{display:flex;align-items:center;gap:4px;flex:0 0 auto}
.pm-marks svg{height:20px;width:auto;display:block}

.pm > b{
  font:600 12px/1.25 var(--sans);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
}

/*
 * Кога тръгва: ЕДИНСТВЕНОТО, което човек пита за метод.
 *
 * Зелено при веднага, сиво при чакане — цветът казва отговора преди
 * думите.
 */
.pm .when{
  padding:2px 7px;border-radius:99px;
  font:700 9.5px/1 var(--sans);white-space:nowrap;
}
.pm .when.now{background:#E7F5EF;color:var(--ok, #127A55)}
.pm .when.wait{background:var(--wash, #F5F7FA);color:var(--steel, #56677F)}

@media (max-width:620px){
  /* По две в ред: пет плочки в ред стават по-тесни от знака. */
  .pm{flex:1 1 calc(50% - 4px);min-width:0}
  .pm-marks svg{height:18px}
}


/* ══════════════════════════════════════════════════════════
   ПОРЪЧКА · въпроси и сървъри в количката
   ══════════════════════════════════════════════════════════ */
/*
 * НЕЗАДАДЕНОТО НЕ Е „НЕ“.
 *
 * Обикновен плъзгач не става: изключен, той изглежда като отговорен с
 * „не“, а човек просто не го е пипал.
 *
 * Затова са два бутона и трето състояние — незададено, с жълт ръб.
 */
.oq{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 14px);padding:16px 18px;margin-bottom:12px;
}

/* Незададеното спира плащането — затова личи. */
.oq.is-unset{
  border-left:3px solid var(--warn, #9A6A12);background:#FBF4E4;
}

.oq-t{display:flex;align-items:center;gap:14px;flex-wrap:wrap}

.oq-l{flex:1;min-width:190px;font:600 13.5px/1.4 var(--sans)}

/* Белег ЗАЩО се вижда този въпрос. */
.owhy{
  display:inline-block;margin-left:7px;padding:2px 7px;border-radius:99px;
  background:var(--wash, #F5F7FA);color:var(--steel-lt, #7385A0);
  font:600 9.5px/1 var(--sans);vertical-align:1px;
}

.oq-b{display:flex;gap:6px;flex:0 0 auto}
.oq-b form{display:contents}

.oq-btn{
  min-width:60px;padding:9px 15px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:700 13px/1 var(--sans);color:var(--ink-soft, #3A4A63);
}
.oq-btn:hover{border-color:var(--steel-lt, #7385A0)}
.oq-btn.is-yes{background:var(--ok, #127A55);border-color:var(--ok, #127A55);color:#fff}
.oq-btn.is-no{background:var(--steel, #56677F);border-color:var(--steel, #56677F);color:#fff}

/*
 * Обяснителният ред СЕ МЕНИ според отговора.
 *
 * „Какво следва“ е по-полезно от повторение на въпроса.
 */
.oq-n{margin:10px 0 0;font-size:12.5px;line-height:1.6;color:var(--steel, #56677F)}
.oq-n b{color:var(--ink, #0E2745);font-weight:700}
.oq-n.is-ok{color:var(--ok, #127A55)}
.oq-n.is-ok b{color:var(--ok, #127A55)}
.oq-n.is-warn{color:var(--bad, #B0342C)}
.oq-n.is-warn b{color:var(--bad, #B0342C)}

/* ── сървърите ── */
/*
 * САМО БЕЗ ХОСТИНГ ПРИ НАС.
 *
 * С хостинг домейнът се насочва сам — питането е за нищо.
 */
.ocard{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 14px);margin-bottom:12px;overflow:hidden;
}

.ocard-h{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:13px 16px;border-bottom:1px solid var(--line, #DFE5EC);
  background:var(--wash, #F5F7FA);
}
.ocard-h h2{
  flex:1;margin:0;font:700 14px/1.3 var(--sans);letter-spacing:-.01em;
}

.ocard-b{padding:14px 16px}

.otwo{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.ons-go{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px;
}
.ons-go .hint{
  flex:1;min-width:180px;font:400 11.5px/1.5 var(--sans);
  color:var(--steel, #56677F);
}

/* ── заключеният бутон ── */
/*
 * ИЗГЛЕЖДА КАТО БУТОН, но не води никъде.
 *
 * Скрит, човек търси къде е „плати“. Блед и неподвижен, той казва „има
 * още нещо“.
 */
.btn.is-locked{opacity:.42;cursor:not-allowed;pointer-events:none}

.olocked{
  margin:12px 0 0;padding:11px 13px;border-radius:var(--r, 9px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:12.5px;color:var(--warn, #9A6A12);line-height:1.5;
}
.olocked b{font-weight:700}

@media (max-width:620px){
  .otwo{grid-template-columns:1fr}
  .oq-l{min-width:100%}
  .oq-b{width:100%}
  .oq-btn{flex:1}
}


/* ══════════════════════════════════════════════════════════
   КОЛИЧКА · две колони
   ══════════════════════════════════════════════════════════ */
/*
 * СМЕТКАТА Е ОТДЯСНО и залепена.
 *
 * Сложена накрая, тя кара човек да превърта нагоре-надолу, за да
 * провери какво плаща.
 */
.ocard-h .oprice{
  font:800 15px/1 var(--mono);letter-spacing:-.03em;
  margin-left:auto;
}

.ocard-rm{display:flex;flex:0 0 auto}
.ocard-rm button{
  width:26px;height:26px;border-radius:7px;cursor:pointer;
  display:grid;place-items:center;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  color:var(--steel-lt, #7385A0);
}
.ocard-rm button:hover{
  border-color:var(--bad, #B0342C);color:var(--bad, #B0342C);background:#FDF0EE;
}
.ocard-rm svg{width:12px;height:12px}

/* Значка при домейна: „.bg“ иска заявка, „.com“ тръгва за минути. */
.opill{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:99px;
  font:700 10.5px/1 var(--sans);white-space:nowrap;
}
.opill.warn{background:#FBF4E4;color:var(--warn, #9A6A12)}
.opill.blue{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.opill.ok{background:#E7F5EF;color:var(--ok, #127A55)}

/* ── сметката ── */
.oa-box{
  background:var(--paper, #fff);border:1px solid var(--line, #DFE5EC);
  border-radius:var(--r-lg, 14px);padding:16px;
}

.oa-h{
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt, #7385A0);margin-bottom:13px;
}

.oa-lines{list-style:none;padding:0;margin:0 0 13px;display:grid;gap:9px}

.oa-lines li{display:flex;align-items:baseline;gap:10px;font-size:12.5px}
.oa-lines span{flex:1;color:var(--ink-soft, #3A4A63);min-width:0;word-break:break-all}
.oa-lines em{
  display:block;font:400 10.5px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt, #7385A0);margin-top:2px;
}
.oa-lines b{font:600 12.5px/1 var(--mono);white-space:nowrap}

.oa-sub{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  font-size:12.5px;color:var(--steel, #56677F);padding:4px 0;
}
.oa-sub b{font:600 12.5px/1 var(--mono);color:var(--ink, #0E2745)}

.oa-total{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding-top:13px;margin-top:9px;
  border-top:2px solid var(--ink, #0E2745);
}
.oa-total span{font:600 13px/1 var(--sans)}
.oa-total b{font:800 1.3rem/1 var(--mono);letter-spacing:-.03em}

/* Догодина: изненадата при подновяване гони клиенти. */
.oa-next{
  margin:13px 0 0;padding:9px 11px;border-radius:8px;
  background:var(--wash, #F5F7FA);
  font-size:11px;color:var(--steel, #56677F);line-height:1.5;
}
.oa-next b{color:var(--ink, #0E2745);font-weight:700}


/* ══════════════════════════════════════════════════════════
   ДАННИ ЗА ФАКТУРА · моите или други
   ══════════════════════════════════════════════════════════ */
/*
 * ВЛЕЗЛИЯТ ВИЖДА СВОИТЕ и избира.
 *
 * Повторното попълване при наличен профил е излишна работа — но и
 * задължителните му данни са грешка: фактурата може да е за друга
 * фирма, а адресът да се е сменил.
 */
.obill{display:flex;gap:6px;margin-bottom:14px}
.obill-f{display:contents}

.obill-b{
  flex:1;padding:10px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:600 12.5px/1 var(--sans);color:var(--ink-soft, #3A4A63);
}
.obill-b:hover{border-color:var(--steel-lt, #7385A0)}
.obill-b.is-on{
  background:var(--navy, #0E2745);border-color:var(--navy, #0E2745);color:#fff;
}

/*
 * Какво ще влезе във фактурата · показва се, не се пипа.
 *
 * Полета за четене изглеждат като полета за писане и човек се чуди
 * защо не се пишат.
 */
.omine{
  padding:14px 16px;border-radius:var(--r, 9px);
  background:var(--wash, #F5F7FA);border:1px solid var(--line, #DFE5EC);
  display:grid;gap:5px;
}
.omine b{font:700 14px/1.3 var(--sans)}
.omine span{font-size:12.5px;color:var(--steel, #56677F)}
.omine .mono{font-family:var(--mono)}
.omine a{
  justify-self:start;margin-top:6px;
  font:600 12px/1 var(--sans);color:var(--rose, #C0335C);
  text-decoration:underline;text-underline-offset:3px;
}

.oguest{
  margin:14px 0 0;padding:11px 13px;border-radius:8px;
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:12px;color:var(--ok, #127A55);line-height:1.55;
}
.oguest b{font-weight:700}


/* ══════════════════════════════════════════════════════════
   НУЖЕН Е ПРОФИЛ
   ══════════════════════════════════════════════════════════ */
/*
 * ГОСТ НЕ МОЖЕ ДА ПОРЪЧА.
 *
 * Домейнът иска притежател, а притежателят е сметка — така работят
 * всички регистратори.
 *
 * Полета за попълване тук са заблуда: човекът ги пълни, а накрая пак
 * трябва профил.
 */
.oauth{border-color:rgba(28,95,168,.24)}
.oauth .ocard-h{background:#EAF2FB;border-bottom-color:rgba(28,95,168,.2)}
.oauth .ocard-h h2{color:var(--blue, #1C5FA8)}

.oauth-t{
  margin:0 0 16px;font-size:13.5px;line-height:1.6;
  color:var(--ink-soft, #3A4A63);
}

/*
 * ДВА ПЪТЯ, еднакво видими.
 *
 * „Вход“ е по-често, затова е плътният — но „регистрация“ не е скрито:
 * човек без профил търси точно него.
 */
.oauth-go{display:flex;gap:9px;flex-wrap:wrap}
.oauth-go .btn{flex:1;min-width:150px}

/* Количката не се губи: това се казва, за да не се страхува човек. */
.oauth-keep{
  margin:14px 0 0;padding:11px 13px;border-radius:var(--r, 9px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:12px;color:var(--ok, #127A55);line-height:1.55;
}
.oauth-keep b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   Полетата в количката
   ══════════════════════════════════════════════════════════ */
/*
 * Полетата бяха ГОЛИ — без нашия вид, защото „control“ живее в друг
 * файл и там е стилизирано за друга страница.
 */
.ocard-b .field{margin-bottom:0}

.ocard-b .field label{
  display:block;font:600 11.5px/1 var(--sans);
  color:var(--steel, #56677F);margin-bottom:6px;
}

.ocard-b .field .control{
  width:100%;padding:10px 12px;border-radius:8px;
  border:1px solid var(--line, #DFE5EC);background:var(--paper, #fff);
  font:400 13.5px/1.3 var(--sans);color:var(--ink, #0E2745);
}
.ocard-b .field .control:focus{
  outline:none;border-color:var(--rose, #C0335C);
}
.ocard-b .field .control.mono{font-family:var(--mono);font-size:13px}

/* Двойката полета: равни и с еднакво разстояние. */
.ocard-b .otwo{margin-bottom:12px}
.ocard-b .otwo:last-child{margin-bottom:0}

/* Фирмените: показват се само при избран „фирма“. */
.ocard-b .co-company{display:none}
.ocard-b .co-company.is-on{display:block;margin-bottom:12px}

/* Превключвателят лице · фирма. */
.ocard-b .co-tabs{display:flex;gap:6px;margin-bottom:14px}

/*
 * БЕЗ „background“ и „color“ ТУК.
 *
 * В сайта има „.co-tab:has(input:checked)“, което ги задава за
 * избрания — и е по-силно от голото ми правило.
 *
 * Ако ги пиша и тук, неизбраните биха ги взели от мен, а избраният от
 * тях: два източника за едно нещо. По-чисто е да не ги пипам.
 */
.ocard-b .co-tab{
  flex:1;padding:10px;border-radius:8px;cursor:pointer;text-align:center;
  border:1px solid var(--line, #DFE5EC);
  font:600 12.5px/1 var(--sans);
}
.ocard-b .co-tab input{position:absolute;opacity:0;width:0;height:0}
/*
 * ЧЕРЕЗ „:has“, не с клас.
 *
 * В сайта вече има „.co-tab:has(input:checked)“ — по-силно от голото
 * „.is-on“. Моето правило щеше да стои и да мълчи.
 *
 * С родителя „.ocard-b“ отпред то надделява.
 */
.ocard-b .co-tab:has(input:checked),
.ocard-b .co-tab.is-on{
  background:var(--navy, #0E2745);border-color:var(--navy, #0E2745);color:#fff;
}

/* ==== domain-search: край ==== */

/* ══════════════════════════════════════════════════════════
   Срок на регистрация · менюто в количката
   ══════════════════════════════════════════════════════════ */
/*
 * Менюто стои в самия ред, не под него.
 *
 * Отделен ред за нещо, което се сменя с едно движение, разкъсва
 * връзката между името и цената му.
 */
.cart-yr{display:inline-flex;align-items:center;gap:8px;margin:0}

.cart-yr .control,
.cart-yr select{
  -webkit-appearance:none;appearance:none;
  padding:7px 30px 7px 11px;border-radius:8px;
  border:1px solid var(--line,#DCE3ED);background:var(--paper,#fff);
  font-family:var(--mono,ui-monospace,monospace);
  font-size:12.5px;color:var(--ink,#101A2B);
  cursor:pointer;line-height:1.3;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2356677F' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 9px center;
  background-size:13px;
  transition:border-color .14s ease;
}

.cart-yr select:hover{border-color:var(--steel-lt,#7385A0)}
.cart-yr select:focus{
  outline:0;border-color:var(--rose,#C0335C);
  box-shadow:0 0 0 3px rgba(192,51,92,.14);
}

/* Редът в кутията на домейна: надпис вляво, меню вдясно. */
.orow-yr{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;
}

/*
 * В КРАТКИЯ СПИСЪК менюто е по-дребно.
 *
 * Там редът е тесен и трите неща — име, срок, цена — трябва да се
 * съберат на една линия.
 */
.cart-list .cart-yr select{
  padding:5px 26px 5px 9px;font-size:11.5px;background-size:12px;
  background-position:right 7px center;
}

@media (max-width:560px){
  /* На тясно менюто заема свой ред: до цената остава по три знака. */
  .orow-yr{flex-direction:column;align-items:stretch;gap:8px}
  .cart-yr,.cart-yr select{width:100%}
  .cart-list li .cart-yr{flex:1 0 100%;margin-top:6px}
}

/* ══════════════════════════════════════════════════════════
   Бутонът до менюто за срок
   ══════════════════════════════════════════════════════════ */
/*
 * ВИДИМ БУТОН, НЕ „onchange“.
 *
 * Правилото за сигурност е „script-src 'self' 'nonce-…'“ без
 * „unsafe-inline“ — вграденият код в атрибут се блокира МЪЛЧАЛИВО.
 * Човек избира от менюто, страницата не мърда, в дневника няма нищо.
 *
 * Бутонът е дребен нарочно: той е потвърждение, не главно действие.
 */
.cart-yr-go{
  -webkit-appearance:none;appearance:none;
  padding:7px 13px;border-radius:8px;
  border:1px solid var(--line,#DCE3ED);
  background:var(--paper,#fff);
  font-family:var(--sans,system-ui,sans-serif);
  font-size:12px;font-weight:600;
  color:var(--steel,#56677F);
  cursor:pointer;white-space:nowrap;line-height:1.3;
  transition:border-color .14s ease,color .14s ease,background .14s ease;
}

.cart-yr-go:hover{
  border-color:var(--rose,#C0335C);
  color:var(--rose,#C0335C);
  background:var(--mist,#EEF2F7);
}

.cart-yr-go:active{transform:translateY(1px)}

.cart-yr-go:focus-visible{
  outline:2px solid var(--rose,#C0335C);
  outline-offset:2px;
}

/* В стария избор на период класът е същият — един вид за едно нещо. */
.cl-cycle .cart-yr-go{margin-left:8px}

@media (max-width:560px){
  /* На тясно бутонът е на цял ред под менюто. */
  .cart-yr-go{width:100%;padding-block:9px}
}

/* ══════════════════════════════════════════════════════════
   Срок на регистрация · менюто в количката
   ══════════════════════════════════════════════════════════ */
/*
 * Смяната е АВТОМАТИЧНА.
 *
 * Скриптът в страницата праща формата при избор и скрива бутона.
 * Бутонът остава само за случая, в който скриптът не тръгне — тогава
 * менюто пак работи, просто с едно натискане повече.
 */
.cart-yr{display:inline-flex;align-items:center;gap:8px;margin:0}

.cart-yr select,
.cl-cycle select{
  -webkit-appearance:none;appearance:none;
  padding:7px 30px 7px 11px;border-radius:8px;
  border:1px solid var(--line,#DCE3ED);background:var(--paper,#fff);
  font-family:var(--mono,ui-monospace,monospace);
  font-size:12.5px;color:var(--ink,#101A2B);
  cursor:pointer;line-height:1.3;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2356677F' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 9px center;
  background-size:13px;
  transition:border-color .14s ease,opacity .14s ease;
}

.cart-yr select:hover,
.cl-cycle select:hover{border-color:var(--steel-lt,#7385A0)}

.cart-yr select:focus,
.cl-cycle select:focus{
  outline:0;border-color:var(--rose,#C0335C);
  box-shadow:0 0 0 3px rgba(192,51,92,.14);
}

/* Заключено, докато страницата се презарежда: показва, че нещо става. */
.cart-yr select:disabled,
.cl-cycle select:disabled{opacity:.55;cursor:progress}

/* Редът в кутията на домейна: надпис вляво, меню вдясно. */
.orow-yr{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;
}

/* Резервният бутон — вижда се само без скриптове. */
.cart-yr-go{
  -webkit-appearance:none;appearance:none;
  padding:7px 13px;border-radius:8px;
  border:1px solid var(--line,#DCE3ED);background:var(--paper,#fff);
  font-family:var(--sans,system-ui,sans-serif);
  font-size:12px;font-weight:600;color:var(--steel,#56677F);
  cursor:pointer;white-space:nowrap;line-height:1.3;
  transition:border-color .14s ease,color .14s ease;
}
.cart-yr-go:hover{border-color:var(--rose,#C0335C);color:var(--rose,#C0335C)}
.cart-yr-go[hidden]{display:none}

/* В краткия списък менюто е по-дребно: редът е тесен. */
.cart-list .cart-yr select{
  padding:5px 26px 5px 9px;font-size:11.5px;background-size:12px;
  background-position:right 7px center;
}

@media (max-width:560px){
  /* На тясно менюто заема свой ред: до цената остават три знака. */
  .orow-yr{flex-direction:column;align-items:stretch;gap:8px}
  .cart-yr,.cart-yr select{width:100%}
  .cart-list li .cart-yr{flex:1 0 100%;margin-top:6px}
}

/* ══════════════════════════════════════════════════════════
   Менюто · бутоните на една линия със връзките
   ══════════════════════════════════════════════════════════ */
/*
 * КРИВАТА ЛИНИЯ.
 *
 * Менюто смесва два вида елемента:
 *
 *   <a>                          за „Блог“ и „Контакти“
 *   <button class="nav-top">     за тези с подменю
 *
 * Бутонът има съкратен запис:
 *
 *     font:600 15px/1 var(--sans);
 *
 * „/1“ е височината на реда — и тя ПРЕЗАПИСВА наследената 1.55 от
 * тялото. Разликата:
 *
 *     <a>       15 × 1.55 = 23,2px текст + 20px отстъп = 43,2px
 *     <button>  15 × 1.00 = 15,0px текст + 20px отстъп = 35,0px
 *
 * Осем пиксела. Бутоните с подменю се качват над съседите си.
 *
 * Съкратеният запис е коварен точно с това: не пише „line-height“
 * никъде, но го задава.
 */
.nav>li>.nav-top{line-height:1.55}

/*
 * И списъкът се изравнява по средата.
 *
 * Без него всяка бъдеща разлика във височината — по-дълъг надпис,
 * друга иконка — пак ще изкриви реда.
 */
.nav{align-items:center}

/*
 * Двата вида получават еднаква височина.
 *
 * Подравняването по средата се справя и без това, но при мишката
 * върху тях фонът трябва да е с еднакъв ръб — иначе личи, че са
 * различни елементи.
 */
.nav>li>a,
.nav>li>.nav-top{min-height:43px}


/* ══════════════════════════════════════════════════════════
   Партньорска програма за агенции
   ══════════════════════════════════════════════════════════ */
/*
 * ВСИЧКО Е ЗАГРАДЕНО В „.pg-partners“.
 *
 * Страницата ползва имена, които вече съществуват другаде — „.fi“,
 * „.feat-card“, „.sh“. Без заграждане чуждите правила се месят: „.fi“
 * например има размер САМО вътре в „.feat-card“, затова иконките в
 * друга карта се разтягаха до цялата ѝ височина.
 *
 * Заграждането дава и по-висока тежест, тоест тукашните правила
 * печелят, без да се разчита на реда във файла.
 */

/* ── заглавна част ─────────────────────────────────────── */
.pg-partners .pg-hero{
  background:linear-gradient(170deg,var(--navy) 0%,var(--navy-deep) 100%);
  color:#fff;padding:76px 0 82px;
}
.pg-partners .pg-hero .eyebrow{
  display:inline-block;padding:5px 13px;border-radius:99px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);
  font-size:12.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  color:#fff;
}
.pg-partners .pg-hero h1{
  margin:20px 0 16px;font-size:clamp(2rem,4.4vw,3.05rem);
  font-weight:800;letter-spacing:-.035em;line-height:1.12;color:#fff;
}
.pg-partners .pg-hero .lead{
  max-width:640px;margin:0;font-size:17.5px;line-height:1.65;
  color:rgba(255,255,255,.8);
}
.pg-partners .pg-hero .go{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}

/*
 * Светлият бутон е обърнат спрямо витрината: там фонът е бял, тук —
 * тъмносин, и „btn-ghost“ с тъмен ръб не се вижда.
 */
.pg-partners .pg-hero .btn-ghost{
  background:transparent;color:#fff;border-color:rgba(255,255,255,.28);
}
.pg-partners .pg-hero .btn-ghost:hover{
  background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.45);color:#fff;
}

/* ── заглавие на раздел ────────────────────────────────── */
.pg-partners .sh{max-width:680px;margin-bottom:8px}
.pg-partners .sh h2{
  margin:0;font-size:clamp(1.5rem,2.7vw,2rem);font-weight:800;letter-spacing:-.03em;
}
.pg-partners .sh p{margin:12px 0 0;font-size:16px;color:var(--ink-2);line-height:1.65}

/* ── стъпалата ─────────────────────────────────────────── */
/*
 * ОТБЕЛЯЗАНО Е СРЕДНОТО, не най-скъпото.
 *
 * То е и най-честото за агенциите. Отбелязано най-горно стъпало
 * изглежда като опит да се продаде нагоре.
 */
.pg-partners .ptiers{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px;
}
.pg-partners .ptier{
  position:relative;padding:28px 24px;border-radius:var(--r-lg);
  border:1px solid var(--line);background:var(--paper);box-shadow:var(--sh-s);
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.pg-partners .ptier:hover{
  border-color:var(--line-2);transform:translateY(-2px);box-shadow:var(--sh);
}
.pg-partners .ptier.is-on{
  border-color:var(--navy);border-width:1.5px;box-shadow:var(--sh-l);
}
.pg-partners .ptier-tag{
  position:absolute;top:-11px;left:24px;padding:4px 12px;border-radius:99px;
  background:var(--navy);color:#fff;font-size:11.5px;font-weight:700;
}
.pg-partners .ptier-n{font-size:14px;font-weight:600;color:var(--ink-3)}
.pg-partners .ptier-p{
  margin:8px 0 14px;display:flex;align-items:baseline;gap:8px;
  font-size:15px;color:var(--ink-3);
}
.pg-partners .ptier-p b{
  font-size:2.5rem;font-weight:800;letter-spacing:-.05em;
  color:var(--ink);line-height:1;
}
.pg-partners .ptier p{margin:0;font-size:14px;color:var(--ink-2);line-height:1.6}
.pg-partners .plan-note{
  margin:22px 0 0;font-size:13.5px;color:var(--ink-3);text-align:center;
}

/* ── кой плаща ─────────────────────────────────────────── */
.pg-partners .ppays{
  display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px;
}
.pg-partners .ppay{
  padding:28px 26px;border-radius:var(--r-lg);
  border:1px solid var(--line);background:var(--paper);
}

/*
 * ИКОНКАТА ИМА СВОЙ РАЗМЕР ТУК.
 *
 * В hosting.css „.fi svg“ е оразмерен само вътре в „.feat-card“ и в
 * падащото меню. Другаде SVG-то няма размер и се разтяга до цялата
 * височина на картата — точно това ставаше.
 */
.pg-partners .fi{
  display:inline-grid;place-items:center;
  width:42px;height:42px;flex:0 0 42px;
  border-radius:var(--r-md);background:var(--rose-w);color:var(--rose);
}
.pg-partners .fi svg{
  width:20px;height:20px;fill:none;stroke:currentColor;
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;
}
.pg-partners .ppay h3{margin:16px 0 9px;font-size:17.5px;font-weight:700}
.pg-partners .ppay p{margin:0;font-size:14.5px;color:var(--ink-2);line-height:1.65}

/* ── панелът ───────────────────────────────────────────── */
.pg-partners .psplit{
  display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;
}
.pg-partners .psplit h2{
  margin:0;font-size:clamp(1.45rem,2.5vw,1.9rem);font-weight:800;letter-spacing:-.03em;
}
.pg-partners .psplit>div>p{
  margin:14px 0 0;font-size:16px;color:var(--ink-2);line-height:1.7;
}
.pg-partners .ptick{list-style:none;margin:0;padding:0;display:grid;gap:13px}
.pg-partners .ptick li{
  position:relative;padding-left:30px;font-size:15px;line-height:1.55;
}
/*
 * ОТМЕТКАТА Е ЦЯЛА КАРТИНКА, не маска.
 *
 * „mask-composite“ се смесва зле между „-webkit-“ и стандартния запис:
 * Firefox не го разбира, Chrome рисува плътен кръг без отметка.
 */
.pg-partners .ptick li::before{
  content:"";position:absolute;left:0;top:3px;width:19px;height:19px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10' fill='%23127A55'/%3E%3Cpath d='M5.6 10.2l2.9 2.9 5.9-6' fill='none' stroke='%23fff' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/19px no-repeat;
}

/* ── какво влиза ───────────────────────────────────────── */
.pg-partners .pfeat{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px;
}
.pg-partners .pfeat-card{
  padding:26px 24px;border-radius:var(--r-lg);
  border:1px solid var(--line);background:var(--paper);
}
.pg-partners .pfeat-card h3{margin:15px 0 8px;font-size:16.5px;font-weight:700}
.pg-partners .pfeat-card p{margin:0;font-size:14px;color:var(--ink-2);line-height:1.65}

/* ── за кого е ─────────────────────────────────────────── */
.pg-partners .pwho{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px;
}
.pg-partners .pwho>div{
  padding:24px;border-radius:var(--r-lg);
  background:var(--paper);border:1px solid var(--line);
}
.pg-partners .pwho b{display:block;margin-bottom:8px;font-size:16px;font-weight:700}
.pg-partners .pwho span{font-size:14px;color:var(--ink-2);line-height:1.65}

/* ── формата ───────────────────────────────────────────── */
.pg-partners .pform{display:grid;gap:16px;margin-top:34px}
.pg-partners .pform-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}

.pg-partners .pf{display:flex;flex-direction:column;gap:7px;font-size:13.5px;font-weight:600}

/* Точката казва „задължително“ ПРЕДИ натискане на бутона. */
.pg-partners .pf.req>span::after{
  content:"";display:inline-block;width:4px;height:4px;margin-left:6px;
  vertical-align:2px;border-radius:50%;background:var(--rose);
}

.pg-partners .pf input,
.pg-partners .pf select,
.pg-partners .pf textarea{
  width:100%;box-sizing:border-box;
  border:1px solid var(--line-2);border-radius:var(--r-md);padding:12px 14px;
  background:var(--paper);font-family:inherit;font-size:14.5px;font-weight:400;
  color:var(--ink);transition:border-color .14s ease,box-shadow .14s ease;
}
.pg-partners .pf input::placeholder,
.pg-partners .pf textarea::placeholder{color:#9AA7B6;opacity:1}

.pg-partners .pf input:focus,
.pg-partners .pf select:focus,
.pg-partners .pf textarea:focus{
  outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(14,39,69,.09);
}

.pg-partners .pf textarea{resize:vertical;min-height:104px;line-height:1.6}

.pg-partners .pf select{
  -webkit-appearance:none;appearance:none;cursor:pointer;padding-right:36px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A8899' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;background-size:15px;
}

.pg-partners .pchk{
  display:flex;gap:11px;align-items:flex-start;
  font-size:14px;font-weight:400;line-height:1.55;cursor:pointer;
}
.pg-partners .pchk input{
  width:17px;height:17px;margin-top:2px;accent-color:var(--navy);flex:0 0 auto;
}
.pg-partners .pform .btn{justify-self:start}

/* ── въпроси ───────────────────────────────────────────── */
/*
 * Разгъващи се, с „details“ вместо скрипт: работи и при блокиран
 * JavaScript, а правилото за сигурност не му пречи.
 */
.pg-partners .pfaq{margin-top:30px;border-top:1px solid var(--line)}
.pg-partners .pfaq details{border-bottom:1px solid var(--line)}
.pg-partners .pfaq summary{
  padding:19px 40px 19px 19px;font-size:16px;font-weight:600;cursor:pointer;
  list-style:none;position:relative;
}
.pg-partners .pfaq summary::-webkit-details-marker{display:none}
.pg-partners .pfaq summary::after{
  content:"";position:absolute;right:6px;top:24px;width:10px;height:10px;
  border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);
  transform:rotate(45deg);transition:transform .18s ease,top .18s ease;
}
.pg-partners .pfaq details[open] summary::after{transform:rotate(-135deg);top:28px}
.pg-partners .pfaq p{
  margin:0;padding:0 40px 21px 0;font-size:15px;color:var(--ink-2);line-height:1.7;
}

/* ── призив ────────────────────────────────────────────── */
.pg-partners .pcta{
  background:var(--navy);color:#fff;border-radius:var(--r-lg);
  padding:52px 44px;text-align:center;
}
.pg-partners .pcta h2{margin:0;font-size:1.7rem;font-weight:800;letter-spacing:-.03em}
.pg-partners .pcta p{
  margin:14px auto 26px;max-width:520px;
  color:rgba(255,255,255,.76);font-size:16px;line-height:1.65;
}

/* Дълга дума в тясна карта излиза от рамката и бута реда. */
.pg-partners p,
.pg-partners li,
.pg-partners span,
.pg-partners h2,
.pg-partners h3,
.pg-partners summary{overflow-wrap:break-word}

@media (max-width:900px){
  /* Три карти една до друга стават по 110 пиксела: числото се чете,
     обяснението под него — не. */
  .pg-partners .ptiers,
  .pg-partners .pfeat,
  .pg-partners .pwho,
  .pg-partners .ppays{grid-template-columns:1fr}

  .pg-partners .psplit{grid-template-columns:1fr;gap:32px}
  .pg-partners .pg-hero{padding:52px 0 58px}
}

@media (max-width:600px){
  .pg-partners .pform-2{grid-template-columns:1fr}
  .pg-partners .ptier-p b{font-size:2.2rem}
  .pg-partners .pcta{padding:38px 24px}

  /* Под 16 пиксела iPhone увеличава страницата сам при щракане. */
  .pg-partners .pf input,
  .pg-partners .pf select,
  .pg-partners .pf textarea{font-size:16px}
}

/* ══════════════════════════════════════════════════════════
   Сървъри за имена · наставката ОТДЯСНО, не отдолу
   ══════════════════════════════════════════════════════════ */
/*
 * Правилата съществуваха в „site.css“ — файл, който НИКОЯ страница не
 * чете. Вграждаме само „hosting.css“, затова полето оставаше просто
 * поле на цялата ширина, а наставката „.mojqtdomejn.com“ падаше под
 * него като втори ред.
 *
 * Клиентът пише само „ns1“, а вижда „.mojqtdomejn.com“ отдясно — така
 * знае какво ще излезе, без да го преписва.
 */
.ns-row{display:flex;align-items:stretch;gap:0;min-width:0}
.ns-row .control{
  border-top-right-radius:0;
  border-bottom-right-radius:0;
  min-width:0;flex:1;
}
.ns-suffix{
  display:flex;align-items:center;
  padding:0 12px;
  background:#F1F4F8;
  border:1px solid #D8DFE8;
  border-left:0;
  border-radius:0 8px 8px 0;
  font-size:13px;color:#5C6B80;
  white-space:nowrap;
  max-width:45%;
  overflow:hidden;text-overflow:ellipsis;
}
@media (max-width:520px){
  /* На тясно наставката отива отдолу: иначе полето остава три знака. */
  .ns-row{flex-direction:column}
  .ns-row .control{border-radius:8px 8px 0 0}
  .ns-suffix{
    border-left:1px solid #D8DFE8;border-top:0;
    border-radius:0 0 8px 8px;max-width:none;
  }
}
/* Празната наставка не заема място: рамка без съдържание изглежда
   като счупено поле. */
.ns-suffix:empty{display:none}

/* ══════════════════════════════════════════════════════════
   „Добави още сървъри“
   ══════════════════════════════════════════════════════════ */
/*
 * Дребен и блед НАРОЧНО: той не е главното действие на страницата.
 * Деветима от десет не го натискат — оставят нашите два сървъра.
 *
 * Скрива се сам, щом полетата стигнат тринайсет.
 */
.ns-more[hidden]{display:none}

.ns-more{
  -webkit-appearance:none;appearance:none;
  margin:-10px 0 20px;padding:8px 14px;border-radius:8px;
  border:1px dashed var(--line-2,#C7D1DD);background:none;
  font:600 13px/1 var(--sans,system-ui,sans-serif);
  color:var(--ink-2,#48586C);cursor:pointer;
  transition:border-color .14s ease,color .14s ease,background .14s ease;
}
.ns-more:hover{
  border-color:var(--rose,#C0335C);color:var(--rose,#C0335C);
  border-style:solid;
}
.ns-more:focus-visible{outline:2px solid var(--rose,#C0335C);outline-offset:2px}

@media (max-width:520px){
  .ns-more{width:100%;padding-block:11px}
}

/* ==== dedicated: начало ==== */

/* ══════════════════════════════════════════════════════════
   САМОСТОЯТЕЛНИ СЪРВЪРИ
   ══════════════════════════════════════════════════════════ */

.ded-head{max-width:640px;margin:0 0 clamp(26px,3.5vw,40px)}
.ded-head h2{margin:0 0 12px}
.ded-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.ded-hero{
  background:var(--navy);color:#fff;
  padding:clamp(44px,7vw,86px) 0 clamp(40px,6vw,72px);
}

.ded-hero-in{
  display:grid;grid-template-columns:1.15fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.ded-hero h1{color:#fff;margin:0 0 14px}

.ded-hero > .wrap-w > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 26px;max-width:520px;line-height:1.65;
}

.ded-eyebrow{margin-bottom:16px}

.ded-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:26px}

/*
 * ТРИ ОБЕЩАНИЯ вместо изречение.
 *
 * Те отговарят на въпросите, преди да са зададени: колко чакам, къде е
 * машината, и мога ли да изляза.
 */
.ded-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.ded-notes span{display:inline-flex;align-items:center;gap:7px}
.ded-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.ded-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   РИСУВАНИЯТ СЪРВЪР
   ══════════════════════════════════════════════════════════ */
/*
 * СНИМКА ОТ ЧУЖД СКЛАД показва чужди машини. Рисунката казва същото и
 * не лъже — а твоята е с розов ръб, за да личи коя е.
 */
.ded-art{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.ded-rack{display:grid;gap:8px}

.ded-unit{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;border-radius:9px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
}

.ded-unit.is-yours{
  background:rgba(192,51,92,.16);border-color:rgba(192,51,92,.5);
}

.ded-led{
  width:7px;height:7px;border-radius:50%;flex:0 0 auto;background:#6FD9AC;
}
.ded-unit.is-yours .ded-led{
  background:#FF6B93;animation:dedblink 2s ease-in-out infinite;
}

@keyframes dedblink{0%,100%{opacity:1}50%{opacity:.35}}

.ded-bays{display:flex;gap:3px;flex:0 0 auto}
.ded-bay{width:5px;height:22px;border-radius:2px;background:rgba(255,255,255,.16)}
.ded-unit.is-yours .ded-bay{background:rgba(255,255,255,.4)}

.ded-unit-t{flex:1;min-width:0}
.ded-unit-t b{
  display:block;font:700 12.5px/1 var(--mono);color:#fff;letter-spacing:-.02em;
}
.ded-unit-t span{
  display:block;font:400 10.5px/1 var(--sans);
  color:rgba(255,255,255,.5);margin-top:5px;
}

.ded-tag{
  font:700 9.5px/1 var(--sans);padding:3px 8px;border-radius:99px;
  background:rgba(255,255,255,.1);color:rgba(255,255,255,.62);white-space:nowrap;
}
.ded-unit.is-yours .ded-tag{background:var(--rose);color:#fff}

/* ══════════════════════════════════════════════════════════
   СРАВНЕНИЕТО С VPS
   ══════════════════════════════════════════════════════════ */
/*
 * ТО Е ГЛАВНОТО: човек, който гледа тази страница, вече знае какво е
 * сървър. Въпросът му е дали да плати няколко пъти повече — и защо.
 *
 * Затова се казва и КОГА VPS Е ПО-ДОБРОТО: премълчаването му личи, а
 * клиент, купил грешното, се връща ядосан.
 */
.ded-vs{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.ded-vs-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}
.ded-vs-i.is-this{border-color:var(--rose);background:#FDF1F4}

.ded-vs-h{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.ded-vs-h b{flex:1;font:700 15px/1.3 var(--sans)}

.ded-vs-l{list-style:none;padding:0;margin:0;display:grid;gap:11px}

.ded-vs-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.ded-d{
  width:19px;height:19px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;
}
.ded-d svg{width:10px;height:10px;stroke-width:3.2}
.ded-d.yes{background:#E7F5EF;color:var(--up, #127A55)}
.ded-d.no{background:var(--wash);color:var(--steel-lt)}

.ded-vs-go{margin-top:16px}

/* ══════════════════════════════════════════════════════════
   ПЛОЧКИТЕ
   ══════════════════════════════════════════════════════════ */
.ded-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.ded-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

/* Препоръчаният: розов ръб и значка. Без нея човек сравнява наум. */
.ded-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

.ded-plan-h{
  padding:20px 22px 16px;border-bottom:1px solid var(--line);position:relative;
}
.ded-plan.is-best .ded-plan-h{background:#FDF1F4}

.ded-plan-tag{
  position:absolute;top:-1px;right:18px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.ded-plan-n{
  font:800 1.15rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px;
}
.ded-plan-for{font-size:12.5px;color:var(--steel);margin:0;line-height:1.5}

.ded-plan-p{padding:18px 22px;border-bottom:1px solid var(--line)}
.ded-plan-p b{font:800 1.7rem/1 var(--mono);letter-spacing:-.035em}
.ded-plan-p > span{font-size:12.5px;color:var(--steel);margin-left:4px}
.ded-plan-p em{
  display:block;font:400 11.5px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/*
 * ЖЕЛЯЗОТО В ЕДНА РЕШЕТКА.
 *
 * Списък с точки кара окото да чете; решетката се сравнява между
 * плановете с един поглед.
 */
.ded-hw{padding:18px 22px;flex:1;display:grid;gap:12px}

.ded-hw-r{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start}

.ded-hw-ic{
  width:28px;height:28px;border-radius:8px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.ded-hw-ic svg{width:14px;height:14px}

.ded-hw-t b{display:block;font:700 13px/1.3 var(--mono);letter-spacing:-.02em}
.ded-hw-t span{
  display:block;font:400 11.5px/1.4 var(--sans);color:var(--steel);margin-top:3px;
}

.ded-plan-go{padding:0 22px 22px}
.ded-plan-go .btn{width:100%}

/*
 * НАЛИЧНОСТТА Е ПОД ЦЕНАТА.
 *
 * „Остават 2“ решава повече от списъка с желязо, а не се вижда никъде
 * другаде.
 */
.ded-stock{
  display:flex;align-items:center;gap:7px;justify-content:center;
  margin-top:11px;font-size:11.5px;color:var(--steel);
}
.ded-stock i{width:6px;height:6px;border-radius:50%;background:var(--up, #127A55);flex:0 0 auto}
.ded-stock.low{color:var(--warn)}
.ded-stock.low i{background:var(--warn)}
.ded-stock.wait{color:var(--steel-lt)}
.ded-stock.wait i{background:var(--steel-lt)}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦАТА
   ══════════════════════════════════════════════════════════ */
.ded-tbl{
  overflow-x:auto;border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);background:var(--paper);
}

.ded-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px}

.ded-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

.ded-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.ded-tbl tbody tr:last-child td{border-bottom:0}
.ded-tbl tbody tr:hover{background:var(--wash)}

.ded-tbl td.mono{font-family:var(--mono);font-size:13px}

/* Колоната на препоръчания: с лек фон, за да се проследи. */
.ded-col-best{background:#FDF1F4}
.ded-tbl th.ded-col-best{background:#FBE4EA;color:var(--rose)}

/* ══════════════════════════════════════════════════════════
   СЛУЧАИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * СЛУЧАИ, НЕ СВОЙСТВА.
 *
 * „32 GB RAM“ не казва нищо на човек, който не знае колко му трябват.
 * „Магазин с 50 000 стоки“ казва.
 */
.ded-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.ded-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.ded-case-ic{
  width:42px;height:42px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.ded-case-ic svg{width:20px;height:20px}

.ded-case h3{margin:0 0 7px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em}
.ded-case p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.6}

.ded-case-p{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:99px;background:var(--wash);
  font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.ded-case-p b{font-family:var(--mono);font-weight:700}

.ded-ask{margin:26px 0 0;font-size:14px;color:var(--steel)}
.ded-ask a{color:var(--rose);font-weight:600}

/* ══════════════════════════════════════════════════════════
   КАКВО ВЛИЗА
   ══════════════════════════════════════════════════════════ */
.ded-incl{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.ded-incl-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.ded-incl-ic{
  width:38px;height:38px;border-radius:11px;margin-bottom:14px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.ded-incl-ic svg{width:18px;height:18px}

.ded-incl-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.ded-incl-i p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ДОБАВКИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЦЕНИТЕ СА ТУК, не „по запитване“.
 *
 * „Свържи се с нас за цена“ значи още едно писмо и два дни чакане — а
 * човекът иска само да сметне.
 */
.ded-adds{display:grid;gap:9px}

.ded-add{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:15px 18px;border-radius:var(--r, 10px);
  background:var(--paper);border:1px solid var(--line);
}

.ded-add-t{flex:1;min-width:200px}
.ded-add-t b{display:block;font:600 14px/1.3 var(--sans)}
.ded-add-t span{
  display:block;font:400 12px/1.5 var(--sans);color:var(--steel);margin-top:4px;
}

.ded-add-p{
  font:700 15px/1 var(--mono);white-space:nowrap;text-align:right;
  letter-spacing:-.02em;flex:0 0 auto;
}
.ded-add-p span{
  display:block;font:400 11px/1 var(--sans);color:var(--steel);margin-top:5px;
}
.ded-add-p.free{color:var(--up, #127A55)}

/* ══════════════════════════════════════════════════════════
   КЪДЕ Е МАШИНАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ВРЕМЕНАТА СА ЧИСЛА: „бърза мрежа“ е обещание, а „5 ms до София“ е
 * проверимо.
 */
.ded-dc{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center}

.ded-dc-box{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);padding:26px;
}

.ded-dc-box h3{
  color:#fff;margin:0 0 10px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em;
}
.ded-dc-box p{
  margin:0 0 18px;font-size:13.5px;color:rgba(255,255,255,.7);line-height:1.6;
}

.ded-dc-l{display:grid;gap:11px}

.ded-dc-r{
  display:flex;align-items:center;gap:12px;
  padding:11px 13px;border-radius:9px;background:rgba(255,255,255,.06);
}
.ded-dc-r b{flex:1;font:600 13px/1 var(--sans);color:#fff}
.ded-dc-r span{font:700 12.5px/1 var(--mono);color:#6FD9AC}

.ded-dc-facts{display:grid;gap:14px}

.ded-dc-f{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  font-size:13.5px;line-height:1.6;color:var(--ink-soft);
}
.ded-dc-f b{display:block;color:var(--ink);font-weight:700;margin-bottom:3px}

.ded-dc-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.ded-dc-ic svg{width:16px;height:16px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИТЕ
   ══════════════════════════════════════════════════════════ */
.ded-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.ded-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.ded-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.ded-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.ded-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.ded-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.ded-cta{
  background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0;
}

.ded-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.ded-cta h2{color:#fff;margin:0 0 8px}
.ded-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:460px}

.ded-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.ded-cta-ghost{
  background:transparent;border-color:rgba(255,255,255,.24);color:#fff;
}
.ded-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1000px){
  .ded-hero-in{grid-template-columns:1fr}
  .ded-plans{grid-template-columns:1fr}
  .ded-cases{grid-template-columns:1fr}
  .ded-incl{grid-template-columns:1fr 1fr}
  .ded-dc{grid-template-columns:1fr}
  .ded-faq{grid-template-columns:1fr}
  .ded-vs{grid-template-columns:1fr}
}

@media (max-width:620px){
  .ded-incl{grid-template-columns:1fr}
  .ded-hero-go .btn{width:100%}
  .ded-add{gap:12px}
  .ded-add-p{min-width:100%;text-align:left}
  .ded-cta-go{width:100%}
  .ded-cta-go .btn{flex:1}
  .ded-notes{gap:12px}
}

/* ==== dedicated: край ==== */

/* ==== адаптация: начало ==== */

/* ══════════════════════════════════════════════════════════
   АДАПТАЦИЯ · поправки за тесен екран
   ══════════════════════════════════════════════════════════ */
/*
 * Всяко правило тук поправя нещо, което на 360 пиксела излиза извън
 * екрана или се слепва.
 *
 * СТОЯТ НАКРАЯ, за да надделеят: съществуващите правила не се пипат, а
 * при равна тежест печели по-долното.
 */

/* ── таблиците ── */
/*
 * ТАБЛИЦА БЕЗ ОБВИВКА РАЗЧЕКВА СТРАНИЦАТА.
 *
 * Широката таблица не се свива — тя избутва цялото тяло и човек
 * превърта настрани, за да види менюто.
 *
 * Обвивката с „overflow-x“ ограничава превъртането САМО до нея.
 */
.tld-table-wrap,
.tbl-wrap,
.table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:var(--r-md, 12px);
}

/*
 * Ако таблицата няма обвивка в HTML-а, самата тя се свива.
 *
 * По-лошо от превъртане, но по-добро от счупена страница.
 */
@media (max-width:760px){
  .tld-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}
  .tld-table thead,
  .tld-table tbody{display:table;width:100%;min-width:560px}

  /* Първата колона остава видима при превъртане: тя казва кой е редът. */
  .tld-table td:first-child,
  .tld-table th:first-child{position:sticky;left:0;background:var(--paper);z-index:1}
}

/* Сравнителната таблица: същото. */
@media (max-width:820px){
  .cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .cmp{min-width:640px}
}

@media (max-width:680px){
  .cmp{min-width:520px;font-size:13px}
  .cmp th,
  .cmp td{padding:10px 12px}
}

/* ── решетките ── */
/*
 * ТРИ КОЛОНИ НА 360 ПИКСЕЛА дават по 100 на колона — там не се побира
 * дори цена.
 */
@media (max-width:620px){
  .oa-line{grid-template-columns:1fr auto}
  .oa-line .oa-p{grid-column:2}

  .promo-box{grid-template-columns:1fr;gap:10px}
  .promo-box .btn{width:100%}

  /* Номерът остава отляво, текстът минава на цял ред. */
  .dstep{grid-template-columns:auto 1fr}

  .ded-vs-l li{grid-template-columns:auto 1fr}
  .ded-hw-r{grid-template-columns:auto 1fr}
  .ded-dc-f{grid-template-columns:auto 1fr}
}

/* ── мишени за пръст ── */
/*
 * ПРЪСТЪТ Е ОКОЛО 45 ПИКСЕЛА.
 *
 * По-малко копче се уцелва трудно и се натиска съседното — а тук
 * съседното трие ред от количката.
 *
 * Видимият размер остава същият; расте само областта за натискане.
 */
@media (max-width:860px){
  .cl-remove,
  .cart-rm button,
  .ocard-rm button{
    position:relative;
  }

  .cl-remove::after,
  .cart-rm button::after,
  .ocard-rm button::after{
    content:'';position:absolute;
    top:50%;left:50%;transform:translate(-50%,-50%);
    width:44px;height:44px;
  }

  /* Плъзгачът: по-голям, защото се натиска често. */
  .tgl{width:52px;height:30px}
  .tgl i{width:24px;height:24px}
  .tgl.is-on i{transform:translateX(22px)}

  /* Копчетата за години и за да/не: пълна височина за пръст. */
  .oyb,
  .dcfg-yb,
  .oq-btn,
  .q-btn,
  .obill-b,
  .who-b{min-height:44px}
}

/* ── шрифтове ── */
/*
 * ПОД 12 ПИКСЕЛА не се чете на телефон, а на слънце — още по-малко.
 */
@media (max-width:620px){
  .mega-col h4{font-size:12px}
  .nav-tel small{font-size:12px}
  .oa-next{font-size:12px}
  .oa-lines em{font-size:11.5px}
  .sum-vat{font-size:11.5px}
}

/* ── текст, който не се пренася ── */
/*
 * „nowrap“ НА ДЪЛЪГ НАДПИС го изкарва извън екрана.
 *
 * На цените и значките е вярно — те са къси. На състоянието и имената
 * не е.
 */
@media (max-width:620px){
  .dres-status{white-space:normal}
  .oa-body b{white-space:normal;word-break:break-word}
  .cart-p{white-space:normal}
  .oa-lines b{white-space:normal}
}

/* ── дълги думи ── */
/*
 * ДОМЕЙН БЕЗ ИНТЕРВАЛИ не се пренася сам и разчеква реда.
 *
 * „mnogodalgoimenafirma.bg“ е една дума за браузъра.
 */
.dres-name,
.cart-n,
.sug-name,
.oa-lines span,
.item-h b,
.ocard-h h2{
  word-break:break-word;
  overflow-wrap:anywhere;
}

/* ── общи предпазни мерки ── */
/*
 * НИЩО НЕ ИЗЛИЗА ИЗВЪН ЕКРАНА.
 *
 * Един широк елемент кара цялата страница да се превърта настрани — а
 * човек не разбира кой е виновникът.
 */
@media (max-width:860px){
  /*
   * „overflow-x:hidden“ НА „body“ Е МАХНАТ.
   *
   * Той убива „position:sticky“ на ВСИЧКО вътре — заради него шапката
   * спря да се лепи и менюто увисна в средата на страницата.
   *
   * Причината е в самия стандарт: елемент с ограничено преливане става
   * нова основа за превъртане, а „sticky“ се закача за нея, не за
   * екрана.
   *
   * Широките елементи се оправят поединично, по-долу.
   */

  img,
  svg,
  video,
  iframe{max-width:100%;height:auto}

  pre,
  code{overflow-x:auto;max-width:100%}
}

/* ── най-тесните ── */
/*
 * ПОД 380: тук вече се жертва украса, не съдържание.
 */
@media (max-width:380px){
  .wrap-w,
  .wrap-n{padding-inline:14px}

  .btn{padding:12px 18px;font-size:14px}
  .btn-lg{padding:14px 18px;font-size:15px}

  /* Двойката копчета: едно под друго, вместо смачкани. */
  .hero-cta,
  .of-go,
  .cart-go,
  .ded-hero-go{flex-direction:column;align-items:stretch}

  .hero-cta .btn,
  .of-go .btn,
  .cart-go .btn,
  .ded-hero-go .btn{width:100%}
}


/* ══════════════════════════════════════════════════════════
   ШАПКАТА НА ТЕЛЕФОН
   ══════════════════════════════════════════════════════════ */
/*
 * ХАМБУРГЕРЪТ Е ВДЯСНО, не залепен за логото.
 *
 * В HTML-а той стои веднага след логото — а нищо не го мести. Затова
 * се лепи отляво и изглежда като част от знака.
 *
 * Палецът стига до десния край, не до левия: телефонът се държи с
 * дясната ръка.
 */
@media (max-width:860px){
  .site-header .wrap-w{
    display:flex;align-items:center;gap:10px;
    padding-block:11px;position:relative;
  }

  /* Логото не се разтяга; празното отива веднага след него. */
  .site-header .wrap-w > .brand{flex:0 0 auto;margin-right:auto}

  .site-header .wrap-w > .brand img{width:124px;height:auto}

  /*
   * Редът вдясно: количка, после хамбургер.
   *
   * Количката е ПРЕДИ него, за да не се мести, когато менюто се
   * отвори.
   */
  .site-header .wrap-w > .nav-actions{
    flex:0 0 auto;margin-left:0;order:8;gap:8px;
  }

  .site-header .wrap-w > .nav-toggle{
    flex:0 0 auto;order:9;margin-left:2px;
  }

  /*
   * ЧЕКМЕДЖЕТО ТРЪГВА ПОД ШАПКАТА, не върху нея.
   *
   * Дотук започваше от нулата и покриваше логото — а бутонът за
   * затваряне оставаше отдолу, невидим.
   */
  .nav{
    position:fixed;top:0;right:0;bottom:0;left:auto;
    width:min(86vw, 340px);
    display:flex;flex-direction:column;gap:0;
    background:var(--paper);
    border-left:1px solid var(--line);border-bottom:0;
    box-shadow:-8px 0 32px rgba(14,39,69,.18);
    padding:76px 12px 24px;
    max-height:none;height:100dvh;overflow-y:auto;
    z-index:60;
    transform:translateX(100%);
    transition:transform .24s ease;
  }

  .nav.is-open{display:flex;transform:translateX(0)}

  /*
   * БУТОНЪТ ОСТАВА НАД ЧЕКМЕДЖЕТО.
   *
   * С него се затваря — а под менюто той не се вижда и човек търси
   * изход.
   */
  /*
   * ТУК БЕШЕ „position:relative“ — и той УБИВАШЕ залепването.
   *
   * Шапката е „sticky“ от самото начало на файла. Моето правило я
   * връщаше към нормална и тя спираше да стои горе при превъртане.
   *
   * Сега само слоят се вдига, положението не се пипа.
   */
  .site-header{z-index:75}

  .nav-toggle{
    position:relative;z-index:80;
    width:42px;height:42px;
  }

  /* Отворено: бутонът става розов и показва кръстче. */
  .nav-toggle[aria-expanded="true"]{
    color:var(--rose);border-color:var(--rose);
  }

  /*
   * Затъмнението е ПОД шапката, но над страницата.
   *
   * Без това то покрива бутона и менюто не може да се затвори.
   */
  .nav-veil{z-index:55}

  /* Действията остават видими над затъмнението. */
  .site-header .wrap-w > .nav-actions{position:relative;z-index:71}
}

/*
 * ПОД 420: логото се смалява още.
 *
 * При три неща на един ред — лого, количка, хамбургер — първото трябва
 * да отстъпи.
 */
@media (max-width:420px){
  .site-header .wrap-w{gap:8px;padding-inline:14px}
  .site-header .wrap-w > .brand img{width:104px}

  .nav-toggle{width:40px;height:40px}
  .nav-cart{width:36px;height:36px}
  .nav-cart svg{width:17px;height:17px}

  /* Бутонът „вход“ отпада: количката и менюто са по-важни. */
  .site-header .nav-actions .btn{display:none}
}


/* ══════════════════════════════════════════════════════════
   ШАПКАТА · поправка след проба на телефон
   ══════════════════════════════════════════════════════════ */
/*
 * КОЛИЧКАТА И ХАМБУРГЕРЪТ ОСТАВАХА ВЪРХУ МЕНЮТО.
 *
 * Чекмеджето е „fixed“ и излиза от потока — а шапката, която го носи,
 * няма своя основа. Затова двете плуваха в средата на списъка.
 *
 * Решението: шапката получава фон и остава залепена отгоре.
 */
@media (max-width:860px){
  .site-header{z-index:75;background:var(--paper)}

  /* Чекмеджето тръгва ПОД шапката, не под нулата. */
  .nav{
    top:var(--hd-h, 62px);height:calc(100dvh - var(--hd-h, 62px));
    padding:16px 12px 24px;
  }

  /*
   * МЕНЮТО Е ПОДРАВНЕНО ОТЛЯВО.
   *
   * Центрирано, окото търси началото на всеки ред наново — а списък се
   * чете по левия ръб.
   */
  .nav{align-items:stretch;text-align:left}

  .nav>li{width:100%}

  .nav>li>a,
  .nav>li>.nav-top{
    width:100%;padding:14px 12px;font-size:16px;
    justify-content:flex-start;text-align:left;
    border-radius:8px;
  }

  /* Стрелката отива вдясно, до края на реда. */
  .nav>li>.nav-top svg{margin-left:auto}

  /* Подменютата: с отстъп, за да личи че са вътре. */
  .nav-drop,
  .mega{
    padding-left:12px;margin-left:10px;
    border-left:2px solid var(--line);
  }

  .nav-drop li a,
  .mega li a{
    padding:11px 12px;justify-content:flex-start;text-align:left;
  }
}

/*
 * ВХОДЪТ СЕ ВРЪЩА.
 *
 * Скрих го под 420, за да има място — но той е причината половината
 * хора да отворят шапката.
 *
 * Вместо да изчезва, става само иконка.
 */
@media (max-width:420px){
  .site-header .nav-actions .btn{
    display:inline-flex;
    padding:0;width:36px;height:36px;
    border-radius:9px;
    font-size:0;
  }

  /*
   * Надписът се сменя с иконка на човек.
   *
   * Рисувана в самото правило: отделен файл за един знак се тегли
   * бавно.
   */
  .site-header .nav-actions .btn::before{
    content:'';
    width:17px;height:17px;
    background:currentColor;
    -webkit-mask:var(--ico-user) center/contain no-repeat;
    mask:var(--ico-user) center/contain no-repeat;
  }
}

:root{
  --ico-user:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/><circle cx='12' cy='7' r='4'/></svg>");
}


/* ══════════════════════════════════════════════════════════
   ШАПКАТА · трета поправка
   ══════════════════════════════════════════════════════════ */
/*
 * НАД ШАПКАТА ИМА ОЩЕ ДВЕ ИВИЦИ: промоция и служебна лента.
 *
 * Затова „top:62px“ беше грешно — истинската шапка е много по-ниско, а
 * чекмеджето покриваше логото.
 *
 * ФИКСИРАНО ЧИСЛО НЕ РАБОТИ: промоцията се сменя от настройките, а с
 * дълъг текст става два реда.
 *
 * Решението: шапката се залепва отгоре, а чекмеджето тръгва от НЕЯ —
 * без да се знае колко е висока.
 */
@media (max-width:860px){
  /*
   * Промоцията и служебната се превъртат нормално: те са за четене
   * веднъж, не за връщане.
   */
  .topbar{position:relative;z-index:1}
  .utilbar{display:none}

  /*
   * Шапката е „sticky“ ОТ САМОТО НАЧАЛО на файла — не се пипа.
   *
   * Тук само слоят: чекмеджето трябва да е ПОД нея, за да не покрива
   * логото и количката.
   */
  .site-header{z-index:75;background:var(--paper)}

  /*
   * ЧЕКМЕДЖЕТО Е ВЪТРЕ В ШАПКАТА, не върху страницата.
   *
   * „absolute“ спрямо шапката значи, че то тръгва точно под нея —
   * каквато и да е височината ѝ.
   */
  .site-header .wrap-w{position:relative}

  /*
   * ШАПКАТА СЕ ЛЕПИ, чекмеджето върви с нея.
   *
   * „absolute“ го закачаше за шапката, но тогава тя не можеше да
   * стои горе при превъртане.
   *
   * „fixed“ с изчислена височина решава и двете: шапката е залепена, а
   * менюто тръгва точно под нея — каквато и да е промоцията отгоре.
   */
  .nav{
    position:fixed;
    top:var(--hd-bottom, 62px);
    right:0;left:auto;bottom:auto;
    width:min(88vw, 340px);
    height:auto;max-height:calc(100dvh - var(--hd-bottom, 62px));
    padding:10px;
    border-radius:0 0 0 var(--r-lg, 14px);
  }

  /*
   * КОЛИЧКАТА И „ВХОД“ ОСТАВАТ В ШАПКАТА.
   *
   * На снимката те стояха вътре в чекмеджето — защото „nav-actions“ е
   * след „nav“ в HTML-а, а нищо не ги разделяше.
   */
  .site-header .wrap-w > .nav-actions{
    position:relative;z-index:2;
    order:8;margin-left:0;flex:0 0 auto;
  }

  .site-header .wrap-w > .nav-toggle{
    position:relative;z-index:2;
    order:9;flex:0 0 auto;
  }

  /*
   * ЧЕКМЕДЖЕТО Е ПОД ШАПКАТА по слой.
   *
   * Шапката е 75, менюто 60: така то се плъзга под нея и логото
   * остава видимо.
   */
  .nav{z-index:60}

  .nav-veil{z-index:55}
}

/* Под 420: без промоцията — тя яде половин екран. */
@media (max-width:420px){
  .topbar .cd{display:none}
}


/* ══════════════════════════════════════════════════════════
   ШИРОКИТЕ ЕЛЕМЕНТИ · без да се чупи залепването
   ══════════════════════════════════════════════════════════ */
/*
 * „overflow-x:hidden“ НА „body“ УБИВА „sticky“.
 *
 * Затова широкото се оправя ПОИМЕННО: всеки виновник се свива сам,
 * вместо да се реже цялата страница.
 */
@media (max-width:860px){
  /* Обвивките не пускат съдържание навън. */
  .wrap-w,
  .wrap-n,
  .sec,
  .ord-main,
  .ocard,
  .card,
  .o-card{max-width:100%;min-width:0}

  /*
   * Решетките и редовете: без „min-width:0“ вътрешното съдържание ги
   * разтяга отвътре.
   */
  .ord-grid,
  .plan-grid,
  .ded-plans,
  .ded-cases,
  .ded-incl,
  .pays,
  .otwo,
  .fields{min-width:0}

  .ord-grid > *,
  .plan-grid > *,
  .ded-plans > *,
  .pays > *,
  .otwo > *{min-width:0}

  /* Дългите низове се пренасят, вместо да бутат реда. */
  .mono,
  .dres-name,
  .cart-n,
  .sug-name,
  .oa-lines span,
  .ocard-h h2{min-width:0;overflow-wrap:anywhere}

  /* Полетата не надрастват кутията си. */
  input,
  select,
  textarea{max-width:100%}
}

/* ==== адаптация: край ==== */



/* ==== shared: начало ==== */

/* ══════════════════════════════════════════════════════════
   СПОДЕЛЕН ХОСТИНГ
   ══════════════════════════════════════════════════════════ */

.sh-head{max-width:660px;margin:0 0 clamp(26px,3.5vw,40px)}
.sh-head h2{margin:0 0 12px}
.sh-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.sh-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.sh-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.sh-hero-in{
  display:grid;grid-template-columns:1.1fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.sh-hero h1{color:#fff;margin:0 0 14px}

.sh-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.sh-eyebrow{margin-bottom:16px}

.sh-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.sh-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.sh-notes span{display:inline-flex;align-items:center;gap:7px}
.sh-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:#93dc25;color:#ffffff;
}
.sh-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   СКОРОСТТА
   ══════════════════════════════════════════════════════════ */
/*
 * РИСУВАНА, НЕ ОБЕЩАНА С ДУМИ.
 *
 * „Бърз хостинг“ пише навсякъде. Числото до конкурент е проверимо, а
 * лентата го показва, преди да е прочетено.
 */
.sh-speed{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sh-speed-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:16px;
}

.sh-speed-r{margin-bottom:14px}
.sh-speed-r:last-of-type{margin-bottom:0}

.sh-speed-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:7px;font-size:13px;color:rgba(255,255,255,.72);
}
.sh-speed-t b{font:700 13.5px/1 var(--mono);color:#fff}

.sh-speed-bar{
  height:8px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden;
}
.sh-speed-fill{height:100%;border-radius:99px;background:#93dc25;}
.sh-speed-fill.slow{background:rgba(255,255,255,.28)}

/* Как е мерено: обещание без метод не значи нищо. */
.sh-speed-note{
  margin:16px 0 0;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.1);
  font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.5;
}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ.
 *
 * „align-items:start“ оставяше всяка плочка с нейната си височина —
 * планът със седем реда стърчеше, а бутоните бяха на различни места.
 *
 * „stretch“ ги изравнява, а списъкът вътре се разтяга, за да падне
 * бутонът долу при всички.
 */
.sh-plans{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
  align-items:stretch;
}

.sh-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.sh-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/*
 * Шапката е с еднаква височина: описанието е един или два реда, а без
 * това плочките започват разместени.
 */
.sh-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:96px;
  display:flex;flex-direction:column;justify-content:center;
}
.sh-plan.is-best .sh-plan-h{background:#FDF1F4}

.sh-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.sh-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.sh-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * ПОСЕЩЕНИЯТА СА ГЛАВНОТО ЧИСЛО.
 *
 * „5 GB“ не казва нищо на човек, който не знае колко тежи сайтът му.
 * „До 4000 посещения“ казва.
 */
.sh-plan-v{
  padding:18px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.sh-plan-v b{
  display:block;font:800 1.6rem/1 var(--mono);letter-spacing:-.035em;
}
.sh-plan-v span{
  display:block;font-size:11.5px;color:var(--steel);margin-top:6px;
}

.sh-plan-p{padding:18px 20px;border-bottom:1px solid var(--line)}

.sh-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.sh-plan-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.sh-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Подновяването: изненадата гони клиенти. */
.sh-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/*
 * Списъкът се РАЗТЯГА, останалото не.
 *
 * Така редовете започват на една височина, а празното отива под
 * последния — не между заглавието и цената.
 */
.sh-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:10px;align-content:start;
}

.sh-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.sh-plan-f b{font-weight:700;color:var(--ink)}

.sh-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.sh-fi svg{width:9px;height:9px;stroke-width:3.4}
.sh-fi.no{background:var(--wash);color:var(--steel-lt)}

/* Бутонът е ПОСЛЕДЕН и се долепя за дъното. */
.sh-plan-go{padding:0 20px 20px;margin-top:auto}
.sh-plan-go .btn{width:100%}

.sh-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
/*
 * ИЗВАЖДА СЕ ОТ ПЛОЧКИТЕ.
 *
 * Повторено четири пъти, то удължава всяка и скрива разликите — а
 * разликите са това, което човек сравнява.
 */
.sh-all-sec{padding-block:clamp(30px,4vw,44px)}

.sh-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.sh-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.sh-all-h b{font:700 15px/1.3 var(--sans)}

.sh-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.sh-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   КОЙ ПЛАН
   ══════════════════════════════════════════════════════════ */
.sh-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sh-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sh-case-ic{
  width:42px;height:42px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.sh-case-ic svg{width:20px;height:20px}

.sh-case h3{margin:0 0 7px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em}
.sh-case p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.6}

.sh-case-p{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:99px;background:var(--wash);
  font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.sh-case-p b{font-weight:700}

.sh-ask{margin:26px 0 0;font-size:14px;color:var(--steel)}
.sh-ask a{color:var(--rose);font-weight:600}

/* ══════════════════════════════════════════════════════════
   ЗАЩО ПРИ НАС
   ══════════════════════════════════════════════════════════ */
.sh-why{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sh-why-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sh-why-ic{
  width:40px;height:40px;border-radius:12px;margin-bottom:14px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.sh-why-ic svg{width:19px;height:19px}

/* Числото прави обещанието проверимо. */
.sh-why-n{
  display:inline-block;margin-bottom:10px;padding:3px 9px;border-radius:99px;
  background:var(--wash);color:var(--ink);font:700 11.5px/1 var(--mono);
}

.sh-why-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:6px}
.sh-why-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПРЕНАСЯНЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ТО Е ГЛАВНАТА СПИРАЧКА.
 *
 * Човек със сайт другаде не се бои от цената, а от това да не изгуби
 * нещо. Затова тук са стъпките и какво става, ако се обърка.
 */
.sh-move{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.sh-move h2{color:#fff;margin:0 0 10px}
.sh-move > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.sh-move-steps{display:grid;gap:14px}

.sh-move-s{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.sh-move-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);color:#fff;font:700 12px/1 var(--mono);
}

.sh-move-t b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:3px;
}
.sh-move-t span{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.55}

.sh-move-safe{
  margin-top:20px;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgb(152 219 28 / 35%);border:1px solid rgba(111,217,172,.24);
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.sh-move-safe b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.sh-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.sh-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:680px}

.sh-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.sh-tbl th.best{background:#FBE4EA;color:var(--rose)}

.sh-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.sh-tbl tbody tr:last-child td{border-bottom:0}
.sh-tbl tbody tr:hover{background:var(--wash)}

.sh-tbl td.mono{font-family:var(--mono);font-size:13px}
.sh-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.sh-tbl th:first-child,
.sh-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.sh-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.sh-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sh-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sh-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.sh-rev-stars svg{width:15px;height:15px}

.sh-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.sh-rev-who{display:flex;align-items:center;gap:11px}

.sh-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.sh-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.sh-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.sh-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.sh-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.sh-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.sh-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.sh-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.sh-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.sh-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.sh-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.sh-cta h2{color:#fff;margin:0 0 8px}
.sh-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.sh-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.sh-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.sh-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .sh-plans{grid-template-columns:1fr 1fr}
  .sh-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .sh-hero-in{grid-template-columns:1fr}
  .sh-cases{grid-template-columns:1fr}
  .sh-why{grid-template-columns:1fr 1fr}
  .sh-revs{grid-template-columns:1fr}
  .sh-faq{grid-template-columns:1fr}
  .sh-move{grid-template-columns:1fr}
}

@media (max-width:620px){
  .sh-plans{grid-template-columns:1fr}
  .sh-all-l{grid-template-columns:1fr}
  .sh-why{grid-template-columns:1fr}
  .sh-hero-go .btn{width:100%}
  .sh-cta-go{width:100%}
  .sh-cta-go .btn{flex:1}
}

/* ==== shared: край ==== */

/* ==== wordpress: начало ==== */

/* ══════════════════════════════════════════════════════════
   WORDPRESS ХОСТИНГ
   ══════════════════════════════════════════════════════════ */

.wp-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.wp-head h2{margin:0 0 12px}
.wp-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.wp-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.wp-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.wp-hero-in{
  display:grid;grid-template-columns:1.05fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.wp-hero h1{color:#fff;margin:0 0 14px}

.wp-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.wp-eyebrow{margin-bottom:16px}

.wp-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.wp-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.wp-notes span{display:inline-flex;align-items:center;gap:7px}
.wp-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.3);color:#6FD9AC;
}
.wp-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   ОБНОВЯВАНИЯТА · главният страх
   ══════════════════════════════════════════════════════════ */
/*
 * СТРАХЪТ ОТ ОБНОВЯВАНЕ Е ГЛАВНАТА СПИРАЧКА.
 *
 * Всеки, който е държал WordPress, е виждал бяла страница след
 * обновяване на добавка. Затова ги отлага — и после сайтът бива разбит
 * през стара дупка.
 *
 * Тук се показва КАК се решава, вместо да се обещава „автоматични
 * обновявания“ — което тъкмо плаши.
 */
.wp-flow{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.wp-flow-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

.wp-flow-s{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  padding-bottom:16px;position:relative;
}
.wp-flow-s:last-of-type{padding-bottom:0}

/* Черта между стъпките: тя казва, че вървят по ред. */
.wp-flow-s:not(:last-of-type)::before{
  content:'';position:absolute;left:13px;top:28px;bottom:4px;
  width:2px;background:rgba(255,255,255,.12);
}

.wp-flow-n{
  width:28px;height:28px;border-radius:50%;flex:0 0 auto;z-index:1;
  display:grid;place-items:center;
  background:rgba(255,255,255,.1);color:#fff;
  font:700 12px/1 var(--mono);
}
.wp-flow-s.is-ok .wp-flow-n{background:var(--up, #127A55);color:#fff}
.wp-flow-s.is-ok .wp-flow-n svg{width:13px;height:13px;stroke-width:3.2}

.wp-flow-t b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:3px;
}
.wp-flow-t span{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.55}

.wp-flow-note{
  margin:18px 0 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid rgba(111,217,172,.24);
  font-size:12.5px;color:#6FD9AC;line-height:1.6;
}
.wp-flow-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.wp-plans{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  align-items:stretch;
}

.wp-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.wp-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.wp-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:96px;display:flex;flex-direction:column;justify-content:center;
}
.wp-plan.is-best .wp-plan-h{background:#FDF1F4}

.wp-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.wp-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.wp-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * САЙТОВЕТЕ СА ГЛАВНОТО ЧИСЛО, не посещенията.
 *
 * При WordPress човек мисли „колко сайта ще сложа“, а посетителите
 * рядко ги знае — те остават отдолу, по-дребно.
 */
.wp-plan-v{
  padding:18px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.wp-plan-v b{display:block;font:800 1.6rem/1 var(--mono);letter-spacing:-.035em}
.wp-plan-v span{display:block;font-size:11.5px;color:var(--steel);margin-top:6px}
.wp-plan-v em{
  display:block;font:400 11px/1 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:5px;
}

.wp-plan-p{padding:18px 20px;border-bottom:1px solid var(--line)}

.wp-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.wp-plan-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.wp-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Подновяването: изненадата гони клиенти. */
.wp-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.wp-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:10px;align-content:start;
}

.wp-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.wp-plan-f b{font-weight:700;color:var(--ink)}

.wp-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.wp-fi svg{width:9px;height:9px;stroke-width:3.4}
.wp-fi.no{background:var(--wash);color:var(--steel-lt)}

.wp-plan-go{padding:0 20px 20px;margin-top:auto}
.wp-plan-go .btn{width:100%}

.wp-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
.wp-all-sec{padding-block:clamp(30px,4vw,44px)}

.wp-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.wp-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.wp-all-h b{font:700 15px/1.3 var(--sans)}

.wp-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.wp-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   СИГУРНОСТТА
   ══════════════════════════════════════════════════════════ */
/*
 * WORDPRESS Е НАЙ-АТАКУВАНАТА СИСТЕМА — не защото е лоша, а защото я
 * има навсякъде.
 *
 * Числата от нашите сървъри казват какво се случва наистина, вместо да
 * плашат с общи приказки.
 */
.wp-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:22px}

.wp-fact{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:22px;text-align:center;
}

.wp-fact b{
  display:block;font:800 2rem/1 var(--mono);letter-spacing:-.035em;margin-bottom:8px;
}
.wp-fact span{
  display:block;font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.5;
}

.wp-shield{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}

.wp-shield-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;
}

.wp-shield-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.wp-shield-ic svg{width:18px;height:18px}

.wp-shield-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.wp-shield-i p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   БЪРЗИНАТА
   ══════════════════════════════════════════════════════════ */
/*
 * СРАВНЕНИЕТО Е СЪС СЕБЕ СИ.
 *
 * „При нас с кеш“ срещу „при нас без кеш“ показва какво прави
 * настройката, а не само че сме по-добри от някого.
 */
.wp-speed{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.wp-speed-box{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}

.wp-speed-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);margin-bottom:18px;
}

.wp-speed-r{margin-bottom:16px}
.wp-speed-r:last-of-type{margin-bottom:0}

.wp-speed-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:7px;font-size:13px;color:var(--ink-soft);
}
.wp-speed-t b{font:700 14px/1 var(--mono)}

.wp-speed-bar{height:9px;border-radius:99px;background:var(--wash);overflow:hidden}
.wp-speed-fill{height:100%;border-radius:99px;background:var(--up, #127A55)}
.wp-speed-fill.slow{background:var(--line-2, #C7D1DD)}

.wp-speed-note{
  margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);
  font-size:11.5px;color:var(--steel-lt);line-height:1.5;
}

.wp-speed-l{display:grid;gap:14px}

.wp-speed-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.wp-speed-ic{
  width:36px;height:36px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.wp-speed-ic svg{width:17px;height:17px}

.wp-speed-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.wp-speed-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПРЕНАСЯНЕ
   ══════════════════════════════════════════════════════════ */
.wp-move{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.wp-move h2{color:#fff;margin:0 0 10px}
.wp-move > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.wp-move-steps{display:grid;gap:14px}

.wp-move-s{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.wp-move-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);color:#fff;font:700 12px/1 var(--mono);
}

.wp-move-t b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:3px;
}
.wp-move-t span{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.55}

.wp-move-safe{
  margin-top:20px;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid rgba(111,217,172,.24);
  font-size:12.5px;color:#6FD9AC;line-height:1.6;
}
.wp-move-safe b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   СЛУЧАИТЕ
   ══════════════════════════════════════════════════════════ */
.wp-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.wp-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.wp-case-ic{
  width:42px;height:42px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.wp-case-ic svg{width:20px;height:20px}

.wp-case h3{margin:0 0 7px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em}
.wp-case p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.6}

.wp-case-p{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:99px;background:var(--wash);
  font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.wp-case-p b{font-weight:700}

.wp-ask{margin:26px 0 0;font-size:14px;color:var(--steel)}
.wp-ask a{color:var(--rose);font-weight:600}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */


/* Първата колона остава при превъртане: тя казва кой е редът. */
.wp-tbl th:first-child,
.wp-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.wp-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.wp-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.wp-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.wp-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.wp-rev-stars svg{width:15px;height:15px}

.wp-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.wp-rev-who{display:flex;align-items:center;gap:11px}

.wp-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.wp-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.wp-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.wp-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.wp-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.wp-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.wp-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.wp-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.wp-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.wp-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.wp-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.wp-cta h2{color:#fff;margin:0 0 8px}
.wp-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.wp-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.wp-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.wp-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .wp-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .wp-hero-in{grid-template-columns:1fr}
  .wp-plans{grid-template-columns:1fr}
  .wp-cases{grid-template-columns:1fr}
  .wp-revs{grid-template-columns:1fr}
  .wp-faq{grid-template-columns:1fr}
  .wp-move{grid-template-columns:1fr}
  .wp-speed{grid-template-columns:1fr}
  .wp-shield{grid-template-columns:1fr}
  .wp-facts{grid-template-columns:1fr}
}

@media (max-width:620px){
  .wp-all-l{grid-template-columns:1fr}
  .wp-hero-go .btn{width:100%}
  .wp-cta-go{width:100%}
  .wp-cta-go .btn{flex:1}
}

/* ==== wordpress: край ==== */

/* ==== business: начало ==== */

/* ══════════════════════════════════════════════════════════
   БИЗНЕС ХОСТИНГ
   ══════════════════════════════════════════════════════════ */

.bz-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.bz-head h2{margin:0 0 12px}
.bz-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.bz-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.bz-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.bz-hero-in{
  display:grid;grid-template-columns:1.05fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.bz-hero h1{color:#fff;margin:0 0 14px}

.bz-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.bz-eyebrow{margin-bottom:16px}

.bz-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.bz-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.bz-notes span{display:inline-flex;align-items:center;gap:7px}
.bz-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.3);color:#6FD9AC;
}
.bz-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   ПОЩАТА · главното при фирма
   ══════════════════════════════════════════════════════════ */
/*
 * ФИРМЕНО ПИСМО В СПАМА Е ЗАГУБА, не неудобство.
 *
 * Оферта, която не е стигнала, се брои за неизпратена. А повечето
 * хостинги дават поща „в комплекта“ и не се занимават с това дали тя
 * пристига.
 *
 * Рисуваното писмо се разбира по-бързо от обяснение.
 */
.bz-mail{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.bz-mail-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:16px;
}

.bz-mail-box{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  border-radius:var(--r, 10px);padding:14px 16px;margin-bottom:16px;
}

.bz-mail-from{
  display:flex;align-items:center;gap:10px;margin-bottom:10px;
  padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.08);
}

.bz-mail-av{
  width:30px;height:30px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:#7cbf00;color:#000000;font:700 12px/1 var(--sans);
}

.bz-mail-who{flex:1;min-width:0}
.bz-mail-who b{display:block;font:600 12.5px/1 var(--sans);color:#fff}
.bz-mail-who span{
  display:block;font:400 11px/1 var(--mono);
  color:rgba(255,255,255,.5);margin-top:4px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

.bz-mail-in{
  display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;
  padding:4px 9px;border-radius:99px;
  background:rgb(152 219 28);color:#000000;
  font:700 10px/1 var(--sans);
}
.bz-mail-in svg{width:10px;height:10px;stroke-width:3.2}

.bz-mail-subj{font:600 13px/1.4 var(--sans);color:#fff}

.bz-mail-checks{display:grid;gap:9px}

.bz-mail-c{
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;
  font-size:12.5px;color:rgba(255,255,255,.72);
}

.bz-mail-c i{
  width:17px;height:17px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.28);color:#6FD9AC;
}
.bz-mail-c svg{width:9px;height:9px;stroke-width:3.4}

/* Записът се показва, но не се обяснява: важното е, че е настроен. */
.bz-mail-c code{
  font:700 10px/1 var(--mono);padding:3px 7px;border-radius:5px;
  background:rgba(255,255,255,.08);color:rgba(255,255,255,.6);
}

.bz-mail-note{
  margin:16px 0 0;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.1);
  font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.55;
}

/* ══════════════════════════════════════════════════════════
   КОЛКО СТРУВА СПИРАНЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * ХОРАТА СРАВНЯВАТ ЦЕНИ НА ХОСТИНГ, но не смятат другата страна.
 *
 * Затова тук е сметка, не обещание — това превръща „99,98%“ от число в
 * довод: един час струва повече от година хостинг.
 */
.bz-cost{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.bz-cost-box{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);padding:26px;
}

.bz-cost-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

.bz-cost-r{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1);
  font-size:13.5px;color:rgba(255,255,255,.72);
}
.bz-cost-r:last-of-type{border-bottom:0}
.bz-cost-r b{font:700 15px/1 var(--mono);color:#fff;white-space:nowrap}

.bz-cost-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  margin-top:16px;padding-top:16px;border-top:2px solid rgba(255,255,255,.2);
}
.bz-cost-t span{font:600 14px/1 var(--sans);color:#fff}

/* Сборът е розов: той е загубата, не цената. */
.bz-cost-t b{
  font:800 1.5rem/1 var(--mono);letter-spacing:-.03em;color:#FF8FAB;
}

.bz-cost-note{
  margin:16px 0 0;font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.55;
}

.bz-cost-l{display:grid;gap:16px}

.bz-cost-i{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}

.bz-cost-n{
  font:800 1.4rem/1 var(--mono);letter-spacing:-.03em;
  color:var(--rose);flex:0 0 auto;min-width:76px;
}

.bz-cost-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:5px}
.bz-cost-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.bz-plans{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  align-items:stretch;
}

.bz-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.bz-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.bz-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:96px;display:flex;flex-direction:column;justify-content:center;
}
.bz-plan.is-best .bz-plan-h{background:#FDF1F4}

.bz-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.bz-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.bz-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * ПОЩИТЕ СА ГЛАВНОТО ЧИСЛО тук.
 *
 * Фирма пресмята „колко души ще имат адрес“ преди място и посещения.
 */
.bz-plan-v{
  padding:18px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.bz-plan-v b{display:block;font:800 1.6rem/1 var(--mono);letter-spacing:-.035em}
.bz-plan-v span{display:block;font-size:11.5px;color:var(--steel);margin-top:6px}
.bz-plan-v em{
  display:block;font:400 11px/1 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:5px;
}

.bz-plan-p{padding:18px 20px;border-bottom:1px solid var(--line)}

.bz-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.bz-plan-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.bz-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Подновяването: изненадата гони клиенти. */
.bz-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.bz-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:10px;align-content:start;
}

.bz-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.bz-plan-f b{font-weight:700;color:var(--ink)}

.bz-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.bz-fi svg{width:9px;height:9px;stroke-width:3.4}
.bz-fi.no{background:var(--wash);color:var(--steel-lt)}

.bz-plan-go{padding:0 20px 20px;margin-top:auto}
.bz-plan-go .btn{width:100%}

.bz-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
.bz-all-sec{padding-block:clamp(30px,4vw,44px)}

.bz-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.bz-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.bz-all-h b{font:700 15px/1.3 var(--sans)}

.bz-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.bz-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   ЗА СЧЕТОВОДСТВОТО
   ══════════════════════════════════════════════════════════ */
/*
 * ФИРМА ИМА СЧЕТОВОДИТЕЛ, а той иска документи навреме.
 *
 * Това не се пише никъде, а е истинска причина да смениш доставчика —
 * особено чужд, който издава фактура на английски без ДДС номер.
 */
.bz-acc{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}

.bz-acc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;
}

.bz-acc-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.bz-acc-ic svg{width:18px;height:18px}

.bz-acc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.bz-acc-i p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПОДДРЪЖКАТА
   ══════════════════════════════════════════════════════════ */
/*
 * „24/7“ ПИШЕ НАВСЯКЪДЕ и не значи нищо.
 *
 * Числата казват друго: колко бързо отговаряме, колко се решават от
 * първия човек, и по кои начини.
 */
.bz-sup{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.bz-sup h2{color:#fff;margin:0 0 10px}
.bz-sup > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.bz-sup-nums{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.bz-sup-n{
  background:rgba(255,255,255,.06);border-radius:var(--r, 10px);padding:16px;
  text-align:center;
}
.bz-sup-n b{
  display:block;font:800 1.5rem/1 var(--mono);letter-spacing:-.03em;margin-bottom:7px;
}
.bz-sup-n span{font-size:11.5px;color:rgba(255,255,255,.6);line-height:1.4}

.bz-sup-ways{display:grid;gap:11px}

.bz-sup-w{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;border-radius:var(--r, 10px);background:rgba(255,255,255,.06);
}

.bz-sup-w-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.1);color:#fff;
}
.bz-sup-w-ic svg{width:15px;height:15px}

.bz-sup-w b{flex:1;font:600 13px/1.3 var(--sans);color:#fff}
.bz-sup-w > span:last-child{
  font:700 12px/1 var(--mono);color:#6FD9AC;white-space:nowrap;
}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.bz-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.bz-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px}

.bz-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.bz-tbl th.best{background:#FBE4EA;color:var(--rose)}

.bz-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.bz-tbl tbody tr:last-child td{border-bottom:0}
.bz-tbl tbody tr:hover{background:var(--wash)}

.bz-tbl td.mono{font-family:var(--mono);font-size:13px}
.bz-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.bz-tbl th:first-child,
.bz-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.bz-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   ПРЕНАСЯНЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПРИ ФИРМА ПРЕКЪСВАНЕТО В РАБОТЕН ДЕН Е СКЪПО, а уикендът е буфер.
 */
.bz-move{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(24px,3.5vw,32px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.bz-move h2{margin:0 0 10px}
.bz-move > div > p{
  margin:0 0 20px;font-size:14.5px;color:var(--steel);line-height:1.65;
}

.bz-move-steps{display:grid;gap:14px}

.bz-move-s{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.bz-move-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 12px/1 var(--mono);
}

.bz-move-t b{display:block;font:700 13.5px/1.3 var(--sans);margin-bottom:3px}
.bz-move-t span{font-size:12.5px;color:var(--steel);line-height:1.55}

.bz-move-safe{
  margin-top:20px;padding:13px 15px;border-radius:var(--r, 10px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:12.5px;color:var(--up, #127A55);line-height:1.6;
}
.bz-move-safe b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   СЛУЧАИТЕ
   ══════════════════════════════════════════════════════════ */
.bz-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.bz-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.bz-case-ic{
  width:42px;height:42px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.bz-case-ic svg{width:20px;height:20px}

.bz-case h3{margin:0 0 7px;font:700 1.05rem/1.35 var(--sans);letter-spacing:-.02em}
.bz-case p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.6}

.bz-case-p{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:99px;background:var(--wash);
  font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.bz-case-p b{font-weight:700}

.bz-ask{margin:26px 0 0;font-size:14px;color:var(--steel)}
.bz-ask a{color:var(--rose);font-weight:600}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.bz-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.bz-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.bz-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.bz-rev-stars svg{width:15px;height:15px}

.bz-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.bz-rev-who{display:flex;align-items:center;gap:11px}

.bz-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.bz-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.bz-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.bz-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.bz-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.bz-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.bz-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.bz-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.bz-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.bz-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.bz-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.bz-cta h2{color:#fff;margin:0 0 8px}
.bz-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.bz-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.bz-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.bz-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .bz-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .bz-hero-in{grid-template-columns:1fr}
  .bz-plans{grid-template-columns:1fr}
  .bz-cases{grid-template-columns:1fr}
  .bz-revs{grid-template-columns:1fr}
  .bz-faq{grid-template-columns:1fr}
  .bz-move{grid-template-columns:1fr}
  .bz-cost{grid-template-columns:1fr}
  .bz-acc{grid-template-columns:1fr}
  .bz-sup{grid-template-columns:1fr}
}

@media (max-width:620px){
  .bz-all-l{grid-template-columns:1fr}
  .bz-hero-go .btn{width:100%}
  .bz-cta-go{width:100%}
  .bz-cta-go .btn{flex:1}
  .bz-sup-nums{grid-template-columns:1fr}
  .bz-cost-i{grid-template-columns:1fr}
}

/* ==== business: край ==== */

/* ==== reseller: начало ==== */

/* ══════════════════════════════════════════════════════════
   ХОСТИНГ ЗА ПРЕПРОДАЖБА
   ══════════════════════════════════════════════════════════ */

.rs-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.rs-head h2{margin:0 0 12px}
.rs-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.rs-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.rs-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.rs-hero-in{
  display:grid;grid-template-columns:1fr 1.05fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.rs-hero h1{color:#fff;margin:0 0 14px}

.rs-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.rs-eyebrow{margin-bottom:16px}

.rs-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.rs-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.rs-notes span{display:inline-flex;align-items:center;gap:7px}
.rs-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.rs-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   СМЕТКАТА · колко остава
   ══════════════════════════════════════════════════════════ */
/*
 * ТОВА Е ЕДИНСТВЕНИЯТ ВЪПРОС, който препродавачът има.
 *
 * Не колко GB и не какъв панел — а колко остава за него. Всичко
 * останало се решава, ако числото е добро.
 */
.rs-calc{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.rs-calc-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:16px;
}

.rs-calc-slider{margin-bottom:18px}

.rs-calc-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:12px;font-size:13px;color:rgba(255,255,255,.72);
}
.rs-calc-t b{font:700 17px/1 var(--mono);color:#fff}

/*
 * ИСТИНСКИ ПЛЪЗГАЧ, не рисунка.
 *
 * Рисуваният не работи с клавиатура и с четците на екран — а тук
 * човекът трябва да мести, за да види своята сметка.
 */
.rs-range{
  -webkit-appearance:none;appearance:none;
  width:100%;height:6px;border-radius:99px;margin:0;
  background:linear-gradient(
    to right,
   #7cbf00 0,
    #52a503 var(--rs-pct, 40%),
    rgba(255,255,255,.12) var(--rs-pct, 40%),
    rgba(255,255,255,.12) 100%
  );
  cursor:pointer;
}

.rs-range::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:22px;height:22px;border-radius:50%;border:0;
  background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);cursor:grab;
}
.rs-range::-moz-range-thumb{
  width:22px;height:22px;border-radius:50%;border:0;
  background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);cursor:grab;
}

/* Видим ръб при движение с клавиатура. */
.rs-range:focus-visible{outline:2px solid #6FD9AC;outline-offset:6px}

.rs-calc-marks{
  display:flex;justify-content:space-between;margin-top:8px;
  font:400 10.5px/1 var(--mono);color:rgba(255,255,255,.35);
}

.rs-calc-rows{
  margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);
}

.rs-calc-r{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:10px 0;font-size:13.5px;color:rgba(255,255,255,.72);
}
.rs-calc-r b{font:700 14px/1 var(--mono);color:#fff;white-space:nowrap}

/* Изваденото е розово: то е разход, не приход. */
.rs-calc-r.minus b{color:#FF8FAB}

.rs-calc-t2{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  margin-top:12px;padding-top:14px;border-top:2px solid rgba(255,255,255,.2);
}
.rs-calc-t2 span{font:600 14px/1 var(--sans);color:#fff}
.rs-calc-t2 b{
  font:800 1.6rem/1 var(--mono);letter-spacing:-.03em;color:#6FD9AC;
}

/* При нула не се боядисва зелено: щеше да изглежда като печалба. */
.rs-calc-t2 b.is-thin{color:rgba(255,255,255,.45)}

.rs-calc-note{
  margin:14px 0 0;font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.55;
}

/* ══════════════════════════════════════════════════════════
   БЕЗ НАШЕТО ИМЕ
   ══════════════════════════════════════════════════════════ */
/*
 * КЛИЕНТЪТ НА ПРЕПРОДАВАЧА НЕ БИВА ДА ВИЖДА НАС.
 *
 * Ако види, следващия път ще дойде право при нас — а той губи клиента,
 * който сам е намерил.
 *
 * Рисуваният панел се разбира по-бързо от обяснение.
 */
.rs-white{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.rs-white-box{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

.rs-white-bar{
  display:flex;align-items:center;gap:8px;
  padding:11px 14px;background:var(--wash);border-bottom:1px solid var(--line);
}

.rs-white-dots{display:flex;gap:5px}
.rs-white-dots i{
  width:9px;height:9px;border-radius:50%;background:var(--line-2, #C7D1DD);
}

.rs-white-url{
  flex:1;padding:5px 11px;border-radius:99px;
  background:var(--paper);border:1px solid var(--line);
  font:400 11px/1.3 var(--mono);color:var(--steel);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.rs-white-url b{color:var(--ink);font-weight:700}

.rs-white-body{padding:18px}

.rs-white-logo{
  display:flex;align-items:center;gap:10px;margin-bottom:16px;
  padding-bottom:14px;border-bottom:1px solid var(--line);
}

.rs-white-mark{
  width:30px;height:30px;border-radius:8px;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--blue, #1C5FA8);color:#fff;font:800 13px/1 var(--sans);
}

.rs-white-name{font:700 14px/1 var(--sans)}

.rs-white-rows{display:grid;gap:9px}

.rs-white-r{
  display:flex;align-items:center;gap:10px;
  padding:9px 11px;border-radius:8px;background:var(--wash);
  font-size:12.5px;color:var(--ink-soft);
}
.rs-white-r span{flex:1;min-width:0}
.rs-white-r b{font:600 12px/1 var(--mono);color:var(--ink);white-space:nowrap}

.rs-white-l{display:grid;gap:14px}

.rs-white-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.rs-white-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.rs-white-ic svg{width:16px;height:16px}

.rs-white-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.rs-white-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ЗА ТЕБ ЛИ Е
   ══════════════════════════════════════════════════════════ */
/*
 * ЧЕСТНО СРАВНЕНИЕ: препродажбата не е за всеки.
 *
 * Клиент, купил грешното, се връща ядосан и разказва на другите.
 * По-добре да си тръгне сега, отколкото след три месеца.
 */
.rs-vs{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.rs-vs-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}
.rs-vs-i.is-this{border-color:var(--rose);background:#FDF1F4}

.rs-vs-h{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.rs-vs-h b{flex:1;font:700 15px/1.3 var(--sans)}

.rs-vs-l{list-style:none;padding:0;margin:0;display:grid;gap:11px}

.rs-vs-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.rs-d{
  width:19px;height:19px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;
}
.rs-d svg{width:10px;height:10px;stroke-width:3.2}
.rs-d.yes{background:#E7F5EF;color:var(--up, #127A55)}
.rs-d.no{background:var(--wash);color:var(--steel-lt)}

.rs-vs-go{margin-top:16px}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.rs-plans{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  align-items:stretch;
}

.rs-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.rs-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.rs-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:96px;display:flex;flex-direction:column;justify-content:center;
}
.rs-plan.is-best .rs-plan-h{background:#FDF1F4}

.rs-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.rs-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.rs-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * КЛИЕНТСКИТЕ СМЕТКИ СА ГЛАВНОТО ЧИСЛО.
 *
 * Препродавачът мисли „колко клиента ще сложа“ — това определя и
 * приходите му, и кога ще му е тясно.
 */
.rs-plan-v{
  padding:18px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.rs-plan-v b{display:block;font:800 1.6rem/1 var(--mono);letter-spacing:-.035em}
.rs-plan-v span{display:block;font-size:11.5px;color:var(--steel);margin-top:6px}

/* Печалбата при пълен план: тя е причината да се избере по-голям. */
.rs-plan-v em{
  display:block;font:700 11.5px/1 var(--sans);font-style:normal;
  color:var(--up, #127A55);margin-top:8px;
}

.rs-plan-p{padding:18px 20px;border-bottom:1px solid var(--line)}

.rs-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.rs-plan-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.rs-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Подновяването: изненадата гони клиенти. */
.rs-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.rs-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:10px;align-content:start;
}

.rs-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.rs-plan-f b{font-weight:700;color:var(--ink)}

.rs-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.rs-fi svg{width:9px;height:9px;stroke-width:3.4}
.rs-fi.no{background:var(--wash);color:var(--steel-lt)}

.rs-plan-go{padding:0 20px 20px;margin-top:auto}
.rs-plan-go .btn{width:100%}

.rs-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
.rs-all-sec{padding-block:clamp(30px,4vw,44px)}

.rs-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.rs-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.rs-all-h b{font:700 15px/1.3 var(--sans)}

.rs-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.rs-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   КОЙ ОТГОВАРЯ
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-СТРАШНОТО ЗА ПРЕПРОДАВАЧА: клиент звъни в събота с проблем, който
 * той не може да реши.
 *
 * Затова тук е ясно разделено кой какво поема.
 */
.rs-who{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}

.rs-who-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.rs-who-h{display:flex;align-items:center;gap:11px;margin-bottom:16px}

.rs-who-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;
}
.rs-who-ic svg{width:18px;height:18px}
.rs-who-i.us .rs-who-ic{background:#FDF1F4;color:var(--rose)}
.rs-who-i.you .rs-who-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}

.rs-who-h b{font:700 15px/1.3 var(--sans)}

.rs-who-l{list-style:none;padding:0;margin:0;display:grid;gap:10px}

.rs-who-l li{
  display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;
  font-size:13px;line-height:1.55;color:var(--ink-soft);
}

.rs-who-l i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:7px;
  background:var(--steel-lt);
}

/* Това е ГЛАВНАТА ГАРАНЦИЯ: не оставаш сам с проблема. */
.rs-who-note{
  margin-top:22px;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:13.5px;color:var(--up, #127A55);line-height:1.65;
}
.rs-who-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.rs-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.rs-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px}

.rs-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.rs-tbl th.best{background:#FBE4EA;color:var(--rose)}

.rs-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.rs-tbl tbody tr:last-child td{border-bottom:0}
.rs-tbl tbody tr:hover{background:var(--wash)}

.rs-tbl td.mono{font-family:var(--mono);font-size:13px}
.rs-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.rs-tbl th:first-child,
.rs-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.rs-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   КАК СЕ ЗАПОЧВА
   ══════════════════════════════════════════════════════════ */
.rs-steps{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.rs-steps h2{color:#fff;margin:0 0 10px}
.rs-steps > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.rs-steps-l{display:grid;gap:14px}

.rs-step-s{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.rs-step-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);color:#fff;font:700 12px/1 var(--mono);
}

.rs-step-t b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:3px;
}
.rs-step-t span{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.55}

.rs-steps-note{
  margin-top:20px;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid #7cbf00;
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.rs-steps-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.rs-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.rs-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.rs-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.rs-rev-stars svg{width:15px;height:15px}

.rs-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.rs-rev-who{display:flex;align-items:center;gap:11px}

.rs-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.rs-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.rs-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.rs-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.rs-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.rs-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.rs-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.rs-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.rs-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.rs-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.rs-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.rs-cta h2{color:#fff;margin:0 0 8px}
.rs-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.rs-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.rs-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.rs-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .rs-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .rs-hero-in{grid-template-columns:1fr}
  .rs-plans{grid-template-columns:1fr}
  .rs-revs{grid-template-columns:1fr}
  .rs-faq{grid-template-columns:1fr}
  .rs-steps{grid-template-columns:1fr}
  .rs-white{grid-template-columns:1fr}
  .rs-who{grid-template-columns:1fr}
  .rs-vs{grid-template-columns:1fr}
}

@media (max-width:620px){
  .rs-all-l{grid-template-columns:1fr}
  .rs-hero-go .btn{width:100%}
  .rs-cta-go{width:100%}
  .rs-cta-go .btn{flex:1}

  /* Пръстът иска по-голяма топка. */
  .rs-range::-webkit-slider-thumb{width:26px;height:26px}
  .rs-range::-moz-range-thumb{width:26px;height:26px}
}

/* ==== reseller: край ==== */

/* ==== vps: начало ==== */

/* ══════════════════════════════════════════════════════════
   VPS
   ══════════════════════════════════════════════════════════ */

.vp-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.vp-head h2{margin:0 0 12px}
.vp-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.vp-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.vp-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.vp-hero-in{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.vp-hero h1{color:#fff;margin:0 0 14px}

.vp-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.vp-eyebrow{margin-bottom:16px}

.vp-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.vp-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.vp-notes span{display:inline-flex;align-items:center;gap:7px}
.vp-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.vp-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   ДЯЛОВЕТЕ НА МАШИНАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ГЛАВНАТА РАЗЛИКА СЪС СПОДЕЛЕНИЯ Е ТУК.
 *
 * „Твоите ядра са само твои“ е трудно за обясняване с думи. Лентата с
 * дялове го показва: твоят е розов и назован, съседските са сиви.
 */
.vp-res{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.vp-res-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

.vp-res-row{margin-bottom:16px}
.vp-res-row:last-of-type{margin-bottom:0}

.vp-res-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:8px;font-size:12.5px;color:rgba(255,255,255,.72);
}
.vp-res-t b{font:700 12.5px/1 var(--mono);color:#fff;white-space:nowrap}

.vp-res-bar{
  height:26px;border-radius:8px;overflow:hidden;
  display:flex;gap:2px;background:rgba(255,255,255,.07);padding:2px;
}

.vp-res-part{
  border-radius:6px;display:grid;place-items:center;
  font:700 10px/1 var(--mono);
}
.vp-res-part.other{background:rgba(255,255,255,.09)}

/* Твоят дял: розов и назован. */
.vp-res-part.mine{background:#7cbf00;color:#000000}

.vp-res-note{
  margin:18px 0 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid #7cbf00;
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.vp-res-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ДВАТА ВАРИАНТА · кратко
   ══════════════════════════════════════════════════════════ */
/*
 * КРАТКО НАРОЧНО: пакетите, цените и подробностите за управлението
 * живеят на страницата „managed-vps“.
 *
 * Ако ги повторим тук, двете страници се застъпват — човек намира едно
 * и също на два адреса, а Гугъл ги смята за дублирани.
 */
.vp-fork{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.vp-fork-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
  display:flex;flex-direction:column;
}
.vp-fork-i.is-rec{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

.vp-fork-h{display:flex;align-items:center;gap:11px;margin-bottom:10px}

.vp-fork-ic{
  width:40px;height:40px;border-radius:12px;flex:0 0 auto;
  display:grid;place-items:center;
}
.vp-fork-ic svg{width:19px;height:19px}
.vp-fork-i.is-rec .vp-fork-ic{background:#FDF1F4;color:var(--rose)}
.vp-fork-i.self .vp-fork-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}

.vp-fork-h b{flex:1;font:800 1.15rem/1.2 var(--sans);letter-spacing:-.02em}

.vp-fork-sub{
  margin:0 0 18px;font-size:13.5px;color:var(--ink-soft);line-height:1.65;
  flex:1;
}

.vp-fork-who{
  padding:14px 16px;border-radius:var(--r, 10px);
  font-size:12.5px;line-height:1.6;
}
.vp-fork-i.is-rec .vp-fork-who{background:#FDF1F4;color:var(--rose-lo, #9B2949)}
.vp-fork-i.self .vp-fork-who{background:var(--wash);color:var(--ink-soft)}
.vp-fork-who b{font-weight:700}

.vp-fork-note{
  margin:14px 0 0;font-size:12px;color:var(--steel-lt);
}

/* Връзката към другата страница: там са подробностите. */
.vp-fork-go{margin-top:14px;align-self:flex-start}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.vp-plans{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
  align-items:stretch;
}

.vp-plan{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.vp-plan.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.vp-plan-h{
  padding:20px 20px 16px;border-bottom:1px solid var(--line);position:relative;
  min-height:92px;display:flex;flex-direction:column;justify-content:center;
}
.vp-plan.is-best .vp-plan-h{background:#FDF1F4}

.vp-plan-tag{
  position:absolute;top:-1px;right:16px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.vp-plan-n{font:800 1.1rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 4px}
.vp-plan-for{font-size:12px;color:var(--steel);margin:0;line-height:1.5}

/*
 * ЯДРАТА И ПАМЕТТА СА ГЛАВНОТО ЧИСЛО.
 *
 * Купувачът на VPS знае какво значат — за разлика от този на споделен
 * хостинг, който мисли в посещения.
 */
.vp-plan-spec{
  padding:16px 20px;border-bottom:1px solid var(--line);
  background:var(--wash);
  display:grid;grid-template-columns:1fr 1fr;gap:2px;text-align:center;
}

.vp-plan-spec div b{
  display:block;font:800 1.3rem/1 var(--mono);letter-spacing:-.035em;
}
.vp-plan-spec div span{
  display:block;font-size:10.5px;color:var(--steel);margin-top:5px;
}

.vp-plan-p{padding:16px 20px;border-bottom:1px solid var(--line)}

.vp-plan-p s{
  display:block;font:400 12.5px/1 var(--mono);color:var(--steel-lt);
  text-decoration:line-through;margin-bottom:6px;
}
.vp-plan-p b{font:800 1.45rem/1 var(--mono);letter-spacing:-.035em}
.vp-plan-p > span{font-size:12px;color:var(--steel);margin-left:3px}

/* Цената на час: причината за черен петък. */
.vp-plan-p em{
  display:block;font:400 11px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.vp-plan-f{
  padding:16px 20px;flex:1 0 auto;
  display:grid;gap:9px;align-content:start;
}

.vp-plan-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:12.5px;line-height:1.5;color:var(--ink-soft);
}
.vp-plan-f b{font-weight:700;color:var(--ink)}

.vp-fi{
  width:15px;height:15px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.vp-fi svg{width:8px;height:8px;stroke-width:3.6}
.vp-fi.no{background:var(--wash);color:var(--steel-lt)}

.vp-plan-go{padding:0 20px 20px;margin-top:auto}
.vp-plan-go .btn{width:100%}

.vp-plan-try{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   ОБЩОТО
   ══════════════════════════════════════════════════════════ */
.vp-all-sec{padding-block:clamp(30px,4vw,44px)}

.vp-all{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px;
}

.vp-all-h{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.vp-all-h b{font:700 15px/1.3 var(--sans)}

.vp-all-l{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px}

.vp-all-l > div{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════
   РАСТЕЖЪТ
   ══════════════════════════════════════════════════════════ */
/*
 * ДВЕТЕ НЕЩА, КОИТО САМОСТОЯТЕЛНИЯТ СЪРВЪР НЯМА.
 *
 * Растеж за минути и снимка преди промяна. Това е истинското
 * предимство на VPS, а не цената.
 */
.vp-grow{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.vp-grow-box{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);padding:26px;
}

.vp-grow-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

/* Стъпалата: растежът е по избор, не по договор. */
.vp-grow-steps{display:grid;gap:9px;margin-bottom:18px}

.vp-grow-s{
  display:flex;align-items:center;gap:12px;
  padding:11px 14px;border-radius:var(--r, 10px);background:rgba(255,255,255,.06);
}

/* Текущото положение: то дава опора на окото. */
.vp-grow-s.is-now{
  background:rgba(192,51,92,.2);border:1px solid rgba(192,51,92,.4);
}

.vp-grow-s b{flex:1;font:700 13px/1 var(--mono);color:#fff}
.vp-grow-s span{font:600 12px/1 var(--sans);color:rgba(255,255,255,.55)}
.vp-grow-s.is-now span{color:#FF8FAB}

.vp-grow-time{
  display:flex;align-items:center;gap:9px;
  padding-top:16px;border-top:1px solid rgba(255,255,255,.1);
  font-size:12.5px;color:rgba(255,255,255,.6);
}
.vp-grow-time svg{width:15px;height:15px;flex:0 0 auto}
.vp-grow-time b{font:700 13px/1 var(--mono);color:#6FD9AC}

.vp-grow-l{display:grid;gap:16px}

.vp-grow-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.vp-grow-ic{
  width:36px;height:36px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.vp-grow-ic svg{width:17px;height:17px}

.vp-grow-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:5px}
.vp-grow-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   КЪДЕ СТОИ VPS
   ══════════════════════════════════════════════════════════ */
/*
 * ЧЕСТНО ПОЗИЦИОНИРАНЕ между споделен и самостоятелен.
 *
 * Половината хора, които гледат VPS, не им трябва. Ако го премълчим,
 * купуват грешното и се връщат ядосани.
 */
.vp-where{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.vp-where-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}
.vp-where-i.is-this{border-color:var(--rose);background:#FDF1F4}

.vp-where-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.vp-where-top b{flex:1;font:700 15px/1.3 var(--sans)}

.vp-where-i p{margin:0 0 14px;font-size:13px;color:var(--steel);line-height:1.6}
.vp-where-i.is-this p{color:var(--ink-soft)}

.vp-where-when{
  padding:12px 14px;border-radius:var(--r, 10px);background:var(--wash);
  font-size:12.5px;line-height:1.6;color:var(--ink-soft);
}
.vp-where-i.is-this .vp-where-when{background:rgba(255,255,255,.7)}
.vp-where-when b{font-weight:700;color:var(--ink)}

.vp-where-go{margin-top:14px}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.vp-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.vp-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:680px}

.vp-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.vp-tbl th.best{background:#FBE4EA;color:var(--rose)}

.vp-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.vp-tbl tbody tr:last-child td{border-bottom:0}
.vp-tbl tbody tr:hover{background:var(--wash)}

.vp-tbl td.mono{font-family:var(--mono);font-size:13px}
.vp-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.vp-tbl th:first-child,
.vp-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.vp-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   СИСТЕМИТЕ
   ══════════════════════════════════════════════════════════ */
.vp-os{display:flex;gap:10px;flex-wrap:wrap}

.vp-os-i{
  display:flex;align-items:center;gap:10px;
  padding:12px 16px;border-radius:var(--r, 10px);
  background:var(--paper);border:1px solid var(--line);
}

.vp-os-mark{
  width:28px;height:28px;border-radius:8px;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--wash);color:var(--steel);font:800 11px/1 var(--sans);
}

.vp-os-i b{font:600 13.5px/1 var(--sans)}
.vp-os-i span span{font:400 11.5px/1 var(--sans);color:var(--steel-lt)}

.vp-os-note{margin:18px 0 0;font-size:13px;color:var(--steel);line-height:1.65}
.vp-os-note b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.vp-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.vp-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.vp-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.vp-rev-stars svg{width:15px;height:15px}

.vp-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.vp-rev-who{display:flex;align-items:center;gap:11px}

.vp-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.vp-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.vp-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.vp-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.vp-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.vp-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.vp-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.vp-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.vp-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.vp-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.vp-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.vp-cta h2{color:#fff;margin:0 0 8px}
.vp-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.vp-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.vp-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.vp-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .vp-plans{grid-template-columns:1fr 1fr}
  .vp-all-l{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .vp-hero-in{grid-template-columns:1fr}
  .vp-revs{grid-template-columns:1fr}
  .vp-faq{grid-template-columns:1fr}
  .vp-grow{grid-template-columns:1fr}
  .vp-fork{grid-template-columns:1fr}
  .vp-where{grid-template-columns:1fr}
}

@media (max-width:620px){
  .vp-plans{grid-template-columns:1fr}
  .vp-all-l{grid-template-columns:1fr}
  .vp-hero-go .btn{width:100%}
  .vp-cta-go{width:100%}
  .vp-cta-go .btn{flex:1}
  .vp-os-i{flex:1 1 100%}
}

/* ==== vps: край ==== */

/* ==== managed-vps: начало ==== */

/* ══════════════════════════════════════════════════════════
   МЕНИДЖЪР VPS
   ══════════════════════════════════════════════════════════ */

.mv-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.mv-head h2{margin:0 0 12px}
.mv-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}
.mv-head.mid{margin-inline:auto;text-align:center}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.mv-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.mv-hero-in{
  display:grid;grid-template-columns:1fr 1.1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.mv-hero h1{color:#fff;margin:0 0 14px}

.mv-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.mv-eyebrow{margin-bottom:16px}

.mv-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.mv-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.mv-notes span{display:inline-flex;align-items:center;gap:7px}
.mv-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.mv-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   НОЩТА · случка по часове
   ══════════════════════════════════════════════════════════ */
/*
 * ПРОБЛЕМЪТ НА УПРАВЛЕНИЕТО Е, ЧЕ ПЛАЩАШ И НЕ ВИЖДАШ НИЩО.
 *
 * Работата е невидима, докато всичко работи — а когато работи, човек си
 * мисли, че плаща за нищо.
 *
 * Случката в три през нощта го показва по-бързо от думи като
 * „проактивна поддръжка“.
 */
.mv-night{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.mv-night-h{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:18px;
}
.mv-night-h span{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);
}
.mv-night-h b{
  font:700 11px/1 var(--mono);color:#6FD9AC;
  padding:4px 9px;border-radius:99px;background:rgba(18,122,85,.24);
  white-space:nowrap;
}

.mv-night-l{display:grid}

.mv-night-r{
  display:grid;grid-template-columns:auto auto 1fr;gap:13px;
  align-items:start;padding-bottom:16px;position:relative;
}
.mv-night-r:last-child{padding-bottom:0}

/* Черта между часовете: тя казва, че вървят по ред. */
.mv-night-r:not(:last-child)::before{
  content:'';position:absolute;left:52px;top:22px;bottom:2px;
  width:2px;background:rgba(255,255,255,.12);
}

.mv-night-t{
  font:700 11.5px/1 var(--mono);color:rgba(255,255,255,.5);
  padding-top:5px;min-width:38px;
}

.mv-night-d{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:3px;
  display:grid;place-items:center;z-index:1;
  background:rgba(255,255,255,.14);
}
.mv-night-d i{
  width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5);
}

/* Началото на случката е червено, краят — зелен. */
.mv-night-r.is-bad .mv-night-d{background:rgba(176,52,44,.3)}
.mv-night-r.is-bad .mv-night-d i{background:#FF8FAB}

.mv-night-r.is-ok .mv-night-d{background:rgba(18,122,85,.3)}
.mv-night-r.is-ok .mv-night-d i{background:#6FD9AC}

.mv-night-x b{
  display:block;font:600 13px/1.4 var(--sans);color:#fff;margin-bottom:3px;
}
.mv-night-x span{font-size:12px;color:rgba(255,255,255,.55);line-height:1.5}

.mv-night-end{
  margin-top:18px;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid #7cbf00;
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.mv-night-end b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   НЕВИДИМАТА РАБОТА
   ══════════════════════════════════════════════════════════ */
/*
 * ДРУГАТА ПОЛОВИНА НА СЪЩИЯ ВЪПРОС: човек вижда сметката, но не вижда
 * работата.
 */
.mv-work{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:22px}

.mv-work-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;text-align:center;
}

.mv-work-i b{
  display:block;font:800 1.7rem/1 var(--mono);letter-spacing:-.035em;
  margin-bottom:8px;
}
.mv-work-i span{display:block;font-size:12px;color:var(--steel);line-height:1.5}

/* ══════════════════════════════════════════════════════════
   ДНЕВНИКЪТ
   ══════════════════════════════════════════════════════════ */
/*
 * „ПРАВИМ МНОГО НЕЩА“ НЕ ЗНАЧИ НИЩО. Ред с дата и какво е направено —
 * значи.
 *
 * Колоната „не си усетил“ е нарочна: тя е целият смисъл на услугата.
 */
.mv-log{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.mv-log-h{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 20px;background:var(--wash);border-bottom:1px solid var(--line);
}
.mv-log-h b{font:700 13.5px/1 var(--sans)}
.mv-log-h span{font:400 11.5px/1 var(--mono);color:var(--steel-lt)}

.mv-log-l{display:grid}

.mv-log-r{
  display:grid;grid-template-columns:auto auto 1fr auto;gap:14px;
  align-items:center;padding:13px 20px;
  border-bottom:1px solid var(--line);font-size:13px;
}
.mv-log-r:last-child{border-bottom:0}

.mv-log-date{
  font:400 11.5px/1 var(--mono);color:var(--steel-lt);min-width:44px;
}

.mv-log-kind{
  font:700 10px/1 var(--sans);padding:4px 8px;border-radius:99px;
  white-space:nowrap;
}
.mv-log-kind.up{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.mv-log-kind.sec{background:#FDF1F4;color:var(--rose)}
.mv-log-kind.fix{background:#FBF4E4;color:var(--warn, #9A6A12)}
.mv-log-kind.bak{background:#E7F5EF;color:var(--up, #127A55)}

.mv-log-r > span:nth-child(3){color:var(--ink-soft);line-height:1.5}

.mv-log-you{
  font:600 11px/1 var(--sans);color:var(--steel-lt);white-space:nowrap;
}

.mv-log-more{
  padding:13px 20px;text-align:center;
  font-size:12.5px;color:var(--steel);background:var(--wash);
}

/* ══════════════════════════════════════════════════════════
   ПАКЕТИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОДРАВНЕНИ ОТГОРЕ И ОТДОЛУ: „align-items:start“ оставя всяка плочка с
 * нейната си височина и бутоните излизат на различни места.
 */
.mv-packs{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  align-items:stretch;
}

.mv-pack{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  display:flex;flex-direction:column;
}

.mv-pack.is-best{
  border-color:var(--rose);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Шапката е с еднаква височина: описанието е един или два реда. */
.mv-pack-h{
  padding:22px 22px 18px;border-bottom:1px solid var(--line);position:relative;
  min-height:104px;display:flex;flex-direction:column;justify-content:center;
}
.mv-pack.is-best .mv-pack-h{background:#629308}

.mv-pack-tag{
  position:absolute;top:-1px;right:18px;
  padding:5px 11px;border-radius:0 0 8px 8px;
  background:var(--rose);color:#fff;
  font:700 10px/1 var(--sans);letter-spacing:.04em;
}

.mv-pack-n{font:800 1.2rem/1.2 var(--sans);letter-spacing:-.02em;margin:0 0 5px}
.mv-pack-for{font-size:12.5px;color:var(--steel);margin:0;line-height:1.5}

/*
 * ВРЕМЕТО ЗА ОТГОВОР Е ГЛАВНОТО ЧИСЛО, не списъкът с функции.
 *
 * При управление човек купува спокойствие, а то се мери в минути.
 */
.mv-pack-sla{
  padding:18px 22px;border-bottom:1px solid var(--line);
  background:var(--wash);text-align:center;
}
.mv-pack-sla b{display:block;font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.mv-pack-sla span{display:block;font-size:11.5px;color:var(--steel);margin-top:6px}

.mv-pack-p{padding:18px 22px;border-bottom:1px solid var(--line)}
.mv-pack-p b{font:800 1.5rem/1 var(--mono);letter-spacing:-.035em}
.mv-pack-p > span{font-size:12.5px;color:var(--steel);margin-left:3px}
.mv-pack-p em{
  display:block;font:400 11.5px/1.4 var(--sans);font-style:normal;
  color:var(--steel-lt);margin-top:7px;
}

/* Списъкът се разтяга, за да падне бутонът долу при всички. */
.mv-pack-f{
  padding:18px 22px;flex:1 0 auto;
  display:grid;gap:11px;align-content:start;
}

.mv-pack-f > div{
  display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;
  font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.mv-pack-f b{font-weight:700;color:var(--ink)}

.mv-fi{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.mv-fi svg{width:9px;height:9px;stroke-width:3.4}
.mv-fi.no{background:var(--wash);color:var(--steel-lt)}

.mv-pack-go{padding:0 22px 22px;margin-top:auto}
.mv-pack-go .btn{width:100%}

.mv-pack-note{
  display:block;margin-top:9px;text-align:center;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}

/* ══════════════════════════════════════════════════════════
   КОЙ КАКВО ПРАВИ
   ══════════════════════════════════════════════════════════ */
/*
 * НЕЯСНОТАТА ТУК РАЖДА СПОРОВЕ ПОСЛЕ: „управление“ значи различно при
 * всеки доставчик.
 */
.mv-split{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.mv-split-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}
.mv-split-i.us{border-color:rgba(18,122,85,.3)}

.mv-split-h{display:flex;align-items:center;gap:11px;margin-bottom:18px}

.mv-split-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;
}
.mv-split-ic svg{width:18px;height:18px}
.mv-split-i.us .mv-split-ic{background:#E7F5EF;color:var(--up, #127A55)}
.mv-split-i.you .mv-split-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}

.mv-split-h b{font:700 15px/1.3 var(--sans)}

.mv-split-l{list-style:none;padding:0;margin:0;display:grid;gap:11px}

.mv-split-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.mv-split-l i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--steel-lt);
}
.mv-split-i.us .mv-split-l i{background:var(--up, #127A55)}
.mv-split-i.you .mv-split-l i{background:var(--blue, #1C5FA8)}

/*
 * КАКВО НЕ ВЛИЗА · казва се право.
 *
 * Премълчаването изглежда изгодно, докато клиентът не поиска нещо и не
 * получи отказ.
 */
.mv-split-not{
  margin-top:22px;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.2);
  font-size:13px;color:var(--warn, #9A6A12);line-height:1.65;
}
.mv-split-not b{font-weight:700;display:block;margin-bottom:6px}
.mv-split-not ul{margin:0;padding-left:18px}
.mv-split-not li{margin-bottom:4px}

/* ══════════════════════════════════════════════════════════
   СЛУЧАИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * „А АКО СТАНЕ ТОВА?“ — най-честият въпрос преди купуване.
 *
 * Общо обещание не отговаря. Конкретен случай с време и стъпки —
 * отговаря.
 */
.mv-cases{display:grid;gap:12px}

.mv-case{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.mv-case-q{
  display:flex;align-items:center;gap:13px;
  padding:16px 20px;background:var(--wash);border-bottom:1px solid var(--line);
}

.mv-case-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:#FDF0EE;color:var(--down, #B0342C);
}
.mv-case-ic svg{width:16px;height:16px}

.mv-case-q b{flex:1;font:700 14.5px/1.35 var(--sans)}

.mv-case-a{padding:18px 20px;display:grid;gap:12px}

.mv-case-s{
  display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

/* Времето е отляво: то е отговорът, текстът е обяснението. */
.mv-case-t{
  font:700 11px/1 var(--mono);color:var(--up, #127A55);
  padding:4px 8px;border-radius:99px;background:#E7F5EF;
  white-space:nowrap;min-width:62px;text-align:center;
}

.mv-case-who{
  padding:12px 20px;background:var(--wash);border-top:1px solid var(--line);
  font-size:12.5px;color:var(--steel);
}
.mv-case-who b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦА
   ══════════════════════════════════════════════════════════ */
.mv-tbl{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.mv-tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:620px}

.mv-tbl th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.mv-tbl th.best{background:#FBE4EA;color:var(--rose)}

.mv-tbl td{padding:13px 16px;border-bottom:1px solid var(--line)}
.mv-tbl tbody tr:last-child td{border-bottom:0}
.mv-tbl tbody tr:hover{background:var(--wash)}

.mv-tbl td.mono{font-family:var(--mono);font-size:13px}
.mv-tbl td.best{background:#FDF1F4}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.mv-tbl th:first-child,
.mv-tbl td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.mv-tbl th:first-child{background:var(--wash)}

/* ══════════════════════════════════════════════════════════
   ОТЗИВИ
   ══════════════════════════════════════════════════════════ */
.mv-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.mv-rev{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.mv-rev-stars{display:flex;gap:2px;margin-bottom:12px;color:var(--star, #F0A81E)}
.mv-rev-stars svg{width:15px;height:15px}

.mv-rev p{margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--ink-soft)}

.mv-rev-who{display:flex;align-items:center;gap:11px}

.mv-rev-av{
  width:36px;height:36px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 13px/1 var(--sans);
}

.mv-rev-who b{display:block;font:600 13px/1.3 var(--sans)}
.mv-rev-who span span{display:block;font-size:11.5px;color:var(--steel);margin-top:2px}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.mv-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.mv-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.mv-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.mv-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.mv-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.mv-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.mv-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.mv-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.mv-cta h2{color:#fff;margin:0 0 8px}
.mv-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:440px}

.mv-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.mv-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.mv-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .mv-work{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .mv-hero-in{grid-template-columns:1fr}
  .mv-packs{grid-template-columns:1fr}
  .mv-revs{grid-template-columns:1fr}
  .mv-faq{grid-template-columns:1fr}
  .mv-split{grid-template-columns:1fr}

  /* Дневникът: „не си усетил“ пада на нов ред. */
  .mv-log-r{grid-template-columns:auto 1fr;gap:10px}
  .mv-log-you{grid-column:2}
}

@media (max-width:620px){
  .mv-work{grid-template-columns:1fr}
  .mv-hero-go .btn{width:100%}
  .mv-cta-go{width:100%}
  .mv-cta-go .btn{flex:1}

  /* Нощта: точките отпадат, остават часът и текстът. */
  .mv-night-r{grid-template-columns:auto 1fr}
  .mv-night-d{display:none}
  .mv-night-r::before{display:none}

  .mv-case-s{grid-template-columns:1fr}
  .mv-case-t{justify-self:start}
}

/* ==== managed-vps: край ==== */

/* ==== ddos: начало ==== */

/* ══════════════════════════════════════════════════════════
   ЗАЩИТА ОТ АТАКИ
   ══════════════════════════════════════════════════════════ */

.dd-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.dd-head h2{margin:0 0 12px}
.dd-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.dd-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.dd-hero-in{
  display:grid;grid-template-columns:1fr 1.05fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.dd-hero h1{color:#fff;margin:0 0 14px}

.dd-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.dd-eyebrow{margin-bottom:16px}

.dd-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.dd-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.dd-notes span{display:inline-flex;align-items:center;gap:7px}
.dd-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.dd-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   МИНАЛИЯ МЕСЕЦ
   ══════════════════════════════════════════════════════════ */
/*
 * ЧИСЛА ОТ НАШАТА МРЕЖА, не от чужд отчет.
 *
 * Страниците за защита обикновено плашат: „всеки 39 секунди става
 * атака“. Това е чужда статистика и не значи нищо за конкретния сайт.
 */
.dd-month{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.dd-month-h{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:20px;
}
.dd-month-h span{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);
}
.dd-month-h b{
  font:700 11px/1 var(--mono);color:#6FD9AC;
  padding:4px 9px;border-radius:99px;background:rgba(18,122,85,.24);
}

.dd-month-g{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}

.dd-month-i{background:rgba(255,255,255,.06);border-radius:var(--r, 10px);padding:16px}
.dd-month-i b{
  display:block;font:800 1.5rem/1 var(--mono);letter-spacing:-.03em;
  color:#fff;margin-bottom:7px;
}
.dd-month-i span{font-size:11.5px;color:rgba(255,255,255,.55);line-height:1.45}

/* Най-голямата атака: тя дава мащаб на всичко останало. */
.dd-month-big{
  padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(192,51,92,.16);border:1px solid rgba(192,51,92,.34);
}
.dd-month-big b{
  display:block;font:800 1.3rem/1 var(--mono);color:#FF8FAB;margin-bottom:6px;
}
.dd-month-big span{font-size:12px;color:rgba(255,255,255,.6);line-height:1.5}

.dd-month-note{
  margin:16px 0 0;font-size:11.5px;color:rgba(255,255,255,.42);line-height:1.55;
}

/* ══════════════════════════════════════════════════════════
   АТАКА ИЛИ БАВНО
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-ЧЕСТИЯТ ВЪПРОС, и почти никой не му отговаря.
 *
 * Човек вижда бавен сайт и се пита дали го атакуват. Обикновено не го
 * атакуват — но няма как да го разбере сам.
 */
.dd-tell{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.dd-tell-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}
.dd-tell-i.attack{border-color:rgba(176,52,44,.3)}

.dd-tell-h{display:flex;align-items:center;gap:11px;margin-bottom:18px}

.dd-tell-ic{
  width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;
}
.dd-tell-ic svg{width:18px;height:18px}
.dd-tell-i.attack .dd-tell-ic{background:#FDF0EE;color:var(--down, #B0342C)}
.dd-tell-i.slow .dd-tell-ic{background:#FBF4E4;color:var(--warn, #9A6A12)}

.dd-tell-h b{font:700 15px/1.3 var(--sans)}

.dd-tell-l{list-style:none;padding:0;margin:0;display:grid;gap:12px}

.dd-tell-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.dd-tell-l i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--steel-lt);
}
.dd-tell-i.attack .dd-tell-l i{background:var(--down, #B0342C)}
.dd-tell-i.slow .dd-tell-l i{background:var(--warn, #9A6A12)}

/* Какво да направи: без него сравнението е само описание. */
.dd-tell-what{
  margin-top:20px;padding:14px 16px;border-radius:var(--r, 10px);
  font-size:12.5px;line-height:1.6;
}
.dd-tell-i.attack .dd-tell-what{background:#FDF0EE;color:var(--down, #B0342C)}
.dd-tell-i.slow .dd-tell-what{background:#FBF4E4;color:var(--warn, #9A6A12)}
.dd-tell-what b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   СЛОЕВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * „МНОГОСЛОЙНА ЗАЩИТА“ Е ДУМА БЕЗ СЪДЪРЖАНИЕ.
 *
 * Схемата показва в кой момент от пътя се маха кое, а числата отдясно
 * правят обещанието проверимо.
 */
.dd-layers{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,32px);
}

.dd-layers-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:22px;
}

.dd-layer{
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;
  align-items:center;padding:16px 0;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.dd-layer:last-of-type{border-bottom:0}

.dd-layer-n{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.1);color:#fff;font:700 13px/1 var(--mono);
}

.dd-layer-t b{
  display:block;font:700 14px/1.35 var(--sans);color:#fff;margin-bottom:4px;
}
.dd-layer-t span{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.55}

/* Числото прави схемата проверима. */
.dd-layer-cut{text-align:right;flex:0 0 auto}
.dd-layer-cut b{
  display:block;font:700 15px/1 var(--mono);color:#FF8FAB;margin-bottom:4px;
  white-space:nowrap;
}
.dd-layer-cut span{font:400 10.5px/1 var(--sans);color:rgba(255,255,255,.45)}

.dd-layers-end{
  margin-top:20px;padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid rgba(111,217,172,.24);
  display:flex;align-items:center;gap:12px;
  font-size:13px;color:#6FD9AC;line-height:1.6;
}
.dd-layers-end b{font:700 15px/1 var(--mono);white-space:nowrap}

/* ══════════════════════════════════════════════════════════
   ЕДНА АТАКА
   ══════════════════════════════════════════════════════════ */
/*
 * ОБЩОТО ОБЕЩАНИЕ „защитаваме ви“ не казва нищо. Една атака с часове и
 * числа казва какво значи на практика.
 */
.dd-att{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.dd-att-h{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 22px;background:var(--wash);border-bottom:1px solid var(--line);
}
.dd-att-h b{font:700 14px/1 var(--sans)}
.dd-att-h span{font:400 12px/1 var(--mono);color:var(--steel-lt)}

.dd-att-l{padding:20px 22px;display:grid}

.dd-att-r{
  display:grid;grid-template-columns:auto auto 1fr;gap:14px;
  align-items:start;padding-bottom:18px;position:relative;
}
.dd-att-r:last-child{padding-bottom:0}

/* Черта между часовете: тя казва, че вървят по ред. */
.dd-att-r:not(:last-child)::before{
  content:'';position:absolute;left:60px;top:20px;bottom:2px;
  width:2px;background:var(--line);
}

.dd-att-t{
  font:700 11.5px/1 var(--mono);color:var(--steel-lt);
  padding-top:4px;min-width:46px;
}

.dd-att-d{
  width:14px;height:14px;border-radius:50%;flex:0 0 auto;margin-top:2px;
  display:grid;place-items:center;z-index:1;background:var(--wash-2, #EDF1F6);
}
.dd-att-d i{width:6px;height:6px;border-radius:50%;background:var(--steel-lt)}

/* Началото е червено, краят — зелен. */
.dd-att-r.is-bad .dd-att-d{background:#FDF0EE}
.dd-att-r.is-bad .dd-att-d i{background:var(--down, #B0342C)}
.dd-att-r.is-ok .dd-att-d{background:#E7F5EF}
.dd-att-r.is-ok .dd-att-d i{background:var(--up, #127A55)}

.dd-att-x b{display:block;font:600 13.5px/1.4 var(--sans);margin-bottom:3px}
.dd-att-x span{font-size:12.5px;color:var(--steel);line-height:1.55}

.dd-att-end{
  padding:16px 22px;background:#E7F5EF;border-top:1px solid rgba(18,122,85,.2);
  font-size:13px;color:var(--up, #127A55);line-height:1.6;
}
.dd-att-end b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ГРАНИЦИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЧЕСТНИТЕ ГРАНИЦИ РЯДКО СЕ ПИШАТ, а точно те строят доверие.
 *
 * Всеки обещава „пълна защита“. Никой не казва какво става над
 * определен размер, или при атака, която прилича на истински хора.
 */
.dd-limits{
  background:#FBF4E4;border:1px solid rgba(154,106,18,.24);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,28px);
}

.dd-limits-h{display:flex;align-items:center;gap:12px;margin-bottom:18px}

.dd-limits-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(154,106,18,.16);color:var(--warn, #9A6A12);
}
.dd-limits-ic svg{width:17px;height:17px}

.dd-limits-h b{font:700 15.5px/1.3 var(--sans);color:var(--warn, #9A6A12)}

.dd-limits-l{display:grid;gap:16px}

.dd-limits-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.dd-limits-i > i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--warn, #9A6A12);
}

.dd-limits-i b{
  display:block;font:700 13.5px/1.35 var(--sans);
  color:var(--warn, #9A6A12);margin-bottom:4px;
}
.dd-limits-i p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   КАКВО ПРАВИШ ТИ
   ══════════════════════════════════════════════════════════ */
/*
 * ОТГОВОРЪТ Е „НИЩО“ — и точно това трябва да се каже право.
 *
 * Човек, който чете за атаки, започва да търси какво да настрои.
 */
.dd-you{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.dd-you-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

/* „Нищо“ е най-важното — то е с друг цвят. */
.dd-you-i.big{border-color:rgba(18,122,85,.3);background:#E7F5EF}

.dd-you-ic{
  width:40px;height:40px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.dd-you-ic svg{width:19px;height:19px}
.dd-you-i.big .dd-you-ic{background:rgba(18,122,85,.14);color:var(--up, #127A55)}

.dd-you-i b{display:block;font:700 15px/1.35 var(--sans);margin-bottom:7px}
.dd-you-i.big b{color:var(--up, #127A55)}
.dd-you-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}
.dd-you-i.big p{color:var(--ink-soft)}

/* ══════════════════════════════════════════════════════════
   ЗА КОГО
   ══════════════════════════════════════════════════════════ */
.dd-who{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}

.dd-who-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.dd-who-ic{
  width:36px;height:36px;border-radius:10px;margin-bottom:14px;
  display:grid;place-items:center;background:#FDF1F4;color:var(--rose);
}
.dd-who-ic svg{width:17px;height:17px}

.dd-who-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.dd-who-i p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.dd-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.dd-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.dd-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.dd-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.dd-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.dd-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.dd-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.dd-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.dd-cta h2{color:#fff;margin:0 0 8px}
.dd-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:460px}

.dd-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.dd-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.dd-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .dd-who{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .dd-hero-in{grid-template-columns:1fr}
  .dd-tell{grid-template-columns:1fr}
  .dd-you{grid-template-columns:1fr}
  .dd-faq{grid-template-columns:1fr}
}

@media (max-width:620px){
  .dd-who{grid-template-columns:1fr}
  .dd-month-g{grid-template-columns:1fr}
  .dd-hero-go .btn{width:100%}
  .dd-cta-go{width:100%}
  .dd-cta-go .btn{flex:1}

  /* Числото пада под текста, вместо да го смачква. */
  .dd-layer{grid-template-columns:auto 1fr;gap:12px}
  .dd-layer-cut{grid-column:2;text-align:left}

  /* Часовете остават, точките отпадат. */
  .dd-att-r{grid-template-columns:auto 1fr}
  .dd-att-d{display:none}
  .dd-att-r::before{display:none}
}

/* ==== ddos: край ==== */

/* ==== ssl: начало ==== */

/* ══════════════════════════════════════════════════════════
   СЕРТИФИКАТИ ЗА ЗАЩИТА
   ══════════════════════════════════════════════════════════ */

.sl-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.sl-head h2{margin:0 0 12px}
.sl-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.sl-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,74px) 0 clamp(36px,5vw,62px);
}

.sl-hero-in{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(26px,4vw,52px);align-items:center;
}

.sl-hero h1{color:#fff;margin:0 0 14px}

.sl-hero-in > div > p{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.8vw,17px);
  margin:0 0 24px;max-width:520px;line-height:1.65;
}

.sl-eyebrow{margin-bottom:16px}

.sl-hero-go{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:24px}

.sl-notes{
  display:flex;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58);
}
.sl-notes span{display:inline-flex;align-items:center;gap:7px}
.sl-notes i{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#000000;
}
.sl-notes svg{width:9px;height:9px;stroke-width:3.5}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НА БРАУЗЪРА
   ══════════════════════════════════════════════════════════ */
/*
 * ТОВА, КОЕТО ЧОВЕК НАИСТИНА ВИЖДА.
 *
 * Обясненията говорят за „криптиране“ и „удостоверяване“. Човек вижда
 * едно катинарче и се пита дали е наред.
 */
.sl-bar-box{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sl-bar-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:18px;
}

.sl-bar{
  display:flex;align-items:center;gap:10px;
  padding:11px 14px;border-radius:99px;margin-bottom:9px;
  background:rgba(255,255,255,.08);
}

.sl-bar-ic{width:18px;height:18px;flex:0 0 auto;display:grid;place-items:center}
.sl-bar-ic svg{width:14px;height:14px;stroke-width:2}

.sl-bar-url{
  flex:1;min-width:0;font:400 12.5px/1.3 var(--mono);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

.sl-bar.ok .sl-bar-ic{color:#6FD9AC}
.sl-bar.ok .sl-bar-url{color:rgba(255,255,255,.85)}
.sl-bar.ok .sl-bar-url b{color:#fff;font-weight:700}

.sl-bar.warn{background:rgba(154,106,18,.2)}
.sl-bar.warn .sl-bar-ic{color:#F5C86B}
.sl-bar.warn .sl-bar-url{color:rgba(255,255,255,.7)}

.sl-bar.bad{background:rgba(176,52,44,.22)}
.sl-bar.bad .sl-bar-ic{color:#FF8FAB}
.sl-bar.bad .sl-bar-url{color:rgba(255,255,255,.7)}

.sl-bar-say{
  font:700 10px/1 var(--sans);padding:4px 9px;border-radius:99px;
  white-space:nowrap;flex:0 0 auto;
}
.sl-bar.ok .sl-bar-say{background:rgba(18,122,85,.3);color:#6FD9AC}
.sl-bar.warn .sl-bar-say{background:rgba(154,106,18,.3);color:#F5C86B}
.sl-bar.bad .sl-bar-say{background:rgba(176,52,44,.3);color:#FF8FAB}

.sl-bar-note{
  margin:18px 0 0;padding:13px 15px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid #7cbf00;
  font-size:12.5px;color:#7cbf00;line-height:1.6;
}
.sl-bar-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   НЕДОРАЗУМЕНИЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-СКЪПОТО НЕДОРАЗУМЕНИЕ В ИНТЕРНЕТ.
 *
 * Хората мислят, че катинарчето значи „сайтът е честен“. То казва само,
 * че връзката не се подслушва.
 *
 * Измамните сайтове също имат сертификат: безплатен е и се взима за
 * минута, точно както нашият.
 */
.sl-myth{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.sl-myth-i{
  border-radius:var(--r-lg, 16px);padding:24px;
  border:1px solid var(--line);background:var(--paper);
}
.sl-myth-i.no{border-color:rgba(176,52,44,.3);background:#FDF0EE}
.sl-myth-i.yes{border-color:rgba(18,122,85,.3);background:#E7F5EF}

.sl-myth-h{display:flex;align-items:center;gap:11px;margin-bottom:16px}

.sl-myth-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
}
.sl-myth-ic svg{width:17px;height:17px}
.sl-myth-i.no .sl-myth-ic{background:rgba(176,52,44,.14);color:var(--down, #B0342C)}
.sl-myth-i.yes .sl-myth-ic{background:rgba(18,122,85,.14);color:var(--up, #127A55)}

.sl-myth-h b{font:700 15px/1.3 var(--sans)}
.sl-myth-i.no .sl-myth-h b{color:var(--down, #B0342C)}
.sl-myth-i.yes .sl-myth-h b{color:var(--up, #127A55)}

.sl-myth-l{list-style:none;padding:0;margin:0;display:grid;gap:11px}

.sl-myth-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);
}

.sl-myth-l i{width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px}
.sl-myth-i.no .sl-myth-l i{background:var(--down, #B0342C)}
.sl-myth-i.yes .sl-myth-l i{background:var(--up, #127A55)}

/* Това е главното изречение на раздела. */
.sl-myth-end{
  margin-top:22px;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.24);
  font-size:13.5px;color:var(--warn, #9A6A12);line-height:1.65;
}
.sl-myth-end b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   СРАВНЕНИЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * ТУК СЕ КАЗВА НЕЩО, КОЕТО НЕ ПРОДАВА.
 *
 * Първите четири реда са „еднакво“ — това е главното, което страницата
 * казва.
 */
.sl-cmp{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.sl-cmp table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:560px}

.sl-cmp th{
  text-align:left;padding:14px 18px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

/* Безплатната колона е зелена: тя е препоръката. */
.sl-cmp th.free{background:#E7F5EF;color:var(--up, #127A55)}

.sl-cmp td{padding:14px 18px;border-bottom:1px solid var(--line)}
.sl-cmp tbody tr:last-child td{border-bottom:0}
.sl-cmp tbody tr:hover{background:var(--wash)}

.sl-cmp td.free{background:#E7F5EF}
.sl-cmp td b{font-weight:700}

.sl-cmp th:first-child,
.sl-cmp td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.sl-cmp th:first-child{background:var(--wash)}

.sl-same{
  display:inline-flex;align-items:center;gap:6px;
  font:600 12px/1 var(--sans);color:var(--up, #127A55);
}
.sl-same svg{width:12px;height:12px;stroke-width:3.2}

.sl-cmp-after{
  margin:22px 0 0;padding:18px 20px;border-radius:var(--r-lg, 16px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:14px;color:var(--up, #127A55);line-height:1.65;
}
.sl-cmp-after b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   КОГА ПЛАТЕНИЯТ
   ══════════════════════════════════════════════════════════ */
.sl-when{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sl-when-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sl-when-ic{
  width:40px;height:40px;border-radius:12px;margin-bottom:16px;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.sl-when-ic svg{width:19px;height:19px}

.sl-when-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:7px}
.sl-when-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

.sl-when-note{margin:22px 0 0;font-size:13.5px;color:var(--steel);line-height:1.65}
.sl-when-note b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ПОДНОВЯВАНЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * ГЛАВНИЯТ СТРАХ: изтекъл сертификат прави сайта червен, а собственикът
 * научава от клиент.
 *
 * Затова тук е показано кога какво става — с дни, не с обещания.
 */
.sl-renew{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,34px);
}

.sl-renew-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:22px;
}

/* Лентата на живота: 90 дни, с отбелязано подновяване. */
.sl-life{margin-bottom:24px}

.sl-life-bar{
  height:34px;border-radius:10px;overflow:hidden;display:flex;
  background:rgba(255,255,255,.08);padding:3px;gap:3px;
}

.sl-life-p{
  border-radius:8px;display:grid;place-items:center;
  font:700 11px/1 var(--mono);overflow:hidden;white-space:nowrap;
}
.sl-life-p.used{background:rgba(255,255,255,.12);color:rgba(255,255,255,.6)}
.sl-life-p.act{background:var(--up, #127A55);color:#fff}
.sl-life-p.left{background:rgba(255,255,255,.08);color:rgba(255,255,255,.35)}

.sl-life-marks{
  display:flex;justify-content:space-between;margin-top:10px;
  font:400 11px/1 var(--mono);color:rgba(255,255,255,.4);
}

.sl-renew-l{display:grid;gap:14px}

.sl-renew-r{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}

.sl-renew-d{
  font:700 12px/1 var(--mono);color:#6FD9AC;flex:0 0 auto;
  padding:5px 10px;border-radius:99px;background:rgba(18,122,85,.24);
  min-width:74px;text-align:center;white-space:nowrap;
}

.sl-renew-t b{
  display:block;font:700 13.5px/1.35 var(--sans);color:#fff;margin-bottom:3px;
}
.sl-renew-t span{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.55}

.sl-renew-end{
  margin-top:22px;padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.16);border:1px solid rgba(111,217,172,.24);
  font-size:12.5px;color:#6FD9AC;line-height:1.6;
}
.sl-renew-end b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЧЕСТИТЕ ПРОБЛЕМИ
   ══════════════════════════════════════════════════════════ */
/*
 * ТРИТЕ НЕЩА, КОИТО ГОНЯТ ХОРАТА В ПОДДРЪЖКАТА.
 *
 * Всичките са с прост признак и прост отговор — но никой не ги обяснява
 * на човешки език.
 */
.sl-probs{display:grid;gap:12px}

.sl-prob{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.sl-prob-q{
  display:flex;align-items:center;gap:13px;
  padding:16px 20px;background:var(--wash);border-bottom:1px solid var(--line);
}

.sl-prob-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:#FBF4E4;color:var(--warn, #9A6A12);
}
.sl-prob-ic svg{width:16px;height:16px}

.sl-prob-q b{flex:1;font:700 14.5px/1.35 var(--sans)}

.sl-prob-a{padding:18px 20px}

.sl-prob-a p{margin:0 0 12px;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.sl-prob-a p:last-child{margin-bottom:0}
.sl-prob-a b{color:var(--ink);font-weight:700}

/*
 * Примерът за грешката: разликата е ЕДНА БУКВА, затова се показва,
 * вместо да се обяснява.
 */
.sl-prob-code{
  margin:12px 0;padding:12px 14px;border-radius:var(--r, 10px);
  background:var(--navy-deep, #0A1D33);color:rgba(255,255,255,.8);
  font:400 12px/1.6 var(--mono);
  overflow-x:auto;
}
.sl-prob-code b{color:#FF8FAB;font-weight:700}

/* ══════════════════════════════════════════════════════════
   ВИДОВЕТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * DV, OV И EV не значат нищо на човек извън бранша. Обяснени с това
 * какво ПРОВЕРЯВА издателят — значат.
 */
.sl-kinds{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.sl-kind{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

/* Този, който човекът вече има. */
.sl-kind.is-yours{border-color:var(--up, #127A55);background:#E7F5EF}

.sl-kind-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}

.sl-kind-tag{
  font:800 11px/1 var(--mono);padding:5px 9px;border-radius:6px;
  background:var(--wash);color:var(--steel);
}
.sl-kind.is-yours .sl-kind-tag{
  background:rgba(18,122,85,.16);color:var(--up, #127A55);
}

.sl-kind-top b{flex:1;font:700 14.5px/1.3 var(--sans)}

.sl-kind-what{font-size:12.5px;color:var(--steel);line-height:1.6;margin:0 0 14px}
.sl-kind.is-yours .sl-kind-what{color:var(--ink-soft)}

.sl-kind-check{
  padding:12px 14px;border-radius:var(--r, 10px);background:var(--wash);
  font-size:12.5px;line-height:1.6;color:var(--ink-soft);
}
.sl-kind.is-yours .sl-kind-check{background:rgba(255,255,255,.7)}
.sl-kind-check b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.sl-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.sl-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

/* Числото в началото се вижда преди текста. */
.sl-faq-n{
  display:inline-block;margin-bottom:9px;padding:4px 10px;border-radius:99px;
  background:#FDF1F4;color:var(--rose);font:700 12px/1 var(--mono);
}

.sl-faq-i h3{font:700 15px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.sl-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.sl-faq-i b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.sl-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.sl-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.sl-cta h2{color:#fff;margin:0 0 8px}
.sl-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:460px}

.sl-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.sl-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.sl-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1000px){
  .sl-hero-in{grid-template-columns:1fr}
  .sl-myth{grid-template-columns:1fr}
  .sl-when{grid-template-columns:1fr}
  .sl-kinds{grid-template-columns:1fr}
  .sl-faq{grid-template-columns:1fr}
}

@media (max-width:620px){
  .sl-hero-go .btn{width:100%}
  .sl-cta-go{width:100%}
  .sl-cta-go .btn{flex:1}

  /* Денят пада над текста, вместо да го смачква. */
  .sl-renew-r{grid-template-columns:1fr}
  .sl-renew-d{justify-self:start}

  .sl-life-p{font-size:10px}
}

/* ==== ssl: край ==== */

/* ==== kontakti: начало ==== */

/* ══════════════════════════════════════════════════════════
   КОНТАКТИ
   ══════════════════════════════════════════════════════════ */

.kt-head{max-width:660px;margin:0 0 clamp(24px,3vw,36px)}
.kt-head h2{margin:0 0 12px}
.kt-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА · телефонът е първи
   ══════════════════════════════════════════════════════════ */
/*
 * ПОЛОВИНАТА ХОРА ВЛИЗАТ САМО ЗА ТЕЛЕФОНА.
 *
 * Затова той е първото нещо на екрана — едър, натискаем, без да се
 * търси.
 */
.kt-hero{
  background:var(--navy);color:#fff;
  padding:clamp(36px,5vw,58px) 0 clamp(32px,4.5vw,50px);
}

.kt-hero h1{color:#fff;margin:0 0 12px}

.kt-hero > .wrap-w > p{
  color:rgba(255,255,255,.72);font-size:clamp(15px,1.7vw,16.5px);
  margin:0 0 30px;max-width:560px;line-height:1.65;
}

.kt-big{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.kt-big-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg, 16px);padding:22px;
  text-decoration:none;color:inherit;
  display:flex;flex-direction:column;
  transition:background .15s,border-color .15s;
}
.kt-big-i:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22)}

.kt-big-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}

.kt-big-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(255,255,255,.1);color:#fff;
}
.kt-big-ic svg{width:16px;height:16px}

.kt-big-top b{
  font:700 11.5px/1 var(--sans);letter-spacing:.05em;text-transform:uppercase;
  color:rgba(255,255,255,.55);
}

/* Самото число е главното: чете се отдалеч. */
.kt-big-v{
  font:800 clamp(1.15rem,2.2vw,1.5rem)/1.15 var(--mono);
  letter-spacing:-.02em;color:#fff;margin-bottom:8px;word-break:break-word;
}

.kt-big-w{
  font-size:12.5px;color:rgba(255,255,255,.5);line-height:1.5;margin-top:auto;
}

/* Живото състояние: казва повече от „24/7 поддръжка“. */
.kt-now{
  display:inline-flex;align-items:center;gap:10px;
  margin-top:22px;padding:11px 18px;border-radius:99px;
  background:rgba(18,122,85,.2);border:1px solid rgba(111,217,172,.3);
  font-size:13px;color:#6FD9AC;
}

.kt-now-dot{
  width:8px;height:8px;border-radius:50%;background:#6FD9AC;flex:0 0 auto;
  box-shadow:0 0 0 4px rgba(111,217,172,.2);
}
.kt-now b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ФОРМАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ГЛАВНОТО НА СТРАНИЦАТА: човек влиза в „Контакти“, за да напише нещо
 * НА МЯСТО — не за да отваря пощата си.
 */
.kt-form-wrap{
  display:grid;grid-template-columns:1.25fr 1fr;
  gap:clamp(24px,3.5vw,44px);align-items:start;
}

.kt-form{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

/* Капанът за машини: човек не го вижда, четците го прескачат. */
.kt-trap{
  position:absolute;left:-9999px;width:1px;height:1px;
  opacity:0;pointer-events:none;
}

.kt-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
.kt-one{margin-bottom:16px}

.kt-l{
  display:block;font:600 12.5px/1 var(--sans);color:var(--ink-soft);
  margin-bottom:7px;
}
.kt-l em{font-style:normal;color:var(--steel-lt);font-weight:400}

.kt-in,
.kt-sel,
.kt-ta{
  width:100%;padding:12px 14px;border-radius:var(--r, 10px);
  border:1px solid var(--line);background:var(--paper);
  font:400 14.5px/1.4 var(--sans);color:var(--ink);
  transition:border-color .15s,box-shadow .15s;
}

.kt-in:focus,
.kt-sel:focus,
.kt-ta:focus{
  outline:none;border-color:var(--rose);
  box-shadow:0 0 0 3px rgba(192,51,92,.12);
}

.kt-ta{min-height:130px;resize:vertical;line-height:1.6}

.kt-sel{
  appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2356677F' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
  background-size:18px;padding-right:40px;
}

/*
 * ПОЛЕТО, КОЕТО СЕ ПОЯВЯВА според темата.
 *
 * Пунктираният ръб казва, че не е винаги там.
 */
.kt-extra{
  padding:16px;border-radius:var(--r, 10px);margin-bottom:16px;
  background:var(--wash);border:1px dashed var(--line-2, #C7D1DD);
}
.kt-extra[hidden]{display:none}

.kt-extra-h{
  display:flex;align-items:center;gap:8px;margin-bottom:12px;
  font:600 11.5px/1 var(--sans);color:var(--steel);
}
.kt-extra-h svg{width:13px;height:13px;flex:0 0 auto}

.kt-hint{margin:7px 0 0;font-size:12px;color:var(--steel-lt);line-height:1.5}

.kt-check{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  margin-bottom:20px;font-size:12.5px;color:var(--steel);line-height:1.55;
  cursor:pointer;
}
.kt-check input{
  width:18px;height:18px;margin:2px 0 0;accent-color:var(--rose);cursor:pointer;
}
.kt-check a{color:var(--rose);font-weight:600}

.kt-go{display:flex;align-items:center;gap:16px;flex-wrap:wrap}

.kt-note{font-size:12.5px;color:var(--steel-lt);line-height:1.5}
.kt-note b{color:var(--ink-soft);font-weight:600}

/*
 * СЪОБЩЕНИЕТО СЛЕД ИЗПРАЩАНЕ.
 *
 * Прави се от кода, затова тук е само видът.
 */
.kt-said{
  padding:14px 16px;border-radius:var(--r, 10px);margin-bottom:16px;
  font-size:13.5px;line-height:1.6;font-weight:600;
}
.kt-said.is-ok{
  background:#E7F5EF;border:1px solid rgba(18,122,85,.24);
  color:var(--up, #127A55);
}
.kt-said.is-bad{
  background:#FDF0EE;border:1px solid rgba(176,52,44,.24);
  color:var(--down, #B0342C);
}

/* ══════════════════════════════════════════════════════════
   ОТСТРАНИ
   ══════════════════════════════════════════════════════════ */
.kt-aside{display:grid;gap:14px}

.kt-card{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

/* Спешното: то не бива да се търси в списък. */
.kt-card.urgent{border-color:rgba(176,52,44,.3);background:#FDF0EE}

.kt-card-h{display:flex;align-items:center;gap:11px;margin-bottom:14px}

.kt-card-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.kt-card.urgent .kt-card-ic{background:rgba(176,52,44,.14);color:var(--down, #B0342C)}
.kt-card.blue .kt-card-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.kt-card-ic svg{width:16px;height:16px}

.kt-card-h b{font:700 14.5px/1.3 var(--sans)}
.kt-card.urgent .kt-card-h b{color:var(--down, #B0342C)}

.kt-card p{margin:0 0 14px;font-size:13px;color:var(--steel);line-height:1.6}
.kt-card.urgent p{color:var(--ink-soft)}
.kt-card p:last-child{margin-bottom:0}

.kt-card .btn{width:100%}

/* Работното време: ясен блок, не изречение в текста. */
.kt-hours{display:grid;gap:9px}

.kt-hours-r{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:9px 12px;border-radius:8px;background:var(--wash);
  font-size:12.5px;
}
.kt-hours-r span{color:var(--ink-soft)}
.kt-hours-r b{font:700 12px/1 var(--mono);color:var(--ink);white-space:nowrap}

/* Денонощното е зелено: то е най-търсеното. */
.kt-hours-r.all{background:#E7F5EF}
.kt-hours-r.all b{color:var(--up, #127A55)}

/* ══════════════════════════════════════════════════════════
   АДРЕСЪТ И КАРТАТА
   ══════════════════════════════════════════════════════════ */
.kt-place{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.kt-place-in{display:grid;grid-template-columns:1fr 1fr}

.kt-place-t{padding:clamp(24px,3.5vw,32px)}
.kt-place-t h3{margin:0 0 14px}

.kt-addr{display:grid;gap:14px;margin-bottom:20px}

.kt-addr-r{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.kt-addr-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.kt-addr-ic svg{width:15px;height:15px}

.kt-addr-r b{
  display:block;font:600 12px/1 var(--sans);color:var(--steel-lt);margin-bottom:5px;
}
.kt-addr-r span span{font-size:13.5px;color:var(--ink);line-height:1.55}
.kt-addr-r a{
  color:var(--ink);text-decoration:none;
  border-bottom:1px solid var(--line-2, #C7D1DD);
}
.kt-addr-r a:hover{border-color:var(--rose)}

/* „Обади се, преди да дойдеш“: казва се право. */
.kt-place-say{
  padding:13px 15px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.2);
  font-size:12.5px;color:var(--warn, #9A6A12);line-height:1.6;
}
.kt-place-say b{font-weight:700}

/*
 * РИСУВАНА КАРТА.
 *
 * Истинската иска чужд скрипт, забавя страницата и следи посетителите.
 * Бутонът отваря истинските карти, ако някой наистина тръгва.
 */
.kt-map{
  background:var(--navy);position:relative;min-height:300px;
  display:grid;place-items:center;overflow:hidden;
}

.kt-map-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:34px 34px;
}

.kt-map-road{position:absolute;background:rgba(255,255,255,.07)}
.kt-map-road.r1{left:0;right:0;top:40%;height:12px}
.kt-map-road.r2{left:0;right:0;top:70%;height:7px}
.kt-map-road.r3{top:0;bottom:0;left:32%;width:9px}
.kt-map-road.r4{top:0;bottom:0;left:74%;width:6px}

.kt-map-pin{position:relative;z-index:2;text-align:center;padding:0 16px}

.kt-map-dot{
  width:22px;height:22px;border-radius:50%;margin:0 auto 12px;
  background:var(--rose);
  box-shadow:0 0 0 8px rgba(192,51,92,.24), 0 0 0 18px rgba(192,51,92,.1);
}

.kt-map-name{font:700 13px/1 var(--sans);color:#fff;margin-bottom:5px}
.kt-map-city{font:400 11.5px/1.4 var(--mono);color:rgba(255,255,255,.5)}

.kt-map-go{position:absolute;bottom:16px;left:16px;right:16px;z-index:2}
.kt-map-go .btn{width:100%}

/* ══════════════════════════════════════════════════════════
   ДАННИ ЗА ФАКТУРИ
   ══════════════════════════════════════════════════════════ */
.kt-firm{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.kt-firm-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}

.kt-firm-h{display:flex;align-items:center;gap:11px;margin-bottom:18px}

.kt-firm-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.kt-firm-ic svg{width:16px;height:16px}

.kt-firm-h b{font:700 14.5px/1.3 var(--sans)}

.kt-firm-l{display:grid;gap:11px}

.kt-firm-r{display:grid;grid-template-columns:118px 1fr;gap:14px;font-size:13.5px}
.kt-firm-r > span:first-child{color:var(--steel-lt)}
.kt-firm-r > span:last-child{color:var(--ink);font-weight:600;line-height:1.5}
.kt-firm-r .mono{font-family:var(--mono);font-size:13px;word-break:break-all}

.kt-firm-note{
  margin-top:18px;padding:13px 15px;border-radius:var(--r, 10px);
  background:var(--wash);font-size:12.5px;color:var(--steel);line-height:1.6;
}
.kt-firm-note b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.kt-faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.kt-faq-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px 22px;
}

.kt-faq-i h3{font:700 14.5px/1.4 var(--sans);margin:0 0 9px;color:var(--ink)}
.kt-faq-i p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.65}
.kt-faq-i b{color:var(--ink);font-weight:700}

/* ── по екрани ── */
@media (max-width:1000px){
  .kt-big{grid-template-columns:1fr}
  .kt-form-wrap{grid-template-columns:1fr}
  .kt-place-in{grid-template-columns:1fr}
  .kt-firm{grid-template-columns:1fr}
  .kt-faq{grid-template-columns:1fr}
  .kt-map{min-height:220px}
}

@media (max-width:620px){
  .kt-row{grid-template-columns:1fr}
  .kt-firm-r{grid-template-columns:1fr;gap:2px}

  /* Бутонът заема реда: пръстът иска голяма мишена. */
  .kt-go{flex-direction:column;align-items:stretch}
  .kt-go .btn{width:100%}
}

/* ==== kontakti: край ==== */

/* ==== za-nas: начало ==== */

/* ══════════════════════════════════════════════════════════
   ЗА НАС
   ══════════════════════════════════════════════════════════ */

.zn-head{max-width:680px;margin:0 0 clamp(26px,3.5vw,40px)}
.zn-head h2{margin:0 0 12px}
.zn-head p{margin:0;color:var(--steel);font-size:15.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.zn-hero{
  background:var(--navy);color:#fff;
  padding:clamp(40px,6vw,72px) 0 clamp(36px,5vw,58px);
}

/* Заглавието е изречение, не дума — затова има място за дишане. */
.zn-hero h1{color:#fff;max-width:720px;margin:0 0 14px}

.zn-hero > .wrap-w > p{
  color:rgba(255,255,255,.74);font-size:clamp(15.5px,1.9vw,18px);
  margin:0 0 32px;max-width:620px;line-height:1.6;
}

/*
 * ЧИСЛАТА СЕ ПРОВЕРЯВАТ, за разлика от „водещ доставчик“.
 *
 * Затова са преди всякакъв разказ.
 */
.zn-nums{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.zn-num{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.zn-num b{
  display:block;font:800 clamp(1.5rem,3vw,2rem)/1 var(--mono);
  letter-spacing:-.035em;color:#fff;margin-bottom:8px;
}
.zn-num span{
  display:block;font-size:12.5px;color:rgba(255,255,255,.55);line-height:1.45;
}

/* ══════════════════════════════════════════════════════════
   ГРЕШКАТА
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-ЦЕННОТО НА СТРАНИЦАТА.
 *
 * Всеки пише какво прави добре; никой не пише какво е счупил — а точно
 * това се проверява.
 *
 * Червеният ръб отляво: разказът е за нещо лошо и не се маскира.
 */
.zn-oops{
  background:var(--paper);border:1px solid var(--line);
  border-left:4px solid var(--down, #B0342C);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.zn-oops-h{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:18px 24px;background:#FDF0EE;
  border-bottom:1px solid rgba(176,52,44,.2);flex-wrap:wrap;
}

.zn-oops-h b{font:700 15px/1.3 var(--sans);color:var(--down, #B0342C)}
.zn-oops-h span{
  font:700 11.5px/1 var(--mono);color:var(--down, #B0342C);opacity:.7;
}

.zn-oops-b{padding:clamp(22px,3vw,28px)}

.zn-oops-b p{margin:0 0 14px;font-size:14.5px;line-height:1.7;color:var(--ink-soft)}
.zn-oops-b p:last-child{margin-bottom:0}
.zn-oops-b b{color:var(--ink);font-weight:700}

/* Какво се промени: без него разказът е оправдание. */
.zn-oops-after{
  margin-top:22px;padding:18px 20px;border-radius:var(--r-lg, 16px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
}

.zn-oops-after b{
  display:block;font:700 14px/1.35 var(--sans);
  color:var(--up, #127A55);margin-bottom:10px;
}

.zn-oops-l{list-style:none;padding:0;margin:0;display:grid;gap:9px}

.zn-oops-l li{
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;
  font-size:13.5px;line-height:1.6;color:var(--ink-soft);
}
.zn-oops-l i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--up, #127A55);
}

/* ══════════════════════════════════════════════════════════
   ХОРАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ХОРА С ИМЕНА, не снимки от чужд склад.
 *
 * ИНИЦИАЛИТЕ СА НАРОЧНИ: по-честно от купена снимка на непознат.
 */
.zn-crew{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.zn-crew-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;text-align:center;
}

.zn-crew-av{
  width:64px;height:64px;border-radius:50%;margin:0 auto 14px;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;
  font:700 20px/1 var(--sans);letter-spacing:-.02em;
}

/* Различен цвят за всеки: инициалите иначе се сливат. */
.zn-crew-i:nth-child(2) .zn-crew-av{background:var(--rose)}
.zn-crew-i:nth-child(3) .zn-crew-av{background:var(--blue, #1C5FA8)}
.zn-crew-i:nth-child(4) .zn-crew-av{background:var(--up, #127A55)}

.zn-crew-i b{display:block;font:700 15px/1.3 var(--sans);margin-bottom:5px}

.zn-crew-role{
  display:block;font-size:12.5px;color:var(--steel);line-height:1.5;
  margin-bottom:12px;
}

.zn-crew-since{
  display:inline-block;padding:4px 10px;border-radius:99px;
  background:var(--wash);font:700 11px/1 var(--mono);color:var(--steel-lt);
}

.zn-crew-note{
  margin:22px auto 0;font-size:13.5px;color:var(--steel);line-height:1.65;
  text-align:center;max-width:620px;
}
.zn-crew-note b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   СЪРВЪРИТЕ
   ══════════════════════════════════════════════════════════ */
.zn-dc{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,36px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,44px);
  align-items:center;
}

.zn-dc h2{color:#fff;margin:0 0 12px}
.zn-dc > div > p{
  margin:0 0 20px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
}

.zn-dc-l{display:grid;gap:12px}

.zn-dc-r{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  font-size:13.5px;color:rgba(255,255,255,.75);line-height:1.55;
}
.zn-dc-r i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:#6FD9AC;
}
.zn-dc-r b{color:#fff;font-weight:700}

/* Пингът: числото прави „близо“ проверимо. */
.zn-ping{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.zn-ping-h{
  font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:16px;
}

.zn-ping-r{
  display:flex;align-items:center;gap:12px;
  padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08);
  font-size:13px;
}
.zn-ping-r:last-of-type{border-bottom:0}

.zn-ping-city{flex:1;color:rgba(255,255,255,.72)}

.zn-ping-bar{
  width:90px;height:6px;border-radius:99px;
  background:rgba(255,255,255,.1);overflow:hidden;flex:0 0 auto;
}
.zn-ping-fill{height:100%;border-radius:99px;background:#6FD9AC;display:block}

/* Чуждият град е сив: той е за сравнение, не за хвалба. */
.zn-ping-fill.far{background:rgba(255,255,255,.3)}

.zn-ping-ms{
  font:700 12px/1 var(--mono);color:#fff;min-width:44px;text-align:right;
  flex:0 0 auto;
}

.zn-ping-note{
  margin:16px 0 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);
  font-size:11.5px;color:rgba(255,255,255,.45);line-height:1.55;
}

/* ══════════════════════════════════════════════════════════
   ПАРИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * СТРАНЕН РАЗДЕЛ ЗА ТАКАВА СТРАНИЦА — и точно затова работи.
 *
 * Обяснява защо не сме най-евтините, преди човекът да го открие сам.
 */
.zn-money{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.zn-money-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:24px;
}

/* Пунктираният ръб: това е нещо, което НЕ правим. */
.zn-money-i.no{background:var(--wash);border-style:dashed}

.zn-money-h{display:flex;align-items:center;gap:11px;margin-bottom:14px}

.zn-money-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#E7F5EF;color:var(--up, #127A55);
}
.zn-money-i.no .zn-money-ic{
  background:var(--wash-2, #EDF1F6);color:var(--steel-lt);
}
.zn-money-ic svg{width:17px;height:17px}

.zn-money-h b{font:700 14.5px/1.3 var(--sans)}
.zn-money-i.no .zn-money-h b{color:var(--steel)}

.zn-money-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.65}
.zn-money-i.no p{color:var(--steel-lt)}

/* Изводът е на тъмно: той е най-важното изречение на раздела. */
.zn-money-end{
  margin:22px 0 0;padding:18px 20px;border-radius:var(--r-lg, 16px);
  background:var(--navy);color:rgba(255,255,255,.8);
  font-size:14px;line-height:1.7;
}
.zn-money-end b{color:#fff;font-weight:700}

/* ══════════════════════════════════════════════════════════
   ЗА КОГО НЕ СМЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЧЕСТНОТО ОТКАЗВАНЕ.
 *
 * Страница, която казва „не сме за теб“, звучи по-достоверно и когато
 * казва обратното.
 */
.zn-notfor{
  background:#FBF4E4;border:1px solid rgba(154,106,18,.24);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
}

.zn-notfor-h{display:flex;align-items:center;gap:12px;margin-bottom:18px}

.zn-notfor-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(154,106,18,.16);color:var(--warn, #9A6A12);
}
.zn-notfor-ic svg{width:17px;height:17px}

.zn-notfor-h b{font:700 15.5px/1.3 var(--sans);color:var(--warn, #9A6A12)}

.zn-notfor-l{display:grid;gap:16px}

.zn-notfor-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.zn-notfor-i > i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--warn, #9A6A12);
}

.zn-notfor-i b{
  display:block;font:700 13.5px/1.35 var(--sans);
  color:var(--warn, #9A6A12);margin-bottom:4px;
}
.zn-notfor-i p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ПЪТЯТ
   ══════════════════════════════════════════════════════════ */
/*
 * КРАТЪК И С ДАТИ: дългите разкази не се четат, пет реда с години се
 * четат.
 */
.zn-road{display:grid;gap:0}

.zn-road-r{
  display:grid;grid-template-columns:auto auto 1fr;gap:16px;
  align-items:start;padding-bottom:22px;position:relative;
}
.zn-road-r:last-child{padding-bottom:0}

/* Черта между годините: тя казва, че вървят по ред. */
.zn-road-r:not(:last-child)::before{
  content:'';position:absolute;left:56px;top:24px;bottom:2px;
  width:2px;background:var(--line);
}

.zn-road-y{
  font:800 14px/1 var(--mono);color:var(--steel-lt);
  padding-top:4px;min-width:42px;
}

.zn-road-d{
  width:14px;height:14px;border-radius:50%;flex:0 0 auto;margin-top:3px;
  display:grid;place-items:center;z-index:1;background:var(--wash-2, #EDF1F6);
}
.zn-road-d i{width:6px;height:6px;border-radius:50%;background:var(--steel-lt)}

/* „Днес“ е с друг цвят: то е краят на пътя. */
.zn-road-r.now .zn-road-d{background:#FDF1F4}
.zn-road-r.now .zn-road-d i{background:var(--rose)}

.zn-road-t b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:4px}
.zn-road-t span{font-size:13px;color:var(--steel);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   ФИРМАТА
   ══════════════════════════════════════════════════════════ */
.zn-firm{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,28px);
}

.zn-firm-h{display:flex;align-items:center;gap:11px;margin-bottom:18px}

.zn-firm-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.zn-firm-ic svg{width:16px;height:16px}

.zn-firm-h b{font:700 14.5px/1.3 var(--sans)}

.zn-firm-g{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.zn-firm-r{padding:14px 16px;border-radius:var(--r, 10px);background:var(--wash)}

.zn-firm-r span{
  display:block;font:600 11.5px/1 var(--sans);color:var(--steel-lt);
  margin-bottom:6px;
}
.zn-firm-r b{font:700 13.5px/1.4 var(--sans);color:var(--ink)}
.zn-firm-r b.mono{font-family:var(--mono);font-size:13px;word-break:break-all}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.zn-cta{background:var(--navy);color:#fff;padding:clamp(40px,5vw,60px) 0}

.zn-cta-in{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  justify-content:space-between;
}

.zn-cta h2{color:#fff;margin:0 0 8px}
.zn-cta p{margin:0;color:rgba(255,255,255,.7);font-size:14.5px;max-width:460px}

.zn-cta-go{display:flex;gap:11px;flex-wrap:wrap}

.zn-cta-ghost{background:transparent;border-color:rgba(255,255,255,.24);color:#fff}
.zn-cta-ghost:hover{background:rgba(255,255,255,.09)}

/* ── по екрани ── */
@media (max-width:1100px){
  .zn-nums{grid-template-columns:1fr 1fr}
  .zn-crew{grid-template-columns:1fr 1fr}
  .zn-firm-g{grid-template-columns:1fr 1fr}
}

@media (max-width:1000px){
  .zn-dc{grid-template-columns:1fr}
  .zn-money{grid-template-columns:1fr}
}

@media (max-width:620px){
  .zn-nums{grid-template-columns:1fr}
  .zn-crew{grid-template-columns:1fr}
  .zn-firm-g{grid-template-columns:1fr}
  .zn-cta-go{width:100%}
  .zn-cta-go .btn{flex:1}

  /* Годините остават, точките отпадат. */
  .zn-road-r{grid-template-columns:auto 1fr}
  .zn-road-d{display:none}
  .zn-road-r::before{display:none}

  /* Лентата отпада: числото стига. */
  .zn-ping-bar{display:none}
}

/* ==== za-nas: край ==== */

/* ==== baza-znaniya: начало ==== */

/* ══════════════════════════════════════════════════════════
   БАЗА ЗНАНИЯ
   ══════════════════════════════════════════════════════════ */

.kb-head{max-width:660px;margin:0 0 clamp(22px,3vw,32px)}
.kb-head h2{margin:0 0 10px}
.kb-head p{margin:0;color:var(--steel);font-size:15px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА · търсенето
   ══════════════════════════════════════════════════════════ */
/*
 * ХОРАТА ВЛИЗАТ ТУК НАСРЕД ПРОБЛЕМ, вече подразнени.
 *
 * Не идват да разглеждат рубрики — идват с въпрос. Затова полето е
 * първото и е едро, а не малко квадратче в ъгъла.
 */
.kb-hero{
  background:var(--navy);color:#fff;
  padding:clamp(38px,5vw,60px) 0 clamp(32px,4vw,44px);
}

.kb-hero h1{color:#fff;margin:0 0 12px}

.kb-hero > .wrap-n > p{
  color:rgba(255,255,255,.7);font-size:15.5px;margin:0 0 26px;line-height:1.6;
}

.kb-find{position:relative}

.kb-find-in{
  width:100%;padding:18px 46px 18px 54px;border-radius:var(--r-lg, 16px);
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);
  font:400 16px/1.4 var(--sans);color:#fff;
  transition:border-color .15s,background .15s;
}
.kb-find-in::placeholder{color:rgba(255,255,255,.45)}
.kb-find-in:focus{
  outline:none;border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.12);
}

/* Кръстчето на браузъра се маха: имаме си свое. */
.kb-find-in::-webkit-search-cancel-button{-webkit-appearance:none}

.kb-find-ic{
  position:absolute;left:20px;top:50%;transform:translateY(-50%);
  width:20px;height:20px;color:rgba(255,255,255,.5);pointer-events:none;
}
.kb-find-ic svg{width:20px;height:20px;stroke-width:2}

.kb-find-x{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  width:28px;height:28px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(255,255,255,.14);color:#fff;
  font:400 20px/1 var(--sans);
  display:grid;place-items:center;
}
.kb-find-x:hover{background:rgba(255,255,255,.22)}
.kb-find-x[hidden]{display:none}

/* Броят намерени: показва се само при търсене. */
.kb-count{
  margin-top:14px;font:600 13px/1 var(--sans);color:rgba(255,255,255,.55);
}
.kb-count[hidden]{display:none}

/* ══════════════════════════════════════════════════════════
   РУБРИКИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ПРАЗНА РУБРИКА НЕ СЕ ПОКАЗВА: по-добре пет истински, отколкото десет,
 * от които половината водят доникъде.
 */
.kb-chips{
  display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px;
}

.kb-chip{
  display:inline-flex;align-items:center;gap:7px;
  padding:9px 14px;border-radius:99px;cursor:pointer;
  border:1px solid var(--line);background:var(--paper);
  font:600 13px/1 var(--sans);color:var(--ink-soft);
  transition:border-color .15s,background .15s;
}
.kb-chip:hover{border-color:var(--steel-lt)}
.kb-chip svg{width:14px;height:14px;flex:0 0 auto}

.kb-chip b{
  font:700 11px/1 var(--mono);color:var(--steel-lt);
}

/* Избраната рубрика: тъмна, за да личи отдалеч. */
.kb-chip.is-on{
  background:var(--navy);border-color:var(--navy);color:#fff;
}
.kb-chip.is-on b{color:rgba(255,255,255,.55)}

/* ══════════════════════════════════════════════════════════
   РЕШЕНИЯТА
   ══════════════════════════════════════════════════════════ */
/*
 * СТЪПКИТЕ СА ВЪТРЕ, скрити: човек отваря решението и чете, без да
 * зарежда нова страница.
 *
 * При проблем всяко зареждане е загубено време.
 */
.kb-items{display:grid;gap:10px}

.kb-item{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  transition:border-color .15s;
}
.kb-item[hidden]{display:none}
.kb-item:hover{border-color:var(--steel-lt)}
.kb-item[open]{border-color:var(--rose)}

.kb-q{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;
  align-items:center;padding:18px 20px;cursor:pointer;
  list-style:none;
}

/* Стрелката на браузъра се маха: имаме си своя. */
.kb-q::-webkit-details-marker{display:none}
.kb-q::marker{content:''}

.kb-q-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.kb-item[open] .kb-q-ic{background:#FDF1F4;color:var(--rose)}
.kb-q-ic svg{width:16px;height:16px}

.kb-q-t{min-width:0}

.kb-q-t b{
  display:block;font:700 15px/1.4 var(--sans);margin-bottom:4px;
  letter-spacing:-.01em;
}
.kb-q-t span{
  display:block;font-size:13px;color:var(--steel);line-height:1.5;
}

.kb-q-min{
  display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;
  font:600 11.5px/1 var(--mono);color:var(--steel-lt);white-space:nowrap;
}
.kb-q-min svg{width:12px;height:12px}

/* Стрелката се върти при отваряне — знак, че има повече. */
.kb-q-arr{
  width:22px;height:22px;flex:0 0 auto;
  display:grid;place-items:center;color:var(--steel-lt);
  transition:transform .18s;
}
.kb-q-arr svg{width:16px;height:16px}
.kb-item[open] .kb-q-arr{transform:rotate(180deg);color:var(--rose)}

/* ── отговорът ── */
.kb-a{
  padding:4px 20px 20px 68px;
  border-top:1px solid var(--line);margin-top:-1px;padding-top:18px;
}

.kb-step{
  display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;
  margin-bottom:14px;font-size:14px;line-height:1.65;color:var(--ink-soft);
}
.kb-step:last-child{margin-bottom:0}
.kb-step b{color:var(--ink);font-weight:700}

.kb-step-n{
  width:22px;height:22px;border-radius:50%;flex:0 0 auto;margin-top:2px;
  display:grid;place-items:center;
  background:var(--wash);color:var(--steel);font:700 11px/1 var(--mono);
}

/* Кодът: на тъмно, за да не се бърка с текста. */
.kb-code{
  margin:0 0 14px;padding:14px 16px;border-radius:var(--r, 10px);
  background:var(--navy-deep, #0A1D33);color:rgba(255,255,255,.82);
  font:400 12.5px/1.7 var(--mono);
  overflow-x:auto;white-space:pre;
}

/*
 * КАПАНЪТ · отбелязан нарочно.
 *
 * Точно тези места правят разликата между упътване, което работи, и
 * упътване, което не.
 */
.kb-warn{
  display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;
  margin:0 0 14px;padding:14px 16px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:13.5px;line-height:1.6;color:var(--ink-soft);
}
.kb-warn b{color:var(--warn, #9A6A12);font-weight:700}

.kb-warn-ic{
  width:20px;height:20px;flex:0 0 auto;margin-top:1px;
  color:var(--warn, #9A6A12);
}
.kb-warn-ic svg{width:18px;height:18px}

/* Как се разбира, че е станало. */
.kb-ok{
  display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;
  margin:0;padding:14px 16px;border-radius:var(--r, 10px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:13.5px;line-height:1.6;color:var(--ink-soft);
}
.kb-ok b{color:var(--up, #127A55);font-weight:700}

.kb-ok-ic{
  width:20px;height:20px;flex:0 0 auto;margin-top:1px;
  color:var(--up, #127A55);
}
.kb-ok-ic svg{width:18px;height:18px;stroke-width:2.6}

/* ── нищо не се намери ── */
.kb-none{
  padding:36px 24px;text-align:center;
  border:1px dashed var(--line-2, #C7D1DD);border-radius:var(--r-lg, 16px);
  background:var(--wash);
}
.kb-none[hidden]{display:none}

.kb-none b{display:block;font:700 16px/1.3 var(--sans);margin-bottom:8px}
.kb-none p{
  margin:0 auto 16px;font-size:13.5px;color:var(--steel);line-height:1.6;
  max-width:420px;
}

/* ══════════════════════════════════════════════════════════
   НЕ НАМЕРИ ЛИ
   ══════════════════════════════════════════════════════════ */
/*
 * ИЗХОДЪТ КЪМ ЧОВЕК.
 *
 * Който е стигнал дотук, вече е търсил и не е намерил. Не бива да се
 * връща в началото — трябва му път навън.
 */
.kb-miss{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(24px,3.5vw,34px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(24px,3.5vw,40px);
  align-items:center;
}

.kb-miss h2{color:#fff;margin:0 0 10px}
.kb-miss p{
  margin:0 0 18px;font-size:14.5px;color:rgba(255,255,255,.72);
  line-height:1.65;max-width:540px;
}

.kb-miss-l{display:grid;gap:10px}

.kb-miss-r{
  display:flex;align-items:center;gap:11px;
  font-size:13px;color:rgba(255,255,255,.72);
}
.kb-miss-r i{
  width:17px;height:17px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.28);color:#6FD9AC;
}
.kb-miss-r svg{width:9px;height:9px;stroke-width:3.4}

.kb-miss-go{flex:0 0 auto;display:grid;gap:10px}

.kb-miss-ghost{
  background:transparent;border-color:rgba(255,255,255,.24);color:#fff;
}
.kb-miss-ghost:hover{background:rgba(255,255,255,.09)}

/* ══════════════════════════════════════════════════════════
   КАК ПИШЕМ
   ══════════════════════════════════════════════════════════ */
.kb-how{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.kb-how-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.kb-how-ic{
  width:38px;height:38px;border-radius:11px;margin-bottom:14px;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.kb-how-ic svg{width:18px;height:18px}

.kb-how-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:7px}
.kb-how-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/* ── по екрани ── */
@media (max-width:1000px){
  .kb-how{grid-template-columns:1fr}
  .kb-miss{grid-template-columns:1fr}
}

@media (max-width:620px){
  .kb-find-in{padding:16px 42px 16px 48px;font-size:15px}
  .kb-find-ic{left:17px;width:18px;height:18px}
  .kb-find-ic svg{width:18px;height:18px}

  /* Минутите падат: заглавието е по-важно. */
  .kb-q{grid-template-columns:auto 1fr auto;gap:11px;padding:16px}
  .kb-q-min{display:none}

  /* Отговорът се прибира вляво: няма място за отстъп. */
  .kb-a{padding-left:16px;padding-right:16px}

  .kb-miss-go .btn{width:100%}
}

/* ==== baza-znaniya: край ==== */

/* ==== obshti-usloviya: начало ==== */

/* ══════════════════════════════════════════════════════════
   ОБЩИ УСЛОВИЯ
   ══════════════════════════════════════════════════════════ */

.ou-lead{
  color:var(--steel);font-size:14.5px;margin:0 0 20px;line-height:1.65;
}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.ou-hero{
  background:var(--navy);color:#fff;
  padding:clamp(34px,4.5vw,52px) 0 clamp(28px,3.5vw,40px);
}

.ou-hero h1{color:#fff;margin:0 0 12px}

.ou-hero > .wrap-n > p{
  color:rgba(255,255,255,.72);font-size:15px;margin:0 0 22px;line-height:1.65;
  max-width:600px;
}

/* Датата и версията: условия без дата не се знае кога са валидни. */
.ou-meta{display:flex;gap:20px;flex-wrap:wrap;font-size:12.5px}

.ou-meta-i{
  display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.55);
}
.ou-meta-i b{color:#fff;font-weight:700;font-family:var(--mono);font-size:12.5px}
.ou-meta-i svg{width:14px;height:14px;flex:0 0 auto;stroke-width:2}

/* ══════════════════════════════════════════════════════════
   ОБОБЩЕНИЕТО
   ══════════════════════════════════════════════════════════ */
/*
 * ВСИЧКИ ЗНАЯТ, ЧЕ НИКОЙ НЕ ЧЕТЕ ОБЩИТЕ УСЛОВИЯ.
 *
 * Да се преструваме на обратното е нечестно. По-добре се признава и се
 * дава кратко обобщение — а долу стои и пълният текст.
 */
.ou-gist{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
  box-shadow:0 1px 2px rgba(14,39,69,.05), 0 8px 24px rgba(14,39,69,.07);
}

.ou-gist-h{
  display:flex;align-items:center;gap:12px;
  padding:18px 22px;background:#FDF1F4;
  border-bottom:1px solid rgba(192,51,92,.16);
}

.ou-gist-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(192,51,92,.14);color:var(--rose);
}
.ou-gist-ic svg{width:16px;height:16px}

.ou-gist-h b{flex:1;font:700 15px/1.3 var(--sans);color:var(--rose)}

.ou-gist-l{display:grid}

.ou-gist-r{
  display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;
  padding:18px 22px;border-bottom:1px solid var(--line);
}
.ou-gist-r:last-child{border-bottom:0}

.ou-gist-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 12px/1 var(--mono);
}

.ou-gist-t b{display:block;font:700 14.5px/1.4 var(--sans);margin-bottom:5px}
.ou-gist-t p{margin:0;font-size:13.5px;color:var(--steel);line-height:1.65}
.ou-gist-t a{color:var(--rose);font-weight:600;text-decoration:none}
.ou-gist-t a:hover{text-decoration:underline}

/* Че обобщението няма правна сила · казва се право. */
.ou-gist-say{
  padding:14px 22px;background:var(--wash);border-top:1px solid var(--line);
  font-size:12.5px;color:var(--steel);line-height:1.6;
}
.ou-gist-say b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ДОКУМЕНТЪТ
   ══════════════════════════════════════════════════════════ */
.ou-doc{
  display:grid;grid-template-columns:230px 1fr;
  gap:clamp(24px,3.5vw,48px);align-items:start;
}

/*
 * СЪДЪРЖАНИЕТО ОСТАВА НА ЕКРАНА.
 *
 * Дълъг документ без него значи безкрайно търкаляне, за да се намери
 * един раздел.
 */
.ou-toc{position:sticky;top:20px}

.ou-toc-h{
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);margin-bottom:12px;
}

.ou-toc-l{list-style:none;padding:0;margin:0;display:grid;gap:2px}

.ou-toc-l a{
  display:block;padding:8px 12px;border-radius:8px;
  font-size:13px;color:var(--ink-soft);text-decoration:none;
  border-left:2px solid transparent;
  transition:background .15s;
}
.ou-toc-l a:hover{background:var(--wash)}

/* Разделът, който се чете в момента. */
.ou-toc-l a.on{
  background:#FDF1F4;color:var(--rose);
  border-left-color:var(--rose);font-weight:600;
}

.ou-body{min-width:0}

/* ── един раздел ── */
.ou-part{
  padding-bottom:32px;margin-bottom:32px;
  border-bottom:1px solid var(--line);
  scroll-margin-top:24px;
}
.ou-part:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}

.ou-part-n{
  display:inline-block;margin-bottom:10px;
  padding:4px 10px;border-radius:99px;
  background:var(--wash);color:var(--steel-lt);
  font:700 11px/1 var(--mono);
}

.ou-part p{
  margin:0 0 14px;font-size:14.5px;line-height:1.75;color:var(--ink-soft);
}
.ou-part p:last-child{margin-bottom:0}
.ou-part b{color:var(--ink);font-weight:700}
.ou-part a{color:var(--rose);font-weight:600}

.ou-part ol,
.ou-part ul{margin:0 0 14px;padding-left:22px}
.ou-part li{
  margin-bottom:8px;font-size:14.5px;line-height:1.7;color:var(--ink-soft);
}

/*
 * ЧОВЕШКОТО ОБЯСНЕНИЕ до правния текст.
 *
 * Не заменя договора — стои до него. Така човек чете каквото му е
 * нужно, а юристът вижда, че условието си е там.
 */
.ou-plain{
  margin:0 0 16px;padding:14px 16px;border-radius:var(--r, 10px);
  background:#EAF2FB;border-left:3px solid var(--blue, #1C5FA8);
  font-size:13.5px;line-height:1.65;color:var(--ink-soft);
}
.ou-plain b{
  color:var(--blue, #1C5FA8);font-weight:700;display:block;margin-bottom:5px;
}

/*
 * ВАЖНОТО УСЛОВИЕ · чете се дори при прескачане.
 *
 * Точно там са нещата, които обикновено се крият: какво не се връща,
 * кога се спира услуга, докъде стига отговорността.
 */
.ou-mark{
  margin:0 0 16px;padding:14px 16px;border-radius:var(--r, 10px);
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  font-size:13.5px;line-height:1.65;color:var(--ink-soft);
}
.ou-mark b{color:var(--warn, #9A6A12);font-weight:700}

.ou-mark ul{margin:8px 0 0;padding-left:20px}
.ou-mark li{font-size:13.5px;margin-bottom:5px;line-height:1.6}

/*
 * ЧИСЛАТА · за раздела с обещанието.
 *
 * „43 минути“ е нарочно: 99,9% звучи безупречно, докато не се преведе
 * в минути.
 */
.ou-nums{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 16px;
}

.ou-num{
  padding:14px;border-radius:var(--r, 10px);background:var(--wash);
  text-align:center;
}
.ou-num b{
  display:block;font:800 1.25rem/1 var(--mono);letter-spacing:-.03em;
  margin-bottom:6px;color:var(--ink);
}
.ou-num span{display:block;font-size:11.5px;color:var(--steel);line-height:1.4}

/* ══════════════════════════════════════════════════════════
   ПРОМЕНИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * УСЛОВИЯ, КОИТО СЕ МЕНЯТ ТИХО, СА ПО-ЛОШИ ОТ ЛОШИ УСЛОВИЯ.
 */
.ou-hist{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.ou-hist-h{
  padding:14px 20px;background:var(--wash);border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.ou-hist-h b{font:700 13.5px/1 var(--sans)}
.ou-hist-h span{font:400 12px/1 var(--mono);color:var(--steel-lt)}

.ou-hist-r{
  display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;
  padding:16px 20px;border-bottom:1px solid var(--line);
}
.ou-hist-r:last-child{border-bottom:0}

.ou-hist-d{
  font:700 11.5px/1 var(--mono);color:var(--steel-lt);
  min-width:74px;padding-top:2px;
}

.ou-hist-t b{display:block;font:600 13.5px/1.4 var(--sans);margin-bottom:4px}
.ou-hist-t span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.ou-ask{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(22px,3vw,30px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,36px);
  align-items:center;
}

.ou-ask h2{color:#fff;margin:0 0 8px}
.ou-ask p{
  margin:0;font-size:14px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:540px;
}

.ou-ask-go{display:flex;gap:10px;flex-wrap:wrap;flex:0 0 auto}

/* ══════════════════════════════════════════════════════════
   ДРУГИТЕ ДОКУМЕНТИ
   ══════════════════════════════════════════════════════════ */
.ou-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.ou-doc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  text-decoration:none;color:inherit;
  transition:border-color .15s;
}
.ou-doc-i:hover{border-color:var(--steel-lt)}

.ou-doc-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.ou-doc-ic svg{width:16px;height:16px}

.ou-doc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.ou-doc-i span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ── по екрани ── */
@media (max-width:900px){
  .ou-doc{grid-template-columns:1fr}

  /* Съдържанието става лента отгоре. */
  .ou-toc{
    position:static;padding-bottom:20px;border-bottom:1px solid var(--line);
  }
  .ou-toc-l{
    display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;
    -webkit-overflow-scrolling:touch;
  }
  .ou-toc-l a{
    white-space:nowrap;border-left:0;border-bottom:2px solid transparent;
  }
  .ou-toc-l a.on{border-left:0;border-bottom-color:var(--rose)}

  .ou-docs{grid-template-columns:1fr}
  .ou-ask{grid-template-columns:1fr}
}

@media (max-width:620px){
  .ou-nums{grid-template-columns:1fr}
  .ou-gist-r{gap:12px;padding:16px}
  .ou-hist-r{grid-template-columns:1fr;gap:4px}
  .ou-ask-go{width:100%}
  .ou-ask-go .btn{flex:1;width:100%}
}

/* ==== obshti-usloviya: край ==== */

/* ==== poveritelnost: начало ==== */

/* ══════════════════════════════════════════════════════════
   ПОВЕРИТЕЛНОСТ
   ══════════════════════════════════════════════════════════ */

.pv-head{max-width:660px;margin:0 0 clamp(20px,2.6vw,30px)}
.pv-head h2{margin:0 0 12px}
.pv-head p{margin:0;color:var(--steel);font-size:14.5px;line-height:1.65}

.pv-lead{color:var(--steel);font-size:14.5px;margin:0 0 20px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.pv-hero{
  background:var(--navy);color:#fff;
  padding:clamp(34px,4.5vw,52px) 0 clamp(28px,3.5vw,40px);
}

.pv-hero h1{color:#fff;margin:0 0 12px}

.pv-hero > .wrap-n > p{
  color:rgba(255,255,255,.72);font-size:15px;margin:0 0 22px;line-height:1.65;
  max-width:620px;
}

.pv-meta{display:flex;gap:20px;flex-wrap:wrap;font-size:12.5px}

.pv-meta-i{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.55)}
.pv-meta-i b{color:#fff;font-weight:700;font-family:var(--mono);font-size:12.5px}
.pv-meta-i svg{width:14px;height:14px;flex:0 0 auto;stroke-width:2}

/* ══════════════════════════════════════════════════════════
   ЧЕТИРИТЕ „НЕ“
   ══════════════════════════════════════════════════════════ */
/*
 * ЧОВЕК, КОЙТО ОТВАРЯ ТАКАВА СТРАНИЦА, СЕ ПИТА ЕДНО: „ще ме продадат
 * ли“.
 *
 * Отговорът е първи, не на осмия абзац. Зелено, защото са добри вести.
 */
.pv-nots{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}

.pv-not{
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.pv-not-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;
  background:rgba(18,122,85,.14);color:var(--up, #127A55);
}
.pv-not-ic svg{width:16px;height:16px;stroke-width:2.4}

.pv-not b{
  display:block;font:700 14px/1.35 var(--sans);color:var(--up, #127A55);
  margin-bottom:6px;
}
.pv-not span{display:block;font-size:12.5px;color:var(--ink-soft);line-height:1.55}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ГЛАВНОТО НА СТРАНИЦАТА.
 *
 * Всеки ред казва четири неща наведнъж. Разказ в абзаци значи, че човек
 * трябва да събира отговора от четири места.
 */
.pv-data{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.pv-data table{
  width:100%;border-collapse:collapse;font-size:13.5px;min-width:720px;
}

.pv-data th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

.pv-data td{
  padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top;
}
.pv-data tbody tr:last-child td{border-bottom:0}
.pv-data tbody tr:hover{background:var(--wash)}

.pv-data td b{color:var(--ink);font-weight:700}
.pv-data td span{display:block;font-size:12px;color:var(--steel-lt);margin-top:3px}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.pv-data th:first-child,
.pv-data td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.pv-data th:first-child{background:var(--wash)}
.pv-data tbody tr:hover td:first-child{background:var(--wash)}

/*
 * ОСНОВАНИЕТО е етикет с цвят, не правен цитат.
 *
 * Четирите вида се различават по цвят, а под таблицата пише какво значи
 * всеки.
 */
.pv-basis{
  display:inline-block;padding:4px 9px;border-radius:99px;
  font:700 10.5px/1 var(--sans);white-space:nowrap;
}
.pv-basis.c{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.pv-basis.l{background:#FBF4E4;color:var(--warn, #9A6A12)}
.pv-basis.i{background:var(--wash);color:var(--steel)}
.pv-basis.s{background:#FDF1F4;color:var(--rose)}

/* Колко дълго: числото се чете преди думите. */
.pv-keep{font:700 12.5px/1 var(--mono);color:var(--ink);white-space:nowrap}

.pv-legend{
  display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;
  font-size:12px;color:var(--steel);
}
.pv-legend > span{display:inline-flex;align-items:center;gap:7px}

/* ══════════════════════════════════════════════════════════
   КОЙ ВИЖДА
   ══════════════════════════════════════════════════════════ */
/*
 * ПОИМЕННО, не „доверени партньори“.
 *
 * Тази дума е чиста мъгла — зад нея може да стои всеки.
 */
.pv-who{display:grid;gap:10px}

.pv-who-i{
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  padding:16px 20px;border-radius:var(--r-lg, 16px);
  background:var(--paper);border:1px solid var(--line);
}

.pv-who-ic{
  width:36px;height:36px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.pv-who-ic svg{width:17px;height:17px}

.pv-who-t b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:4px}
.pv-who-t span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* Държавата отдясно: първото, което човек проверява. */
.pv-who-where{text-align:right;flex:0 0 auto}
.pv-who-where b{
  display:block;font:700 11.5px/1 var(--mono);color:var(--ink);margin-bottom:4px;
}
.pv-who-where span{font-size:11px;color:var(--steel-lt)}

/* „Това е целият списък“ · изречение, което задължава. */
.pv-who-note{
  margin:18px 0 0;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#E7F5EF;border:1px solid rgba(18,122,85,.2);
  font-size:13.5px;color:var(--up, #127A55);line-height:1.65;
}
.pv-who-note b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ПРАВАТА
   ══════════════════════════════════════════════════════════ */
/*
 * С ДЕЙСТВИЕ, не само с цитат от закона.
 *
 * „Имате право на достъп до вашите данни“ не помага на никого. „Ето
 * бутона, с който ги теглиш“ — помага.
 */
.pv-rights{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}

.pv-right{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  display:flex;flex-direction:column;
}

.pv-right-h{display:flex;align-items:center;gap:11px;margin-bottom:10px}

.pv-right-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;background:#EAF2FB;color:var(--blue, #1C5FA8);
}
.pv-right-ic svg{width:15px;height:15px}

.pv-right-h b{font:700 14px/1.3 var(--sans)}

/* Текстът се разтяга, за да падне бутонът долу при всички. */
.pv-right p{
  margin:0 0 14px;font-size:13px;color:var(--steel);line-height:1.6;flex:1;
}

.pv-right-go{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

.pv-right-when{font:600 11.5px/1 var(--mono);color:var(--steel-lt)}

/* ══════════════════════════════════════════════════════════
   БИСКВИТКИТЕ
   ══════════════════════════════════════════════════════════ */
.pv-cook{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(22px,3vw,30px);
}

.pv-cook h2{color:#fff;margin:0 0 10px}
.pv-cook > p{
  margin:0 0 20px;font-size:14px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:560px;
}

.pv-cook-l{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px;
}

.pv-cook-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r, 10px);padding:16px;
}

.pv-cook-tag{
  display:inline-block;margin-bottom:9px;padding:4px 9px;border-radius:99px;
  font:700 10px/1 var(--sans);
}
.pv-cook-tag.need{background:rgba(18,122,85,.28);color:#6FD9AC}
.pv-cook-tag.opt{background:rgba(255,255,255,.14);color:rgba(255,255,255,.7)}

.pv-cook-i b{
  display:block;font:700 13.5px/1.3 var(--sans);color:#fff;margin-bottom:5px;
}
.pv-cook-i span{font-size:12px;color:rgba(255,255,255,.6);line-height:1.55}

.pv-cook-go{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

.pv-cook-say{font-size:12.5px;color:rgba(255,255,255,.5);line-height:1.55}

/* ══════════════════════════════════════════════════════════
   ПРИ ПРОБИВ
   ══════════════════════════════════════════════════════════ */
/*
 * ПОЧТИ НИКОЙ НЕ ГО ПИШЕ — а точно това е моментът, в който политиката
 * има значение.
 *
 * Червеният ръб: разделът е за нещо лошо и не се маскира.
 */
.pv-leak{
  background:var(--paper);border:1px solid var(--line);
  border-left:4px solid var(--down, #B0342C);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.pv-leak-h{
  display:flex;align-items:center;gap:12px;
  padding:16px 20px;background:#FDF0EE;
  border-bottom:1px solid rgba(176,52,44,.2);
}

.pv-leak-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(176,52,44,.14);color:var(--down, #B0342C);
}
.pv-leak-ic svg{width:15px;height:15px}

.pv-leak-h b{font:700 14.5px/1.3 var(--sans);color:var(--down, #B0342C)}

.pv-leak-l{padding:18px 20px;display:grid;gap:14px}

.pv-leak-r{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}

/* Срокът отляво: той е обещанието, текстът е обяснението. */
.pv-leak-t{
  font:700 11px/1 var(--mono);color:var(--down, #B0342C);
  padding:5px 10px;border-radius:99px;background:#FDF0EE;
  white-space:nowrap;min-width:74px;text-align:center;
}

.pv-leak-x{font-size:13.5px;line-height:1.6;color:var(--ink-soft)}
.pv-leak-x b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ И ЖАЛБИ
   ══════════════════════════════════════════════════════════ */
/*
 * ЖАЛБАТА КЪМ КОМИСИЯТА Е РАВНОСТОЙНА на нашия адрес, не скрита
 * накрая — затова двете колони са с еднаква ширина.
 */
.pv-ask{
  background:var(--wash-2, #EDF1F6);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,36px);
}

.pv-ask-c h3{margin:0 0 10px}
.pv-ask-c p{margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.65}
.pv-ask-c p:last-child{margin-bottom:0}
.pv-ask-c b{color:var(--ink);font-weight:700}

.pv-ask-box{
  padding:14px 16px;border-radius:var(--r, 10px);background:var(--paper);
  border:1px solid var(--line);font-size:13px;line-height:1.7;
  color:var(--ink-soft);
}
.pv-ask-box b{display:block;color:var(--ink);margin-bottom:4px;font-weight:700}
.pv-ask-box a{color:var(--rose);font-weight:600;text-decoration:none}
.pv-ask-box a:hover{text-decoration:underline}

/* ══════════════════════════════════════════════════════════
   ДЕЦА И ЧУВСТВИТЕЛНИ
   ══════════════════════════════════════════════════════════ */
.pv-care{
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  border-radius:var(--r-lg, 16px);padding:clamp(20px,2.6vw,26px);
}

.pv-care-h{display:flex;align-items:center;gap:11px;margin-bottom:14px}

.pv-care-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(154,106,18,.16);color:var(--warn, #9A6A12);
}
.pv-care-ic svg{width:16px;height:16px}

.pv-care-h b{font:700 14.5px/1.3 var(--sans);color:var(--warn, #9A6A12)}

.pv-care p{margin:0 0 12px;font-size:13.5px;color:var(--ink-soft);line-height:1.7}
.pv-care p:last-child{margin-bottom:0}
.pv-care b{color:var(--ink);font-weight:700}

/* ══════════════════════════════════════════════════════════
   ДРУГИТЕ ДОКУМЕНТИ
   ══════════════════════════════════════════════════════════ */
.pv-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.pv-doc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  text-decoration:none;color:inherit;transition:border-color .15s;
}
.pv-doc-i:hover{border-color:var(--steel-lt)}

.pv-doc-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.pv-doc-ic svg{width:16px;height:16px}

.pv-doc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.pv-doc-i span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ── по екрани ── */
@media (max-width:1000px){
  .pv-nots{grid-template-columns:1fr 1fr}
  .pv-cook-l{grid-template-columns:1fr}
  .pv-ask{grid-template-columns:1fr}
  .pv-docs{grid-template-columns:1fr}
}

@media (max-width:620px){
  .pv-nots{grid-template-columns:1fr}
  .pv-rights{grid-template-columns:1fr}

  /* Държавата пада под текста, вместо да го смачква. */
  .pv-who-i{grid-template-columns:auto 1fr}
  .pv-who-where{grid-column:2;text-align:left}

  .pv-leak-r{grid-template-columns:1fr}
  .pv-leak-t{justify-self:start}
}

/* ==== poveritelnost: край ==== */

/* ==== sla: начало ==== */

/* ══════════════════════════════════════════════════════════
   ГАРАНЦИЯ ЗА РАБОТА
   ══════════════════════════════════════════════════════════ */

.sl-head{max-width:660px;margin:0 0 clamp(20px,2.6vw,30px)}
.sl-head h2{margin:0 0 12px}
.sl-head p{margin:0;color:var(--steel);font-size:14.5px;line-height:1.65}

.sl-lead{color:var(--steel);font-size:14.5px;margin:0 0 20px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.sl-hero{
  background:var(--navy);color:#fff;
  padding:clamp(34px,4.5vw,52px) 0 clamp(30px,3.5vw,42px);
}

.sl-hero h1{color:#fff;margin:0 0 12px}

.sl-hero > .wrap-n > p{
  color:rgba(255,255,255,.72);font-size:15px;margin:0 0 26px;line-height:1.65;
  max-width:620px;
}

/*
 * ЧИСЛОТО, ПРЕВЕДЕНО В МИНУТИ.
 *
 * „99,9%“ звучи безупречно, докато не се преведе. Ако не го кажем ние,
 * човекът го смята сам и се чувства подведен.
 */
.sl-big{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.sl-big-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.sl-big-i b{
  display:block;font:800 clamp(1.4rem,2.6vw,1.8rem)/1 var(--mono);
  letter-spacing:-.035em;color:#fff;margin-bottom:8px;
}
.sl-big-i span{
  display:block;font-size:12.5px;color:rgba(255,255,255,.55);line-height:1.5;
}

/* ══════════════════════════════════════════════════════════
   КАК МЕРИМ
   ══════════════════════════════════════════════════════════ */
/*
 * ТУК СЕ КРИЕ ЦЕЛИЯТ ФОКУС НА ТАКИВА ДОКУМЕНТИ.
 *
 * Ако не се каже откъде се мери, всяко число може да се твърди. Мерене
 * от съседната стая ще покаже 100% винаги.
 */
.sl-how{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.sl-how-h{
  display:flex;align-items:center;gap:12px;
  padding:16px 20px;background:#EAF2FB;
  border-bottom:1px solid rgba(28,95,168,.16);
}

.sl-how-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(28,95,168,.14);color:var(--blue, #1C5FA8);
}
.sl-how-ic svg{width:16px;height:16px}

.sl-how-h b{font:700 15px/1.3 var(--sans);color:var(--blue, #1C5FA8)}

.sl-how-l{display:grid}

.sl-how-r{
  display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;
  padding:18px 20px;border-bottom:1px solid var(--line);
}
.sl-how-r:last-child{border-bottom:0}

.sl-how-n{
  width:26px;height:26px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--navy);color:#fff;font:700 12px/1 var(--mono);
}

.sl-how-t b{display:block;font:700 14px/1.4 var(--sans);margin-bottom:5px}
.sl-how-t p{margin:0;font-size:13.5px;color:var(--steel);line-height:1.65}

.sl-how-t code{
  font-family:var(--mono);font-size:12.5px;
  background:var(--wash);padding:2px 6px;border-radius:5px;color:var(--ink);
}

/* Точките за мерене: къде стоят. */
.sl-spots{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

.sl-spot{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 11px;border-radius:99px;
  background:var(--wash);font:600 11.5px/1 var(--sans);color:var(--ink-soft);
}
.sl-spot i{
  width:6px;height:6px;border-radius:50%;background:var(--up, #127A55);
  flex:0 0 auto;
}

/* ══════════════════════════════════════════════════════════
   СТЪЛБИЦАТА
   ══════════════════════════════════════════════════════════ */
.sl-tiers{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.sl-tiers table{
  width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px;
}

.sl-tiers th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

.sl-tiers td{
  padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:middle;
}
.sl-tiers tbody tr:last-child td{border-bottom:0}
.sl-tiers tbody tr:hover{background:var(--wash)}

.sl-tiers td.mono{font-family:var(--mono);font-size:13px}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.sl-tiers th:first-child,
.sl-tiers td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.sl-tiers th:first-child{background:var(--wash)}
.sl-tiers tbody tr:hover td:first-child{background:var(--wash)}

/*
 * ПРОЦЕНТЪТ · цветът расте с числото.
 *
 * Окото вижда тежестта, преди да прочете.
 */
.sl-pct{
  display:inline-block;padding:5px 12px;border-radius:99px;
  font:800 13px/1 var(--mono);
}
.sl-pct.p10{background:#FBF4E4;color:var(--warn, #9A6A12)}
.sl-pct.p25{background:#FBE9E4;color:#B5591E}
.sl-pct.p50{background:#FDF0EE;color:var(--down, #B0342C)}
.sl-pct.p100{
  background:#FDF0EE;color:var(--down, #B0342C);
  box-shadow:inset 0 0 0 1px rgba(176,52,44,.3);
}

/* ══════════════════════════════════════════════════════════
   СМЕТКАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ПРОЦЕНТИ ВЪРХУ НЕПОЗНАТА СУМА НЕ ЗНАЧАТ НИЩО.
 *
 * Пример с истински числа показва и колко е малко.
 */
.sl-calc{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(22px,3vw,30px);
}

.sl-calc h2{color:#fff;margin:0 0 10px}
.sl-calc > p{
  margin:0 0 22px;font-size:14px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:560px;
}

.sl-calc-box{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r, 10px);padding:20px;margin-bottom:16px;
}

.sl-calc-r{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:11px 0;font-size:13.5px;color:rgba(255,255,255,.72);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.sl-calc-r:last-of-type{border-bottom:0}
.sl-calc-r b{font:700 14px/1 var(--mono);color:#fff;white-space:nowrap}

.sl-calc-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  margin-top:14px;padding-top:14px;border-top:2px solid rgba(255,255,255,.2);
}
.sl-calc-t span{font:600 14px/1 var(--sans);color:#fff}
.sl-calc-t b{
  font:800 1.5rem/1 var(--mono);letter-spacing:-.03em;color:#000000;
}

/*
 * ПРИЗНАНИЕТО · то струва повече от още едно обещание.
 *
 * Всеки такъв документ работи така, но малцина го казват.
 */
.sl-calc-say{
  padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(154,106,18,.18);border:1px solid rgba(240,184,74,.28);
  font-size:13px;color:#F5C86B;line-height:1.65;
}
.sl-calc-say b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ИЗКЛЮЧЕНИЯТА
   ══════════════════════════════════════════════════════════ */
/*
 * ОТПРЕД, не заровени на осма страница.
 *
 * И преброени: „пет, и толкова“ е обещание само по себе си.
 */
.sl-exc{
  background:#FBF4E4;border:1px solid rgba(154,106,18,.22);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,28px);
}

.sl-exc-h{display:flex;align-items:center;gap:12px;margin-bottom:8px}

.sl-exc-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(154,106,18,.16);color:var(--warn, #9A6A12);
}
.sl-exc-ic svg{width:16px;height:16px}

.sl-exc-h b{font:700 15px/1.3 var(--sans);color:var(--warn, #9A6A12)}

.sl-exc-lead{
  margin:0 0 18px;font-size:13px;color:var(--ink-soft);line-height:1.65;
}

.sl-exc-l{display:grid;gap:14px}

.sl-exc-i{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start}

.sl-exc-i > i{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:8px;
  background:var(--warn, #9A6A12);
}

.sl-exc-i b{
  display:block;font:700 13.5px/1.35 var(--sans);
  color:var(--warn, #9A6A12);margin-bottom:4px;
}
.sl-exc-i p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.6}

/* Какво НЕ е в списъка · по-важно от самия списък. */
.sl-exc-count{
  margin-top:20px;padding-top:16px;border-top:1px solid rgba(154,106,18,.2);
  font-size:13px;color:var(--warn, #9A6A12);line-height:1.6;
}
.sl-exc-count b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ИСКАНЕТО
   ══════════════════════════════════════════════════════════ */
.sl-claim{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.sl-claim-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;
}

.sl-claim-n{
  width:30px;height:30px;border-radius:50%;margin-bottom:14px;
  display:grid;place-items:center;
  background:var(--rose);color:#fff;font:700 13px/1 var(--mono);
}

.sl-claim-i b{display:block;font:700 14.5px/1.35 var(--sans);margin-bottom:7px}
.sl-claim-i p{margin:0;font-size:13px;color:var(--steel);line-height:1.6}

/*
 * ЗАЩО НЕ Е АВТОМАТИЧНО.
 *
 * Почти никъде не е, но малцина обясняват. Тук причината е истинска и
 * проверима.
 */
.sl-claim-why{
  margin:18px 0 0;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#EAF2FB;border-left:3px solid var(--blue, #1C5FA8);
  font-size:13.5px;color:var(--ink-soft);line-height:1.65;
}
.sl-claim-why b{
  color:var(--blue, #1C5FA8);font-weight:700;display:block;margin-bottom:5px;
}

/* ══════════════════════════════════════════════════════════
   ПЛАТЕНОТО
   ══════════════════════════════════════════════════════════ */
/*
 * ГАРАНЦИЯ, ПО КОЯТО НИКОГА НЕ Е ПЛАЩАНО, е или безупречна услуга, или
 * документ, написан да не плаща.
 */
.sl-paid{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.sl-paid-h{
  padding:14px 20px;background:var(--wash);border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.sl-paid-h b{font:700 13.5px/1 var(--sans)}
.sl-paid-h span{font:400 12px/1 var(--mono);color:var(--steel-lt)}

.sl-paid-r{
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  padding:15px 20px;border-bottom:1px solid var(--line);
}
.sl-paid-r:last-child{border-bottom:0}

.sl-paid-y{font:700 13px/1 var(--mono);color:var(--steel-lt);min-width:44px}

.sl-paid-t b{display:block;font:600 13.5px/1.4 var(--sans);margin-bottom:3px}
.sl-paid-t span{font-size:12.5px;color:var(--steel);line-height:1.5}

.sl-paid-s{
  font:700 13px/1 var(--mono);color:var(--ink);white-space:nowrap;
  text-align:right;
}

/* Годината с нула: тя прави останалите верни. */
.sl-paid-s.zero{color:var(--steel-lt)}

/* ══════════════════════════════════════════════════════════
   ДОГОВОР С НЕУСТОЙКА
   ══════════════════════════════════════════════════════════ */
.sl-more{
  background:var(--wash-2, #EDF1F6);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,36px);
  align-items:center;
}

.sl-more h3{margin:0 0 8px}
.sl-more p{
  margin:0;font-size:13.5px;color:var(--steel);line-height:1.65;max-width:560px;
}

.sl-more-go{flex:0 0 auto}

/* ══════════════════════════════════════════════════════════
   ДРУГИТЕ ДОКУМЕНТИ
   ══════════════════════════════════════════════════════════ */
.sl-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.sl-doc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  text-decoration:none;color:inherit;transition:border-color .15s;
}
.sl-doc-i:hover{border-color:var(--steel-lt)}

.sl-doc-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.sl-doc-ic svg{width:16px;height:16px}

.sl-doc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.sl-doc-i span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ── по екрани ── */
@media (max-width:1000px){
  .sl-claim{grid-template-columns:1fr}
  .sl-docs{grid-template-columns:1fr}
  .sl-more{grid-template-columns:1fr}
}

@media (max-width:620px){
  .sl-big{grid-template-columns:1fr}
  .sl-how-r{gap:12px;padding:16px}

  /* Сумата пада под текста, вместо да го смачква. */
  .sl-paid-r{grid-template-columns:auto 1fr}
  .sl-paid-s{grid-column:2;text-align:left}

  .sl-more-go .btn{width:100%}
}

/* ==== sla: край ==== */

/* ==== politika-polzvane: начало ==== */

/* ══════════════════════════════════════════════════════════
   ПРАВИЛА ЗА ПОЛЗВАНЕ
   ══════════════════════════════════════════════════════════ */

.ap-head{max-width:660px;margin:0 0 clamp(20px,2.6vw,30px)}
.ap-head h2{margin:0 0 12px}
.ap-head p{margin:0;color:var(--steel);font-size:14.5px;line-height:1.65}

.ap-lead{color:var(--steel);font-size:14.5px;margin:0 0 20px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
.ap-hero{
  background:var(--navy);color:#fff;
  padding:clamp(34px,4.5vw,52px) 0 clamp(28px,3.5vw,38px);
}

.ap-hero h1{color:#fff;margin:0 0 12px}

.ap-hero > .wrap-n > p{
  color:rgba(255,255,255,.72);font-size:15px;margin:0 0 24px;line-height:1.65;
  max-width:620px;
}

/*
 * „ТАЗИ СТРАНИЦА НЕ Е ЗА ТЕБ.“
 *
 * Такива правила плашат честните хора, а нечестните и без това не ги
 * четат. Затова първото нещо е успокоение — и то е зелено.
 */
.ap-calm{
  display:flex;align-items:flex-start;gap:14px;
  padding:18px 20px;border-radius:var(--r-lg, 16px);
  background:rgb(18 122 85 / 0%);border:1px solid rgb(152 219 28);
}

.ap-calm-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgb(152 219 28);color:#ffffff;
}
.ap-calm-ic svg{width:16px;height:16px;stroke-width:2.4}

.ap-calm-t b{
  display:block;font:700 14.5px/1.35 var(--sans);color:#7cbf00;margin-bottom:5px;
}
.ap-calm-t span{
  display:block;font-size:13.5px;color:rgba(255,255,255,.75);line-height:1.65;
}

/* ══════════════════════════════════════════════════════════
   ЗАБРАНИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * СЕДЕМ НЕЩА, И ВСИЧКИТЕ ОЧЕВИДНИ.
 *
 * Дълъг списък от забрани значи, че всичко може да се окаже нарушение.
 */
.ap-stop{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}

.ap-stop-i{
  background:#FDF0EE;border:1px solid rgba(176,52,44,.2);
  border-radius:var(--r-lg, 16px);padding:20px;
}

.ap-stop-h{display:flex;align-items:center;gap:11px;margin-bottom:9px}

.ap-stop-ic{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(176,52,44,.14);color:var(--down, #B0342C);
}
.ap-stop-ic svg{width:15px;height:15px}

.ap-stop-h b{font:700 14px/1.35 var(--sans);color:var(--down, #B0342C)}

.ap-stop-i p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.6}

/* ══════════════════════════════════════════════════════════
   СИВАТА ЗОНА
   ══════════════════════════════════════════════════════════ */
/*
 * НЕЩАТА, ЗА КОИТО ХОРАТА СЕ ПРИТЕСНЯВАТ БЕЗ ПРИЧИНА.
 *
 * Почти всеки, който чете такива правила, се пита „а моето влиза ли“.
 * Зелена глава, защото отговорът обикновено е „да“.
 */
.ap-grey{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);overflow:hidden;
}

.ap-grey-h{
  display:flex;align-items:center;gap:12px;
  padding:16px 20px;background:#E7F5EF;
  border-bottom:1px solid rgba(18,122,85,.18);
}

.ap-grey-ic{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:rgba(18,122,85,.14);color:var(--up, #127A55);
}
.ap-grey-ic svg{width:16px;height:16px}

.ap-grey-h b{font:700 14.5px/1.3 var(--sans);color:var(--up, #127A55)}

.ap-grey-l{display:grid}

.ap-grey-r{
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;
  padding:15px 20px;border-bottom:1px solid var(--line);
}
.ap-grey-r:last-child{border-bottom:0}

.ap-grey-q{
  width:24px;height:24px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--wash);color:var(--steel-lt);
  font:700 12px/1 var(--mono);
}

.ap-grey-t b{display:block;font:600 13.5px/1.4 var(--sans);margin-bottom:3px}
.ap-grey-t span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* Отговорът се чете преди въпроса: той е важното. */
.ap-grey-a{
  padding:5px 12px;border-radius:99px;flex:0 0 auto;
  font:700 11px/1 var(--sans);white-space:nowrap;
}
.ap-grey-a.yes{background:#E7F5EF;color:var(--up, #127A55)}
.ap-grey-a.ask{background:#FBF4E4;color:var(--warn, #9A6A12)}

/* ══════════════════════════════════════════════════════════
   ГРАНИЦИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЧИСЛА ВМЕСТО „НЕОГРАНИЧЕНО*“.
 *
 * Звездичката е най-старият номер в бранша.
 */
.ap-lim{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);
}

.ap-lim table{
  width:100%;border-collapse:collapse;font-size:13.5px;min-width:620px;
}

.ap-lim th{
  text-align:left;padding:13px 16px;
  font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--steel-lt);background:var(--wash);
  border-bottom:1px solid var(--line);white-space:nowrap;
}

.ap-lim td{
  padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top;
}
.ap-lim tbody tr:last-child td{border-bottom:0}
.ap-lim tbody tr:hover{background:var(--wash)}

.ap-lim td b{color:var(--ink);font-weight:700}
.ap-lim td.mono{font-family:var(--mono);font-size:13px;white-space:nowrap}
.ap-lim td span{
  display:block;font-size:12px;color:var(--steel-lt);margin-top:3px;
  font-family:var(--sans);white-space:normal;
}

/* Първата колона остава при превъртане: тя казва кой е редът. */
.ap-lim th:first-child,
.ap-lim td:first-child{
  position:sticky;left:0;background:var(--paper);z-index:1;
}
.ap-lim th:first-child{background:var(--wash)}
.ap-lim tbody tr:hover td:first-child{background:var(--wash)}

/* Без това числата горе плашат. */
.ap-lim-note{
  margin:18px 0 0;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#EAF2FB;border-left:3px solid var(--blue, #1C5FA8);
  font-size:13.5px;color:var(--ink-soft);line-height:1.65;
}
.ap-lim-note b{
  color:var(--blue, #1C5FA8);font-weight:700;display:block;margin-bottom:5px;
}

/* ══════════════════════════════════════════════════════════
   ПРИ СИГНАЛ
   ══════════════════════════════════════════════════════════ */
/*
 * НАЙ-ВАЖНИЯТ РАЗДЕЛ.
 *
 * Повечето такива правила пишат „можем да прекратим незабавно по наша
 * преценка“ — изречение, което значи „когато решим“.
 *
 * Тук са стъпки със срокове.
 */
.ap-flow{display:grid;gap:0}

.ap-flow-r{
  display:grid;grid-template-columns:auto auto 1fr;gap:16px;
  align-items:start;padding-bottom:22px;position:relative;
}
.ap-flow-r:last-child{padding-bottom:0}

/* Черта между стъпките: тя казва, че вървят по ред. */
.ap-flow-r:not(:last-child)::before{
  content:'';position:absolute;left:60px;top:26px;bottom:2px;
  width:2px;background:var(--line);
}

.ap-flow-t{
  font:700 11.5px/1 var(--mono);color:var(--steel-lt);
  padding-top:6px;min-width:46px;
}

.ap-flow-d{
  width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:3px;
  display:grid;place-items:center;z-index:1;background:var(--wash-2, #EDF1F6);
}
.ap-flow-d i{width:7px;height:7px;border-radius:50%;background:var(--steel-lt)}

.ap-flow-r.start .ap-flow-d{background:#FBF4E4}
.ap-flow-r.start .ap-flow-d i{background:var(--warn, #9A6A12)}
.ap-flow-r.good .ap-flow-d{background:#E7F5EF}
.ap-flow-r.good .ap-flow-d i{background:var(--up, #127A55)}

.ap-flow-x b{display:block;font:700 14px/1.4 var(--sans);margin-bottom:4px}
.ap-flow-x p{margin:0;font-size:13.5px;color:var(--steel);line-height:1.65}

/* Изключението: то се вижда, а не се крие. */
.ap-flow-fast{
  margin-top:20px;padding:16px 18px;border-radius:var(--r-lg, 16px);
  background:#FDF0EE;border:1px solid rgba(176,52,44,.22);
}

.ap-flow-fast b{
  display:block;font:700 13.5px/1.35 var(--sans);
  color:var(--down, #B0342C);margin-bottom:8px;
}
.ap-flow-fast p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.65}

.ap-flow-fast ul{margin:8px 0 0;padding-left:20px}
.ap-flow-fast li{
  font-size:13px;color:var(--ink-soft);line-height:1.6;margin-bottom:4px;
}

.ap-fast-after{margin-top:10px !important}

/* ══════════════════════════════════════════════════════════
   ЗАЩИТАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ПРАВОТО ДА ВЪЗРАЗИШ.
 *
 * Фалшиви сигнали има постоянно. Ако няма път за защита, всеки сигнал
 * е присъда.
 */
.ap-appeal{
  background:var(--navy);color:#fff;border-radius:var(--r-lg, 16px);
  padding:clamp(22px,3vw,30px);
}

.ap-appeal h2{color:#fff;margin:0 0 10px}
.ap-appeal > p{
  margin:0 0 20px;font-size:14px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:560px;
}

.ap-appeal-l{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.ap-appeal-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r, 10px);padding:18px;
}

.ap-appeal-n{
  width:26px;height:26px;border-radius:50%;margin-bottom:12px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.14);color:#fff;font:700 12px/1 var(--mono);
}

.ap-appeal-i b{
  display:block;font:700 13.5px/1.35 var(--sans);color:#fff;margin-bottom:5px;
}
.ap-appeal-i span{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.6}

.ap-appeal-say{
  margin-top:18px;padding:14px 16px;border-radius:var(--r, 10px);
  background:rgba(18,122,85,.18);border:1px solid rgba(111,217,172,.24);
  font-size:13px;color:#6FD9AC;line-height:1.65;
}
.ap-appeal-say b{font-weight:700}

/* ══════════════════════════════════════════════════════════
   ДОКЛАДВАНЕ
   ══════════════════════════════════════════════════════════ */
.ap-rep{
  background:var(--wash-2, #EDF1F6);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:clamp(22px,3vw,30px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,36px);
  align-items:center;
}

.ap-rep h3{margin:0 0 8px}
.ap-rep p{
  margin:0 0 14px;font-size:13.5px;color:var(--steel);line-height:1.65;
  max-width:560px;
}
.ap-rep b{color:var(--ink);font-weight:700}

.ap-rep-box{
  padding:13px 15px;border-radius:var(--r, 10px);background:var(--paper);
  border:1px solid var(--line);font-size:13px;line-height:1.7;
  color:var(--ink-soft);
}
.ap-rep-box b{display:block;color:var(--ink);margin-bottom:4px}
.ap-rep-box a{color:var(--rose);font-weight:600;text-decoration:none}
.ap-rep-box a:hover{text-decoration:underline}

.ap-rep-go{flex:0 0 auto}

/* ══════════════════════════════════════════════════════════
   ДРУГИТЕ ДОКУМЕНТИ
   ══════════════════════════════════════════════════════════ */
.ap-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.ap-doc-i{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:20px;
  text-decoration:none;color:inherit;transition:border-color .15s;
}
.ap-doc-i:hover{border-color:var(--steel-lt)}

.ap-doc-ic{
  width:34px;height:34px;border-radius:10px;margin-bottom:12px;
  display:grid;place-items:center;background:var(--wash);color:var(--steel);
}
.ap-doc-ic svg{width:16px;height:16px}

.ap-doc-i b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:5px}
.ap-doc-i span{font-size:12.5px;color:var(--steel);line-height:1.55}

/* ── по екрани ── */
@media (max-width:1000px){
  .ap-stop{grid-template-columns:1fr}
  .ap-appeal-l{grid-template-columns:1fr}
  .ap-docs{grid-template-columns:1fr}
  .ap-rep{grid-template-columns:1fr}
}

@media (max-width:620px){
  /* Отговорът пада под въпроса, вместо да го смачква. */
  .ap-grey-r{grid-template-columns:auto 1fr}
  .ap-grey-a{grid-column:2;justify-self:start}

  /* Часовете остават, точките отпадат. */
  .ap-flow-r{grid-template-columns:auto 1fr}
  .ap-flow-d{display:none}
  .ap-flow-r::before{display:none}

  .ap-rep-go .btn{width:100%}
}

/* ==== politika-polzvane: край ==== */

/* ==== nov-geroy: начало ==== */

/* ══════════════════════════════════════════════════════════
   ГЕРОЙ С РИСУНКА
   ══════════════════════════════════════════════════════════ */
/*
 * РИСУВАН, НЕ СНИМКА.
 *
 * Купените снимки на сървърни зали са едни и същи навсякъде — човек ги
 * е виждал при пет конкурента, преди да стигне тук.
 */
.hero-art{
  position:relative;overflow:hidden;
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(43,127,212,.22), transparent 60%),
    radial-gradient(900px 500px at 10% 110%, rgba(192,51,92,.16), transparent 55%),
    linear-gradient(160deg, #071628 0%, var(--navy, #0B1F38) 55%, #12304F 100%);
  color:#fff;
  padding:clamp(44px,6.5vw,92px) 0 clamp(52px,7.5vw,104px);
}

/* Мрежата отзад: дълбочина, без да отвлича. */
.hero-art::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(closest-side at 50% 40%, #000 40%, transparent 100%);
  mask-image:radial-gradient(closest-side at 50% 40%, #000 40%, transparent 100%);
}

.hero-art-in{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(30px,5vw,62px);align-items:center;
}

/* Лявата половина: текстът. */
.hero-art-t{min-width:0}

.hero-art h1{
  color:#fff;margin:0 0 18px;
  font-size:clamp(2rem,4.4vw,3.2rem);line-height:1.06;letter-spacing:-.04em;
}

/* Подчертаните думи: преливка вместо плътен цвят. */
.hero-art h1 em{
  font-style:normal;white-space:nowrap;
  background:linear-gradient(120deg,#FF8FAB 0%,#FFB4A2 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
}

.hero-art .eyebrow{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:14px;
  font:700 11.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;
  color:#FF8FAB;
}
.hero-art .eyebrow::before{
  content:'';width:22px;height:2px;border-radius:2px;background:#FF8FAB;
}

.hero-art-lead{
  color:rgba(255,255,255,.76);font-size:clamp(15.5px,1.9vw,18px);
  line-height:1.62;margin:0 0 28px;max-width:520px;
}

.hero-art-go{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}

/* Числата: доверие с числа, не с думи. */
.hero-art-tr{
  display:flex;gap:26px;flex-wrap:wrap;
  padding-top:24px;border-top:1px solid rgba(255,255,255,.12);
}

.hero-fact b{
  display:block;font:800 1.35rem/1 var(--mono);letter-spacing:-.03em;
  color:#fff;margin-bottom:5px;
}
.hero-fact span{font-size:12.5px;color:rgba(255,255,255,.55);line-height:1.4}

/* ── самата рисунка ── */
.hero-art-p svg{
  width:100%;height:auto;display:block;
  filter:drop-shadow(0 24px 48px rgba(0,0,0,.34));
}

/* Пулсът по кабелите: показва, че нещо тече. */
@keyframes hr-flow{to{stroke-dashoffset:-24}}
.hr-wire{stroke-dasharray:4 8;animation:hr-flow 1.4s linear infinite}

@keyframes hr-blink{0%,100%{opacity:1}50%{opacity:.25}}
.hr-led{animation:hr-blink 2.4s ease-in-out infinite}
.hr-led-2{animation-delay:.5s}
.hr-led-3{animation-delay:1s}

/*
 * ПРИ ИЗКЛЮЧЕНО ДВИЖЕНИЕ всичко спира.
 *
 * Хора с чувствителност към движение го изключват в системата —
 * страницата трябва да го спазва.
 */
@media (prefers-reduced-motion: reduce){
  .hr-wire,
  .hr-led{animation:none}
}

/* ══════════════════════════════════════════════════════════
   ЛЕНТА С ЛОГАТА
   ══════════════════════════════════════════════════════════ */
.logo-bar{
  padding:clamp(24px,3.6vw,38px) 0;
  background:var(--paper, #fff);
  border-bottom:1px solid var(--line, #DFE6EE);
}

.logo-bar-t{
  text-align:center;margin:0 0 20px;
  font:600 12px/1 var(--sans);letter-spacing:.09em;text-transform:uppercase;
  color:var(--steel-lt, #7387A0);
}

.logo-bar-l{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(22px,4.5vw,54px);flex-wrap:wrap;
}

/*
 * СИВО, ОЦВЕТЯВА СЕ ПРИ ПОСОЧВАНЕ.
 *
 * Чуждите лога в цвят крадат вниманието от нашето. Сивото ги оставя
 * като доказателство, а не като реклама.
 */
.logo-i{
  display:inline-flex;align-items:center;gap:9px;
  opacity:.7;filter:grayscale(1);
  transition:opacity .16s, filter .16s;
}
.logo-i:hover{opacity:1;filter:grayscale(0)}

.logo-i img{width:24px;height:24px;flex:0 0 auto;object-fit:contain}

.logo-i b{
  font:700 15px/1 var(--sans);color:var(--steel-lt, #7387A0);
}
.logo-i:hover b{color:var(--ink, #0B1F38)}

/* ══════════════════════════════════════════════════════════
   ДВЕ ПОПРАВКИ В ПЛОЧКИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ЛИПСВАЩОТО С КРЪСТЧЕ.
 *
 * Досега „FTP Акаунти НЕ“ излизаше със същата зелена отметка като
 * останалите — тоест липсата изглеждаше като предимство.
 */
.plan-list li.is-no{
  color:var(--steel-lt, #7387A0);
}

.plan-list li.is-no::before{
  content:'✕';
  color:var(--line-2, #C4D0DC);
  font-weight:700;
}

/*
 * ЦЕНАТА ПРИ ПОДНОВЯВАНЕ.
 *
 * Изненадата на дванайсетия месец е първата причина хората да си
 * тръгват от хостинг. Другите я крият в общите условия.
 *
 * Пунктираната черта отгоре я отделя от цената, без да я скрива.
 */
.plan-renew{
  margin:9px 0 0;padding-top:9px;
  border-top:1px dashed var(--line-2, #C4D0DC);
  font-size:11px;line-height:1.45;color:var(--steel-lt, #7387A0);
}

/* ── по екрани ── */
@media (max-width:900px){
  .hero-art-in{grid-template-columns:1fr;gap:34px}
  .hero-art-p{max-width:500px;margin:0 auto}
}

@media (max-width:620px){
  .hero-art-go{flex-direction:column}
  .hero-art-go .btn{width:100%}
  .hero-art-tr{gap:20px}

  /* Рисунката пада: на тесен екран тя изяжда целия първи екран. */
  .hero-art-p{display:none}
}

/* ==== nov-geroy: край ==== */

/* ==== dsearch-art: начало ==== */

/* ══════════════════════════════════════════════════════════
   РИСУНКАТА ПРИ ТЪРСЕНЕ НА ДОМЕЙН
   ══════════════════════════════════════════════════════════ */
/*
 * ЗАЩО Е ТУК:
 *
 * Дотук дясната колона беше само плочки с цени — половин екран, зает
 * от шест малки правоъгълника.
 *
 * Рисунката показва КАКВО Е ДОМЕЙН: име, което сочи към машина. Това е
 * въпросът зад половината запитвания в поддръжката.
 */
.dsearch-side{
  display:grid;
  gap:20px;
  align-content:start;
  min-width:0;
}

.dsearch-art{margin:0}

.dsearch-art svg{
  width:100%;
  height:auto;
  display:block;
  max-width:400px;
  margin:0 auto;
  filter:drop-shadow(0 18px 40px rgba(0,0,0,.3));
}

/* Пулсът по кабелите: показва, че нещо тече. */
@keyframes da-flow{to{stroke-dashoffset:-20}}
.da-wire{stroke-dasharray:3 7;animation:da-flow 1.3s linear infinite}

@keyframes da-blink{0%,100%{opacity:1}50%{opacity:.35}}
.da-dot{animation:da-blink 2.6s ease-in-out infinite}
.da-dot-2{animation-delay:.6s}
.da-dot-3{animation-delay:1.2s}

/* Лентата с адреса се носи бавно: дава живот, без да отвлича. */
@keyframes da-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.da-float{animation:da-float 4s ease-in-out infinite}

/*
 * ПРИ ИЗКЛЮЧЕНО ДВИЖЕНИЕ всичко спира.
 *
 * Хора с чувствителност към движение го изключват в системата —
 * страницата трябва да го спазва.
 */
@media (prefers-reduced-motion: reduce){
  .da-wire,
  .da-dot,
  .da-float{animation:none}
}

/* ── по екрани ── */
@media (max-width:900px){
  /* Рисунката се смалява, за да не изяде екрана. */
  .dsearch-art svg{max-width:320px}
}

@media (max-width:620px){
  /*
   * Рисунката пада на тесен екран.
   *
   * Там първият екран трябва да е полето за търсене — украсата само го
   * избутва надолу.
   */
  .dsearch-art{display:none}
}

/* ==== dsearch-art: край ==== */

/* ==== tseni-domeyni: начало ==== */

/* ══════════════════════════════════════════════════════════
   ЦЕНИ НА ДОМЕЙНИ
   ══════════════════════════════════════════════════════════ */

.tc-head-s{max-width:660px;margin:0 0 clamp(24px,3.4vw,40px)}
.tc-head-s.is-mid{margin-inline:auto;text-align:center}
.tc-head-s h2{margin:0 0 12px}
.tc-head-s p{margin:0;color:var(--steel);font-size:14.5px;line-height:1.65}

/* ══════════════════════════════════════════════════════════
   ГЛАВАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ТУК НЯМА ГОЛЯМ ГЕРОЙ.
 *
 * Човек, който отваря страница с цени, вече знае какво иска — той
 * търси число, не убеждаване. Затова главата е ниска.
 */
.tc-top{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(900px 400px at 82% -20%, rgba(28,95,168,.24), transparent 62%),
    linear-gradient(156deg, #0A1D33 0%, var(--navy, #0E2745) 62%, #173654 100%);
  padding:clamp(32px,4.4vw,58px) 0 clamp(28px,3.8vw,50px);
}

.tc-top::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px);
  background-size:50px 50px;
  -webkit-mask-image:radial-gradient(closest-side at 50% 30%, #000 45%, transparent);
  mask-image:radial-gradient(closest-side at 50% 30%, #000 45%, transparent);
}

.tc-top-in{position:relative;z-index:1;max-width:760px}

.tc-top h1{
  color:#fff;margin:0 0 16px;
  font-size:clamp(1.85rem,4vw,2.9rem);line-height:1.06;letter-spacing:-.042em;
}
.tc-top h1 em{
  font-style:normal;
  background:linear-gradient(120deg,#6FD9AC 0%,#8FC0F0 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

.tc-top .eyebrow{color:#6FD9AC}
.tc-top .eyebrow::before{background:#6FD9AC}

.tc-lead{
  color:rgba(255,255,255,.74);font-size:clamp(15px,1.9vw,17px);
  line-height:1.6;margin:0 0 26px;max-width:560px;
}

/*
 * ТРИТЕ ЧИСЛА · какво значат колоните.
 *
 * Без тях таблицата отдолу иска обяснение. С тях се чете направо.
 */
.tc-cols{display:flex;gap:22px;flex-wrap:wrap}

.tc-col{display:flex;align-items:flex-start;gap:10px;max-width:236px}

.tc-col-n{
  width:24px;height:24px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);color:#fff;font:700 11px/1 var(--mono);
}

.tc-col b{display:block;font:700 13px/1.3 var(--sans);color:#fff;margin-bottom:3px}
.tc-col > span > span{font-size:12px;color:rgba(255,255,255,.56);line-height:1.5}

/* ══════════════════════════════════════════════════════════
   ЛЕНТАТА
   ══════════════════════════════════════════════════════════ */
/*
 * ЗАЛЕПЕНА ГОРЕ · при много разширения човек търка дълго, а търсенето
 * трябва да е под ръка през цялото време.
 */
.tc-bar{
  position:sticky;top:0;z-index:20;
  background:var(--paper);border-bottom:1px solid var(--line);
  padding:13px 0;box-shadow:0 2px 12px rgba(14,39,69,.05);
}

.tc-bar-in{display:flex;gap:12px;align-items:center;flex-wrap:wrap}

.tc-find{flex:1;min-width:220px;position:relative}

.tc-find input{
  width:100%;padding:11px 16px 11px 40px;border-radius:var(--r, 10px);
  border:1.5px solid var(--line);background:var(--wash);
  font:500 14px/1.3 var(--sans);color:var(--ink);
  transition:border-color .14s, background .14s;
}
.tc-find input:focus{outline:none;border-color:var(--rose);background:var(--paper)}
.tc-find input::placeholder{color:var(--steel-lt);font-weight:400}

.tc-find svg{
  position:absolute;left:14px;top:50%;transform:translateY(-50%);
  width:16px;height:16px;color:var(--steel-lt);pointer-events:none;
}

.tc-tabs{display:flex;gap:6px;flex-wrap:wrap}

.tc-tab{
  padding:9px 15px;border-radius:99px;cursor:pointer;
  border:1.5px solid var(--line);background:var(--paper);
  font:600 12.5px/1 var(--sans);color:var(--steel);
  transition:all .14s;white-space:nowrap;
}
.tc-tab:hover{border-color:var(--line-2);color:var(--ink)}
.tc-tab.is-on{background:var(--navy);border-color:var(--navy);color:#fff}

.tc-count{font:600 12.5px/1 var(--mono);color:var(--steel-lt);white-space:nowrap}

/* ══════════════════════════════════════════════════════════
   ТАБЛИЦАТА
   ══════════════════════════════════════════════════════════ */
.tc-table{
  border:1.5px solid var(--line);border-radius:var(--r-lg, 16px);
  background:var(--paper);overflow:hidden;
}

.tc-head{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr auto;
  gap:14px;align-items:center;
  padding:12px 20px;background:var(--wash);
  border-bottom:1.5px solid var(--line);
  font:700 11px/1 var(--sans);letter-spacing:.07em;text-transform:uppercase;
  color:var(--steel-lt);
}
.tc-head > span:not(:first-child){text-align:right}
.tc-head > span:last-child{width:92px}

.tc-row{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr auto;
  gap:14px;align-items:center;
  padding:14px 20px;border-bottom:1px solid var(--line);
  transition:background .12s;
}
.tc-row:last-child{border-bottom:0}
.tc-row:hover{background:var(--wash)}

/* Скритите при търсене · без това остават на мястото си. */
.tc-row[hidden]{display:none}

/* Най-търсените са отделени: те са почти всички поръчки. */
.tc-row.is-top{background:#FDF1F4}
.tc-row.is-top:hover{background:#FBE7ED}

.tc-name{display:flex;align-items:center;gap:9px;min-width:0;flex-wrap:wrap}

.tc-tld{font:800 1.05rem/1 var(--mono);letter-spacing:-.03em;color:var(--ink)}

.tc-tag{padding:3px 9px;border-radius:99px;font:700 9.5px/1.4 var(--sans);white-space:nowrap}
.tc-tag.hot{background:var(--rose);color:#fff}
.tc-tag.doc{background:#FBF4E4;color:var(--warn, #9A6A12)}

.tc-p{text-align:right;font:700 14px/1 var(--mono);white-space:nowrap}

/*
 * ЦВЕТЪТ КАЗВА ДАЛИ ЦЕНАТА СЕ МЕНИ.
 *
 * Зелено · подновяването е същото като регистрацията
 * Жълто  · по-скъпо е · това е цената на регистъра, не измама
 *
 * Без цвят човек сравнява числа с очи, ред по ред.
 */
.tc-p.same{color:var(--up, #127A55)}
.tc-p.up{color:var(--warn, #9A6A12)}

.tc-p s{
  display:block;font:400 11.5px/1 var(--mono);color:var(--steel-lt);margin-bottom:4px;
}

.tc-go{width:92px;text-align:right}

/*
 * ПРОМОЦИЯТА НА РЕГИСТЪРА · казва се чия е.
 *
 * Премълчаването ѝ е причината хората да се чувстват измамени при
 * първото подновяване.
 */
.tc-note{
  grid-column:1 / -1;margin-top:8px;
  padding:9px 12px;border-radius:8px;
  background:#FBF4E4;border-left:3px solid var(--warn, #9A6A12);
  font-size:12px;color:var(--warn, #9A6A12);line-height:1.5;
}

.tc-foot{
  padding:14px 20px;background:var(--wash);border-top:1px solid var(--line);
  font-size:12.5px;color:var(--steel);line-height:1.6;
}

.tc-foot-i{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.tc-foot-i svg{width:14px;height:14px;flex:0 0 auto;color:var(--steel-lt)}
.tc-foot b{color:var(--ink);font-weight:700}

/* Празният отговор · без него човек мисли сайта за счупен. */
.tc-none{padding:40px 0;text-align:center;font-size:14.5px;color:var(--steel)}

/* ══════════════════════════════════════════════════════════
   .BG
   ══════════════════════════════════════════════════════════ */
.tc-bgx{
  background:var(--paper);border:1.5px solid var(--line);
  border-radius:var(--r-xl, 24px);overflow:hidden;
}

.tc-bgx-h{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:clamp(20px,2.8vw,26px);background:#EAF2FB;
  border-bottom:1.5px solid rgba(28,95,168,.16);
}

.tc-flag{
  width:48px;height:34px;border-radius:8px;flex:0 0 auto;overflow:hidden;
  box-shadow:0 3px 10px rgba(14,39,69,.18);
}
.tc-flag svg{display:block;width:100%;height:100%}

.tc-bgx-h b{font:800 16.5px/1.2 var(--sans);color:var(--blue, #1C5FA8)}
.tc-bgx-h > span > span{display:block;font-size:12.5px;color:var(--steel);margin-top:4px}

.tc-bgx-l{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}

.tc-rule{background:var(--paper);padding:20px 22px}

.tc-rule-h{display:flex;align-items:center;gap:10px;margin-bottom:9px}

.tc-rule-ic{
  width:30px;height:30px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;
}
.tc-rule:nth-child(1) .tc-rule-ic{background:#E7F5EF;color:var(--up, #127A55)}
.tc-rule:nth-child(2) .tc-rule-ic{background:#FBF4E4;color:var(--warn, #9A6A12)}
.tc-rule:nth-child(3) .tc-rule-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.tc-rule:nth-child(4) .tc-rule-ic{background:#FDF1F4;color:var(--rose)}
.tc-rule-ic svg{width:15px;height:15px}

.tc-rule b{font:700 13.5px/1.3 var(--sans)}
.tc-rule p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.62}

/* ══════════════════════════════════════════════════════════
   ВКЛЮЧЕНО
   ══════════════════════════════════════════════════════════ */
.tc-incl{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}

.tc-inc{
  background:var(--paper);border:1.5px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px;transition:border-color .16s;
}
.tc-inc:hover{border-color:var(--line-2)}

.tc-inc-ic{width:44px;height:44px;border-radius:14px;margin-bottom:14px;
           display:grid;place-items:center}
.tc-inc:nth-child(1) .tc-inc-ic{background:#E7F5EF;color:var(--up, #127A55)}
.tc-inc:nth-child(2) .tc-inc-ic{background:#EAF2FB;color:var(--blue, #1C5FA8)}
.tc-inc:nth-child(3) .tc-inc-ic{background:#FDF1F4;color:var(--rose)}
.tc-inc:nth-child(4) .tc-inc-ic{background:#FBF4E4;color:var(--warn, #9A6A12)}
.tc-inc-ic svg{width:20px;height:20px}

.tc-inc b{display:block;font:700 14px/1.35 var(--sans);margin-bottom:6px}
.tc-inc p{margin:0;font-size:12.5px;color:var(--steel);line-height:1.6}

/*
 * „ДРУГАДЕ СЕ ПЛАЩА ОТДЕЛНО“.
 *
 * Иначе „скрити лични данни“ не значи нищо на човек, който не знае, че
 * това се продава.
 */
.tc-inc em{
  display:block;font-style:normal;margin-top:9px;
  font:700 11.5px/1 var(--sans);color:var(--up, #127A55);
}

/* ══════════════════════════════════════════════════════════
   НУЛИТЕ
   ══════════════════════════════════════════════════════════ */
/*
 * ТОВА, КОЕТО ДРУГАДЕ СТРУВА ПАРИ.
 *
 * По-силно от списък с включени неща: числото „0 €“ се вижда и се
 * помни, а „безплатно“ е дума, която всички ползват.
 */
.tc-zero{
  background:var(--navy);color:#fff;border-radius:var(--r-xl, 24px);
  padding:clamp(26px,3.6vw,40px);
}

.tc-zero h2{color:#fff;margin:0 0 10px}
.tc-zero > p{
  margin:0 0 26px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.65;
  max-width:540px;
}

.tc-zero-l{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

.tc-zero-i{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r, 10px);padding:20px;text-align:center;
}

.tc-zero-n{
  display:block;font:800 1.8rem/1 var(--mono);letter-spacing:-.04em;
  color:#6FD9AC;margin-bottom:8px;
}

.tc-zero-i b{display:block;font:700 13px/1.35 var(--sans);color:#fff;margin-bottom:5px}
.tc-zero-i > span:last-child{font-size:11.5px;color:rgba(255,255,255,.55);line-height:1.5}

/* ══════════════════════════════════════════════════════════
   ВЪПРОСИ
   ══════════════════════════════════════════════════════════ */
.tc-faq{display:grid;grid-template-columns:1fr 1fr;gap:13px}

.tc-q{
  background:var(--paper);border:1.5px solid var(--line);
  border-radius:var(--r-lg, 16px);padding:22px 24px 22px 54px;position:relative;
}

/* Въпросителният знак: дребна графика, която прави реда четим. */
.tc-q::before{
  content:'?';position:absolute;left:20px;top:22px;
  width:23px;height:23px;border-radius:50%;
  display:grid;place-items:center;
  background:#FDF1F4;color:var(--rose);font:800 12.5px/1 var(--sans);
}

.tc-q h3{font:700 14px/1.4 var(--sans);margin:0 0 8px}
.tc-q p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.7}
.tc-q b{font-weight:700;color:var(--ink)}

/* ══════════════════════════════════════════════════════════
   НАКРАЯ
   ══════════════════════════════════════════════════════════ */
.tc-cta{
  background:var(--wash-2, #EDF1F6);border:1.5px solid var(--line);
  border-radius:var(--r-xl, 24px);padding:clamp(24px,3.4vw,36px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,36px);
  align-items:center;
}

.tc-cta h3{margin:0 0 8px;font-size:1.15rem}
.tc-cta p{margin:0;font-size:13.5px;color:var(--steel);line-height:1.65;max-width:520px}

/* ── по екрани ── */
@media (max-width:1000px){
  .tc-incl{grid-template-columns:1fr 1fr}
  .tc-zero-l{grid-template-columns:1fr 1fr}
  .tc-bgx-l{grid-template-columns:1fr}
  .tc-faq{grid-template-columns:1fr}
  .tc-cta{grid-template-columns:1fr}
}

@media (max-width:760px){
  /*
   * ТАБЛИЦАТА СТАВА КАРТИ.
   *
   * Пет колони на телефон значи водоравно търкаляне при всеки ред — а
   * човек тогава губи от поглед кое разширение гледа.
   */
  .tc-head{display:none}

  .tc-row{grid-template-columns:1fr 1fr;gap:10px;padding:16px 18px}

  .tc-name{grid-column:1 / -1;margin-bottom:4px}

  .tc-p{
    text-align:left;display:flex;flex-direction:column;gap:3px;font-size:13.5px;
  }

  /* Надписът идва от „data-l“ · на широк екран го има в главата. */
  .tc-p::before{
    content:attr(data-l);
    font:600 10px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
    color:var(--steel-lt);
  }

  .tc-go{grid-column:1 / -1;width:100%;text-align:left;margin-top:6px}
  .tc-go .btn{width:100%}

  .tc-tabs{width:100%;overflow-x:auto;padding-bottom:2px}
}

@media (max-width:560px){
  .tc-incl{grid-template-columns:1fr}
  .tc-zero-l{grid-template-columns:1fr}
}

/* ==== tseni-domeyni: край ==== */

/* ==== terakota: начало ==== */

/* ══════════════════════════════════════════════════════════
   ТЕРАКОТА · подменя цветовете на целия сайт
   ══════════════════════════════════════════════════════════ */
/*
 * ═══ ЗАЩО ЦЕЛИЯТ САЙТ, А НЕ САМО НАЧАЛНАТА ═══
 *
 * Ако сменим само началната, тя ще е топла, а останалите четиридесет
 * страници — сини. Човек го усеща веднага, дори да не знае защо.
 *
 * КАК: подменят се СЪЩЕСТВУВАЩИТЕ променливи, не се пишат нови. Затова
 * промяната стига навсякъде наведнъж, без да се пипа нито един клас.
 *
 * ЗА ВРЪЩАНЕ: маха се този блок и всичко става както преди.
 */
:root{
  /* --- въглен с топла нотка · вместо морско синьо --- */
  --navy:#241C18;
  --navy-2:#332723;
  --navy-3:#463630;
  --navy-deep:#1A1411;

  /* --- хартия с пясъчен оттенък --- */
  --paper:#FFFFFF;
  --wash:#FBF7F3;
  --wash-2:#F4EDE6;

  --line:#E8DED5;
  --line-2:#D5C6B9;
  --line-3:#BFAB9C;

  --ink:#241C18;
  --ink-2:#4A3C35;
  --ink-3:#8B7668;

  /* --- теракота · главният акцент --- */
  --rose:#C2562F;
  --rose-2:#9E4225;
  --rose-w:#FDF2ED;

  /*
   * ЗЕЛЕНОТО СТАВА ПО-ТОПЛО.
   *
   * Студеното зелено до теракота изглежда чуждо. Това е с лека жълта
   * нотка и се връзва.
   */
  --ok:#3B7A4E;
  --ok-w:#EDF6EF;

  --warn:#B8862B;
  --warn-w:#FBF3E2;

  --bad:#A83A2A;
  --bad-w:#FCEFEC;

  /* Синьото остава само за редки бележки · не за украса. */
  --blue:#4A6B7C;
  --blue-w:#EDF2F4;

  --star:#B8862B;

  /* Сенките с топъл оттенък · студената сянка издава синьо. */
  --sh-s:0 1px 2px rgba(36,28,24,.05);
  --sh:0 2px 10px rgba(36,28,24,.07);
  --sh-l:0 16px 44px rgba(36,28,24,.13);
  --sh-xl:0 24px 60px rgba(36,28,24,.19);
}

/* ══════════════════════════════════════════════════════════
   БУТОНИТЕ · дизайнерски, не квадратчета
   ══════════════════════════════════════════════════════════ */
/*
 * ЗЕЛЕНОТО Е САМО ЗА ДЕЙСТВИЕ.
 *
 * Ако всичко е зелено, нищо не е. Тук зелено значи „това щракни“ —
 * поръчай, вземи, започни.
 *
 * ДВИЖЕНИЕТО: светлина, която минава при посочване, и стрелка, която
 * тръгва напред. Бутонът показва, че води някъде.
 */
.btn{
  position:relative;overflow:hidden;isolation:isolate;
  border-radius:99px;border:0;
  background:linear-gradient(180deg, #B7FF35 0%, #4a9503, #7CFF00 100%);
  color:#fff;
  box-shadow:0 6px 18px rgba(59,122,78,.3), inset 0 1px 0 rgba(255,255,255,.2);
  transition:transform .22s cubic-bezier(.2,.9,.2,1), box-shadow .22s;
}
.btn:hover{
  background:linear-gradient(156deg, #69c90e 0%, #69c90e, #305a08 100%);
  transform:translateY(-2px);
  box-shadow:0 10px 28px rgba(59,122,78,.38), inset 0 1px 0 rgba(255,255,255,.26);
}
.btn:active{transform:translateY(0)}

/* Светлината, която минава · прави бутона предмет. */
.btn::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg, transparent 20%, rgba(255,255,255,.28) 50%, transparent 80%);
  transform:translateX(-120%);
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.btn:hover::before{transform:translateX(120%)}

.btn svg{transition:transform .22s}
.btn:hover svg{transform:translateX(3px)}

/* Теракотеният · за разглеждане, не за поръчка. */
.btn-rose,
.btn-terra{
  background:linear-gradient(135deg, #E0764C 0%, var(--rose) 55%, var(--rose-2) 100%);
  box-shadow:0 6px 18px rgba(194,86,47,.28), inset 0 1px 0 rgba(255,255,255,.2);
}
.btn-rose:hover,
.btn-terra:hover{
  background:linear-gradient(135deg, #E0764C 0%, var(--rose) 55%, var(--rose-2) 100%);
  box-shadow:0 10px 28px rgba(194,86,47,.36), inset 0 1px 0 rgba(255,255,255,.26);
}

/*
 * ОЧЕРТАНИЯТ · с двоен ръб.
 *
 * Обикновена рамка изглежда недовършена; вътрешната сянка прави
 * бутона предмет.
 */
.btn-ghost{
  background:transparent;color:#5e890f;
  box-shadow:inset 0 0 0 1.5px #7cbf00;
}
.btn-ghost:hover{
  background:var(--wash);color:var(--ink);
  box-shadow:inset 0 0 0 1.5px var(--ink);transform:translateY(-2px);
}
.btn-ghost::before{display:none}

.btn-light{
  background:rgba(255,255,255,.1);color:#fff;
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.24);
}
.btn-light:hover{
  background:rgba(255,255,255,.18);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4);
}

/* ══════════════════════════════════════════════════════════
   ГЕРОЯТ · въглен с теракотено сияние
   ══════════════════════════════════════════════════════════ */
.hero-art{
  background:
    radial-gradient(1100px 620px at 84% -12%, rgba(194,86,47,.34), transparent 62%),
    radial-gradient(760px 420px at 6% 108%, rgba(184,134,43,.18), transparent 58%),
    linear-gradient(178deg, #1A1411 0%, var(--navy) 48%, #7cbf00 100%);
}

/*
 * ТОЧКИ, НЕ МРЕЖА.
 *
 * Мрежата прилича на милиметрова хартия. Точките са по-меки.
 */
.hero-art::before{
  background-image:radial-gradient(rgba(255,255,255,.07) 1.2px, transparent 1.2px) !important;
  background-size:26px 26px !important;
}

.hero-art h1 em{
  background:linear-gradient(110deg, #B7FF35 0%, #7CFF00 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-art h1 em svg{display:none}

.hero-art .eyebrow{color:#7CFF00;}
.hero-art .eyebrow::before{background:#7CFF00;}

/* ══════════════════════════════════════════════════════════
   ЖИВОТО ТАБЛО · вместо рисунка
   ══════════════════════════════════════════════════════════ */
/*
 * ═══ ГЛАВНОТО НА ГЕРОЯ ═══
 *
 * Рисунката показва какво имаме; таблото показва, че работи В МОМЕНТА.
 * Числата трепкат, чертата се движи, точката пулсира.
 *
 * Никой хостинг не го прави, защото трябва да е верен — а верният е
 * най-доброто доказателство.
 */
.dash{
  position:relative;
  background:linear-gradient(160deg, rgba(255,255,255,.07) 0%, rgba(255,255,255,.03) 100%);
  border:1px solid rgba(255,255,255,.13);
  border-radius:28px;padding:clamp(20px,2.4vw,28px);
  backdrop-filter:blur(14px);
  box-shadow:0 24px 70px rgba(0,0,0,.4);
}

.dash::before{
  content:'';position:absolute;inset:-1px;border-radius:inherit;z-index:-1;
  background:linear-gradient(140deg, rgba(194,86,47,.5), transparent 55%);
  opacity:.6;filter:blur(22px);
}

.dash-h{
  display:flex;align-items:center;gap:12px;
  padding-bottom:16px;margin-bottom:18px;
  border-bottom:1px solid rgba(255,255,255,.1);
}

/* Точката „на живо“ · пулсира, за да личи, че не е снимка. */
.dash-live{
  display:inline-flex;align-items:center;gap:8px;
  padding:5px 12px 5px 9px;border-radius:99px;
  background:rgba(59,122,78,.2);border:1px solid rgba(87,160,108,.34);
  font:700 10.5px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;
  color:#B7FF35;
}
.dash-live i{
  width:7px;height:7px;border-radius:50%;background:#8FD3A2;flex:0 0 auto;
  animation:dash-beat 1.8s ease-in-out infinite;
}
@keyframes dash-beat{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.75)}}

.dash-t{font:700 13px/1.2 var(--sans);color:rgba(255,255,255,.55);margin-left:auto}

.dash-top{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}

.dm{
  padding:16px 18px;border-radius:16px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);
}
.dm-l{
  display:block;font:600 10.5px/1 var(--sans);letter-spacing:.09em;
  text-transform:uppercase;color:rgba(255,255,255,.42);margin-bottom:10px;
}
.dm-v{
  display:flex;align-items:baseline;gap:5px;
  font:700 1.65rem/1 var(--mono);letter-spacing:-.04em;color:#fff;
}
.dm-v small{font-size:.85rem;font-weight:500;color:rgba(255,255,255,.45)}
.dm-v.is-ok{color:#B7FF35;}
.dm-sub{display:block;margin-top:8px;font-size:11px;color:rgba(255,255,255,.4)}

/*
 * ЧЕРТАТА СЕ ДВИЖИ НАЛЯВО.
 *
 * Две еднакви криви една след друга, които се плъзгат — така
 * движението няма шев.
 */
.dash-graph{
  height:78px;border-radius:16px;overflow:hidden;position:relative;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  margin-bottom:14px;
}
.dash-graph svg{width:100%;height:100%;display:block;overflow:hidden}
@keyframes dash-slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.dash-graph-l{
  position:absolute;top:9px;left:14px;z-index:1;
  font:600 10px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;
  color:rgba(255,255,255,.4);
}

.dash-rows{display:grid;gap:1px;border-radius:16px;overflow:hidden;
           background:rgba(255,255,255,.07)}

.dr{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;
  padding:11px 14px;background:rgba(36,28,24,.5);font-size:12.5px;
}
.dr-dot{width:7px;height:7px;border-radius:50%;background:#8FD3A2;flex:0 0 auto;
        box-shadow:0 0 0 3px rgba(143,211,162,.16)}
.dr-n{font:600 12.5px/1 var(--mono);color:rgba(255,255,255,.82)}
.dr-b{width:64px;height:5px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}
.dr-f{display:block;height:100%;border-radius:99px;
      background:linear-gradient(90deg,#57A06C,#8FD3A2);transition:width 1.4s ease}
.dr-f.is-hot{background:linear-gradient(90deg,var(--rose),#E0764C)}
.dr-ms{font:600 11.5px/1 var(--mono);color:rgba(255,255,255,.5);min-width:38px;text-align:right}

.dash-f{
  margin-top:14px;padding-top:13px;border-top:1px solid rgba(255,255,255,.1);
  font-size:11px;color:rgba(255,255,255,.38);line-height:1.5;
  display:flex;align-items:center;gap:8px;
}
.dash-f svg{width:12px;height:12px;flex:0 0 auto}

@media (prefers-reduced-motion: reduce){
  .dash-live i{animation:none}
}

/* ══════════════════════════════════════════════════════════
   КАРТАТА ЗА ДОМЕЙН · бутикова
   ══════════════════════════════════════════════════════════ */
/*
 * ═══ НЕ Е ЛЕНТА, А КАРТА ═══
 *
 * Обикновено търсачката е ивица с поле и копче. Тук е самостоятелен
 * предмет: повдигнат, с цветна ивица отгоре като печат на кутия.
 *
 * Това е първото, което човек прави — щом е главното, трябва да
 * изглежда като главното.
 */
.dsearch{
  background:transparent !important;
  /*padding:0 !important;
  margin:clamp(-70px,-4vw,-40px) 0 clamp(40px,5vw,72px) !important;*/
  position:relative;z-index:3;
}
.dsearch::before{display:none !important}

.dsearch > .wrap-w,
.dsearch > .wrap-n{
  background:var(--paper);border-radius:34px;
  padding:clamp(26px,3.2vw,38px) !important;
  box-shadow:var(--sh-xl);
  position:relative;overflow:hidden;
  display:block !important;
}

/* Ивицата с преливка · като печат на кутия. */
.dsearch > .wrap-w::before,
.dsearch > .wrap-n::before{
  content:'';position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg, #B7FF35 0%, #7cbf00 45%, var(--ok) 100%);
}

/* Мекото петно в ъгъла · дълбочина, без да пречи. */
.dsearch > .wrap-w::after,
.dsearch > .wrap-n::after{
  content:'';position:absolute;top:-90px;right:-90px;
  width:280px;height:280px;border-radius:50%;
  background:#dffbac4f;opacity:.6;pointer-events:none;
  /*background:var(--rose-w);opacity:.6;pointer-events:none;*/
}

.dsearch-side{position:relative;z-index:1}
.dsearch-art{display:none !important}

/*
 * ПОЛЕТО · дебел ръб, който се оцветява при писане.
 *
 * Обикновено поле изглежда като формуляр. Ръбът го прави предмет, а
 * оцветяването казва „чувам те“.
 */
.dsearch form,
.dsearch .dsearch-form{
  display:flex;align-items:center;gap:0;
  background:#b7ff354f;/*border:2px solid var(--line);*/
  border-radius:99px;padding:6px;
  transition:border-color .22s, box-shadow .22s, background .22s;
}
.dsearch form:focus-within,
.dsearch .dsearch-form:focus-within{
  border-color:var(--rose);background:var(--paper);
  box-shadow:0 0 0 5px var(--rose-w);
}

.dsearch input[type="text"],
.dsearch input[type="search"]{
  flex:1;min-width:0;border:0 !important;background:transparent !important;
  padding:14px 18px !important;
  font:600 clamp(15px,2vw,18px)/1.3 var(--sans) !important;color:var(--ink);
  box-shadow:none !important;
}
.dsearch input:focus{outline:none !important;box-shadow:none !important}

.dsearch button[type="submit"],
.dsearch .btn{border-radius:99px;flex:0 0 auto}

/* Плочките с разширенията. */
.tld-chips{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-top:18px}

.tld-chips a,
.tld-chip{
  display:inline-flex;align-items:baseline;gap:8px;
  padding:9px 15px;border-radius:99px;text-decoration:none;
  background:var(--paper);border:1.5px solid var(--line);
  font:700 13px/1 var(--mono);color:var(--ink);
  transition:border-color .18s, transform .18s, box-shadow .18s;
}
.tld-chips a:hover,
.tld-chip:hover{
  border-color:#8bc850;transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(194,86,47,.16);
}
.tld-chips b,
.tld-chip b{font:600 15px/1 var(--sans);color:#000000;}

/* ══════════════════════════════════════════════════════════
   ПЛАНОВЕТЕ · копчето се разширява
   ══════════════════════════════════════════════════════════ */
.plan-card{border-radius:26px;transition:transform .22s cubic-bezier(.2,.9,.2,1),
           box-shadow .22s, border-color .22s}
.plan-card:hover{transform:translateY(-5px)}
.plan-card.is-featured{border-color:var(--rose)}
.plan-card.is-featured:hover{transform:translateY(-13px)}

/* ══════════════════════════════════════════════════════════
   КАРТИТЕ · един вид от край до край
   ══════════════════════════════════════════════════════════ */
/*
 * ЕДИН ВИД КАРТА, ПОВТОРЕН НАВСЯКЪДЕ.
 *
 * Ъгловото петно расте при посочване — дребно движение, което прави
 * картата жива.
 */
.svc-card,
.card-tile,
.feature-card{
  position:relative;overflow:hidden;border-radius:26px;
  transition:transform .22s cubic-bezier(.2,.9,.2,1), box-shadow .22s, border-color .22s;
}
.svc-card:hover,
.card-tile:hover,
.feature-card:hover{transform:translateY(-5px)}

.svc-card::before,
.card-tile::before{
  content:'';position:absolute;top:-46px;right:-46px;
  width:140px;height:140px;border-radius:50%;
  background:var(--rose);opacity:.08;
  transition:transform .35s cubic-bezier(.2,.9,.2,1);
}
.svc-card:hover::before,
.card-tile:hover::before{transform:scale(1.4)}

/* ══════════════════════════════════════════════════════════
   ПЛАВАЩОТО КОПЧЕ ЗА ЧАТ
   ══════════════════════════════════════════════════════════ */
/*
 * ДОЛУ ВДЯСНО, НА ВСЯКА СТРАНИЦА.
 *
 * Човек, който се затрудни, не търси страница „контакти“ — той иска да
 * пита веднага.
 *
 * ЗЕЛЕНАТА ТОЧКА пулсира: показва, че наистина има някой.
 */
.mchat{
  position:fixed;right:24px;bottom:24px;z-index:60;
  display:flex;align-items:center;gap:12px;
  padding:11px 22px 11px 11px;border-radius:99px;
  background:var(--navy);color:#fff;text-decoration:none;
  box-shadow:0 12px 36px rgba(36,28,24,.38);
  transition:transform .22s, box-shadow .22s;
}
.mchat:hover{transform:translateY(-3px);box-shadow:0 16px 44px rgba(36,28,24,.46);
             color:#fff;text-decoration:none}

.mchat-ic{
  width:40px;height:40px;border-radius:50%;flex:0 0 auto;position:relative;
  display:grid;place-items:center;
  background:linear-gradient(135deg,#57A06C,#2E6140);color:#fff;
}
.mchat-ic svg{width:19px;height:19px}

.mchat-ic::after{
  content:'';position:absolute;right:-1px;bottom:-1px;
  width:12px;height:12px;border-radius:50%;
  background:#8FD3A2;border:2.5px solid var(--navy);
  animation:mchat-live 2.2s ease-in-out infinite;
}
@keyframes mchat-live{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}
@media (prefers-reduced-motion: reduce){ .mchat-ic::after{animation:none} }

.mchat b{display:block;font:700 13.5px/1.2 var(--sans);margin-bottom:2px;color:#fff}
.mchat-t{display:block;font-size:11.5px;color:rgba(255,255,255,.55)}

/* ── по екрани ── */
@media (max-width:900px){
  .dash-top{grid-template-columns:1fr}
}

@media (max-width:640px){
  .dsearch{margin-top:-24px !important}
  .dsearch > .wrap-w,
  .dsearch > .wrap-n{border-radius:24px}

  .dsearch form,
  .dsearch .dsearch-form{flex-direction:column;border-radius:20px;gap:8px}
  .dsearch form .btn{width:100%}

  /* Копчето става само иконка · текстът изяжда екрана. */
  .mchat{right:16px;bottom:16px;padding:10px}
  .mchat-t,
  .mchat b{display:none}
}

/* ==== terakota: край ==== */

/* ==== nov-red: начало ==== */

/* ══════════════════════════════════════════════════════════
   ОЦЕНКИТЕ ОТ ТРИ МЕСТА
   ══════════════════════════════════════════════════════════ */
/*
 * ТЪНКА ЛЕНТА, не раздел.
 *
 * Оценките са потвърждение, не съдържание — затова заемат един ред,
 * а не цял екран.
 */
.rate-bar{
  padding:clamp(20px,2.6vw,30px) 0;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}

.rate-l{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(20px,4vw,54px);flex-wrap:wrap;
}

.rate-i{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.rate-i:hover{text-decoration:none}

.rate-src{
  font:800 12.5px/1 var(--sans);color:var(--ink);
  padding:7px 12px;border-radius:8px;background:var(--wash-2);
}

.rate-s{display:flex;gap:2px}
.rate-s svg{width:14px;height:14px;color:var(--star)}

.rate-n{display:flex;align-items:baseline;gap:6px}
.rate-n b{font:800 1.2rem/1 var(--mono);letter-spacing:-.03em;color:var(--ink)}
.rate-n span{font-size:12px;color:var(--ink-3)}

/* ══════════════════════════════════════════════════════════
   КАРТИТЕ С УСЛУГИ
   ══════════════════════════════════════════════════════════ */
/*
 * ЕДИН ВИД КАРТА, ПОВТОРЕН ШЕСТ ПЪТИ.
 *
 * Различава ги само цветът на ъгловото петно и иконката. Така окото
 * ги чете като едно семейство, а не като шест различни неща.
 */
.svc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

.svc-card{
  position:relative;overflow:hidden;text-decoration:none;color:inherit;
  background:#5E9A000D;border:1.5px solid #7cbf00;
  border-radius:26px;padding:26px;
  display:flex;flex-direction:column;
  transition:transform .22s cubic-bezier(.2,.9,.2,1), box-shadow .22s, border-color .22s;
}
.svc-card:hover{
  transform:translateY(-5px);box-shadow:var(--sh-l);
  border-color:var(--line-2);text-decoration:none;
}

/* Ъгловото петно · расте при посочване. */
.svc-card::before{
  content:'';position:absolute;top:-46px;right:-46px;
  width:140px;height:140px;border-radius:50%;
  opacity:.09;transition:transform .35s cubic-bezier(.2,.9,.2,1);
}
.svc-card:hover::before{transform:scale(1.4)}

.svc-card.c1::before{background:#78BE0A;}
.svc-card.c2::before{background:var(--ok)}
.svc-card.c3::before{background:#5E9A00;}
.svc-card.c4::before{background:#5E9A00;}

.svc-card > *{position:relative;z-index:1}

.svc-ic{
  width:50px;height:50px;border-radius:15px;margin-bottom:16px;
  display:grid;place-items:center;transition:transform .22s;
}
.svc-card:hover .svc-ic{transform:scale(1.06) rotate(-3deg)}
.svc-card.c1 .svc-ic{background:#5E9A000D;color:#5E9A00;}
.svc-card.c2 .svc-ic{background:var(--ok-w);#5E9A00;}
.svc-card.c3 .svc-ic{background:#5E9A000D;color:#5E9A00;}
.svc-card.c4 .svc-ic{background:#5E9A000D;color:#5E9A00;}
.svc-ic svg{width:23px;height:23px}

.svc-tag{
  position:absolute;top:24px;right:24px;z-index:2;
  padding:5px 11px;border-radius:99px;
  font:700 9.5px/1.4 var(--sans);letter-spacing:.05em;text-transform:uppercase;
  background:#70dd08;color:#040404;
}
.svc-tag.is-t{background:#a4fd03b5;}

.svc-card h3{margin:0 0 8px;font:700 1.08rem/1.32 var(--sans);letter-spacing:-.022em}
.svc-card p{margin:0 0 18px;font-size:13.5px;color:var(--ink-2);line-height:1.62;flex:1}

.svc-p{
  display:flex;align-items:center;gap:8px;
  padding-top:16px;border-top:1px solid var(--line);
}
.svc-p b{font:800 1.15rem/1 var(--mono);letter-spacing:-.035em;color:var(--ink)}
.svc-p > span{font-size:12px;color:#000000;}

/*
 * КОПЧЕТО СЕ РАЗШИРЯВА.
 *
 * Кръгче със стрелка, което става „Поръчай“ при посочване — заема
 * малко място, но казва къде се щраква.
 */
.svc-go{
  margin-left:auto;display:inline-flex;align-items:center;gap:0;
  height:38px;padding:0 12px;border-radius:99px;overflow:hidden;
  background:linear-gradient(135deg, #7CFF00, #61b511);
  color:#fff;box-shadow:0 4px 12px rgba(59,122,78,.26);
  transition:gap .24s cubic-bezier(.2,.9,.2,1), padding .24s, box-shadow .22s;
}
.svc-card:hover .svc-go{
  gap:8px;padding:0 16px;box-shadow:0 6px 18px rgba(59,122,78,.36);
}

.svc-go > span{
  max-width:0;overflow:hidden;white-space:nowrap;
  font:700 12.5px/1 var(--sans);color:#000000;
  transition:max-width .24s cubic-bezier(.2,.9,.2,1);
}
.svc-card:hover .svc-go > span{max-width:76px}

.svc-go svg{width:15px;height:15px;flex:0 0 auto}

/* ══════════════════════════════════════════════════════════
   РАЗДЕЛИТЕ ЗА ВИДА ПЛАН
   ══════════════════════════════════════════════════════════ */
/*
 * ЧОВЕК ИЗБИРА ПЪТЯ СИ, преди да гледа числа.
 *
 * Водят към страници, не менят съдържание на място — така всеки вид
 * има свой адрес, който се праща на колега.
 */
.plan-tabs{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:18px}

.plan-tab{
  display:inline-flex;align-items:center;gap:9px;
  padding:12px 24px;border-radius:99px;text-decoration:none;
  border:1.5px solid var(--line);background:var(--paper);
  font:700 14px/1 var(--sans);color:var(--ink-2);
  transition:all .2s;
}
.plan-tab:hover{border-color:var(--line-2);color:var(--ink);text-decoration:none}
.plan-tab.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.plan-tab svg{width:16px;height:16px}

/* ── по екрани ── */
@media (max-width:1000px){
  .svc-cards{grid-template-columns:1fr 1fr}
}

@media (max-width:640px){
  .svc-cards{grid-template-columns:1fr}

  /* Копчето стои разгънато · на телефон няма посочване. */
  .svc-go{gap:8px;padding:0 16px}
  .svc-go > span{max-width:76px}

  .plan-tabs{width:100%}
  .plan-tab{flex:1;justify-content:center;padding:12px 10px;font-size:13px}
}

/* ==== nov-red: край ==== */







/*
 * ЛЕНТИТЕ ПЪЛЗЯТ, не прескачат.
 *
 * Преходът е тук, не в кода: така движението остава плавно дори когато
 * числото дойде рязко.
 */
.dr-f{transition:width .8s cubic-bezier(.2,.8,.2,1), background .3s}



/*
 * ЛЕНТИТЕ ПЪЛЗЯТ, не прескачат.
 *
 * Преходът е тук, не в кода: така движението остава плавно дори когато
 * числото дойде рязко.
 */
.dr-f{transition:width .8s cubic-bezier(.2,.8,.2,1), background .3s}

/*
 * ПРАЗНАТА ЛЕНТА · когато натоварването не се знае.
 *
 * Различава се от нула: нулата казва „нищо не прави“, а празното —
 * „не знам“.
 */
.dr-b:empty{background:rgba(255,255,255,.06)}

/* ==== tablo-nodes: начало ==== */

/*
 * НЕДОСТИЖИМАТА МАШИНА.
 *
 * Сива точка и приглушен ред — вижда се, че нещо не е наред, но не
 * крещи. Червено насред героя плаши повече, отколкото информира.
 */
.dr.is-down{opacity:.45}
.dr.is-down .dr-dot{background:rgba(255,255,255,.3);box-shadow:none}
.dr.is-down .dr-f{background:rgba(255,255,255,.2)}

/* ==== tablo-nodes: край ==== */

/*
 * ЛЕНТИТЕ ПЪЛЗЯТ, не прескачат.
 *
 * Преходът е тук, не в кода: така движението остава плавно дори когато
 * числото дойде рязко.
 */
.dr-f{transition:width .8s cubic-bezier(.2,.8,.2,1), background .3s}

/*
 * ПРАЗНАТА ЛЕНТА · когато натоварването не се знае.
 *
 * Различава се от нула: нулата казва „нищо не прави“, а празното —
 * „не знам“.
 */
.dr-b:empty{background:rgba(255,255,255,.06)}



/* Контейнерът на логата */
.c-logo-bar, .logo-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 30px;
}

/* Елементът за всяко логото */
.c-logo-bar img, .logo-bar img {
   /* max-height: 45px;  Задава еднаква максимална височина */
    width: auto;      /* Запазва пропорциите */
    object-fit: contain;
    display: block;
    margin: 0 auto;   /* Хоризонтално центриране */
}



/* ==== lang-flag: начало ==== */

/*
 * ФЛАГЧЕТАТА ЗА ЕЗИК.
 *
 * Кръгли и дребни · до тях остават и буквите, защото знамето само по
 * себе си не е име на език. Човек, който търси английски, гледа „EN“,
 * не флаг.
 */
.lang-f{
  width:64px;height:64px;flex:0 0 auto;border-radius:50%;
  display:inline-block;vertical-align:middle;
  box-shadow:0 1px 3px rgba(0,0,0,.3);
  transition:transform .16s, box-shadow .16s;
}

a[hreflang]:hover .lang-f{transform:scale(1.08)}

/*
 * ТЕКУЩИЯТ ЕЗИК · с ясен ръб.
 *
 * Без буквите трябва друг знак кой е избран — иначе двете флагчета
 * изглеждат еднакво.
 */
/*
 * ТЕКУЩИЯТ ЕЗИК · бял ръб с отстояние.
 *
 * Розовият се сливаше с червената ивица на българското знаме и
 * изглеждаше като петно.
 *
 * Белият личи и на двете, а тъмната сянка отвън го отделя от лентата.
 */
/*
 * ТЕКУЩИЯТ ЕЗИК · без ръб.
 *
 * Всеки ръб около знаме мени вида му: белият се сливаше с бялата
 * ивица, розовият — с червената.
 *
 * Затова избраният просто е плътен, а другият приглушен.
 */
a[aria-current] .lang-f{box-shadow:0 2px 6px rgba(0,0,0,.35)}

/* Неизбраният · приглушен, за да личи разликата. */
a[hreflang]:not([aria-current]) .lang-f{opacity:.55}
a[hreflang]:not([aria-current]):hover .lang-f{opacity:1}

/*
 * БУКВИТЕ ОСТАВАТ ЗА ЧЕТЦИТЕ.
 *
 * Скрити са от очите, но екранните четци ги произнасят — иначе
 * връзката е просто „кръг“ и никой не разбира къде води.
 */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* Редът: флагче, после буквите. */
.top-bar a[hreflang],
.topbar a[hreflang]{
  display:inline-flex;align-items:center;gap:6px;
  opacity:.72;transition:opacity .16s;
}
.top-bar a[hreflang]:hover,
.topbar a[hreflang]:hover{opacity:1}

/* Текущият език · плътен, за да личи кой е избран. */
.top-bar a[aria-current],
.topbar a[aria-current]{opacity:1}

/* ==== lang-flag: край ==== */

/*
 * ═══ ФЛАГЧЕТАТА СА В „utilbar“, НЕ В „topbar“ ═══
 *
 * Там има правило „svg{width:13px}“ за дребните иконки — и то смаляваше
 * и знамената.
 *
 * Затова тук се пише изрично: то е по-специфично и надделява.
 */
.utilbar a[hreflang] svg.lang-f{
  width:26px;height:26px;stroke-width:0;
}

/*
 * ОТСТОЯНИЕ ОТ ПОЩАТА.
 *
 * Флагчетата стояха залепени за адреса и изглеждаха като част от него.
 * Тази отстъпка ги отделя визуално.
 */
.utilbar a[hreflang]{display:inline-flex;align-items:center}
/*
 * ═══ ОТСТОЯНИЕТО Е НА КУТИЯТА, НЕ НА ВРЪЗКАТА ═══
 *
 * Флагчетата са в „.r“ с „display:flex“ и свой „gap“. Отстъпка на
 * самата връзка се губи вътре в подредбата.
 *
 * Затова се мести цялата група.
 */
/*
 * ═══ ДВЕТЕ ФЛАГЧЕТА ВДЯСНО, ПЛЪТНО ЕДНО ДО ДРУГО ═══
 *
 * „margin-left“ на първото само го отдалечаваше от второто, вместо да
 * измести двете.
 *
 * Затова се мести САМАТА КУТИЯ, а разстоянието между флагчетата се
 * задава отделно — те са двойка и трябва да изглеждат като двойка.
 */


/*
 * ═══ ТОЧКИТЕ НА МАШИНИТЕ ПУЛСИРАТ ═══
 *
 * Както при „на живо“ — показва, че редът не е снимка.
 *
 * РАЗНО ЗАБАВЯНЕ: ако мигат в такт, изглежда като едно нещо. Различните
 * мигат като отделни машини, всяка със свой ритъм.
 */
.dr-dot{animation:dash-beat 2.4s ease-in-out infinite}
.dr:nth-child(2) .dr-dot{animation-delay:.8s}
.dr:nth-child(3) .dr-dot{animation-delay:1.6s}

/* Недостижимата не пулсира · тя не е жива. */
.dr.is-down .dr-dot{animation:none}

@media (prefers-reduced-motion: reduce){
  .dr-dot{animation:none}
}

/*
 * ═══ САМО ФЛАГЧЕТАТА ═══
 *
 * Те са в своя обвивка „.langs“, затова местенето им не влачи пощата
 * и помощния център.
 */
.utilbar .langs{
  display:inline-flex;align-items:center;
  gap:4px;              /* плътно · те са двойка */
  margin-left:14px;     /* отделя ги от пощата */
  margin-right:-8px;    /* изтегля ги надясно */
}

/* Общото разстояние на кутията не важи вътре в обвивката. */
.utilbar .langs a[hreflang]{margin:0}

/*
 * ═══ ФЛАГЧЕТАТА СЕ ИЗРАВНЯВАТ С БУТОНА „ВХОД“ ═══
 *
 * Бутонът отдолу стои на самия десен ръб на съдържанието. Флагчетата
 * бяха малко навътре и двете линии не съвпадаха.
 *
 * ТУК ОТСТЪПКАТА ОТПАДА · те опират до ръба, точно като бутона.
 */
.utilbar .langs{margin-left:auto;margin-right:0}

/*
 * ПОЩАТА И ПОМОЩНИЯТ ЦЕНТЪР ОСТАВАТ ВЛЯВО.
 *
 * „margin-left:auto“ на флагчетата ги избутва надясно и оставя двете
 * връзки на мястото им — без да се пипат изобщо.
 */

/* ==== loc-flag: начало ==== */



/*
 * ═══ БЕЗ КУТИЙКИ ═══
 *
 * Рамката и фонът бяха за текста. Щом той отпадна, те само ограждат
 * знамето и му пречат.
 */
.loc-item{
  background:none !important;
  border:0 !important;
  padding:0 !important;
}
.loc-item.is-main{background:none !important;border:0 !important}

/*
 * ДВА РЕДА ПО ЧЕТИРИ.
 *
 * Осем в редица стават дребни; четири на ред им дават място да се
 * виждат.
 */
.loc-list,
.locations .row,
.loc-item:first-child{ }

.loc-item{ }

.loc-f{width:74px;height:48px}

/* Обвивката · четири в ред. */
.loc-item{margin:0}


/* Сянката на гънките · дава обем. */
.loc-item{position:relative}

.loc-item::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  border-radius:1px;
  background:linear-gradient(100deg,
    rgba(0,0,0,.16) 0%, rgba(255,255,255,.14) 22%,
    rgba(0,0,0,.12) 46%, rgba(255,255,255,.12) 70%,
    rgba(0,0,0,.14) 100%);
  background-size:220% 100%;
  animation:flag-sheen 5s linear infinite;
  mix-blend-mode:overlay;
}

@keyframes flag-sheen{
  from{background-position:0% 0}
  to  {background-position:-220% 0}
}

.loc-item:nth-child(2)::after{animation-delay:-1.1s}
.loc-item:nth-child(3)::after{animation-delay:-2.2s}
.loc-item:nth-child(4)::after{animation-delay:-3.3s}
.loc-item:nth-child(5)::after{animation-delay:-.6s}
.loc-item:nth-child(6)::after{animation-delay:-1.8s}
.loc-item:nth-child(7)::after{animation-delay:-2.9s}
.loc-item:nth-child(8)::after{animation-delay:-4.1s}

@media (prefers-reduced-motion: reduce){
  .loc-item::after{animation:none;opacity:.25}
  .loc-f{filter:none}
}

/*
 * ═══ ЧЕТИРИ НА РЕД, ДВА РЕДА ═══
 *
 * Осемте знамена в една редица стават дребни. Четири на ред им дават
 * място да се виждат.
 */
.loc-list{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr);
  gap:18px;
  align-items:center;
  justify-items:center;
}

/* Филтърът не заема място в решетката. */
.loc-list > svg[width="0"]{display:none}

@media (max-width:560px){
  /* На тесен екран два на ред · четири стават дребни. */
  .loc-list{grid-template-columns:repeat(2, 1fr);gap:14px}
}


/* ==== loc-flag: начало ==== */

/*
 * ═══ ЗНАМЕТО СЕ РАЗВЯВА ═══
 *
 * То е нарязано на шестнайсет тесни ивици. Всяка показва своята част от
 * рисунката и се движи с малко закъснение от предната.
 *
 * Затова гънката ПЪТУВА отляво надясно — както при истинско платно на
 * вятър, а не като изкривена картинка.
 */
.loc-f{
  display:flex;position:relative;
  width:68px;height:46px;
  overflow:hidden;border-radius:2px;

  /*
   * БЕЗ СЯНКА.
   *
   * Тя отделяше знамето от страницата и го правеше на залепен стикер.
   * Без нея то е част от дизайна, не предмет върху него.
   */
}

.loc-f i{
  display:block;flex:0 0 auto;
  /*
   * ШИРИНАТА В ЧАСТИ, НЕ В ПИКСЕЛИ.
   *
   * „6px“ се чупи при друг размер на знамето. Тук всяка ивица е
   * една шестнайсета от него — важи при всяка големина.
   */
  /*
   * ИВИЦИТЕ СЕ ЗАСТЪПВАТ.
   *
   * При точно 6.25% между тях остава косъм разстояние — и точно то
   * се вижда като ленти.
   *
   * Затова всяка е малко по-широка и влиза под съседната.
   */
  width:6.6%;margin-right:-.35%;height:100%;
  background-image:var(--fl);
  background-size:1600% 100%;
  background-repeat:no-repeat;
  animation:loc-wave 3.4s ease-in-out infinite;
}

/* Всяка ивица показва своята част и тръгва малко по-късно. */
.loc-f i:nth-child(1){background-position:0.0000% 0;animation-delay:0s}
.loc-f i:nth-child(2){background-position:6.6667% 0;animation-delay:-.145s}
.loc-f i:nth-child(3){background-position:13.3333% 0;animation-delay:-.290s}
.loc-f i:nth-child(4){background-position:20.0000% 0;animation-delay:-.435s}
.loc-f i:nth-child(5){background-position:26.6667% 0;animation-delay:-.580s}
.loc-f i:nth-child(6){background-position:33.3333% 0;animation-delay:-.725s}
.loc-f i:nth-child(7){background-position:40.0000% 0;animation-delay:-.870s}
.loc-f i:nth-child(8){background-position:46.6667% 0;animation-delay:-1.015s}
.loc-f i:nth-child(9){background-position:53.3333% 0;animation-delay:-1.160s}
.loc-f i:nth-child(10){background-position:60.0000% 0;animation-delay:-1.305s}
.loc-f i:nth-child(11){background-position:66.6667% 0;animation-delay:-.9s}
.loc-f i:nth-child(12){background-position:73.3333% 0;animation-delay:-1.595s}
.loc-f i:nth-child(13){background-position:80.0000% 0;animation-delay:-1.740s}
.loc-f i:nth-child(14){background-position:86.6667% 0;animation-delay:-1.885s}
.loc-f i:nth-child(15){background-position:93.3333% 0;animation-delay:-2.030s}
.loc-f i:nth-child(16){background-position:100.0000% 0;animation-delay:-2.175s}

/*
 * ДВИЖЕНИЕТО · три неща наведнъж.
 *
 * Вдига се и пада · вятърът я носи
 * Смалява се · платът се извива навътре
 * Светлее и потъмнява · дава дълбочина на гънката
 */
@keyframes loc-wave{
  0%,100%{ transform:translateY(0) scaleY(1); filter:brightness(1) }
  25%    { transform:translateY(-3px) scaleY(.93); filter:brightness(1.2) }
  50%    { transform:translateY(0) scaleY(1); filter:brightness(1) }
  75%    { transform:translateY(3px) scaleY(.93); filter:brightness(.82) }
}

/* Всяко знаме със свой ритъм · иначе изглеждат като едно платно. */
.loc-item:nth-child(2) .loc-f i{animation-duration:3.7s}
.loc-item:nth-child(3) .loc-f i{animation-duration:3.1s}
.loc-item:nth-child(4) .loc-f i{animation-duration:4s}
.loc-item:nth-child(5) .loc-f i{animation-duration:3.3s}
.loc-item:nth-child(6) .loc-f i{animation-duration:3.8s}
.loc-item:nth-child(7) .loc-f i{animation-duration:3.5s}
.loc-item:nth-child(8) .loc-f i{animation-duration:4.2s}

/* Без кутийки · рамката беше за текста, който отпадна. */
.loc-item{background:none;border:0;padding:0;position:relative}
.loc-item.is-main{background:none;border:0}

/* Четири на ред, два реда. */
.loc-list{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:12px;align-items:center;justify-items:center;
}

@media (max-width:560px){
  .loc-list{grid-template-columns:repeat(2,1fr);gap:10px}
  .loc-f{width:62px;height:42px}
}

@media (prefers-reduced-motion: reduce){
  .loc-f i{animation:none}
}

/* ==== loc-flag: край ==== */

/*
 * РАЗДЕЛЪТ С ЛОКАЦИИТЕ · без своя кутия.
 *
 * Знамената сами носят цвят; рамка около тях само ги ограждаше.
 */
.loc-grid{background:none;border:0}
.loc-list{background:none;border:0;padding:0}


.size-logo{
max-height: 120px;!important;}











/* Променливи за цветовете */
:root {
    --star-color: #FFDE4D; /* Светло жълт цвят за звездите */
    --bg-card: #ffffff;
    --text-main: #1a1a1a;
    --text-sub: #666666;
}

/* Основен контейнер на бокса */
.rate-bar-container {
    background: var(--bg-card);
    padding: 24px 40px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    display: flex;
    gap: 40px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    font-family: system-ui, -apple-system, sans-serif;
}

/* Индивидуална карта за всяка платформа */
.rate-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 12px;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
    position: relative;
}

/* Интерактивен Hover ефект - повдигане и сянка */
.rate-card:hover {
    transform: translateY(-8px) scale(1.02);
    background: #ffffff;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
}

/* Контейнер за логата (снимките) */
.platform-logo {
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
    transition: transform 0.3s ease;
}

.rate-card:hover .platform-logo {
    transform: scale(1.08);
}

/* Оразмеряване на конкретните лога */
.logo-img-tp { height: 26px; width: auto; }
.logo-img-g  { height: 32px; width: auto; }
.logo-img-fb { height: 32px; width: auto; }

/* Големи светло жълти звезди чрез HTML кодове */
.stars-container {
    display: flex;
    gap: 3px;
    font-size: 26px; /* Голям размер за звездите */
    color: var(--star-color);
    line-height: 1;
}

/* Пулсираща анимация за звездите при hover */
.rate-card:hover .stars-container .star {
    animation: starPulse 0.6s ease infinite alternate;
}

@keyframes starPulse {
    0% { transform: scale(1); filter: drop-shadow(0 0 1px rgba(255,222,77,0.5)); }
    100% { transform: scale(1.15); filter: drop-shadow(0 0 6px rgba(255,222,77,0.8)); }
}

/* Забавяне на анимацията за всяка звезда за "вълнообразен" ефект */
.stars-container .star:nth-child(1) { animation-delay: 0.05s; }
.stars-container .star:nth-child(2) { animation-delay: 0.10s; }
.stars-container .star:nth-child(3) { animation-delay: 0.15s; }
.stars-container .star:nth-child(4) { animation-delay: 0.20s; }
.stars-container .star:nth-child(5) { animation-delay: 0.25s; }

/* Текст с оценка */
.rate-score {
    font-size: 22px;
    font-weight: 700;
    color: var(--text-main);
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 2px;
}

/* Специфичен стил за зеления текст на Facebook */
.rate-score.fb-recommend {
    font-size: 15px; 
    font-weight: 600; 
    color: #00b67a;
}

.check-icon {
    font-size: 14px;
}

/* Брой отзиви */
.rate-count {
    font-size: 13px;
    color: var(--text-sub);
    font-weight: 400;
}

/* Специфичен ефект за Facebook процентите */
.fb-percent {
    color: #1877F2;
    font-weight: 700;
    font-size: 24px;
    transition: transform 0.3s ease;
}
.rate-card:hover .fb-percent {
    transform: scale(1.1);
}

/* Разделителна линия между картите */
.divider {
    width: 1px;
    height: 60px;
    background: #e1e6eb;
}

/* Мобилна адаптивност */
@media (max-width: 768px) {
    .rate-bar-container {
        flex-direction: column;
        gap: 20px;
        padding: 30px;
    }
    .divider {
        width: 60px;
        height: 1px;
    }
}








/* Нов ограничаващ контейнер за центриране и ширина до 1280px */
.c-logo-carousel-container {
    max-width: 1280px;
    margin: 0 auto; /* Центрира контейнера хоризонтално */
    padding: 0 20px; /* Вътрешно отстояние, за да не опира в края на екрана при по-малки дисплеи */
    box-sizing: border-box;
}

/* Контейнер на карусела - скрива излизащите лога */
.c-logo-bar-carousel {
    overflow: hidden;
    width: 100%;
    position: relative;
    padding: 15px 0;
    background: transparent;
}

/* Плавно избледняване отляво и отдясно вътре в рамките на 1280px */
.c-logo-bar-carousel::before,
.c-logo-bar-carousel::after {
    content: "";
    height: 100%;
    position: absolute;
    width: 100px;
    z-index: 2;
    pointer-events: none;
}
.c-logo-bar-carousel::before {
    left: 0;
    top: 0;
    background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.c-logo-bar-carousel::after {
    right: 0;
    top: 0;
    background: linear-gradient(to left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}

/* Лентата, която държи логата и се движи */
.c-logo-bar-track {
    display: flex;
    width: max-content;
    gap: 80px; /* По-голяма дистанция между логата */
    align-items: center;
    animation: scrollLogos 20s linear infinite; /* Регулирайте секундите за скорост */
}

/* Спиране на движението при посочване с мишката */
.c-logo-bar-carousel:hover .c-logo-bar-track {
    animation-play-state: paused;
}

/* Центриране на елементите в техните кутийки */
.logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Увеличени и напълно цветни лога */
.size-logo {
    height: 145px; /* Височината е увеличена от 50px на 65px */
    width: auto;
    object-fit: contain;
    filter: none; /* Премахнато grayscale - логата са изцяло цветни */
    opacity: 1; /* Напълно видими по подразбиране */
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Интерактивен лек отскок при посочване на лого */
.logo-item:hover .size-logo {
    transform: scale(1.1);
}

/* Анимацията за плавно безкрайно движение */
@keyframes scrollLogos {
    0% {
        transform: translateX(0);
    }
    100% {
        /* Премества редицата точно наполовина (заради дублираните лога) + отчита разстоянието (gap) */
        transform: translateX(calc(-50% - 40px)); 
    }
}

/* Мобилна адаптивност - леко смаляване на логата на телефони */
@media (max-width: 768px) {
    .size-logo {
        height: 45px;
    }
    .c-logo-bar-track {
        gap: 50px;
    }
}



.incl-bar{background: black;}
.incl-bar .wrap-w h2{color: white;}
.btn .btn-ghost, .btn-sm{color: white!important;}
.btn .plan-btn .btn-ghost{color: black!important;}




/* Секция с бял фон */
.sec.sec-wash {
  background: #ffffff;
  background-image: 
    radial-gradient(circle at 10% 20%, rgba(152, 219, 28, 0.08) 0%, transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(152, 219, 28, 0.05) 0%, transparent 40%);
  padding: 100px 20px;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: #1e293b;
  overflow: hidden;
  position: relative;
}

/* Деликатна футуристична мрежа */
.sec.sec-wash::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(0, 0, 0, 0.02) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(0, 0, 0, 0.02) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
}

.wrap-w {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* Заглавие и оценки (изчистен панел с бял фон и черрно заглавие) */
.rev-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 60px;
  background: #ffffff;
  padding: 40px 20px;
  border-radius: 24px;
  border: 1px solid rgba(152, 219, 28, 0.4);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05);
  position: relative;
  overflow: hidden;
}

.rev-head h2 {
  font-size: 2.8rem;
  font-weight: 900;
  color: #000000; /* Черно заглавие */
  margin-bottom: 24px;
  letter-spacing: -0.03em;
  z-index: 1;
}

.rev-scores {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: center;
  z-index: 1;
}

.rev-score {
  background: #cffb804f;
  padding: 12px 24px;
  border-radius: 50px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 0.95rem;
  border: 1px solid rgba(152, 219, 28, 0.4);
  color: #1e293b;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.rev-score:hover {
  transform: translateY(-5px) scale(1.05);
  border-color: #7cbf00;
  box-shadow: 0 0 25px rgba(152, 219, 28, 0.3);
  background: #ffffff;
}

.rev-score b {
  color: #000000;
  font-weight: 700;
}

/* Мрежа от отзиви */
.rev-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 28px;
}

/* Карти с динамична левитация и неонов кант */
.rev-card {
  background: #f8fafc;
  padding: 32px;
  border-radius: 24px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid rgba(152, 219, 28, 0.3);
  position: relative;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  animation: floatCard 6s ease-in-out infinite;
}

/* Различни фази на левитация за всяка карта */
.rev-card:nth-child(1) { animation-delay: 0s; }
.rev-card:nth-child(2) { animation-delay: 1.5s; }
.rev-card:nth-child(3) { animation-delay: 3s; }
.rev-card:nth-child(4) { animation-delay: 4.5s; }

/* Светлинен ефект при движение на мишката */
.rev-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(152, 219, 28, 0.2), transparent);
  transition: 0.6s;
}

.rev-card:hover::before {
  left: 100%;
}

.rev-card:hover {
  transform: translateY(-12px) scale(1.03);
  border-color: #7cbf00;
  box-shadow: 0 20px 40px rgba(152, 219, 28, 0.2), 0 0 25px rgba(152, 219, 28, 0.25);
  background: #ffffff;
}

/* Автор на отзива */
.who {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}

.av {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #050704;
  font-weight: 800;
  font-size: 1.05rem;
  background: linear-gradient(135deg, #7cbf00, #6ea810) !important;
  box-shadow: 0 8px 20px rgba(152, 219, 28, 0.3);
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.rev-card:hover .av {
  transform: rotate(12deg) scale(1.15);
}

.who b {
  font-size: 1.1rem;
  color: #0f172a;
  display: block;
  margin-bottom: 4px;
}

/* Текст на отзива */
.rev-card p {
  font-size: 1rem;
  line-height: 1.7;
  color: #475569;
  margin-bottom: 24px;
  flex-grow: 1;
}

/* Източник / дата */
.rev-card .src {
  font-size: 0.85rem;
  color: #64748b;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Звезди */
.stars {
  display: inline-flex;
  color: #7ab810;
  gap: 3px;
  filter: drop-shadow(0 0 4px rgba(152, 219, 28, 0.4));
}

.rev-card .stars svg,
.rev-score .stars svg {
  width: 16px;
  height: 16px;
}

.rev-head .stars svg {
  width: 14px;
  height: 14px;
}

/* Анимации */
@keyframes floatCard {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}

/**/




/* Контейнер на решетката - фиксиран на 4 колони за десктоп */
.feat-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important; /* Точно 4 колони на ред */
    gap: 24px !important;
    padding: 30px 0 !important;
}

/* Изчистена минималистична картичка */
.feat-card {
    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.15) !important; /* Лек и ненатрапчив контур */
    border-radius: 12px !important; /* Фино заобляне */
    padding: 30px 25px !important;
    position: relative;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important; /* Плавно премиум движение */
    box-shadow: 0 4px 15px rgba(48, 90, 8, 0.02) !important; /* Почти незабележима начална сянка */
}

/* Напълно скриваме иконите и техните контейнери */
.feat-card .fi, 
.feat-card .fi svg,
.feat-card span {
    display: none !important;
}

/* Тънка акцентна линия вляво от заглавието, която придава структура */
.feat-card h3 {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #305a08 !important; /* Тъмнозелен цвят */
    margin: 0 0 14px 0 !important;
    padding-left: 12px !important;
    border-left: 3px solid #7cbf00; /* Вертикална линия пред заглавието */
    letter-spacing: -0.3px;
    transition: border-color 0.3s ease, color 0.3s ease;
}

/* Описание на характеристиките */
.feat-card p {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #555850 !important; /* Приятно за четене сиво-зелено */
    margin: 0 !important;
}

/* ИНТЕРАКТИВНОСТ И ДВИЖЕНИЕ (HOVER EFFECT) */
.feat-card:hover {
    transform: translateY(-6px) !important; /* Модерно изплуване нагоре */
    border-color: rgba(105, 201, 14, 0.35) !important; /* Контурът става по-ясен */
    background: #ffffff !important; /* Запазва се чистият бял фон */
    /* Елегантна, мека неонова сянка, която кара картичката да изпъкне */
    box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Промяна на акцента на заглавието при hover */
.feat-card:hover h3 {
    border-left-color: #69c90e; /* Линията става по-наситено зелена */
    color: #69c90e !important; /* Заглавието също леко светва в брандовия цвят */
}

/* АДАПТИВНОСТ ЗА МОБИЛНИ УСТРОЙСТВА (RESPONSIVE) */
@media (max-width: 1024px) {
    .feat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important; /* 2 на ред за таблети */
    }
}

@media (max-width: 640px) {
    .feat-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important; /* 1 на ред за телефони */
        gap: 16px !important;
    }
}


/**/


/* ==========================================================================
   ОГРАНИЧЕН СТИЛ САМО ЗА СЕКЦИЯТА "НАЧИНИ НА ПЛАЩАНЕ"
   ========================================================================== */

/* Тъмен технологичен фон само за контейнера на плащанията */
.pay-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}

/* Тъмна премиум картичка за начин на плащане */
.pay-grid .pay-opt {
    background: #11140c !important; /* Наситено матово черно с лек зелен отенък */
    border: 1px solid rgba(152, 219, 28, 0.2) !important; /* Фин електриков контур */
    border-radius: 12px !important;
    padding: 30px 25px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    position: relative !important;
    overflow: hidden !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important; /* Дълбока тъмна сянка */
}

/* Горна част на плащанията (значки и време) */
.pay-grid .pay-top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 20px !important;
}

/* Електриково зелени значки за методите (IBAN, КАРТА, PayPal) */
.pay-grid .pay-mark {
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    background: rgba(152, 219, 28, 0.15) !important; /* Прозрачна електрикова основа */
    color: #7cbf00 !important; /* Ярко електриково зелен текст */
    letter-spacing: 0.5px !important;
}

/* Изключения за логото на PayPal, ако искате да запази маркова идентичност */
.pay-grid .pay-mark.is-pp {
    background: rgba(0, 69, 124, 0.2) !important;
    color: #0079c1 !important;
}

/* Време за активация и икони вътре в плащанията */
.pay-grid .when {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

.pay-grid .when svg {
    width: 15px !important;
    height: 15px !important;
    stroke-width: 2.2 !important;
}

/* Цветове за времето в тъмния режим */
.pay-grid .when.wait { 
    color: #9ca3af !important; /* Светло сиво за изчакване */
}
.pay-grid .when.now { 
    color: #69c90e !important; /* Електриково зелено за активиране веднага */
}

/* Заглавие на метода за плащане (Банков превод, Карта...) */
.pay-grid .pay-opt b {
    display: block !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #ffffff !important; /* Силно открояващо се бяло заглавие */
    margin-bottom: 12px !important;
    letter-spacing: -0.3px !important;
    transition: color 0.3s ease !important;
}

/* Описание на метода за плащане */
.pay-grid .pay-opt p {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #d1d5db !important; /* Светъл, силно четим текст на черния фон */
    margin: 0 0 20px 0 !important;
    flex-grow: 1 !important;
}

/* Долна секция (Без такса) */
.pay-grid .pay-foot {
    font-size: 13px !important;
    font-weight: 800 !important;
    color: #7cbf00 !important; /* Светещ електриков надпис */
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-top: 1px solid rgba(152, 219, 28, 0.15) !important;
    padding-top: 15px !important;
}

/* Интерактивност при hover за черните плащания */
.pay-grid .pay-opt:hover {
    transform: translateY(-6px) !important;
    background: #171c0f !important; /* Леко изсветляване на черното */
    border-color: #7cbf00 !important; /* Контурът светва напълно */
    /* Светещ неонов ореол около картичката при посочване */
    box-shadow: 0 15px 35px rgba(152, 219, 28, 0.2) !important;
}

.pay-grid .pay-opt:hover b {
    color: #7cbf00 !important; /* Заглавието светва в електриково зелено при посочване */
}

/* Текстови бележки под решетката за плащания */
.pay-grid + .pay-note {
    font-size: 13px !important;
    color: #6b7280 !important;
    text-align: center !important;
    margin-top: 25px !important;
}

/* АДАПТИВНОСТ ЗА ТАБЛЕТИ И ТЕЛЕФОНИ */
@media (max-width: 1024px) {
    .pay-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important; /* 2 на ред за таблети */
    }
}

@media (max-width: 640px) {
    .pay-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important; /* 1 на ред за телефони */
        gap: 16px !important;
    }
}


/**/


/* ==========================================================================
   ИЗЧИСТЕН И РЕАЛИСТИЧЕН ИЗГЛЕД НА ЗНАМЕНАТА СЪС СЪРВЪРИ
   ========================================================================== */

/* Центриране на текстовото съдържание в секцията */
.loc-grid > div {
    text-align: center !important;
}

/* Перфектно хоризонтално центриране на редицата със знамената */
.loc-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 30px !important; /* Приятно разстояние между отделните знамена */
    align-items: center !important;
    justify-content: center !important;
    padding: 20px 0 !important;
    max-width: 900px !important;
    margin: 0 auto !important;
}

/* Изчистен контейнер за знамената - БЕЗ рамки, БЕЗ ховър ефекти, БЕЗ фон */
.loc-item {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important; /* Напълно прозрачен фон */
    border: none !important; /* Премахва абсолютно всички рамки */
    padding: 0 !important; /* Маха излишното празно пространство на кутията */
    box-shadow: none !important; /* Маха сенките около бокса */
    transform: none !important; /* Премахва каквото и да е движение */
    cursor: default !important; /* Стандартен курсор, без усещане за излишен бутон */
}

/* Премахване на ховър ефектите и за двете състояния */
.loc-item:hover {
    transform: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Премахване на изскачащите етикети (tooltips) */
.loc-item::after,
.loc-item:hover::after {
    display: none !important;
    content: none !important;
}

/* КОРИГИРАНЕ НА ЗНАМЕНАТА – ЗА ДА ИЗГЛЕЖДАТ РЕАЛНИ И ЕСТЕСТВЕНИ */
.loc-f {
    width: 72px !important;  /* Професионален, лесно забележим размер */
    height: 48px !important; /* Точно съотношение 3:2 за истински вид на флаговете */
    border-radius: 4px !important; /* Фин умерено заоблен ръб на самото платно */
    display: block !important;
    object-fit: cover !important; /* Предпазва софтуерно флаговете от разтягане и деформация */
    
    /* Добавяне на пластови фини сенки, за да изглежда платното обемно и истинско */
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16)) 
            drop-shadow(0 1px 3px rgba(0, 0, 0, 0.1)) !important;
    
    transition: filter 0.3s ease !important;
}

/* При задържане на мишката върху знамето се активира единствено вълнообразната анимация, без да мърда самата икона */
.loc-item:hover .loc-f {
    filter: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.25)) url(#flagWave) !important;
}




/**/
/* Контейнер на цялата секция */
.map-box-section {
    width: 100%;
    max-width: 1920px;
    margin: 60px auto;
    padding: 40px 0px;
    text-align: center;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0,0,0,0.03);
    border: 1px solid #f3f4f6;
    box-sizing: border-box;
}

.map-box-section h2 {
    font-size: 2.2rem;
    color: #111827;
    margin-bottom: 12px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.map-box-desc {
    color: #4b5563;
    font-size: 1.1rem;
    max-width: 600px;
    margin: 0 auto 40px auto;
    line-height: 1.6;
}

.map-wrapper {
    width: 100%;
    max-width: 950px;
    margin: 0 auto;
    position: relative;
}

/* Стил за реалната географска карта (Сив хостинг нюанс) */
.real-world-map-svg {
    width: 100%;
    height: auto;
    display: block;
}

.real-world-map-svg path {
    fill: #f3f4f6 !important; /* Професионално светло сиво */
    stroke: #ffffff !important; /* Чисти бели граници */
    stroke-width: 0.6px !important;
}

/* ДИЗАЙН НА ЗЕЛЕНИТЕ ХОСТИНГ ТОЧКИ */
.h-dot {
    position: absolute;
    width: 13px;
    height: 13px;
    background-color: #10b981;
    border: 2px solid #ffffff;
    border-radius: 50%;
    cursor: pointer;
    transform: translate(-50%, -50%);
    transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), background-color 0.2s ease;
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6);
    animation: hPulseNode 2s infinite;
    z-index: 10;
}

/* ЕФЕКТ ПО-ГОЛЕМИ: При посочване с мишката стават с 60% по-големи */
.h-dot:hover {
    transform: translate(-50%, -50%) scale(1.6) !important;
    background-color: #059669;
    z-index: 100;
    animation: none;
}

/* Централен дата център България — пулсира по-силно за фокус */
.h-dot.core-node-dot {
    width: 15px;
    height: 15px;
    background-color: #059669;
    animation: hPulseCore 1.8s infinite;
}

@keyframes hPulseNode {
    0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.5); }
    70% { box-shadow: 0 0 0 11px rgba(16, 185, 129, 0); }
    100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

@keyframes hPulseCore {
    0% { box-shadow: 0 0 0 0 rgba(5, 150, 105, 0.6); }
    70% { box-shadow: 0 0 0 15px rgba(5, 150, 105, 0); }
    100% { box-shadow: 0 0 0 0 rgba(5, 150, 105, 0); }
}

/* Черен информационен балон при посочване */
.h-dot .h-tooltip {
    visibility: hidden;
    width: 220px;
    background-color: #111827;
    color: #ffffff;
    text-align: center;
    border-radius: 6px;
    padding: 7px 12px;
    position: absolute;
    z-index: 101;
    bottom: 160%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.2s ease, bottom 0.2s ease;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
    pointer-events: none;
    white-space: nowrap;
}

.h-dot .h-tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -6px;
    border-width: 6px;
    border-style: solid;
    border-color: #111827 transparent transparent transparent;
}

.h-dot:hover .h-tooltip {
    visibility: visible;
    opacity: 1;
    bottom: 185%;
}
.map-wrapper {
    width: 120%;
    max-width: 1600px; /* ТУК СМЕНЯТЕ СТОЙНОСТТА, ЗА ДА СЕ УВЕЛИЧИ КАРТАТА */
    margin: 0 auto;
    position: relative;
}


/*нов код*/


/* Контейнер за подредба на флаговете */
.loc-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}

/* Стил за отделната локация/бутон */
.loc-item {
  position: relative;
  width: 90px;
  cursor: pointer;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  display: inline-block;
}

/* Плавно изскачане при задържане на мишката */
.loc-item:hover {
  transform: translateY(-5px);
}

/* Подобрен вид и дълбочина за самите SVG флагове, запазвайки анимацията */
.loc-f {
  width: 100%;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transition: box-shadow 0.3s ease;
  display: block;
}

/* По-силна сянка за фокус при ховър */
.loc-item:hover .loc-f {
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
}

/* Специален акцент за основната локация (България) */
.loc-item.is-main .loc-f {
  box-shadow: 0 4px 16px rgba(0, 150, 110, 0.35);
  border: 2px solid #00966E;
}

/* Скриване на текстовия етикет за екранни четци, без да се чупи структурата */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/**/

.loc-item {
  display: inline-block;
  position: relative;
  border: none !important;
  box-shadow: none !important;
  background: transparent;
  transform: none !important;
  transition: none !important;
}

.loc-item:hover {
  transform: none !important;
  box-shadow: none !important;
}

.loc-f {
  width: 100%;
  height: auto;
  border: none !important;
  box-shadow: none !important;
  display: block;
  shape-rendering: geometricPrecision;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  image-rendering: -webkit-optimize-contrast;
  transform: none !important;
  transition: none !important;
}

.loc-item:hover .loc-f,
.loc-item:focus .loc-f,
.loc-item.is-main .loc-f {
  border: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
}
/**/


/* Основен контейнер за трите карти */
.rate-bar-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    max-width: 1200px;
    margin: 40px auto;
    padding: 20px;
    background-color: #ffffff; /* Бял фон на секцията */
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); /* Лека елегантна сянка */
}

/* Индивидуална карта за оценка */
.rate-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    flex: 1;
    min-width: 200px;
    padding: 15px;
}

/* Контейнер за логата на платформите */
.platform-logo {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}

/* Универсални правила за изображенията */
.platform-logo img {
    max-height: 100%;
    width: auto;
    object-fit: contain;
}

/* Конкретни размери за логата, спрямо техните класове */
.logo-img-tp { max-width: 140px; }
.logo-img-g  { max-width: 110px; }
.logo-img-fb { max-width: 40px; }

/* Стилизиране на звездите (Trustpilot & Google) */
.stars-container {
    display: flex;
    gap: 2px;
    margin-bottom: 8px;
}

.star {
    color: #ffb600; /* Златисто-жълт цвят за звездите */
    font-size: 22px;
    line-height: 1;
}

/* Текстов рейтинг (например: 4.8 / 4.9) */
.rate-score {
    font-size: 24px;
    font-weight: 700;
    color: #0e2745; /* Тъмносиният цвят от вашата тема 'theme.color' */
    margin-bottom: 4px;
}

/* Стилизиране на Facebook процентите (97%) */
.fb-percent {
    font-size: 32px;
    font-weight: 800;
    color: #1877f2; /* Оригинално Facebook синьо */
    margin-bottom: 4px;
    line-height: 1;
}

/* Стилизиране на "Препоръчват" текста под процентите */
.fb-recommend {
    font-size: 15px;
    font-weight: 600;
    color: #1877f2;
    display: flex;
    align-items: center;
    gap: 5px;
}

.check-icon {
    font-size: 14px;
}

/* Брой отзиви (малък сив текст най-отдолу) */
.rate-count {
    font-size: 14px;
    color: #64748b; /* Модерен slate/сив цвят за второстепенен текст */
    font-weight: 500;
}

/* Разделителни линии (вертикални на десктоп) */
.divider {
    width: 1px;
    height: 60px;
    background-color: #e2e8f0; /* Светло сив разделител */
}

/* Адаптивност за мобилни телефони (под 768px) */
@media (max-width: 768px) {
    .rate-bar-container {
        flex-direction: column; /* Подрежда боксовете един под друг */
        gap: 30px;
        padding: 30px 15px;
    }
    
    /* Промяна на разделителя от вертикален в хоризонтален за мобилни */
    .divider {
        width: 80%;
        height: 1px;
    }
    
    .rate-card {
        width: 100%;
    }
}
/**/


/* Главният контейнер (вашият код, леко оптимизиран) */
.rev-scores {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center; /* Центрира ги вертикално в контейнера */
    width: 100%;
    z-index: 1;
    margin: 20px auto;
}

/* Всяка отделна карта (ПРОМЕНЕНО: превърната във flex колона) */
.rev-score {
    display: flex;
    flex-direction: column; /* Подрежда елементите един под друг */
    align-items: center;    /* Центрира елементите хоризонтално вътре в картата */
    justify-content: center;/* Центрира елементите вертикално */
    text-align: center;
    min-width: 345px;
    padding: 10px;
}

/* Името на източника (Trustpilot, Google, Facebook) */
.rev-score .src {
    font-size: 16px;
    font-weight: 700;
    color: #0e2745;
    margin-bottom: 8px;
}

/* Контейнерът за SVG звездите */
.rev-score .stars {
    display: flex;
    justify-content: center;
    gap: 2px;
    margin-bottom: 6px;
}

/* Размери и цвят на самите SVG звезди */
.rev-score .stars svg {
    width: 20px;
    height: 20px;
    color: #ffb600; /* Златисто-жълти звезди */
}

/* Рейтингът (4,9 / 4,8 / 97%) */
.rev-score b {
    font-size: 22px;
    font-weight: 800;
    color: #0e2745;
    margin-bottom: 4px;
    line-height: 1.2;
}

/* Текстът най-отдолу (от 218 отзива...) */
.rev-score span:not(.src):not(.stars) {
    font-size: 13px;
    color: #64748b;
    font-weight: 500;
}
#plans{
    background: #cffb804f;
}




/* Основен контейнер за целия бокс */
.sh-all {
    max-width: 1200px;
    margin: 0px auto;
    padding: 30px;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(14, 39, 69, 0.06); /* Лека, модерна дълбочина */
    border: 1px solid rgba(14, 39, 69, 0.04);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;
}

/* Раздвижване на целия бокс при посочване */
.sh-all:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(14, 39, 69, 0.1);
}

/* Хедър на бокса (Заглавие + Хапче) */
.sh-all-h {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 2px dashed #f1f5f9; /* Елегантна разделителна линия */
}

/* Заглавие */
.sh-all-h b {
    font-size: 22px;
    font-weight: 800;
    color: #0e2745; /* Водещ тъмносин цвят */
    letter-spacing: -0.5px;
}

/* Пулсиращ ефект за етикета "без доплащане" */
.sh-all-h .pill.p-ok {
    background: #edfdd24f;
    color: #69c90e;
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    box-shadow: 0 0 0 0 rgba(2, 122, 72, 0.2);
    animation: pulseGlow 2s infinite;
}

@keyframes pulseGlow {
    0% { box-shadow: 0 0 0 0 rgba(2, 122, 72, 0.2); }
    70% { box-shadow: 0 0 0 8px rgba(2, 122, 72, 0); }
    100% { box-shadow: 0 0 0 0 rgba(2, 122, 72, 0); }
}

/* Контейнер за списъка с екстри - подредба в 2 колони */
.sh-all-l {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

/* Индивидуален елемент (Екстра) */
.sh-all-l > div {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: #edfdd24f; /* Лек сив фон за всяка плочка */
    border-radius: 10px;
    border: 1px solid transparent;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: default;
}

/* Интерактивен Hover ефект за всяка отделна екстра */
.sh-all-l > div:hover {
    background: #ffffff;
    border-color: #4e950a; /* Променя границата в зелено */
    transform: translateX(4px); /* Леко движение надясно */
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.08);
}

/* Кръгчето около зелената отметка */
.sh-fi {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: #69c90e; /* Ярко зелено */
    color: #ffffff;
    border-radius: 50%;
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

/* Завъртане на отметката, когато потребителят посочи елемента */
.sh-all-l > div:hover .sh-fi {
    transform: scale(1.1) rotate(8deg);
}

/* Размер на самата SVG отметка */
.sh-fi svg {
    width: 14px;
    height: 14px;
}

/* Текстът на самата екстра */
.sh-all-l > div span:not(.sh-fi) {
    font-size: 15px;
    font-weight: 500;
    color: #334155;
    transition: color 0.2s ease;
}

/* Промяна на цвета на текста при посочване */
.sh-all-l > div:hover span:not(.sh-fi) {
    color: #0e2745;
}

/* Адаптивност за мобилни устройства */
@media (max-width: 640px) {
    .sh-all {
        padding: 20px;
        margin: 20px 10px;
    }
    
    .sh-all-h {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    /* Сгъване в 1 колона на мобилни екрани */
    .sh-all-l {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .sh-all-l > div:hover {
        transform: none; /* Изключваме хоризонталното мърдане за тъч екрани */
    }
}






/* Основна секция */
.sec#which {
    background-color: #f8fafc; /* Светъл, модерен фон за контраст */
    padding: 80px 20px;
}

/* Общ контейнер */
.sec#which .wrap-w {
    max-width: 1100px;
    margin: 0 auto;
}

/* Заглавна част */
.sh-head {
    text-align: center;
    margin-bottom: 50px;
}

.sh-head h2 {
    font-size: 32px;
    font-weight: 800;
    color: #0e2745; /* Основен корпоративен цвят */
    margin-bottom: 12px;
    letter-spacing: -0.5px;
}

.sh-head p {
    font-size: 16px;
    color: #64748b;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Контейнер за трите случая/карти */
.sh-cases {
    display: flex;
    gap: 24px;
    justify-content: center;
    margin-bottom: 40px;
}

/* Индивидуална карта (Случай от практиката) */
.sh-case {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 30px 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Подравняване вляво за по-елегантен вид */
    position: relative;
    overflow: hidden;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Интерактивен Hover ефект за картите */
.sh-case:hover {
    transform: translateY(-6px);
    border-color: transparent;
    box-shadow: 0 15px 35px rgba(14, 39, 69, 0.08);
}

/* Стилизиране на иконите (всеки случай получава нежен цветен фон) */
.sh-case-ic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: #eff6ff; /* Лек син фон */
    color: #2563eb; /* Ярко синя икона */
    border-radius: 12px;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}

/* Раздвижване на иконата при посочване на картата */
.sh-case:hover .sh-case-ic {
    background: #0e2745;
    color: #ffffff;
    transform: scale(1.05);
}

.sh-case-ic svg {
    width: 24px;
    height: 24px;
}

/* Подзаглавия в картите */
.sh-case h3 {
    font-size: 18px;
    font-weight: 700;
    color: #0e2745;
    margin-bottom: 12px;
}

/* Описание */
.sh-case p {
    font-size: 14px;
    color: #475569;
    line-height: 1.6;
    margin-bottom: 24px;
    flex-grow: 1; /* Избутва финалния съвет винаги най-отдолу, за да са подравнени */
}

/* Финален съвет ("Стига ти най-малкия") */
.sh-case-p {
    font-size: 14px;
    color: #334155;
    background: #f1f5f9;
    padding: 8px 14px;
    border-radius: 8px;
    width: 100%; /* Разпъва се по цялата широчина на картата */
    box-sizing: border-box;
    text-align: center;
    font-weight: 500;
    transition: all 0.3s ease;
}

.sh-case-p b {
    color: #0e2745;
    font-weight: 700;
}

/* Акцент върху съвета при hover */
.sh-case:hover .sh-case-p {
    background: #e1fbf2; /* Нежно зелено, подсказващо правилен избор */
    color: #027a48;
}

.sh-case:hover .sh-case-p b {
    color: #027a48;
}

/* Текст най-отдолу ("Не си сигурен?") */
.sh-ask {
    text-align: center;
    font-size: 15px;
    color: #475569;
    margin-top: 30px;
    font-weight: 500;
}

.sh-ask a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 700;
    border-bottom: 2px solid rgba(37, 99, 235, 0.2);
    padding-bottom: 2px;
    transition: all 0.2s ease;
}

.sh-ask a:hover {
    color: #0e2745;
    border-bottom-color: #0e2745;
}

/* Адаптивност за таблети и мобилни устройства */
@media (max-width: 900px) {
    .sh-cases {
        flex-direction: column; /* Нарежда картите една под друга */
        gap: 20px;
    }
    
    .sh-case {
        align-items: center; /* Центрира съдържанието на мобилен за по-добър фокус */
        text-align: center;
    }

    .sh-case p {
        margin-bottom: 16px;
    }
}




/* Основен контейнер и фон на секцията */
section#which.sec {
  background-color: #fafafa !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

section#which .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* Заглавна част */
section#which .sh-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}

section#which .sh-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 12px !important;
}

section#which .sh-head p {
  font-size: 1.1rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
}

/* Мрежа с карти */
section#which .sh-cases {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 24px !important;
  margin-bottom: 40px !important;
}

/* Дизайн на картите: бели, със заобляне и мека сянка */
section#which .sh-case {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

/* Ховър ефект с леко повдигане */
section#which .sh-case:hover {
  transform: translateY(-4px) !important;
  border-color: #d1d5db !important;
  box-shadow: 0 12px 20px -3px rgba(0, 0, 0, 0.05) !important;
}

/* Пълно скриване на иконите */
section#which .sh-case-ic {
  display: none !important;
}

/* Стил на заглавията (h3) според изискването ти */
section#which .sh-case h3 {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  margin: 0 0 14px 0 !important;
  padding-left: 12px !important;
  border-left: 3px solid #7cbf00 !important;
  letter-spacing: -0.3px !important;
  transition: border-color 0.3s ease, color 0.3s ease !important;
}

/* Текст в картите */
section#which .sh-case p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  flex-grow: 1 !important;
  margin-bottom: 20px !important;
}

/* Долен етикет (план) */
section#which .sh-case-p {
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background-color: #f9fafb !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  display: inline-block !important;
  align-self: flex-start !important;
  border: 1px solid #f3f4f6 !important;
}

section#which .sh-case-p b {
  color: #305a08 !important;
}

/* Текст и линк най-долу */
section#which .sh-ask {
  text-align: center !important;
  font-size: 0.95rem !important;
  color: #4b5563 !important;
}

section#which .sh-ask a {
  color: #305a08 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

section#which .sh-ask a:hover {
  text-decoration: underline !important;
}

section#which .sh-case:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}




/* Основен контейнер и фон на новата секция */
div.wrap-w:has(.sh-why) {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

/* Заглавна част */
div.wrap-w .sh-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}

div.wrap-w .sh-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 12px !important;
}

div.wrap-w .sh-head p {
  font-size: 1.1rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
}

/* Мрежа с карти (.sh-why) */
.sh-why {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 24px !important;
}

/* Дизайн на картите (.sh-why-i): бели, заоблени, със същия ховър ефект */
.sh-why-i {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

.sh-why-i:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Премахване на иконите */
.sh-why-ic {
  display: none !important;
}

/* Голямо число (0,4 s, 99,98% и т.н.) */
.sh-why-n {
  font-size: 2.25rem !important;
  font-weight: 800 !important;
  color: #305a08 !important;
  margin-bottom: 12px !important;
  letter-spacing: -1px !important;
  line-height: 1 !important;
}

/* Заглавие (b таг) с твоите точни изисквания */
.sh-why-i b {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  margin: 0 0 14px 0 !important;
  padding-left: 12px !important;
  border-left: 3px solid #7cbf00 !important;
  letter-spacing: -0.3px !important;
  display: block !important;
  transition: border-color 0.3s ease, color 0.3s ease !important;
}

/* Описание (p таг) */
.sh-why-i p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  flex-grow: 1 !important;
}


/*3*/


/* Стилът важи само за секцията с отзиви на клиентите */
section.sec:has(.sh-revs) {
  background: #ffffff !important;
  background-image: radial-gradient(circle at 10% 20%, rgba(152, 219, 28, 0.08) 0%, transparent 40%), radial-gradient(circle at 90% 80%, rgba(152, 219, 28, 0.05) 0%, transparent 40%) !important;
  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
}

section.sec:has(.sh-revs) .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Заглавна част само за тази секция */
section.sec:has(.sh-revs) .sh-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  margin-bottom: 50px !important;
  background: #ffffff !important;
  padding: 40px 30px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;
  position: relative !important;
}

section.sec:has(.sh-revs) .sh-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 10px !important;
  letter-spacing: -0.5px !important;
}

section.sec:has(.sh-revs) .sh-head p {
  font-size: 1.05rem !important;
  color: #4b5563 !important;
  margin-bottom: 0 !important;
}

/* Мрежа (Grid) за самите отзиви */
section.sec:has(.sh-revs) .sh-revs {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 24px !important;
}

/* Дизайн на индивидуалната карта с отзив */
section.sec:has(.sh-revs) .sh-rev {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

section.sec:has(.sh-revs) .sh-rev:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Звезди в картата */
section.sec:has(.sh-revs) .sh-rev-stars {
  display: flex !important;
  gap: 4px !important;
  color: #f59e0b !important;
  width: 90px !important;
  height: 18px !important;
  margin-bottom: 16px !important;
}

/* Текст на отзива */
section.sec:has(.sh-revs) .sh-rev p {
  font-size: 0.98rem !important;
  color: #374151 !important;
  line-height: 1.6 !important;
  flex-grow: 1 !important;
  margin: 0 0 24px 0 !important;
}

/* Автор на отзива и аватар */
section.sec:has(.sh-revs) .sh-rev-who {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-top: 1px solid #f3f4f6 !important;
  padding-top: 16px !important;
}

section.sec:has(.sh-revs) .sh-rev-av {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #305a08, #69c90e) !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  flex-shrink: 0 !important;
}

section.sec:has(.sh-revs) .sh-rev-who span span {
  display: block !important;
  font-size: 0.85rem !important;
  color: #6b7280 !important;
  font-weight: 400 !important;
  margin-top: 2px !important;
}

section.sec:has(.sh-revs) .sh-rev-who b {
  font-size: 0.95rem !important;
  color: #111827 !important;
  font-weight: 600 !important;
}


/*4*/



/* Стил за секцията с отзиви (WordPress страница) */
section.sec:has(.wp-revs),
.wp-revs {
  all: unset;
}

div:has(> .wrap-w > .wp-revs) {
  background: #ffffff !important;
  background-image: radial-gradient(circle at 10% 20%, rgba(152, 219, 28, 0.08) 0%, transparent 40%), radial-gradient(circle at 90% 80%, rgba(152, 219, 28, 0.05) 0%, transparent 40%) !important;
  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
  display: block !important;
  width: 100% !important;
}

div:has(> .wrap-w > .wp-revs) .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Заглавна част */
div:has(> .wrap-w > .wp-revs) .wp-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  margin-bottom: 50px !important;
  background: #ffffff !important;
  padding: 40px 30px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;
  position: relative !important;
}

div:has(> .wrap-w > .wp-revs) .wp-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 10px !important;
  letter-spacing: -0.5px !important;
}

div:has(> .wrap-w > .wp-revs) .wp-head p {
  font-size: 1.05rem !important;
  color: #4b5563 !important;
  margin-bottom: 0 !important;
}

/* Мрежа (Grid) за отзивите */
.wp-revs {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 24px !important;
  width: 100% !important;
}

/* Индивидуална карта */
.wp-rev {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

.wp-rev:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Звезди */
.wp-rev-stars {
  display: flex !important;
  gap: 4px !important;
  color: #f59e0b !important;
  width: 90px !important;
  height: 18px !important;
  margin-bottom: 16px !important;
}

/* Текст на отзива */
.wp-rev p {
  font-size: 0.98rem !important;
  color: #374151 !important;
  line-height: 1.6 !important;
  flex-grow: 1 !important;
  margin: 0 0 24px 0 !important;
}

/* Автор и аватар */
.wp-rev-who {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-top: 1px solid #f3f4f6 !important;
  padding-top: 16px !important;
}

.wp-rev-av {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #305a08, #69c90e) !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  flex-shrink: 0 !important;
}

.wp-rev-who span span {
  display: block !important;
  font-size: 0.85rem !important;
  color: #6b7280 !important;
  font-weight: 400 !important;
  margin-top: 2px !important;
}

.wp-rev-who b {
  font-size: 0.95rem !important;
  color: #111827 !important;
  font-weight: 600 !important;
}

.wp-flow-s.is-ok .wp-flow-n {
    background: #7cbf00;
    color: #fff;
}
.wp-flow-note {
    margin: 18px 0 0;
    padding: 12px 14px;
    border-radius: var(--r, 10px);
    background: rgba(18, 122, 85, .16);
    border: 1px solid rgba(111, 217, 172, .24);
    font-size: 12.5px;
    color: #7cbf00;
    line-height: 1.6;
}
.wp-notes i {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    background: #7cbf00d6;
    color: #ffffff;
}


/*5*/

/* Разпределение на мрежата да показва точно по 4 карти на ред */
.wp-all-l {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 20px !important;
}

/* Адаптивност за мобилни устройства и таблети */
@media (max-width: 1024px) {
  .wp-all-l {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 640px) {
  .wp-all-l {
    grid-template-columns: 1fr !important;
  }
}

/* Общ стил на картите, взаимстван от .svc-card */
.wp-all-l > div,
.wp-all-l a {
  position: relative !important;
  overflow: hidden !important;
  text-decoration: none !important;
  color: inherit !important;
  background: #5E9A000D !important;
  border: 1.5px solid #7cbf00 !important;
  border-radius: 26px !important;
  padding: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform .22s cubic-bezier(.2, .9, .2, 1), box-shadow .22s, border-color .22s !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02) !important;
}

.wp-all-l > div:hover,
.wp-all-l a:hover {
  transform: translateY(-4px) !important;
  border-color: #69c90e !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.12) !important;
  background: #ffffff !important;
}

/* Икона */
.wp-all-l .wp-fi {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  background: #f0fdf4 !important;
  color: #305a08 !important;
  border-radius: 14px !important;
  margin-bottom: 16px !important;
  flex-shrink: 0 !important;
  border: 1px solid rgba(152, 219, 28, 0.3) !important;
}

.wp-all-l .wp-fi svg {
  width: 22px !important;
  height: 22px !important;
}

/* Текст на елемента */
.wp-all-l > div span:not(.wp-fi),
.wp-all-l a span:not(.wp-fi) {
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: #111827 !important;
  line-height: 1.4 !important;
}

/* Главна обвивка на секцията */
.wp-all {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 32px !important;
  padding: 40px !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;
}

.wp-all-h {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin-bottom: 30px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid #f3f4f6 !important;
}

.wp-all-h b {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  letter-spacing: -0.5px !important;
}

.wp-all-h .pill.p-ok {
  background-color: #f0fdf4 !important;
  color: #305a08 !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;
  padding: 6px 14px !important;
  border-radius: 20px !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
}
.wp-shield-ic {
    width: 38px;
    height: 38px;
    border-radius: 11px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    background: #7cbf0021;
    color: #7cbf00;
}
.wp-speed-fill {
    height: 100%;
    border-radius: 99px;
    background: #7cbf00;
}
/*6*/

/* Прилагане на точния дизайн от .svc-card върху блоковете в новата секция за скорост */
.wp-speed {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px !important;
  align-items: stretch !important;
}

/* Лява кутия (графиките) и дясната кутия (.wp-speed-i) с дизайн на .svc-card */
.wp-speed-box,
.wp-speed-i {
  position: relative !important;
  overflow: hidden !important;
  background: rgba(183, 255, 53, 0.04) !important;
  border: 1.5px solid #305a08 !important;
  border-radius: 26px !important;
  padding: 30px !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform .22s cubic-bezier(.2, .9, .2, 1), box-shadow .22s, border-color .22s !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02) !important;
}

.wp-speed-box:hover,
.wp-speed-i:hover {
  transform: translateY(-4px) !important;
  border-color: #69c90e !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.12) !important;
  background: #ffffff !important;
}

/* Вътрешна организация на дясната колона .wp-speed-l */
.wp-speed-l {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
}

/* Стил за отделните елементи в .wp-speed-i */
.wp-speed-i {
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 18px !important;
  padding: 24px !important;
}

/* Икони (в стил .svc-ic) */
.wp-speed-ic {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  background: #f0fdf4 !important;
  color: #305a08 !important;
  border-radius: 14px !important;
  flex-shrink: 0 !important;
  border: 1px solid rgba(48, 90, 8, 0.2) !important;
}

.wp-speed-ic svg {
  width: 24px !important;
  height: 24px !important;
}

/* Типография и текстове в дясната колона */
.wp-speed-i > span {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.wp-speed-i b {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  letter-spacing: -0.2px !important;
}

.wp-speed-i p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

/* Стил за левия панел с измерванията */
.wp-speed-h {
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 24px !important;
  letter-spacing: -0.3px !important;
}

.wp-speed-r {
  margin-bottom: 18px !important;
}

.wp-speed-t {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 0.92rem !important;
  color: #4b5563 !important;
  margin-bottom: 8px !important;
  font-weight: 500 !important;
}

.wp-speed-t b {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  background: #f0fdf4 !important;
  padding: 2px 8px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(48, 90, 8, 0.2) !important;
}

.wp-speed-bar {
  width: 100% !important;
  height: 10px !important;
  background: #e5e7eb !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.wp-speed-fill {
  height: 100% !important;
  background: linear-gradient(90deg, #305a08, #69c90e) !important;
  border-radius: 6px !important;
}

.wp-speed-fill.slow {
  background: linear-gradient(90deg, #9ca3af, #6b7280) !important;
}

.wp-speed-note {
  font-size: 0.85rem !important;
  color: #6b7280 !important;
  margin-top: 20px !important;
  line-height: 1.4 !important;
  border-top: 1px solid #e5e7eb !important;
  padding-top: 14px !important;
}

/* Адаптивност за таблети и мобилни устройства */
@media (max-width: 968px) {
  .wp-speed {
    grid-template-columns: 1fr !important;
  }
}
.wp-speed-ic {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    background: #ffffff !important;
    color: #7cbf00 !important;
    border-radius: 14px !important;
    flex-shrink: 0 !important;
    border: 1px solid rgba(48, 90, 8, 0.2) !important;
}

.wp-move-safe {
    margin-top: 20px;
    padding: 13px 15px;
    border-radius: var(--r, 10px);
    background: rgb(152 219 28 / 24%);
    border: 1px solid rgba(111, 217, 172, .24);
    font-size: 12.5px;
    color: #7cbf00;
    line-height: 1.6;
}


/*7*/
.sec-wash {
  background: #ffffff;
  padding: 80px 0;
}

.sec-wash .wp-head {
  text-align: center;
  max-width: 600px;
  margin: 0 auto 50px;
}

.sec-wash .wp-head h2 {
  font-size: 2.25rem;
  font-weight: 800;
  color: #1a2e05;
  letter-spacing: -0.025em;
  margin-bottom: 12px;
}

.sec-wash .wp-head p {
  font-size: 1.1rem;
  color: #4a5c3a;
  line-height: 1.6;
}

.wp-cases {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  margin-bottom: 40px;
}

.wp-case {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 36px 30px !important;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.wp-case:hover {
  transform: translateY(-6px);
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.wp-case-ic {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: rgba(183, 255, 53, 0.15);
  color: #305a08;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
  transition: background 0.3s, color 0.3s;
}

.wp-case:hover .wp-case-ic {
  background: rgba(105, 201, 14, 0.25);
  color: #1a2e05;
}

.wp-case-ic svg {
  width: 26px;
  height: 26px;
}

.wp-case h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1a2e05;
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}

.wp-case p {
  font-size: 0.95rem;
  color: #4a5c3a;
  line-height: 1.6;
  margin-bottom: 28px;
  flex-grow: 1;
}

.wp-case-p {
  font-size: 0.9rem;
  color: #1a2e05;
  background: rgba(183, 255, 53, 0.1);
  border: 1px solid rgba(152, 219, 28, 0.2);
  padding: 12px 16px;
  border-radius: 12px;
  display: block;
  text-align: center;
  font-weight: 500;
}

.wp-case-p b {
  color: #305a08;
  font-weight: 700;
}

.wp-ask {
  text-align: center;
  font-size: 1rem;
  color: #4a5c3a;
  margin-top: 10px;
}

.wp-ask a {
  color: #305a08;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px dashed #69c90e;
  padding-bottom: 1px;
  transition: color 0.2s, border-color 0.2s;
}

.wp-ask a:hover {
  color: #1a2e05;
  border-color: #305a08;
}
/*8 faq*/

/* Стил за FAQ секцията с цветовете и дизайна на сайта */
.wp-faq {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
  margin-top: 40px;
}

.wp-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative;
  cursor: pointer;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.wp-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.wp-faq-i h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1a2e05;
  margin: 0;
  padding-right: 25px;
  position: relative;
}

/* Иконка плюс/минус за акордеона */
.wp-faq-i h3::after {
  content: '+';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.25rem;
  color: #305a08;
  font-weight: 400;
  transition: transform 0.3s ease;
}

.wp-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg);
}

.wp-faq-i .wp-faq-n {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #305a08;
  background: rgba(183, 255, 53, 0.2);
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 12px;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.wp-faq-i p {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  margin: 0;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease;
  font-size: 0.95rem;
  color: #4a5c3a;
  line-height: 1.6;
}

.wp-faq-i.is-open p {
  max-height: 300px;
  opacity: 1;
  margin-top: 14px;
}

/*9faq*/



/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за оригиналните класове) */
.sh-faq {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
  margin-top: 40px;
}

.sh-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative;
  cursor: pointer;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.sh-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.sh-faq-i h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1a2e05;
  margin: 0;
  padding-right: 25px;
  position: relative;
}

/* Иконка плюс/минус за акордеона */
.sh-faq-i h3::after {
  content: '+';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.25rem;
  color: #305a08;
  font-weight: 400;
  transition: transform 0.3s ease;
}

.sh-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg);
}

.sh-faq-i .sh-faq-n {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #305a08;
  background: rgba(183, 255, 53, 0.2);
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 12px;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.sh-faq-i p {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  margin: 0;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease;
  font-size: 0.95rem;
  color: #4a5c3a;
  line-height: 1.6;
}

.sh-faq-i.is-open p {
  max-height: 300px;
  opacity: 1;
  margin-top: 14px;
}

/*10wordpress-hosting Кой план ми трябва?*/


/* Основен контейнер и фон на секцията */
section.sec-wash {
  background-color: #fafafa;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

section.sec-wash .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* Заглавна част */
section.sec-wash .wp-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}

section.sec-wash .wp-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 12px !important;
}

section.sec-wash .wp-head p {
  font-size: 1.1rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
}

/* Мрежа с карти */
section.sec-wash .wp-cases {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 24px !important;
  margin-bottom: 40px !important;
}

/* Дизайн на картите: бели, със заобляне и мека сянка */
section.sec-wash .wp-case {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

/* Пълно скриване на иконите */
section.sec-wash .wp-case-ic {
  display: none !important;
}

/* Стил на заглавията (h3) според изискването ти */
section.sec-wash .wp-case h3 {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  margin: 0 0 14px 0 !important;
  padding-left: 12px !important;
  border-left: 3px solid #7cbf00 !important;
  letter-spacing: -0.3px !important;
  transition: border-color 0.3s ease, color 0.3s ease !important;
}

/* Текст в картите */
section.sec-wash .wp-case p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  flex-grow: 1 !important;
  margin-bottom: 20px !important;
}

/* Долен етикет (план) */
section.sec-wash .wp-case-p {
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background-color: #f9fafb !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  display: inline-block !important;
  align-self: flex-start !important;
  border: 1px solid #f3f4f6 !important;
}

section.sec-wash .wp-case-p b {
  color: #305a08 !important;
}

/* Текст и линк най-долу */
section.sec-wash .wp-ask {
  text-align: center !important;
  font-size: 0.95rem !important;
  color: #4b5563 !important;
}

section.sec-wash .wp-ask a {
  color: #305a08 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

section.sec-wash .wp-ask a:hover {
  text-decoration: underline !important;
}

/* Ховър ефект с леко повдигане */
section.sec-wash .wp-case:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/*11 biznes-hosting Кой план ми трябва?*/



/* Основен контейнер и фон на секцията */
section.sec-wash {
  background-color: #fafafa;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

section.sec-wash .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* Заглавна част */
section.sec-wash .bz-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}


/*Не знаеш коя ти трябва? /naeti-sarvari/*/






#help.sec-wash {
  background-color: #fafafa;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}

#help .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

#help .ded-head {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 50px auto !important;
}

#help .ded-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 12px !important;
}

#help .ded-head p {
  font-size: 1.1rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
}

#help .ded-cases {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 24px !important;
  margin-bottom: 40px !important;
}

#help .ded-case {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

#help .ded-case:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow: 0 15px 30px rgba(105, 201, 14, 0.08), 0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

#help .ded-case-ic {
  display: none !important;
}

#help .ded-case h3 {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #305a08 !important;
  margin: 0 0 14px 0 !important;
  padding-left: 12px !important;
  border-left: 3px solid #7cbf00 !important;
  letter-spacing: -0.3px !important;
}

#help .ded-case p {
  font-size: 0.95rem !important;
  color: #4b5563 !important;
  line-height: 1.5 !important;
  flex-grow: 1 !important;
  margin-bottom: 20px !important;
}

#help .ded-case-p {
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background-color: #f9fafb !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  display: inline-block !important;
  align-self: flex-start !important;
  border: 1px solid #f3f4f6 !important;
}

#help .ded-case-p b {
  color: #305a08 !important;
}

#help .ded-ask {
  text-align: center !important;
  font-size: 0.95rem !important;
  color: #4b5563 !important;
}

#help .ded-ask a {
  color: #305a08 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

#help .ded-ask a:hover {
  text-decoration: underline !important;
}

/*biznes-hosting faq*/


/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за .bz-faq и .bz-faq-i) */
.bz-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.bz-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.bz-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.bz-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.bz-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.bz-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.bz-faq-i .bz-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.bz-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.bz-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}

/*/reseller-hosting/ faq */

/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за .rs-faq и .rs-faq-i) */
.rs-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.rs-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.rs-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.rs-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.rs-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.rs-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.rs-faq-i .rs-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.rs-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.rs-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}

/* vps faq*/

/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за оригиналните класове) */
.vp-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.vp-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.vp-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.vp-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.vp-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.vp-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.vp-faq-i .vp-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.vp-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.vp-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}

/*menidzhar-vps/faq*/


/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за mv класове) */
.mv-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.mv-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.mv-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.mv-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.mv-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.mv-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.mv-faq-i .mv-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.mv-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.mv-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}

/*naeti-sarvari/ faq*/


/* Стил за FAQ секцията с цветовете и дизайна на сайта (адаптиран за ded класове) */
.ded-faq {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.ded-faq-i {
  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;
  padding: 28px 25px !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
}

.ded-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.5) !important;
  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

.ded-faq-i h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a2e05 !important;
  margin: 0 !important;
  padding-right: 25px !important;
  position: relative !important;
}

/* Иконка плюс/минус за акордеона */
.ded-faq-i h3::after {
  content: '+' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.25rem !important;
  color: #305a08 !important;
  font-weight: 400 !important;
  transition: transform 0.3s ease !important;
}

.ded-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

.ded-faq-i .ded-faq-n {
  display: inline-block !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #305a08 !important;
  background: rgba(183, 255, 53, 0.2) !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 12px !important;
}

/* Скриване и плавно отваряне на отговорите (параграфите) */
.ded-faq-i p {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s ease, margin-top 0.3s ease !important;
  font-size: 0.95rem !important;
  color: #4a5c3a !important;
  line-height: 1.6 !important;
}

.ded-faq-i.is-open p {
  max-height: 300px !important;
  opacity: 1 !important;
  margin-top: 14px !important;
}


/*biznes-hosting/Какво казват фирмите*/

/* Стилът важи само за секцията с отзивите на фирмите */
section.sec:has(.bz-revs) {
  background: #ffffff !important;
  background-image:
    radial-gradient(circle at 10% 20%, rgba(152, 219, 28, 0.08) 0%, transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(152, 219, 28, 0.05) 0%, transparent 40%) !important;
  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
}

/* Контейнер */
section.sec:has(.bz-revs) .wrap-w {
  max-width: 1200px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Заглавна част */
section.sec:has(.bz-revs) .bz-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  margin-bottom: 50px !important;
  background: #ffffff !important;
  padding: 40px 30px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;
  position: relative !important;
}

/* Заглавие */
section.sec:has(.bz-revs) .bz-head h2 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-bottom: 10px !important;
  letter-spacing: -0.5px !important;
}

/* Подзаглавие */
section.sec:has(.bz-revs) .bz-head p {
  font-size: 1.05rem !important;
  color: #4b5563 !important;
  margin-bottom: 0 !important;
}

/* Grid на отзивите */
section.sec:has(.bz-revs) .bz-revs {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 24px !important;
}

/* Карта на отзив */
section.sec:has(.bz-revs) .bz-rev {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  padding: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}

/* Hover ефект */
section.sec:has(.bz-revs) .bz-rev:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(105, 201, 14, 0.35) !important;
  background: #ffffff !important;
  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}

/* Звезди */
section.sec:has(.bz-revs) .bz-rev-stars {
  display: flex !important;
  gap: 4px !important;
  color: #f59e0b !important;
  width: 90px !important;
  height: 18px !important;
  margin-bottom: 16px !important;
}

/* SVG звездите */
section.sec:has(.bz-revs) .bz-rev-stars svg {
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0 !important;
}

/* Текст на отзива */
section.sec:has(.bz-revs) .bz-rev p {
  font-size: 0.98rem !important;
  color: #374151 !important;
  line-height: 1.6 !important;
  flex-grow: 1 !important;
  margin: 0 0 24px 0 !important;
}

/* Автор */
section.sec:has(.bz-revs) .bz-rev-who {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-top: 1px solid #f3f4f6 !important;
  padding-top: 16px !important;
}

/* Аватар */
section.sec:has(.bz-revs) .bz-rev-av {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #305a08, #69c90e) !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  flex-shrink: 0 !important;
}

/* Вторият ред при автора */
section.sec:has(.bz-revs) .bz-rev-who span span {
  display: block !important;
  font-size: 0.85rem !important;
  color: #6b7280 !important;
  font-weight: 400 !important;
  margin-top: 2px !important;
}

/* Име на автора */
section.sec:has(.bz-revs) .bz-rev-who b {
  font-size: 0.95rem !important;
  color: #111827 !important;
  font-weight: 600 !important;
}


/* =========================
   МОБИЛНА ВЕРСИЯ
   ========================= */

@media (max-width: 768px) {
  section.sec:has(.bz-revs) {
    padding: 70px 16px !important;
  }

  section.sec:has(.bz-revs) .bz-head {
    padding: 30px 20px !important;
    margin-bottom: 35px !important;
    border-radius: 20px !important;
  }

  section.sec:has(.bz-revs) .bz-head h2 {
    font-size: 1.8rem !important;
  }

  section.sec:has(.bz-revs) .bz-head p {
    font-size: 0.95rem !important;
  }

  section.sec:has(.bz-revs) .bz-revs {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  section.sec:has(.bz-revs) .bz-rev {
    padding: 26px 22px !important;
  }

  section.sec:has(.bz-revs) .bz-rev:hover {
    transform: none !important;
  }
}
section.sec:has(.bz-revs) .wrap-w {
  display: block !important;
}

section.sec:has(.bz-revs) .bz-head {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto 50px auto !important;
  padding: 40px 30px !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

section.sec:has(.bz-revs) .bz-head h2 {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto 10px auto !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
  position: static !important;
  transform: none !important;
}

section.sec:has(.bz-revs) .bz-head p {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
  position: static !important;
  transform: none !important;
}


/*reseller-hosting/Какво казват партньорите*/

 /* =========================================
    СТИЛ ЗА СЕКЦИЯ "КАКВО КАЗВАТ ПАРТНЬОРИТЕ"
    ========================================= */

section.sec:has(.rs-revs) {
  background: #ffffff !important;
  background-image:
    radial-gradient(
      circle at 10% 20%,
      rgba(152, 219, 28, 0.08) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 80%,
      rgba(152, 219, 28, 0.05) 0%,
      transparent 40%
    ) !important;

  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec:has(.rs-revs) .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
}


/* =========================================
   ЗАГЛАВНА ЧАСТ
   ========================================= */

section.sec:has(.rs-revs) .rs-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  box-sizing: border-box !important;

  text-align: center !important;

  margin: 0 auto 50px auto !important;
  padding: 40px 30px !important;

  background: #ffffff !important;

  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;

  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;

  position: relative !important;
}


/* Заглавие */

section.sec:has(.rs-revs) .rs-head h2 {
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 auto 10px auto !important;
  padding: 0 !important;

  text-align: center !important;

  font-size: 2.25rem !important;
  font-weight: 700 !important;

  color: #111827 !important;

  letter-spacing: -0.5px !important;

  float: none !important;
}


/* Подзаглавие */

section.sec:has(.rs-revs) .rs-head p {
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 auto !important;
  padding: 0 !important;

  text-align: center !important;

  font-size: 1.05rem !important;
  color: #4b5563 !important;

  float: none !important;
}


/* =========================================
   GRID НА ОТЗИВИТЕ
   ========================================= */

section.sec:has(.rs-revs) .rs-revs {
  display: grid !important;

  grid-template-columns: repeat(
    auto-fit,
    minmax(320px, 1fr)
  ) !important;

  gap: 24px !important;

  width: 100% !important;
}


/* =========================================
   КАРТА НА ОТЗИВА
   ========================================= */

section.sec:has(.rs-revs) .rs-rev {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 32px !important;

  display: flex !important;
  flex-direction: column !important;

  position: relative !important;

  transition: all 0.25s ease-in-out !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;

  box-sizing: border-box !important;
}


/* Hover */

section.sec:has(.rs-revs) .rs-rev:hover {
  transform: translateY(-6px) !important;

  border-color: rgba(105, 201, 14, 0.35) !important;

  background: #ffffff !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ЗВЕЗДИ
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-stars {
  display: flex !important;

  align-items: center !important;

  gap: 4px !important;

  color: #f59e0b !important;

  width: 90px !important;
  height: 18px !important;

  margin-bottom: 16px !important;
}


/* SVG */

section.sec:has(.rs-revs) .rs-rev-stars svg {
  width: 18px !important;
  height: 18px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ТЕКСТ НА ОТЗИВА
   ========================================= */

section.sec:has(.rs-revs) .rs-rev > p {
  font-size: 0.98rem !important;

  color: #374151 !important;

  line-height: 1.6 !important;

  flex-grow: 1 !important;

  margin: 0 0 24px 0 !important;

  padding: 0 !important;
}


/* =========================================
   АВТОР
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-who {
  display: flex !important;

  align-items: center !important;

  gap: 14px !important;

  border-top: 1px solid #f3f4f6 !important;

  padding-top: 16px !important;
}


/* =========================================
   АВАТАР
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-av {
  width: 42px !important;
  height: 42px !important;

  min-width: 42px !important;

  border-radius: 50% !important;

  background: linear-gradient(
    135deg,
    #305a08,
    #69c90e
  ) !important;

  color: #ffffff !important;

  display: flex !important;

  align-items: center !important;
  justify-content: center !important;

  font-weight: 700 !important;

  font-size: 0.9rem !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ИМЕ НА АВТОРА
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-who b {
  display: block !important;

  font-size: 0.95rem !important;

  color: #111827 !important;

  font-weight: 600 !important;
}


/* =========================================
   ОПИСАНИЕ ПОД ИМЕТО
   ========================================= */

section.sec:has(.rs-revs) .rs-rev-who span span {
  display: block !important;

  font-size: 0.85rem !important;

  color: #6b7280 !important;

  font-weight: 400 !important;

  margin-top: 2px !important;
}


/* =========================================
   МОБИЛНА ВЕРСИЯ
   ========================================= */

@media (max-width: 768px) {

  section.sec:has(.rs-revs) {
    padding: 70px 16px !important;
  }

  section.sec:has(.rs-revs) .rs-head {
    padding: 30px 20px !important;

    margin-bottom: 35px !important;

    border-radius: 20px !important;
  }

  section.sec:has(.rs-revs) .rs-head h2 {
    font-size: 1.8rem !important;

    line-height: 1.25 !important;
  }

  section.sec:has(.rs-revs) .rs-head p {
    font-size: 0.95rem !important;

    line-height: 1.5 !important;
  }

  section.sec:has(.rs-revs) .rs-revs {
    grid-template-columns: 1fr !important;

    gap: 18px !important;
  }

  section.sec:has(.rs-revs) .rs-rev {
    padding: 26px 22px !important;
  }

  section.sec:has(.rs-revs) .rs-rev:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛКИ ТЕЛЕФОНИ
   ========================================= */

@media (max-width: 480px) {

  section.sec:has(.rs-revs) {
    padding: 55px 14px !important;
  }

  section.sec:has(.rs-revs) .rs-head {
    padding: 26px 16px !important;
  }

  section.sec:has(.rs-revs) .rs-head h2 {
    font-size: 1.55rem !important;
  }

  section.sec:has(.rs-revs) .rs-rev {
    padding: 22px 18px !important;
  }
}


/*vps/ Какво казват клиентите*/

 /* =========================================
    СТИЛ ЗА СЕКЦИЯ "КАКВО КАЗВАТ КЛИЕНТИТЕ"
    ========================================= */

section.sec:has(.vp-revs) {
  background: #ffffff !important;

  background-image:
    radial-gradient(
      circle at 10% 20%,
      rgba(152, 219, 28, 0.08) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 80%,
      rgba(152, 219, 28, 0.05) 0%,
      transparent 40%
    ) !important;

  padding: 100px 20px !important;

  font-family:
    'Inter',
    system-ui,
    -apple-system,
    sans-serif !important;

  color: #1e293b !important;

  overflow: hidden !important;

  position: relative !important;

  border-block:
    1px solid rgba(152, 219, 28, 0.2) !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec:has(.vp-revs) .wrap-w {
  max-width: 1200px !important;

  width: 100% !important;

  margin: 0 auto !important;

  position: relative !important;

  z-index: 1 !important;

  box-sizing: border-box !important;
}


/* =========================================
   ЗАГЛАВНА ЧАСТ
   ========================================= */

section.sec:has(.vp-revs) .vp-head {
  display: flex !important;

  flex-direction: column !important;

  align-items: center !important;

  justify-content: center !important;

  width: 100% !important;

  max-width: 100% !important;

  box-sizing: border-box !important;

  text-align: center !important;

  margin: 0 auto 50px auto !important;

  padding: 40px 30px !important;

  background: #ffffff !important;

  border-radius: 24px !important;

  border: 1px solid rgba(152, 219, 28, 0.4) !important;

  box-shadow:
    0 15px 35px rgba(0, 0, 0, 0.03) !important;

  position: relative !important;
}


/* =========================================
   ЗАГЛАВИЕ
   ========================================= */

section.sec:has(.vp-revs) .vp-head h2 {
  display: block !important;

  width: 100% !important;

  max-width: none !important;

  margin: 0 auto 10px auto !important;

  padding: 0 !important;

  text-align: center !important;

  font-size: 2.25rem !important;

  line-height: 1.25 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  letter-spacing: -0.5px !important;

  float: none !important;

  position: static !important;

  transform: none !important;
}


/* =========================================
   ПОДЗАГЛАВИЕ
   ========================================= */

section.sec:has(.vp-revs) .vp-head p {
  display: block !important;

  width: 100% !important;

  max-width: none !important;

  margin: 0 auto !important;

  padding: 0 !important;

  text-align: center !important;

  font-size: 1.05rem !important;

  line-height: 1.5 !important;

  color: #4b5563 !important;

  float: none !important;

  position: static !important;

  transform: none !important;
}


/* =========================================
   GRID НА ОТЗИВИТЕ
   ========================================= */

section.sec:has(.vp-revs) .vp-revs {
  display: grid !important;

  grid-template-columns:
    repeat(
      auto-fit,
      minmax(320px, 1fr)
    ) !important;

  gap: 24px !important;

  width: 100% !important;
}


/* =========================================
   КАРТА НА ОТЗИВА
   ========================================= */

section.sec:has(.vp-revs) .vp-rev {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 32px !important;

  display: flex !important;

  flex-direction: column !important;

  position: relative !important;

  box-sizing: border-box !important;

  transition:
    all 0.25s ease-in-out !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}


/* =========================================
   HOVER НА КАРТАТА
   ========================================= */

section.sec:has(.vp-revs) .vp-rev:hover {
  transform: translateY(-6px) !important;

  border-color:
    rgba(105, 201, 14, 0.35) !important;

  background: #ffffff !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ЗВЕЗДИ
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-stars {
  display: flex !important;

  align-items: center !important;

  gap: 4px !important;

  color: #f59e0b !important;

  width: 90px !important;

  height: 18px !important;

  margin-bottom: 16px !important;
}


/* SVG ЗВЕЗДИ */

section.sec:has(.vp-revs) .vp-rev-stars svg {
  width: 18px !important;

  height: 18px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ТЕКСТ НА ОТЗИВА
   ========================================= */

section.sec:has(.vp-revs) .vp-rev > p {
  font-size: 0.98rem !important;

  color: #374151 !important;

  line-height: 1.6 !important;

  flex-grow: 1 !important;

  margin: 0 0 24px 0 !important;

  padding: 0 !important;
}


/* =========================================
   АВТОР
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-who {
  display: flex !important;

  align-items: center !important;

  gap: 14px !important;

  border-top:
    1px solid #f3f4f6 !important;

  padding-top: 16px !important;
}


/* =========================================
   АВАТАР
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-av {
  width: 42px !important;

  height: 42px !important;

  min-width: 42px !important;

  border-radius: 50% !important;

  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  font-weight: 700 !important;

  font-size: 0.9rem !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ИМЕ НА КЛИЕНТА
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-who b {
  display: block !important;

  font-size: 0.95rem !important;

  color: #111827 !important;

  font-weight: 600 !important;
}


/* =========================================
   ОПИСАНИЕ ПОД ИМЕТО
   ========================================= */

section.sec:has(.vp-revs) .vp-rev-who span span {
  display: block !important;

  font-size: 0.85rem !important;

  color: #6b7280 !important;

  font-weight: 400 !important;

  margin-top: 2px !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 768px) {

  section.sec:has(.vp-revs) {
    padding: 70px 16px !important;
  }

  section.sec:has(.vp-revs) .vp-head {
    padding: 30px 20px !important;

    margin-bottom: 35px !important;

    border-radius: 20px !important;
  }

  section.sec:has(.vp-revs) .vp-head h2 {
    font-size: 1.8rem !important;
  }

  section.sec:has(.vp-revs) .vp-head p {
    font-size: 0.95rem !important;
  }

  section.sec:has(.vp-revs) .vp-revs {
    grid-template-columns: 1fr !important;

    gap: 18px !important;
  }

  section.sec:has(.vp-revs) .vp-rev {
    padding: 26px 22px !important;
  }

  section.sec:has(.vp-revs) .vp-rev:hover {
    transform: none !important;
  }
}


/* =========================================
   МОБИЛЕН ТЕЛЕФОН
   ========================================= */

@media (max-width: 480px) {

  section.sec:has(.vp-revs) {
    padding: 55px 14px !important;
  }

  section.sec:has(.vp-revs) .vp-head {
    padding: 26px 16px !important;
  }

  section.sec:has(.vp-revs) .vp-head h2 {
    font-size: 1.55rem !important;

    line-height: 1.25 !important;
  }

  section.sec:has(.vp-revs) .vp-head p {
    font-size: 0.9rem !important;
  }

  section.sec:has(.vp-revs) .vp-rev {
    padding: 22px 18px !important;
  }
}
/*menidzhar-vps/Какво казват клиентите*/

/* =========================================
   СТИЛ ЗА СЕКЦИЯ "КАКВО КАЗВАТ КЛИЕНТИТЕ"
   ========================================= */

section.sec:has(.mv-revs) {
  background: #ffffff !important;
  background-image:
    radial-gradient(
      circle at 10% 20%,
      rgba(152, 219, 28, 0.08) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 80%,
      rgba(152, 219, 28, 0.05) 0%,
      transparent 40%
    ) !important;

  padding: 100px 20px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  overflow: hidden !important;
  position: relative !important;
  border-block: 1px solid rgba(152, 219, 28, 0.2) !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec:has(.mv-revs) .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
}


/* =========================================
   ЗАГЛАВНА ЧАСТ
   ========================================= */

section.sec:has(.mv-revs) .mv-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;

  text-align: center !important;

  margin: 0 auto 50px auto !important;
  padding: 40px 30px !important;

  background: #ffffff !important;

  border-radius: 24px !important;
  border: 1px solid rgba(152, 219, 28, 0.4) !important;

  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;

  position: relative !important;
}


/* =========================================
   ЗАГЛАВИЕ
   ========================================= */

section.sec:has(.mv-revs) .mv-head h2 {
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 auto 10px auto !important;
  padding: 0 !important;

  text-align: center !important;

  font-size: 2.25rem !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;

  color: #111827 !important;
  letter-spacing: -0.5px !important;

  float: none !important;
  position: static !important;
  transform: none !important;
}


/* =========================================
   ПОДЗАГЛАВИЕ
   ========================================= */

section.sec:has(.mv-revs) .mv-head p {
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 auto !important;
  padding: 0 !important;

  text-align: center !important;

  font-size: 1.05rem !important;
  line-height: 1.5 !important;

  color: #4b5563 !important;

  float: none !important;
  position: static !important;
  transform: none !important;
}


/* =========================================
   GRID НА ОТЗИВИТЕ
   ========================================= */

section.sec:has(.mv-revs) .mv-revs {
  display: grid !important;

  grid-template-columns:
    repeat(
      auto-fit,
      minmax(320px, 1fr)
    ) !important;

  gap: 24px !important;

  width: 100% !important;
}


/* =========================================
   КАРТА НА ОТЗИВА
   ========================================= */

section.sec:has(.mv-revs) .mv-rev {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 32px !important;

  display: flex !important;
  flex-direction: column !important;

  position: relative !important;

  box-sizing: border-box !important;

  transition: all 0.25s ease-in-out !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}


/* =========================================
   HOVER
   ========================================= */

section.sec:has(.mv-revs) .mv-rev:hover {
  transform: translateY(-6px) !important;

  border-color:
    rgba(105, 201, 14, 0.35) !important;

  background: #ffffff !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ЗВЕЗДИ
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-stars {
  display: flex !important;

  align-items: center !important;

  gap: 4px !important;

  color: #f59e0b !important;

  width: 90px !important;
  height: 18px !important;

  margin-bottom: 16px !important;
}


/* SVG */

section.sec:has(.mv-revs) .mv-rev-stars svg {
  width: 18px !important;
  height: 18px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ТЕКСТ НА ОТЗИВА
   ========================================= */

section.sec:has(.mv-revs) .mv-rev > p {
  font-size: 0.98rem !important;

  color: #374151 !important;

  line-height: 1.6 !important;

  flex-grow: 1 !important;

  margin: 0 0 24px 0 !important;
  padding: 0 !important;
}


/* =========================================
   АВТОР
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-who {
  display: flex !important;

  align-items: center !important;

  gap: 14px !important;

  border-top:
    1px solid #f3f4f6 !important;

  padding-top: 16px !important;
}


/* =========================================
   АВАТАР
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-av {
  width: 42px !important;
  height: 42px !important;

  min-width: 42px !important;

  border-radius: 50% !important;

  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  display: flex !important;

  align-items: center !important;
  justify-content: center !important;

  font-weight: 700 !important;
  font-size: 0.9rem !important;

  flex-shrink: 0 !important;
}


/* =========================================
   ИМЕ
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-who b {
  display: block !important;

  font-size: 0.95rem !important;

  color: #111827 !important;

  font-weight: 600 !important;
}


/* =========================================
   ОПИСАНИЕ ПОД ИМЕТО
   ========================================= */

section.sec:has(.mv-revs) .mv-rev-who span span {
  display: block !important;

  font-size: 0.85rem !important;

  color: #6b7280 !important;

  font-weight: 400 !important;

  margin-top: 2px !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 768px) {

  section.sec:has(.mv-revs) {
    padding: 70px 16px !important;
  }

  section.sec:has(.mv-revs) .mv-head {
    padding: 30px 20px !important;

    margin-bottom: 35px !important;

    border-radius: 20px !important;
  }

  section.sec:has(.mv-revs) .mv-head h2 {
    font-size: 1.8rem !important;
  }

  section.sec:has(.mv-revs) .mv-head p {
    font-size: 0.95rem !important;
  }

  section.sec:has(.mv-revs) .mv-revs {
    grid-template-columns: 1fr !important;

    gap: 18px !important;
  }

  section.sec:has(.mv-revs) .mv-rev {
    padding: 26px 22px !important;
  }

  section.sec:has(.mv-revs) .mv-rev:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛЪК ТЕЛЕФОН
   ========================================= */

@media (max-width: 480px) {

  section.sec:has(.mv-revs) {
    padding: 55px 14px !important;
  }

  section.sec:has(.mv-revs) .mv-head {
    padding: 26px 16px !important;
  }

  section.sec:has(.mv-revs) .mv-head h2 {
    font-size: 1.55rem !important;
    line-height: 1.25 !important;
  }

  section.sec:has(.mv-revs) .mv-head p {
    font-size: 0.9rem !important;
  }

  section.sec:has(.mv-revs) .mv-rev {
    padding: 22px 18px !important;
  }
}


/*naeti-sarvari/Какво влиза в цената*/


/* =========================================
   СЕКЦИЯ "КАКВО ВЛИЗА В ЦЕНАТА"
   ========================================= */

section.sec:has(.ded-incl) {
  background: #ffffff !important;

  background-image:
    radial-gradient(
      circle at 10% 20%,
      rgba(152, 219, 28, 0.08) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 80%,
      rgba(152, 219, 28, 0.05) 0%,
      transparent 40%
    ) !important;

  padding: 100px 20px !important;

  font-family:
    'Inter',
    system-ui,
    -apple-system,
    sans-serif !important;

  color: #1e293b !important;

  overflow: hidden !important;

  position: relative !important;

  border-block:
    1px solid rgba(152, 219, 28, 0.2) !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec:has(.ded-incl) .wrap-w {
  max-width: 1200px !important;

  width: 100% !important;

  margin: 0 auto !important;

  position: relative !important;

  z-index: 1 !important;

  box-sizing: border-box !important;
}


/* =========================================
   HEADER
   ========================================= */

section.sec:has(.ded-incl) .ded-head {
  display: flex !important;

  flex-direction: column !important;

  align-items: center !important;

  justify-content: center !important;

  width: 100% !important;

  max-width: 100% !important;

  box-sizing: border-box !important;

  text-align: center !important;

  margin: 0 auto 50px auto !important;

  padding: 40px 30px !important;

  background: #ffffff !important;

  border-radius: 24px !important;

  border:
    1px solid rgba(152, 219, 28, 0.4) !important;

  box-shadow:
    0 15px 35px rgba(0, 0, 0, 0.03) !important;

  position: relative !important;
}


/* =========================================
   ЗАГЛАВИЕ
   ========================================= */

section.sec:has(.ded-incl) .ded-head h2 {
  display: block !important;

  width: 100% !important;

  max-width: none !important;

  margin: 0 auto 10px auto !important;

  padding: 0 !important;

  text-align: center !important;

  font-size: 2.25rem !important;

  line-height: 1.25 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  letter-spacing: -0.5px !important;

  float: none !important;

  position: static !important;

  transform: none !important;
}


/* =========================================
   ПОДЗАГЛАВИЕ
   ========================================= */

section.sec:has(.ded-incl) .ded-head p {
  display: block !important;

  width: 100% !important;

  max-width: none !important;

  margin: 0 auto !important;

  padding: 0 !important;

  text-align: center !important;

  font-size: 1.05rem !important;

  line-height: 1.5 !important;

  color: #4b5563 !important;

  float: none !important;

  position: static !important;

  transform: none !important;
}


/* =========================================
   GRID НА ЕЛЕМЕНТИТЕ
   ========================================= */

section.sec:has(.ded-incl) .ded-incl {
  display: grid !important;

  grid-template-columns:
    repeat(
      4,
      minmax(0, 1fr)
    ) !important;

  gap: 24px !important;

  width: 100% !important;
}


/* =========================================
   ИНДИВИДУАЛНА КАРТА
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-i {
  background: #ffffff !important;

  border:
    1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 32px !important;

  display: flex !important;

  flex-direction: column !important;

  align-items: flex-start !important;

  position: relative !important;

  box-sizing: border-box !important;

  transition:
    all 0.25s ease-in-out !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;
}


/* =========================================
   HOVER
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-i:hover {
  transform: translateY(-6px) !important;

  border-color:
    rgba(105, 201, 14, 0.35) !important;

  background: #ffffff !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.08),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ИКОНА
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-ic {
  width: 48px !important;

  height: 48px !important;

  min-width: 48px !important;

  border-radius: 14px !important;

  background:
    linear-gradient(
      135deg,
      rgba(48, 90, 8, 0.1),
      rgba(105, 201, 14, 0.18)
    ) !important;

  color: #305a08 !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  margin-bottom: 22px !important;

  border:
    1px solid rgba(105, 201, 14, 0.2) !important;

  transition:
    all 0.25s ease-in-out !important;
}


/* SVG икона */

section.sec:has(.ded-incl) .ded-incl-ic svg {
  width: 24px !important;

  height: 24px !important;

  display: block !important;
}


/* Hover икона */

section.sec:has(.ded-incl) .ded-incl-i:hover .ded-incl-ic {
  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  transform: scale(1.05) !important;
}


/* =========================================
   ЗАГЛАВИЕ НА ЕЛЕМЕНТА
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-i > b {
  display: block !important;

  font-size: 1.05rem !important;

  line-height: 1.35 !important;

  font-weight: 650 !important;

  color: #111827 !important;

  margin: 0 0 10px 0 !important;
}


/* =========================================
   ОПИСАНИЕ
   ========================================= */

section.sec:has(.ded-incl) .ded-incl-i > p {
  display: block !important;

  font-size: 0.92rem !important;

  line-height: 1.6 !important;

  color: #6b7280 !important;

  margin: 0 !important;

  padding: 0 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 1000px) {

  section.sec:has(.ded-incl) .ded-incl {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;

    gap: 20px !important;
  }
}


/* =========================================
   МОБИЛНА ВЕРСИЯ
   ========================================= */

@media (max-width: 768px) {

  section.sec:has(.ded-incl) {
    padding: 70px 16px !important;
  }

  section.sec:has(.ded-incl) .ded-head {
    padding: 30px 20px !important;

    margin-bottom: 35px !important;

    border-radius: 20px !important;
  }

  section.sec:has(.ded-incl) .ded-head h2 {
    font-size: 1.8rem !important;
  }

  section.sec:has(.ded-incl) .ded-head p {
    font-size: 0.95rem !important;
  }

  section.sec:has(.ded-incl) .ded-incl {
    grid-template-columns: 1fr !important;

    gap: 18px !important;
  }

  section.sec:has(.ded-incl) .ded-incl-i {
    padding: 26px 22px !important;
  }

  section.sec:has(.ded-incl) .ded-incl-i:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛЪК ТЕЛЕФОН
   ========================================= */

@media (max-width: 480px) {

  section.sec:has(.ded-incl) {
    padding: 55px 14px !important;
  }

  section.sec:has(.ded-incl) .ded-head {
    padding: 26px 16px !important;
  }

  section.sec:has(.ded-incl) .ded-head h2 {
    font-size: 1.55rem !important;
  }

  section.sec:has(.ded-incl) .ded-head p {
    font-size: 0.9rem !important;
  }

  section.sec:has(.ded-incl) .ded-incl-i {
    padding: 22px 18px !important;
  }
}


/*biznes-hosting/Всички планове имат*/


/* =========================================
   "ВСИЧКИ ПЛАНОВЕ ИМАТ"
   Дизайн в стила на payment/case секцията
   ========================================= */

section.sec.bz-all-sec {
  background: #fafafa !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  box-sizing: border-box !important;
}


/* Контейнер */
section.sec.bz-all-sec .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}


/* =========================================
   ОСНОВНА КАРТА
   ========================================= */

section.sec.bz-all-sec .bz-all {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 40px !important;

  position: relative !important;

  box-sizing: border-box !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;

  transition:
    all 0.25s ease-in-out !important;
}


/* Лек hover ефект на цялата карта */

section.sec.bz-all-sec .bz-all:hover {
  border-color: rgba(105, 201, 14, 0.35) !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.07),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ГОРНА ЧАСТ
   ========================================= */

section.sec.bz-all-sec .bz-all-h {
  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  flex-wrap: wrap !important;

  gap: 12px !important;

  text-align: center !important;

  margin: 0 0 32px 0 !important;

  padding: 0 0 24px 0 !important;

  border-bottom: 1px solid #f3f4f6 !important;
}


/* Основният текст */

section.sec.bz-all-sec .bz-all-h > b {
  font-size: 1.25rem !important;

  line-height: 1.4 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  margin: 0 !important;
}


/* =========================================
   GREEN PILL
   ========================================= */

section.sec.bz-all-sec .bz-all-h .pill.p-ok {
  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.28) !important;

  border-radius: 999px !important;

  padding: 6px 12px !important;

  font-size: 0.82rem !important;

  line-height: 1.2 !important;

  font-weight: 700 !important;

  white-space: nowrap !important;

  box-sizing: border-box !important;
}


/* =========================================
   СПИСЪК
   ========================================= */

section.sec.bz-all-sec .bz-all-l {
  display: grid !important;

  grid-template-columns:
    repeat(3, minmax(0, 1fr)) !important;

  column-gap: 50px !important;

  row-gap: 18px !important;

  width: 100% !important;

  box-sizing: border-box !important;
}


/* Всеки ред */

section.sec.bz-all-sec .bz-all-l > div {
  display: flex !important;

  align-items: center !important;

  gap: 12px !important;

  min-width: 0 !important;

  padding: 10px 0 !important;

  color: #374151 !important;

  font-size: 0.95rem !important;

  line-height: 1.45 !important;

  box-sizing: border-box !important;

  transition:
    color 0.2s ease,
    transform 0.2s ease !important;
}


/* Hover върху отделен елемент */

section.sec.bz-all-sec .bz-all-l > div:hover {
  color: #305a08 !important;

  transform: translateX(4px) !important;
}


/* =========================================
   CHECK ИКОНА
   ========================================= */

section.sec.bz-all-sec .bz-fi {
  width: 34px !important;

  height: 34px !important;

  min-width: 34px !important;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  border-radius: 50% !important;

  background:
    rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border:
    1px solid rgba(152, 219, 28, 0.25) !important;

  box-sizing: border-box !important;

  transition:
    all 0.2s ease !important;
}


/* SVG */

section.sec.bz-all-sec .bz-fi svg {
  width: 17px !important;

  height: 17px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* Hover на check */

section.sec.bz-all-sec .bz-all-l > div:hover .bz-fi {
  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  border-color: transparent !important;
}


/* =========================================
   ТЕКСТЪТ В СПИСЪКА
   ========================================= */

section.sec.bz-all-sec .bz-all-l > div > span:last-child {
  display: block !important;

  color: inherit !important;

  font-weight: 500 !important;

  margin: 0 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 800px) {

  section.sec.bz-all-sec {
    padding: 65px 18px !important;
  }

  section.sec.bz-all-sec .bz-all {
    padding: 32px !important;
  }

  section.sec.bz-all-sec .bz-all-l {
    grid-template-columns: 1fr !important;

    row-gap: 12px !important;
  }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

  section.sec.bz-all-sec {
    padding: 55px 16px !important;
  }

  section.sec.bz-all-sec .bz-all {
    padding: 26px 20px !important;

    border-radius: 14px !important;
  }

  section.sec.bz-all-sec .bz-all-h {
    margin-bottom: 24px !important;

    padding-bottom: 20px !important;

    gap: 9px !important;
  }

  section.sec.bz-all-sec .bz-all-h > b {
    font-size: 1.1rem !important;
  }

  section.sec.bz-all-sec .bz-all-h .pill.p-ok {
    font-size: 0.78rem !important;

    padding: 5px 10px !important;
  }

  section.sec.bz-all-sec .bz-all-l > div {
    font-size: 0.9rem !important;

    gap: 10px !important;

    padding: 8px 0 !important;
  }

  section.sec.bz-all-sec .bz-fi {
    width: 32px !important;

    height: 32px !important;

    min-width: 32px !important;
  }

  section.sec.bz-all-sec .bz-fi svg {
    width: 16px !important;

    height: 16px !important;
  }

  section.sec.bz-all-sec .bz-all-l > div:hover {
    transform: none !important;
  }
}


/* =========================================
   МНОГО МАЛЪК ЕКРАН
   ========================================= */

@media (max-width: 400px) {

  section.sec.bz-all-sec {
    padding: 45px 12px !important;
  }

  section.sec.bz-all-sec .bz-all {
    padding: 22px 16px !important;
  }

  section.sec.bz-all-sec .bz-all-h {
    flex-direction: column !important;
  }

  section.sec.bz-all-sec .bz-all-h > b {
    font-size: 1.05rem !important;
  }
}

@media (max-width: 900px) {
  section.sec.bz-all-sec .bz-all-l {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 25px !important;
  }
}

@media (max-width: 600px) {
  section.sec.bz-all-sec .bz-all-l {
    grid-template-columns: 1fr !important;
    row-gap: 12px !important;
  }
}


/*reseller-hosting/Всички планове имат*/


/* =========================================
   RS — "ВСИЧКИ ПЛАНОВЕ ИМАТ"
   ========================================= */

section.sec.rs-all-sec {
  background: #fafafa !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  box-sizing: border-box !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec.rs-all-sec .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}


/* =========================================
   ОСНОВНА БЯЛА КАРТА
   ========================================= */

section.sec.rs-all-sec .rs-all {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 40px !important;

  position: relative !important;

  box-sizing: border-box !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;

  transition: all 0.25s ease-in-out !important;
}


/* Hover на основната карта */

section.sec.rs-all-sec .rs-all:hover {
  border-color: rgba(105, 201, 14, 0.35) !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.07),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ГОРНА ЧАСТ
   ========================================= */

section.sec.rs-all-sec .rs-all-h {
  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  flex-wrap: wrap !important;

  gap: 12px !important;

  text-align: center !important;

  margin: 0 0 32px 0 !important;

  padding: 0 0 24px 0 !important;

  border-bottom: 1px solid #f3f4f6 !important;
}


/* "Всички планове имат" */

section.sec.rs-all-sec .rs-all-h > b {
  font-size: 1.25rem !important;

  line-height: 1.4 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  margin: 0 !important;
}


/* =========================================
   GREEN PILL
   ========================================= */

section.sec.rs-all-sec .rs-all-h .pill.p-ok {
  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.28) !important;

  border-radius: 999px !important;

  padding: 6px 12px !important;

  font-size: 0.82rem !important;

  line-height: 1.2 !important;

  font-weight: 700 !important;

  white-space: nowrap !important;

  box-sizing: border-box !important;
}


/* =========================================
   СПИСЪК — 3 КОЛОНИ
   ========================================= */

section.sec.rs-all-sec .rs-all-l {
  display: grid !important;

  grid-template-columns:
    repeat(3, minmax(0, 1fr)) !important;

  column-gap: 40px !important;

  row-gap: 18px !important;

  width: 100% !important;

  box-sizing: border-box !important;
}


/* =========================================
   ВСЕКИ ЕЛЕМЕНТ
   ========================================= */

section.sec.rs-all-sec .rs-all-l > div {
  display: flex !important;

  align-items: center !important;

  gap: 12px !important;

  min-width: 0 !important;

  padding: 10px 0 !important;

  color: #374151 !important;

  font-size: 0.95rem !important;

  line-height: 1.45 !important;

  box-sizing: border-box !important;

  transition:
    color 0.2s ease,
    transform 0.2s ease !important;
}


/* Hover върху ред */

section.sec.rs-all-sec .rs-all-l > div:hover {
  color: #305a08 !important;

  transform: translateX(4px) !important;
}


/* =========================================
   CHECK ИКОНА
   ========================================= */

section.sec.rs-all-sec .rs-fi {
  width: 34px !important;

  height: 34px !important;

  min-width: 34px !important;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  border-radius: 50% !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.25) !important;

  box-sizing: border-box !important;

  transition: all 0.2s ease !important;
}


/* SVG */

section.sec.rs-all-sec .rs-fi svg {
  width: 17px !important;

  height: 17px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* Hover на иконката */

section.sec.rs-all-sec .rs-all-l > div:hover .rs-fi {
  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  border-color: transparent !important;
}


/* =========================================
   ТЕКСТ
   ========================================= */

section.sec.rs-all-sec .rs-all-l > div > span:last-child {
  display: block !important;

  color: inherit !important;

  font-weight: 500 !important;

  margin: 0 !important;
}


/* =========================================
   TABLET — 2 КОЛОНИ
   ========================================= */

@media (max-width: 900px) {

  section.sec.rs-all-sec {
    padding: 65px 18px !important;
  }

  section.sec.rs-all-sec .rs-all {
    padding: 32px !important;
  }

  section.sec.rs-all-sec .rs-all-l {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;

    column-gap: 25px !important;

    row-gap: 14px !important;
  }
}


/* =========================================
   MOBILE — 1 КОЛОНА
   ========================================= */

@media (max-width: 600px) {

  section.sec.rs-all-sec {
    padding: 55px 16px !important;
  }

  section.sec.rs-all-sec .rs-all {
    padding: 26px 20px !important;

    border-radius: 14px !important;
  }

  section.sec.rs-all-sec .rs-all-h {
    margin-bottom: 24px !important;

    padding-bottom: 20px !important;

    gap: 9px !important;
  }

  section.sec.rs-all-sec .rs-all-h > b {
    font-size: 1.1rem !important;
  }

  section.sec.rs-all-sec .rs-all-h .pill.p-ok {
    font-size: 0.78rem !important;

    padding: 5px 10px !important;
  }

  section.sec.rs-all-sec .rs-all-l {
    grid-template-columns: 1fr !important;

    row-gap: 12px !important;
  }

  section.sec.rs-all-sec .rs-all-l > div {
    font-size: 0.9rem !important;

    gap: 10px !important;

    padding: 8px 0 !important;
  }

  section.sec.rs-all-sec .rs-fi {
    width: 32px !important;

    height: 32px !important;

    min-width: 32px !important;
  }

  section.sec.rs-all-sec .rs-fi svg {
    width: 16px !important;

    height: 16px !important;
  }

  section.sec.rs-all-sec .rs-all-l > div:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛЪК ТЕЛЕФОН
   ========================================= */

@media (max-width: 400px) {

  section.sec.rs-all-sec {
    padding: 45px 12px !important;
  }

  section.sec.rs-all-sec .rs-all {
    padding: 22px 16px !important;
  }

  section.sec.rs-all-sec .rs-all-h {
    flex-direction: column !important;
  }

  section.sec.rs-all-sec .rs-all-h > b {
    font-size: 1.05rem !important;
  }
}


/*vps/Всички планове имат*/


/* =========================================
   VP — "ВСИЧКИ ПЛАНОВЕ ИМАТ"
   ========================================= */

section.sec.vp-all-sec {
  background: #fafafa !important;
  padding: 80px 20px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  color: #1e293b !important;
  box-sizing: border-box !important;
}


/* =========================================
   КОНТЕЙНЕР
   ========================================= */

section.sec.vp-all-sec .wrap-w {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}


/* =========================================
   ОСНОВНА БЯЛА КАРТА
   ========================================= */

section.sec.vp-all-sec .vp-all {
  background: #ffffff !important;

  border: 1px solid #e5e7eb !important;

  border-radius: 16px !important;

  padding: 40px !important;

  position: relative !important;

  box-sizing: border-box !important;

  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px -2px rgba(0, 0, 0, 0.02) !important;

  transition: all 0.25s ease-in-out !important;
}


/* Hover на картата */

section.sec.vp-all-sec .vp-all:hover {
  border-color: rgba(105, 201, 14, 0.35) !important;

  box-shadow:
    0 15px 30px rgba(105, 201, 14, 0.07),
    0 2px 5px rgba(48, 90, 8, 0.02) !important;
}


/* =========================================
   ГОРНА ЧАСТ
   ========================================= */

section.sec.vp-all-sec .vp-all-h {
  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  flex-wrap: wrap !important;

  gap: 12px !important;

  text-align: center !important;

  margin: 0 0 32px 0 !important;

  padding: 0 0 24px 0 !important;

  border-bottom: 1px solid #f3f4f6 !important;
}


/* Заглавие */

section.sec.vp-all-sec .vp-all-h > b {
  font-size: 1.25rem !important;

  line-height: 1.4 !important;

  font-weight: 700 !important;

  color: #111827 !important;

  margin: 0 !important;
}


/* =========================================
   GREEN PILL
   ========================================= */

section.sec.vp-all-sec .vp-all-h .pill.p-ok {
  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.28) !important;

  border-radius: 999px !important;

  padding: 6px 12px !important;

  font-size: 0.82rem !important;

  line-height: 1.2 !important;

  font-weight: 700 !important;

  white-space: nowrap !important;

  box-sizing: border-box !important;
}


/* =========================================
   СПИСЪК — 3 КОЛОНИ
   ========================================= */

section.sec.vp-all-sec .vp-all-l {
  display: grid !important;

  grid-template-columns:
    repeat(3, minmax(0, 1fr)) !important;

  column-gap: 40px !important;

  row-gap: 18px !important;

  width: 100% !important;

  box-sizing: border-box !important;
}


/* =========================================
   ВСЕКИ ЕЛЕМЕНТ
   ========================================= */

section.sec.vp-all-sec .vp-all-l > div {
  display: flex !important;

  align-items: center !important;

  gap: 12px !important;

  min-width: 0 !important;

  padding: 10px 0 !important;

  color: #374151 !important;

  font-size: 0.95rem !important;

  line-height: 1.45 !important;

  box-sizing: border-box !important;

  transition:
    color 0.2s ease,
    transform 0.2s ease !important;
}


/* Hover на ред */

section.sec.vp-all-sec .vp-all-l > div:hover {
  color: #305a08 !important;

  transform: translateX(4px) !important;
}


/* =========================================
   CHECK ИКОНА
   ========================================= */

section.sec.vp-all-sec .vp-fi {
  width: 34px !important;

  height: 34px !important;

  min-width: 34px !important;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  border-radius: 50% !important;

  background: rgba(152, 219, 28, 0.12) !important;

  color: #305a08 !important;

  border: 1px solid rgba(152, 219, 28, 0.25) !important;

  box-sizing: border-box !important;

  transition: all 0.2s ease !important;
}


/* SVG */

section.sec.vp-all-sec .vp-fi svg {
  width: 17px !important;

  height: 17px !important;

  display: block !important;

  flex-shrink: 0 !important;
}


/* Hover на check */

section.sec.vp-all-sec .vp-all-l > div:hover .vp-fi {
  background:
    linear-gradient(
      135deg,
      #305a08,
      #69c90e
    ) !important;

  color: #ffffff !important;

  border-color: transparent !important;
}


/* =========================================
   ТЕКСТ
   ========================================= */

section.sec.vp-all-sec .vp-all-l > div > span:last-child {
  display: block !important;

  color: inherit !important;

  font-weight: 500 !important;

  margin: 0 !important;
}


/* =========================================
   TABLET — 2 КОЛОНИ
   ========================================= */

@media (max-width: 900px) {

  section.sec.vp-all-sec {
    padding: 65px 18px !important;
  }

  section.sec.vp-all-sec .vp-all {
    padding: 32px !important;
  }

  section.sec.vp-all-sec .vp-all-l {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;

    column-gap: 25px !important;

    row-gap: 14px !important;
  }
}


/* =========================================
   MOBILE — 1 КОЛОНА
   ========================================= */

@media (max-width: 600px) {

  section.sec.vp-all-sec {
    padding: 55px 16px !important;
  }

  section.sec.vp-all-sec .vp-all {
    padding: 26px 20px !important;

    border-radius: 14px !important;
  }

  section.sec.vp-all-sec .vp-all-h {
    margin-bottom: 24px !important;

    padding-bottom: 20px !important;

    gap: 9px !important;
  }

  section.sec.vp-all-sec .vp-all-h > b {
    font-size: 1.1rem !important;
  }

  section.sec.vp-all-sec .vp-all-h .pill.p-ok {
    font-size: 0.78rem !important;

    padding: 5px 10px !important;
  }

  section.sec.vp-all-sec .vp-all-l {
    grid-template-columns: 1fr !important;

    row-gap: 12px !important;
  }

  section.sec.vp-all-sec .vp-all-l > div {
    font-size: 0.9rem !important;

    gap: 10px !important;

    padding: 8px 0 !important;
  }

  section.sec.vp-all-sec .vp-fi {
    width: 32px !important;

    height: 32px !important;

    min-width: 32px !important;
  }

  section.sec.vp-all-sec .vp-fi svg {
    width: 16px !important;

    height: 16px !important;
  }

  section.sec.vp-all-sec .vp-all-l > div:hover {
    transform: none !important;
  }
}


/* =========================================
   МАЛЪК ТЕЛЕФОН
   ========================================= */

@media (max-width: 400px) {

  section.sec.vp-all-sec {
    padding: 45px 12px !important;
  }

  section.sec.vp-all-sec .vp-all {
    padding: 22px 16px !important;
  }

  section.sec.vp-all-sec .vp-all-h {
    flex-direction: column !important;
  }

  section.sec.vp-all-sec .vp-all-h > b {
    font-size: 1.05rem !important;
  }
}


.bz-mail-c i {
    width: 17px;
    height: 17px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    background: rgb(152 219 28);
    color: #000000;
}
.bz-notes i {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    background: rgb(152 219 28);
    color: #000000;
}

/*biznes-hosting/Колко струва един час без сайт*/


/* ==========================================================================
   COST SECTION — PREMIUM / HIGH-CONVERSION DESIGN
   ========================================================================== */

/* Основна секция */
section.sec:has(.bz-cost) {
    background:
        radial-gradient(circle at 8% 15%, rgba(152, 219, 28, 0.08), transparent 30%),
        radial-gradient(circle at 92% 85%, rgba(152, 219, 28, 0.06), transparent 32%),
        #f7f8f5 !important;
    padding: 100px 20px !important;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    color: #111827 !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Контейнер */
section.sec:has(.bz-cost) .wrap-w {
    max-width: 1180px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.bz-cost) .bz-head {
    max-width: 780px !important;
    margin: 0 auto 55px auto !important;
    text-align: center !important;
}

section.sec:has(.bz-cost) .bz-head h2 {
    margin: 0 0 14px 0 !important;
    font-size: clamp(2rem, 4vw, 2.8rem) !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    color: #111827 !important;
}

section.sec:has(.bz-cost) .bz-head p {
    max-width: 680px !important;
    margin: 0 auto !important;
    font-size: 1.05rem !important;
    line-height: 1.65 !important;
    color: #667085 !important;
}

/* ==========================================================================
   MAIN LAYOUT
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost {
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) !important;
    gap: 22px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   BIG COST CARD
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-box {
    background:
        radial-gradient(circle at 90% 5%, rgba(152, 219, 28, 0.18), transparent 32%),
        linear-gradient(145deg, #151a10 0%, #0d100a 100%) !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 24px !important;
    padding: 38px !important;
    position: relative !important;
    overflow: hidden !important;

    display: flex !important;
    flex-direction: column !important;

    box-shadow:
        0 20px 50px rgba(17, 24, 39, 0.14),
        inset 0 1px 0 rgba(255,255,255,0.05) !important;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease !important;
}

/* декоративна зелена линия */
section.sec:has(.bz-cost) .bz-cost-box::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 5px !important;
    height: 100% !important;
    background: linear-gradient(
        to bottom,
        #7cbf00,
        #69c90e,
        transparent
    ) !important;
}

/* декоративен glow */
section.sec:has(.bz-cost) .bz-cost-box::after {
    content: "" !important;
    position: absolute !important;
    width: 260px !important;
    height: 260px !important;
    right: -130px !important;
    bottom: -130px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.08) !important;
    filter: blur(10px) !important;
    pointer-events: none !important;
}

/* Hover */
section.sec:has(.bz-cost) .bz-cost-box:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(152, 219, 28, 0.5) !important;
    box-shadow:
        0 28px 60px rgba(17, 24, 39, 0.18),
        0 0 35px rgba(152, 219, 28, 0.08) !important;
}

/* Заглавие */
section.sec:has(.bz-cost) .bz-cost-h {
    position: relative !important;
    z-index: 2 !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.7px !important;

    color: #b8c0b0 !important;

    margin: 0 0 28px 0 !important;
}

/* ==========================================================================
   COST ROWS
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-r {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;

    padding: 17px 0 !important;

    border-bottom: 1px solid rgba(255,255,255,0.08) !important;

    position: relative !important;
    z-index: 2 !important;
}

section.sec:has(.bz-cost) .bz-cost-r span {
    font-size: 14px !important;
    line-height: 1.4 !important;
    color: #c8cec4 !important;
}

section.sec:has(.bz-cost) .bz-cost-r b {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   TOTAL — 215 €
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-t {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    gap: 20px !important;

    margin-top: auto !important;
    padding: 30px 0 5px 0 !important;
}

section.sec:has(.bz-cost) .bz-cost-t span {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
}

section.sec:has(.bz-cost) .bz-cost-t b {
    font-size: clamp(2.3rem, 5vw, 3.4rem) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: -2px !important;
    color: #7cbf00 !important;

    text-shadow:
        0 0 25px rgba(152,219,28,0.18) !important;
}

/* ==========================================================================
   NOTE
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-note {
    position: relative !important;
    z-index: 2 !important;

    margin: 22px 0 0 0 !important;
    padding: 18px 0 0 0 !important;

    border-top: 1px solid rgba(152,219,28,0.16) !important;

    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #8e9789 !important;
}

/* ==========================================================================
   RIGHT SIDE
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-l {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
}

/* ==========================================================================
   KPI CARDS
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-i {
    background: #ffffff !important;

    border: 1px solid #e3e7df !important;
    border-radius: 20px !important;

    padding: 28px !important;

    display: flex !important;
    align-items: flex-start !important;
    gap: 22px !important;

    position: relative !important;
    overflow: hidden !important;

    box-shadow:
        0 8px 25px rgba(16, 24, 40, 0.045) !important;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease !important;
}

/* зелена вертикална линия */
section.sec:has(.bz-cost) .bz-cost-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 22px !important;
    bottom: 22px !important;
    width: 3px !important;
    background: #7cbf00 !important;
    border-radius: 0 4px 4px 0 !important;
}

/* малък glow */
section.sec:has(.bz-cost) .bz-cost-i::after {
    content: "" !important;
    position: absolute !important;
    width: 100px !important;
    height: 100px !important;
    right: -50px !important;
    top: -50px !important;
    border-radius: 50% !important;
    background: rgba(152,219,28,0.08) !important;
}

/* Hover */
section.sec:has(.bz-cost) .bz-cost-i:hover {
    transform: translateX(6px) !important;
    border-color: rgba(105,201,14,0.45) !important;

    box-shadow:
        0 18px 35px rgba(105,201,14,0.10) !important;
}

/* ==========================================================================
   BIG KPI NUMBER
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-n {
    flex-shrink: 0 !important;

    min-width: 95px !important;

    font-size: 25px !important;
    line-height: 1 !important;
    font-weight: 900 !important;

    letter-spacing: -1px !important;

    color: #305a08 !important;
}

/* ==========================================================================
   KPI CONTENT
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-i > span:last-child {
    display: block !important;
    position: relative !important;
    z-index: 2 !important;
}

section.sec:has(.bz-cost) .bz-cost-i b {
    display: block !important;

    margin: 0 0 8px 0 !important;

    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;

    color: #111827 !important;

    transition: color 0.25s ease !important;
}

section.sec:has(.bz-cost) .bz-cost-i:hover b {
    color: #305a08 !important;
}

section.sec:has(.bz-cost) .bz-cost-i p {
    margin: 0 !important;

    font-size: 13px !important;
    line-height: 1.6 !important;

    color: #667085 !important;
}

/* ==========================================================================
   SPECIAL STYLE FOR 0 €
   ========================================================================== */

section.sec:has(.bz-cost) .bz-cost-i:nth-child(3) .bz-cost-n {
    color: #69a90d !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.bz-cost) {
        padding: 75px 20px !important;
    }

    section.sec:has(.bz-cost) .bz-cost {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.bz-cost) .bz-cost-l {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 14px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i {
        flex-direction: column !important;
        gap: 15px !important;
        padding: 23px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-n {
        min-width: auto !important;
    }

}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 650px) {

    section.sec:has(.bz-cost) {
        padding: 60px 16px !important;
    }

    section.sec:has(.bz-cost) .bz-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.bz-cost) .bz-head h2 {
        font-size: 1.9rem !important;
        letter-spacing: -0.7px !important;
    }

    section.sec:has(.bz-cost) .bz-head p {
        font-size: 0.95rem !important;
    }

    section.sec:has(.bz-cost) .bz-cost-box {
        padding: 27px 22px !important;
        border-radius: 20px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-l {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i {
        flex-direction: row !important;
        align-items: flex-start !important;
        padding: 22px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-n {
        min-width: 78px !important;
        font-size: 21px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-t b {
        font-size: 2.6rem !important;
    }

}

/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 420px) {

    section.sec:has(.bz-cost) .bz-cost-r {
        gap: 10px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-r span {
        font-size: 13px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-r b {
        font-size: 15px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i {
        gap: 15px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-n {
        min-width: 70px !important;
        font-size: 19px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i b {
        font-size: 15px !important;
    }

    section.sec:has(.bz-cost) .bz-cost-i p {
        font-size: 12.5px !important;
    }

}


/**/



/* ==========================================================================
   СЧЕТОВОДСТВО / ДОКУМЕНТИ — PREMIUM DARK DESIGN
   Само за секцията с .bz-acc
   ========================================================================== */

/* Основна секция */
section.sec-wash {
    background: #fafafa;
    padding: 80px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Контейнер */
section.sec-wash .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec-wash .bz-head {
    max-width: 760px !important;
    margin: 0 auto 50px auto !important;
    text-align: center !important;
}

section.sec-wash .bz-head h2 {
    margin: 0 0 14px 0 !important;
    font-size: 2.25rem !important;
    line-height: 1.15 !important;
    font-weight: 750 !important;
    letter-spacing: -0.7px !important;
    color: #111827 !important;
}

section.sec-wash .bz-head p {
    margin: 0 !important;
    font-size: 1.05rem !important;
    line-height: 1.6 !important;
    color: #6b7280 !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec-wash .bz-acc {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

section.sec-wash .bz-acc-i {
    position: relative !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 20px !important;

    min-height: 175px !important;
    padding: 28px !important;

    background: #11140c !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    border-radius: 16px !important;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.025) !important;

    overflow: hidden !important;

    transition:
        transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),
        border-color 0.35s ease,
        box-shadow 0.35s ease,
        background 0.35s ease !important;
}

/* Зелен декоративен glow */
section.sec-wash .bz-acc-i::before {
    content: "" !important;
    position: absolute !important;
    width: 150px !important;
    height: 150px !important;
    top: -80px !important;
    right: -70px !important;

    background: rgba(152, 219, 28, 0.08) !important;
    border-radius: 50% !important;
    filter: blur(25px) !important;

    pointer-events: none !important;
}

/* Малка зелена линия отляво */
section.sec-wash .bz-acc-i::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 25px !important;
    bottom: 25px !important;
    width: 3px !important;

    background: #7cbf00 !important;
    border-radius: 0 4px 4px 0 !important;

    opacity: 0.7 !important;
    transition: opacity 0.3s ease, box-shadow 0.3s ease !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec-wash .bz-acc-ic {
    flex: 0 0 52px !important;
    width: 52px !important;
    height: 52px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 14px !important;

    background: rgba(152, 219, 28, 0.10) !important;
    border: 1px solid rgba(152, 219, 28, 0.22) !important;

    color: #7cbf00 !important;

    box-shadow:
        inset 0 0 15px rgba(152, 219, 28, 0.04),
        0 0 20px rgba(152, 219, 28, 0.04) !important;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease !important;
}

section.sec-wash .bz-acc-ic svg {
    width: 25px !important;
    height: 25px !important;
    stroke: currentColor !important;
}

/* ==========================================================================
   ТЕКСТОВА ЧАСТ
   ========================================================================== */

section.sec-wash .bz-acc-i > span:last-child {
    position: relative !important;
    z-index: 2 !important;
    flex: 1 !important;
    min-width: 0 !important;
}

section.sec-wash .bz-acc-i b {
    display: block !important;

    margin: 2px 0 10px 0 !important;

    font-size: 18px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;

    color: #ffffff !important;
    letter-spacing: -0.25px !important;

    transition: color 0.3s ease !important;
}

section.sec-wash .bz-acc-i p {
    margin: 0 !important;

    font-size: 14px !important;
    line-height: 1.6 !important;

    color: #b9c0b2 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec-wash .bz-acc-i:hover {
    transform: translateY(-7px) !important;

    background: #171c0f !important;

    border-color: rgba(152, 219, 28, 0.65) !important;

    box-shadow:
        0 18px 40px rgba(0, 0, 0, 0.38),
        0 0 30px rgba(152, 219, 28, 0.10) !important;
}

section.sec-wash .bz-acc-i:hover::after {
    opacity: 1 !important;

    box-shadow:
        0 0 12px rgba(152, 219, 28, 0.65),
        0 0 25px rgba(152, 219, 28, 0.25) !important;
}

section.sec-wash .bz-acc-i:hover .bz-acc-ic {
    background: rgba(152, 219, 28, 0.17) !important;
    border-color: rgba(152, 219, 28, 0.55) !important;

    transform: translateY(-2px) scale(1.04) !important;

    box-shadow:
        0 0 20px rgba(152, 219, 28, 0.15) !important;
}

section.sec-wash .bz-acc-i:hover b {
    color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec-wash .bz-acc {
        grid-template-columns: 1fr !important;
        max-width: 700px !important;
    }

    section.sec-wash .bz-acc-i {
        min-height: auto !important;
    }
}

/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 640px) {

    section.sec-wash {
        padding: 60px 16px !important;
    }

    section.sec-wash .bz-head {
        margin-bottom: 35px !important;
    }

    section.sec-wash .bz-head h2 {
        font-size: 1.8rem !important;
        line-height: 1.2 !important;
    }

    section.sec-wash .bz-head p {
        font-size: 0.95rem !important;
    }

    section.sec-wash .bz-acc {
        gap: 15px !important;
    }

    section.sec-wash .bz-acc-i {
        gap: 15px !important;
        padding: 22px 20px !important;
        border-radius: 14px !important;
    }

    section.sec-wash .bz-acc-ic {
        flex: 0 0 45px !important;
        width: 45px !important;
        height: 45px !important;
        border-radius: 12px !important;
    }

    section.sec-wash .bz-acc-ic svg {
        width: 22px !important;
        height: 22px !important;
    }

    section.sec-wash .bz-acc-i b {
        font-size: 16px !important;
        margin-bottom: 7px !important;
    }

    section.sec-wash .bz-acc-i p {
        font-size: 13px !important;
        line-height: 1.55 !important;
    }

    section.sec-wash .bz-acc-i::after {
        top: 20px !important;
        bottom: 20px !important;
    }
}

/* ==========================================================================
   МНОГО МАЛЪК ЕКРАН
   ========================================================================== */

@media (max-width: 420px) {

    section.sec-wash .bz-acc-i {
        padding: 20px 17px !important;
        gap: 13px !important;
    }

    section.sec-wash .bz-acc-ic {
        flex-basis: 42px !important;
        width: 42px !important;
        height: 42px !important;
    }

    section.sec-wash .bz-acc-i b {
        font-size: 15px !important;
    }

    section.sec-wash .bz-acc-i p {
        font-size: 12.5px !important;
    }
}


/*biznes-hosting/Отсреща има човек*/


/* ==========================================================================
   SUPPORT SECTION — LIGHT & INTERACTIVE
   Работи само със .bz-sup
   ========================================================================== */

section.sec:has(.bz-sup) {
    background: #f7f9f4 !important;
    padding: 90px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

section.sec:has(.bz-sup) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup {
    position: relative !important;

    display: grid !important;
    grid-template-columns: 0.95fr 1.05fr !important;
    gap: 55px !important;
    align-items: center !important;

    max-width: 1100px !important;
    margin: 0 auto !important;

    padding: 55px !important;

    background: #ffffff !important;
    border: 1px solid #e5eadf !important;
    border-radius: 24px !important;

    box-shadow:
        0 20px 50px rgba(40, 55, 25, 0.08),
        0 4px 12px rgba(40, 55, 25, 0.04) !important;

    overflow: hidden !important;
}

/* Декоративен зелен glow */
section.sec:has(.bz-sup) .bz-sup::before {
    content: "" !important;

    position: absolute !important;
    width: 300px !important;
    height: 300px !important;

    top: -180px !important;
    right: -100px !important;

    background: rgba(152, 219, 28, 0.13) !important;
    border-radius: 50% !important;
    filter: blur(10px) !important;

    pointer-events: none !important;
}

/* Малък декоративен glow долу */
section.sec:has(.bz-sup) .bz-sup::after {
    content: "" !important;

    position: absolute !important;
    width: 180px !important;
    height: 180px !important;

    bottom: -130px !important;
    left: -80px !important;

    background: rgba(152, 219, 28, 0.07) !important;
    border-radius: 50% !important;
    filter: blur(15px) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ЛЯВА ЧАСТ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup > div:first-child {
    position: relative !important;
    z-index: 2 !important;
}

section.sec:has(.bz-sup) .bz-sup h2 {
    margin: 0 0 15px 0 !important;

    font-size: 2.35rem !important;
    line-height: 1.15 !important;
    font-weight: 750 !important;

    color: #18210f !important;
    letter-spacing: -0.8px !important;
}

section.sec:has(.bz-sup) .bz-sup h2::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 4px !important;

    margin-top: 18px !important;

    background: #7cbf00 !important;
    border-radius: 10px !important;
}

section.sec:has(.bz-sup) .bz-sup > div:first-child > p {
    max-width: 500px !important;

    margin: 20px 0 32px 0 !important;

    font-size: 16px !important;
    line-height: 1.65 !important;

    color: #66705f !important;
}

/* ==========================================================================
   СТАТИСТИКИ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup-nums {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;

    max-width: 480px !important;
}

section.sec:has(.bz-sup) .bz-sup-n {
    position: relative !important;

    padding: 19px 20px !important;

    background: #f7f9f4 !important;

    border: 1px solid #e4eadc !important;
    border-radius: 14px !important;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease !important;
}

section.sec:has(.bz-sup) .bz-sup-n::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 15px !important;
    bottom: 15px !important;

    width: 3px !important;

    background: #7cbf00 !important;
    border-radius: 0 4px 4px 0 !important;
}

section.sec:has(.bz-sup) .bz-sup-n:hover {
    transform: translateY(-4px) !important;

    background: #ffffff !important;
    border-color: rgba(152, 219, 28, 0.45) !important;

    box-shadow:
        0 10px 25px rgba(80, 110, 45, 0.09) !important;
}

section.sec:has(.bz-sup) .bz-sup-n b {
    display: block !important;

    margin-bottom: 5px !important;

    font-size: 22px !important;
    font-weight: 800 !important;

    color: #305a08 !important;
    letter-spacing: -0.4px !important;
}

section.sec:has(.bz-sup) .bz-sup-n span {
    display: block !important;

    font-size: 12px !important;
    line-height: 1.4 !important;

    color: #7a8374 !important;
}

/* ==========================================================================
   ДЯСНА ЧАСТ — НАЧИНИ ЗА КОНТАКТ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup-ways {
    position: relative !important;
    z-index: 2 !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

/* Карта */
section.sec:has(.bz-sup) .bz-sup-w {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    min-height: 155px !important;
    padding: 21px !important;

    background: #ffffff !important;

    border: 1px solid #e4e9df !important;
    border-radius: 16px !important;

    box-shadow:
        0 5px 15px rgba(40, 55, 25, 0.04) !important;

    transition:
        transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1),
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease !important;

    overflow: hidden !important;
}

/* Малък зелен индикатор */
section.sec:has(.bz-sup) .bz-sup-w::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: #7cbf00 !important;

    transform: scaleX(0) !important;
    transform-origin: left !important;

    transition: transform 0.35s ease !important;
}

/* Hover */
section.sec:has(.bz-sup) .bz-sup-w:hover {
    transform: translateY(-7px) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    background: #fbfdf9 !important;

    box-shadow:
        0 15px 30px rgba(55, 80, 30, 0.10),
        0 0 0 4px rgba(152, 219, 28, 0.045) !important;
}

section.sec:has(.bz-sup) .bz-sup-w:hover::before {
    transform: scaleX(1) !important;
}

/* ==========================================================================
   ИКОНИ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup-w-ic {
    width: 45px !important;
    height: 45px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 16px !important;

    color: #4f8d0c !important;

    background: #f0f7e9 !important;
    border: 1px solid #dcebcf !important;

    border-radius: 12px !important;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        color 0.3s ease,
        box-shadow 0.3s ease !important;
}

section.sec:has(.bz-sup) .bz-sup-w-ic svg {
    width: 22px !important;
    height: 22px !important;
}

section.sec:has(.bz-sup) .bz-sup-w:hover .bz-sup-w-ic {
    transform: scale(1.08) rotate(-3deg) !important;

    background: #7cbf00 !important;
    color: #20300f !important;

    box-shadow:
        0 6px 16px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   ЗАГЛАВИЯ НА КОНТАКТИТЕ
   ========================================================================== */

section.sec:has(.bz-sup) .bz-sup-w b {
    display: block !important;

    margin-bottom: 5px !important;

    font-size: 16px !important;
    font-weight: 750 !important;

    color: #1d2617 !important;

    transition: color 0.3s ease !important;
}

section.sec:has(.bz-sup) .bz-sup-w:hover b {
    color: #4f8d0c !important;
}

/* Вторичен текст */
section.sec:has(.bz-sup) .bz-sup-w > span:last-child {
    font-size: 12px !important;
    color: #7a8374 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 950px) {

    section.sec:has(.bz-sup) .bz-sup {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
        padding: 45px !important;
    }

    section.sec:has(.bz-sup) .bz-sup > div:first-child > p {
        max-width: 650px !important;
    }

    section.sec:has(.bz-sup) .bz-sup-nums {
        max-width: 600px !important;
    }

    section.sec:has(.bz-sup) .bz-sup-ways {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    section.sec:has(.bz-sup) .bz-sup-w {
        min-height: 160px !important;
    }
}

/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 700px) {

    section.sec:has(.bz-sup) {
        padding: 60px 16px !important;
    }

    section.sec:has(.bz-sup) .bz-sup {
        padding: 30px 22px !important;
        border-radius: 20px !important;
        gap: 32px !important;
    }

    section.sec:has(.bz-sup) .bz-sup h2 {
        font-size: 1.9rem !important;
    }

    section.sec:has(.bz-sup) .bz-sup > div:first-child > p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    section.sec:has(.bz-sup) .bz-sup-nums {
        grid-template-columns: 1fr 1fr !important;
    }

    section.sec:has(.bz-sup) .bz-sup-ways {
        grid-template-columns: 1fr 1fr !important;
    }

    section.sec:has(.bz-sup) .bz-sup-w {
        min-height: 145px !important;
        padding: 18px !important;
    }
}

/* ==========================================================================
   МНОГО МАЛЪК ТЕЛЕФОН
   ========================================================================== */

@media (max-width: 430px) {

    section.sec:has(.bz-sup) .bz-sup {
        padding: 26px 18px !important;
    }

    section.sec:has(.bz-sup) .bz-sup h2 {
        font-size: 1.7rem !important;
    }

    section.sec:has(.bz-sup) .bz-sup-nums {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.bz-sup) .bz-sup-ways {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.bz-sup) .bz-sup-w {
        min-height: auto !important;
    }
}


/*Имаш сайт и поща другаде?biznes-hosting/ */


/* ==========================================================================
   СЕКЦИЯ "ПРЕНАСЯНЕ" — СВЕТЪЛ И ИНТЕРАКТИВЕН ДИЗАЙН
   ========================================================================== */

#move {
    background: #fafafa !important;
    padding: 80px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

#move .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* Основен контейнер */
#move .bz-move {
    display: grid !important;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) !important;
    gap: 70px !important;
    align-items: center !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 24px !important;
    padding: 55px !important;
    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.04),
        0 2px 8px rgba(0, 0, 0, 0.03) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Декоративно зелено сияние */
#move .bz-move::before {
    content: "" !important;
    position: absolute !important;
    width: 300px !important;
    height: 300px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.08) !important;
    filter: blur(60px) !important;
    top: -160px !important;
    left: -120px !important;
    pointer-events: none !important;
}

#move .bz-move::after {
    content: "" !important;
    position: absolute !important;
    width: 260px !important;
    height: 260px !important;
    border-radius: 50% !important;
    background: rgba(105, 201, 14, 0.06) !important;
    filter: blur(60px) !important;
    bottom: -150px !important;
    right: -100px !important;
    pointer-events: none !important;
}

/* Лява част */
#move .bz-move > div:first-child {
    position: relative !important;
    z-index: 2 !important;
}

#move .bz-move h2 {
    font-size: clamp(28px, 3vw, 40px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    color: #111827 !important;
    margin: 0 0 18px 0 !important;
}

#move .bz-move h2::after {
    content: "" !important;
    display: block !important;
    width: 48px !important;
    height: 4px !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    margin-top: 18px !important;
}

#move .bz-move > div:first-child > p {
    font-size: 16px !important;
    line-height: 1.7 !important;
    color: #4b5563 !important;
    margin: 0 0 25px 0 !important;
    max-width: 520px !important;
}

/* Зелената гаранция */
#move .bz-move-safe {
    background: linear-gradient(
        135deg,
        #f3fbe7 0%,
        #f8fdf2 100%
    ) !important;
    border: 1px solid rgba(152, 219, 28, 0.3) !important;
    border-left: 4px solid #7cbf00 !important;
    border-radius: 12px !important;
    padding: 17px 19px !important;
    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    box-shadow: 0 5px 15px rgba(105, 201, 14, 0.06) !important;
}

#move .bz-move-safe b {
    color: #305a08 !important;
    font-weight: 800 !important;
}


/* ==========================================================================
   СТЪПКИ
   ========================================================================== */

#move .bz-move-steps {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Карта на стъпка */
#move .bz-move-s {
    min-height: 145px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 16px !important;
    padding: 22px !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 15px !important;
    position: relative !important;
    overflow: hidden !important;
    cursor: default !important;
    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease !important;
}

/* Малък зелен акцент */
#move .bz-move-s::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 3px !important;
    background: #7cbf00 !important;
    transform: scaleY(0) !important;
    transform-origin: bottom !important;
    transition: transform 0.3s ease !important;
}

/* Hover */
#move .bz-move-s:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.45) !important;
    background: #fbfff7 !important;
    box-shadow:
        0 15px 30px rgba(105, 201, 14, 0.10),
        0 3px 8px rgba(0, 0, 0, 0.04) !important;
}

#move .bz-move-s:hover::before {
    transform: scaleY(1) !important;
}


/* Номер */
#move .bz-move-n {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #f0f9df !important;
    border: 1px solid rgba(152, 219, 28, 0.35) !important;
    color: #305a08 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

#move .bz-move-s:hover .bz-move-n {
    background: #7cbf00 !important;
    color: #1f2d0c !important;
    transform: scale(1.08) !important;
}


/* Текст */
#move .bz-move-t {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

#move .bz-move-t b {
    font-size: 16px !important;
    line-height: 1.3 !important;
    color: #111827 !important;
    font-weight: 750 !important;
    transition: color 0.3s ease !important;
}

#move .bz-move-s:hover .bz-move-t b {
    color: #305a08 !important;
}

#move .bz-move-t > span {
    font-size: 13px !important;
    line-height: 1.55 !important;
    color: #6b7280 !important;
}


/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 1000px) {

    #move .bz-move {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
        padding: 40px !important;
    }

    #move .bz-move > div:first-child > p {
        max-width: 700px !important;
    }
}

@media (max-width: 650px) {

    #move {
        padding: 55px 15px !important;
    }

    #move .bz-move {
        padding: 28px 20px !important;
        border-radius: 18px !important;
        gap: 30px !important;
    }

    #move .bz-move h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    #move .bz-move-steps {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    #move .bz-move-s {
        min-height: auto !important;
        padding: 18px !important;
    }

    #move .bz-move-n {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
    }
}


/* Малко по-спокойно движение за хора,
   които са изключили анимациите */
@media (prefers-reduced-motion: reduce) {
    #move .bz-move-s,
    #move .bz-move-n,
    #move .bz-move-s::before {
        transition: none !important;
    }

    #move .bz-move-s:hover {
        transform: none !important;
    }
}


/*Кой план ми трябва?biznes-hosting/*/



/* ==========================================================================
   СЕКЦИЯ "КОЙ ПЛАН МИ ТРЯБВА?" — СВЕТЪЛ PREMIUM ДИЗАЙН
   ========================================================================== */

section.sec.sec-wash .bz-head {
    text-align: center !important;
    max-width: 760px !important;
    margin: 0 auto 48px auto !important;
}

section.sec.sec-wash .bz-head h2 {
    font-size: clamp(30px, 3vw, 40px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    color: #111827 !important;
    margin: 0 0 14px 0 !important;
}

section.sec.sec-wash .bz-head p {
    font-size: 16px !important;
    line-height: 1.65 !important;
    color: #6b7280 !important;
    margin: 0 !important;
}


/* ==========================================================================
   КАРТИ
   ========================================================================== */

section.sec.sec-wash .bz-cases {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
    margin: 0 0 35px 0 !important;
}

section.sec.sec-wash .bz-case {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    padding: 30px !important;
    min-height: 285px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    overflow: hidden !important;

    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.035),
        0 2px 6px rgba(0, 0, 0, 0.025) !important;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease !important;
}


/* Светъл декоративен ореол */
section.sec.sec-wash .bz-case::after {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.07) !important;
    filter: blur(45px) !important;
    right: -100px !important;
    top: -100px !important;
    pointer-events: none !important;
    opacity: 0 !important;
    transition: opacity 0.35s ease !important;
}


/* Зелената линия отляво */
section.sec.sec-wash .bz-case::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 4px !important;
    background: #7cbf00 !important;
    transform: scaleY(0) !important;
    transform-origin: bottom !important;
    transition: transform 0.3s ease !important;
}


/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec.sec-wash .bz-case-ic {
    width: 52px !important;
    height: 52px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #f1f9e4 !important;
    border: 1px solid rgba(152, 219, 28, 0.28) !important;
    border-radius: 14px !important;

    color: #5a8d13 !important;

    margin-bottom: 22px !important;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease !important;

    position: relative !important;
    z-index: 2 !important;
}

section.sec.sec-wash .bz-case-ic svg {
    width: 24px !important;
    height: 24px !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec.sec-wash .bz-case h3 {
    font-size: 19px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
    color: #111827 !important;

    margin: 0 0 12px 0 !important;

    position: relative !important;
    z-index: 2 !important;

    transition: color 0.3s ease !important;
}


/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

section.sec.sec-wash .bz-case > p {
    font-size: 14px !important;
    line-height: 1.65 !important;
    color: #6b7280 !important;

    margin: 0 0 24px 0 !important;

    flex-grow: 1 !important;

    position: relative !important;
    z-index: 2 !important;
}


/* ==========================================================================
   ДОЛЕН ЕТИКЕТ
   ========================================================================== */

section.sec.sec-wash .bz-case-p {
    display: inline-flex !important;
    align-items: center !important;

    background: #f7faf2 !important;
    border: 1px solid #e4edd4 !important;

    border-radius: 8px !important;
    padding: 9px 13px !important;

    color: #6b7280 !important;
    font-size: 13px !important;
    font-weight: 600 !important;

    position: relative !important;
    z-index: 2 !important;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease !important;
}

section.sec.sec-wash .bz-case-p b {
    color: #305a08 !important;
    font-weight: 800 !important;
    margin-left: 4px !important;
}


/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec.sec-wash .bz-case:hover {
    transform: translateY(-8px) !important;

    border-color: rgba(152, 219, 28, 0.45) !important;

    background: #ffffff !important;

    box-shadow:
        0 20px 40px rgba(105, 201, 14, 0.10),
        0 5px 12px rgba(0, 0, 0, 0.04) !important;
}

section.sec.sec-wash .bz-case:hover::before {
    transform: scaleY(1) !important;
}

section.sec.sec-wash .bz-case:hover::after {
    opacity: 1 !important;
}

section.sec.sec-wash .bz-case:hover .bz-case-ic {
    background: #7cbf00 !important;
    color: #243507 !important;

    transform: translateY(-2px) scale(1.04) !important;

    box-shadow:
        0 8px 18px rgba(152, 219, 28, 0.22) !important;
}

section.sec.sec-wash .bz-case:hover h3 {
    color: #305a08 !important;
}

section.sec.sec-wash .bz-case:hover .bz-case-p {
    background: #f0f9df !important;
    border-color: rgba(152, 219, 28, 0.35) !important;
    color: #4b5563 !important;
}


/* ==========================================================================
   ТЕКСТ "НЕ СИ СИГУРЕН?"
   ========================================================================== */

section.sec.sec-wash .bz-ask {
    text-align: center !important;

    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #6b7280 !important;

    max-width: 800px !important;
    margin: 0 auto !important;
}

section.sec.sec-wash .bz-ask a {
    color: #4f8010 !important;
    font-weight: 700 !important;
    text-decoration: none !important;

    border-bottom: 1px solid rgba(79, 128, 16, 0.3) !important;

    transition:
        color 0.2s ease,
        border-color 0.2s ease !important;
}

section.sec.sec-wash .bz-ask a:hover {
    color: #305a08 !important;
    border-color: #305a08 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 950px) {

    section.sec.sec-wash .bz-cases {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec.sec-wash .bz-case:last-child {
        grid-column: 1 / -1 !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec.sec-wash .bz-head {
        margin-bottom: 32px !important;
    }

    section.sec.sec-wash .bz-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec.sec-wash .bz-head p {
        font-size: 15px !important;
    }

    section.sec.sec-wash .bz-cases {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    section.sec.sec-wash .bz-case:last-child {
        grid-column: auto !important;
    }

    section.sec.sec-wash .bz-case {
        min-height: auto !important;
        padding: 24px !important;
        border-radius: 15px !important;
    }

    section.sec.sec-wash .bz-case-ic {
        width: 48px !important;
        height: 48px !important;
        margin-bottom: 18px !important;
    }

    section.sec.sec-wash .bz-case h3 {
        font-size: 18px !important;
    }
}


/* ==========================================================================
   ACCESSIBILITY — БЕЗ АНИМАЦИИ ПРИ НАСТРОЙКА REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec.sec-wash .bz-case,
    section.sec.sec-wash .bz-case-ic,
    section.sec.sec-wash .bz-case::before,
    section.sec.sec-wash .bz-case::after {
        transition: none !important;
    }

    section.sec.sec-wash .bz-case:hover {
        transform: none !important;
    }
}
/*reseller-hosting/Клиентът ти вижда теб, не нас*/



/* ==========================================================================
   WHITE-LABEL СЕКЦИЯ — "Клиентът ти вижда теб, не нас"
   Светъл, модерен и интерактивен дизайн
   ========================================================================== */

section.sec:has(.rs-white) {
    background: #f8faf6 !important;
    padding: 90px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

section.sec:has(.rs-white) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВНА ЧАСТ
   ========================================================================== */

section.sec:has(.rs-white) .rs-head {
    max-width: 760px !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section.sec:has(.rs-white) .rs-head h2 {
    margin: 0 0 14px !important;
    color: #17210f !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1.2px !important;
}

section.sec:has(.rs-white) .rs-head p {
    margin: 0 !important;
    color: #64705f !important;
    font-size: 17px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   ОСНОВЕН LAYOUT
   ========================================================================== */

section.sec:has(.rs-white) .rs-white {
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr) !important;
    gap: 55px !important;
    align-items: center !important;
}

/* ==========================================================================
   DASHBOARD MOCKUP
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-box {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #dfe8d8 !important;
    border-radius: 18px !important;
    padding: 0 !important;
    overflow: hidden !important;

    box-shadow:
        0 25px 60px rgba(35, 55, 25, 0.10),
        0 8px 20px rgba(35, 55, 25, 0.06) !important;

    transform: perspective(1200px) rotateY(0deg) rotateX(0deg) !important;
    transition:
        transform .45s ease,
        box-shadow .45s ease,
        border-color .45s ease !important;
}

/* Леко повдигане при hover */

section.sec:has(.rs-white) .rs-white-box:hover {
    transform: translateY(-8px) !important;

    border-color: rgba(152, 219, 28, .65) !important;

    box-shadow:
        0 35px 75px rgba(48, 90, 8, .14),
        0 10px 25px rgba(152, 219, 28, .08) !important;
}

/* Светещ декоративен ореол */

section.sec:has(.rs-white) .rs-white-box::after {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    right: -90px !important;
    bottom: -90px !important;
    background: rgba(152, 219, 28, .12) !important;
    border-radius: 50% !important;
    filter: blur(10px) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   BROWSER BAR
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-bar {
    height: 54px !important;
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 0 18px !important;

    background: #f4f7f1 !important;
    border-bottom: 1px solid #e2e9de !important;
}

/* Browser dots */

section.sec:has(.rs-white) .rs-white-dots {
    display: flex !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
}

section.sec:has(.rs-white) .rs-white-dots i {
    width: 9px !important;
    height: 9px !important;
    border-radius: 50% !important;
    background: #cbd5c5 !important;
    display: block !important;
}

section.sec:has(.rs-white) .rs-white-dots i:first-child {
    background: #7cbf00 !important;
}

section.sec:has(.rs-white) .rs-white-url {
    flex: 1 !important;
    min-width: 0 !important;

    padding: 8px 14px !important;
    border-radius: 8px !important;

    background: #ffffff !important;
    border: 1px solid #e2e8df !important;

    color: #7b8577 !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

section.sec:has(.rs-white) .rs-white-url b {
    color: #305a08 !important;
}

/* ==========================================================================
   DASHBOARD BODY
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-body {
    padding: 30px !important;
    background: #ffffff !important;
}

/* Logo */

section.sec:has(.rs-white) .rs-white-logo {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 28px !important;
}

section.sec:has(.rs-white) .rs-white-mark {
    width: 44px !important;
    height: 44px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    background: linear-gradient(
        135deg,
        #7cbf00,
        #69c90e
    ) !important;

    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;

    box-shadow: 0 7px 18px rgba(105, 201, 14, .22) !important;
}

section.sec:has(.rs-white) .rs-white-name {
    color: #1d2719 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   DASHBOARD ROWS
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-rows {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

section.sec:has(.rs-white) .rs-white-r {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;

    padding: 15px 16px !important;

    background: #f8faf7 !important;
    border: 1px solid #e7eee3 !important;
    border-radius: 10px !important;

    color: #667060 !important;
    font-size: 13px !important;

    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease !important;
}

section.sec:has(.rs-white) .rs-white-r:hover {
    transform: translateX(5px) !important;
    background: #f3f9ed !important;
    border-color: rgba(152, 219, 28, .45) !important;
}

section.sec:has(.rs-white) .rs-white-r b {
    color: #305a08 !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   ДЯСНА КОЛОНА — FEATURE CARDS
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-l {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

section.sec:has(.rs-white) .rs-white-i {
    position: relative !important;

    display: flex !important;
    align-items: flex-start !important;
    gap: 16px !important;

    padding: 20px !important;

    background: #ffffff !important;
    border: 1px solid #e2e9de !important;
    border-radius: 14px !important;

    box-shadow: 0 5px 18px rgba(35, 55, 25, .045) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}

/* Hover */

section.sec:has(.rs-white) .rs-white-i:hover {
    transform: translateX(7px) !important;

    background: #fbfef9 !important;

    border-color: rgba(152, 219, 28, .55) !important;

    box-shadow:
        0 12px 28px rgba(48, 90, 8, .09),
        0 0 0 3px rgba(152, 219, 28, .05) !important;
}

/* ==========================================================================
   ICONS
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-ic {
    width: 46px !important;
    height: 46px !important;

    flex: 0 0 46px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 12px !important;

    background: #f0f8e8 !important;
    color: #5da80b !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.rs-white) .rs-white-i:hover .rs-white-ic {
    background: #7cbf00 !important;
    color: #ffffff !important;
    transform: scale(1.08) rotate(-3deg) !important;
}

section.sec:has(.rs-white) .rs-white-ic svg {
    width: 21px !important;
    height: 21px !important;
}

/* ==========================================================================
   TEXT
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-i > span:last-child {
    display: block !important;
    min-width: 0 !important;
}

section.sec:has(.rs-white) .rs-white-i b {
    display: block !important;
    margin: 1px 0 6px !important;

    color: #1d2719 !important;

    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;

    transition: color .25s ease !important;
}

section.sec:has(.rs-white) .rs-white-i:hover b {
    color: #4f8d0b !important;
}

section.sec:has(.rs-white) .rs-white-i p {
    margin: 0 !important;

    color: #6b7567 !important;

    font-size: 13px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   ДЕКОРАТИВЕН АКЦЕНТ ПОД СЕКЦИЯТА
   ========================================================================== */

section.sec:has(.rs-white) .rs-white-l::before {
    content: "WHITE-LABEL" !important;

    display: inline-flex !important;
    align-self: flex-start !important;

    margin-bottom: 4px !important;
    padding: 6px 10px !important;

    border-radius: 999px !important;

    background: #edf7e4 !important;
    color: #5b940e !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 1px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.rs-white) {
        padding: 70px 20px !important;
    }

    section.sec:has(.rs-white) .rs-white {
        grid-template-columns: 1fr !important;
        gap: 35px !important;
    }

    section.sec:has(.rs-white) .rs-white-l {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec:has(.rs-white) .rs-white-l::before {
        grid-column: 1 / -1 !important;
    }
}

/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.rs-white) {
        padding: 60px 16px !important;
    }

    section.sec:has(.rs-white) .rs-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.rs-white) .rs-head h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.rs-white) .rs-head p {
        font-size: 15px !important;
    }

    section.sec:has(.rs-white) .rs-white-l {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.rs-white) .rs-white-body {
        padding: 20px !important;
    }

    section.sec:has(.rs-white) .rs-white-bar {
        padding: 0 12px !important;
    }

    section.sec:has(.rs-white) .rs-white-url {
        font-size: 10px !important;
        padding: 7px 9px !important;
    }

    section.sec:has(.rs-white) .rs-white-r {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 5px !important;
    }

    section.sec:has(.rs-white) .rs-white-i {
        padding: 17px !important;
    }
}

/* ==========================================================================
   ACCESSIBILITY — REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.rs-white) *,
    section.sec:has(.rs-white) *::before,
    section.sec:has(.rs-white) *::after {
        transition: none !important;
        transform: none !important;
    }
}


/*reseller-hosting/Препродажбата не е за всеки*/


/* ==========================================================================
   СЕКЦИЯ "ПРЕПРОДАЖБАТА НЕ Е ЗА ВСЕКИ"
   ТЪМЕН PREMIUM / INTERACTIVE DESIGN
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) {
    background:
        radial-gradient(circle at 15% 20%, rgba(152, 219, 28, 0.07), transparent 30%),
        radial-gradient(circle at 85% 75%, rgba(152, 219, 28, 0.05), transparent 30%),
        #0d100a !important;

    padding: 95px 20px !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;

    position: relative !important;
    overflow: hidden !important;
}

/* Декоративна светлина */

section.sec.sec-wash:has(.rs-vs)::before {
    content: "" !important;
    position: absolute !important;

    width: 500px !important;
    height: 500px !important;

    top: -250px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    background: rgba(152, 219, 28, 0.055) !important;
    border-radius: 50% !important;
    filter: blur(80px) !important;

    pointer-events: none !important;
}

/* Контейнер */

section.sec.sec-wash:has(.rs-vs) .wrap-w {
    max-width: 1120px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 1 !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-head {
    max-width: 760px !important;
    margin: 0 auto 58px !important;
    text-align: center !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-head h2 {
    margin: 0 0 16px !important;

    color: #ffffff !important;
    font-size: clamp(31px, 4vw, 46px) !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    letter-spacing: -1.3px !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-head p {
    margin: 0 !important;

    color: #aab3a4 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   ДВЕТЕ КАРТИ
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
}

/* Основна карта */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    padding: 32px !important;

    background: #151a11 !important;
    border: 1px solid #293225 !important;
    border-radius: 18px !important;

    box-shadow:
        0 18px 45px rgba(0, 0, 0, .30),
        inset 0 1px 0 rgba(255,255,255,.025) !important;

    overflow: hidden !important;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease !important;
}

/* Горен декоративен слой */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: #30382b !important;
}

/* Hover */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i:hover {
    transform: translateY(-7px) !important;

    border-color: #3b4932 !important;

    background: #181e14 !important;

    box-shadow:
        0 25px 55px rgba(0, 0, 0, .42) !important;
}

/* ==========================================================================
   ПРЕПРОДАЖБА — АКЦЕНТИРАНА КАРТА
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i.is-this {
    background:
        linear-gradient(
            145deg,
            #19200f 0%,
            #12170e 55%,
            #10140c 100%
        ) !important;

    border-color: rgba(152, 219, 28, .35) !important;

    box-shadow:
        0 20px 55px rgba(0, 0, 0, .38),
        0 0 35px rgba(152, 219, 28, .055),
        inset 0 1px 0 rgba(152, 219, 28, .06) !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-vs-i.is-this::before {
    background: linear-gradient(
        90deg,
        #69c90e,
        #7cbf00,
        #69c90e
    ) !important;
}

/* Glow около препродажбата */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i.is-this::after {
    content: "" !important;

    position: absolute !important;

    width: 180px !important;
    height: 180px !important;

    top: -90px !important;
    right: -90px !important;

    background: rgba(152, 219, 28, .09) !important;
    border-radius: 50% !important;

    filter: blur(35px) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   CARD HEADER
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 15px !important;

    margin-bottom: 28px !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-vs-h b {
    color: #ffffff !important;

    font-size: 21px !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    letter-spacing: -.4px !important;
}

/* ==========================================================================
   BADGES
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .pill {
    display: inline-flex !important;
    align-items: center !important;

    padding: 6px 11px !important;

    border-radius: 999px !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .6px !important;
    text-transform: uppercase !important;

    white-space: nowrap !important;
}

/* Препродажба */

section.sec.sec-wash:has(.rs-vs) .pill.p-rose {
    background: rgba(152, 219, 28, .13) !important;
    border: 1px solid rgba(152, 219, 28, .25) !important;
    color: #a8e33d !important;

    box-shadow: 0 0 15px rgba(152, 219, 28, .08) !important;
}

/* Бизнес хостинг */

section.sec.sec-wash:has(.rs-vs) .pill.p-muted {
    background: #20261d !important;
    border: 1px solid #323a2f !important;
    color: #9ca596 !important;
}

/* ==========================================================================
   LIST
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-l {
    list-style: none !important;

    padding: 0 !important;
    margin: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 17px !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-vs-l li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 13px !important;

    color: #9fa89a !important;

    font-size: 14px !important;
    line-height: 1.6 !important;
}

/* Bold */

section.sec.sec-wash:has(.rs-vs) .rs-vs-l li b {
    color: #e7ebe4 !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   YES / NO ИКОНИ
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-d {
    width: 27px !important;
    height: 27px !important;

    flex: 0 0 27px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-top: 1px !important;

    border-radius: 50% !important;
}

/* Check */

section.sec.sec-wash:has(.rs-vs) .rs-d.yes {
    background: rgba(152, 219, 28, .11) !important;
    border: 1px solid rgba(152, 219, 28, .23) !important;
    color: #7cbf00 !important;
}

/* X */

section.sec.sec-wash:has(.rs-vs) .rs-d.no {
    background: rgba(255, 255, 255, .035) !important;
    border: 1px solid #343a32 !important;
    color: #737b70 !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-d svg {
    width: 14px !important;
    height: 14px !important;
}

/* ==========================================================================
   HOVER НА CHECK ИКОНИТЕ
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-i:hover .rs-d.yes {
    background: #7cbf00 !important;
    color: #10150b !important;

    box-shadow: 0 0 16px rgba(152, 219, 28, .18) !important;
}

/* ==========================================================================
   CTA
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs-go {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    margin-top: 28px !important;
    padding: 13px 18px !important;

    border-radius: 10px !important;

    background: transparent !important;
    border: 1px solid #3b4636 !important;

    color: #cbd2c6 !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    text-decoration: none !important;

    transition:
        background .3s ease,
        border-color .3s ease,
        color .3s ease,
        transform .3s ease,
        box-shadow .3s ease !important;
}

section.sec.sec-wash:has(.rs-vs) .rs-vs-go:hover {
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;

    color: #10150b !important;

    transform: translateY(-2px) !important;

    box-shadow: 0 10px 25px rgba(152, 219, 28, .16) !important;
}

/* ==========================================================================
   ЛЕКА ВИЗУАЛНА РАЗДЕЛИТЕЛНА ЛИНИЯ
   ========================================================================== */

section.sec.sec-wash:has(.rs-vs) .rs-vs::before {
    content: "ИЛИ" !important;

    position: absolute !important;

    left: 50% !important;
    transform: translate(-50%, -50%) !important;

    margin-top: 220px !important;

    z-index: 5 !important;

    width: 38px !important;
    height: 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 50% !important;

    background: #11150e !important;
    border: 1px solid #30382b !important;

    color: #687160 !important;

    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: .5px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec.sec-wash:has(.rs-vs) {
        padding: 75px 20px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs::before {
        display: none !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec.sec-wash:has(.rs-vs) {
        padding: 60px 16px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-head {
        margin-bottom: 38px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-head h2 {
        font-size: 30px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs-i {
        padding: 24px 20px !important;
        border-radius: 15px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs-h {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 10px !important;
        margin-bottom: 23px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs-h b {
        font-size: 19px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-vs-l li {
        font-size: 13px !important;
        gap: 10px !important;
    }

    section.sec.sec-wash:has(.rs-vs) .rs-d {
        width: 25px !important;
        height: 25px !important;
        flex-basis: 25px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec.sec-wash:has(.rs-vs) *,
    section.sec.sec-wash:has(.rs-vs) *::before,
    section.sec.sec-wash:has(.rs-vs) *::after {
        transition: none !important;
        transform: none !important;
    }
}


/*Кой отговаря на клиента ти reseller-hosting/*/


/* ==========================================================================
   СЕКЦИЯ „КОЙ ОТГОВАРЯ НА КЛИЕНТА ТИ“ — СВЕТЪЛ ИНТЕРАКТИВЕН ДИЗАЙН
   ========================================================================== */

/* Основна секция */
section.sec:has(.rs-who) {
    background: #fafafa !important;
    padding: 80px 20px !important;
}

/* Контейнер */
section.sec:has(.rs-who) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* Заглавна част */
section.sec:has(.rs-who) .rs-head {
    max-width: 720px !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section.sec:has(.rs-who) .rs-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.rs-who) .rs-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}


/* ==========================================================================
   ДВЕТЕ ОСНОВНИ КАРТИ
   ========================================================================== */

.rs-who {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
}


/* Основна карта */
.rs-who .rs-who-i {
    position: relative !important;
    padding: 30px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    box-shadow:
        0 4px 12px rgba(17, 24, 39, 0.04),
        0 1px 3px rgba(17, 24, 39, 0.03) !important;
    overflow: hidden !important;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease !important;
}


/* Малък декоративен светъл фон */
.rs-who .rs-who-i::before {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    top: -100px !important;
    right: -80px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.08) !important;
    pointer-events: none !important;
    transition: transform 0.4s ease !important;
}


/* Hover */
.rs-who .rs-who-i:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow:
        0 18px 40px rgba(17, 24, 39, 0.08),
        0 5px 15px rgba(152, 219, 28, 0.08) !important;
}

.rs-who .rs-who-i:hover::before {
    transform: scale(1.35) !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

.rs-who .rs-who-h {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin-bottom: 25px !important;
    position: relative !important;
    z-index: 1 !important;
}

.rs-who .rs-who-h b {
    color: #111827 !important;
    font-size: 20px !important;
    font-weight: 750 !important;
    letter-spacing: -0.3px !important;
}


/* Иконка */
.rs-who .rs-who-ic {
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: #f1f8e8 !important;
    color: #4d7d0b !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    transition: all 0.3s ease !important;
}

.rs-who .rs-who-ic svg {
    width: 22px !important;
    height: 22px !important;
}

.rs-who .rs-who-i:hover .rs-who-ic {
    background: #7cbf00 !important;
    color: #ffffff !important;
    border-color: #7cbf00 !important;
    transform: scale(1.06) !important;
}


/* ==========================================================================
   СПИСЪК
   ========================================================================== */

.rs-who .rs-who-l {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
    position: relative !important;
    z-index: 1 !important;
}

.rs-who .rs-who-l li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}


/* Точката */
.rs-who .rs-who-l li i {
    width: 8px !important;
    height: 8px !important;
    flex: 0 0 8px !important;
    margin-top: 6px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 0 4px rgba(152, 219, 28, 0.12) !important;
}


/* Hover на ред */
.rs-who .rs-who-l li {
    transition: transform 0.25s ease, color 0.25s ease !important;
}

.rs-who .rs-who-l li:hover {
    transform: translateX(4px) !important;
    color: #1f2937 !important;
}


/* ==========================================================================
   РАЗЛИКА МЕЖДУ „ТИ“ И „НИЕ“
   ========================================================================== */

/* Твоята страна */
.rs-who .rs-who-i.you {
    border-top: 3px solid #d1d5db !important;
}


/* Нашата страна — леко подчертаваме */
.rs-who .rs-who-i.us {
    border-top: 3px solid #7cbf00 !important;
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #ffffff 75%,
            #f7fbea 100%
        ) !important;
}


/* Акцент върху „Ние“ */
.rs-who .rs-who-i.us .rs-who-ic {
    background: #edf8df !important;
    color: #4d7d0b !important;
}


/* ==========================================================================
   ДОЛНА ИНФОРМАЦИОННА ЛЕНТА
   ========================================================================== */

.rs-who-note {
    position: relative !important;
    margin-top: 28px !important;
    padding: 22px 26px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: #f1f8e8 !important;
    border: 1px solid rgba(152, 219, 28, 0.3) !important;
    border-radius: 14px !important;
    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    box-shadow: 0 5px 20px rgba(152, 219, 28, 0.05) !important;
}


/* Вертикален зелен акцент */
.rs-who-note::before {
    content: "" !important;
    width: 4px !important;
    height: 38px !important;
    flex: 0 0 4px !important;
    background: #7cbf00 !important;
    border-radius: 99px !important;
}


.rs-who-note b {
    color: #305a08 !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   ЛЕК HOVER НА ИНФОРМАЦИОННАТА ЛЕНТА
   ========================================================================== */

.rs-who-note {
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease !important;
}

.rs-who-note:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(152, 219, 28, 0.5) !important;
    box-shadow: 0 12px 28px rgba(152, 219, 28, 0.1) !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    .rs-who {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .rs-who .rs-who-i {
        padding: 26px !important;
    }

    .rs-who-note {
        align-items: flex-start !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec:has(.rs-who) {
        padding: 60px 16px !important;
    }

    section.sec:has(.rs-who) .rs-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.rs-who) .rs-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec:has(.rs-who) .rs-head p {
        font-size: 15px !important;
    }

    .rs-who .rs-who-i {
        padding: 22px !important;
        border-radius: 15px !important;
    }

    .rs-who .rs-who-h {
        margin-bottom: 20px !important;
    }

    .rs-who .rs-who-h b {
        font-size: 18px !important;
    }

    .rs-who .rs-who-ic {
        width: 42px !important;
        height: 42px !important;
        flex-basis: 42px !important;
    }

    .rs-who .rs-who-l {
        gap: 13px !important;
    }

    .rs-who .rs-who-l li {
        font-size: 13.5px !important;
    }

    .rs-who-note {
        padding: 18px !important;
        font-size: 13.5px !important;
        gap: 9px !important;
    }
}


/*vps/Първо реши това*/


 /* ==========================================================================
    VPS — „ПЪРВО РЕШИ ТОВА“ — СВЕТЪЛ ДИЗАЙН
    ========================================================================== */

section.sec:has(.vp-fork) {
    background: #fafafa !important;
    padding: 80px 20px !important;
}

section.sec:has(.vp-fork) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}


/* ==========================================================================
   ЗАГЛАВНА ЧАСТ
   ========================================================================== */

section.sec:has(.vp-fork) .vp-head {
    max-width: 720px !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section.sec:has(.vp-fork) .vp-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.vp-fork) .vp-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}


/* ==========================================================================
   ДВЕТЕ КАРТИ
   ========================================================================== */

.vp-fork {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
}


/* Основна карта */
.vp-fork .vp-fork-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 32px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    box-shadow:
        0 5px 16px rgba(17, 24, 39, 0.04),
        0 1px 3px rgba(17, 24, 39, 0.03) !important;
    overflow: hidden !important;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease !important;
}


/* Декоративен кръг */
.vp-fork .vp-fork-i::before {
    content: "" !important;
    position: absolute !important;
    width: 190px !important;
    height: 190px !important;
    top: -110px !important;
    right: -90px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.07) !important;
    transition: transform 0.4s ease !important;
    pointer-events: none !important;
}


/* Hover */
.vp-fork .vp-fork-i:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(152, 219, 28, 0.4) !important;
    box-shadow:
        0 20px 45px rgba(17, 24, 39, 0.08),
        0 5px 18px rgba(152, 219, 28, 0.08) !important;
}

.vp-fork .vp-fork-i:hover::before {
    transform: scale(1.35) !important;
}


/* ==========================================================================
   ГОРНА ЧАСТ НА КАРТИТЕ
   ========================================================================== */

.vp-fork .vp-fork-h {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin-bottom: 20px !important;
    position: relative !important;
    z-index: 1 !important;
}

.vp-fork .vp-fork-h b {
    color: #111827 !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    letter-spacing: -0.4px !important;
}


/* Иконка */
.vp-fork .vp-fork-ic {
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: #f3f4f6 !important;
    color: #4b5563 !important;
    border: 1px solid #e5e7eb !important;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

.vp-fork .vp-fork-ic svg {
    width: 23px !important;
    height: 23px !important;
}


/* Hover иконка */
.vp-fork .vp-fork-i:hover .vp-fork-ic {
    transform: scale(1.06) !important;
}


/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

.vp-fork .vp-fork-sub {
    position: relative !important;
    z-index: 1 !important;
    margin: 0 0 22px !important;
    color: #4b5563 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
}

.vp-fork .vp-fork-who {
    position: relative !important;
    z-index: 1 !important;
    margin-top: auto !important;
    padding: 17px 18px !important;
    background: #f9fafb !important;
    border: 1px solid #eef0f2 !important;
    border-radius: 11px !important;
    color: #6b7280 !important;
    font-size: 13.5px !important;
    line-height: 1.55 !important;
}

.vp-fork .vp-fork-who b {
    color: #374151 !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   „БЕЗ УПРАВЛЕНИЕ“
   ========================================================================== */

.vp-fork .vp-fork-i.self {
    border-top: 3px solid #d1d5db !important;
}

.vp-fork .vp-fork-i.self:hover {
    border-top-color: #9ca3af !important;
}


/* ==========================================================================
   „С УПРАВЛЕНИЕ“ — ПРЕПОРЪЧАН
   ========================================================================== */

.vp-fork .vp-fork-i.is-rec {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #ffffff 70%,
            #f4faea 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.4) !important;
    border-top: 3px solid #7cbf00 !important;

    box-shadow:
        0 8px 24px rgba(152, 219, 28, 0.08),
        0 2px 5px rgba(17, 24, 39, 0.04) !important;
}


/* Зелена иконка */
.vp-fork .vp-fork-i.is-rec .vp-fork-ic {
    background: #edf8df !important;
    color: #4d7d0b !important;
    border-color: rgba(152, 219, 28, 0.3) !important;
}

.vp-fork .vp-fork-i.is-rec:hover .vp-fork-ic {
    background: #7cbf00 !important;
    color: #ffffff !important;
    border-color: #7cbf00 !important;
}


/* Подчертаване на текста */
.vp-fork .vp-fork-i.is-rec .vp-fork-who {
    background: #f1f8e8 !important;
    border-color: rgba(152, 219, 28, 0.25) !important;
}

.vp-fork .vp-fork-i.is-rec .vp-fork-who b {
    color: #305a08 !important;
}


/* ==========================================================================
   БУТОН
   ========================================================================== */

.vp-fork .vp-fork-go {
    position: relative !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    margin-top: 18px !important;
    padding: 13px 20px !important;

    background: #7cbf00 !important;
    color: #203b05 !important;

    border: 1px solid #7cbf00 !important;
    border-radius: 10px !important;

    font-size: 14px !important;
    font-weight: 750 !important;
    text-decoration: none !important;

    box-shadow:
        0 5px 15px rgba(152, 219, 28, 0.2) !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease !important;
}

.vp-fork .vp-fork-go:hover {
    background: #86c917 !important;
    color: #172b04 !important;
    transform: translateY(-2px) !important;
    box-shadow:
        0 9px 22px rgba(152, 219, 28, 0.3) !important;
}


/* ==========================================================================
   БЕЛЕЖКА ПРИ „БЕЗ УПРАВЛЕНИЕ“
   ========================================================================== */

.vp-fork .vp-fork-note {
    position: relative !important;
    z-index: 1 !important;
    margin: 18px 0 0 !important;
    padding: 12px 15px !important;
    background: #f9fafb !important;
    border-radius: 9px !important;
    border-left: 3px solid #d1d5db !important;
    color: #6b7280 !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    .vp-fork {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .vp-fork .vp-fork-i {
        padding: 27px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec:has(.vp-fork) {
        padding: 60px 16px !important;
    }

    section.sec:has(.vp-fork) .vp-head {
        margin-bottom: 34px !important;
    }

    section.sec:has(.vp-fork) .vp-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec:has(.vp-fork) .vp-head p {
        font-size: 15px !important;
    }

    .vp-fork .vp-fork-i {
        padding: 22px !important;
        border-radius: 15px !important;
    }

    .vp-fork .vp-fork-h {
        margin-bottom: 17px !important;
    }

    .vp-fork .vp-fork-h b {
        font-size: 18px !important;
    }

    .vp-fork .vp-fork-ic {
        width: 43px !important;
        height: 43px !important;
        flex-basis: 43px !important;
    }

    .vp-fork .vp-fork-sub {
        font-size: 14px !important;
    }

    .vp-fork .vp-fork-who {
        font-size: 13px !important;
        padding: 15px !important;
    }
}


/*vps/ Двете неща, които самостоятелният сървър няма*/


/* ==========================================================================
   VPS — „ДВЕТЕ НЕЩА, КОИТО САМОСТОЯТЕЛНИЯТ СЪРВЪР НЯМА“
   DARK PREMIUM / TECH DESIGN
   ========================================================================== */

/* Основна секция */
section.sec:has(.vp-grow) {
    background:
        radial-gradient(
            circle at 15% 10%,
            rgba(152, 219, 28, 0.055),
            transparent 32%
        ),
        radial-gradient(
            circle at 85% 90%,
            rgba(105, 201, 14, 0.035),
            transparent 30%
        ),
        #0b0e09 !important;

    padding: 90px 20px !important;
    color: #ffffff !important;
}

section.sec:has(.vp-grow) .wrap-w {
    max-width: 1200px !important;
    margin: 0 auto !important;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.vp-grow) .vp-head {
    max-width: 760px !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section.sec:has(.vp-grow) .vp-head h2 {
    margin: 0 0 15px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 43px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1.2px !important;
}

section.sec:has(.vp-grow) .vp-head p {
    margin: 0 !important;
    color: #9ca3af !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}


/* ==========================================================================
   ОСНОВЕН LAYOUT
   ========================================================================== */

.vp-grow {
    display: grid !important;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr) !important;
    gap: 24px !important;
    align-items: stretch !important;
}


/* ==========================================================================
   ЛЯВА КАРТА — РАСТЕЖ
   ========================================================================== */

.vp-grow .vp-grow-box {
    position: relative !important;
    min-height: 100% !important;
    padding: 32px !important;

    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #10140d 60%,
            #0e120c 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 18px !important;

    box-shadow:
        0 20px 50px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.025) !important;

    overflow: hidden !important;

    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease !important;
}


/* Светещ декоративен кръг */
.vp-grow .vp-grow-box::before {
    content: "" !important;
    position: absolute !important;
    width: 260px !important;
    height: 260px !important;
    right: -130px !important;
    top: -140px !important;
    border-radius: 50% !important;

    background: rgba(152, 219, 28, 0.08) !important;

    filter: blur(2px) !important;
    pointer-events: none !important;

    transition: transform 0.5s ease !important;
}

.vp-grow .vp-grow-box:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.5) !important;

    box-shadow:
        0 25px 60px rgba(0, 0, 0, 0.45),
        0 0 35px rgba(152, 219, 28, 0.07) !important;
}

.vp-grow .vp-grow-box:hover::before {
    transform: scale(1.25) !important;
}


/* Заглавие */
.vp-grow .vp-grow-h {
    position: relative !important;
    z-index: 1 !important;

    margin-bottom: 28px !important;

    color: #ffffff !important;
    font-size: 20px !important;
    font-weight: 750 !important;
    letter-spacing: -0.3px !important;
}


/* ==========================================================================
   STEP / PLAN
   ========================================================================== */

.vp-grow .vp-grow-steps {
    position: relative !important;
    z-index: 1 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin-bottom: 25px !important;
}

.vp-grow .vp-grow-s {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    padding: 18px 20px !important;

    background: #0b0f09 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    border-radius: 12px !important;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease !important;
}

.vp-grow .vp-grow-s:hover {
    transform: translateX(5px) !important;
    background: #11170d !important;
    border-color: rgba(152, 219, 28, 0.42) !important;
}

.vp-grow .vp-grow-s b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 750 !important;
}

.vp-grow .vp-grow-s span {
    color: #7cbf00 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}


/* ==========================================================================
   TIME / 60 СЕКУНДИ
   ========================================================================== */

.vp-grow .vp-grow-time {
    position: relative !important;
    z-index: 1 !important;

    display: flex !important;
    align-items: center !important;
    gap: 9px !important;

    margin-top: 15px !important;
    padding: 15px 17px !important;

    background: rgba(152, 219, 28, 0.07) !important;
    border: 1px solid rgba(152, 219, 28, 0.15) !important;
    border-radius: 11px !important;

    color: #9ca3af !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

.vp-grow .vp-grow-time svg {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
    color: #7cbf00 !important;
}

.vp-grow .vp-grow-time b {
    color: #d9f99d !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   ДЯСНА КОЛОНА — ПРЕДИМСТВА
   ========================================================================== */

.vp-grow .vp-grow-l {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
}


/* Individual feature */
.vp-grow .vp-grow-i {
    position: relative !important;

    display: flex !important;
    align-items: flex-start !important;
    gap: 17px !important;

    padding: 23px !important;

    background: #11140f !important;
    border: 1px solid #252a21 !important;
    border-radius: 15px !important;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.18) !important;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease !important;
}


/* Hover */
.vp-grow .vp-grow-i:hover {
    transform: translateX(6px) !important;

    background: #151a12 !important;
    border-color: rgba(152, 219, 28, 0.38) !important;

    box-shadow:
        0 12px 30px rgba(0, 0, 0, 0.3),
        -4px 0 20px rgba(152, 219, 28, 0.04) !important;
}


/* ==========================================================================
   ИКОНКИ
   ========================================================================== */

.vp-grow .vp-grow-ic {
    width: 45px !important;
    height: 45px !important;
    flex: 0 0 45px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 12px !important;

    background: rgba(152, 219, 28, 0.09) !important;
    border: 1px solid rgba(152, 219, 28, 0.2) !important;

    color: #7cbf00 !important;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease !important;
}

.vp-grow .vp-grow-ic svg {
    width: 21px !important;
    height: 21px !important;
}

.vp-grow .vp-grow-i:hover .vp-grow-ic {
    background: #7cbf00 !important;
    color: #172604 !important;
    transform: scale(1.08) !important;

    box-shadow:
        0 0 18px rgba(152, 219, 28, 0.2) !important;
}


/* ==========================================================================
   ТЕКСТ НА ПРЕДИМСТВАТА
   ========================================================================== */

.vp-grow .vp-grow-i > span:last-child {
    display: block !important;
    min-width: 0 !important;
}

.vp-grow .vp-grow-i b {
    display: block !important;

    margin: 1px 0 7px !important;

    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 750 !important;
    letter-spacing: -0.2px !important;
}

.vp-grow .vp-grow-i p {
    margin: 0 !important;

    color: #9ca3af !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
}


/* ==========================================================================
   ФИНА ЗЕЛЕНА ЛИНИЯ ПРИ HOVER
   ========================================================================== */

.vp-grow .vp-grow-i::after {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 18px !important;
    bottom: 18px !important;

    width: 2px !important;

    background: #7cbf00 !important;
    border-radius: 0 3px 3px 0 !important;

    opacity: 0 !important;
    transform: scaleY(0.4) !important;

    transition:
        opacity 0.3s ease,
        transform 0.3s ease !important;
}

.vp-grow .vp-grow-i:hover::after {
    opacity: 1 !important;
    transform: scaleY(1) !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .vp-grow {
        grid-template-columns: 1fr !important;
    }

    .vp-grow .vp-grow-box {
        min-height: auto !important;
    }

    .vp-grow .vp-grow-l {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.vp-grow) {
        padding: 65px 16px !important;
    }

    section.sec:has(.vp-grow) .vp-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.vp-grow) .vp-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec:has(.vp-grow) .vp-head p {
        font-size: 14.5px !important;
    }

    .vp-grow {
        gap: 16px !important;
    }

    .vp-grow .vp-grow-box {
        padding: 23px !important;
        border-radius: 15px !important;
    }

    .vp-grow .vp-grow-h {
        font-size: 18px !important;
        margin-bottom: 22px !important;
    }

    .vp-grow .vp-grow-l {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .vp-grow .vp-grow-i {
        padding: 19px !important;
        gap: 14px !important;
    }

    .vp-grow .vp-grow-ic {
        width: 41px !important;
        height: 41px !important;
        flex-basis: 41px !important;
    }

    .vp-grow .vp-grow-i b {
        font-size: 15px !important;
    }

    .vp-grow .vp-grow-i p {
        font-size: 13px !important;
    }

    .vp-grow .vp-grow-time {
        align-items: flex-start !important;
        font-size: 12.5px !important;
    }
}


/* ==========================================================================
   ACCESSIBILITY — REDUCE MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    .vp-grow *,
    .vp-grow *::before,
    .vp-grow *::after {
        transition: none !important;
        transform: none !important;
    }
}


/*vps/VPS ли ти трябва наистина?*/


/* ==========================================================================
   VPS — "VPS ли ти трябва наистина?"
   Светъл, модерен и интерактивен дизайн
   ========================================================================== */

section.sec .vp-where {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 42px !important;
    align-items: stretch !important;
}

/* --------------------------------------------------------------------------
   ОСНОВНИ КАРТИ
   -------------------------------------------------------------------------- */

section.sec .vp-where-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;

    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;

    padding: 30px !important;
    min-height: 320px !important;

    box-shadow:
        0 4px 12px rgba(15, 23, 42, 0.04),
        0 12px 30px rgba(15, 23, 42, 0.04) !important;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease,
        background 0.3s ease !important;

    overflow: hidden !important;
}

/* Декоративен светъл градиент */
section.sec .vp-where-i::before {
    content: "" !important;
    position: absolute !important;
    top: -80px !important;
    right: -80px !important;

    width: 180px !important;
    height: 180px !important;

    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.13) 0%,
        rgba(152, 219, 28, 0) 70%
    ) !important;

    pointer-events: none !important;
}

/* --------------------------------------------------------------------------
   HOVER
   -------------------------------------------------------------------------- */

section.sec .vp-where-i:hover {
    transform: translateY(-7px) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 10px 25px rgba(15, 23, 42, 0.07),
        0 20px 45px rgba(152, 219, 28, 0.10) !important;
}

/* --------------------------------------------------------------------------
   VPS — ОСНОВНА КАРТА
   -------------------------------------------------------------------------- */

section.sec .vp-where-i.is-this {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfff5 100%
        ) !important;

    border: 2px solid #7cbf00 !important;

    box-shadow:
        0 8px 25px rgba(152, 219, 28, 0.12),
        0 18px 45px rgba(15, 23, 42, 0.06) !important;

    transform: translateY(-4px) !important;
}

/* Лек glow при hover */
section.sec .vp-where-i.is-this:hover {
    transform: translateY(-10px) !important;

    box-shadow:
        0 12px 30px rgba(152, 219, 28, 0.16),
        0 25px 55px rgba(15, 23, 42, 0.08) !important;
}

/* Малък зелен акцент отгоре */
section.sec .vp-where-i.is-this::after {
    content: "ПРЕПОРЪЧАН" !important;

    position: absolute !important;
    top: 0 !important;
    right: 24px !important;

    background: #7cbf00 !important;
    color: #203000 !important;

    padding: 6px 12px !important;
    border-radius: 0 0 8px 8px !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.7px !important;
}

/* --------------------------------------------------------------------------
   ГОРНА ЧАСТ
   -------------------------------------------------------------------------- */

section.sec .vp-where-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 15px !important;

    margin-bottom: 22px !important;
    position: relative !important;
    z-index: 2 !important;
}

section.sec .vp-where-top b {
    font-size: 21px !important;
    line-height: 1.25 !important;
    font-weight: 750 !important;

    color: #111827 !important;

    letter-spacing: -0.4px !important;
}

/* VPS заглавие */
section.sec .vp-where-i.is-this .vp-where-top b {
    color: #305a08 !important;
}

/* --------------------------------------------------------------------------
   PILL
   -------------------------------------------------------------------------- */

section.sec .vp-where .pill {
    flex-shrink: 0 !important;

    display: inline-flex !important;
    align-items: center !important;

    padding: 6px 11px !important;
    border-radius: 999px !important;

    font-size: 11px !important;
    font-weight: 750 !important;

    white-space: nowrap !important;
}

/* Сивите */
section.sec .vp-where .pill.p-muted {
    background: #f3f4f6 !important;
    color: #4b5563 !important;
    border: 1px solid #e5e7eb !important;
}

/* VPS */
section.sec .vp-where .pill.p-rose {
    background: rgba(152, 219, 28, 0.14) !important;
    color: #4d750d !important;
    border: 1px solid rgba(152, 219, 28, 0.35) !important;
}

/* --------------------------------------------------------------------------
   ОПИСАНИЕ
   -------------------------------------------------------------------------- */

section.sec .vp-where-i > p {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 0 22px 0 !important;

    color: #4b5563 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
}

/* --------------------------------------------------------------------------
   "СТИГА ТИ / ВЗИМАШ ГО / ОТИВАШ"
   -------------------------------------------------------------------------- */

section.sec .vp-where-when {
    position: relative !important;
    z-index: 2 !important;

    margin-top: auto !important;
    margin-bottom: 22px !important;

    padding: 15px 16px !important;

    background: #f8fafc !important;
    border: 1px solid #edf0f3 !important;
    border-radius: 11px !important;

    color: #596273 !important;

    font-size: 13px !important;
    line-height: 1.55 !important;

    transition:
        background 0.25s ease,
        border-color 0.25s ease !important;
}

section.sec .vp-where-i:hover .vp-where-when {
    background: #f9fdf3 !important;
    border-color: rgba(152, 219, 28, 0.25) !important;
}

section.sec .vp-where-when b {
    color: #1f2937 !important;
    font-weight: 750 !important;
}

/* VPS вътрешен блок */
section.sec .vp-where-i.is-this .vp-where-when {
    background: rgba(152, 219, 28, 0.08) !important;
    border-color: rgba(152, 219, 28, 0.22) !important;
}

section.sec .vp-where-i.is-this .vp-where-when b {
    color: #305a08 !important;
}

/* --------------------------------------------------------------------------
   БУТОНИ
   -------------------------------------------------------------------------- */

section.sec .vp-where-go {
    position: relative !important;
    z-index: 3 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    align-self: flex-start !important;

    min-height: 42px !important;

    padding: 10px 17px !important;

    border-radius: 9px !important;

    background: #ffffff !important;
    color: #305a08 !important;

    border: 1px solid #dce4d2 !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    text-decoration: none !important;

    transition:
        all 0.25s ease !important;
}

/* Hover бутон */
section.sec .vp-where-go:hover {
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;
    color: #1e2b08 !important;

    transform: translateY(-2px) !important;

    box-shadow:
        0 7px 18px rgba(152, 219, 28, 0.25) !important;
}

/* --------------------------------------------------------------------------
   VPS КАРТА — лек визуален акцент
   -------------------------------------------------------------------------- */

section.sec .vp-where-i.is-this .vp-where-top {
    padding-right: 80px !important;
}

/* --------------------------------------------------------------------------
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   -------------------------------------------------------------------------- */

section.sec .vp-head {
    max-width: 760px !important;
    margin: 0 auto 0 auto !important;
    text-align: center !important;
}

section.sec .vp-head h2 {
    color: #111827 !important;

    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.12 !important;

    font-weight: 750 !important;
    letter-spacing: -1px !important;

    margin: 0 0 14px 0 !important;
}

section.sec .vp-head p {
    color: #667085 !important;

    font-size: 16px !important;
    line-height: 1.65 !important;

    margin: 0 !important;
}

/* --------------------------------------------------------------------------
   TABLET
   -------------------------------------------------------------------------- */

@media (max-width: 1000px) {

    section.sec .vp-where {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec .vp-where-i:last-child {
        grid-column: 1 / -1 !important;
        max-width: calc(50% - 12px) !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
}

/* --------------------------------------------------------------------------
   МОБИЛЕН
   -------------------------------------------------------------------------- */

@media (max-width: 680px) {

    section.sec .vp-where {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 30px !important;
    }

    section.sec .vp-where-i,
    section.sec .vp-where-i.is-this {
        min-height: auto !important;
        padding: 24px !important;
        transform: none !important;
    }

    section.sec .vp-where-i:hover,
    section.sec .vp-where-i.is-this:hover {
        transform: translateY(-4px) !important;
    }

    section.sec .vp-where-i:last-child {
        grid-column: auto !important;
        max-width: none !important;
    }

    section.sec .vp-where-top {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    section.sec .vp-where-i.is-this .vp-where-top {
        padding-right: 0 !important;
    }

    section.sec .vp-where-top b {
        font-size: 19px !important;
    }

    section.sec .vp-head h2 {
        font-size: 30px !important;
        letter-spacing: -0.7px !important;
    }

    section.sec .vp-head p {
        font-size: 15px !important;
    }
}


/*Каква система искашvps/*/

/* ==========================================================================
   VPS OS — ТЪМНА ГАМА / КОРИГИРАН ДИЗАЙН
   ========================================================================== */

section.sec .vp-os {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-top: 35px !important;
}

/* Карта */
section.sec .vp-os-i {
    position: relative !important;
    min-width: 0 !important;
    min-height: 150px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;

    padding: 24px 20px !important;

    background:
        linear-gradient(
            145deg,
            #171b11 0%,
            #10130d 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 16px !important;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;

    overflow: visible !important;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease !important;
}

/* Зелената маркировка — вече е отгоре */
section.sec .vp-os-mark {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 42px !important;
    height: 42px !important;

    margin: 0 0 18px 0 !important;

    flex-shrink: 0 !important;

    background: rgba(152, 219, 28, 0.12) !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 11px !important;

    color: #7cbf00 !important;

    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.5px !important;

    box-shadow:
        0 0 18px rgba(152, 219, 28, 0.06) !important;
}

/* Контейнерът с името */
section.sec .vp-os-i > span:last-child {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
}

/* Име на системата */
section.sec .vp-os-i b {
    display: block !important;

    margin: 0 0 7px 0 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;

    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;

    letter-spacing: -0.2px !important;
}

/* Версиите */
section.sec .vp-os-i > span:last-child > span {
    display: block !important;

    color: #9ca3af !important;

    font-size: 13px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;

    white-space: normal !important;
}

/* Hover */
section.sec .vp-os-i:hover {
    transform: translateY(-7px) !important;

    background:
        linear-gradient(
            145deg,
            #1c2412 0%,
            #12170d 100%
        ) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 18px 40px rgba(0, 0, 0, 0.45),
        0 0 25px rgba(152, 219, 28, 0.08) !important;
}

/* Hover на маркировката */
section.sec .vp-os-i:hover .vp-os-mark {
    background: #7cbf00 !important;
    color: #10130d !important;

    border-color: #7cbf00 !important;

    box-shadow:
        0 0 20px rgba(152, 219, 28, 0.25) !important;
}

/* Hover на името */
section.sec .vp-os-i:hover b {
    color: #7cbf00 !important;
}

/* Текстът под картите */
section.sec .vp-os-note {
    margin: 28px 0 0 0 !important;

    color: #9ca3af !important;

    font-size: 14px !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

section.sec .vp-os-note b {
    color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1100px) {
    section.sec .vp-os {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 700px) {
    section.sec .vp-os {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
    }

    section.sec .vp-os-i {
        min-height: 145px !important;
        padding: 20px 17px !important;
    }

    section.sec .vp-os-mark {
        width: 38px !important;
        height: 38px !important;
        margin-bottom: 14px !important;
    }

    section.sec .vp-os-i b {
        font-size: 15px !important;
    }
}

/* ==========================================================================
   МАЛЪК ТЕЛЕФОН
   ========================================================================== */

@media (max-width: 430px) {
    section.sec .vp-os {
        grid-template-columns: 1fr !important;
    }

    section.sec .vp-os-i {
        min-height: auto !important;
    }
}


/*menidzhar-vps/Какво се прави, когато нищо не се случва*/


/* ==========================================================================
   MV WORK / ДНЕВНИК — СВЕТЪЛ ИНТЕРАКТИВЕН ДИЗАЙН
   ========================================================================== */

section.sec .mv-head {
    max-width: 760px !important;
    margin: 0 auto 45px !important;
    text-align: center !important;
}

section.sec .mv-head h2 {
    margin: 0 0 14px !important;
    color: #17200f !important;
    font-size: clamp(28px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec .mv-head p {
    margin: 0 !important;
    color: #68705f !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}


/* ==========================================================================
   СТАТИСТИКИ
   ========================================================================== */

section.sec .mv-work {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-bottom: 32px !important;
}

section.sec .mv-work-i {
    position: relative !important;
    min-width: 0 !important;

    padding: 27px 24px !important;

    background: #ffffff !important;
    border: 1px solid #e4e9df !important;
    border-radius: 18px !important;

    box-shadow:
        0 8px 25px rgba(30, 45, 20, 0.055),
        0 1px 2px rgba(30, 45, 20, 0.04) !important;

    overflow: hidden !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease !important;
}

/* декоративна зелена линия */
section.sec .mv-work-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #c5f36a
    ) !important;
}

/* леко зелено сияние */
section.sec .mv-work-i::after {
    content: "" !important;
    position: absolute !important;
    width: 90px !important;
    height: 90px !important;
    right: -45px !important;
    bottom: -45px !important;

    background: rgba(152, 219, 28, 0.08) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

section.sec .mv-work-i:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 18px 40px rgba(48, 90, 8, 0.10),
        0 0 0 4px rgba(152, 219, 28, 0.055) !important;
}

section.sec .mv-work-i b {
    display: block !important;

    margin-bottom: 7px !important;

    color: #305a08 !important;
    font-size: 32px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec .mv-work-i span {
    display: block !important;

    color: #70786a !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
}


/* ==========================================================================
   ДНЕВНИК
   ========================================================================== */

section.sec .mv-log {
    background: #ffffff !important;

    border: 1px solid #e2e8dc !important;
    border-radius: 20px !important;

    box-shadow:
        0 12px 35px rgba(30, 45, 20, 0.065) !important;

    overflow: hidden !important;
}


/* Заглавна лента */

section.sec .mv-log-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;

    padding: 21px 25px !important;

    background: #f7f9f4 !important;
    border-bottom: 1px solid #e5eadf !important;
}

section.sec .mv-log-h b {
    color: #1c2515 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}

section.sec .mv-log-h span {
    color: #858c7e !important;
    font-size: 12px !important;
}


/* ==========================================================================
   РЕДОВЕ
   ========================================================================== */

section.sec .mv-log-l {
    padding: 5px 0 !important;
}

section.sec .mv-log-r {
    display: grid !important;
    grid-template-columns: 65px 105px minmax(0, 1fr) 105px !important;
    align-items: center !important;
    gap: 18px !important;

    min-width: 0 !important;

    padding: 17px 25px !important;

    border-bottom: 1px solid #edf0ea !important;

    transition:
        background .2s ease,
        padding-left .2s ease !important;
}

section.sec .mv-log-r:last-child {
    border-bottom: 0 !important;
}

section.sec .mv-log-r:hover {
    background: #fbfdf9 !important;
    padding-left: 29px !important;
}


/* Дата */

section.sec .mv-log-date {
    color: #7b8374 !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
}


/* Вид операция */

section.sec .mv-log-kind {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: fit-content !important;

    padding: 5px 9px !important;

    border-radius: 7px !important;

    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .35px !important;
}


/* Цветове на типовете */

section.sec .mv-log-kind.sec {
    color: #315f0b !important;
    background: #eaf7d8 !important;
    border: 1px solid #d8efb9 !important;
}

section.sec .mv-log-kind.up {
    color: #49620e !important;
    background: #f2f8df !important;
    border: 1px solid #e4efc5 !important;
}

section.sec .mv-log-kind.fix {
    color: #875f12 !important;
    background: #fff5d9 !important;
    border: 1px solid #f4e6b8 !important;
}

section.sec .mv-log-kind.bak {
    color: #256b68 !important;
    background: #e3f5f2 !important;
    border: 1px solid #ccebe6 !important;
}


/* Описание */

section.sec .mv-log-r > span:nth-child(3) {
    min-width: 0 !important;

    color: #424a3d !important;

    font-size: 13px !important;
    line-height: 1.5 !important;
}


/* "Не си усетил" */

section.sec .mv-log-you {
    justify-self: end !important;

    color: #5f9b22 !important;

    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;

    opacity: .9 !important;
}


/* ==========================================================================
   ДОЛЕН РЕД
   ========================================================================== */

section.sec .mv-log-more {
    padding: 18px 25px !important;

    color: #78806f !important;

    background: #fafbf9 !important;
    border-top: 1px solid #edf0ea !important;

    font-size: 12px !important;
    line-height: 1.5 !important;
    text-align: center !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1000px) {

    section.sec .mv-work {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec .mv-log-r {
        grid-template-columns: 60px 100px minmax(0, 1fr) !important;
    }

    section.sec .mv-log-you {
        display: none !important;
    }
}


/* ==========================================================================
   МОБИЛЕН
   ========================================================================== */

@media (max-width: 650px) {

    section.sec .mv-head {
        margin-bottom: 30px !important;
    }

    section.sec .mv-head h2 {
        font-size: 28px !important;
        letter-spacing: -.6px !important;
    }

    section.sec .mv-head p {
        font-size: 14px !important;
    }

    section.sec .mv-work {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
        margin-bottom: 22px !important;
    }

    section.sec .mv-work-i {
        padding: 22px 18px !important;
        border-radius: 15px !important;
    }

    section.sec .mv-work-i b {
        font-size: 27px !important;
    }

    section.sec .mv-work-i span {
        font-size: 11px !important;
    }

    section.sec .mv-log {
        border-radius: 16px !important;
    }

    section.sec .mv-log-h {
        padding: 18px !important;
    }

    section.sec .mv-log-h span {
        display: none !important;
    }

    section.sec .mv-log-r {
        grid-template-columns: 48px minmax(0, 1fr) !important;
        gap: 8px 12px !important;

        padding: 16px 18px !important;
    }

    section.sec .mv-log-r:hover {
        padding-left: 18px !important;
    }

    section.sec .mv-log-date {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    section.sec .mv-log-kind {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }

    section.sec .mv-log-r > span:nth-child(3) {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;

        font-size: 12px !important;
    }

    section.sec .mv-log-more {
        padding: 16px 18px !important;
    }
}


/* ==========================================================================
   МНОГО МАЛЪК ЕКРАН
   ========================================================================== */

@media (max-width: 400px) {

    section.sec .mv-work {
        grid-template-columns: 1fr !important;
    }

    section.sec .mv-work-i {
        min-height: 105px !important;
    }
}

/*Пакетите*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СЕКЦИЯ "ПАКЕТИТЕ"
   ========================================================================== */

/* Основна секция */
section#packs.sec-wash {
    background: #0b0f08 !important;
    padding: 90px 20px !important;
    color: #f5f7f2 !important;
    overflow: hidden !important;
}

/* Лек светлинен ефект около секцията */
section#packs.sec-wash .wrap-w {
    position: relative !important;
    z-index: 1 !important;
}

section#packs.sec-wash::before {
    content: "" !important;
    position: absolute !important;
    width: 600px !important;
    height: 600px !important;
    left: 50% !important;
    top: 20% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.07) 0%,
        rgba(152, 219, 28, 0.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section#packs .mv-head {
    text-align: center !important;
    max-width: 760px !important;
    margin: 0 auto 55px !important;
}

section#packs .mv-head h2 {
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin: 0 0 15px !important;
}

section#packs .mv-head p {
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* Малък зелен акцент под заглавието */
section#packs .mv-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    margin: 24px auto 0 !important;
    box-shadow: 0 0 18px rgba(152, 219, 28, 0.45) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section#packs .mv-packs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   ОСНОВНИ КАРТИ
   ========================================================================== */

section#packs .mv-pack {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background: linear-gradient(
        145deg,
        #151a11 0%,
        #10140d 100%
    ) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 18px !important;
    padding: 30px !important;
    overflow: hidden !important;
    box-shadow:
        0 18px 45px rgba(0,0,0,0.28),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;
    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease !important;
}

/* Светлинна линия отгоре */
section#packs .mv-pack::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,0.25),
        transparent
    ) !important;
    opacity: 0 !important;
    transition: opacity .3s ease !important;
}

/* Hover */
section#packs .mv-pack:hover {
    transform: translateY(-8px) !important;
    border-color: rgba(152,219,28,0.35) !important;
    background: linear-gradient(
        145deg,
        #192011 0%,
        #11170d 100%
    ) !important;
    box-shadow:
        0 25px 55px rgba(0,0,0,0.4),
        0 0 30px rgba(152,219,28,0.06) !important;
}

section#packs .mv-pack:hover::before {
    opacity: 1 !important;
}

/* ==========================================================================
   ПРЕПОРЪЧИТЕЛЕН ПАКЕТ
   ========================================================================== */

section#packs .mv-pack.is-best {
    border-color: rgba(152,219,28,0.55) !important;
    background:
        linear-gradient(
            145deg,
            #18200f 0%,
            #10150c 100%
        ) !important;
    box-shadow:
        0 25px 60px rgba(0,0,0,0.4),
        0 0 40px rgba(152,219,28,0.08),
        inset 0 1px 0 rgba(152,219,28,0.08) !important;
    transform: translateY(-8px) !important;
}

section#packs .mv-pack.is-best:hover {
    transform: translateY(-12px) !important;
    border-color: #7cbf00 !important;
    box-shadow:
        0 30px 65px rgba(0,0,0,0.45),
        0 0 45px rgba(152,219,28,0.14) !important;
}

/* Зелен ореол около препоръчителната карта */
section#packs .mv-pack.is-best::before {
    opacity: 1 !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;
}

/* ==========================================================================
   BADGE "НАЙ-ЧЕСТО ВЗИМАН"
   ========================================================================== */

section#packs .mv-pack-tag {
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;
    margin-bottom: 16px !important;
    padding: 6px 11px !important;
    border-radius: 999px !important;
    background: rgba(152,219,28,0.12) !important;
    border: 1px solid rgba(152,219,28,0.28) !important;
    color: #7cbf00 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .7px !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА ПАКЕТА
   ========================================================================== */

section#packs .mv-pack-n {
    color: #ffffff !important;
    font-size: 25px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    margin: 0 0 8px !important;
    letter-spacing: -.5px !important;
}

section#packs .mv-pack-for {
    color: #ffffff !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    min-height: 45px !important;
    margin: 0 !important;
}

/* ==========================================================================
   SLA / ВРЕМЕ ЗА ОТГОВОР
   ========================================================================== */

section#packs .mv-pack-sla {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 25px 0 !important;
    padding: 13px 14px !important;
    background: rgba(255,255,255,0.035) !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    border-radius: 10px !important;
}

section#packs .mv-pack-sla b {
    color: #7cbf00 !important;
    font-size: 15px !important;
    white-space: nowrap !important;
}

section#packs .mv-pack-sla span {
    color: #8f9888 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

/* ==========================================================================
   ЦЕНА
   ========================================================================== */

section#packs .mv-pack-p {
    padding: 20px 0 !important;
    border-top: 1px solid rgba(255,255,255,0.07) !important;
    border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}

section#packs .mv-pack-p b {
    color: #ffffff !important;
    font-size: 34px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section#packs .mv-pack-p > span {
    color: #8f9888 !important;
    font-size: 13px !important;
    margin-left: 5px !important;
}

section#packs .mv-pack-p em {
    display: block !important;
    color: #687063 !important;
    font-size: 11px !important;
    font-style: normal !important;
    margin-top: 7px !important;
}

/* ==========================================================================
   СПИСЪК С ФУНКЦИИ
   ========================================================================== */

section#packs .mv-pack-f {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    padding: 24px 0 !important;
    flex-grow: 1 !important;
}

section#packs .mv-pack-f > div {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    color: #c7cec1 !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
}

section#packs .mv-pack-f b {
    color: #f3f6ef !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   CHECK ICON
   ========================================================================== */

section#packs .mv-fi {
    flex: 0 0 20px !important;
    width: 20px !important;
    height: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: rgba(152,219,28,0.12) !important;
    color: #7cbf00 !important;
    margin-top: 1px !important;
}

section#packs .mv-fi svg {
    width: 12px !important;
    height: 12px !important;
    stroke-width: 2.5 !important;
}

/* X иконка */
section#packs .mv-fi.no {
    background: rgba(255,255,255,0.05) !important;
    color: #626a5e !important;
}

/* ==========================================================================
   БУТОН
   ========================================================================== */

section#packs .mv-pack-go {
    margin-top: auto !important;
    padding-top: 20px !important;
}

section#packs .mv-pack-go .btn {
    width: 100% !important;
    min-height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    transition: all .3s ease !important;
}

/* Основен зелен бутон */
section#packs .mv-pack.is-best .mv-pack-go .btn {
    background: #7cbf00 !important;
    color: #11140c !important;
    border: 1px solid #7cbf00 !important;
    box-shadow: 0 8px 22px rgba(152,219,28,0.16) !important;
}

section#packs .mv-pack.is-best .mv-pack-go .btn:hover {
    background: #b1ed45 !important;
    border-color: #b1ed45 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 28px rgba(152,219,28,0.25) !important;
}

/* Ghost бутон */
section#packs .mv-pack:not(.is-best) .mv-pack-go .btn {
    background: rgba(255,255,255,0.025) !important;
    color: #dbe2d5 !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
}

section#packs .mv-pack:not(.is-best) .mv-pack-go .btn:hover {
    background: rgba(152,219,28,0.08) !important;
    border-color: rgba(152,219,28,0.45) !important;
    color: #7cbf00 !important;
    transform: translateY(-2px) !important;
}

/* ==========================================================================
   БЕЛЕЖКА ПОД БУТОНА
   ========================================================================== */

section#packs .mv-pack-note {
    display: block !important;
    text-align: center !important;
    margin-top: 10px !important;
    color: #697264 !important;
    font-size: 11px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1024px) {
    section#packs .mv-packs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section#packs .mv-pack.is-best {
        transform: none !important;
    }

    section#packs .mv-pack.is-best:hover {
        transform: translateY(-8px) !important;
    }

    section#packs .mv-pack:last-child {
        grid-column: 1 / -1 !important;
        max-width: calc(50% - 11px) !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 680px) {
    section#packs.sec-wash {
        padding: 65px 16px !important;
    }

    section#packs .mv-head {
        margin-bottom: 38px !important;
    }

    section#packs .mv-head h2 {
        font-size: 30px !important;
    }

    section#packs .mv-head p {
        font-size: 14px !important;
    }

    section#packs .mv-packs {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    section#packs .mv-pack {
        padding: 25px 22px !important;
        border-radius: 15px !important;
    }

    section#packs .mv-pack.is-best {
        transform: none !important;
    }

    section#packs .mv-pack.is-best:hover,
    section#packs .mv-pack:hover {
        transform: translateY(-4px) !important;
    }

    section#packs .mv-pack:last-child {
        grid-column: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    section#packs .mv-pack-p b {
        font-size: 30px !important;
    }
}
/*Кой какво прави*/


/* ==========================================================================
   СВЕТЪЛ ПРЕМИУМ ДИЗАЙН — "КОЙ КАКВО ПРАВИ"
   Само за .mv-split секцията
   ========================================================================== */

.mv-split {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 32px !important;
    align-items: stretch !important;
}

/* Основни карти */
.mv-split .mv-split-i {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    padding: 30px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 30px rgba(15, 23, 42, 0.06) !important;
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease !important;
}

/* Лек цветен фон в горната част */
.mv-split .mv-split-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #b8ed54
    ) !important;
}

/* Карта "Ние" */
.mv-split .mv-split-i.us {
    border-color: rgba(152, 219, 28, 0.28) !important;
    background:
        linear-gradient(
            180deg,
            rgba(152, 219, 28, 0.055) 0%,
            #ffffff 32%
        ) !important;
}

/* Карта "Ти" */
.mv-split .mv-split-i.you {
    background:
        linear-gradient(
            180deg,
            rgba(15, 23, 42, 0.025) 0%,
            #ffffff 32%
        ) !important;
}

/* Hover */
.mv-split .mv-split-i:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.55) !important;
    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.10),
        0 5px 18px rgba(152, 219, 28, 0.08) !important;
}

/* Заглавна част */
.mv-split .mv-split-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 24px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* Иконка */
.mv-split .mv-split-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152, 219, 28, 0.13) !important;
    color: #6da800 !important;
    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

.mv-split .mv-split-ic svg {
    width: 22px !important;
    height: 22px !important;
}

.mv-split .mv-split-i:hover .mv-split-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}

/* Заглавие */
.mv-split .mv-split-h b {
    font-size: 22px !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    color: #111827 !important;
    letter-spacing: -0.4px !important;
}

/* Списък */
.mv-split .mv-split-l {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
}

/* Всеки ред */
.mv-split .mv-split-l > li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
}

/* Зелената точка */
.mv-split .mv-split-l > li > i {
    position: relative !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin-top: 1px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.13) !important;
    border: 1px solid rgba(152, 219, 28, 0.30) !important;
}

/* Check в точката */
.mv-split .mv-split-l > li > i::after {
    content: "" !important;
    position: absolute !important;
    width: 7px !important;
    height: 4px !important;
    left: 5px !important;
    top: 5px !important;
    border-left: 2px solid #72a900 !important;
    border-bottom: 2px solid #72a900 !important;
    transform: rotate(-45deg) !important;
}

/* Hover върху ред */
.mv-split .mv-split-l > li {
    transition: transform 0.25s ease, color 0.25s ease !important;
}

.mv-split .mv-split-l > li:hover {
    transform: translateX(4px) !important;
    color: #1f2937 !important;
}

/* ==========================================================
   БЛОК "КАКВО НЕ ВЛИЗА"
   ========================================================== */

.mv-split .mv-split-not {
    margin-top: 28px !important;
    padding: 20px !important;
    border-radius: 14px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    position: relative !important;
}

/* Малък цветен акцент */
.mv-split .mv-split-not::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 14px !important;
    bottom: 14px !important;
    width: 3px !important;
    border-radius: 4px !important;
    background: #d1d5db !important;
}

/* Заглавие */
.mv-split .mv-split-not > b {
    display: block !important;
    margin-bottom: 13px !important;
    padding-left: 4px !important;
    color: #374151 !important;
    font-size: 14px !important;
    font-weight: 750 !important;
}

/* Подсписък */
.mv-split .mv-split-not ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    gap: 8px !important;
}

/* Елементи в "Какво не влиза" */
.mv-split .mv-split-not ul li {
    position: relative !important;
    padding-left: 20px !important;
    color: #6b7280 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* X */
.mv-split .mv-split-not ul li::before {
    content: "×" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    color: #9ca3af !important;
    font-size: 17px !important;
    line-height: 18px !important;
    font-weight: 600 !important;
}

/* ==========================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================== */

.mv-head {
    max-width: 850px !important;
}

.mv-head h2 {
    color: #111827 !important;
    letter-spacing: -0.7px !important;
}

.mv-head p {
    color: #6b7280 !important;
    line-height: 1.7 !important;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 900px) {
    .mv-split {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .mv-split .mv-split-i {
        padding: 26px !important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 640px) {
    .mv-split {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 24px !important;
    }

    .mv-split .mv-split-i {
        padding: 22px 18px !important;
        border-radius: 15px !important;
    }

    .mv-split .mv-split-h {
        margin-bottom: 20px !important;
        padding-bottom: 16px !important;
    }

    .mv-split .mv-split-ic {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
    }

    .mv-split .mv-split-h b {
        font-size: 19px !important;
    }

    .mv-split .mv-split-l {
        gap: 13px !important;
    }

    .mv-split .mv-split-l > li {
        font-size: 13.5px !important;
        line-height: 1.55 !important;
    }

    .mv-split .mv-split-not {
        margin-top: 22px !important;
        padding: 17px !important;
    }
}


/*А ако стане това?*/



/* ==========================================================================
   СВЕТЪЛ ИНТЕРАКТИВЕН ДИЗАЙН — "А АКО СТАНЕ ТОВА?"
   Само за .mv-cases
   ========================================================================== */

.mv-cases {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 34px !important;
}

/* ==========================================================
   CASE CARD
   ========================================================== */

.mv-cases .mv-case {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 20px !important;
    padding: 28px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.055) !important;
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease !important;
}

/* Горна зелена линия */
.mv-cases .mv-case::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 4px !important;
    background: linear-gradient(
        90deg,
        #7cbf00 0%,
        #b9ed59 50%,
        #e5f8c8 100%
    ) !important;
}

/* Светъл glow */
.mv-cases .mv-case::after {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    right: -100px !important;
    top: -100px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.07) !important;
    pointer-events: none !important;
    transition: transform 0.45s ease !important;
}

.mv-cases .mv-case:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.09),
        0 5px 20px rgba(152, 219, 28, 0.08) !important;
}

.mv-cases .mv-case:hover::after {
    transform: scale(1.5) !important;
}

/* ==========================================================
   ВЪПРОС / ЗАГЛАВИЕ
   ========================================================== */

.mv-cases .mv-case-q {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    position: relative !important;
    z-index: 2 !important;
    margin-bottom: 25px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #edf0f2 !important;
}

.mv-cases .mv-case-q b {
    color: #111827 !important;
    font-size: 18px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
    letter-spacing: -0.25px !important;
}

/* Иконка */
.mv-cases .mv-case-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    background: rgba(152, 219, 28, 0.12) !important;
    border: 1px solid rgba(152, 219, 28, 0.24) !important;
    color: #6d9f0b !important;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

.mv-cases .mv-case-ic svg {
    width: 22px !important;
    height: 22px !important;
}

.mv-cases .mv-case:hover .mv-case-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.07) rotate(-3deg) !important;
}

/* ==========================================================
   TIMELINE
   ========================================================== */

.mv-cases .mv-case-a {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    margin: 0 !important;
    padding-left: 4px !important;
}

/* Вертикална линия */
.mv-cases .mv-case-a::before {
    content: "" !important;
    position: absolute !important;
    left: 43px !important;
    top: 14px !important;
    bottom: 14px !important;
    width: 1px !important;
    background: linear-gradient(
        to bottom,
        rgba(152, 219, 28, 0.45),
        #e5e7eb
    ) !important;
}

/* Стъпка */
.mv-cases .mv-case-s {
    display: grid !important;
    grid-template-columns: 78px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 15px !important;
    position: relative !important;
    min-height: 48px !important;
    padding: 6px 0 !important;
    color: #596273 !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
}

/* Времеви маркер */
.mv-cases .mv-case-t {
    position: relative !important;
    z-index: 3 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 28px !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    background: #f3f8e9 !important;
    border: 1px solid rgba(152, 219, 28, 0.28) !important;
    color: #5f8509 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    transition:
        background 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease !important;
}

/* Точка върху timeline */
.mv-cases .mv-case-s::before {
    content: "" !important;
    position: absolute !important;
    left: 35px !important;
    top: 50% !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 0 0 1px rgba(152, 219, 28, 0.35) !important;
    transform: translateY(-50%) !important;
    z-index: 4 !important;
}

.mv-cases .mv-case-s:hover .mv-case-t {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: translateX(3px) !important;
}

/* ==========================================================
   ДОЛЕН ИНФО БЛОК
   ========================================================== */

.mv-cases .mv-case-who {
    position: relative !important;
    z-index: 2 !important;
    margin-top: 22px !important;
    padding: 15px 17px !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    border: 1px solid #e7eaee !important;
    color: #687181 !important;
    font-size: 12.5px !important;
    line-height: 1.55 !important;
    transition:
        background 0.3s ease,
        border-color 0.3s ease !important;
}

.mv-cases .mv-case:hover .mv-case-who {
    background: #f7fbeF !important;
    border-color: rgba(152, 219, 28, 0.25) !important;
}

.mv-cases .mv-case-who b {
    color: #374151 !important;
    font-weight: 750 !important;
}

/* ==========================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================== */

.mv-head {
    max-width: 850px !important;
}

.mv-head h2 {
    color: #111827 !important;
    letter-spacing: -0.7px !important;
}

.mv-head p {
    color: #6b7280 !important;
    line-height: 1.7 !important;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 900px) {
    .mv-cases {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .mv-cases .mv-case {
        padding: 26px !important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 640px) {
    .mv-cases {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 25px !important;
    }

    .mv-cases .mv-case {
        padding: 21px 17px !important;
        border-radius: 16px !important;
    }

    .mv-cases .mv-case-q {
        gap: 11px !important;
        margin-bottom: 20px !important;
        padding-bottom: 16px !important;
    }

    .mv-cases .mv-case-q b {
        font-size: 16px !important;
    }

    .mv-cases .mv-case-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    .mv-cases .mv-case-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    .mv-cases .mv-case-s {
        grid-template-columns: 68px minmax(0, 1fr) !important;
        gap: 13px !important;
        font-size: 13px !important;
    }

    .mv-cases .mv-case-a::before {
        left: 38px !important;
    }

    .mv-cases .mv-case-s::before {
        left: 30px !important;
    }

    .mv-cases .mv-case-t {
        font-size: 10px !important;
        padding: 4px 6px !important;
    }

    .mv-cases .mv-case-who {
        margin-top: 18px !important;
        padding: 13px 14px !important;
        font-size: 12px !important;
    }
}


/*Пакетите едно до друго*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СРАВНЕНИЕ НА ПАКЕТИТЕ
   Само за .mv-tbl
   ========================================================================== */

.mv-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    border-radius: 18px !important;
    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
}

/* Лека зелена светлина отгоре */
.mv-tbl::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent
    ) !important;
}

/* Таблица */
.mv-tbl table {
    width: 100% !important;
    min-width: 720px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    color: #d5d9cf !important;
    background: transparent !important;
}

/* ==========================================================
   HEADER
   ========================================================== */

.mv-tbl thead th {
    position: relative !important;
    padding: 20px 18px !important;
    background: #13180d !important;
    color: #f5f7f2 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.mv-tbl thead th:first-child {
    width: 32% !important;
    border-top-left-radius: 15px !important;
}

.mv-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* Колона Пълен */
.mv-tbl thead th.best {
    color: #a9e83a !important;
    background:
        linear-gradient(
            180deg,
            rgba(152, 219, 28, 0.16),
            rgba(152, 219, 28, 0.055)
        ) !important;
    box-shadow:
        inset 1px 0 rgba(152, 219, 28, 0.18),
        inset -1px 0 rgba(152, 219, 28, 0.18) !important;
}

/* Малък акцент под Пълен */
.mv-tbl thead th.best::after {
    content: "" !important;
    position: absolute !important;
    left: 18px !important;
    right: 18px !important;
    bottom: -1px !important;
    height: 2px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 12px rgba(152, 219, 28, 0.55) !important;
}

/* ==========================================================
   BODY
   ========================================================== */

.mv-tbl tbody td {
    padding: 17px 18px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;
    background: #0d1109 !important;
    transition:
        background 0.25s ease,
        color 0.25s ease !important;
}

/* Име на характеристиката */
.mv-tbl tbody td:first-child {
    color: #f0f2ec !important;
    font-size: 13.5px !important;
}

/* Удебелен текст */
.mv-tbl tbody td:first-child b {
    font-weight: 650 !important;
}

/* Mono стойности */
.mv-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;
    color: #aeb5a5 !important;
    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================
   BEST КОЛОНА
   ========================================================== */

.mv-tbl tbody td.best {
    position: relative !important;
    color: #c9f277 !important;
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.075),
            rgba(152, 219, 28, 0.045)
        ) !important;
    box-shadow:
        inset 1px 0 rgba(152, 219, 28, 0.13),
        inset -1px 0 rgba(152, 219, 28, 0.13) !important;
}

/* ==========================================================
   YES / NO
   ========================================================== */

/* Да */
.mv-tbl tbody td.mono:not(:first-child) {
    color: #aeb5a5 !important;
}

/* Всички "да" да изпъкват леко */
.mv-tbl tbody td.mono {
    transition:
        color 0.25s ease,
        background 0.25s ease !important;
}

/* Празни стойности */
.mv-tbl tbody td.mono:has(+ *) {
    /* Запазва структурата без агресивни промени */
}

/* ==========================================================
   HOVER НА РЕД
   ========================================================== */

.mv-tbl tbody tr {
    transition: transform 0.2s ease !important;
}

.mv-tbl tbody tr:hover td {
    background: #151b10 !important;
    color: #f4f7ed !important;
}

.mv-tbl tbody tr:hover td.best {
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.13),
            rgba(152, 219, 28, 0.075)
        ) !important;
    color: #000000 !important;
}

/* Последен ред */
.mv-tbl tbody tr:last-child td {
    border-bottom: 0 !important;
}

/* Цена */
.mv-tbl tbody tr:last-child td {
    background: #11160c !important;
}

.mv-tbl tbody tr:last-child td b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

.mv-tbl tbody tr:last-child td.best b {
    color: #6aa300  !important;
    text-shadow: 0 0 15px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================
   ПЪРВА КОЛОНА — ЛЕКО ОТДЕЛЕНА
   ========================================================== */

.mv-tbl tbody td:first-child {
    background: #10140d !important;
    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

/* ==========================================================
   SCROLLBAR
   ========================================================== */

.mv-tbl {
    scrollbar-width: thin !important;
    scrollbar-color: #4f671f #11150d !important;
}

.mv-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.mv-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.mv-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.mv-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================== */

.mv-head h2 {
    color: #f5f7f1 !important;
}

.mv-head p {
    color: #8e9689 !important;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 900px) {
    .mv-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .mv-tbl table {
        min-width: 680px !important;
    }

    .mv-tbl thead th,
    .mv-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .mv-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .mv-tbl table {
        min-width: 650px !important;
    }

    .mv-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .mv-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .mv-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .mv-tbl .mono {
        font-size: 11.5px !important;
    }
}


/*naeti-sarvari/Кога си струва, и кога не*/


/* ==========================================================================
   СВЕТЪЛ ПРЕМИУМ ДИЗАЙН — "КОГА СИ СТРУВА, И КОГА НЕ"
   Само за .ded-vs секцията
   ========================================================================== */

.ded-vs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    margin-top: 32px !important;
    align-items: stretch !important;
}

/* ==========================================================
   ОСНОВНИ КАРТИ
   ========================================================== */

.ded-vs .ded-vs-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    padding: 30px !important;
    overflow: hidden !important;

    box-shadow: 0 8px 30px rgba(15, 23, 42, 0.06) !important;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease !important;
}

/* Зелен акцент отгоре */
.ded-vs .ded-vs-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #b8ed54
    ) !important;
}

/* ==========================================================
   КАРТА "САМОСТОЯТЕЛЕН СЪРВЪР"
   ========================================================== */

.ded-vs .ded-vs-i.is-this {
    border-color: rgba(152, 219, 28, 0.28) !important;

    background:
        linear-gradient(
            180deg,
            rgba(152, 219, 28, 0.055) 0%,
            #ffffff 32%
        ) !important;
}

/* ==========================================================
   КАРТА "VPS"
   ========================================================== */

.ded-vs .ded-vs-i:not(.is-this) {
    background:
        linear-gradient(
            180deg,
            rgba(15, 23, 42, 0.025) 0%,
            #ffffff 32%
        ) !important;
}

/* ==========================================================
   HOVER
   ========================================================== */

.ded-vs .ded-vs-i:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.10),
        0 5px 18px rgba(152, 219, 28, 0.08) !important;
}

/* ==========================================================
   ЗАГЛАВНА ЧАСТ
   ========================================================== */

.ded-vs .ded-vs-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 13px !important;

    margin-bottom: 24px !important;
    padding-bottom: 20px !important;

    border-bottom: 1px solid #edf0f2 !important;
}

/* Заглавие */
.ded-vs .ded-vs-h > b {
    font-size: 22px !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    color: #111827 !important;
    letter-spacing: -0.4px !important;
}

/* ==========================================================
   PILL
   ========================================================== */

.ded-vs .pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 30px !important;
    padding: 6px 11px !important;

    border-radius: 999px !important;

    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    letter-spacing: 0.2px !important;

    white-space: nowrap !important;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease !important;
}

/* Pill — тази страница */
.ded-vs .pill.p-rose {
    color: #5f8f00 !important;
    background: rgba(152, 219, 28, 0.13) !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
}

/* Pill — VPS */
.ded-vs .pill.p-muted {
    color: #6b7280 !important;
    background: #f3f4f6 !important;
    border: 1px solid #e5e7eb !important;
}

/* ==========================================================
   СПИСЪК
   ========================================================== */

.ded-vs .ded-vs-l {
    list-style: none !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
}

/* Всеки ред */
.ded-vs .ded-vs-l > li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;

    transition:
        transform 0.25s ease,
        color 0.25s ease !important;
}

/* Hover върху ред */
.ded-vs .ded-vs-l > li:hover {
    transform: translateX(4px) !important;
    color: #1f2937 !important;
}

/* ==========================================================
   BOLD В ТЕКСТА
   ========================================================== */

.ded-vs .ded-vs-l > li > span:last-child b {
    color: #1f2937 !important;
    font-weight: 700 !important;
}

/* ==========================================================
   CHECK / X ИКОНКИ
   ========================================================== */

.ded-vs .ded-d {
    position: relative !important;

    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;

    margin-top: 2px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 50% !important;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease !important;
}

/* SVG */
.ded-vs .ded-d svg {
    width: 12px !important;
    height: 12px !important;
}

/* ==========================================================
   YES
   ========================================================== */

.ded-vs .ded-d.yes {
    color: #72a900 !important;

    background: rgba(152, 219, 28, 0.13) !important;
    border: 1px solid rgba(152, 219, 28, 0.30) !important;
}

/* ==========================================================
   NO
   ========================================================== */

.ded-vs .ded-d.no {
    color: #9ca3af !important;

    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
}

/* Иконката при hover */
.ded-vs .ded-vs-l > li:hover .ded-d {
    transform: scale(1.06) !important;
}

/* Check при hover */
.ded-vs .ded-vs-l > li:hover .ded-d.yes {
    background: #7cbf00 !important;
    color: #172000 !important;
}

/* X при hover */
.ded-vs .ded-vs-l > li:hover .ded-d.no {
    background: #f1f5f9 !important;
    color: #6b7280 !important;
}

/* ==========================================================
   VPS BUTTON
   ========================================================== */

.ded-vs .ded-vs-go {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    align-self: flex-start !important;

    margin-top: auto !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;

    border-radius: 10px !important;

    color: #374151 !important;
    background: #ffffff !important;
    border: 1px solid #dfe3e7 !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        color 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Button hover */
.ded-vs .ded-vs-go:hover {
    transform: translateY(-2px) !important;

    color: #172000 !important;
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;

    box-shadow:
        0 8px 20px rgba(152, 219, 28, 0.18) !important;
}

/* ==========================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================== */

.ded-head {
    max-width: 850px !important;
}

.ded-head h2 {
    color: #111827 !important;
    letter-spacing: -0.7px !important;
}

.ded-head p {
    color: #6b7280 !important;
    line-height: 1.7 !important;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 900px) {

    .ded-vs {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .ded-vs .ded-vs-i {
        padding: 26px !important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 640px) {

    .ded-vs {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 24px !important;
    }

    .ded-vs .ded-vs-i {
        padding: 22px 18px !important;
        border-radius: 15px !important;
    }

    .ded-vs .ded-vs-h {
        margin-bottom: 20px !important;
        padding-bottom: 16px !important;
        align-items: flex-start !important;
    }

    .ded-vs .ded-vs-h > b {
        font-size: 19px !important;
    }

    .ded-vs .pill {
        min-height: 27px !important;
        padding: 5px 9px !important;
        font-size: 10px !important;
    }

    .ded-vs .ded-vs-l {
        gap: 13px !important;
    }

    .ded-vs .ded-vs-l > li {
        font-size: 13.5px !important;
        line-height: 1.55 !important;
    }

    .ded-vs .ded-d {
        width: 20px !important;
        height: 20px !important;
        min-width: 20px !important;
    }

    .ded-vs .ded-vs-go {
        margin-top: 20px !important;
        width: 100% !important;
    }
}

/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .ded-vs .ded-vs-i,
    .ded-vs .ded-vs-l > li,
    .ded-vs .ded-d,
    .ded-vs .ded-vs-go,
    .ded-vs .pill {
        transition: none !important;
    }

    .ded-vs .ded-vs-i:hover,
    .ded-vs .ded-vs-l > li:hover,
    .ded-vs .ded-vs-go:hover {
        transform: none !important;
    }
}

/*naeti-sarvari/Всичко едно до друго*/

/* ==========================================================================
   DED TABLE — GRID CARD DESIGN
   Стил по подобие на .wp-all-l
   ========================================================================== */

/* ==========================================================
   СЕКЦИЯ / ЗАГЛАВИЕ
   ========================================================== */

.ded-head {
    max-width: 850px !important;
}

.ded-head h2 {
    color: #111827 !important;
    letter-spacing: -0.7px !important;
}

.ded-head p {
    color: #6b7280 !important;
    line-height: 1.7 !important;
}


/* ==========================================================
   ОСНОВНА ОБВИВКА
   ========================================================== */

.ded-tbl {
    position: relative !important;

    margin-top: 32px !important;

    width: 100% !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 32px !important;

    padding: 28px !important;

    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.03) !important;

    overflow: hidden !important;
}


/* ==========================================================
   TABLE → GRID
   ========================================================== */

.ded-tbl table {
    width: 100% !important;

    border: 0 !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    table-layout: fixed !important;
}


/* Header не ни е нужен визуално */

.ded-tbl thead {
    display: none !important;
}


/* ==========================================================
   BODY
   ========================================================== */

.ded-tbl tbody {
    display: grid !important;

    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;

    gap: 20px !important;

    width: 100% !important;
}


/* Всеки ред става invisible wrapper */

.ded-tbl tbody tr {
    display: contents !important;
}


/* ==========================================================
   ВСЯКА КЛЕТКА = CARD
   ========================================================== */

.ded-tbl tbody td {
    position: relative !important;

    min-height: 125px !important;

    padding: 24px !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;

    border: 1.5px solid #7cbf00 !important;

    border-radius: 26px !important;

    background: #5E9A000D !important;

    color: #4b5563 !important;

    font-size: 14px !important;

    line-height: 1.5 !important;

    overflow: hidden !important;

    box-shadow:
        0 4px 6px -1px rgba(0, 0, 0, 0.02) !important;

    transition:
        transform .22s cubic-bezier(.2, .9, .2, 1),
        box-shadow .22s,
        border-color .22s,
        background .22s !important;
}


/* ==========================================================
   GREEN DECORATIVE GLOW
   ========================================================== */

.ded-tbl tbody td::before {
    content: "" !important;

    position: absolute !important;

    width: 70px !important;
    height: 70px !important;

    right: -25px !important;
    top: -25px !important;

    border-radius: 50% !important;

    background: rgba(152, 219, 28, 0.10) !important;

    pointer-events: none !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.ded-tbl tbody td:hover {
    transform: translateY(-4px) !important;

    border-color: #69c90e !important;

    background: #ffffff !important;

    box-shadow:
        0 15px 30px rgba(105, 201, 14, 0.12) !important;
}


/* ==========================================================
   LABEL / ПЪРВА КОЛОНА
   ========================================================== */

.ded-tbl tbody td:first-child {
    background:
        linear-gradient(
            135deg,
            #efffd5,
            #f7ffe9
        ) !important;

    border-color: rgba(91, 137, 9, 0.55) !important;

    color: #305a08 !important;
}


/* Label hover */

.ded-tbl tbody td:first-child:hover {
    background: #ffffff !important;

    border-color: #69c90e !important;
}


/* ==========================================================
   LABEL TEXT
   ========================================================== */

.ded-tbl tbody td:first-child b {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    align-items: center !important;

    gap: 9px !important;

    color: #305a08 !important;

    font-size: 14px !important;

    font-weight: 700 !important;

    line-height: 1.35 !important;
}


/* Малка зелена точка */

.ded-tbl tbody td:first-child b::before {
    content: "" !important;

    width: 8px !important;
    height: 8px !important;

    flex: 0 0 8px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 0 5px rgba(152, 219, 28, 0.13) !important;
}


/* ==========================================================
   VALUE TEXT
   ========================================================== */

.ded-tbl tbody td:not(:first-child) {
    color: #374151 !important;

    font-size: 14px !important;

    font-weight: 500 !important;

    white-space: normal !important;

    overflow-wrap: anywhere !important;
}


/* Ако вътре има bold */

.ded-tbl tbody td:not(:first-child) b {
    color: #111827 !important;

    font-weight: 700 !important;
}


/* ==========================================================
   PRICE CARD
   ========================================================== */

.ded-tbl tbody tr:last-child td {
    background:
        linear-gradient(
            135deg,
            #f0ffd9,
            #ffffff
        ) !important;

    border-color: rgba(152, 219, 28, 0.55) !important;
}


.ded-tbl tbody tr:last-child td:hover {
    background: #ffffff !important;

    border-color: #69c90e !important;

    box-shadow:
        0 15px 30px rgba(105, 201, 14, 0.15) !important;
}


/* ==========================================================
   MOBILE SCROLL НЕ Е НУЖЕН
   ========================================================== */

.ded-tbl {
    overflow: visible !important;
}


/* ==========================================================
   TABLET — 2 КАРТИ
   ========================================================== */

@media (max-width: 1024px) {

    .ded-tbl {
        padding: 24px !important;

        border-radius: 28px !important;
    }

    .ded-tbl tbody {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

        gap: 18px !important;
    }

    .ded-tbl tbody td {
        min-height: 115px !important;

        padding: 22px !important;
    }
}


/* ==========================================================
   MOBILE — 1 КАРТА
   ========================================================== */

@media (max-width: 640px) {

    .ded-tbl {
        margin-top: 24px !important;

        padding: 16px !important;

        border-radius: 24px !important;
    }

    .ded-tbl tbody {
        grid-template-columns: 1fr !important;

        gap: 14px !important;
    }

    .ded-tbl tbody td {
        min-height: 90px !important;

        padding: 20px !important;

        border-radius: 21px !important;

        font-size: 13px !important;
    }

    .ded-tbl tbody td:first-child b {
        font-size: 13px !important;
    }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .ded-tbl {
        padding: 12px !important;

        border-radius: 21px !important;
    }

    .ded-tbl tbody {
        gap: 12px !important;
    }

    .ded-tbl tbody td {
        padding: 18px !important;

        border-radius: 19px !important;
    }
}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .ded-tbl tbody td {
        transition: none !important;
    }

    .ded-tbl tbody td:hover {
        transform: none !important;
    }
}


/*добавки*/



/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СЕКЦИЯ "ДОБАВКИ"
   ========================================================================== */

/* ==========================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================== */

section.sec-wash:has(.ded-adds) {
    position: relative !important;

    background: #0b0f08 !important;

    padding: 90px 20px !important;

    color: #f5f7f2 !important;

    overflow: hidden !important;
}


/* Зелен ambient glow */

section.sec-wash:has(.ded-adds)::before {
    content: "" !important;

    position: absolute !important;

    width: 650px !important;
    height: 650px !important;

    left: 50% !important;
    top: 15% !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.075) 0%,
            rgba(152,219,28,0.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================
   WRAPPER
   ========================================================== */

section.sec-wash:has(.ded-adds) .wrap-n {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1180px !important;

    margin: 0 auto !important;
}


/* ==========================================================
   HEAD
   ========================================================== */

section.sec-wash:has(.ded-adds) .ded-head {
    max-width: 760px !important;

    margin: 0 auto 50px !important;

    text-align: center !important;
}


section.sec-wash:has(.ded-adds) .ded-head h2 {
    margin: 0 0 15px !important;

    color: #7cbf00 !important;

    font-size: clamp(30px, 4vw, 44px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec-wash:has(.ded-adds) .ded-head p {
    margin: 0 !important;

    color: #9ca694 !important;

    font-size: 16px !important;

    line-height: 1.65 !important;
}


/* Зелената линия */

section.sec-wash:has(.ded-adds) .ded-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 24px auto 0 !important;

    border-radius: 999px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 18px rgba(152,219,28,0.45) !important;
}


/* ==========================================================
   GRID
   ========================================================== */

.ded-adds {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 18px !important;

    align-items: stretch !important;
}


/* ==========================================================
   ADD CARD
   ========================================================== */

.ded-add {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    justify-content: space-between !important;

    min-height: 190px !important;

    padding: 25px !important;

    overflow: hidden !important;

    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #10140d 100%
        ) !important;

    border: 1px solid rgba(255,255,255,0.08) !important;

    border-radius: 20px !important;

    box-shadow:
        0 18px 45px rgba(0,0,0,0.28),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease !important;
}


/* ==========================================================
   TOP LIGHT LINE
   ========================================================== */

.ded-add::before {
    content: "" !important;

    position: absolute !important;

    left: 15% !important;
    right: 15% !important;
    top: 0 !important;

    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(152,219,28,0.55),
            transparent
        ) !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}


/* ==========================================================
   GREEN GLOW
   ========================================================== */

.ded-add::after {
    content: "" !important;

    position: absolute !important;

    width: 120px !important;
    height: 120px !important;

    right: -65px !important;
    top: -65px !important;

    border-radius: 50% !important;

    background:
        rgba(152,219,28,0.055) !important;

    filter: blur(12px) !important;

    pointer-events: none !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.ded-add:hover {
    transform: translateY(-7px) !important;

    background:
        linear-gradient(
            145deg,
            #192011 0%,
            #11170d 100%
        ) !important;

    border-color:
        rgba(152,219,28,0.38) !important;

    box-shadow:
        0 25px 55px rgba(0,0,0,0.40),
        0 0 30px rgba(152,219,28,0.06) !important;
}


.ded-add:hover::before {
    opacity: 1 !important;
}


/* ==========================================================
   TEXT AREA
   ========================================================== */

.ded-add-t {
    position: relative !important;

    z-index: 2 !important;

    display: flex !important;

    flex-direction: column !important;

    gap: 8px !important;
}


/* ==========================================================
   TITLE
   ========================================================== */

.ded-add-t > b {
    color: #ffffff !important;

    font-size: 17px !important;

    line-height: 1.3 !important;

    font-weight: 750 !important;

    letter-spacing: -.25px !important;
}


/* Малък зелен маркер */

.ded-add-t > b::before {
    content: "" !important;

    display: inline-block !important;

    width: 7px !important;
    height: 7px !important;

    margin-right: 8px !important;

    vertical-align: 2px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 10px rgba(152,219,28,0.35) !important;
}


/* ==========================================================
   DESCRIPTION
   ========================================================== */

.ded-add-t > span {
    color: #8f9888 !important;

    font-size: 13px !important;

    line-height: 1.55 !important;

    max-width: 95% !important;
}


/* ==========================================================
   PRICE
   ========================================================== */

.ded-add-p {
    position: relative !important;

    z-index: 2 !important;

    display: flex !important;

    align-items: baseline !important;

    flex-wrap: wrap !important;

    gap: 5px !important;

    margin-top: 22px !important;

    padding-top: 17px !important;

    border-top:
        1px solid rgba(255,255,255,0.07) !important;

    color: #7cbf00 !important;

    font-size: 22px !important;

    line-height: 1 !important;

    font-weight: 800 !important;

    letter-spacing: -.5px !important;
}


/* /месец */

.ded-add-p > span {
    color: #697264 !important;

    font-size: 11px !important;

    line-height: 1.3 !important;

    font-weight: 500 !important;

    letter-spacing: 0 !important;
}


/* ==========================================================
   FREE
   ========================================================== */

.ded-add-p.free {
    color: #b8ed54 !important;

    font-size: 18px !important;
}


.ded-add-p.free > span {
    color: #7d8876 !important;

    font-size: 11px !important;
}


/* ==========================================================
   FREE CARD — SPECIAL
   ========================================================== */

.ded-add:last-child {
    border-color:
        rgba(152,219,28,0.28) !important;

    background:
        linear-gradient(
            145deg,
            #17200f 0%,
            #10150c 100%
        ) !important;

    box-shadow:
        0 20px 50px rgba(0,0,0,0.30),
        0 0 30px rgba(152,219,28,0.045) !important;
}


.ded-add:last-child::before {
    opacity: 1 !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            #7cbf00,
            transparent
        ) !important;
}


.ded-add:last-child:hover {
    border-color: #7cbf00 !important;

    box-shadow:
        0 28px 60px rgba(0,0,0,0.42),
        0 0 35px rgba(152,219,28,0.10) !important;
}


/* ==========================================================
   TABLET — 2 КАРТИ
   ========================================================== */

@media (max-width: 1024px) {

    section.sec-wash:has(.ded-adds) {
        padding: 75px 20px !important;
    }

    .ded-adds {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 18px !important;
    }

    .ded-add {
        min-height: 180px !important;
    }
}


/* ==========================================================
   MOBILE — 1 КАРТА
   ========================================================== */

@media (max-width: 640px) {

    section.sec-wash:has(.ded-adds) {
        padding: 60px 16px !important;
    }

    section.sec-wash:has(.ded-adds) .ded-head {
        margin-bottom: 36px !important;
    }

    section.sec-wash:has(.ded-adds) .ded-head h2 {
        font-size: 30px !important;
    }

    section.sec-wash:has(.ded-adds) .ded-head p {
        font-size: 14px !important;
    }

    .ded-adds {
        grid-template-columns: 1fr !important;

        gap: 14px !important;
    }

    .ded-add {
        min-height: auto !important;

        padding: 23px 21px !important;

        border-radius: 17px !important;
    }

    .ded-add:hover {
        transform: translateY(-4px) !important;
    }

    .ded-add-t > b {
        font-size: 16px !important;
    }

    .ded-add-t > span {
        font-size: 13px !important;
    }

    .ded-add-p {
        margin-top: 19px !important;

        padding-top: 15px !important;

        font-size: 21px !important;
    }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .ded-add {
        padding: 21px 18px !important;

        border-radius: 15px !important;
    }

    .ded-add-t > b {
        font-size: 15px !important;
    }

    .ded-add-t > span {
        font-size: 12.5px !important;
    }

    .ded-add-p {
        font-size: 20px !important;
    }
}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .ded-add {
        transition: none !important;
    }

    .ded-add:hover {
        transform: none !important;
    }
}

/*Къде стои машината*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КЪДЕ СТОИ МАШИНАТА"
   ========================================================================== */

/* ==========================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================== */

section.sec:has(.ded-dc) {
    position: relative !important;

    background: #ffffff !important;

    padding: 85px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}


/* Лек зелен ambient ефект */

section.sec:has(.ded-dc)::before {
    content: "" !important;

    position: absolute !important;

    width: 520px !important;
    height: 520px !important;

    left: -220px !important;
    top: 10% !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.08) 0%,
            rgba(152,219,28,0.025) 42%,
            transparent 72%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================
   WRAPPER
   ========================================================== */

section.sec:has(.ded-dc) .wrap-w {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1180px !important;

    margin: 0 auto !important;
}


/* ==========================================================
   HEAD
   ========================================================== */

section.sec:has(.ded-dc) .ded-head {
    max-width: 800px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}


section.sec:has(.ded-dc) .ded-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 43px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec:has(.ded-dc) .ded-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент */

section.sec:has(.ded-dc) .ded-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 16px rgba(152,219,28,0.30) !important;
}


/* ==========================================================
   MAIN LAYOUT
   ========================================================== */

.ded-dc {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1.05fr)
        minmax(0, .95fr) !important;

    gap: 22px !important;

    align-items: stretch !important;
}


/* ==========================================================
   LEFT — LOCATION CARD
   ========================================================== */

.ded-dc-box {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-height: 100% !important;

    padding: 34px !important;

    overflow: hidden !important;

    border-radius: 26px !important;

    border: 1.5px solid rgba(91,137,9,0.42) !important;

    background:
        linear-gradient(
            145deg,
            #f5ffe6 0%,
            #ffffff 70%
        ) !important;

    box-shadow:
        0 12px 35px rgba(15,23,42,0.055),
        inset 0 1px 0 rgba(255,255,255,0.8) !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease !important;
}


.ded-dc-box:hover {
    transform: translateY(-5px) !important;

    border-color: #69c90e !important;

    box-shadow:
        0 20px 45px rgba(15,23,42,0.09),
        0 8px 25px rgba(105,201,14,0.08) !important;
}


/* Зелен декоративен glow */

.ded-dc-box::before {
    content: "" !important;

    position: absolute !important;

    width: 230px !important;
    height: 230px !important;

    right: -100px !important;
    top: -100px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.16),
            transparent 68%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================
   LOCATION TITLE
   ========================================================== */

.ded-dc-box h3 {
    position: relative !important;

    z-index: 2 !important;

    margin: 0 0 10px !important;

    color: #111827 !important;

    font-size: 27px !important;

    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -.6px !important;
}


.ded-dc-box h3::before {
    content: "" !important;

    display: inline-block !important;

    width: 10px !important;
    height: 10px !important;

    margin-right: 10px !important;

    vertical-align: 2px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 0 6px rgba(152,219,28,0.14),
        0 0 18px rgba(152,219,28,0.30) !important;
}


/* ==========================================================
   DESCRIPTION
   ========================================================== */

.ded-dc-box > p {
    position: relative !important;

    z-index: 2 !important;

    margin: 0 !important;

    max-width: 570px !important;

    color: #6b7280 !important;

    font-size: 14px !important;

    line-height: 1.65 !important;
}


/* ==========================================================
   LATENCY AREA
   ========================================================== */

.ded-dc-l {
    position: relative !important;

    z-index: 2 !important;

    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0,1fr)) !important;

    gap: 10px !important;

    margin-top: auto !important;

    padding-top: 28px !important;
}


/* ==========================================================
   LATENCY BUBBLES
   ========================================================== */

.ded-dc-r {
    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    gap: 12px !important;

    padding: 14px 15px !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,0.78) !important;

    border: 1px solid #e5e7eb !important;

    box-shadow:
        0 4px 12px rgba(15,23,42,0.025) !important;

    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease !important;
}


.ded-dc-r:hover {
    transform: translateY(-2px) !important;

    border-color:
        rgba(152,219,28,0.55) !important;

    box-shadow:
        0 8px 18px rgba(105,201,14,0.08) !important;
}


/* City */

.ded-dc-r b {
    color: #374151 !important;

    font-size: 12px !important;

    line-height: 1.3 !important;

    font-weight: 650 !important;
}


/* Ping */

.ded-dc-r span {
    flex: 0 0 auto !important;

    padding: 5px 9px !important;

    border-radius: 999px !important;

    background: #f0fdf4 !important;

    border: 1px solid rgba(152,219,28,0.32) !important;

    color: #7cbf00 !important;

    font-size: 11px !important;

    line-height: 1 !important;

    font-weight: 800 !important;
}


/* ==========================================================
   RIGHT — FACTS
   ========================================================== */

.ded-dc-facts {
    display: grid !important;

    grid-template-columns: 1fr 1fr !important;

    gap: 16px !important;

    align-content: stretch !important;
}


/* ==========================================================
   FACT CARD
   ========================================================== */

.ded-dc-f {
    position: relative !important;

    display: flex !important;

    align-items: flex-start !important;

    gap: 14px !important;

    padding: 22px !important;

    border-radius: 20px !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    box-shadow:
        0 8px 25px rgba(15,23,42,0.045) !important;

    transition:
        transform .28s ease,
        border-color .28s ease,
        box-shadow .28s ease,
        background .28s ease !important;
}


.ded-dc-f:hover {
    transform: translateY(-5px) !important;

    border-color:
        rgba(152,219,28,0.50) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fbfff6
        ) !important;

    box-shadow:
        0 16px 35px rgba(15,23,42,0.08),
        0 5px 18px rgba(152,219,28,0.06) !important;
}


/* ==========================================================
   ICON
   ========================================================== */

.ded-dc-ic {
    flex: 0 0 auto !important;

    width: 44px !important;
    height: 44px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    border-radius: 14px !important;

    background:
        rgba(152,219,28,0.12) !important;

    border:
        1px solid rgba(152,219,28,0.24) !important;

    color: #7cbf00 !important;

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease !important;
}


.ded-dc-ic svg {
    width: 21px !important;
    height: 21px !important;
}


.ded-dc-f:hover .ded-dc-ic {
    transform: scale(1.06) !important;

    background: #7cbf00 !important;

    color: #1d2a08 !important;
}


/* ==========================================================
   FACT TEXT
   ========================================================== */

.ded-dc-f > span:last-child {
    display: flex !important;

    flex-direction: column !important;

    gap: 6px !important;
}


.ded-dc-f b {
    color: #111827 !important;

    font-size: 14px !important;

    line-height: 1.35 !important;

    font-weight: 750 !important;
}


.ded-dc-f > span:last-child > span {
    color: #6b7280 !important;

    font-size: 12.5px !important;

    line-height: 1.55 !important;
}


/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 950px) {

    section.sec:has(.ded-dc) {
        padding: 70px 20px !important;
    }

    .ded-dc {
        grid-template-columns: 1fr !important;
    }

    .ded-dc-box {
        min-height: auto !important;
    }

    .ded-dc-l {
        margin-top: 25px !important;
    }

    .ded-dc-facts {
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    }
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 640px) {

    section.sec:has(.ded-dc) {
        padding: 60px 16px !important;
    }

    section.sec:has(.ded-dc) .ded-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.ded-dc) .ded-head h2 {
        font-size: 30px !important;
    }

    section.sec:has(.ded-dc) .ded-head p {
        font-size: 14px !important;
    }

    .ded-dc {
        gap: 14px !important;
    }

    .ded-dc-box {
        padding: 24px 20px !important;

        border-radius: 20px !important;
    }

    .ded-dc-box h3 {
        font-size: 23px !important;
    }

    .ded-dc-box > p {
        font-size: 13px !important;
    }

    .ded-dc-l {
        grid-template-columns: 1fr !important;

        gap: 8px !important;

        padding-top: 22px !important;
    }

    .ded-dc-r {
        padding: 13px 14px !important;
    }

    .ded-dc-facts {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    .ded-dc-f {
        padding: 19px !important;

        border-radius: 17px !important;
    }

    .ded-dc-ic {
        width: 41px !important;
        height: 41px !important;

        border-radius: 12px !important;
    }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .ded-dc-box {
        padding: 21px 17px !important;
    }

    .ded-dc-box h3 {
        font-size: 21px !important;
    }

    .ded-dc-f {
        padding: 17px !important;
    }

    .ded-dc-f b {
        font-size: 13px !important;
    }

    .ded-dc-f > span:last-child > span {
        font-size: 12px !important;
    }
}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .ded-dc-box,
    .ded-dc-f,
    .ded-dc-r,
    .ded-dc-ic {
        transition: none !important;
    }

    .ded-dc-box:hover,
    .ded-dc-f:hover,
    .ded-dc-r:hover {
        transform: none !important;
    }
}

/*proverka-na-domeyn/Какво влиза в цената*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАКВО ВЛИЗА В ЦЕНАТА"
   ========================================================================== */

/* ==========================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================== */

section.sec:has(.dwhy) {
    position: relative !important;

    background: #ffffff !important;

    padding: 85px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}


/* Лек зелен ambient glow */

section.sec:has(.dwhy)::before {
    content: "" !important;

    position: absolute !important;

    width: 600px !important;
    height: 600px !important;

    left: 50% !important;
    top: 0 !important;

    transform: translateX(-50%) !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.055) 0%,
            rgba(152,219,28,0.018) 40%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================
   WRAPPER
   ========================================================== */

section.sec:has(.dwhy) .wrap-w {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1180px !important;

    margin: 0 auto !important;
}


/* ==========================================================
   HEADER
   ========================================================== */

section.sec:has(.dwhy) .dsec-head {
    max-width: 800px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}


section.sec:has(.dwhy) .dsec-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 43px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec:has(.dwhy) .dsec-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент под заглавието */

section.sec:has(.dwhy) .dsec-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 999px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 17px rgba(152,219,28,0.30) !important;
}


/* ==========================================================
   GRID — 4 КАРТИ
   ========================================================== */

.dwhy {
    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;

    gap: 18px !important;

    align-items: stretch !important;
}


/* ==========================================================
   CARD
   ========================================================== */

.dwhy-i {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-height: 250px !important;

    padding: 25px !important;

    overflow: hidden !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfcfa 100%
        ) !important;

    border: 1.5px solid #e5e7eb !important;

    border-radius: 22px !important;

    box-shadow:
        0 8px 25px rgba(15,23,42,0.045),
        inset 0 1px 0 rgba(255,255,255,0.9) !important;

    transition:
        transform .3s cubic-bezier(.2,.9,.2,1),
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}


/* Горна зелена линия */

.dwhy-i::before {
    content: "" !important;

    position: absolute !important;

    left: 18% !important;
    right: 18% !important;

    top: 0 !important;

    height: 3px !important;

    border-radius: 0 0 999px 999px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(152,219,28,0.65),
            transparent
        ) !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}


/* ==========================================================
   DECORATIVE GLOW
   ========================================================== */

.dwhy-i::after {
    content: "" !important;

    position: absolute !important;

    width: 130px !important;
    height: 130px !important;

    right: -70px !important;
    top: -70px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,0.10),
            transparent 68%
        ) !important;

    pointer-events: none !important;

    transition:
        transform .35s ease,
        opacity .35s ease !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.dwhy-i:hover {
    transform: translateY(-7px) !important;

    border-color:
        rgba(105,201,14,0.50) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fafff4 100%
        ) !important;

    box-shadow:
        0 20px 42px rgba(15,23,42,0.08),
        0 6px 20px rgba(105,201,14,0.07) !important;
}


.dwhy-i:hover::before {
    opacity: 1 !important;
}


.dwhy-i:hover::after {
    transform: scale(1.25) !important;
}


/* ==========================================================
   ICON
   ========================================================== */

.dwhy-ic {
    position: relative !important;

    z-index: 2 !important;

    width: 50px !important;
    height: 50px !important;

    min-width: 50px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 22px !important;

    border-radius: 15px !important;

    background:
        rgba(152,219,28,0.12) !important;

    border:
        1px solid rgba(152,219,28,0.25) !important;

    color: #7cbf00 !important;

    box-shadow:
        0 5px 14px rgba(152,219,28,0.07) !important;

    transition:
        transform .28s ease,
        background .28s ease,
        color .28s ease,
        box-shadow .28s ease !important;
}


.dwhy-ic svg {
    width: 23px !important;
    height: 23px !important;
}


.dwhy-i:hover .dwhy-ic {
    transform: scale(1.07) rotate(-2deg) !important;

    background: #7cbf00 !important;

    color: #1c2907 !important;

    box-shadow:
        0 7px 18px rgba(152,219,28,0.20) !important;
}


/* ==========================================================
   TITLE
   ========================================================== */

.dwhy-i > b {
    position: relative !important;

    z-index: 2 !important;

    display: block !important;

    margin-bottom: 9px !important;

    color: #111827 !important;

    font-size: 16px !important;

    line-height: 1.35 !important;

    font-weight: 750 !important;

    letter-spacing: -.2px !important;
}


/* ==========================================================
   DESCRIPTION
   ========================================================== */

.dwhy-i > p {
    position: relative !important;

    z-index: 2 !important;

    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 13px !important;

    line-height: 1.6 !important;
}


/* ==========================================================
   SMALL GREEN NUMBER / MARKER
   ========================================================== */

.dwhy-i:nth-child(1)::marker,
.dwhy-i:nth-child(2)::marker,
.dwhy-i:nth-child(3)::marker,
.dwhy-i:nth-child(4)::marker {
    color: #7cbf00 !important;
}


/* ==========================================================
   ЛЕКО РАЗЛИЧИЕ МЕЖДУ КАРТИТЕ
   ========================================================== */

.dwhy-i:nth-child(1) {
    border-color:
        rgba(152,219,28,0.28) !important;
}

.dwhy-i:nth-child(1) .dwhy-ic {
    background:
        rgba(152,219,28,0.15) !important;
}


/* ==========================================================
   TABLET — 2 × 2
   ========================================================== */

@media (max-width: 1024px) {

    section.sec:has(.dwhy) {
        padding: 75px 20px !important;
    }

    .dwhy {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 18px !important;
    }

    .dwhy-i {
        min-height: 225px !important;
    }
}


/* ==========================================================
   MOBILE — 1 КОЛОНА
   ========================================================== */

@media (max-width: 640px) {

    section.sec:has(.dwhy) {
        padding: 60px 16px !important;
    }

    section.sec:has(.dwhy) .dsec-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.dwhy) .dsec-head h2 {
        font-size: 30px !important;
    }

    section.sec:has(.dwhy) .dsec-head p {
        font-size: 14px !important;
    }

    .dwhy {
        grid-template-columns: 1fr !important;

        gap: 13px !important;
    }

    .dwhy-i {
        min-height: auto !important;

        padding: 22px !important;

        border-radius: 18px !important;
    }

    .dwhy-ic {
        width: 45px !important;
        height: 45px !important;

        min-width: 45px !important;

        margin-bottom: 18px !important;

        border-radius: 13px !important;
    }

    .dwhy-i > b {
        font-size: 15px !important;
    }

    .dwhy-i > p {
        font-size: 13px !important;
    }

    .dwhy-i:hover {
        transform: translateY(-4px) !important;
    }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .dwhy-i {
        padding: 20px 18px !important;

        border-radius: 16px !important;
    }

    .dwhy-ic {
        width: 42px !important;
        height: 42px !important;

        min-width: 42px !important;
    }

    .dwhy-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    .dwhy-i > b {
        font-size: 14px !important;
    }

    .dwhy-i > p {
        font-size: 12.5px !important;
    }
}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .dwhy-i,
    .dwhy-ic {
        transition: none !important;
    }

    .dwhy-i:hover {
        transform: none !important;
    }
}

/*proverka-na-domeyn/faq*/

/* ==========================================================================
   FAQ — СВЕТЪЛ PREMIUM ДИЗАЙН
   Директно за .dfaq секцията
   ========================================================================== */


/* ==========================================================
   FAQ GRID — 2 КОЛОНИ
   ========================================================== */

.dfaq {
    display: grid !important;

    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 20px !important;

    margin-top: 40px !important;

    width: 100% !important;
}


/* ==========================================================
   FAQ КАРТИ
   ========================================================== */

.dfaq .dfaq-i {
    position: relative !important;

    display: block !important;

    width: 100% !important;

    box-sizing: border-box !important;

    background: #ffffff !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;

    border-radius: 16px !important;

    padding: 28px 25px !important;

    cursor: pointer !important;

    overflow: hidden !important;

    box-shadow:
        0 4px 15px rgba(48, 90, 8, 0.03) !important;

    transition:
        transform .4s cubic-bezier(.165,.84,.44,1),
        box-shadow .4s ease,
        border-color .4s ease,
        background .4s ease !important;
}


/* ==========================================================
   ЗЕЛЕНА ЛИНИЯ ОТГОРЕ
   ========================================================== */

.dfaq .dfaq-i::before {
    content: "" !important;

    position: absolute !important;

    left: 20px !important;

    right: 20px !important;

    top: 0 !important;

    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            #7cbf00,
            transparent
        ) !important;

    border-radius: 0 0 10px 10px !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}


/* ==========================================================
   ЛЕК GREEN GLOW
   ========================================================== */

.dfaq .dfaq-i::after {
    content: "" !important;

    position: absolute !important;

    width: 180px !important;

    height: 180px !important;

    right: -100px !important;

    top: -100px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.10) 0%,
            rgba(152,219,28,.035) 40%,
            transparent 70%
        ) !important;

    pointer-events: none !important;

    transition: transform .4s ease !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.dfaq .dfaq-i:hover {
    transform: translateY(-5px) !important;

    border-color:
        rgba(105, 201, 14, 0.55) !important;

    box-shadow:
        0 16px 30px rgba(48, 90, 8, 0.08),
        0 5px 18px rgba(152, 219, 28, 0.05) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fcfff8 100%
        ) !important;
}


.dfaq .dfaq-i:hover::before {
    opacity: 1 !important;
}


.dfaq .dfaq-i:hover::after {
    transform: scale(1.25) !important;
}


/* ==========================================================
   OPEN STATE
   ========================================================== */

.dfaq .dfaq-i.is-open {
    border-color:
        rgba(105, 201, 14, 0.55) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fafff5 100%
        ) !important;

    box-shadow:
        0 16px 32px rgba(48, 90, 8, 0.08),
        0 5px 20px rgba(152, 219, 28, 0.07) !important;
}


.dfaq .dfaq-i.is-open::before {
    opacity: 1 !important;
}


/* ==========================================================
   ЦЕНА / BADGE
   ========================================================== */

.dfaq .dfaq-n {
    position: relative !important;

    z-index: 2 !important;

    display: inline-flex !important;

    align-items: center !important;

    width: fit-content !important;

    box-sizing: border-box !important;

    margin: 0 0 12px !important;

    padding: 5px 11px !important;

    border-radius: 20px !important;

    background:
        rgba(183, 255, 53, 0.20) !important;

    border:
        1px solid rgba(152, 219, 28, 0.30) !important;

    color: #305a08 !important;

    font-size: 11px !important;

    line-height: 1.2 !important;

    font-weight: 700 !important;

    letter-spacing: .04em !important;

    text-transform: uppercase !important;
}


/* ==========================================================
   ЗАГЛАВИЕ / ВЪПРОС
   ========================================================== */

.dfaq .dfaq-i h3 {
    position: relative !important;

    z-index: 2 !important;

    margin: 0 !important;

    padding: 0 35px 0 0 !important;

    color: #1a2e05 !important;

    font-size: 1.15rem !important;

    line-height: 1.4 !important;

    font-weight: 700 !important;

    letter-spacing: -.2px !important;
}


/* ==========================================================
   PLUS
   ========================================================== */

.dfaq .dfaq-i h3::after {
    content: "+" !important;

    position: absolute !important;

    right: 0 !important;

    top: 50% !important;

    width: 29px !important;

    height: 29px !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    transform: translateY(-50%) !important;

    box-sizing: border-box !important;

    border-radius: 50% !important;

    background:
        rgba(152, 219, 28, 0.10) !important;

    border:
        1px solid rgba(152, 219, 28, 0.25) !important;

    color: #305a08 !important;

    font-size: 21px !important;

    line-height: 1 !important;

    font-weight: 400 !important;

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease !important;
}


/* ==========================================================
   OPEN — X
   ========================================================== */

.dfaq .dfaq-i.is-open h3::after {
    transform:
        translateY(-50%) rotate(45deg) !important;

    background: #7cbf00 !important;

    border-color: #7cbf00 !important;

    color: #1a2e05 !important;
}


/* ==========================================================
   ОТГОВОР
   ========================================================== */

.dfaq .dfaq-i p {
    position: relative !important;

    z-index: 2 !important;

    display: block !important;

    max-height: 0 !important;

    overflow: hidden !important;

    opacity: 0 !important;

    margin: 0 !important;

    padding: 0 !important;

    color: #4a5c3a !important;

    font-size: .95rem !important;

    line-height: 1.65 !important;

    transition:
        max-height .4s cubic-bezier(.165,.84,.44,1),
        opacity .3s ease,
        margin-top .3s ease !important;
}


/* ==========================================================
   ОТВОРЕН ОТГОВОР
   ========================================================== */

.dfaq .dfaq-i.is-open p {
    max-height: 500px !important;

    opacity: 1 !important;

    margin-top: 14px !important;
}


/* ==========================================================
   BOLD В ОТГОВОРА
   ========================================================== */

.dfaq .dfaq-i p b {
    color: #305a08 !important;

    font-weight: 700 !important;
}


/* ==========================================================
   HEADER НА СЕКЦИЯТА
   ========================================================== */

.dsec-head {
    max-width: 760px !important;

    margin: 0 auto !important;

    text-align: center !important;
}


.dsec-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 43px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


.dsec-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелената чертичка */

.dsec-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;

    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 18px rgba(152,219,28,.35) !important;
}


/* ==========================================================
   СЕКЦИЯ
   ========================================================== */

.sec.sec-wash {
    position: relative !important;

    background: #ffffff !important;

    padding: 85px 20px !important;

    overflow: hidden !important;
}


/* ==========================================================
   TABLET — 2 КАРТИ
   ========================================================== */

@media (max-width: 900px) {

    .dfaq {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 16px !important;
    }

    .dfaq .dfaq-i {
        padding: 24px 21px !important;
    }

}


/* ==========================================================
   MOBILE — 1 КАРТА
   ========================================================== */

@media (max-width: 640px) {

    .sec.sec-wash {
        padding: 60px 16px !important;
    }

    .dsec-head {
        margin-bottom: 0 !important;
    }

    .dsec-head h2 {
        font-size: 30px !important;
    }

    .dsec-head p {
        font-size: 14px !important;
    }

    .dfaq {
        grid-template-columns: 1fr !important;

        gap: 12px !important;

        margin-top: 32px !important;
    }

    .dfaq .dfaq-i {
        padding: 22px 19px !important;

        border-radius: 16px !important;
    }

    .dfaq .dfaq-i h3 {
        font-size: 15px !important;

        line-height: 1.4 !important;

        padding-right: 34px !important;
    }

    .dfaq .dfaq-i p {
        font-size: 13px !important;

        line-height: 1.6 !important;
    }

    .dfaq .dfaq-n {
        font-size: 10px !important;
    }

    .dfaq .dfaq-i h3::after {
        width: 27px !important;
        height: 27px !important;

        font-size: 19px !important;
    }

}


/* ==========================================================
   VERY SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .dfaq .dfaq-i {
        padding: 20px 17px !important;
    }

    .dfaq .dfaq-i h3 {
        font-size: 14px !important;
    }

    .dfaq .dfaq-i p {
        font-size: 12.5px !important;
    }

}

/*biskvitki/*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "ПОЛИТИКА ЗА БИСКВИТКИ"
   ========================================================================== */

/* Основна секция */
section.sec:has(.prose) {
    background: #f8faf7 !important;
    padding: 80px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Основен контейнер */
section.sec:has(.prose) .wrap-n {
    position: relative !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* Декоративен светлинен фон */
section.sec:has(.prose)::before {
    content: "" !important;
    position: absolute !important;
    width: 520px !important;
    height: 520px !important;
    top: -180px !important;
    right: -160px !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.09) 0%,
        rgba(152, 219, 28, 0.035) 38%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.prose) h1 {
    position: relative !important;
    margin: 0 0 12px !important;
    color: #111827 !important;
    font-size: clamp(32px, 5vw, 46px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1.2px !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.prose) h1::after {
    content: "" !important;
    display: block !important;
    width: 48px !important;
    height: 4px !important;
    margin-top: 20px !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 14px rgba(152, 219, 28, 0.25) !important;
}

/* Lead текст */
section.sec:has(.prose) > .wrap-n > .lead {
    margin: 0 0 42px !important;
    color: #6b7280 !important;
    font-size: 17px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   ОСНОВЕН PROSE БЛОК
   ========================================================================== */

section.sec:has(.prose) .prose {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 26px !important;
    padding: 38px !important;
    box-shadow:
        0 12px 35px rgba(15, 23, 42, 0.045),
        0 2px 8px rgba(15, 23, 42, 0.025) !important;
}

/* Зелената линия в горната част */
section.sec:has(.prose) .prose::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 4px !important;
    border-radius: 26px 26px 0 0 !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c2ef67,
        #7cbf00
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЯ В CONTENT
   ========================================================================== */

section.sec:has(.prose) .prose h2 {
    margin: 0 0 18px !important;
    color: #172000 !important;
    font-size: 22px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    letter-spacing: -0.4px !important;
}

/* Разстояние между отделните секции */
section.sec:has(.prose) .prose h2:not(:first-child) {
    margin-top: 38px !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.prose) .prose p {
    margin: 0 !important;
    color: #4b5563 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

section.sec:has(.prose) .prose p + p {
    margin-top: 14px !important;
}

/* ==========================================================================
   ТАБЛИЦА
   ========================================================================== */

section.sec:has(.prose) .cmp {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: 0 5px 18px rgba(15, 23, 42, 0.035) !important;
}

/* Header */
section.sec:has(.prose) .cmp thead th {
    padding: 16px 18px !important;
    background: #f4f8ee !important;
    color: #305a08 !important;
    border-bottom: 1px solid rgba(152, 219, 28, 0.25) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    letter-spacing: .5px !important;
}

/* Клетки */
section.sec:has(.prose) .cmp tbody td {
    padding: 18px !important;
    color: #4b5563 !important;
    background: #ffffff !important;
    border-bottom: 1px solid #eef0ec !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    vertical-align: middle !important;
}

/* Последен ред */
section.sec:has(.prose) .cmp tbody tr:last-child td {
    border-bottom: 0 !important;
}

/* Име на бисквитката */
section.sec:has(.prose) .cmp tbody td:first-child {
    color: #1a2e05 !important;
    font-weight: 750 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}

/* Срок */
section.sec:has(.prose) .cmp tbody td:last-child {
    color: #6b7280 !important;
    white-space: nowrap !important;
}

/* Hover върху ред */
section.sec:has(.prose) .cmp tbody tr {
    transition: background .2s ease !important;
}

section.sec:has(.prose) .cmp tbody tr:hover td {
    background: #fbfef8 !important;
}

/* ==========================================================================
   АКЦЕНТНИ ПАРАГРАФИ
   ========================================================================== */

section.sec:has(.prose) .prose h2 + p {
    position: relative !important;
    padding: 17px 20px !important;
    background: #f7faF4 !important;
    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 14px !important;
}

/* Ляв зелен акцент */
section.sec:has(.prose) .prose h2 + p::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 13px !important;
    bottom: 13px !important;
    width: 3px !important;
    border-radius: 5px !important;
    background: #7cbf00 !important;
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 700px) {

    section.sec:has(.prose) {
        padding: 60px 16px !important;
    }

    section.sec:has(.prose) h1 {
        font-size: 32px !important;
        letter-spacing: -.8px !important;
    }

    section.sec:has(.prose) > .wrap-n > .lead {
        font-size: 15px !important;
        margin-bottom: 30px !important;
    }

    section.sec:has(.prose) .prose {
        padding: 25px 18px !important;
        border-radius: 20px !important;
    }

    section.sec:has(.prose) .prose h2 {
        font-size: 20px !important;
    }

    section.sec:has(.prose) .prose h2:not(:first-child) {
        margin-top: 30px !important;
    }

    /* Таблицата става по-компактна */
    section.sec:has(.prose) .cmp {
        font-size: 13px !important;
    }

    section.sec:has(.prose) .cmp thead th,
    section.sec:has(.prose) .cmp tbody td {
        padding: 14px 12px !important;
    }

    section.sec:has(.prose) .cmp thead th {
        font-size: 10px !important;
    }

    section.sec:has(.prose) .cmp tbody td {
        font-size: 12.5px !important;
    }

    section.sec:has(.prose) .cmp tbody td:last-child {
        white-space: normal !important;
    }

    section.sec:has(.prose) .prose p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }
}

/*gdpr/*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — GDPR СЕКЦИЯ
   Работи директно със съществуващия HTML
   ========================================================================== */

/* Основна секция */
section.sec:has(.prose) {
    position: relative !important;
    background: #f8faf7 !important;
    padding: 80px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Декоративен зелен glow */
section.sec:has(.prose)::before {
    content: "" !important;
    position: absolute !important;
    width: 560px !important;
    height: 560px !important;
    top: -220px !important;
    right: -180px !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.10) 0%,
        rgba(152, 219, 28, 0.035) 38%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

/* Втори лек glow */
section.sec:has(.prose)::after {
    content: "" !important;
    position: absolute !important;
    width: 420px !important;
    height: 420px !important;
    left: -220px !important;
    bottom: -180px !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.055) 0%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.prose) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.prose) h1 {
    margin: 0 0 12px !important;
    color: #111827 !important;
    font-size: clamp(34px, 5vw, 48px) !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    letter-spacing: -1.3px !important;
}

/* Зелен акцент */
section.sec:has(.prose) h1::after {
    content: "" !important;
    display: block !important;
    width: 48px !important;
    height: 4px !important;
    margin-top: 20px !important;
    border-radius: 999px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c1ed67
    ) !important;
    box-shadow: 0 4px 15px rgba(152, 219, 28, 0.25) !important;
}

/* Подзаглавие */
section.sec:has(.prose) > .wrap-n > .lead {
    margin: 0 0 42px !important;
    color: #6b7280 !important;
    font-size: 17px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   ОСНОВЕН ДОКУМЕНТ
   ========================================================================== */

section.sec:has(.prose) .prose {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 26px !important;
    padding: 40px !important;
    box-shadow:
        0 18px 45px rgba(15, 23, 42, 0.055),
        0 3px 10px rgba(15, 23, 42, 0.025) !important;
}

/* Светла зелена линия отгоре */
section.sec:has(.prose) .prose::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 4px !important;
    border-radius: 26px 26px 0 0 !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c5ef70,
        #7cbf00
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЯ
   ========================================================================== */

section.sec:has(.prose) .prose h2 {
    position: relative !important;
    margin: 0 0 16px !important;
    padding-left: 17px !important;
    color: #172000 !important;
    font-size: 22px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
    letter-spacing: -0.4px !important;
}

/* Малка зелена черта пред всяко заглавие */
section.sec:has(.prose) .prose h2::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 3px !important;
    bottom: 3px !important;
    width: 4px !important;
    border-radius: 5px !important;
    background: #7cbf00 !important;
}

/* Разстояние между отделните блокове */
section.sec:has(.prose) .prose h2:not(:first-child) {
    margin-top: 38px !important;
}

/* ==========================================================================
   ОСНОВЕН ТЕКСТ
   ========================================================================== */

section.sec:has(.prose) .prose p {
    margin: 0 !important;
    color: #4b5563 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

/* Bold */
section.sec:has(.prose) .prose p b,
section.sec:has(.prose) .prose p strong {
    color: #273507 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   LEGAL WARNING
   ========================================================================== */

section.sec:has(.prose) .prose .legal-warn {
    position: relative !important;
    margin: 0 0 38px !important;
    padding: 18px 20px 18px 22px !important;
    background: #fffbea !important;
    border: 1px solid #f1df9b !important;
    border-radius: 15px !important;
    color: #66551a !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    box-shadow: 0 5px 16px rgba(120, 95, 20, 0.035) !important;
}

/* Ляв акцент на предупреждението */
section.sec:has(.prose) .prose .legal-warn::before {
    content: "!" !important;
    position: absolute !important;
    left: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 26px !important;
    height: 26px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #f4df82 !important;
    color: #66551a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Място за иконата */
section.sec:has(.prose) .prose .legal-warn {
    padding-left: 56px !important;
}

/* Текст в предупреждението */
section.sec:has(.prose) .prose .legal-warn strong {
    color: #554600 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ВИЗУАЛНО ОТДЕЛЯНЕ НА ПАРАГРАФИТЕ
   ========================================================================== */

section.sec:has(.prose) .prose h2 + p {
    padding: 18px 20px !important;
    background: #fbfdf9 !important;
    border: 1px solid #edf1e9 !important;
    border-radius: 14px !important;
    transition:
        border-color .25s ease,
        background .25s ease,
        transform .25s ease,
        box-shadow .25s ease !important;
}

/* Hover на информационния блок */
section.sec:has(.prose) .prose h2 + p:hover {
    background: #ffffff !important;
    border-color: rgba(152, 219, 28, 0.32) !important;
    transform: translateX(3px) !important;
    box-shadow: 0 8px 22px rgba(48, 90, 8, 0.045) !important;
}

/* ==========================================================================
   МАЛЪК GREEN ACCENT ВЪРХУ БЛОКОВЕТЕ
   ========================================================================== */

section.sec:has(.prose) .prose h2 + p::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec:has(.prose) {
        padding: 65px 18px !important;
    }

    section.sec:has(.prose) .prose {
        padding: 30px !important;
        border-radius: 22px !important;
    }

    section.sec:has(.prose) .prose h2 {
        font-size: 21px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec:has(.prose) {
        padding: 55px 15px !important;
    }

    section.sec:has(.prose) h1 {
        font-size: 32px !important;
        letter-spacing: -.8px !important;
    }

    section.sec:has(.prose) > .wrap-n > .lead {
        font-size: 14px !important;
        margin-bottom: 28px !important;
    }

    section.sec:has(.prose) .prose {
        padding: 24px 17px !important;
        border-radius: 19px !important;
    }

    section.sec:has(.prose) .prose h2 {
        font-size: 19px !important;
        padding-left: 14px !important;
    }

    section.sec:has(.prose) .prose h2:not(:first-child) {
        margin-top: 28px !important;
    }

    section.sec:has(.prose) .prose p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.prose) .prose h2 + p {
        padding: 15px 16px !important;
    }

    section.sec:has(.prose) .prose .legal-warn {
        padding: 16px 16px 16px 51px !important;
        margin-bottom: 30px !important;
        font-size: 13px !important;
    }

    section.sec:has(.prose) .prose .legal-warn::before {
        left: 14px !important;
        width: 25px !important;
        height: 25px !important;
    }
}
/*ssl-sertifikati/Какво не значи катинарчето*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАКВО НЕ ЗНАЧИ КАТИНАРЧЕТО"
   ========================================================================== */

/* Основна секция */
#myth {
    position: relative !important;
    background: #ffffff !important;
    padding: 80px 20px !important;
    overflow: hidden !important;
}

/* Лек декоративен зелен фон */
#myth::before {
    content: "" !important;
    position: absolute !important;
    width: 520px !important;
    height: 520px !important;
    left: 50% !important;
    top: 20% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.07) 0%,
        rgba(152, 219, 28, 0.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

#myth .wrap-w {
    position: relative !important;
    z-index: 1 !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

#myth .sl-head {
    max-width: 820px !important;
    margin: 0 auto 45px !important;
    text-align: center !important;
}

#myth .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

#myth .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}


/* Малък зелен акцент */
#myth .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 22px auto 0 !important;
    border-radius: 999px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 14px rgba(152, 219, 28, 0.25) !important;
}


/* ==========================================================================
   ДВЕТЕ КАРТИ
   ========================================================================== */

#myth .sl-myth {
    display: grid !important;
    grid-template-columns: minmax(0,.62fr) minmax(0,.62fr) minmax(0,1.76fr) !important;
    gap: 22px !important;
    align-items: stretch !important;
}


/* Основна карта */
#myth .sl-myth-i {
    position: relative !important;
    overflow: hidden !important;
    padding: 30px !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    box-shadow:
        0 8px 28px rgba(15, 23, 42, 0.05),
        0 2px 6px rgba(15, 23, 42, 0.025) !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease,
        background .3s ease !important;
}


/* Цветна линия отгоре */
#myth .sl-myth-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 4px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #b8ed54
    ) !important;
}


/* Hover */
#myth .sl-myth-i:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow:
        0 20px 45px rgba(15, 23, 42, 0.09),
        0 6px 18px rgba(152, 219, 28, 0.08) !important;
}


/* ==========================================================================
   КАРТА "НЕ"
   ========================================================================== */

#myth .sl-myth-i.no {
    background:
        linear-gradient(
            180deg,
            rgba(249, 250, 251, 0.95) 0%,
            #ffffff 38%
        ) !important;
}

#myth .sl-myth-i.no::before {
    background: linear-gradient(
        90deg,
        #d1d5db,
        #e5e7eb
    ) !important;
}


/* ==========================================================================
   КАРТА "ДА"
   ========================================================================== */

#myth .sl-myth-i.yes {
    border-color: rgba(152, 219, 28, 0.3) !important;
    background:
        linear-gradient(
            180deg,
            rgba(152, 219, 28, 0.055) 0%,
            #ffffff 38%
        ) !important;
}


/* ==========================================================================
   ЗАГЛАВНА ЧАСТ НА КАРТИТЕ
   ========================================================================== */

#myth .sl-myth-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 24px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #edf0f2 !important;
}

#myth .sl-myth-h b {
    color: #111827 !important;
    font-size: 21px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    letter-spacing: -0.35px !important;
}


/* ==========================================================================
   ИКОНКА
   ========================================================================== */

#myth .sl-myth-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 14px !important;

    background: rgba(152, 219, 28, 0.12) !important;
    color: #5f9008 !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

#myth .sl-myth-ic svg {
    width: 22px !important;
    height: 22px !important;
}


/* Иконка при hover */
#myth .sl-myth-i:hover .sl-myth-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}


/* ==========================================================================
   СПИСЪК
   ========================================================================== */

#myth .sl-myth-l {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}


/* Всеки ред */
#myth .sl-myth-l > li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #4b5563 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;

    transition:
        transform .25s ease,
        color .25s ease !important;
}


/* Hover върху ред */
#myth .sl-myth-l > li:hover {
    transform: translateX(4px) !important;
    color: #1f2937 !important;
}


/* ==========================================================================
   ТОЧКИ
   ========================================================================== */

#myth .sl-myth-l > li > i {
    position: relative !important;

    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;

    margin-top: 2px !important;

    border-radius: 50% !important;

    background: rgba(152, 219, 28, 0.12) !important;
    border: 1px solid rgba(152, 219, 28, 0.28) !important;
}


/* Зелен check */
#myth .sl-myth-i.yes .sl-myth-l > li > i::after {
    content: "" !important;

    position: absolute !important;

    width: 7px !important;
    height: 4px !important;

    left: 5px !important;
    top: 5px !important;

    border-left: 2px solid #72a900 !important;
    border-bottom: 2px solid #72a900 !important;

    transform: rotate(-45deg) !important;
}


/* X за "НЕ" */
#myth .sl-myth-i.no .sl-myth-l > li > i {
    background: #f8fafc !important;
    border-color: #e5e7eb !important;
}

#myth .sl-myth-i.no .sl-myth-l > li > i::before,
#myth .sl-myth-i.no .sl-myth-l > li > i::after {
    content: "" !important;
    position: absolute !important;

    width: 8px !important;
    height: 1.5px !important;

    left: 5px !important;
    top: 9px !important;

    background: #9ca3af !important;
    border-radius: 2px !important;
}

#myth .sl-myth-i.no .sl-myth-l > li > i::before {
    transform: rotate(45deg) !important;
}

#myth .sl-myth-i.no .sl-myth-l > li > i::after {
    transform: rotate(-45deg) !important;
}


/* Bold текст */
#myth .sl-myth-l b {
    color: #1f2937 !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   ФИНАЛНО СЪОБЩЕНИЕ
   ========================================================================== */

#myth .sl-myth-end {
    position: relative !important;

    margin-top: 24px !important;
    padding: 20px 24px 20px 27px !important;

    border-radius: 17px !important;

    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;

    color: #6b7280 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;

    box-shadow: 0 5px 18px rgba(15, 23, 42, 0.025) !important;
}


/* Зелената вертикална линия */
#myth .sl-myth-end::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 14px !important;
    bottom: 14px !important;

    width: 4px !important;

    border-radius: 0 5px 5px 0 !important;

    background: #7cbf00 !important;
}


/* Bold във финалния блок */
#myth .sl-myth-end b {
    color: #1f2937 !important;
    font-weight: 800 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    #myth {
        padding: 65px 20px !important;
    }

    #myth .sl-myth {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    #myth .sl-myth-i {
        padding: 26px !important;
    }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    #myth {
        padding: 55px 16px !important;
    }

    #myth .sl-head {
        margin-bottom: 32px !important;
    }

    #myth .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    #myth .sl-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    #myth .sl-myth {
        gap: 15px !important;
    }

    #myth .sl-myth-i {
        padding: 22px 18px !important;
        border-radius: 17px !important;
    }

    #myth .sl-myth-h {
        margin-bottom: 19px !important;
        padding-bottom: 16px !important;
    }

    #myth .sl-myth-ic {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 12px !important;
    }

    #myth .sl-myth-h b {
        font-size: 18px !important;
    }

    #myth .sl-myth-l {
        gap: 12px !important;
    }

    #myth .sl-myth-l > li {
        font-size: 13.5px !important;
        line-height: 1.55 !important;
    }

    #myth .sl-myth-end {
        margin-top: 16px !important;
        padding: 17px 18px 17px 21px !important;
        font-size: 13px !important;
    }

}

/*Безплатен или платен?*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "БЕЗПЛАТЕН ИЛИ ПЛАТЕН?"
   ========================================================================== */

/* Основна секция */
#free {
    position: relative !important;
    background: #ffffff !important;
    padding: 80px 20px !important;
    overflow: hidden !important;
}

#free::before {
    content: "" !important;
    position: absolute !important;
    width: 560px !important;
    height: 560px !important;
    left: 50% !important;
    top: 10% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.07) 0%,
        rgba(152, 219, 28, 0.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

#free .wrap-w {
    position: relative !important;
    z-index: 1 !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

#free .sl-head {
    max-width: 820px !important;
    margin: 0 auto 45px !important;
    text-align: center !important;
}

#free .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

#free .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

#free .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 22px auto 0 !important;
    border-radius: 999px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 14px rgba(152, 219, 28, 0.25) !important;
}


/* ==========================================================================
   КОНТЕЙНЕР НА ТАБЛИЦАТА
   ========================================================================== */

#free .sl-cmp {
    position: relative !important;
    overflow: hidden !important;

    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 26px !important;

    box-shadow:
        0 12px 35px rgba(15, 23, 42, 0.055),
        0 3px 10px rgba(15, 23, 42, 0.025) !important;
}


/* ==========================================================================
   ТАБЛИЦА
   ========================================================================== */

#free .sl-cmp table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 0 !important;
    table-layout: fixed !important;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

#free .sl-cmp thead th {
    padding: 22px 24px !important;

    background: #f8fafc !important;
    color: #374151 !important;

    font-size: 14px !important;
    line-height: 1.4 !important;
    font-weight: 800 !important;

    text-align: center !important;

    border-bottom: 1px solid #e5e7eb !important;
}


/* Първата празна клетка */
#free .sl-cmp thead th:first-child {
    width: 42% !important;
    background: #ffffff !important;
    text-align: left !important;
}


/* Колона "Безплатен" */
#free .sl-cmp thead th.free {
    position: relative !important;

    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,0.13),
            rgba(152,219,28,0.055)
        ) !important;

    color: #305a08 !important;

    border-left: 1px solid rgba(152,219,28,0.18) !important;
    border-right: 1px solid rgba(152,219,28,0.18) !important;
}


/* Малък зелен маркер */
#free .sl-cmp thead th.free::before {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 0 !important;
    transform: translateX(-50%) !important;

    width: 50px !important;
    height: 3px !important;

    background: #7cbf00 !important;
    border-radius: 999px 999px 0 0 !important;
}


/* ==========================================================================
   BODY
   ========================================================================== */

#free .sl-cmp tbody td {
    padding: 18px 24px !important;

    color: #6b7280 !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;

    text-align: center !important;

    border-bottom: 1px solid #f0f2f4 !important;

    background: #ffffff !important;

    transition:
        background .25s ease,
        color .25s ease !important;
}


/* Първа колона */
#free .sl-cmp tbody td:first-child {
    color: #1f2937 !important;
    text-align: left !important;
    font-size: 14px !important;
}


/* Последен ред без линия */
#free .sl-cmp tbody tr:last-child td {
    border-bottom: 0 !important;
}


/* ==========================================================================
   ЗЕЛЕНА КОЛОНА
   ========================================================================== */

#free .sl-cmp tbody td.free {
    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,0.035),
            rgba(152,219,28,0.075),
            rgba(152,219,28,0.035)
        ) !important;

    color: #40552b !important;

    border-left: 1px solid rgba(152,219,28,0.13) !important;
    border-right: 1px solid rgba(152,219,28,0.13) !important;
}


/* ==========================================================================
   HOVER НА РЕД
   ========================================================================== */

#free .sl-cmp tbody tr {
    transition: transform .2s ease !important;
}

#free .sl-cmp tbody tr:hover td {
    background: #fafcf8 !important;
}

#free .sl-cmp tbody tr:hover td.free {
    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,0.06),
            rgba(152,219,28,0.11),
            rgba(152,219,28,0.06)
        ) !important;
}


/* ==========================================================================
   BOLD
   ========================================================================== */

#free .sl-cmp td b {
    color: #111827 !important;
    font-weight: 750 !important;
}

#free .sl-cmp td.free b {
    color: #305a08 !important;
}


/* ==========================================================================
   "ЕДНАКВО" / "ЕДНАКВА" БАЛОНЧЕ
   ========================================================================== */

#free .sl-same {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;

    min-height: 30px !important;
    padding: 5px 11px !important;

    border-radius: 999px !important;

    background: #f0fdf4 !important;
    border: 1px solid rgba(152,219,28,0.32) !important;

    color: #305a08 !important;

    font-size: 12px !important;
    font-weight: 750 !important;
    white-space: nowrap !important;
}


/* Check */
#free .sl-same svg {
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 auto !important;
    color: #6da800 !important;
    stroke-width: 2.5 !important;
}


/* ==========================================================================
   ФИНАЛНО СЪОБЩЕНИЕ
   ========================================================================== */

#free .sl-cmp-after {
    position: relative !important;

    margin-top: 22px !important;
    padding: 20px 24px 20px 28px !important;

    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 17px !important;

    color: #6b7280 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;

    box-shadow:
        0 5px 18px rgba(15,23,42,0.025) !important;
}


/* Зелената линия */
#free .sl-cmp-after::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 14px !important;
    bottom: 14px !important;

    width: 4px !important;

    border-radius: 0 5px 5px 0 !important;
    background: #7cbf00 !important;
}


/* Bold */
#free .sl-cmp-after b {
    color: #1f2937 !important;
    font-weight: 800 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    #free {
        padding: 65px 20px !important;
    }

    #free .sl-cmp {
        border-radius: 20px !important;
        overflow-x: auto !important;
    }

    #free .sl-cmp table {
        min-width: 720px !important;
    }

    #free .sl-cmp thead th,
    #free .sl-cmp tbody td {
        padding: 16px 18px !important;
    }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    #free {
        padding: 55px 16px !important;
    }

    #free .sl-head {
        margin-bottom: 32px !important;
    }

    #free .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -0.7px !important;
    }

    #free .sl-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    #free .sl-cmp {
        border-radius: 17px !important;
    }

    #free .sl-cmp table {
        min-width: 680px !important;
    }

    #free .sl-cmp thead th {
        padding: 17px 14px !important;
        font-size: 12px !important;
    }

    #free .sl-cmp tbody td {
        padding: 15px 14px !important;
        font-size: 12.5px !important;
    }

    #free .sl-cmp tbody td:first-child {
        font-size: 13px !important;
    }

    #free .sl-same {
        font-size: 11px !important;
        padding: 5px 9px !important;
    }

    #free .sl-same svg {
        width: 13px !important;
        height: 13px !important;
    }

    #free .sl-cmp-after {
        margin-top: 16px !important;
        padding: 17px 18px 17px 22px !important;
        font-size: 13px !important;
    }

}

/*Кога и как се подновява*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "КОГА И КАК СЕ ПОДНОВЯВА"
   ========================================================================== */


/* Основна секция */
section.sec.sec-wash {
    position: relative !important;
    padding: 90px 20px !important;
    color: #7cbf00 !important;
    overflow: hidden !important;
}

/* Светлинен ореол */
section.sec.sec-wash::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: 5% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,0.07) 0%,
        rgba(152,219,28,0.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec.sec-wash .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec.sec-wash .sl-head {
    max-width: 760px !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section.sec.sec-wash .sl-head h2 {
    margin: 0 0 15px !important;
    color: #7cbf00 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec.sec-wash .sl-head p {
    margin: 0 !important;
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелената чертичка */
section.sec.sec-wash .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152,219,28,0.45) !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec.sec-wash .sl-renew {
    position: relative !important;
    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #0f140c 100%
        ) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 24px !important;
    padding: 34px !important;
    box-shadow:
        0 25px 60px rgba(0,0,0,0.35),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;
    overflow: hidden !important;
}

/* Светеща линия отгоре */
section.sec.sec-wash .sl-renew::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 8% !important;
    right: 8% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;
    opacity: .75 !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА TIMELINE
   ========================================================================== */

section.sec.sec-wash .sl-renew-h {
    color: #ffffff !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    letter-spacing: -.3px !important;
    margin-bottom: 24px !important;
}

/* ==========================================================================
   TIMELINE
   ========================================================================== */

section.sec.sec-wash .sl-life {
    margin-bottom: 42px !important;
}

/* Лента */
section.sec.sec-wash .sl-life-bar {
    display: flex !important;
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: #0a0e08 !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    box-shadow:
        inset 0 1px 4px rgba(0,0,0,.35),
        0 8px 20px rgba(0,0,0,.2) !important;
}

/* Всички части */
section.sec.sec-wash .sl-life-p {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px 12px !important;
    color: #dfe7d9 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    transition: filter .3s ease, transform .3s ease !important;
}

/* Използван период */
section.sec.sec-wash .sl-life-p.used {
    background: linear-gradient(
        90deg,
        #27301e,
        #323d24
    ) !important;
    color: #aeb8a5 !important;
}

/* Активен период */
section.sec.sec-wash .sl-life-p.act {
    background:
        linear-gradient(
            90deg,
            #76ad15,
            #7cbf00
        ) !important;
    color: #101508 !important;
    box-shadow:
        0 0 25px rgba(152,219,28,.15) !important;
}

/* Запас */
section.sec.sec-wash .sl-life-p.left {
    background: #171d12 !important;
    color: #727b6b !important;
}

/* Hover върху сегмент */
section.sec.sec-wash .sl-life-p:hover {
    filter: brightness(1.12) !important;
}

/* Маркери */
section.sec.sec-wash .sl-life-marks {
    display: flex !important;
    justify-content: space-between !important;
    margin-top: 10px !important;
    padding: 0 4px !important;
    color: #687162 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

/* ==========================================================================
   СТЪПКИ
   ========================================================================== */

section.sec.sec-wash .sl-renew-l {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

/* Вертикална линия */
section.sec.sec-wash .sl-renew-l::before {
    content: "" !important;
    position: absolute !important;
    left: 53px !important;
    top: 20px !important;
    bottom: 20px !important;
    width: 1px !important;
    background: linear-gradient(
        180deg,
        rgba(152,219,28,.45),
        rgba(255,255,255,.07),
        rgba(152,219,28,.15)
    ) !important;
}

/* Всеки ред */
section.sec.sec-wash .sl-renew-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 82px minmax(0,1fr) !important;
    align-items: center !important;
    gap: 20px !important;
    padding: 17px 18px !important;
    background: rgba(255,255,255,.025) !important;
    border: 1px solid rgba(255,255,255,.055) !important;
    border-radius: 14px !important;
    transition:
        transform .3s ease,
        background .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Hover */
section.sec.sec-wash .sl-renew-r:hover {
    transform: translateX(5px) !important;
    background: rgba(152,219,28,.045) !important;
    border-color: rgba(152,219,28,.22) !important;
    box-shadow:
        0 12px 30px rgba(0,0,0,.22),
        0 0 20px rgba(152,219,28,.035) !important;
}

/* ==========================================================================
   ДАТА / ДЕН
   ========================================================================== */

section.sec.sec-wash .sl-renew-d {
    position: relative !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 32px !important;
    padding: 6px 9px !important;
    border-radius: 999px !important;
    background: rgba(152,219,28,.10) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    color: #7cbf00 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec.sec-wash .sl-renew-t {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
}

section.sec.sec-wash .sl-renew-t b {
    color: #f3f6ef !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

section.sec.sec-wash .sl-renew-t span {
    color: #8d9788 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   ФИНАЛНО ПОСЛАНИЕ
   ========================================================================== */

section.sec.sec-wash .sl-renew-end {
    position: relative !important;
    margin-top: 28px !important;
    padding: 20px 22px 20px 25px !important;
    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,.08),
            rgba(152,219,28,.025)
        ) !important;
    border: 1px solid rgba(152,219,28,.16) !important;
    border-radius: 14px !important;
    color: #9ca694 !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* Зелената линия */
section.sec.sec-wash .sl-renew-end::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 13px !important;
    bottom: 13px !important;
    width: 3px !important;
    border-radius: 5px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 12px rgba(152,219,28,.35) !important;
}

section.sec.sec-wash .sl-renew-end b {
    color: #dce6d5 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec.sec-wash {
        padding: 70px 18px !important;
    }

    section.sec.sec-wash .sl-renew {
        padding: 26px !important;
    }

    section.sec.sec-wash .sl-renew-r {
        grid-template-columns: 72px minmax(0,1fr) !important;
        gap: 16px !important;
    }

    section.sec.sec-wash .sl-renew-l::before {
        left: 47px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec.sec-wash {
        padding: 60px 14px !important;
    }

    section.sec.sec-wash .sl-head {
        margin-bottom: 35px !important;
    }

    section.sec.sec-wash .sl-head h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    section.sec.sec-wash .sl-head p {
        font-size: 14px !important;
    }

    section.sec.sec-wash .sl-renew {
        padding: 21px 17px !important;
        border-radius: 18px !important;
    }

    section.sec.sec-wash .sl-renew-h {
        font-size: 16px !important;
        margin-bottom: 20px !important;
    }

    /* Timeline на мобилен */
    section.sec.sec-wash .sl-life-bar {
        min-height: 42px !important;
    }

    section.sec.sec-wash .sl-life-p {
        font-size: 9px !important;
        padding: 7px 5px !important;
    }

    section.sec.sec-wash .sl-life-marks {
        font-size: 9px !important;
    }

    /* Стъпките стават вертикални */
    section.sec.sec-wash .sl-renew-l {
        gap: 10px !important;
    }

    section.sec.sec-wash .sl-renew-l::before {
        display: none !important;
    }

    section.sec.sec-wash .sl-renew-r {
        grid-template-columns: 1fr !important;
        gap: 9px !important;
        padding: 17px !important;
        border-radius: 13px !important;
    }

    section.sec.sec-wash .sl-renew-r:hover {
        transform: translateY(-3px) !important;
    }

    section.sec.sec-wash .sl-renew-d {
        width: fit-content !important;
    }

    section.sec.sec-wash .sl-renew-t b {
        font-size: 13px !important;
    }

    section.sec.sec-wash .sl-renew-t span {
        font-size: 11.5px !important;
    }

    section.sec.sec-wash .sl-renew-end {
        margin-top: 20px !important;
        padding: 17px 17px 17px 21px !important;
        font-size: 12px !important;
    }
}

/*Трите чести проблема*/

 /* ==========================================================================
    СВЕТЪЛ PREMIUM ДИЗАЙН — "ТРИТЕ ЧЕСТИ ПРОБЛЕМА"
    ========================================================================== */

/* Основна секция */
section.sec:has(.sl-probs) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен фон */
section.sec:has(.sl-probs)::before {
    content: "" !important;
    position: absolute !important;
    width: 650px !important;
    height: 650px !important;
    left: 50% !important;
    top: 0 !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-probs) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-probs) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-probs) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-probs) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.sl-probs) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   СПИСЪК С ПРОБЛЕМИ
   ========================================================================== */

section.sec:has(.sl-probs) .sl-probs {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
}

/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Зелената линия отгоре */
section.sec:has(.sl-probs) .sl-prob::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
    opacity: .7 !important;
}

/* Hover */
section.sec:has(.sl-probs) .sl-prob:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(105,201,14,.45) !important;
    box-shadow:
        0 18px 40px rgba(15,23,42,.08),
        0 5px 18px rgba(152,219,28,.07) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА ПРОБЛЕМА
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob-q {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 24px 26px !important;
    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.045),
            rgba(255,255,255,0)
        ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* Икона */
section.sec:has(.sl-probs) .sl-prob-ic {
    width: 45px !important;
    height: 45px !important;
    min-width: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.12) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #5f9008 !important;
    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.sl-probs) .sl-prob-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Hover икона */
section.sec:has(.sl-probs) .sl-prob:hover .sl-prob-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}

/* Заглавие */
section.sec:has(.sl-probs) .sl-prob-q > b {
    color: #172000 !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ОТГОВОР
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob-a {
    padding: 24px 26px 27px !important;
    background: #ffffff !important;
}

/* Параграфи */
section.sec:has(.sl-probs) .sl-prob-a p {
    margin: 0 0 13px !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

section.sec:has(.sl-probs) .sl-prob-a p:last-child {
    margin-bottom: 0 !important;
}

/* Bold */
section.sec:has(.sl-probs) .sl-prob-a b {
    color: #26351a !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   CODE БЛОК
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob-code {
    margin: 20px 0 !important;
    padding: 17px 19px !important;
    background: #f7faf4 !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    border-left: 3px solid #7cbf00 !important;
    border-radius: 12px !important;
    color: #596273 !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        "Liberation Mono",
        monospace !important;
    font-size: 12px !important;
    line-height: 1.8 !important;
    overflow-x: auto !important;
    box-shadow:
        inset 0 1px 2px rgba(15,23,42,.025) !important;
}

/* http */
section.sec:has(.sl-probs) .sl-prob-code b {
    color: #dc2626 !important;
    font-weight: 800 !important;
}

/* https */
section.sec:has(.sl-probs) .sl-prob-code br + * {
    color: inherit !important;
}

/* Последното https чрез контекст */
section.sec:has(.sl-probs) .sl-prob-code b:not(:first-of-type) {
    color: #5f9008 !important;
}

/* ==========================================================================
   РАЗЛИЧЕН АКЦЕНТ ЗА ВСЕКИ ПРОБЛЕМ
   ========================================================================== */

section.sec:has(.sl-probs) .sl-prob:nth-child(1) .sl-prob-ic {
    color: #b45309 !important;
    background: rgba(245,158,11,.10) !important;
    border-color: rgba(245,158,11,.22) !important;
}

section.sec:has(.sl-probs) .sl-prob:nth-child(1):hover .sl-prob-ic {
    background: #f59e0b !important;
    color: #ffffff !important;
}

section.sec:has(.sl-probs) .sl-prob:nth-child(2) .sl-prob-ic {
    color: #5f9008 !important;
}

section.sec:has(.sl-probs) .sl-prob:nth-child(3) .sl-prob-ic {
    color: #2563a8 !important;
    background: rgba(59,130,246,.09) !important;
    border-color: rgba(59,130,246,.20) !important;
}

section.sec:has(.sl-probs) .sl-prob:nth-child(3):hover .sl-prob-ic {
    background: #3b82f6 !important;
    color: #ffffff !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-probs) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-probs) .sl-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-q {
        padding: 21px 22px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-a {
        padding: 21px 22px 24px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-probs) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-probs) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-probs) .sl-head p {
        font-size: 14px !important;
    }

    section.sec:has(.sl-probs) .sl-probs {
        gap: 14px !important;
    }

    section.sec:has(.sl-probs) .sl-prob {
        border-radius: 16px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-q {
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-q > b {
        font-size: 14px !important;
        line-height: 1.45 !important;
        padding-top: 3px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-a {
        padding: 19px 17px 21px !important;
    }

    section.sec:has(.sl-probs) .sl-prob-a p {
        font-size: 13px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-probs) .sl-prob-code {
        padding: 14px !important;
        margin: 17px 0 !important;
        font-size: 10.5px !important;
        line-height: 1.75 !important;
    }
}

/* Намалено движение за потребители, които го предпочитат */
@media (prefers-reduced-motion: reduce) {
    section.sec:has(.sl-probs) .sl-prob,
    section.sec:has(.sl-probs) .sl-prob-ic {
        transition: none !important;
    }

    section.sec:has(.sl-probs) .sl-prob:hover {
        transform: none !important;
    }
}

/*Трите вида, без жаргон*/

 /* ==========================================================================
    ТЪМЕН PREMIUM ДИЗАЙН — "ТРИТЕ ВИДА, БЕЗ ЖАРГОН"
    ========================================================================== */

/* Основна секция */
section.sec.sec-wash:has(.sl-kinds) {
    position: relative !important;
    background: #0b0f08 !important;
    padding: 90px 20px !important;
    color: #f5f7f2 !important;
    overflow: hidden !important;
}

/* Фонов светлинен ефект */
section.sec.sec-wash:has(.sl-kinds)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: 5% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec.sec-wash:has(.sl-kinds) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 52px !important;
    text-align: center !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-head h2 {
    margin: 0 0 15px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-head p {
    margin: 0 !important;
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Акцент */
section.sec.sec-wash:has(.sl-kinds) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152,219,28,.45) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kinds {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #10140d 100%
        ) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 20px !important;
    padding: 28px !important;
    overflow: hidden !important;
    box-shadow:
        0 20px 45px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.025) !important;
    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease !important;
}

/* Горна светлинна линия */
section.sec.sec-wash:has(.sl-kinds) .sl-kind::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 8% !important;
    right: 8% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,.35),
        transparent
    ) !important;
    opacity: 0 !important;
    transition: opacity .3s ease !important;
}

/* Hover */
section.sec.sec-wash:has(.sl-kinds) .sl-kind:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(152,219,28,.30) !important;
    background:
        linear-gradient(
            145deg,
            #192011 0%,
            #11170d 100%
        ) !important;
    box-shadow:
        0 28px 55px rgba(0,0,0,.38),
        0 0 30px rgba(152,219,28,.055) !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind:hover::before {
    opacity: 1 !important;
}

/* ==========================================================================
   КАРТА "ТВОЯТ DV"
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours {
    border-color: rgba(152,219,28,.50) !important;
    background:
        linear-gradient(
            145deg,
            #18200f 0%,
            #10150c 100%
        ) !important;
    box-shadow:
        0 24px 55px rgba(0,0,0,.36),
        0 0 35px rgba(152,219,28,.07),
        inset 0 1px 0 rgba(152,219,28,.07) !important;
    transform: translateY(-5px) !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours::before {
    opacity: 1 !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours:hover {
    transform: translateY(-10px) !important;
    border-color: #7cbf00 !important;
    box-shadow:
        0 30px 65px rgba(0,0,0,.42),
        0 0 42px rgba(152,219,28,.12) !important;
}

/* ==========================================================================
   ГОРНА ЧАСТ
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind-top {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 22px !important;
}

/* DV / OV / EV badge */
section.sec.sec-wash:has(.sl-kinds) .sl-kind-tag {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 45px !important;
    height: 32px !important;
    padding: 0 11px !important;
    border-radius: 9px !important;
    background: rgba(152,219,28,.11) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #7cbf00 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    letter-spacing: .8px !important;
}

/* Заглавие */
section.sec.sec-wash:has(.sl-kinds) .sl-kind-top > b {
    color: #f4f7f0 !important;
    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ОСНОВЕН ТЕКСТ
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind-what {
    margin: 0 !important;
    color: #9ba596 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    flex-grow: 1 !important;
}

/* ==========================================================================
   ДОЛЕН INFO БЛОК
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind-check {
    position: relative !important;
    margin-top: 24px !important;
    padding: 15px 16px 15px 19px !important;
    background: rgba(255,255,255,.035) !important;
    border: 1px solid rgba(255,255,255,.065) !important;
    border-radius: 12px !important;
    color: #7f8979 !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
}

/* Акцентна линия */
section.sec.sec-wash:has(.sl-kinds) .sl-kind-check::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 11px !important;
    bottom: 11px !important;
    width: 3px !important;
    border-radius: 5px !important;
    background: rgba(152,219,28,.55) !important;
}

/* Bold */
section.sec.sec-wash:has(.sl-kinds) .sl-kind-check b {
    color: #7cbf00 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   РАЗЛИЧАВАНЕ НА OV / EV
   ========================================================================== */

section.sec.sec-wash:has(.sl-kinds) .sl-kind:not(.is-yours) .sl-kind-tag {
    background: rgba(255,255,255,.045) !important;
    border-color: rgba(255,255,255,.10) !important;
    color: #aeb7a8 !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind:not(.is-yours) .sl-kind-check {
    background: rgba(255,255,255,.025) !important;
}

section.sec.sec-wash:has(.sl-kinds) .sl-kind:not(.is-yours) .sl-kind-check b {
    color: #d2dacd !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec.sec-wash:has(.sl-kinds) {
        padding: 70px 18px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kinds {
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours {
        transform: none !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours:hover {
        transform: translateY(-7px) !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind:last-child {
        grid-column: 1 / -1 !important;
        max-width: calc(50% - 10px) !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 620px) {

    section.sec.sec-wash:has(.sl-kinds) {
        padding: 60px 14px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-head {
        margin-bottom: 36px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-head p {
        font-size: 14px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kinds {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind {
        padding: 23px 19px !important;
        border-radius: 16px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours {
        transform: none !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours:hover,
    section.sec.sec-wash:has(.sl-kinds) .sl-kind:hover {
        transform: translateY(-4px) !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind:last-child {
        grid-column: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-top {
        margin-bottom: 18px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-tag {
        min-width: 42px !important;
        height: 30px !important;
        font-size: 11px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-top > b {
        font-size: 15px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-what {
        font-size: 13px !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind-check {
        margin-top: 20px !important;
        padding: 14px 14px 14px 18px !important;
        font-size: 11.5px !important;
    }
}

/* Намалено движение */
@media (prefers-reduced-motion: reduce) {
    section.sec.sec-wash:has(.sl-kinds) .sl-kind {
        transition: none !important;
    }

    section.sec.sec-wash:has(.sl-kinds) .sl-kind:hover,
    section.sec.sec-wash:has(.sl-kinds) .sl-kind.is-yours:hover {
        transform: none !important;
    }
}
/*faq*/


/* ==========================================================================
   FAQ — СВЕТЪЛ PREMIUM ДИЗАЙН
   Работи директно с .sl-faq структурата
   ========================================================================== */

/* FAQ GRID */
.sl-faq {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-top: 40px !important;
    align-items: start !important;
}

/* ==========================================================================
   FAQ КАРТА
   ========================================================================== */

.sl-faq-i {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.24) !important;
    border-radius: 20px !important;
    padding: 24px 26px !important;
    overflow: hidden !important;
    cursor: pointer !important;

    box-shadow:
        0 4px 16px rgba(48, 90, 8, 0.035),
        0 1px 2px rgba(0, 0, 0, 0.02) !important;

    transition:
        transform .28s cubic-bezier(.2,.9,.2,1),
        box-shadow .28s ease,
        border-color .28s ease,
        background .28s ease !important;
}

/* Лека зелена линия отгоре */
.sl-faq-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 2px !important;

    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;

    opacity: 0 !important;
    transition: opacity .3s ease !important;
}

/* Hover */
.sl-faq-i:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(105, 201, 14, 0.5) !important;

    box-shadow:
        0 16px 34px rgba(48, 90, 8, 0.09),
        0 0 25px rgba(152, 219, 28, 0.045) !important;
}

.sl-faq-i:hover::before {
    opacity: 1 !important;
}

/* Отворена карта */
.sl-faq-i.is-open {
    border-color: rgba(105, 201, 14, 0.5) !important;
    box-shadow:
        0 12px 30px rgba(48, 90, 8, 0.075),
        0 0 25px rgba(152, 219, 28, 0.05) !important;
}

.sl-faq-i.is-open::before {
    opacity: 1 !important;
}

/* ==========================================================================
   BADGE
   ========================================================================== */

.sl-faq-i .sl-faq-n {
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;

    margin-bottom: 12px !important;
    padding: 5px 11px !important;

    border-radius: 999px !important;

    background: rgba(183, 255, 53, 0.16) !important;
    border: 1px solid rgba(152, 219, 28, 0.28) !important;

    color: #305a08 !important;

    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    letter-spacing: .6px !important;
}

/* ==========================================================================
   ВЪПРОС
   ========================================================================== */

.sl-faq-i h3 {
    position: relative !important;

    margin: 0 !important;
    padding: 0 34px 0 0 !important;

    color: #1a2e05 !important;

    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
    letter-spacing: -.2px !important;
}

/* Плюс */
.sl-faq-i h3::after {
    content: "+" !important;

    position: absolute !important;
    right: 0 !important;
    top: 50% !important;

    width: 27px !important;
    height: 27px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    transform: translateY(-50%) !important;

    border-radius: 50% !important;
    background: #f3fae9 !important;
    border: 1px solid rgba(152, 219, 28, 0.3) !important;

    color: #4d790d !important;

    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease !important;
}

/* При отваряне */
.sl-faq-i.is-open h3::after {
    transform: translateY(-50%) rotate(45deg) !important;
    background: #7cbf00 !important;
    color: #172306 !important;
}

/* ==========================================================================
   ОТГОВОР
   ========================================================================== */

.sl-faq-i p {
    max-height: 0 !important;
    overflow: hidden !important;

    opacity: 0 !important;

    margin: 0 !important;

    color: #526247 !important;

    font-size: 14px !important;
    line-height: 1.7 !important;

    transition:
        max-height .45s cubic-bezier(.2,.9,.2,1),
        opacity .3s ease,
        margin-top .3s ease !important;
}

/* Отворен отговор */
.sl-faq-i.is-open p {
    max-height: 500px !important;
    opacity: 1 !important;
    margin-top: 16px !important;
}

/* Bold в отговора */
.sl-faq-i p b {
    color: #243b0a !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   HEADER НА СЕКЦИЯТА
   ========================================================================== */

.sl-head {
    max-width: 760px !important;
    margin: 0 auto 10px !important;
}

.sl-head h2 {
    color: #172306 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin: 0 0 14px !important;
}

.sl-head p {
    color: #66745d !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* Зелен акцент под заглавието */
.sl-head::after {
    content: "" !important;
    display: block !important;

    width: 44px !important;
    height: 3px !important;

    margin-top: 22px !important;

    background: #7cbf00 !important;
    border-radius: 99px !important;

    box-shadow: 0 0 16px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   СЕКЦИЯ
   ========================================================================== */

section.sec:has(.sl-faq) {
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152, 219, 28, 0.045),
            transparent 45%
        ),
        #ffffff !important;

    padding: 85px 20px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .sl-faq {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    .sl-faq-i {
        padding: 22px 23px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.sl-faq) {
        padding: 60px 16px !important;
    }

    .sl-head {
        margin-bottom: 8px !important;
    }

    .sl-head h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    .sl-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    .sl-faq {
        margin-top: 32px !important;
        gap: 12px !important;
    }

    .sl-faq-i {
        padding: 20px !important;
        border-radius: 17px !important;
    }

    .sl-faq-i h3 {
        font-size: 16px !important;
        line-height: 1.4 !important;
        padding-right: 38px !important;
    }

    .sl-faq-i p {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
    }

    .sl-faq-i .sl-faq-n {
        font-size: 10px !important;
        padding: 5px 9px !important;
    }
}

/*Кога платеният има смисъл*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КОГА ПЛАТЕНИЯТ ИМА СМИСЪЛ"
   ========================================================================== */

/* Секция */
section.sec:has(.sl-when) {
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152, 219, 28, 0.045),
            transparent 48%
        ),
        #ffffff !important;

    padding: 85px 20px !important;
    overflow: hidden !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.sl-when) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 45px !important;
}

section.sec:has(.sl-when) .sl-head h2 {
    color: #172306 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin: 0 0 14px !important;
}

section.sec:has(.sl-when) .sl-head p {
    color: #66745d !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* Зелен акцент */
section.sec:has(.sl-when) .sl-head::after {
    content: "" !important;
    display: block !important;

    width: 44px !important;
    height: 3px !important;

    margin-top: 22px !important;

    background: #7cbf00 !important;
    border-radius: 999px !important;

    box-shadow: 0 0 16px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

.sl-when {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

.sl-when-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 22px !important;

    padding: 28px !important;

    overflow: hidden !important;

    box-shadow:
        0 5px 18px rgba(48, 90, 8, 0.035),
        0 1px 2px rgba(0, 0, 0, 0.02) !important;

    transition:
        transform .3s cubic-bezier(.2,.9,.2,1),
        box-shadow .3s ease,
        border-color .3s ease,
        background .3s ease !important;
}

/* Светеща линия отгоре */
.sl-when-i::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            #7cbf00,
            transparent
        ) !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}

/* Hover */
.sl-when-i:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(105, 201, 14, 0.5) !important;

    background: #ffffff !important;

    box-shadow:
        0 18px 38px rgba(48, 90, 8, 0.09),
        0 0 28px rgba(152, 219, 28, 0.05) !important;
}

.sl-when-i:hover::before {
    opacity: 1 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

.sl-when-ic {
    width: 50px !important;
    height: 50px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 auto !important;

    margin-bottom: 20px !important;

    border-radius: 15px !important;

    background:
        linear-gradient(
            135deg,
            #f1fbe6,
            #e9f8d8
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.3) !important;

    color: #4d790d !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.8),
        0 5px 12px rgba(105, 201, 14, 0.06) !important;

    transition:
        transform .3s ease,
        background .3s ease !important;
}

.sl-when-i:hover .sl-when-ic {
    transform: translateY(-2px) scale(1.04) !important;

    background:
        linear-gradient(
            135deg,
            #7cbf00,
            #b1ed45
        ) !important;

    color: #172306 !important;
}

.sl-when-ic svg {
    width: 23px !important;
    height: 23px !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

.sl-when-i > b {
    display: block !important;

    color: #1a2e05 !important;

    font-size: 18px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;

    margin: 0 0 10px !important;

    letter-spacing: -.2px !important;
}

/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

.sl-when-i > p {
    color: #617057 !important;

    font-size: 14px !important;
    line-height: 1.7 !important;

    margin: 0 !important;
}

/* ==========================================================================
   NOTE
   ========================================================================== */

.sl-when-note {
    max-width: 850px !important;

    margin: 30px auto 0 !important;
    padding: 19px 23px !important;

    text-align: center !important;

    background: #f6fbeF !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 16px !important;

    color: #526247 !important;

    font-size: 14px !important;
    line-height: 1.6 !important;

    box-shadow:
        0 4px 15px rgba(48, 90, 8, 0.025) !important;
}

.sl-when-note b {
    color: #305a08 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.sl-when) {
        padding: 70px 20px !important;
    }

    .sl-when {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .sl-when-i {
        padding: 24px !important;
    }

    .sl-when-i:last-child {
        grid-column: 1 / -1 !important;
        max-width: calc(50% - 8px) !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.sl-when) {
        padding: 60px 16px !important;
    }

    section.sec:has(.sl-when) .sl-head {
        margin-bottom: 32px !important;
    }

    section.sec:has(.sl-when) .sl-head h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-when) .sl-head p {
        font-size: 14px !important;
    }

    .sl-when {
        grid-template-columns: 1fr !important;
        gap: 13px !important;
    }

    .sl-when-i {
        padding: 22px !important;
        border-radius: 18px !important;
    }

    .sl-when-i:last-child {
        grid-column: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    .sl-when-ic {
        width: 46px !important;
        height: 46px !important;
        border-radius: 13px !important;
        margin-bottom: 17px !important;
    }

    .sl-when-i > b {
        font-size: 17px !important;
    }

    .sl-when-i > p {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
    }

    .sl-when-note {
        margin-top: 22px !important;
        padding: 17px 18px !important;
        font-size: 13px !important;
        border-radius: 14px !important;
    }
}

/*ddos-zashtita/Атака ли е, или просто е бавно?*/

/* ==========================================================================
   СВЕТЪЛ ДИЗАЙН — "АТАКА ЛИ Е, ИЛИ ПРОСТО Е БАВНО?"
   ========================================================================== */

section#tell {
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #17200f !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Лек зелен glow */
section#tell::before {
    content: "" !important;
    position: absolute !important;
    width: 560px !important;
    height: 560px !important;
    left: 50% !important;
    top: 10% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.07) 0%,
        rgba(152, 219, 28, 0.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

section#tell .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: none !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section#tell .dd-head {
    max-width: none !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section#tell .dd-head h2 {
    margin: 0 0 14px !important;
    color: #17200f !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section#tell .dd-head p {
    margin: 0 !important;
    color: #65705c !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}

/* Зелената чертичка */
section#tell .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 22px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   ДВЕТЕ ОСНОВНИ КАРТИ
   ========================================================================== */

section#tell .dd-tell {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;
    align-items: stretch !important;
}

section#tell .dd-tell-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 30px !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    border: 1px solid #e5eadf !important;
    box-shadow:
        0 8px 25px rgba(48, 90, 8, 0.045),
        0 2px 5px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Горна зелена линия */
section#tell .dd-tell-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;
    opacity: .55 !important;
}

/* Hover */
section#tell .dd-tell-i:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(152, 219, 28, 0.55) !important;
    box-shadow:
        0 18px 38px rgba(48, 90, 8, 0.10),
        0 0 25px rgba(152, 219, 28, 0.05) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section#tell .dd-tell-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 24px !important;
}

section#tell .dd-tell-h b {
    color: #17200f !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
}

/* Иконка */
section#tell .dd-tell-ic {
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    background: #f1f9e8 !important;
    border: 1px solid rgba(152, 219, 28, 0.30) !important;
    color: #4f790d !important;
}

section#tell .dd-tell-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section#tell .dd-tell-l {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

section#tell .dd-tell-l li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 11px !important;
    color: #52604a !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

section#tell .dd-tell-l li b {
    color: #253718 !important;
    font-weight: 750 !important;
}

/* Малката точка */
section#tell .dd-tell-l li i {
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    flex: 0 0 7px !important;
    margin-top: 7px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 0 4px rgba(152, 219, 28, 0.10) !important;
}

/* ==========================================================================
   ДОЛЕН БЛОК "АКО Е ТОВА"
   ========================================================================== */

section#tell .dd-tell-what {
    margin-top: auto !important;
    padding: 17px 18px !important;
    margin-top: 27px !important;
    border-radius: 14px !important;
    background: #f6faef !important;
    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    color: #5b6753 !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
}

section#tell .dd-tell-what b {
    color: #365d08 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ЛЕКО РАЗЛИЧИЕ МЕЖДУ ДВАТА ТИПА
   ========================================================================== */

/* Атака */
section#tell .dd-tell-i.attack {
    border-color: rgba(152, 219, 28, 0.30) !important;
}

section#tell .dd-tell-i.attack .dd-tell-ic {
    background: #fff8ed !important;
    color: #b56b0b !important;
    border-color: rgba(245, 158, 11, 0.22) !important;
}

section#tell .dd-tell-i.attack .dd-tell-l li i {
    background: #f59e0b !important;
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.10) !important;
}

/* Бавно */
section#tell .dd-tell-i.slow .dd-tell-ic {
    background: #f1f9e8 !important;
    color: #4f790d !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {
    section#tell {
        padding: 70px 20px !important;
    }

    section#tell .dd-tell {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    section#tell .dd-tell-i {
        padding: 27px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    section#tell {
        padding: 60px 16px !important;
    }

    section#tell .dd-head {
        margin-bottom: 35px !important;
    }

    section#tell .dd-head h2 {
        font-size: 29px !important;
        letter-spacing: -.6px !important;
    }

    section#tell .dd-head p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    section#tell .dd-tell {
        gap: 15px !important;
    }

    section#tell .dd-tell-i {
        padding: 23px 20px !important;
        border-radius: 18px !important;
    }

    section#tell .dd-tell-h {
        gap: 11px !important;
        margin-bottom: 20px !important;
    }

    section#tell .dd-tell-h b {
        font-size: 17px !important;
    }

    section#tell .dd-tell-ic {
        width: 42px !important;
        height: 42px !important;
        flex-basis: 42px !important;
        border-radius: 12px !important;
    }

    section#tell .dd-tell-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section#tell .dd-tell-l {
        gap: 12px !important;
    }

    section#tell .dd-tell-l li {
        font-size: 13px !important;
    }

    section#tell .dd-tell-what {
        font-size: 12.5px !important;
        padding: 15px !important;
        border-radius: 12px !important;
    }
}
/*Къде спира какво*/


/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "КЪДЕ СПИРА КАКВО"
   ========================================================================== */

section.sec-wash:has(.dd-layers) {
    position: relative !important;
    background: #0b0f08 !important;
    color: #f5f7f2 !important;
    padding: 90px 20px !important;
    overflow: hidden !important;
}

/* Зелен атмосферен glow */
section.sec-wash:has(.dd-layers)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: 10% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152, 219, 28, 0.075) 0%,
        rgba(152, 219, 28, 0.025) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

section.sec-wash:has(.dd-layers) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-head {
    max-width: 780px !important;
    margin: 0 auto 52px !important;
    text-align: center !important;
}

section.sec-wash:has(.dd-layers) .dd-head h2 {
    margin: 0 0 14px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec-wash:has(.dd-layers) .dd-head p {
    margin: 0 !important;
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}

/* Акцент */
section.sec-wash:has(.dd-layers) .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 20px rgba(152, 219, 28, .45) !important;
}

/* ==========================================================================
   ОСНОВЕН FLOW КОНТЕЙНЕР
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layers {
    position: relative !important;
    background:
        linear-gradient(
            145deg,
            #151a11 0%,
            #0f140c 100%
        ) !important;
    border: 1px solid rgba(255,255,255,.075) !important;
    border-radius: 24px !important;
    padding: 30px !important;
    box-shadow:
        0 25px 60px rgba(0,0,0,.35),
        inset 0 1px 0 rgba(255,255,255,.025) !important;
    overflow: hidden !important;
}

/* Горна светлинна линия */
section.sec-wash:has(.dd-layers) .dd-layers::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 8% !important;
    right: 8% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,.7),
        transparent
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА FLOW
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layers-h {
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: -.1px !important;
    padding: 4px 4px 24px !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
}

/* ==========================================================================
   ЕДИНИЧЕН LAYER
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layer {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) 115px !important;
    align-items: center !important;
    gap: 20px !important;
    min-height: 105px !important;
    padding: 20px 4px !important;
    border-bottom: 1px solid rgba(255,255,255,.055) !important;
    transition:
        background .25s ease,
        padding .25s ease !important;
}

/* Hover ред */
section.sec-wash:has(.dd-layers) .dd-layer:hover {
    background: rgba(152,219,28,.025) !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* ==========================================================================
   НОМЕР
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layer-n {
    position: relative !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.10) !important;
    border: 1px solid rgba(152,219,28,.30) !important;
    color: #7cbf00 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    box-shadow:
        0 0 20px rgba(152,219,28,.05),
        inset 0 1px 0 rgba(255,255,255,.04) !important;
}

/* Вертикална линия между стъпките */
section.sec-wash:has(.dd-layers) .dd-layer:not(:last-of-type) .dd-layer-n::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: calc(100% + 1px) !important;
    width: 1px !important;
    height: 42px !important;
    transform: translateX(-50%) !important;
    background: linear-gradient(
        to bottom,
        rgba(152,219,28,.35),
        rgba(152,219,28,.04)
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layer-t {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    min-width: 0 !important;
}

section.sec-wash:has(.dd-layers) .dd-layer-t b {
    color: #f5f7f2 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

section.sec-wash:has(.dd-layers) .dd-layer-t span {
    color: #899184 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* ==========================================================================
   КОЛИЧЕСТВО ОТСТРАНЕН ТРАФИК
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layer-cut {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 3px !important;
    text-align: right !important;
    padding-left: 10px !important;
}

section.sec-wash:has(.dd-layers) .dd-layer-cut b {
    color: #7cbf00 !important;
    font-size: 18px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

section.sec-wash:has(.dd-layers) .dd-layer-cut span {
    color: #687063 !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: .7px !important;
    font-weight: 700 !important;
}

/* Последният ред */
section.sec-wash:has(.dd-layers) .dd-layer:last-of-type {
    border-bottom: 0 !important;
}

section.sec-wash:has(.dd-layers) .dd-layer:last-of-type .dd-layer-cut b {
    color: #ffffff !important;
}

/* ==========================================================================
   ФИНАЛЕН РЕЗУЛТАТ
   ========================================================================== */

section.sec-wash:has(.dd-layers) .dd-layers-end {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin-top: 18px !important;
    padding: 20px !important;
    border-radius: 15px !important;
    background:
        linear-gradient(
            135deg,
            rgba(152,219,28,.10),
            rgba(152,219,28,.035)
        ) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    color: #8f9888 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

section.sec-wash:has(.dd-layers) .dd-layers-end b {
    flex: 0 0 auto !important;
    color: #7cbf00 !important;
    font-size: 27px !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    letter-spacing: -1px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {
    section.sec-wash:has(.dd-layers) {
        padding: 70px 20px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers {
        padding: 24px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer {
        grid-template-columns: 42px minmax(0, 1fr) 95px !important;
        gap: 15px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {
    section.sec-wash:has(.dd-layers) {
        padding: 60px 16px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-head {
        margin-bottom: 35px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-head h2 {
        font-size: 29px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-head p {
        font-size: 14px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers {
        padding: 20px 16px !important;
        border-radius: 19px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers-h {
        padding-bottom: 20px !important;
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer {
        grid-template-columns: 38px minmax(0, 1fr) !important;
        gap: 13px !important;
        padding: 18px 0 !important;
        min-height: auto !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-n {
        width: 36px !important;
        height: 36px !important;
        border-radius: 11px !important;
        font-size: 13px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-t b {
        font-size: 14px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-t span {
        font-size: 12px !important;
        line-height: 1.5 !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-cut {
        grid-column: 2 !important;
        align-items: flex-start !important;
        text-align: left !important;
        padding: 10px 0 0 !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-cut b {
        font-size: 16px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-cut span {
        font-size: 9px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layer-n::after {
        height: 70px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers-end {
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 17px !important;
        font-size: 12px !important;
    }

    section.sec-wash:has(.dd-layers) .dd-layers-end b {
        font-size: 23px !important;
    }
}


/*Как изглежда отвътре*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАК ИЗГЛЕЖДА ОТВЪТРЕ"
   ========================================================================== */

section.sec:has(.dd-att) {
    background: #f7f9f4 !important;
    padding: 90px 20px !important;
    color: #1a2e05 !important;
    overflow: hidden !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.dd-att) .dd-head {
    text-align: center !important;
    max-width: 760px !important;
    margin: 0 auto 55px !important;
}

section.sec:has(.dd-att) .dd-head h2 {
    color: #172505 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin: 0 0 15px !important;
}

section.sec:has(.dd-att) .dd-head p {
    color: #617052 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* Зелен акцент под заглавието */

section.sec:has(.dd-att) .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    margin: 24px auto 0 !important;
    box-shadow: 0 0 18px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ОСНОВНА КАРТА
   ========================================================================== */

section.sec:has(.dd-att) .dd-att {
    position: relative !important;
    max-width: 920px !important;
    margin: 0 auto !important;
    background: #ffffff !important;
    border: 1px solid rgba(48,90,8,.10) !important;
    border-radius: 20px !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-shadow:
        0 10px 35px rgba(48,90,8,.06),
        0 2px 8px rgba(0,0,0,.025) !important;
}

/* ==========================================================================
   ГОРНА ЛЕНТА
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 22px 28px !important;
    background: #f1f5ec !important;
    border-bottom: 1px solid rgba(48,90,8,.10) !important;
}

section.sec:has(.dd-att) .dd-att-h b {
    color: #1a2e05 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}

section.sec:has(.dd-att) .dd-att-h span {
    display: inline-flex !important;
    align-items: center !important;
    padding: 6px 11px !important;
    border-radius: 999px !important;
    background: rgba(94,154,0,.16) !important;
    border: 1px solid rgba(152,219,28,.28) !important;
    color: #305a08 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   TIMELINE
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-l {
    position: relative !important;
    padding: 26px 28px 10px !important;
}

/* Вертикална линия */

section.sec:has(.dd-att) .dd-att-l::before {
    content: "" !important;
    position: absolute !important;
    left: 82px !important;
    top: 42px !important;
    bottom: 42px !important;
    width: 2px !important;
    background: linear-gradient(
        to bottom,
        rgba(152,219,28,.35),
        rgba(152,219,28,.12)
    ) !important;
}

/* ==========================================================================
   РЕД
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 55px 28px minmax(0,1fr) !important;
    align-items: flex-start !important;
    gap: 14px !important;
    padding: 15px 0 !important;
    z-index: 1 !important;
}

/* Час */

section.sec:has(.dd-att) .dd-att-t {
    color: #647254 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 20px !important;
    text-align: right !important;
    white-space: nowrap !important;
}

/* Точка */

section.sec:has(.dd-att) .dd-att-d {
    position: relative !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2 !important;
}

section.sec:has(.dd-att) .dd-att-d i {
    display: block !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    border: 3px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(152,219,28,.45),
        0 3px 8px rgba(48,90,8,.12) !important;
}

/* ==========================================================================
   СЪДЪРЖАНИЕ НА СЪБИТИЕТО
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-x {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    min-width: 0 !important;
    padding: 2px 0 4px !important;
}

section.sec:has(.dd-att) .dd-att-x b {
    color: #203208 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section.sec:has(.dd-att) .dd-att-x span {
    color: #69785f !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   АТАКА — ЧЕРВЕН АКЦЕНТ
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-r.is-bad {
    margin: 0 -10px !important;
    padding: 15px 10px !important;
    border-radius: 12px !important;
    background: #fff6f5 !important;
    border: 1px solid rgba(210,70,55,.10) !important;
}

section.sec:has(.dd-att) .dd-att-r.is-bad .dd-att-t {
    color: #b44a3e !important;
}

section.sec:has(.dd-att) .dd-att-r.is-bad .dd-att-d i {
    background: #df624f !important;
    box-shadow:
        0 0 0 1px rgba(210,70,55,.35),
        0 3px 8px rgba(210,70,55,.15) !important;
}

section.sec:has(.dd-att) .dd-att-r.is-bad .dd-att-x b {
    color: #8f3026 !important;
}

/* ==========================================================================
   УСПЕШЕН КРАЙ
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-r.is-ok {
    margin-top: 5px !important;
    padding-top: 20px !important;
    padding-bottom: 18px !important;
    border-top: 1px dashed rgba(48,90,8,.12) !important;
}

section.sec:has(.dd-att) .dd-att-r.is-ok .dd-att-t {
    color: #4f7c18 !important;
}

section.sec:has(.dd-att) .dd-att-r.is-ok .dd-att-d i {
    background: #7cbf00 !important;
    box-shadow:
        0 0 0 1px rgba(152,219,28,.45),
        0 3px 8px rgba(152,219,28,.18) !important;
}

section.sec:has(.dd-att) .dd-att-r.is-ok .dd-att-x b {
    color: #31590b !important;
}

/* ==========================================================================
   ФИНАЛНА БЕЛЕЖКА
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-end {
    margin: 8px 28px 28px !important;
    padding: 18px 20px !important;
    border-radius: 12px !important;
    background: #f1f7e9 !important;
    border: 1px solid rgba(152,219,28,.20) !important;
    color: #627052 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

section.sec:has(.dd-att) .dd-att-end b {
    color: #305a08 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.dd-att) .dd-att-r:not(.is-bad):not(.is-ok) {
    transition:
        background .25s ease,
        transform .25s ease !important;
    border-radius: 12px !important;
}

section.sec:has(.dd-att) .dd-att-r:not(.is-bad):not(.is-ok):hover {
    background: #f8faf5 !important;
    transform: translateX(4px) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.dd-att) {
        padding: 70px 16px !important;
    }

    section.sec:has(.dd-att) .dd-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.dd-att) .dd-head h2 {
        font-size: 30px !important;
    }

    section.sec:has(.dd-att) .dd-head p {
        font-size: 14px !important;
    }

    section.sec:has(.dd-att) .dd-att-h {
        padding: 18px 20px !important;
    }

    section.sec:has(.dd-att) .dd-att-l {
        padding: 20px 20px 8px !important;
    }

    section.sec:has(.dd-att) .dd-att-l::before {
        left: 65px !important;
    }

    section.sec:has(.dd-att) .dd-att-r {
        grid-template-columns: 48px 24px minmax(0,1fr) !important;
        gap: 10px !important;
    }

    section.sec:has(.dd-att) .dd-att-d {
        width: 24px !important;
    }

    section.sec:has(.dd-att) .dd-att-x b {
        font-size: 13px !important;
    }

    section.sec:has(.dd-att) .dd-att-x span {
        font-size: 11.5px !important;
    }

    section.sec:has(.dd-att) .dd-att-end {
        margin: 8px 20px 20px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 520px) {

    section.sec:has(.dd-att) {
        padding: 60px 14px !important;
    }

    section.sec:has(.dd-att) .dd-att {
        border-radius: 16px !important;
    }

    section.sec:has(.dd-att) .dd-att-h {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 9px !important;
        padding: 18px !important;
    }

    section.sec:has(.dd-att) .dd-att-l {
        padding: 15px 16px 5px !important;
    }

    section.sec:has(.dd-att) .dd-att-l::before {
        left: 57px !important;
        top: 35px !important;
        bottom: 35px !important;
    }

    section.sec:has(.dd-att) .dd-att-r {
        grid-template-columns: 40px 22px minmax(0,1fr) !important;
        gap: 8px !important;
        padding: 13px 0 !important;
    }

    section.sec:has(.dd-att) .dd-att-t {
        font-size: 10px !important;
    }

    section.sec:has(.dd-att) .dd-att-d {
        width: 22px !important;
    }

    section.sec:has(.dd-att) .dd-att-d i {
        width: 9px !important;
        height: 9px !important;
    }

    section.sec:has(.dd-att) .dd-att-x b {
        font-size: 12.5px !important;
        line-height: 1.4 !important;
    }

    section.sec:has(.dd-att) .dd-att-x span {
        font-size: 11px !important;
        line-height: 1.5 !important;
    }

    section.sec:has(.dd-att) .dd-att-r.is-bad {
        margin: 0 -5px !important;
        padding: 13px 5px !important;
    }

    section.sec:has(.dd-att) .dd-att-end {
        margin: 6px 16px 16px !important;
        padding: 15px 16px !important;
        font-size: 12px !important;
    }
}
/*Какво не обещаваме*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "КАКВО НЕ ОБЕЩАВАМЕ"
   ========================================================================== */

section#limits.sec-wash {
    position: relative !important;
    background: #0b0f08 !important;
    padding: 90px 20px !important;
    color: #f5f7f2 !important;
    overflow: hidden !important;
}

/* Лек зелен ореол */

section#limits.sec-wash::before {
    content: "" !important;
    position: absolute !important;
    width: 620px !important;
    height: 620px !important;
    left: 50% !important;
    top: 10% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.055) 0%,
        rgba(152,219,28,.018) 38%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

section#limits.sec-wash .wrap-n {
    position: relative !important;
    z-index: 1 !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section#limits .dd-head {
    max-width: none !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section#limits .dd-head h2 {
    margin: 0 0 15px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section#limits .dd-head p {
    margin: 0 !important;
    color: #9ca694 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}

/* Зелената черта */

section#limits .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    box-shadow: 0 0 18px rgba(152,219,28,.4) !important;
}

/* ==========================================================================
   ОСНОВНА КАРТА
   ========================================================================== */

section#limits .dd-limits {
    position: relative !important;
    max-width: 920px !important;
    margin: 0 auto !important;
    background: linear-gradient(
        145deg,
        #151a11 0%,
        #10140d 100%
    ) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow:
        0 22px 55px rgba(0,0,0,.35),
        inset 0 1px 0 rgba(255,255,255,.025) !important;
}

/* Светла линия отгоре */

section#limits .dd-limits::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,.55),
        transparent
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВНА ЛЕНТА
   ========================================================================== */

section#limits .dd-limits-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    padding: 23px 28px !important;
    background: rgba(255,255,255,.025) !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
}

section#limits .dd-limits-h b {
    color: #f4f7ef !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section#limits .dd-limits-ic {
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 11px !important;
    background: rgba(152,219,28,.10) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    color: #7cbf00 !important;
}

section#limits .dd-limits-ic svg {
    width: 19px !important;
    height: 19px !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section#limits .dd-limits-l {
    display: flex !important;
    flex-direction: column !important;
    padding: 8px 28px 12px !important;
}

/* ==========================================================================
   ЕЛЕМЕНТ
   ========================================================================== */

section#limits .dd-limits-i {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 9px minmax(0,1fr) !important;
    gap: 16px !important;
    padding: 24px 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

section#limits .dd-limits-i:last-child {
    border-bottom: 0 !important;
}

/* Зелената точка */

section#limits .dd-limits-i > i {
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    margin-top: 7px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow:
        0 0 0 4px rgba(152,219,28,.08),
        0 0 14px rgba(152,219,28,.22) !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section#limits .dd-limits-i > span {
    display: block !important;
    min-width: 0 !important;
}

section#limits .dd-limits-i > span > b {
    display: block !important;
    margin: 0 0 7px !important;
    color: #f1f5ed !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section#limits .dd-limits-i p {
    margin: 0 !important;
    color: #8f998a !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section#limits .dd-limits-i {
    transition:
        background .3s ease,
        padding-left .3s ease !important;
}

section#limits .dd-limits-i:hover {
    background: rgba(152,219,28,.025) !important;
}

section#limits .dd-limits-i:hover > i {
    background: #b1ed45 !important;
    box-shadow:
        0 0 0 5px rgba(152,219,28,.08),
        0 0 18px rgba(152,219,28,.3) !important;
}

section#limits .dd-limits-i:hover > span > b {
    color: #ffffff !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section#limits.sec-wash {
        padding: 70px 16px !important;
    }

    section#limits .dd-head {
        margin-bottom: 38px !important;
    }

    section#limits .dd-head h2 {
        font-size: 30px !important;
    }

    section#limits .dd-head p {
        font-size: 14px !important;
    }

    section#limits .dd-limits-h {
        padding: 20px 22px !important;
    }

    section#limits .dd-limits-l {
        padding: 5px 22px 8px !important;
    }

    section#limits .dd-limits-i {
        padding: 21px 0 !important;
        gap: 14px !important;
    }

    section#limits .dd-limits-i > span > b {
        font-size: 14px !important;
    }

    section#limits .dd-limits-i p {
        font-size: 12.5px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 520px) {

    section#limits.sec-wash {
        padding: 60px 14px !important;
    }

    section#limits .dd-limits {
        border-radius: 16px !important;
    }

    section#limits .dd-limits-h {
        padding: 18px !important;
        gap: 11px !important;
    }

    section#limits .dd-limits-ic {
        flex-basis: 34px !important;
        width: 34px !important;
        height: 34px !important;
        border-radius: 9px !important;
    }

    section#limits .dd-limits-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    section#limits .dd-limits-h b {
        font-size: 14px !important;
    }

    section#limits .dd-limits-l {
        padding: 4px 18px 7px !important;
    }

    section#limits .dd-limits-i {
        grid-template-columns: 8px minmax(0,1fr) !important;
        gap: 13px !important;
        padding: 19px 0 !important;
    }

    section#limits .dd-limits-i > i {
        width: 6px !important;
        height: 6px !important;
        margin-top: 6px !important;
    }

    section#limits .dd-limits-i > span > b {
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    section#limits .dd-limits-i p {
        font-size: 11.5px !important;
        line-height: 1.6 !important;
    }
}
/*Какво трябва да направиш ти*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАКВО ТРЯБВА ДА НАПРАВИШ ТИ"
   ========================================================================== */

section.sec:has(.dd-you) {
    position: relative !important;
    background: #f7f9f4 !important;
    padding: 90px 20px !important;
    color: #1a2e05 !important;
    overflow: hidden !important;
}

/* Лек декоративен зелен ореол */

section.sec:has(.dd-you)::before {
    content: "" !important;
    position: absolute !important;
    width: 580px !important;
    height: 580px !important;
    left: 50% !important;
    top: 15% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.055) 0%,
        rgba(152,219,28,.018) 40%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

section.sec:has(.dd-you) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.dd-you) .dd-head {
    max-width: 760px !important;
    margin: 0 auto 55px !important;
    text-align: center !important;
}

section.sec:has(.dd-you) .dd-head h2 {
    margin: 0 0 15px !important;
    color: #172505 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.dd-you) .dd-head p {
    margin: 0 !important;
    color: #617052 !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
}

/* Зелен акцент */

section.sec:has(.dd-you) .dd-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    background: #7cbf00 !important;
    border-radius: 10px !important;
    box-shadow: 0 0 18px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec:has(.dd-you) .dd-you {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
    align-items: stretch !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    min-height: 230px !important;
    padding: 28px 26px !important;
    background: #ffffff !important;
    border: 1px solid rgba(48,90,8,.10) !important;
    border-radius: 17px !important;
    box-shadow:
        0 5px 18px rgba(48,90,8,.035),
        0 1px 3px rgba(0,0,0,.025) !important;
    overflow: hidden !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}

/* Горна зелена линия */

section.sec:has(.dd-you) .dd-you-i::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(152,219,28,.55),
        transparent
    ) !important;
    opacity: 0 !important;
    transition: opacity .3s ease !important;
}

/* ==========================================================================
   ОСНОВНА КАРТА "НИЩО"
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i.big {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f5f9ef 100%
        ) !important;
    border-color: rgba(152,219,28,.32) !important;
    box-shadow:
        0 10px 30px rgba(48,90,8,.06),
        0 0 28px rgba(152,219,28,.045),
        inset 0 1px 0 rgba(152,219,28,.10) !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-ic {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 21px !important;
    border-radius: 12px !important;
    background: rgba(152,219,28,.12) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #4a780e !important;
}

section.sec:has(.dd-you) .dd-you-ic svg {
    width: 20px !important;
    height: 20px !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i > b {
    display: block !important;
    margin: 0 0 9px !important;
    color: #1b3006 !important;
    font-size: 18px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i > p {
    margin: 0 !important;
    color: #65745d !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.dd-you) .dd-you-i:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(105,201,14,.35) !important;
    box-shadow:
        0 16px 32px rgba(48,90,8,.08),
        0 0 24px rgba(152,219,28,.045) !important;
}

section.sec:has(.dd-you) .dd-you-i:hover::before {
    opacity: 1 !important;
}

section.sec:has(.dd-you) .dd-you-i:hover .dd-you-ic {
    background: rgba(152,219,28,.18) !important;
    border-color: rgba(152,219,28,.40) !important;
    color: #305a08 !important;
}

/* Основната карта да изпъква */

section.sec:has(.dd-you) .dd-you-i.big:hover {
    border-color: rgba(105,201,14,.50) !important;
    box-shadow:
        0 18px 38px rgba(48,90,8,.10),
        0 0 30px rgba(152,219,28,.07) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.dd-you) {
        padding: 75px 18px !important;
    }

    section.sec:has(.dd-you) .dd-you {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    section.sec:has(.dd-you) .dd-you-i.big {
        grid-column: 1 / -1 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    section.sec:has(.dd-you) {
        padding: 60px 16px !important;
    }

    section.sec:has(.dd-you) .dd-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.dd-you) .dd-head h2 {
        font-size: 30px !important;
    }

    section.sec:has(.dd-you) .dd-head p {
        font-size: 14px !important;
    }

    section.sec:has(.dd-you) .dd-you {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    section.sec:has(.dd-you) .dd-you-i,
    section.sec:has(.dd-you) .dd-you-i.big {
        grid-column: auto !important;
        min-height: auto !important;
        padding: 24px 21px !important;
        border-radius: 15px !important;
    }

    section.sec:has(.dd-you) .dd-you-ic {
        width: 39px !important;
        height: 39px !important;
        flex-basis: 39px !important;
        margin-bottom: 17px !important;
    }

    section.sec:has(.dd-you) .dd-you-i > b {
        font-size: 17px !important;
    }

    section.sec:has(.dd-you) .dd-you-i > p {
        font-size: 12px !important;
        line-height: 1.6 !important;
    }

    section.sec:has(.dd-you) .dd-you-i:hover {
        transform: translateY(-4px) !important;
    }
}

/*Кой обикновено бива атакуван*/


/* =========================================
   DD-WHO — светъл фон + тъмни боксове
   ========================================= */

.dd-who {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.dd-who-i {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;

  background: #18220f !important;
  border: 1px solid rgba(183, 255, 53, 0.18) !important;
  border-radius: 18px !important;

  padding: 28px 24px !important;
  min-height: 230px !important;

  box-shadow:
    0 8px 24px rgba(20, 30, 10, 0.10) !important;

  transition:
    transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),
    border-color 0.35s ease,
    box-shadow 0.35s ease !important;
}

.dd-who-i:hover {
  transform: translateY(-5px) !important;

  border-color: rgba(183, 255, 53, 0.55) !important;

  box-shadow:
    0 18px 38px rgba(20, 30, 10, 0.16),
    0 0 0 1px rgba(183, 255, 53, 0.05) !important;
}

/* Иконка */

.dd-who-ic {
  width: 46px !important;
  height: 46px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin-bottom: 22px !important;

  color: #b7ff35 !important;
  background: rgba(183, 255, 53, 0.10) !important;

  border: 1px solid rgba(183, 255, 53, 0.18) !important;
  border-radius: 13px !important;

  flex-shrink: 0 !important;
}

.dd-who-ic svg {
  width: 22px !important;
  height: 22px !important;
}

/* Заглавие */

.dd-who-i > b {
  display: block !important;

  margin: 0 0 10px !important;

  color: #ffffff !important;

  font-size: 1.05rem !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}

/* Описание */

.dd-who-i > p {
  margin: 0 !important;

  color: rgba(255, 255, 255, 0.68) !important;

  font-size: 0.94rem !important;
  line-height: 1.65 !important;
}

/* Светъл фон на самата секция */
.sec.sec-wash {
  background: #f7f9f3 !important;
}

/* Заглавие над боксовете */

.sec.sec-wash .dd-head h2 {
  color: #7cb316 !important;
}

.sec.sec-wash .dd-head p {
  color: #7cb316 !important;
}


/* =========================================
   Responsive
   ========================================= */

@media (max-width: 1050px) {
  .dd-who {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 600px) {
  .dd-who {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    margin-top: 30px !important;
  }

  .dd-who-i {
    min-height: auto !important;
    padding: 24px 21px !important;
  }

  .dd-who-ic {
    width: 42px !important;
    height: 42px !important;
    margin-bottom: 18px !important;
  }

  .dd-who-i > b {
    font-size: 1rem !important;
  }

  .dd-who-i > p {
    font-size: 0.92rem !important;
  }
}

/*faq*/


/* =========================================
   DD FAQ — светъл дизайн
   ========================================= */

.dd-faq {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.dd-faq-i {
  position: relative !important;

  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;

  padding: 28px 25px !important;

  cursor: pointer !important;

  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;

  transition:
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    transform 0.35s ease !important;
}

.dd-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.55) !important;

  box-shadow:
    0 16px 30px rgba(48, 90, 8, 0.08) !important;

  transform: translateY(-2px) !important;
}


/* =========================================
   Заглавие
   ========================================= */

.dd-faq-i h3 {
  position: relative !important;

  margin: 0 !important;
  padding: 0 32px 0 0 !important;

  color: #1a2e05 !important;

  font-size: 1.08rem !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
}


/* =========================================
   Плюс / минус
   ========================================= */

.dd-faq-i h3::after {
  content: '+' !important;

  position: absolute !important;
  right: 0 !important;
  top: 50% !important;

  transform: translateY(-50%) !important;

  width: 25px !important;
  height: 25px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  color: #305a08 !important;

  font-size: 1.35rem !important;
  line-height: 1 !important;
  font-weight: 400 !important;

  transition: transform 0.3s ease !important;
}

.dd-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}


/* =========================================
   Малък етикет
   ========================================= */

.dd-faq-i .dd-faq-n {
  display: inline-block !important;

  margin: 0 0 12px !important;
  padding: 4px 10px !important;

  border-radius: 20px !important;

  background: rgba(183, 255, 53, 0.20) !important;

  color: #305a08 !important;

  font-size: 0.75rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;

  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}


/* =========================================
   Отговор
   ========================================= */

.dd-faq-i p {
  max-height: 0 !important;

  overflow: hidden !important;

  opacity: 0 !important;

  margin: 0 !important;

  color: #4a5c3a !important;

  font-size: 0.95rem !important;
  line-height: 1.65 !important;

  transition:
    max-height 0.45s cubic-bezier(0.165, 0.84, 0.44, 1),
    opacity 0.3s ease,
    margin-top 0.3s ease !important;
}

.dd-faq-i.is-open p {
  max-height: 500px !important;

  opacity: 1 !important;

  margin-top: 15px !important;
}


/* =========================================
   Bold вътре в отговора
   ========================================= */

.dd-faq-i p b {
  color: #1a2e05 !important;
  font-weight: 700 !important;
}


/* =========================================
   Светъл фон на секцията
   ========================================= */

.sec:has(.dd-faq) {
  background: #f7f9f3 !important;
}

.sec:has(.dd-faq) .dd-head h2 {
  color: #1a2e05 !important;
}

.sec:has(.dd-faq) .dd-head p {
  color: #617052 !important;
}


/* =========================================
   Responsive
   ========================================= */

@media (max-width: 800px) {
  .dd-faq {
    grid-template-columns: 1fr !important;
    gap: 15px !important;
    margin-top: 30px !important;
  }

  .dd-faq-i {
    padding: 23px 20px !important;
  }
}

@media (max-width: 480px) {
  .dd-faq-i h3 {
    font-size: 1rem !important;
  }

  .dd-faq-i p {
    font-size: 0.92rem !important;
    line-height: 1.6 !important;
  }

  .dd-faq-i .dd-faq-n {
    font-size: 0.7rem !important;
  }
}

/*kontakti/faq*/

/* =========================================
   KT FAQ — светъл дизайн
   ========================================= */

.kt-faq {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
  margin-top: 40px !important;
}

.kt-faq-i {
  position: relative !important;

  background: #ffffff !important;
  border: 1px solid rgba(152, 219, 28, 0.25) !important;
  border-radius: 16px !important;

  padding: 28px 25px !important;

  cursor: pointer !important;

  box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;

  transition:
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    transform 0.35s ease !important;
}

.kt-faq-i:hover {
  border-color: rgba(105, 201, 14, 0.55) !important;

  box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;

  transform: translateY(-2px) !important;
}


/* =========================================
   Въпрос
   ========================================= */

.kt-faq-i h3 {
  position: relative !important;

  margin: 0 !important;
  padding: 0 35px 0 0 !important;

  color: #1a2e05 !important;

  font-size: 1.08rem !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
}


/* =========================================
   Плюс / минус
   ========================================= */

.kt-faq-i h3::after {
  content: '+' !important;

  position: absolute !important;
  right: 0 !important;
  top: 50% !important;

  transform: translateY(-50%) !important;

  width: 26px !important;
  height: 26px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  color: #305a08 !important;

  font-size: 1.35rem !important;
  line-height: 1 !important;
  font-weight: 400 !important;

  transition: transform 0.3s ease !important;
}

.kt-faq-i.is-open h3::after {
  transform: translateY(-50%) rotate(45deg) !important;
}


/* =========================================
   Отговор
   ========================================= */

.kt-faq-i p {
  max-height: 0 !important;

  overflow: hidden !important;

  opacity: 0 !important;

  margin: 0 !important;

  color: #4a5c3a !important;

  font-size: 0.95rem !important;
  line-height: 1.65 !important;

  transition:
    max-height 0.45s cubic-bezier(0.165, 0.84, 0.44, 1),
    opacity 0.3s ease,
    margin-top 0.3s ease !important;
}

.kt-faq-i.is-open p {
  max-height: 300px !important;

  opacity: 1 !important;

  margin-top: 15px !important;
}


/* =========================================
   Bold в отговора
   ========================================= */

.kt-faq-i p b {
  color: #1a2e05 !important;
  font-weight: 700 !important;
}


/* =========================================
   Светъл фон на секцията
   ========================================= */

.sec.sec-wash:has(.kt-faq) {
  background: #f7f9f3 !important;
}

.sec.sec-wash:has(.kt-faq) .kt-head h2 {
  color: #1a2e05 !important;
}


/* =========================================
   Responsive
   ========================================= */

@media (max-width: 800px) {
  .kt-faq {
    grid-template-columns: 1fr !important;
    gap: 15px !important;
    margin-top: 30px !important;
  }

  .kt-faq-i {
    padding: 23px 20px !important;
  }
}

@media (max-width: 480px) {
  .kt-faq-i h3 {
    font-size: 1rem !important;
  }

  .kt-faq-i p {
    font-size: 0.92rem !important;
    line-height: 1.6 !important;
  }
}

/*Данни за фактури*/

/* =========================================
   СВЕТЪЛ ДИЗАЙН — ДАННИ ЗА ФАКТУРИ
   ========================================= */

.kt-firm {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
    margin-top: 40px !important;
}

.kt-firm-i {
    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 16px !important;
    padding: 28px 26px !important;
    position: relative !important;
    box-shadow: 0 4px 15px rgba(48, 90, 8, 0.03) !important;
    transition:
        transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),
        border-color 0.35s ease,
        box-shadow 0.35s ease !important;
}

.kt-firm-i:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(105, 201, 14, 0.5) !important;
    box-shadow: 0 16px 30px rgba(48, 90, 8, 0.08) !important;
}

/* Заглавие на картата */
.kt-firm-h {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 22px !important;
    color: #1a2e05 !important;
}

.kt-firm-h b {
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    color: #1a2e05 !important;
}

/* Иконка */
.kt-firm-ic {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: rgba(183, 255, 53, 0.18) !important;
    color: #305a08 !important;
}

.kt-firm-ic svg {
    width: 21px !important;
    height: 21px !important;
}

/* Списък с данните */
.kt-firm-l {
    display: flex !important;
    flex-direction: column !important;
    border-top: 1px solid #edf2e8 !important;
}

/* Един ред */
.kt-firm-r {
    display: grid !important;
    grid-template-columns: 115px minmax(0, 1fr) !important;
    gap: 18px !important;
    align-items: start !important;
    padding: 14px 0 !important;
    border-bottom: 1px solid #edf2e8 !important;
}

.kt-firm-r > span:first-child {
    color: #718064 !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
}

.kt-firm-r > span:last-child {
    color: #26351c !important;
    font-size: 0.94rem !important;
    line-height: 1.5 !important;
    font-weight: 500 !important;
}

/* Данни като IBAN / BIC / ЕИК */
.kt-firm-r .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        "Liberation Mono",
        monospace !important;
    font-size: 0.86rem !important;
    color: #305a08 !important;
    letter-spacing: 0.01em !important;
    overflow-wrap: anywhere !important;
}

/* Долна бележка */
.kt-firm-note {
    margin-top: 20px !important;
    padding: 15px 16px !important;
    background: #f5faef !important;
    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 11px !important;
    color: #59684e !important;
    font-size: 0.9rem !important;
    line-height: 1.6 !important;
}

.kt-firm-note b {
    display: block !important;
    margin-bottom: 3px !important;
    color: #305a08 !important;
    font-weight: 700 !important;
}


/* =========================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================= */

.kt-head {
    margin-bottom: 0 !important;
}

.kt-head h2 {
    color: #1a2e05 !important;
}

.kt-head p {
    color: #66755c !important;
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 800px) {
    .kt-firm {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        margin-top: 30px !important;
    }

    .kt-firm-i {
        padding: 24px 20px !important;
    }
}

@media (max-width: 520px) {
    .kt-firm-h {
        margin-bottom: 18px !important;
    }

    .kt-firm-h b {
        font-size: 1.05rem !important;
    }

    .kt-firm-r {
        grid-template-columns: 1fr !important;
        gap: 4px !important;
        padding: 12px 0 !important;
    }

    .kt-firm-r > span:first-child {
        font-size: 0.8rem !important;
        text-transform: uppercase !important;
        letter-spacing: 0.04em !important;
    }

    .kt-firm-r > span:last-child {
        font-size: 0.9rem !important;
    }

    .kt-firm-note {
        font-size: 0.86rem !important;
        padding: 13px 14px !important;
    }
}
/*Къде сме*/ 

/* =========================================
   KT PLACE — ТЪМЕН ДИЗАЙН
   ========================================= */

.kt-place {
    margin-top: 40px !important;
}

.kt-place-in {
    display: grid !important;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) !important;
    min-height: 470px !important;
    overflow: hidden !important;
    border: 1px solid rgba(183, 255, 53, 0.14) !important;
    border-radius: 20px !important;
    background: #111a0d !important;
    box-shadow: 0 20px 45px rgba(20, 35, 8, 0.12) !important;
}

/* =========================================
   ЛЯВА ИНФОРМАЦИОННА ЧАСТ
   ========================================= */

.kt-place-t {
    padding: 38px !important;
    background:
        radial-gradient(
            circle at 15% 10%,
            rgba(183, 255, 53, 0.08),
            transparent 35%
        ),
        #111a0d !important;
    color: #ffffff !important;
}

.kt-place-t h3 {
    margin: 0 0 30px !important;
    color: #ffffff !important;
    font-size: 1.45rem !important;
    font-weight: 700 !important;
}

/* Контактни редове */
.kt-addr {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
}

.kt-addr-r {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    padding: 17px 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.kt-addr-r:first-child {
    padding-top: 0 !important;
}

.kt-addr-ic {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 11px !important;
    color: #b7ff35 !important;
    background: rgba(183, 255, 53, 0.09) !important;
}

.kt-addr-ic svg {
    width: 19px !important;
    height: 19px !important;
}

.kt-addr-r > span:last-child {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    color: #c3cdbb !important;
    font-size: 0.93rem !important;
    line-height: 1.55 !important;
}

.kt-addr-r > span:last-child > b {
    color: #ffffff !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}

.kt-addr-r a {
    color: #b7ff35 !important;
    text-decoration: none !important;
    transition: color 0.25s ease !important;
}

.kt-addr-r a:hover {
    color: #d1ff83 !important;
    text-decoration: underline !important;
}

/* =========================================
   СЪОБЩЕНИЕ
   ========================================= */

.kt-place-say {
    margin-top: 25px !important;
    padding: 16px 17px !important;
    border: 1px solid rgba(183, 255, 53, 0.14) !important;
    border-radius: 12px !important;
    background: rgba(183, 255, 53, 0.055) !important;
    color: #aeb9a6 !important;
    font-size: 0.88rem !important;
    line-height: 1.6 !important;
}

.kt-place-say b {
    color: #d9ff9c !important;
}


/* =========================================
   MAP
   ========================================= */

.kt-map {
    position: relative !important;
    min-height: 470px !important;
    overflow: hidden !important;
    background:
        radial-gradient(
            circle at 50% 45%,
            rgba(183, 255, 53, 0.06),
            transparent 34%
        ),
        #182216 !important;
}

/* Мрежа на картата */
.kt-map-grid {
    position: absolute !important;
    inset: 0 !important;
    opacity: 0.55 !important;
    background-image:
        linear-gradient(
            rgba(183, 255, 53, 0.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(183, 255, 53, 0.055) 1px,
            transparent 1px
        ) !important;
    background-size: 38px 38px !important;
}

/* Леко затъмняване по краищата */
.kt-map::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        radial-gradient(
            circle at center,
            transparent 30%,
            rgba(7, 12, 6, 0.38) 100%
        ) !important;
}

/* =========================================
   УСЛОВНИ ПЪТИЩА
   ========================================= */

.kt-map-road {
    position: absolute !important;
    height: 2px !important;
    background: rgba(255, 255, 255, 0.09) !important;
    transform-origin: left center !important;
}

.kt-map-road.r1 {
    width: 115% !important;
    left: -8% !important;
    top: 31% !important;
    transform: rotate(8deg) !important;
}

.kt-map-road.r2 {
    width: 90% !important;
    left: 13% !important;
    top: 57% !important;
    transform: rotate(-18deg) !important;
}

.kt-map-road.r3 {
    width: 80% !important;
    left: 4% !important;
    top: 70% !important;
    transform: rotate(25deg) !important;
}

.kt-map-road.r4 {
    width: 75% !important;
    left: 36% !important;
    top: 8% !important;
    transform: rotate(72deg) !important;
}


/* =========================================
   PIN
   ========================================= */

.kt-map-pin {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    z-index: 3 !important;
    transform: translate(-50%, -50%) !important;
    text-align: center !important;
}

.kt-map-dot {
    width: 18px !important;
    height: 18px !important;
    margin: 0 auto 13px !important;
    border-radius: 50% !important;
    background: #b7ff35 !important;
    border: 4px solid rgba(183, 255, 53, 0.18) !important;
    box-shadow:
        0 0 0 8px rgba(183, 255, 53, 0.08),
        0 0 30px rgba(183, 255, 53, 0.35) !important;
}

.kt-map-name {
    color: #ffffff !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    margin-bottom: 4px !important;
}

.kt-map-city {
    color: #aab5a2 !important;
    font-size: 0.8rem !important;
}


/* =========================================
   MAP BUTTON
   ========================================= */

.kt-map-go {
    position: absolute !important;
    z-index: 5 !important;
    right: 22px !important;
    bottom: 22px !important;
}

.kt-map-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    padding: 9px 16px !important;
    border-radius: 9px !important;
    border: 1px solid rgba(183, 255, 53, 0.2) !important;
    background: #b7ff35 !important;
    color: #182506 !important;
    font-size: 0.84rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2) !important;
    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease !important;
}

.kt-map-go .btn:hover {
    transform: translateY(-2px) !important;
    background: #c9ff69 !important;
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.28) !important;
}


/* =========================================
   ЗАГЛАВИЕ — СВЕТЛО, ЗА ДА СЕ ВИЖДА
   ========================================= */

.kt-head h2 {
    color: #7db713!important;
}

.kt-head p {
    color: #7db713!important;
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 850px) {
    .kt-place-in {
        grid-template-columns: 1fr !important;
    }

    .kt-map {
        min-height: 400px !important;
    }

    .kt-place-t {
        padding: 30px 25px !important;
    }
}

@media (max-width: 520px) {
    .kt-place {
        margin-top: 28px !important;
    }

    .kt-place-in {
        border-radius: 16px !important;
    }

    .kt-place-t {
        padding: 25px 20px !important;
    }

    .kt-place-t h3 {
        margin-bottom: 24px !important;
        font-size: 1.25rem !important;
    }

    .kt-map {
        min-height: 340px !important;
    }

    .kt-map-go {
        right: 15px !important;
        bottom: 15px !important;
    }

    .kt-map-go .btn {
        min-height: 38px !important;
        padding: 8px 13px !important;
        font-size: 0.8rem !important;
    }
}

/*kontakti/*/

/* =========================================
   KT FORM — СВЕТЪЛ ДИЗАЙН
   ========================================= */

.kt-form-wrap {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 330px !important;
    gap: 24px !important;
    margin-top: 40px !important;
    align-items: start !important;
}

/* =========================================
   ОСНОВНА ФОРМА
   ========================================= */

.kt-form {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 18px !important;
    padding: 32px !important;
    box-shadow: 0 5px 20px rgba(48, 90, 8, 0.04) !important;
}

.kt-trap {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* =========================================
   ПОЛЕТА
   ========================================= */

.kt-one,
.kt-row {
    margin-bottom: 21px !important;
}

.kt-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
}

.kt-l {
    display: block !important;
    margin-bottom: 8px !important;
    color: #27361e !important;
    font-size: 0.86rem !important;
    font-weight: 700 !important;
}

.kt-l em {
    color: #87947e !important;
    font-style: normal !important;
    font-weight: 500 !important;
}


/* =========================================
   INPUTS
   ========================================= */

.kt-in,
.kt-sel,
.kt-ta {
    width: 100% !important;
    box-sizing: border-box !important;
    border: 1px solid #dce5d7 !important;
    border-radius: 10px !important;
    background: #fbfdf9 !important;
    color: #24321c !important;
    font-family: inherit !important;
    font-size: 0.94rem !important;
    outline: none !important;
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease !important;
}

.kt-in,
.kt-sel {
    height: 48px !important;
    padding: 0 14px !important;
}

.kt-ta {
    min-height: 145px !important;
    padding: 13px 14px !important;
    resize: vertical !important;
    line-height: 1.55 !important;
}

.kt-in::placeholder,
.kt-ta::placeholder {
    color: #a1aba0 !important;
}

.kt-in:hover,
.kt-sel:hover,
.kt-ta:hover {
    border-color: #c6d5bc !important;
}

.kt-in:focus,
.kt-sel:focus,
.kt-ta:focus {
    border-color: #8dcc20 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(152, 219, 28, 0.14) !important;
}


/* =========================================
   SELECT
   ========================================= */

.kt-sel {
    appearance: none !important;
    cursor: pointer !important;
    padding-right: 42px !important;
    background-image:
        linear-gradient(45deg, transparent 50%, #5d6d52 50%),
        linear-gradient(135deg, #5d6d52 50%, transparent 50%) !important;
    background-position:
        calc(100% - 18px) 20px,
        calc(100% - 13px) 20px !important;
    background-size: 5px 5px, 5px 5px !important;
    background-repeat: no-repeat !important;
}


/* =========================================
   HINT
   ========================================= */

.kt-hint {
    margin: 7px 0 0 !important;
    color: #7a8871 !important;
    font-size: 0.78rem !important;
    line-height: 1.5 !important;
}


/* =========================================
   EXTRA DOMAIN BOX
   ========================================= */

.kt-extra {
    margin: 4px 0 22px !important;
    padding: 19px !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 12px !important;
    background: #f6faef !important;
}

.kt-extra-h {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 15px !important;
    color: #305a08 !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
}

.kt-extra-h svg {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 auto !important;
}


/* =========================================
   CHECKBOX
   ========================================= */

.kt-check {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin: 5px 0 24px !important;
    color: #66735f !important;
    font-size: 0.82rem !important;
    line-height: 1.5 !important;
    cursor: pointer !important;
}

.kt-check input {
    width: 17px !important;
    height: 17px !important;
    min-width: 17px !important;
    margin: 1px 0 0 !important;
    accent-color: #72ad16 !important;
    cursor: pointer !important;
}

.kt-check a {
    color: #4e850b !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.kt-check a:hover {
    text-decoration: underline !important;
}


/* =========================================
   SUBMIT
   ========================================= */

.kt-go {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex-wrap: wrap !important;
}

.kt-go .btn {
    min-height: 48px !important;
    padding: 0 24px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: #72ad16 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 0.92rem !important;
    cursor: pointer !important;
    box-shadow: 0 7px 18px rgba(83, 133, 13, 0.18) !important;
    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease !important;
}

.kt-go .btn:hover {
    transform: translateY(-2px) !important;
    background: #60960f !important;
    box-shadow: 0 11px 24px rgba(83, 133, 13, 0.24) !important;
}

.kt-note {
    color: #7a8871 !important;
    font-size: 0.78rem !important;
    line-height: 1.45 !important;
}

.kt-note b {
    color: #305a08 !important;
}


/* =========================================
   ДЯСНА КОЛОНА
   ========================================= */

.kt-aside {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

.kt-card {
    padding: 22px !important;
    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 15px !important;
    background: #ffffff !important;
    box-shadow: 0 5px 18px rgba(48, 90, 8, 0.04) !important;
    color: #596650 !important;
}

.kt-card.urgent {
    border-color: rgba(152, 219, 28, 0.4) !important;
    background: #f5faed !important;
}

.kt-card.blue {
    background: #ffffff !important;
}

.kt-card-h {
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
    margin-bottom: 13px !important;
}

.kt-card-h b {
    color: #1a2e05 !important;
    font-size: 1rem !important;
}

.kt-card-ic {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 10px !important;
    color: #4e850b !important;
    background: rgba(183, 255, 53, 0.17) !important;
}

.kt-card-ic svg {
    width: 19px !important;
    height: 19px !important;
}

.kt-card p {
    margin: 0 0 17px !important;
    color: #697663 !important;
    font-size: 0.86rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   БУТОНИ В SIDEBAR
   ========================================= */

.kt-card .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 0 17px !important;
    border-radius: 9px !important;
    background: #72ad16 !important;
    color: #ffffff !important;
    font-size: 0.84rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition:
        transform 0.25s ease,
        background 0.25s ease !important;
}

.kt-card .btn:hover {
    transform: translateY(-2px) !important;
    background: #60960f !important;
}

.kt-card .btn-ghost {
    background: #f3f8ed !important;
    border: 1px solid rgba(114, 173, 22, 0.25) !important;
    color: #4e850b !important;
}

.kt-card .btn-ghost:hover {
    background: #eaf4df !important;
}


/* =========================================
   РАБОТНО ВРЕМЕ
   ========================================= */

.kt-hours {
    border-top: 1px solid #edf2e8 !important;
}

.kt-hours-r {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 15px !important;
    padding: 11px 0 !important;
    border-bottom: 1px solid #edf2e8 !important;
    color: #74806d !important;
    font-size: 0.83rem !important;
}

.kt-hours-r:last-child {
    border-bottom: 0 !important;
}

.kt-hours-r b {
    color: #2d3d23 !important;
    font-weight: 700 !important;
}

.kt-hours-r.all b {
    color: #4e850b !important;
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 900px) {
    .kt-form-wrap {
        grid-template-columns: 1fr !important;
    }

    .kt-aside {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 700px) {
    .kt-form {
        padding: 24px 20px !important;
    }

    .kt-row {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }

    .kt-aside {
        grid-template-columns: 1fr !important;
    }

    .kt-go {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .kt-go .btn {
        width: 100% !important;
    }
}

@media (max-width: 480px) {
    .kt-form-wrap {
        margin-top: 28px !important;
    }

    .kt-form {
        border-radius: 15px !important;
        padding: 21px 17px !important;
    }

    .kt-card {
        padding: 19px !important;
    }

    .kt-extra {
        padding: 16px !important;
    }
}

/*kontakti/*/


/* =========================================================
   KT HERO — DARK + ELECTRIC GREEN
   ========================================================= */

.kt-hero {
    position: relative;
    overflow: hidden;
    padding: 80px 0;
    background: #11151b;
    color: #f2f4f7;
    border-top: 1px solid rgba(255,255,255,.04);
    border-bottom: 1px solid rgba(255,255,255,.04);
}

.kt-hero .wrap-w {
    position: relative;
    z-index: 1;
}

/* =========================================================
   HEADER
   ========================================================= */

.kt-hero h1 {
    margin: 0 0 14px;
    color: #ffffff;
    font-size: clamp(40px, 5vw, 64px);
    line-height: 1.05;
    letter-spacing: -.045em;
    font-weight: 500;
}

.kt-hero > .wrap-w > p {
    max-width: 680px;
    margin: 0 0 38px;
    color: #9ca5b2;
    font-size: 17px;
    line-height: 1.65;
}

/* =========================================================
   CONTACT CARDS
   ========================================================= */

.kt-big {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin: 0;
}

.kt-big-i {
    position: relative;
    display: block;
    min-height: 190px;
    padding: 25px;

    color: #e9edf2;
    text-decoration: none;

    background: #191e25;
    border: 1px solid #2a313b;
    border-radius: 12px;

    transition:
        background .2s ease,
        border-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.kt-big-i:hover {
    color: #fff;
    background: #1c2329;
    border-color: rgba(82,255,145,.55);
    transform: translateY(-2px);
    box-shadow:
        0 10px 30px rgba(0,0,0,.20),
        0 0 0 1px rgba(82,255,145,.05);
}

/* =========================================================
   CARD TOP
   ========================================================= */

.kt-big-top {
    display: flex;
    align-items: center;
    gap: 11px;

    color: #aeb7c3;
    font-size: 13px;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.kt-big-top b {
    color: #d1d7df;
    font-weight: 700;
}

.kt-big-ic {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;
    flex: 0 0 38px;

    color: #52ff91;
    background: rgba(82,255,145,.07);
    border: 1px solid rgba(82,255,145,.22);
    border-radius: 9px;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.kt-big-i:hover .kt-big-ic {
    color: #11151b;
    background: #52ff91;
    border-color: #52ff91;
}

.kt-big-ic svg {
    width: 19px;
    height: 19px;
}

/* =========================================================
   MAIN CONTACT VALUE
   ========================================================= */

.kt-big-v {
    margin-top: 30px;

    color: #ffffff;
    font-size: 26px;
    line-height: 1.2;
    letter-spacing: -.025em;
    font-weight: 750;

    overflow-wrap: anywhere;
}

.kt-big-i:first-child .kt-big-v {
    font-size: 32px;
    letter-spacing: -.035em;
}

/* =========================================================
   DESCRIPTION
   ========================================================= */

.kt-big-w {
    margin-top: 10px;

    color: #7f8997;
    font-size: 13px;
    line-height: 1.5;
}

/* =========================================================
   ONLINE STATUS
   ========================================================= */

.kt-now {
    display: flex;
    align-items: center;
    gap: 10px;

    width: fit-content;
    max-width: 100%;

    margin-top: 18px;
    padding: 11px 15px;

    color: #929ca9;

    background: #191e25;
    border: 1px solid #2a313b;
    border-radius: 8px;

    font-size: 13px;
    line-height: 1.45;
}

.kt-now b {
    color: #d9dee5;
}

.kt-now-dot {
    position: relative;

    width: 8px;
    height: 8px;
    flex: 0 0 8px;

    background: #52ff91;
    border-radius: 50%;

    box-shadow:
        0 0 0 3px rgba(82,255,145,.10),
        0 0 12px rgba(82,255,145,.35);
}

/* =========================================================
   SUBTLE GREEN LINE
   ========================================================= */

.kt-now::before {
    content: "";
    width: 1px;
    height: 18px;
    margin-left: 1px;
    background: rgba(82,255,145,.18);
    order: 2;
}

.kt-now-dot {
    order: 1;
}

.kt-now > span:last-child {
    order: 3;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

    .kt-hero {
        padding: 65px 0;
    }

    .kt-big {
        grid-template-columns: 1fr;
    }

    .kt-big-i {
        min-height: auto;
    }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .kt-hero {
        padding: 52px 0;
    }

    .kt-hero h1 {
        font-size: 42px;
        line-height: 1.05;
    }

    .kt-hero > .wrap-w > p {
        margin-bottom: 28px;
        font-size: 15px;
        line-height: 1.6;
    }

    .kt-big {
        gap: 12px;
    }

    .kt-big-i {
        padding: 20px;
        border-radius: 10px;
    }

    .kt-big-v,
    .kt-big-i:first-child .kt-big-v {
        margin-top: 24px;
        font-size: 24px;
    }

    .kt-big-w {
        font-size: 12px;
    }

    .kt-now {
        width: 100%;
        box-sizing: border-box;
        align-items: flex-start;
        border-radius: 8px;
    }

    .kt-now::before {
        display: none;
    }
}

/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.kt-big-i:focus-visible {
    outline: 2px solid #52ff91;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .kt-big-i,
    .kt-big-ic {
        transition: none;
    }

    .kt-big-i:hover {
        transform: none;
    }
}

/*начална*/


```css
/* =========================================
   КАКВО КАЗВАТ КЛИЕНТИТЕ
   ========================================= */

.rev-head {
    display: block;
    margin-bottom: 36px;
}

.rev-head h2 {
    margin: 0 0 24px;
}


/* ТРИТЕ БОКСА — ВИНАГИ НА ЕДИН РЕД */

.rev-scores {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px;
    width: 100%;
    max-width: none;
    margin: 0;
}

.rev-score {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;

    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 9px;

    padding: 15px 17px;

    background: #fff;
    border: 1px solid rgba(20, 28, 38, .10);
    border-radius: 12px;

    box-shadow: none;
}

.rev-score .src {
    flex: 0 0 100%;

    font-size: 11px;
    line-height: 1.2;
    font-weight: 700;
    color: #737c85;

    text-transform: uppercase;
    letter-spacing: .05em;
}

.rev-score .stars {
    display: inline-flex;
    align-items: center;
    gap: 2px;

    color: #b7ff00;
}

.rev-score .stars svg {
    width: 14px;
    height: 14px;
    display: block;
}

.rev-score > b {
    font-size: 20px;
    line-height: 1;
    font-weight: 800;
    color: #151c23;
}

.rev-score > span:last-child {
    flex: 0 0 100%;

    font-size: 11px;
    line-height: 1.3;
    color: #8a929a;
}


/* =========================================
   ЦИТАТИТЕ — 4 НА ЕДИН РЕД
   ========================================= */

.rev-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px;
}

.rev-card {
    min-width: 0;
}


/* =========================================
   ТАБЛЕТ
   ========================================= */

@media (max-width: 900px) {

    .rev-scores {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 10px;
    }

    .rev-score {
        padding: 13px;
    }

    .rev-score > b {
        font-size: 18px;
    }

    .rev-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}


/* =========================================
   ТЕЛЕФОН
   ========================================= */

@media (max-width: 600px) {

    .rev-scores {
        grid-template-columns: 1fr !important;
    }

    .rev-grid {
        grid-template-columns: 1fr !important;
    }
}
```
/*spodelen-hosting/Всичко едно до друго*/


/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СРАВНЕНИЕ НА ПАКЕТИТЕ
   Само за .sh-tbl / .sh-head
   ========================================================================== */

.sh-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    border-radius: 18px !important;
    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;

    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* Електриково зелена линия отгоре */
.sh-tbl::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 30%,
        #c4f76b 50%,
        #7cbf00 70%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.sh-tbl table {
    width: 100% !important;
    min-width: 720px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: transparent !important;
    color: #d5d9cf !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.sh-tbl thead th {
    position: relative !important;
    padding: 20px 18px !important;
    background: #13180d !important;
    color: #f5f7f2 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;

    font-size: 14px !important;
    font-weight: 750 !important;
    line-height: 1.3 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.sh-tbl thead th:first-child {
    width: 32% !important;
    border-top-left-radius: 15px !important;
}

.sh-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.sh-tbl tbody td {
    padding: 17px 18px !important;
    background: #0d1109 !important;

    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;

    color: #aeb5a5 !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;

    transition:
        background 0.25s ease,
        color 0.25s ease !important;
}

/* Първа колона */
.sh-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;

    font-size: 13.5px !important;
    font-weight: 650 !important;

    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

/* Имена на параметрите */
.sh-tbl tbody td:first-child b {
    color: #f0f2ec !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.sh-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #aeb5a5 !important;
    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.sh-tbl tbody tr {
    transition: transform 0.2s ease !important;
}

.sh-tbl tbody tr:hover td {
    background: #151b10 !important;
    color: #f4f7ed !important;
}

.sh-tbl tbody tr:hover td:first-child {
    background: #171d11 !important;
    color: #ffffff !important;
}

.sh-tbl tbody tr:hover .mono {
    color: #d9e1d1 !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — ЦЕНИ
   ========================================================================== */

.sh-tbl tbody tr:last-child td {
    background: #11160c !important;
    border-bottom: 0 !important;
    border-top: 1px solid rgba(152, 219, 28, 0.14) !important;
}

.sh-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
    color: #ffffff !important;
}

.sh-tbl tbody tr:last-child td b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Цена при hover */
.sh-tbl tbody tr:last-child:hover td {
    background: #171d10 !important;
}

.sh-tbl tbody tr:last-child:hover td:first-child {
    background: #191f12 !important;
}

/* ==========================================================================
   ЛЕК ЗЕЛЕН АКЦЕНТ ВЪРХУ ЦЕНИТЕ
   ========================================================================== */

.sh-tbl tbody tr:last-child td:not(:first-child) b {
    color: #a9e83a !important;
    text-shadow: 0 0 15px rgba(152, 219, 28, 0.20) !important;
}

/* ==========================================================================
   DASH / ЛИПСВАЩИ СТОЙНОСТИ
   ========================================================================== */

.sh-tbl tbody td {
    text-rendering: optimizeLegibility !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.sh-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.sh-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.sh-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.sh-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА СЕКЦИЯТА
   ========================================================================== */

.sh-head h2 {
    color: #f5f7f1 !important;
}

.sh-head p {
    color: #8e9689 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .sh-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .sh-tbl table {
        min-width: 680px !important;
    }

    .sh-tbl thead th,
    .sh-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .sh-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .sh-tbl table {
        min-width: 650px !important;
    }

    .sh-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .sh-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .sh-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .sh-tbl .mono {
        font-size: 11.5px !important;
    }
}





/* ==========================================================================
   HOVER — FORCE / PRIORITY
   Постави този блок НАЙ-НАКРАЯ след останалия .sh-tbl CSS
   ========================================================================== */

.sh-tbl tbody tr {
    transition: all 0.22s ease !important;
}

/* Целият ред */
.sh-tbl tbody tr:hover > td {
    background: #1a2113 !important;
    color: #f7faF2 !important;
    border-bottom-color: rgba(152, 219, 28, 0.18) !important;
}

/* Първата колона */
.sh-tbl tbody tr:hover > td:first-child {
    background: #1d2515 !important;
    color: #ffffff !important;
}

/* Името на параметъра */
.sh-tbl tbody tr:hover > td:first-child b {
    color: #ffffff !important;
}

/* Всички стойности */
.sh-tbl tbody tr:hover > td.mono {
    color: #e4ebdf !important;
}

/* Цена при hover */
.sh-tbl tbody tr:last-child:hover > td {
    background: #1b2412 !important;
}

.sh-tbl tbody tr:last-child:hover > td:first-child {
    background: #202a15 !important;
}

.sh-tbl tbody tr:last-child:hover > td:not(:first-child) b {
    color: #c4f76b !important;
    text-shadow:
        0 0 8px rgba(152, 219, 28, 0.35),
        0 0 18px rgba(152, 219, 28, 0.18) !important;
}

/* Лек зелен акцент по левия ръб на активния ред */
.sh-tbl tbody tr:hover > td:first-child {
    box-shadow:
        inset 3px 0 0 #7cbf00 !important;
}

/* Малко по-силен hover за самата стойност */
.sh-tbl tbody tr:hover > td.mono {
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.045),
            rgba(152, 219, 28, 0.02)
        ) !important;
}

/* Първата клетка да запази собствения си фон */
.sh-tbl tbody tr:hover > td:first-child {
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.10),
            #1d2515 35%
        ) !important;
}

/* Плавност */
.sh-tbl tbody td {
    transition:
        background-color 0.22s ease,
        color 0.22s ease,
        box-shadow 0.22s ease !important;
}



/* ==========================================================================
   SH-TBL — ЧЕТИМ HOVER
   ========================================================================== */

.sh-tbl tbody tr {
    transition: all 0.2s ease !important;
}

.sh-tbl tbody tr:hover > td {
    background: #202719 !important;
    color: #f5f8f1 !important;
}

/* Първа колона */
.sh-tbl tbody tr:hover > td:first-child {
    background: #252d1b !important;
    color: #ffffff !important;
    box-shadow: inset 3px 0 0 #7cbf00 !important;
}

.sh-tbl tbody tr:hover > td:first-child b {
    color: #ffffff !important;
}

/* Всички стойности */
.sh-tbl tbody tr:hover > td.mono {
    background: #202719 !important;
    color: #e9eee5 !important;
}

/* По-ясни bold елементи */
.sh-tbl tbody tr:hover > td b {
    color: #ffffff !important;
}

/* Последният ред — цени */
.sh-tbl tbody tr:last-child:hover > td {
    background: #222c17 !important;
    color: #ffffff !important;
}

.sh-tbl tbody tr:last-child:hover > td:first-child {
    background: #29351b !important;
}

.sh-tbl tbody tr:last-child:hover > td:not(:first-child) b {
    color: #bdf45a !important;
    text-shadow: 0 0 10px rgba(152, 219, 28, 0.25) !important;
}

/* Границата на активния ред */
.sh-tbl tbody tr:hover > td {
    border-bottom-color: rgba(152, 219, 28, 0.16) !important;
}

/* Плавен преход */
.sh-tbl tbody td {
    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        box-shadow 0.2s ease !important;
}

/*таблица*/


/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — WORDPRESS СРАВНЕНИЕ НА ПАКЕТИТЕ
   Само за .wp-tbl
   ========================================================================== */

.wp-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    border-radius: 18px !important;
    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* Горен зелен акцент */
.wp-tbl::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.wp-tbl table {
    width: 100% !important;
    min-width: 720px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    color: #d5d9cf !important;
    background: transparent !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.wp-tbl thead th {
    position: relative !important;
    padding: 20px 18px !important;
    background: #13180d !important;
    color: #f5f7f2 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.wp-tbl thead th:first-child {
    width: 32% !important;
    border-top-left-radius: 15px !important;
}

.wp-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.wp-tbl tbody td {
    padding: 17px 18px !important;
    background: #0d1109 !important;
    color: #cbd1c4 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;

    transition:
        background-color 0.22s ease,
        color 0.22s ease !important;
}

/* Име на характеристиката */
.wp-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

.wp-tbl tbody td:first-child b {
    color: inherit !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.wp-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #b7beb0 !important;
    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ВАЖНО: всички текстове стават светли, за да се четат
   ========================================================================== */

.wp-tbl tbody tr {
    transition: none !important;
}

.wp-tbl tbody tr:hover td {
    background: #20291a !important;
    color: #ffffff !important;
}

.wp-tbl tbody tr:hover td:first-child {
    background: #26321d !important;
    color: #ffffff !important;
}

.wp-tbl tbody tr:hover td:first-child b {
    color: #ffffff !important;
}

.wp-tbl tbody tr:hover td.mono {
    color: #e9f5dc !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — ЦЕНИ
   ========================================================================== */

.wp-tbl tbody tr:last-child td {
    background: #11160c !important;
    border-bottom: 0 !important;
}

.wp-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
}

.wp-tbl tbody tr:last-child td b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Hover върху ценовия ред */
.wp-tbl tbody tr:last-child:hover td {
    background: #26321d !important;
    color: #ffffff !important;
}

.wp-tbl tbody tr:last-child:hover td:first-child {
    background: #2c391f !important;
}

.wp-tbl tbody tr:last-child:hover td b {
    color: #c4f76b !important;
}

/* ==========================================================================
   ПРАЗНИ СТОЙНОСТИ
   ========================================================================== */

.wp-tbl tbody td.mono {
    color: #aeb5a5 !important;
}

.wp-tbl tbody tr:hover td.mono {
    color: #e9f5dc !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.wp-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.wp-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.wp-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.wp-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {
    .wp-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .wp-tbl table {
        min-width: 680px !important;
    }

    .wp-tbl thead th,
    .wp-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .wp-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .wp-tbl table {
        min-width: 650px !important;
    }

    .wp-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .wp-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .wp-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .wp-tbl .mono {
        font-size: 11.5px !important;
    }
}
/*таблица biznes-hosting/*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — СРАВНЕНИЕ НА ПАКЕТА
   Само за .bz-tbl
   ========================================================================== */

.bz-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    border-radius: 18px !important;
    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* Зелен светлинен акцент отгоре */
.bz-tbl::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.bz-tbl table {
    width: 100% !important;
    min-width: 620px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    color: #d5d9cf !important;
    background: transparent !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.bz-tbl thead th {
    position: relative !important;
    padding: 20px 18px !important;
    background: #13180d !important;
    color: #f5f7f2 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.bz-tbl thead th:first-child {
    width: 55% !important;
    border-top-left-radius: 15px !important;
}

.bz-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.bz-tbl tbody td {
    padding: 17px 18px !important;
    background: #0d1109 !important;
    color: #cbd1c4 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;

    transition:
        background-color 0.22s ease,
        color 0.22s ease !important;
}

/* Първа колона */
.bz-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

.bz-tbl tbody td:first-child b {
    color: inherit !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.bz-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #b7beb0 !important;
    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.bz-tbl tbody tr:hover td {
    background: #20291a !important;
    color: #ffffff !important;
}

.bz-tbl tbody tr:hover td:first-child {
    background: #26321d !important;
    color: #ffffff !important;
}

.bz-tbl tbody tr:hover td:first-child b {
    color: #ffffff !important;
}

.bz-tbl tbody tr:hover td.mono {
    color: #e9f5dc !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — ЦЕНА
   ========================================================================== */

.bz-tbl tbody tr:last-child td {
    background: #11160c !important;
    border-bottom: 0 !important;
}

.bz-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
}

.bz-tbl tbody tr:last-child td b {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Hover на цената */
.bz-tbl tbody tr:last-child:hover td {
    background: #26321d !important;
    color: #ffffff !important;
}

.bz-tbl tbody tr:last-child:hover td:first-child {
    background: #2c391f !important;
}

.bz-tbl tbody tr:last-child:hover td b {
    color: #c4f76b !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.bz-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.bz-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.bz-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.bz-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {
    .bz-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .bz-tbl table {
        min-width: 580px !important;
    }

    .bz-tbl thead th,
    .bz-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .bz-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .bz-tbl table {
        min-width: 540px !important;
    }

    .bz-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .bz-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .bz-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .bz-tbl .mono {
        font-size: 11.5px !important;
    }
}

/*таблица vps/*/

```css
/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — V1 SSD СРАВНЕНИЕ
   Само за .vp-tbl
   ========================================================================== */

.vp-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;

    border-radius: 18px !important;

    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;

    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;

    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* ==========================================================================
   ЗЕЛЕН ГОРЕН АКЦЕНТ
   ========================================================================== */

.vp-tbl::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.vp-tbl table {
    width: 100% !important;
    min-width: 620px !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    background: #0d1109 !important;
    color: #d5d9cf !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.vp-tbl thead th {
    position: relative !important;

    padding: 20px 18px !important;

    background: #13180d !important;
    color: #f5f7f2 !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;

    font-size: 14px !important;
    font-weight: 750 !important;

    text-align: left !important;
    white-space: nowrap !important;
}

.vp-tbl thead th:first-child {
    width: 55% !important;
    border-top-left-radius: 15px !important;
}

.vp-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.vp-tbl tbody td {
    padding: 17px 18px !important;

    background: #0d1109 !important;
    color: #cbd1c4 !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;

    font-size: 13px !important;
    line-height: 1.4 !important;

    vertical-align: middle !important;

    transition:
        background-color 0.22s ease,
        color 0.22s ease !important;
}

/* ==========================================================================
   ПЪРВА КОЛОНА
   ========================================================================== */

.vp-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;

    font-size: 13.5px !important;
    font-weight: 650 !important;

    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

.vp-tbl tbody td:first-child b {
    color: #f0f2ec !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.vp-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #b7beb0 !important;

    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.vp-tbl tbody tr:hover td {
    background: #20291a !important;
    color: #ffffff !important;
}

.vp-tbl tbody tr:hover td:first-child {
    background: #26321d !important;
    color: #ffffff !important;
}

.vp-tbl tbody tr:hover td:first-child b {
    color: #ffffff !important;
}

.vp-tbl tbody tr:hover td.mono {
    background: #20291a !important;
    color: #ffffff !important;
}

/* ==========================================================================
   ЦЕНОВИ РЕД
   Последният ред е "На месец"
   ========================================================================== */

.vp-tbl tbody tr:last-child td {
    background: #11160c !important;
    color: #ffffff !important;

    border-bottom: 0 !important;
}

.vp-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
}

.vp-tbl tbody tr:last-child td b {
    color: #ffffff !important;

    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Hover върху ценовия ред */
.vp-tbl tbody tr:last-child:hover td {
    background: #26321d !important;
    color: #ffffff !important;
}

.vp-tbl tbody tr:last-child:hover td:first-child {
    background: #2c391f !important;
}

.vp-tbl tbody tr:last-child:hover td b {
    color: #c4f76b !important;

    text-shadow:
        0 0 15px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   ПРАЗНИ СТОЙНОСТИ
   ========================================================================== */

.vp-tbl tbody td.mono {
    color: #aeb5a5 !important;
}

.vp-tbl tbody tr:hover td.mono {
    color: #e9f5dc !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.vp-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.vp-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.vp-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.vp-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .vp-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .vp-tbl table {
        min-width: 580px !important;
    }

    .vp-tbl thead th,
    .vp-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .vp-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;

        -webkit-overflow-scrolling: touch !important;
    }

    .vp-tbl table {
        min-width: 540px !important;
    }

    .vp-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .vp-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .vp-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .vp-tbl .mono {
        font-size: 11.5px !important;
    }
}
```

/*таблица */

```css
/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — RS1 СРАВНЕНИЕ
   Само за .rs-tbl
   ========================================================================== */

.rs-tbl {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important;

    border-radius: 18px !important;

    background: #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;

    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;

    scrollbar-width: thin !important;
    scrollbar-color: #536c22 #11150d !important;
}

/* ==========================================================================
   ЗЕЛЕН ГОРЕН АКЦЕНТ
   ========================================================================== */

.rs-tbl::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.rs-tbl table {
    width: 100% !important;
    min-width: 620px !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    background: #0d1109 !important;
    color: #d5d9cf !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.rs-tbl thead th {
    position: relative !important;

    padding: 20px 18px !important;

    background: #13180d !important;
    color: #f5f7f2 !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;

    font-size: 14px !important;
    font-weight: 750 !important;

    text-align: left !important;
    white-space: nowrap !important;
}

.rs-tbl thead th:first-child {
    width: 55% !important;
    border-top-left-radius: 15px !important;
}

.rs-tbl thead th:last-child {
    border-top-right-radius: 15px !important;
}

/* ==========================================================================
   BODY
   ========================================================================== */

.rs-tbl tbody td {
    padding: 17px 18px !important;

    background: #0d1109 !important;
    color: #cbd1c4 !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055) !important;

    font-size: 13px !important;
    line-height: 1.4 !important;

    vertical-align: middle !important;

    transition:
        background-color 0.22s ease,
        color 0.22s ease !important;
}

/* ==========================================================================
   ПЪРВА КОЛОНА
   ========================================================================== */

.rs-tbl tbody td:first-child {
    background: #10140d !important;
    color: #f0f2ec !important;

    font-size: 13.5px !important;
    font-weight: 650 !important;

    border-right: 1px solid rgba(255, 255, 255, 0.035) !important;
}

.rs-tbl tbody td:first-child b {
    color: #f0f2ec !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   MONO СТОЙНОСТИ
   ========================================================================== */

.rs-tbl .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #aeb5a5 !important;

    font-size: 12.5px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.rs-tbl tbody tr:hover td {
    background: #20291a !important;
    color: #ffffff !important;
}

.rs-tbl tbody tr:hover td:first-child {
    background: #26321d !important;
    color: #ffffff !important;
}

.rs-tbl tbody tr:hover td:first-child b {
    color: #ffffff !important;
}

.rs-tbl tbody tr:hover td.mono {
    background: #20291a !important;
    color: #e9f5dc !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — ЦЕНА
   ========================================================================== */

.rs-tbl tbody tr:last-child td {
    background: #11160c !important;
    color: #ffffff !important;

    border-bottom: 0 !important;
}

.rs-tbl tbody tr:last-child td:first-child {
    background: #141a0e !important;
}

.rs-tbl tbody tr:last-child td b {
    color: #ffffff !important;

    font-size: 14px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   HOVER НА ЦЕНАТА
   ========================================================================== */

.rs-tbl tbody tr:last-child:hover td {
    background: #26321d !important;
    color: #ffffff !important;
}

.rs-tbl tbody tr:last-child:hover td:first-child {
    background: #2c391f !important;
}

.rs-tbl tbody tr:last-child:hover td b {
    color: #c4f76b !important;

    text-shadow:
        0 0 15px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

.rs-tbl::-webkit-scrollbar {
    height: 8px !important;
}

.rs-tbl::-webkit-scrollbar-track {
    background: #11150d !important;
    border-radius: 10px !important;
}

.rs-tbl::-webkit-scrollbar-thumb {
    background: #536c22 !important;
    border-radius: 10px !important;
}

.rs-tbl::-webkit-scrollbar-thumb:hover {
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .rs-tbl {
        margin-top: 26px !important;
        border-radius: 15px !important;
    }

    .rs-tbl table {
        min-width: 580px !important;
    }

    .rs-tbl thead th,
    .rs-tbl tbody td {
        padding: 15px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .rs-tbl {
        margin-top: 22px !important;
        border-radius: 14px !important;

        -webkit-overflow-scrolling: touch !important;
    }

    .rs-tbl table {
        min-width: 540px !important;
    }

    .rs-tbl thead th {
        padding: 16px 12px !important;
        font-size: 12px !important;
    }

    .rs-tbl tbody td {
        padding: 14px 12px !important;
        font-size: 12px !important;
    }

    .rs-tbl tbody td:first-child {
        font-size: 12px !important;
    }

    .rs-tbl .mono {
        font-size: 11.5px !important;
    }
}
```

/*za-nas/*/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "ЕДНА ВЕЧЕР, В КОЯТО СГРЕШИХМЕ"
   Само за .zn-oops
   ========================================================================== */

.zn-oops {
    width: 100% !important;
    margin-top: 32px !important;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 18px !important;
    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(152, 219, 28, 0.055),
            transparent 32%
        ),
        #0d1109 !important;
    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
}

/* Горен електриково-зелен акцент */
.zn-oops::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    width: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 30%,
        #c4f76b 50%,
        #7cbf00 70%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   HEADER НА КАРТАТА
   ========================================================================== */

.zn-oops-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 20px 24px !important;
    background: #13180d !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
}

.zn-oops-h b {
    color: #c4f76b !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    letter-spacing: 0.01em !important;
}

.zn-oops-h span {
    color: #858d80 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   ОСНОВНО СЪДЪРЖАНИЕ
   ========================================================================== */

.zn-oops-b {
    padding: 30px 32px 32px !important;
    background: #0d1109 !important;
}

.zn-oops-b > p {
    margin: 0 0 18px !important;
    max-width: 900px !important;
    color: #bfc6b8 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.zn-oops-b > p:last-of-type {
    margin-bottom: 0 !important;
}

/* Удебелените части */
.zn-oops-b p b {
    color: #f1f5ec !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   БЛОК "КАКВО СЕ ПРОМЕНИ"
   ========================================================================== */

.zn-oops-after {
    margin-top: 30px !important;
    padding: 23px 24px 22px !important;
    position: relative !important;
    background:
        linear-gradient(
            135deg,
            rgba(152, 219, 28, 0.075),
            rgba(152, 219, 28, 0.025)
        ) !important;
    border: 1px solid rgba(152, 219, 28, 0.14) !important;
    border-radius: 14px !important;
    box-shadow:
        inset 3px 0 0 #7cbf00,
        0 8px 25px rgba(0, 0, 0, 0.18) !important;
}

.zn-oops-after > b {
    display: block !important;
    margin-bottom: 17px !important;
    color: #f2f6ed !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

.zn-oops-l {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.zn-oops-l li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 11px !important;
    min-width: 0 !important;
    color: #aeb6a7 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

.zn-oops-l li i {
    flex: 0 0 7px !important;
    width: 7px !important;
    height: 7px !important;
    margin-top: 7px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow:
        0 0 0 3px rgba(152, 219, 28, 0.08),
        0 0 12px rgba(152, 219, 28, 0.35) !important;
}

.zn-oops-l li span {
    color: #adb5a5 !important;
}

.zn-oops-l li span b {
    color: #e8f2df !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-oops-l li {
    transition:
        color 0.2s ease,
        transform 0.2s ease !important;
}

.zn-oops-l li:hover {
    transform: translateX(3px) !important;
}

.zn-oops-l li:hover span {
    color: #dce5d6 !important;
}

.zn-oops-l li:hover i {
    background: #c4f76b !important;
    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.09),
        0 0 16px rgba(152, 219, 28, 0.5) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .zn-oops {
        margin-top: 26px !important;
        border-radius: 16px !important;
    }

    .zn-oops-h {
        padding: 18px 20px !important;
    }

    .zn-oops-b {
        padding: 25px 24px 27px !important;
    }

    .zn-oops-b > p {
        font-size: 14px !important;
        line-height: 1.7 !important;
    }

    .zn-oops-after {
        padding: 21px !important;
    }

    .zn-oops-l {
        gap: 13px 20px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-oops {
        margin-top: 22px !important;
        border-radius: 14px !important;
    }

    .zn-oops-h {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 6px !important;
        padding: 17px 17px !important;
    }

    .zn-oops-h b {
        font-size: 12px !important;
    }

    .zn-oops-h span {
        font-size: 11px !important;
    }

    .zn-oops-b {
        padding: 22px 17px 19px !important;
    }

    .zn-oops-b > p {
        margin-bottom: 16px !important;
        font-size: 13px !important;
        line-height: 1.7 !important;
    }

    .zn-oops-after {
        margin-top: 24px !important;
        padding: 19px 17px 18px !important;
        border-radius: 12px !important;
    }

    .zn-oops-after > b {
        margin-bottom: 15px !important;
        font-size: 13px !important;
    }

    .zn-oops-l {
        grid-template-columns: 1fr !important;
        gap: 13px !important;
    }

    .zn-oops-l li {
        font-size: 12.5px !important;
        line-height: 1.55 !important;
    }
}


/*за нас*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — ЕКИП
   Само за .zn-crew
   ========================================================================== */

.zn-crew {
    width: 100% !important;
    margin-top: 32px !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

.zn-crew {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

.zn-crew-i {
    position: relative !important;
    min-width: 0 !important;
    padding: 26px 22px 23px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    background: #ffffff !important;
    border: 1px solid #e4e8df !important;
    border-radius: 16px !important;

    box-shadow:
        0 8px 25px rgba(20, 28, 15, 0.055),
        0 1px 2px rgba(20, 28, 15, 0.04) !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Зелен акцент отгоре */
.zn-crew-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 22px !important;
    right: 22px !important;
    height: 2px !important;
    border-radius: 0 0 4px 4px !important;
    background: #7cbf00 !important;
    opacity: 0.75 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-crew-i:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(152, 219, 28, 0.42) !important;
    box-shadow:
        0 16px 35px rgba(20, 28, 15, 0.09),
        0 0 0 3px rgba(152, 219, 28, 0.055) !important;
}

.zn-crew-i:hover::before {
    opacity: 1 !important;
    box-shadow: 0 0 10px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   АВАТАР
   ========================================================================== */

.zn-crew-av {
    width: 48px !important;
    height: 48px !important;
    margin-bottom: 17px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background:
        linear-gradient(
            135deg,
            #dff7a7 0%,
            #b9ea61 100%
        ) !important;

    color: #24310f !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    letter-spacing: 0.02em !important;

    border: 1px solid rgba(152, 219, 28, 0.3) !important;

    box-shadow:
        0 5px 15px rgba(152, 219, 28, 0.13) !important;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease !important;
}

.zn-crew-i:hover .zn-crew-av {
    transform: scale(1.05) !important;
    box-shadow:
        0 7px 20px rgba(152, 219, 28, 0.22) !important;
}

/* ==========================================================================
   ИМЕ
   ========================================================================== */

.zn-crew-i > b {
    display: block !important;
    margin-bottom: 7px !important;

    color: #171c14 !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ДЛЪЖНОСТ
   ========================================================================== */

.zn-crew-role {
    display: block !important;

    color: #626b5d !important;
    font-size: 12.5px !important;
    line-height: 1.6 !important;
}

/* ==========================================================================
   ОТ КОГА
   ========================================================================== */

.zn-crew-since {
    display: inline-flex !important;
    align-items: center !important;

    margin-top: 18px !important;
    padding: 5px 9px !important;

    border-radius: 999px !important;

    background: #f2f6ec !important;
    border: 1px solid #e2eacc !important;

    color: #617329 !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   БЕЛЕЖКА ПОД ЕКИПА
   ========================================================================== */

.zn-crew-note {
    grid-column: 1 / -1 !important;

    margin: 6px 0 0 !important;
    padding: 18px 22px !important;

    color: #667064 !important;
    background: #f7f9f4 !important;

    border: 1px solid #e4e8df !important;
    border-radius: 13px !important;

    font-size: 12.5px !important;
    line-height: 1.65 !important;
}

.zn-crew-note b {
    color: #283021 !important;
    font-weight: 750 !important;
}

/* Малка зелена линия в бележката */
.zn-crew-note::before {
    content: "" !important;
    display: inline-block !important;
    width: 6px !important;
    height: 6px !important;
    margin-right: 9px !important;
    vertical-align: 1px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 8px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1000px) {

    .zn-crew {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
    }

    .zn-crew-i {
        padding: 23px 20px 21px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-crew {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        margin-top: 22px !important;
    }

    .zn-crew-i {
        padding: 21px 18px 19px !important;
        border-radius: 14px !important;
    }

    .zn-crew-i::before {
        left: 18px !important;
        right: 18px !important;
    }

    .zn-crew-av {
        width: 44px !important;
        height: 44px !important;
        margin-bottom: 14px !important;
        border-radius: 11px !important;
        font-size: 12px !important;
    }

    .zn-crew-i > b {
        font-size: 14px !important;
    }

    .zn-crew-role {
        font-size: 12px !important;
    }

    .zn-crew-since {
        margin-top: 15px !important;
    }

    .zn-crew-note {
        margin-top: 3px !important;
        padding: 16px 17px !important;
        font-size: 12px !important;
    }
}
/*за нас*/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — DATA CENTER
   Само за .zn-dc
   ========================================================================== */

.zn-dc {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr) !important;
    gap: 24px !important;
    align-items: stretch !important;
}

/* ==========================================================================
   ЛЯВА ЧАСТ
   ========================================================================== */

.zn-dc > div:first-child {
    position: relative !important;
    padding: 32px !important;
    background: #ffffff !important;
    border: 1px solid #e4e8df !important;
    border-radius: 18px !important;
    box-shadow:
        0 10px 30px rgba(20, 28, 15, 0.055),
        0 1px 2px rgba(20, 28, 15, 0.04) !important;
}

/* Зелената линия отгоре */
.zn-dc > div:first-child::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 28px !important;
    right: 28px !important;
    height: 2px !important;
    border-radius: 0 0 5px 5px !important;
    background: #7cbf00 !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

.zn-dc > div:first-child h2 {
    margin: 0 0 10px !important;
    color: #171c14 !important;
    font-size: 22px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
}

.zn-dc > div:first-child > p {
    margin: 0 !important;
    max-width: 720px !important;
    color: #626b5d !important;
    font-size: 13.5px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

.zn-dc-l {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 24px !important;
    margin-top: 27px !important;
}

.zn-dc-r {
    display: flex !important;
    align-items: flex-start !important;
    gap: 11px !important;
    min-width: 0 !important;
    padding: 13px 0 !important;
    border-top: 1px solid #edf0ea !important;
}

.zn-dc-r i {
    flex: 0 0 7px !important;
    width: 7px !important;
    height: 7px !important;
    margin-top: 7px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.09),
        0 0 10px rgba(152, 219, 28, 0.22) !important;
}

.zn-dc-r span {
    color: #626b5d !important;
    font-size: 12.5px !important;
    line-height: 1.6 !important;
}

.zn-dc-r b {
    color: #252c20 !important;
    font-weight: 750 !important;
}

/* Hover на ред */
.zn-dc-r {
    transition:
        transform 0.2s ease,
        border-color 0.2s ease !important;
}

.zn-dc-r:hover {
    transform: translateX(3px) !important;
    border-color: rgba(152, 219, 28, 0.4) !important;
}

.zn-dc-r:hover i {
    background: #7fbe0d !important;
    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.11),
        0 0 13px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   PING КАРТА
   ========================================================================== */

.zn-ping {
    position: relative !important;
    padding: 27px 26px 24px !important;
    background: #f8faf6 !important;
    border: 1px solid #dfe5d9 !important;
    border-radius: 18px !important;
    box-shadow:
        0 10px 30px rgba(20, 28, 15, 0.055),
        0 1px 2px rgba(20, 28, 15, 0.035) !important;
    overflow: hidden !important;
}

/* Зелен акцент */
.zn-ping::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;
    height: 2px !important;
    border-radius: 0 0 5px 5px !important;
    background: #7cbf00 !important;
}

/* Лек glow */
.zn-ping::after {
    content: "" !important;
    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    top: -100px !important;
    right: -70px !important;
    border-radius: 50% !important;
    background: rgba(152, 219, 28, 0.08) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   PING HEADER
   ========================================================================== */

.zn-ping-h {
    margin-bottom: 23px !important;
    color: #20271b !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   PING РЕДОВЕ
   ========================================================================== */

.zn-ping-r {
    display: grid !important;
    grid-template-columns: 82px minmax(0, 1fr) 43px !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 14px !important;
}

.zn-ping-city {
    color: #4e5749 !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
}

.zn-ping-bar {
    position: relative !important;
    display: block !important;
    height: 7px !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    background: #e4e9df !important;
}

.zn-ping-fill {
    display: block !important;
    height: 100% !important;
    border-radius: inherit !important;
    background:
        linear-gradient(
            90deg,
            #79b80d,
            #7cbf00
        ) !important;
    box-shadow: 0 0 8px rgba(152, 219, 28, 0.25) !important;
}

.zn-ping-fill.far {
    background: #aeb6a5 !important;
    box-shadow: none !important;
}

.zn-ping-ms {
    color: #27301f !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    text-align: right !important;
}

/* ==========================================================================
   HOVER НА PING РЕД
   ========================================================================== */

.zn-ping-r {
    transition:
        transform 0.2s ease,
        opacity 0.2s ease !important;
}

.zn-ping-r:hover {
    transform: translateX(3px) !important;
}

.zn-ping-r:hover .zn-ping-city,
.zn-ping-r:hover .zn-ping-ms {
    color: #1c2417 !important;
}

.zn-ping-r:hover .zn-ping-fill:not(.far) {
    background: #7fbe0d !important;
}

/* ==========================================================================
   ОБЯСНЕНИЕ
   ========================================================================== */

.zn-ping-note {
    margin: 20px 0 0 !important;
    padding: 14px 15px !important;

    color: #747d70 !important;
    background: #ffffff !important;

    border: 1px solid #e5e9e1 !important;
    border-radius: 11px !important;

    font-size: 11px !important;
    line-height: 1.6 !important;
}

.zn-ping-note::before {
    content: "" !important;
    display: inline-block !important;
    width: 5px !important;
    height: 5px !important;
    margin-right: 7px !important;
    vertical-align: 1px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 950px) {

    .zn-dc {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .zn-dc > div:first-child {
        padding: 28px 26px !important;
    }

    .zn-ping {
        padding: 25px 24px 22px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-dc {
        gap: 12px !important;
    }

    .zn-dc > div:first-child {
        padding: 24px 18px !important;
        border-radius: 14px !important;
    }

    .zn-dc > div:first-child::before {
        left: 18px !important;
        right: 18px !important;
    }

    .zn-dc > div:first-child h2 {
        font-size: 19px !important;
    }

    .zn-dc > div:first-child > p {
        font-size: 12.5px !important;
        line-height: 1.65 !important;
    }

    .zn-dc-l {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
        margin-top: 21px !important;
    }

    .zn-dc-r {
        padding: 12px 0 !important;
    }

    .zn-dc-r span {
        font-size: 12px !important;
    }

    .zn-ping {
        padding: 22px 17px 18px !important;
        border-radius: 14px !important;
    }

    .zn-ping::before {
        left: 18px !important;
        right: 18px !important;
    }

    .zn-ping-h {
        margin-bottom: 20px !important;
    }

    .zn-ping-r {
        grid-template-columns: 70px minmax(0, 1fr) 39px !important;
        gap: 9px !important;
        margin-bottom: 13px !important;
    }

    .zn-ping-city,
    .zn-ping-ms {
        font-size: 10.5px !important;
    }

    .zn-ping-bar {
        height: 6px !important;
    }

    .zn-ping-note {
        margin-top: 17px !important;
        padding: 12px 13px !important;
        font-size: 10.5px !important;
    }
}

/*за нас */


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — КАК ПЕЧЕЛИМ ПАРИ
   Само за .zn-money
   ========================================================================== */

.zn-money {
    width: 100% !important;
    margin-top: 32px !important;
}

/* ==========================================================================
   КАРТИ
   ========================================================================== */

.zn-money {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
}

.zn-money-i {
    position: relative !important;
    padding: 26px 24px !important;
    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 18px !important;
    box-shadow:
        0 10px 30px rgba(18, 25, 12, 0.07),
        0 1px 2px rgba(18, 25, 12, 0.04) !important;
    overflow: hidden !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease !important;
}

/* Зелената линия отгоре */
.zn-money-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;
    height: 3px !important;
    border-radius: 0 0 5px 5px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 14px rgba(152, 219, 28, 0.25) !important;
}

/* Hover */
.zn-money-i:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(152, 219, 28, 0.55) !important;
    box-shadow:
        0 18px 42px rgba(18, 25, 12, 0.11),
        0 0 0 1px rgba(152, 219, 28, 0.08) !important;
}

/* ==========================================================================
   HEADER НА КАРТАТА
   ========================================================================== */

.zn-money-h {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 15px !important;
}

.zn-money-h b {
    color: #171b15 !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

.zn-money-ic {
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 11px !important;

    background: rgba(152, 219, 28, 0.13) !important;
    color: #5f8f08 !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;
}

.zn-money-ic svg {
    width: 19px !important;
    height: 19px !important;
    display: block !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

.zn-money-i p {
    margin: 0 !important;
    color: #687064 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   КАРТИ "НЕ"
   ========================================================================== */

.zn-money-i.no {
    background: #f8faf7 !important;
    border-color: #e0e5dc !important;
}

.zn-money-i.no::before {
    background: #7cbf00 !important;
}

.zn-money-i.no .zn-money-ic {
    background: #eef5e8 !important;
    color: #668d18 !important;
    border-color: #dce8d2 !important;
}

.zn-money-i.no:hover {
    background: #ffffff !important;
}

/* ==========================================================================
   ДОЛЕН ТЕКСТ
   ========================================================================== */

.zn-money-end {
    grid-column: 1 / -1 !important;

    margin-top: 2px !important;
    padding: 22px 26px !important;

    background: #f3f6f0 !important;
    border: 1px solid #dfe6d9 !important;
    border-left: 4px solid #7cbf00 !important;
    border-radius: 15px !important;

    color: #5f685b !important;
    font-size: 14px !important;
    line-height: 1.7 !important;

    box-shadow:
        0 8px 24px rgba(18, 25, 12, 0.045) !important;
}

.zn-money-end b {
    color: #1c2319 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .zn-money {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 15px !important;
    }

    .zn-money-i {
        padding: 23px 21px !important;
    }

    .zn-money-end {
        grid-column: 1 / -1 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-money {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin-top: 24px !important;
    }

    .zn-money-i {
        padding: 22px 20px !important;
        border-radius: 15px !important;
    }

    .zn-money-i::before {
        left: 20px !important;
        right: 20px !important;
    }

    .zn-money-h {
        gap: 10px !important;
        margin-bottom: 12px !important;
    }

    .zn-money-h b {
        font-size: 15px !important;
    }

    .zn-money-i p {
        font-size: 13.5px !important;
        line-height: 1.6 !important;
    }

    .zn-money-ic {
        width: 35px !important;
        height: 35px !important;
        flex-basis: 35px !important;
        border-radius: 10px !important;
    }

    .zn-money-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    .zn-money-end {
        padding: 19px 18px !important;
        font-size: 13.5px !important;
        line-height: 1.65 !important;
        border-radius: 13px !important;
    }
}


/**/


 /* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — ЗА КОГО НЕ СМЕ
   Само за .zn-notfor
   ========================================================================== */

.zn-notfor {
    width: 100% !important;
    margin-top: 32px !important;
    padding: 28px !important;

    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 20px !important;

    box-shadow:
        0 12px 35px rgba(18, 25, 12, 0.07),
        0 1px 2px rgba(18, 25, 12, 0.04) !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.zn-notfor-h {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;

    padding-bottom: 22px !important;
    margin-bottom: 22px !important;

    border-bottom: 1px solid #e7ebe4 !important;
}

.zn-notfor-h b {
    color: #171b15 !important;
    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

.zn-notfor-ic {
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    color: #638e13 !important;
    background: rgba(152, 219, 28, 0.13) !important;
    border: 1px solid rgba(152, 219, 28, 0.25) !important;
}

.zn-notfor-ic svg {
    width: 20px !important;
    height: 20px !important;
    display: block !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

.zn-notfor-l {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

/* ==========================================================================
   ITEM
   ========================================================================== */

.zn-notfor-i {
    position: relative !important;

    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;

    padding: 21px 20px !important;

    background: #f7f9f5 !important;
    border: 1px solid #e3e8df !important;
    border-radius: 15px !important;

    transition:
        transform 0.25s ease,
        background-color 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Малък зелен индикатор */
.zn-notfor-i > i {
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    flex: 0 0 7px !important;

    margin-top: 7px !important;

    border-radius: 50% !important;
    background: #7cbf00 !important;

    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.12),
        0 0 12px rgba(152, 219, 28, 0.22) !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

.zn-notfor-i > span {
    min-width: 0 !important;
    display: block !important;
}

.zn-notfor-i > span > b {
    display: block !important;

    margin: 0 0 7px !important;

    color: #1a2017 !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
}

.zn-notfor-i p {
    margin: 0 !important;

    color: #697166 !important;
    font-size: 13.5px !important;
    line-height: 1.62 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-notfor-i:hover {
    transform: translateY(-3px) !important;

    background: #ffffff !important;
    border-color: rgba(152, 219, 28, 0.48) !important;

    box-shadow:
        0 12px 28px rgba(18, 25, 12, 0.08),
        0 0 0 1px rgba(152, 219, 28, 0.06) !important;
}

.zn-notfor-i:hover > i {
    background: #7cbf00 !important;

    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.14),
        0 0 16px rgba(152, 219, 28, 0.35) !important;
}

.zn-notfor-i:hover > span > b {
    color: #11150e !important;
}

.zn-notfor-i:hover p {
    color: #596253 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .zn-notfor {
        padding: 23px !important;
        border-radius: 17px !important;
    }

    .zn-notfor-l {
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;
    }

    .zn-notfor-i {
        padding: 19px 17px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-notfor {
        margin-top: 24px !important;
        padding: 18px !important;
        border-radius: 15px !important;
    }

    .zn-notfor-h {
        gap: 10px !important;
        padding-bottom: 18px !important;
        margin-bottom: 18px !important;
    }

    .zn-notfor-h b {
        font-size: 15px !important;
    }

    .zn-notfor-ic {
        width: 36px !important;
        height: 36px !important;
        flex-basis: 36px !important;
        border-radius: 10px !important;
    }

    .zn-notfor-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .zn-notfor-l {
        grid-template-columns: 1fr !important;
        gap: 11px !important;
    }

    .zn-notfor-i {
        gap: 12px !important;
        padding: 18px 16px !important;
        border-radius: 13px !important;
    }

    .zn-notfor-i > span > b {
        font-size: 14px !important;
        margin-bottom: 6px !important;
    }

    .zn-notfor-i p {
        font-size: 13px !important;
        line-height: 1.58 !important;
    }

    .zn-notfor-i > i {
        width: 6px !important;
        height: 6px !important;
        flex-basis: 6px !important;
        margin-top: 6px !important;
    }
}

/*за нас*/

 /* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — КАК СТИГНАХМЕ ДОТУК
   Само за .zn-road
   ========================================================================== */

.zn-road {
    width: 100% !important;
    margin-top: 34px !important;
    position: relative !important;
}

/* ==========================================================================
   TIMELINE
   ========================================================================== */

.zn-road-r {
    display: grid !important;
    grid-template-columns: 90px 34px minmax(0, 1fr) !important;
    column-gap: 18px !important;
    position: relative !important;
    min-height: 108px !important;
}

/* ==========================================================================
   ГОДИНА
   ========================================================================== */

.zn-road-y {
    display: block !important;
    padding-top: 4px !important;

    color: #66705f !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2px !important;
    text-align: right !important;
}

/* Днешната година */
.zn-road-r.now .zn-road-y {
    color: #6d9c0b !important;
}

/* ==========================================================================
   ЦЕНТРАЛНА ЛИНИЯ
   ========================================================================== */

.zn-road-d {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    width: 34px !important;
}

/* Вертикална линия */
.zn-road-d::before {
    content: "" !important;
    position: absolute !important;

    top: 12px !important;
    bottom: -12px !important;
    left: 50% !important;

    width: 1px !important;
    transform: translateX(-50%) !important;

    background: #dce3d7 !important;
}

/* Премахване на линията от последния елемент */
.zn-road-r:last-child .zn-road-d::before {
    display: none !important;
}

/* ==========================================================================
   ТОЧКА
   ========================================================================== */

.zn-road-d i {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    width: 12px !important;
    height: 12px !important;

    margin-top: 4px !important;

    border-radius: 50% !important;

    background: #ffffff !important;
    border: 3px solid #7cbf00 !important;

    box-shadow:
        0 0 0 4px rgba(152, 219, 28, 0.12),
        0 0 12px rgba(152, 219, 28, 0.18) !important;
}

/* Активна точка за "днес" */
.zn-road-r.now .zn-road-d i {
    width: 14px !important;
    height: 14px !important;
    margin-top: 3px !important;

    background: #7cbf00 !important;
    border-color: #7cbf00 !important;

    box-shadow:
        0 0 0 5px rgba(152, 219, 28, 0.14),
        0 0 18px rgba(152, 219, 28, 0.35) !important;
}

/* ==========================================================================
   СЪДЪРЖАНИЕ
   ========================================================================== */

.zn-road-t {
    display: block !important;

    margin-bottom: 22px !important;
    padding: 20px 22px !important;

    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 15px !important;

    box-shadow:
        0 8px 25px rgba(18, 25, 12, 0.055),
        0 1px 2px rgba(18, 25, 12, 0.03) !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Заглавие */
.zn-road-t > b {
    display: block !important;

    margin-bottom: 7px !important;

    color: #171c15 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* Описание */
.zn-road-t > span {
    display: block !important;

    color: #697267 !important;
    font-size: 13.5px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-road-r:hover .zn-road-t {
    transform: translateX(4px) !important;

    border-color: rgba(152, 219, 28, 0.5) !important;

    box-shadow:
        0 12px 30px rgba(18, 25, 12, 0.08),
        0 0 0 1px rgba(152, 219, 28, 0.05) !important;
}

.zn-road-r:hover .zn-road-d i {
    background: #7cbf00 !important;

    box-shadow:
        0 0 0 5px rgba(152, 219, 28, 0.14),
        0 0 18px rgba(152, 219, 28, 0.3) !important;
}

.zn-road-r:hover .zn-road-y {
    color: #628c0a !important;
}

/* ==========================================================================
   ДНЕШЕН ЕЛЕМЕНТ
   ========================================================================== */

.zn-road-r.now .zn-road-t {
    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbfdf9 100%
        ) !important;

    border-color: rgba(152, 219, 28, 0.4) !important;

    box-shadow:
        0 10px 30px rgba(18, 25, 12, 0.07),
        0 0 0 1px rgba(152, 219, 28, 0.06) !important;
}

.zn-road-r.now .zn-road-t > b {
    color: #253018 !important;
}

/* Малък зелен акцент в днешната карта */
.zn-road-r.now .zn-road-t::before {
    content: "" !important;
    display: block !important;

    width: 34px !important;
    height: 3px !important;

    margin-bottom: 14px !important;

    border-radius: 4px !important;
    background: #7cbf00 !important;

    box-shadow: 0 0 10px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .zn-road {
        margin-top: 28px !important;
    }

    .zn-road-r {
        grid-template-columns: 72px 30px minmax(0, 1fr) !important;
        column-gap: 14px !important;
        min-height: 105px !important;
    }

    .zn-road-d {
        width: 30px !important;
    }

    .zn-road-t {
        padding: 18px 19px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .zn-road {
        margin-top: 24px !important;
    }

    .zn-road-r {
        grid-template-columns: 52px 25px minmax(0, 1fr) !important;
        column-gap: 10px !important;
        min-height: 0 !important;
    }

    .zn-road-y {
        padding-top: 3px !important;
        font-size: 11px !important;
    }

    .zn-road-d {
        width: 25px !important;
    }

    .zn-road-d i {
        width: 10px !important;
        height: 10px !important;
        margin-top: 4px !important;
        border-width: 2px !important;
    }

    .zn-road-r.now .zn-road-d i {
        width: 12px !important;
        height: 12px !important;
    }

    .zn-road-t {
        margin-bottom: 14px !important;
        padding: 17px 16px !important;
        border-radius: 13px !important;
    }

    .zn-road-t > b {
        font-size: 14px !important;
        line-height: 1.4 !important;
        margin-bottom: 6px !important;
    }

    .zn-road-t > span {
        font-size: 12.5px !important;
        line-height: 1.6 !important;
    }

    .zn-road-r:hover .zn-road-t {
        transform: none !important;
    }

    .zn-road-r.now .zn-road-t::before {
        width: 28px !important;
        height: 2px !important;
        margin-bottom: 12px !important;
    }
}

/*за нас*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — ФИРМАТА, ОФИЦИАЛНО
   Само за .zn-firm
   ========================================================================== */

.zn-firm {
    width: 100% !important;
    position: relative !important;
    padding: 30px 32px !important;
    border-radius: 18px !important;

    background: #ffffff !important;
    border: 1px solid #e5e9e1 !important;

    box-shadow:
        0 14px 40px rgba(25, 35, 20, 0.08),
        0 2px 8px rgba(25, 35, 20, 0.04) !important;

    box-sizing: border-box !important;
}

/* Зелен акцент отгоре */
.zn-firm::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 3px !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    border-radius: 18px 18px 0 0 !important;

    background: linear-gradient(
        90deg,
        transparent 0%,
        #7fbe16 30%,
        #7cbf00 50%,
        #7fbe16 70%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.zn-firm-h {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;

    padding-bottom: 22px !important;
    margin-bottom: 4px !important;

    color: #20261c !important;
    border-bottom: 1px solid #edf0eb !important;
}

.zn-firm-h b {
    color: #20261c !important;
    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;
}

/* Иконка */
.zn-firm-ic {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    color: #6d9f13 !important;
    background: #f1f8e6 !important;
    border: 1px solid #dcebc3 !important;
}

.zn-firm-ic svg {
    width: 20px !important;
    height: 20px !important;
    display: block !important;
}

/* ==========================================================================
   INFORMATION GRID
   ========================================================================== */

.zn-firm-g {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 42px !important;
}

/* ==========================================================================
   ROW
   ========================================================================== */

.zn-firm-r {
    min-height: 64px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;

    padding: 16px 16px !important;

    border-bottom: 1px solid #edf0eb !important;

    transition:
        background-color 0.2s ease,
        padding-left 0.2s ease,
        padding-right 0.2s ease !important;
}

.zn-firm-r span {
    color: #7b8376 !important;
    font-size: 13px !important;
    font-weight: 550 !important;
    white-space: nowrap !important;
}

.zn-firm-r b {
    color: #252b22 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-align: right !important;
    line-height: 1.4 !important;
}

/* ==========================================================================
   MONO
   ========================================================================== */

.zn-firm-r .mono {
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;

    color: #536047 !important;
    font-size: 13px !important;
    letter-spacing: -0.1px !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.zn-firm-r:hover {
    background: #f7faF3 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    border-radius: 8px !important;
}

.zn-firm-r:hover span {
    color: #68715f !important;
}

.zn-firm-r:hover b {
    color: #5f8e0e !important;
}

.zn-firm-r:hover .mono {
    color: #5f8e0e !important;
}

/* ==========================================================================
   ПОСЛЕДНИТЕ РЕДОВЕ
   ========================================================================== */

.zn-firm-r:nth-last-child(-n+2) {
    border-bottom: 0 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {
    .zn-firm {
        padding: 26px 24px !important;
        border-radius: 16px !important;
    }

    .zn-firm-g {
        column-gap: 28px !important;
    }

    .zn-firm-r {
        gap: 14px !important;
    }

    .zn-firm-r b {
        font-size: 13.5px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {
    .zn-firm {
        padding: 22px 18px !important;
        border-radius: 14px !important;
    }

    .zn-firm-h {
        padding-bottom: 18px !important;
    }

    .zn-firm-h b {
        font-size: 15px !important;
    }

    .zn-firm-ic {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        border-radius: 9px !important;
    }

    .zn-firm-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .zn-firm-g {
        grid-template-columns: 1fr !important;
    }

    .zn-firm-r {
        min-height: auto !important;
        padding: 14px 0 !important;
        align-items: flex-start !important;
    }

    .zn-firm-r span {
        font-size: 12px !important;
    }

    .zn-firm-r b {
        max-width: 60% !important;
        font-size: 13px !important;
    }

    .zn-firm-r .mono {
        font-size: 12px !important;
    }

    .zn-firm-r:nth-last-child(-n+2) {
        border-bottom: 1px solid #edf0eb !important;
    }

    .zn-firm-r:last-child {
        border-bottom: 0 !important;
    }

    .zn-firm-r:hover {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}


/*za-agencii/*/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — СТЪПАЛА ЗА ОТСТЪПКА
   Само за #stapala
   ========================================================================== */

#stapala {
    position: relative !important;
}

/* ==========================================================================
   HEADER — само вътре в тази секция
   ========================================================================== */

#stapala .sh {
    margin-bottom: 32px !important;
}

#stapala .sh h2 {
    margin-bottom: 10px !important;
    color: #20261c !important;
}

#stapala .sh p {
    color: #737b6e !important;
}

/* ==========================================================================
   TIERS CONTAINER
   ========================================================================== */

#stapala .ptiers {
    width: 100% !important;

    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;

    align-items: stretch !important;
}

/* ==========================================================================
   TIER CARD
   ========================================================================== */

#stapala .ptier {
    position: relative !important;

    min-width: 0 !important;
    min-height: 220px !important;
    padding: 28px 26px 25px !important;

    display: flex !important;
    flex-direction: column !important;

    border-radius: 17px !important;
    border: 1px solid #e3e8df !important;

    background: #ffffff !important;

    box-shadow:
        0 12px 35px rgba(28, 38, 23, 0.06),
        0 2px 7px rgba(28, 38, 23, 0.035) !important;

    box-sizing: border-box !important;

    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease,
        border-color 0.22s ease,
        background-color 0.22s ease !important;
}

/* Малък зелен акцент в горната част */
#stapala .ptier::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;

    height: 3px !important;

    border-radius: 0 0 5px 5px !important;

    background: #dfe8d1 !important;

    transition:
        background 0.22s ease,
        box-shadow 0.22s ease !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

#stapala .ptier:hover {
    transform: translateY(-5px) !important;

    border-color: #cbdcab !important;

    box-shadow:
        0 18px 45px rgba(55, 75, 35, 0.10),
        0 4px 12px rgba(55, 75, 35, 0.05) !important;
}

#stapala .ptier:hover::before {
    background: #7cbf00 !important;
    box-shadow: 0 0 12px rgba(152, 219, 28, 0.25) !important;
}

/* ==========================================================================
   АКТИВНА / НАЙ-ЧЕСТО КАРТА
   ========================================================================== */

#stapala .ptier.is-on {
    border-color: rgba(126, 174, 32, 0.42) !important;

    background:
        linear-gradient(
            180deg,
            #fbfef7 0%,
            #ffffff 100%
        ) !important;

    box-shadow:
        0 16px 42px rgba(83, 112, 40, 0.11),
        0 0 0 1px rgba(152, 219, 28, 0.06) inset !important;
}

#stapala .ptier.is-on::before {
    background: linear-gradient(
        90deg,
        #7fbd14,
        #7cbf00,
        #7fbd14
    ) !important;

    box-shadow:
        0 0 14px rgba(152, 219, 28, 0.30) !important;
}

#stapala .ptier.is-on:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(126, 174, 32, 0.62) !important;

    box-shadow:
        0 22px 50px rgba(83, 112, 40, 0.14),
        0 0 0 1px rgba(152, 219, 28, 0.08) inset !important;
}

/* ==========================================================================
   TAG — НАЙ-ЧЕСТО
   ========================================================================== */

#stapala .ptier-tag {
    position: absolute !important;
    top: 17px !important;
    right: 18px !important;

    display: inline-flex !important;
    align-items: center !important;

    padding: 5px 9px !important;

    border-radius: 999px !important;

    background: #eef8df !important;
    border: 1px solid #dcebc2 !important;

    color: #67940f !important;

    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: 0.25px !important;
    text-transform: uppercase !important;
}

/* ==========================================================================
   TIER NAME
   ========================================================================== */

#stapala .ptier-n {
    margin-bottom: 17px !important;
    padding-right: 85px !important;

    color: #252b21 !important;

    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
margin-top: 20px;
}

/* ==========================================================================
   PRICE / DISCOUNT
   ========================================================================== */

#stapala .ptier-p {
    margin: 0 0 15px !important;

    color: #737c6d !important;

    font-size: 14px !important;
    line-height: 1.3 !important;
    font-weight: 550 !important;
}

#stapala .ptier-p b {
    color: #6d9f12 !important;

    font-size: 30px !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    letter-spacing: -0.8px !important;
}

/* Активната карта — малко по-силен зелен акцент */
#stapala .ptier.is-on .ptier-p b {
    color: #609000 !important;

    text-shadow:
        0 0 18px rgba(152, 219, 28, 0.15) !important;
}

/* ==========================================================================
   DESCRIPTION
   ========================================================================== */

#stapala .ptier p {
    margin: auto 0 0 !important;

    padding-top: 18px !important;

    color: #737b70 !important;

    font-size: 13px !important;
    line-height: 1.65 !important;
    font-weight: 450 !important;

    border-top: 1px solid #edf0eb !important;
}

#stapala .ptier:hover p {
    color: #626b5e !important;
}

/* ==========================================================================
   NOTE
   ========================================================================== */

#stapala .plan-note {
    margin: 20px 0 0 !important;

    color: #899185 !important;

    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    #stapala .ptiers {
        gap: 14px !important;
    }

    #stapala .ptier {
        min-height: 210px !important;
        padding: 25px 20px 22px !important;
    }

    #stapala .ptier-n {
        padding-right: 65px !important;
        font-size: 14px !important;
    }

    #stapala .ptier-p b {
        font-size: 27px !important;
    }

    #stapala .ptier p {
        font-size: 12.5px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 680px) {

    #stapala .sh {
        margin-bottom: 24px !important;
    }

    #stapala .ptiers {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    #stapala .ptier {
        min-height: auto !important;
        padding: 25px 22px 22px !important;
    }

    #stapala .ptier:hover,
    #stapala .ptier.is-on:hover {
        transform: translateY(-3px) !important;
    }

    #stapala .ptier-n {
        padding-right: 100px !important;
    }

    #stapala .ptier-p b {
        font-size: 29px !important;
    }

    #stapala .ptier p {
        margin-top: 4px !important;
    }
}

/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 420px) {

    #stapala .ptier {
        padding: 23px 18px 20px !important;
        border-radius: 15px !important;
    }

    #stapala .ptier::before {
        left: 18px !important;
        right: 18px !important;
    }

    #stapala .ptier-tag {
        top: 14px !important;
        right: 14px !important;
        font-size: 9px !important;
    }

    #stapala .ptier-n {
        padding-right: 80px !important;
        font-size: 13.5px !important;
    }

    #stapala .ptier-p b {
        font-size: 27px !important;
    }
}
/**/



/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — КОЙ ПЛАЩА
   Само за .ppays / .ppay
   ========================================================================== */

.ppays {
    width: 100% !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;

    align-items: stretch !important;
}

/* ==========================================================================
   PAYMENT CARD
   ========================================================================== */

.ppay {
    position: relative !important;

    min-width: 0 !important;
    padding: 30px 28px 27px !important;

    display: flex !important;
    flex-direction: column !important;

    box-sizing: border-box !important;

    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 18px !important;

    box-shadow:
        0 12px 35px rgba(28, 38, 23, 0.06),
        0 2px 8px rgba(28, 38, 23, 0.035) !important;

    transition:
        transform 0.22s ease,
        border-color 0.22s ease,
        box-shadow 0.22s ease,
        background-color 0.22s ease !important;

    overflow: hidden !important;
}

/* Зелената линия отгоре */
.ppay::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;

    height: 3px !important;

    border-radius: 0 0 5px 5px !important;

    background: #dfe8d1 !important;

    transition:
        background 0.22s ease,
        box-shadow 0.22s ease !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.ppay:hover {
    transform: translateY(-5px) !important;

    border-color: #cbdcab !important;

    box-shadow:
        0 19px 45px rgba(55, 75, 35, 0.10),
        0 4px 12px rgba(55, 75, 35, 0.05) !important;
}

.ppay:hover::before {
    background: linear-gradient(
        90deg,
        #7fbd14,
        #7cbf00,
        #7fbd14
    ) !important;

    box-shadow:
        0 0 13px rgba(152, 219, 28, 0.30) !important;
}

/* ==========================================================================
   ICON
   ========================================================================== */

.ppay .fi {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 20px !important;

    border-radius: 12px !important;

    background: #f1f8e6 !important;
    border: 1px solid #dcebc3 !important;

    color: #6d9f13 !important;

    transition:
        background-color 0.22s ease,
        border-color 0.22s ease,
        color 0.22s ease,
        transform 0.22s ease !important;
}

.ppay .fi svg {
    width: 22px !important;
    height: 22px !important;

    display: block !important;

    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.ppay:hover .fi {
    background: #eaf6d8 !important;
    border-color: #cfe5a9 !important;
    color: #5f900b !important;
    transform: translateY(-1px) !important;
}

/* ==========================================================================
   TITLE
   ========================================================================== */

.ppay h3 {
    margin: 0 0 12px !important;

    color: #252b21 !important;

    font-size: 18px !important;
    line-height: 1.3 !important;
    font-weight: 750 !important;

    transition: color 0.22s ease !important;
}

.ppay:hover h3 {
    color: #5f8e0e !important;
}

/* ==========================================================================
   DESCRIPTION
   ========================================================================== */

.ppay p {
    margin: 0 !important;

    color: #737b70 !important;

    font-size: 13.5px !important;
    line-height: 1.7 !important;
    font-weight: 450 !important;

    transition: color 0.22s ease !important;
}

.ppay:hover p {
    color: #626b5e !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    .ppays {
        gap: 14px !important;
    }

    .ppay {
        padding: 26px 22px 24px !important;
    }

    .ppay h3 {
        font-size: 16px !important;
    }

    .ppay p {
        font-size: 13px !important;
        line-height: 1.6 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    .ppays {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .ppay {
        padding: 25px 21px 23px !important;
        border-radius: 15px !important;
    }

    .ppay::before {
        left: 20px !important;
        right: 20px !important;
    }

    .ppay:hover {
        transform: translateY(-3px) !important;
    }

    .ppay .fi {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        margin-bottom: 17px !important;
        border-radius: 10px !important;
    }

    .ppay .fi svg {
        width: 20px !important;
        height: 20px !important;
    }

    .ppay h3 {
        font-size: 16px !important;
        margin-bottom: 10px !important;
    }

    .ppay p {
        font-size: 12.5px !important;
        line-height: 1.65 !important;
    }
}
/**/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — ПАРТНЬОРСКИ ПАНЕЛ
   Само за .psplit
   ========================================================================== */

.psplit {
    position: relative !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) !important;
    gap: 55px !important;

    align-items: center !important;

    padding: 34px 0 !important;
}

/* ==========================================================================
   LEFT CONTENT
   ========================================================================== */

.psplit > div {
    min-width: 0 !important;
}

.psplit > div h2 {
    margin: 0 0 14px !important;

    color: #252b21 !important;

    font-size: 27px !important;
    line-height: 1.2 !important;
    font-weight: 780 !important;
    letter-spacing: -0.45px !important;
}

.psplit > div p {
    margin: 0 !important;

    max-width: 650px !important;

    color: #737b70 !important;

    font-size: 14px !important;
    line-height: 1.75 !important;
    font-weight: 450 !important;
}

/* ==========================================================================
   CHECKLIST
   ========================================================================== */

.psplit .ptick {
    position: relative !important;

    margin: 0 !important;
    padding: 8px 0 !important;

    list-style: none !important;

    background: #ffffff !important;
    border: 1px solid #e3e8df !important;
    border-radius: 17px !important;

    box-shadow:
        0 12px 35px rgba(28, 38, 23, 0.06),
        0 2px 8px rgba(28, 38, 23, 0.035) !important;

    overflow: hidden !important;
}

/* Зелената линия отгоре */
.psplit .ptick::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;

    height: 3px !important;

    border-radius: 0 0 5px 5px !important;

    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00 50%,
        transparent
    ) !important;
}

/* ==========================================================================
   CHECK ITEM
   ========================================================================== */

.psplit .ptick li {
    position: relative !important;

    display: flex !important;
    align-items: center !important;

    min-height: 54px !important;

    margin: 0 !important;
    padding: 13px 22px 13px 57px !important;

    box-sizing: border-box !important;

    color: #4f584b !important;

    font-size: 13.5px !important;
    line-height: 1.5 !important;
    font-weight: 550 !important;

    border-bottom: 1px solid #edf0eb !important;

    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        padding-left 0.2s ease !important;
}

/* Последният ред няма разделител */
.psplit .ptick li:last-child {
    border-bottom: 0 !important;
}

/* ==========================================================================
   GREEN CHECK
   ========================================================================== */

.psplit .ptick li::before {
    content: "✓" !important;

    position: absolute !important;
    left: 21px !important;
    top: 50% !important;

    width: 24px !important;
    height: 24px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    transform: translateY(-50%) !important;

    border-radius: 50% !important;

    background: #f0f8e5 !important;
    border: 1px solid #dcebc3 !important;

    color: #6d9f13 !important;

    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 850 !important;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.psplit .ptick li:hover {
    background: #f8faf5 !important;
    color: #252b21 !important;

    padding-left: 62px !important;
}

.psplit .ptick li:hover::before {
    background: #eaf6d8 !important;
    border-color: #cfe5a9 !important;
    color: #5f900b !important;

    transform:
        translateY(-50%)
        scale(1.08) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .psplit {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 32px !important;
    }

    .psplit > div h2 {
        font-size: 24px !important;
    }

    .psplit > div p {
        font-size: 13.5px !important;
    }

    .psplit .ptick li {
        padding-left: 53px !important;
        padding-right: 16px !important;
        font-size: 13px !important;
    }

    .psplit .ptick li:hover {
        padding-left: 57px !important;
    }

    .psplit .ptick li::before {
        left: 18px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 680px) {

    .psplit {
        grid-template-columns: 1fr !important;
        gap: 25px !important;

        padding: 20px 0 !important;
    }

    .psplit > div h2 {
        margin-bottom: 11px !important;
        font-size: 22px !important;
        line-height: 1.25 !important;
    }

    .psplit > div p {
        font-size: 13px !important;
        line-height: 1.7 !important;
    }

    .psplit .ptick {
        border-radius: 15px !important;
    }

    .psplit .ptick::before {
        left: 20px !important;
        right: 20px !important;
    }

    .psplit .ptick li {
        min-height: 52px !important;

        padding: 13px 17px 13px 52px !important;

        font-size: 12.5px !important;
    }

    .psplit .ptick li:hover {
        padding-left: 55px !important;
    }

    .psplit .ptick li::before {
        left: 18px !important;
        width: 23px !important;
        height: 23px !important;
    }
}
/**/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — КАКВО ВЛИЗА В ПРОГРАМАТА
   Само за .pfeat
   ========================================================================== */

.pfeat {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-top: 32px !important;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.pfeat-card {
    position: relative !important;
    min-width: 0 !important;
    padding: 28px 24px !important;

    background:
        linear-gradient(
            145deg,
            #141a0e 0%,
            #0d1109 100%
        ) !important;

    border: 1px solid rgba(152, 219, 28, 0.14) !important;
    border-radius: 18px !important;

    box-shadow:
        0 16px 40px rgba(0, 0, 0, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.018) inset !important;

    overflow: hidden !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

/* Фин зелен акцент отгоре */
.pfeat-card::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;
    height: 2px !important;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(152, 219, 28, 0.65),
        transparent
    ) !important;

    opacity: 0.75 !important;
}

/* ==========================================================================
   ICON
   ========================================================================== */

.pfeat-card .fi {
    width: 46px !important;
    height: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 20px !important;

    color: #7cbf00 !important;

    background:
        rgba(152, 219, 28, 0.09) !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 12px !important;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.18),
        inset 0 0 15px rgba(152, 219, 28, 0.035) !important;

    transition:
        color 0.25s ease,
        background 0.25s ease,
        border-color 0.25s ease,
        transform 0.25s ease !important;
}

.pfeat-card .fi svg {
    width: 23px !important;
    height: 23px !important;

    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

/* ==========================================================================
   TITLE
   ========================================================================== */

.pfeat-card h3 {
    margin: 0 0 10px 0 !important;

    color: #f4f7ef !important;

    font-size: 17px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;

    letter-spacing: -0.15px !important;
}

/* ==========================================================================
   DESCRIPTION
   ========================================================================== */

.pfeat-card p {
    margin: 0 !important;

    color: #aeb6a6 !important;

    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
}

/* ==========================================================================
   HOVER
   ВАЖНО: текстът остава светъл и четим
   ========================================================================== */

.pfeat-card:hover {
    transform: translateY(-4px) !important;

    background:
        linear-gradient(
            145deg,
            #1b2412 0%,
            #11170c 100%
        ) !important;

    border-color: rgba(152, 219, 28, 0.34) !important;

    box-shadow:
        0 22px 48px rgba(0, 0, 0, 0.38),
        0 0 25px rgba(152, 219, 28, 0.055),
        inset 0 0 0 1px rgba(152, 219, 28, 0.035) !important;
}

.pfeat-card:hover::before {
    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;

    opacity: 1 !important;
}

.pfeat-card:hover .fi {
    color: #c4f76b !important;

    background:
        rgba(152, 219, 28, 0.14) !important;

    border-color: rgba(152, 219, 28, 0.34) !important;

    transform: translateY(-2px) !important;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.22),
        0 0 18px rgba(152, 219, 28, 0.08) !important;
}

/* Заглавието остава бяло */
.pfeat-card:hover h3 {
    color: #ffffff !important;
}

/* Описанието става още по-светло */
.pfeat-card:hover p {
    color: #e0e7d9 !important;
}

/* ==========================================================================
   SECTION HEAD
   Ако .sh вече има глобален стил, този блок НЕ го променя.
   ========================================================================== */

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1000px) {
    .pfeat {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .pfeat-card {
        padding: 24px 21px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .pfeat {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin-top: 24px !important;
    }

    .pfeat-card {
        padding: 23px 20px !important;
        border-radius: 15px !important;
    }

    .pfeat-card .fi {
        width: 42px !important;
        height: 42px !important;
        margin-bottom: 17px !important;
    }

    .pfeat-card .fi svg {
        width: 21px !important;
        height: 21px !important;
    }

    .pfeat-card h3 {
        font-size: 16px !important;
        margin-bottom: 8px !important;
    }

    .pfeat-card p {
        font-size: 13.5px !important;
        line-height: 1.6 !important;
    }
}
/**/


/* ==========================================================================
   PREMIUM LIGHT DESIGN — .pwho
   ========================================================================== */

.pwho {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
    margin: 32px 0 0 !important;
    padding: 0 !important;
}

/* ==========================================================================
   CARDS
   ========================================================================== */

.pwho > div {
    position: relative !important;
    display: block !important;

    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 30px 26px !important;

    background: #ffffff !important;
    border: 1px solid #e1e6dc !important;
    border-radius: 18px !important;

    box-shadow:
        0 12px 35px rgba(25, 35, 15, 0.07),
        0 2px 8px rgba(25, 35, 15, 0.04) !important;

    overflow: hidden !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease !important;
}

/* ==========================================================================
   GREEN TOP LINE
   ========================================================================== */

.pwho > div::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 24px !important;
    right: 24px !important;

    height: 3px !important;

    background: linear-gradient(
        90deg,
        transparent 0%,
        #7cbf00 50%,
        transparent 100%
    ) !important;
}

/* ==========================================================================
   CARD TITLE
   ========================================================================== */

.pwho > div > b {
    display: block !important;

    margin: 0 0 11px 0 !important;
    padding: 0 !important;

    color: #1d2518 !important;
    background: transparent !important;

    font-family: inherit !important;
    font-size: 17px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;

    text-align: left !important;
}

/* ==========================================================================
   CARD TEXT
   ========================================================================== */

.pwho > div > span {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #697365 !important;
    background: transparent !important;

    font-family: inherit !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;

    text-align: left !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.pwho > div:hover {
    transform: translateY(-5px) !important;

    background: #fbfef8 !important;

    border-color: rgba(152, 219, 28, 0.55) !important;

    box-shadow:
        0 20px 45px rgba(25, 35, 15, 0.12),
        0 0 0 1px rgba(152, 219, 28, 0.06) !important;
}

.pwho > div:hover > b {
    color: #17200f !important;
}

.pwho > div:hover > span {
    color: #4d5849 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {
    .pwho {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .pwho > div {
        padding: 26px 22px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {
    .pwho {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin-top: 24px !important;
    }

    .pwho > div {
        padding: 24px 20px !important;
        border-radius: 15px !important;
    }

    .pwho > div > b {
        font-size: 16px !important;
    }

    .pwho > div > span {
        font-size: 13.5px !important;
        line-height: 1.6 !important;
    }
}

/**/

/* ==========================================================================
   PREMIUM DESIGN — ФОРМА "КАНДИДАТСТВАЙ"
   Само за #kandidatstvane .pform
   ========================================================================== */

#kandidatstvane .pform {
    position: relative !important;

    width: 100% !important;
    max-width: 920px !important;

    margin: 34px auto 0 !important;
    padding: 34px !important;

    box-sizing: border-box !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf8 100%
        ) !important;

    border: 1px solid #e1e7dc !important;
    border-radius: 22px !important;

    box-shadow:
        0 24px 65px rgba(25, 35, 15, 0.10),
        0 5px 18px rgba(25, 35, 15, 0.05) !important;

    overflow: hidden !important;
}

/* Зелената декоративна линия */

#kandidatstvane .pform::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;

    height: 4px !important;

    background: linear-gradient(
        90deg,
        #6fae0d 0%,
        #7cbf00 35%,
        #c4f76b 50%,
        #7cbf00 65%,
        #6fae0d 100%
    ) !important;
}

/* ==========================================================================
   TWO COLUMN ROWS
   ========================================================================== */

#kandidatstvane .pform-2 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 18px !important;

    margin: 0 0 18px !important;
}

/* ==========================================================================
   LABEL
   ========================================================================== */

#kandidatstvane .pf {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 0 18px !important;
    padding: 0 !important;
}

#kandidatstvane .pf > span {
    display: block !important;

    margin: 0 0 8px !important;
    padding: 0 !important;

    color: #273020 !important;

    font-family: inherit !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;

    letter-spacing: 0.01em !important;
}

/* ==========================================================================
   INPUTS / SELECT / TEXTAREA
   ========================================================================== */

#kandidatstvane .pf input,
#kandidatstvane .pf select,
#kandidatstvane .pf textarea {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    box-sizing: border-box !important;

    margin: 0 !important;
    padding: 13px 15px !important;

    color: #20271a !important;
    background: #f7f9f5 !important;

    border: 1px solid #dce3d6 !important;
    border-radius: 11px !important;

    outline: none !important;

    font-family: inherit !important;
    font-size: 14px !important;
    line-height: 1.45 !important;

    box-shadow:
        inset 0 1px 2px rgba(20, 30, 10, 0.025) !important;

    transition:
        border-color 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease !important;
}

/* Placeholder */

#kandidatstvane .pf input::placeholder,
#kandidatstvane .pf textarea::placeholder {
    color: #9aa397 !important;
    opacity: 1 !important;
}

/* ==========================================================================
   FOCUS
   ========================================================================== */

#kandidatstvane .pf input:focus,
#kandidatstvane .pf select:focus,
#kandidatstvane .pf textarea:focus {
    color: #18200f !important;

    background: #ffffff !important;

    border-color: #7cbf00 !important;

    box-shadow:
        0 0 0 3px rgba(152, 219, 28, 0.13),
        0 5px 15px rgba(25, 35, 15, 0.05) !important;
}

/* Hover върху полето */

#kandidatstvane .pf input:hover,
#kandidatstvane .pf select:hover,
#kandidatstvane .pf textarea:hover {
    border-color: #bcc8b4 !important;
    background: #ffffff !important;
}

/* ==========================================================================
   SELECT
   ========================================================================== */

#kandidatstvane .pf select {
    cursor: pointer !important;
    min-height: 46px !important;
}

/* ==========================================================================
   TEXTAREA
   ========================================================================== */

#kandidatstvane .pf textarea {
    min-height: 118px !important;

    resize: vertical !important;
}

/* ==========================================================================
   REQUIRED LABELS
   ========================================================================== */

#kandidatstvane .pf.req > span::after {
    content: " *" !important;
    color: #7aaa18 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   CHECKBOX
   ========================================================================== */

#kandidatstvane .pchk {
    display: flex !important;
    align-items: flex-start !important;
    gap: 11px !important;

    margin: 4px 0 22px !important;
    padding: 0 !important;

    cursor: pointer !important;
}

#kandidatstvane .pchk input {
    flex: 0 0 auto !important;

    width: 18px !important;
    height: 18px !important;

    margin: 1px 0 0 !important;

    accent-color: #82bd16 !important;

    cursor: pointer !important;
}

#kandidatstvane .pchk > span {
    display: block !important;

    color: #697365 !important;

    font-family: inherit !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* ==========================================================================
   BUTTON
   ========================================================================== */

#kandidatstvane .pform .btn {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 50px !important;

    margin: 0 !important;
    padding: 13px 28px !important;

    color: #142006 !important;
    background:
        linear-gradient(
            135deg,
            #7cbf00 0%,
            #b5ed45 100%
        ) !important;

    border: 0 !important;
    border-radius: 11px !important;

    box-shadow:
        0 9px 24px rgba(117, 167, 18, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.35) !important;

    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 800 !important;

    cursor: pointer !important;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        filter 0.2s ease !important;
}

/* Бутон hover */

#kandidatstvane .pform .btn:hover {
    transform: translateY(-2px) !important;

    color: #0e1606 !important;

    background:
        linear-gradient(
            135deg,
            #a7e92e 0%,
            #c5f76b 100%
        ) !important;

    box-shadow:
        0 13px 30px rgba(117, 167, 18, 0.30),
        0 0 0 1px rgba(152, 219, 28, 0.18) !important;

    filter: none !important;
}

/* Бутон active */

#kandidatstvane .pform .btn:active {
    transform: translateY(0) !important;

    box-shadow:
        0 6px 15px rgba(117, 167, 18, 0.20) !important;
}

/* ==========================================================================
   AUTOFILL — Chrome
   ========================================================================== */

#kandidatstvane .pform input:-webkit-autofill,
#kandidatstvane .pform input:-webkit-autofill:hover,
#kandidatstvane .pform input:-webkit-autofill:focus {
    -webkit-text-fill-color: #20271a !important;

    -webkit-box-shadow:
        0 0 0 1000px #ffffff inset !important;

    border-color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    #kandidatstvane .pform {
        padding: 27px 23px !important;
        border-radius: 18px !important;
    }

    #kandidatstvane .pform-2 {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
        margin-bottom: 0 !important;
    }

    #kandidatstvane .pf {
        margin-bottom: 17px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 480px) {

    #kandidatstvane .pform {
        margin-top: 25px !important;
        padding: 24px 17px !important;
        border-radius: 16px !important;
    }

    #kandidatstvane .pf > span {
        font-size: 12.5px !important;
    }

    #kandidatstvane .pf input,
    #kandidatstvane .pf select,
    #kandidatstvane .pf textarea {
        padding: 12px 13px !important;
        font-size: 13.5px !important;
        border-radius: 10px !important;
    }

    #kandidatstvane .pform .btn {
        width: 100% !important;
        min-height: 49px !important;
    }

    #kandidatstvane .pchk > span {
        font-size: 12.5px !important;
    }
}

/**/


/* ==========================================================================
   FAQ — СВЕТЪЛ PREMIUM ДИЗАЙН
   За секцията .pfaq
   ========================================================================== */

.pfaq {
    width: 100%;
    max-width: 920px;
    margin: 34px auto 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ==========================================================================
   ВЪПРОС
   ========================================================================== */

.pfaq details {
    position: relative;
    margin: 0;
    padding: 0;
    background: #ffffff !important;
    border: 1px solid #e5e9df !important;
    border-radius: 16px;
    overflow: hidden;
    box-shadow:
        0 6px 20px rgba(20, 30, 10, 0.05),
        0 1px 2px rgba(20, 30, 10, 0.03);

    transition:
        border-color 0.22s ease,
        box-shadow 0.22s ease,
        transform 0.22s ease;
}

/* Зелената линия отляво */
.pfaq details::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #7cbf00;
    opacity: 0;
    transition: opacity 0.22s ease;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

.pfaq details:hover {
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow:
        0 12px 30px rgba(30, 45, 15, 0.08),
        0 0 0 3px rgba(152, 219, 28, 0.06);
    transform: translateY(-1px);
}

.pfaq details:hover::before {
    opacity: 1;
}

/* ==========================================================================
   OPEN
   ========================================================================== */

.pfaq details[open] {
    border-color: rgba(152, 219, 28, 0.55) !important;
    box-shadow:
        0 14px 35px rgba(30, 45, 15, 0.09),
        0 0 0 3px rgba(152, 219, 28, 0.07);
}

.pfaq details[open]::before {
    opacity: 1;
}

/* ==========================================================================
   SUMMARY / ВЪПРОС
   ========================================================================== */

.pfaq summary {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    min-height: 68px;
    padding: 20px 58px 20px 24px;

    cursor: pointer;
    list-style: none;

    color: #20251b !important;
    background: #ffffff !important;

    font-size: 15px;
    line-height: 1.45;
    font-weight: 750;

    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

/* Премахва стандартния marker */
.pfaq summary::-webkit-details-marker {
    display: none;
}

.pfaq summary::marker {
    display: none;
    content: "";
}

/* Hover върху въпроса */
.pfaq summary:hover {
    background: #fbfcf9 !important;
    color: #151a11 !important;
}

/* ==========================================================================
   ИКОНА + / -
   ========================================================================== */

.pfaq summary::after {
    content: "+";

    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);

    width: 30px;
    height: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #f0f5e9;
    color: #6f9e14;

    font-size: 21px;
    line-height: 1;
    font-weight: 400;

    transition:
        transform 0.22s ease,
        background-color 0.22s ease,
        color 0.22s ease;
}

/* При отворен въпрос */
.pfaq details[open] summary::after {
    content: "−";
    background: #7cbf00;
    color: #142006;
    transform: translateY(-50%) rotate(180deg);
}

/* ==========================================================================
   ОТГОВОР
   ========================================================================== */

.pfaq details p {
    margin: 0 !important;
    padding: 0 58px 24px 24px;

    color: #596052 !important;
    background: #ffffff !important;

    font-size: 14px;
    line-height: 1.75;
    font-weight: 400;
}

/* Удебелен текст в отговора */
.pfaq details p b,
.pfaq details p strong {
    color: #252b20 !important;
    font-weight: 700;
}

/* ==========================================================================
   OPEN STATE — ЛЕКО ОТДЕЛЯНЕ НА ОТГОВОРА
   ========================================================================== */

.pfaq details[open] summary {
    background: #fcfdfb !important;
    color: #151a11 !important;
    border-bottom: 1px solid #edf0e9;
}

/* ==========================================================================
   FOCUS — ДОСТЪПНОСТ
   ========================================================================== */

.pfaq summary:focus-visible {
    outline: 3px solid rgba(152, 219, 28, 0.35);
    outline-offset: -3px;
    border-radius: 14px;
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 700px) {

    .pfaq {
        margin-top: 26px;
        gap: 10px;
    }

    .pfaq details {
        border-radius: 14px;
    }

    .pfaq summary {
        min-height: 62px;
        padding: 17px 52px 17px 18px;

        font-size: 14px;
        line-height: 1.5;
    }

    .pfaq summary::after {
        right: 15px;

        width: 28px;
        height: 28px;

        font-size: 19px;
    }

    .pfaq details p {
        padding: 0 18px 20px;

        font-size: 13px;
        line-height: 1.7;
    }
}

/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 420px) {

    .pfaq {
        gap: 8px;
    }

    .pfaq summary {
        padding: 16px 48px 16px 16px;
        font-size: 13.5px;
    }

    .pfaq details p {
        padding: 0 16px 18px;
        font-size: 13px;
    }

    .pfaq summary::after {
        right: 13px;
        width: 26px;
        height: 26px;
    }
}

/**/
```css
/* ==========================================================================
   FAQ — PREMIUM СВЕТЪЛ ДИЗАЙН
   Адаптиран директно за .pfaq + <details>
   ========================================================================== */

/* ==========================================================================
   FAQ GRID / CONTAINER
   ========================================================================== */

.pfaq {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-top: 40px !important;
    align-items: start !important;
}


/* ==========================================================================
   FAQ CARD
   ========================================================================== */

.pfaq details {
    position: relative !important;

    margin: 0 !important;
    padding: 24px 26px !important;

    background: #ffffff !important;
    border: 1px solid rgba(152, 219, 28, 0.24) !important;
    border-radius: 20px !important;

    overflow: hidden !important;

    box-shadow:
        0 4px 16px rgba(48, 90, 8, 0.035),
        0 1px 2px rgba(0, 0, 0, 0.02) !important;

    transition:
        transform .28s cubic-bezier(.2,.9,.2,1),
        box-shadow .28s ease,
        border-color .28s ease,
        background .28s ease !important;
}


/* ==========================================================================
   GREEN TOP ACCENT
   ========================================================================== */

.pfaq details::before {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 2px !important;

    background: linear-gradient(
        90deg,
        transparent,
        #7cbf00,
        transparent
    ) !important;

    opacity: 0 !important;

    transition: opacity .3s ease !important;
}


/* ==========================================================================
   HOVER
   ========================================================================== */

.pfaq details:hover {
    transform: translateY(-4px) !important;

    border-color: rgba(105, 201, 14, 0.5) !important;

    background: #ffffff !important;

    box-shadow:
        0 16px 34px rgba(48, 90, 8, 0.09),
        0 0 25px rgba(152, 219, 28, 0.045) !important;
}

.pfaq details:hover::before {
    opacity: 1 !important;
}


/* ==========================================================================
   OPEN CARD
   ========================================================================== */

.pfaq details[open] {
    border-color: rgba(105, 201, 14, 0.5) !important;

    background: #ffffff !important;

    box-shadow:
        0 12px 30px rgba(48, 90, 8, 0.075),
        0 0 25px rgba(152, 219, 28, 0.05) !important;
}

.pfaq details[open]::before {
    opacity: 1 !important;
}


/* ==========================================================================
   SUMMARY / QUESTION
   ========================================================================== */

.pfaq summary {
    position: relative !important;

    display: block !important;

    margin: 0 !important;
    padding: 0 38px 0 0 !important;

    cursor: pointer !important;
    list-style: none !important;

    color: #1a2e05 !important;
    background: transparent !important;

    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
    letter-spacing: -.2px !important;

    transition:
        color .25s ease !important;
}


/* Remove browser marker */

.pfaq summary::-webkit-details-marker {
    display: none !important;
}

.pfaq summary::marker {
    display: none !important;
    content: "" !important;
}


/* ==========================================================================
   PLUS ICON
   ========================================================================== */

.pfaq summary::after {
    content: "+" !important;

    position: absolute !important;

    right: 0 !important;
    top: 50% !important;

    width: 27px !important;
    height: 27px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    transform: translateY(-50%) !important;

    border-radius: 50% !important;

    background: #f3fae9 !important;
    border: 1px solid rgba(152, 219, 28, 0.3) !important;

    color: #4d790d !important;

    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease !important;
}


/* ==========================================================================
   OPEN ICON
   ========================================================================== */

.pfaq details[open] summary::after {
    content: "+" !important;

    transform:
        translateY(-50%)
        rotate(45deg) !important;

    background: #7cbf00 !important;
    border-color: #7cbf00 !important;

    color: #172306 !important;
}


/* ==========================================================================
   SUMMARY HOVER
   ========================================================================== */

.pfaq summary:hover {
    color: #305a08 !important;
}


/* ==========================================================================
   ANSWER
   ========================================================================== */

.pfaq details p {
    max-height: 0 !important;

    overflow: hidden !important;

    opacity: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #526247 !important;

    background: transparent !important;

    font-size: 14px !important;
    line-height: 1.7 !important;
    font-weight: 400 !important;

    transition:
        max-height .45s cubic-bezier(.2,.9,.2,1),
        opacity .3s ease,
        margin-top .3s ease !important;
}


/* ==========================================================================
   OPEN ANSWER
   ========================================================================== */

.pfaq details[open] p {
    max-height: 600px !important;

    opacity: 1 !important;

    margin-top: 16px !important;
}


/* ==========================================================================
   BOLD TEXT
   ========================================================================== */

.pfaq details p b,
.pfaq details p strong {
    color: #243b0a !important;
    font-weight: 750 !important;
}


/* ==========================================================================
   SECTION HEADER
   Работи и ако заглавието е .sh
   ========================================================================== */

section.sec:has(.pfaq) .sh {
    max-width: 760px !important;
    margin: 0 auto 10px !important;
}

section.sec:has(.pfaq) .sh h2 {
    color: #172306 !important;

    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;

    font-weight: 800 !important;
    letter-spacing: -1px !important;

    margin: 0 0 14px !important;
}

section.sec:has(.pfaq) .sh p {
    color: #66745d !important;

    font-size: 16px !important;
    line-height: 1.65 !important;

    margin: 0 !important;
}


/* ==========================================================================
   GREEN TITLE ACCENT
   ========================================================================== */

section.sec:has(.pfaq) .sh::after {
    content: "" !important;

    display: block !important;

    width: 44px !important;
    height: 3px !important;

    margin-top: 22px !important;

    background: #7cbf00 !important;

    border-radius: 99px !important;

    box-shadow:
        0 0 16px rgba(152, 219, 28, 0.35) !important;
}


/* ==========================================================================
   FAQ SECTION BACKGROUND
   ========================================================================== */

section.sec:has(.pfaq) {
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152, 219, 28, 0.045),
            transparent 45%
        ),
        #ffffff !important;

    padding-top: 85px !important;
    padding-bottom: 85px !important;
}


/* ==========================================================================
   FOCUS
   ========================================================================== */

.pfaq summary:focus-visible {
    outline: 3px solid rgba(152, 219, 28, 0.35) !important;
    outline-offset: 4px !important;
    border-radius: 8px !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    .pfaq {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    .pfaq details {
        padding: 22px 23px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {

    section.sec:has(.pfaq) {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }

    section.sec:has(.pfaq) .sh {
        margin-bottom: 8px !important;
    }

    section.sec:has(.pfaq) .sh h2 {
        font-size: 30px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.pfaq) .sh p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    .pfaq {
        margin-top: 32px !important;
        gap: 12px !important;
    }

    .pfaq details {
        padding: 20px !important;
        border-radius: 17px !important;
    }

    .pfaq summary {
        font-size: 16px !important;
        line-height: 1.4 !important;
        padding-right: 38px !important;
    }

    .pfaq details p {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
    }

    .pfaq summary::after {
        width: 27px !important;
        height: 27px !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 420px) {

    .pfaq {
        gap: 10px !important;
    }

    .pfaq details {
        padding: 18px !important;
        border-radius: 15px !important;
    }

    .pfaq summary {
        font-size: 14.5px !important;
        padding-right: 36px !important;
    }

    .pfaq details p {
        font-size: 13px !important;
    }
}
```



/*baza-znaniya/*/


/* =========================================
   KNOWLEDGE BASE — СВЕТЪЛ KT СТИЛ
   ========================================= */

.sec .wrap-n {
    position: relative !important;
}


/* =========================================
   CATEGORY CHIPS
   ========================================= */

.kb-chips {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 9px !important;
    margin-bottom: 24px !important;
}

.kb-chip {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;

    min-height: 40px !important;
    padding: 0 13px !important;

    border: 1px solid #dce5d7 !important;
    border-radius: 10px !important;

    background: #ffffff !important;
    color: #66735f !important;

    font-family: inherit !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;

    cursor: pointer !important;

    box-shadow: 0 3px 12px rgba(48, 90, 8, 0.025) !important;

    transition:
        background 0.22s ease,
        border-color 0.22s ease,
        color 0.22s ease,
        transform 0.22s ease,
        box-shadow 0.22s ease !important;
}

.kb-chip:hover {
    border-color: #bfd3b2 !important;
    background: #f9fcf7 !important;
    color: #4e850b !important;
    transform: translateY(-1px) !important;
}

.kb-chip.is-on {
    border-color: rgba(114, 173, 22, 0.42) !important;
    background: #f3f8ed !important;
    color: #4e850b !important;
    box-shadow: 0 4px 14px rgba(83, 133, 13, 0.07) !important;
}

.kb-chip svg {
    width: 17px !important;
    height: 17px !important;
    flex: 0 0 auto !important;
}

.kb-chip b {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 21px !important;
    height: 21px !important;
    padding: 0 5px !important;

    border-radius: 6px !important;

    background: #eef3ea !important;
    color: #72806c !important;

    font-size: 0.7rem !important;
    font-weight: 800 !important;
}

.kb-chip.is-on b {
    background: rgba(114, 173, 22, 0.14) !important;
    color: #4e850b !important;
}


/* =========================================
   FAQ LIST
   ========================================= */

.kb-items {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}


/* =========================================
   FAQ CARD
   ========================================= */

.kb-item {
    overflow: hidden !important;

    border: 1px solid #dfe7da !important;
    border-radius: 15px !important;

    background: #ffffff !important;

    box-shadow: 0 5px 18px rgba(48, 90, 8, 0.035) !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease !important;
}

.kb-item:hover {
    border-color: rgba(152, 219, 28, 0.38) !important;
    box-shadow: 0 8px 24px rgba(48, 90, 8, 0.055) !important;
}

.kb-item[open] {
    border-color: rgba(152, 219, 28, 0.45) !important;
    box-shadow: 0 9px 28px rgba(48, 90, 8, 0.07) !important;
}


/* =========================================
   QUESTION HEADER
   ========================================= */

.kb-q {
    position: relative !important;

    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) auto 24px !important;
    align-items: center !important;

    gap: 13px !important;

    min-height: 76px !important;
    padding: 13px 20px !important;

    list-style: none !important;
    cursor: pointer !important;
}

.kb-q::-webkit-details-marker {
    display: none !important;
}

.kb-q::marker {
    display: none !important;
    content: "" !important;
}


/* =========================================
   QUESTION ICON
   ========================================= */

.kb-q-ic {
    width: 42px !important;
    height: 42px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    background: rgba(183, 255, 53, 0.14) !important;
    color: #4e850b !important;

    transition:
        background 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease !important;
}

.kb-q-ic svg {
    width: 19px !important;
    height: 19px !important;
}

.kb-item:hover .kb-q-ic,
.kb-item[open] .kb-q-ic {
    background: rgba(152, 219, 28, 0.19) !important;
}

.kb-item[open] .kb-q-ic {
    transform: scale(1.04) !important;
}


/* =========================================
   QUESTION TEXT
   ========================================= */

.kb-q-t {
    min-width: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.kb-q-t b {
    color: #27361e !important;

    font-size: 0.94rem !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;

    transition: color 0.2s ease !important;
}

.kb-item:hover .kb-q-t b,
.kb-item[open] .kb-q-t b {
    color: #305a08 !important;
}

.kb-q-t span {
    color: #7a8871 !important;

    font-size: 0.78rem !important;
    line-height: 1.45 !important;
}


/* =========================================
   READING TIME
   ========================================= */

.kb-q-min {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;

    white-space: nowrap !important;

    color: #899485 !important;

    font-size: 0.73rem !important;
    font-weight: 600 !important;
}

.kb-q-min svg {
    width: 15px !important;
    height: 15px !important;
}


/* =========================================
   ARROW
   ========================================= */

.kb-q-arr {
    width: 24px !important;
    height: 24px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #7b8973 !important;

    transition:
        transform 0.25s ease,
        color 0.25s ease !important;
}

.kb-q-arr svg {
    width: 17px !important;
    height: 17px !important;
}

.kb-item[open] .kb-q-arr {
    transform: rotate(180deg) !important;
    color: #4e850b !important;
}


/* =========================================
   ANSWER AREA
   ========================================= */

.kb-a {
    padding: 0 20px 23px 75px !important;

    border-top: 1px solid #edf2e8 !important;

    color: #596650 !important;

    font-size: 0.87rem !important;
    line-height: 1.65 !important;
}


/* =========================================
   STEPS
   ========================================= */

.kb-step {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) !important;
    gap: 11px !important;

    margin-top: 18px !important;
}

.kb-step-n {
    width: 28px !important;
    height: 28px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 8px !important;

    background: #f1f6eb !important;
    color: #4e850b !important;

    font-size: 0.74rem !important;
    font-weight: 800 !important;
}

.kb-step span:last-child {
    padding-top: 2px !important;
}

.kb-step b {
    color: #35452d !important;
    font-weight: 750 !important;
}


/* =========================================
   CODE BOX
   ========================================= */

.kb-code {
    overflow-x: auto !important;

    margin: 18px 0 0 !important;
    padding: 17px 18px !important;

    border: 1px solid #e0e8dc !important;
    border-radius: 10px !important;

    background: #f7faf5 !important;
    color: #40523a !important;

    font-family:
        "SFMono-Regular",
        Consolas,
        "Liberation Mono",
        monospace !important;

    font-size: 0.79rem !important;
    line-height: 1.7 !important;

    white-space: pre !important;
}


/* =========================================
   WARNING BOX
   ========================================= */

.kb-warn {
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    gap: 11px !important;
    align-items: start !important;

    margin-top: 18px !important;
    padding: 15px 16px !important;

    border: 1px solid rgba(152, 219, 28, 0.23) !important;
    border-radius: 11px !important;

    background: #f8fbed !important;

    color: #65715f !important;

    font-size: 0.82rem !important;
    line-height: 1.58 !important;
}

.kb-warn-ic {
    width: 32px !important;
    height: 32px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 8px !important;

    background: rgba(152, 219, 28, 0.14) !important;
    color: #60960f !important;
}

.kb-warn-ic svg {
    width: 17px !important;
    height: 17px !important;
}

.kb-warn b {
    color: #3f551f !important;
    font-weight: 750 !important;
}


/* =========================================
   SUCCESS BOX
   ========================================= */

.kb-ok {
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    gap: 11px !important;
    align-items: start !important;

    margin-top: 14px !important;
    padding: 15px 16px !important;

    border: 1px solid rgba(114, 173, 22, 0.22) !important;
    border-radius: 11px !important;

    background: #f4f9ef !important;

    color: #5e6d57 !important;

    font-size: 0.82rem !important;
    line-height: 1.58 !important;
}

.kb-ok-ic {
    width: 32px !important;
    height: 32px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 8px !important;

    background: rgba(114, 173, 22, 0.14) !important;
    color: #4e850b !important;
}

.kb-ok-ic svg {
    width: 17px !important;
    height: 17px !important;
}

.kb-ok b {
    color: #365d0b !important;
}


/* =========================================
   "NOTHING FOUND"
   ========================================= */

.kb-none {
    margin-top: 18px !important;
    padding: 28px !important;

    border: 1px solid #dfe8db !important;
    border-radius: 15px !important;

    background: #ffffff !important;

    text-align: center !important;

    box-shadow: 0 5px 18px rgba(48, 90, 8, 0.035) !important;
}

.kb-none b {
    display: block !important;
    margin-bottom: 6px !important;

    color: #27361e !important;
    font-size: 1rem !important;
}

.kb-none p {
    margin: 0 0 16px !important;

    color: #7a8871 !important;
    font-size: 0.84rem !important;
    line-height: 1.55 !important;
}

.kb-none .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 42px !important;
    padding: 0 18px !important;

    border-radius: 9px !important;
    border: 0 !important;

    background: #72ad16 !important;
    color: #ffffff !important;

    font-size: 0.84rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;

    box-shadow: 0 6px 16px rgba(83, 133, 13, 0.16) !important;

    transition:
        transform 0.22s ease,
        background 0.22s ease !important;
}

.kb-none .btn:hover {
    transform: translateY(-2px) !important;
    background: #60960f !important;
}


/* =========================================
   RESPONSIVE — TABLET
   ========================================= */

@media (max-width: 800px) {

    .kb-chips {
        gap: 7px !important;
    }

    .kb-chip {
        min-height: 38px !important;
        padding: 0 11px !important;
    }

    .kb-q {
        grid-template-columns: 40px minmax(0, 1fr) 22px !important;
        gap: 11px !important;
        padding: 13px 16px !important;
    }

    .kb-q-min {
        display: none !important;
    }

    .kb-q-ic {
        width: 40px !important;
        height: 40px !important;
    }

    .kb-a {
        padding-left: 67px !important;
        padding-right: 17px !important;
    }
}


/* =========================================
   RESPONSIVE — MOBILE
   ========================================= */

@media (max-width: 600px) {

    .kb-chips {
        margin-bottom: 18px !important;

        flex-wrap: nowrap !important;
        overflow-x: auto !important;

        padding-bottom: 4px !important;

        scrollbar-width: none !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .kb-chips::-webkit-scrollbar {
        display: none !important;
    }

    .kb-chip {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    .kb-items {
        gap: 10px !important;
    }

    .kb-item {
        border-radius: 13px !important;
    }

    .kb-q {
        grid-template-columns: 38px minmax(0, 1fr) 21px !important;

        min-height: 70px !important;

        gap: 10px !important;
        padding: 12px 13px !important;
    }

    .kb-q-ic {
        width: 38px !important;
        height: 38px !important;
        border-radius: 10px !important;
    }

    .kb-q-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    .kb-q-t b {
        font-size: 0.88rem !important;
        line-height: 1.35 !important;
    }

    .kb-q-t span {
        font-size: 0.74rem !important;
        line-height: 1.4 !important;
    }

    .kb-q-arr svg {
        width: 16px !important;
        height: 16px !important;
    }

    .kb-a {
        padding: 0 13px 18px !important;
    }

    .kb-step {
        grid-template-columns: 27px minmax(0, 1fr) !important;
        gap: 9px !important;

        margin-top: 15px !important;
    }

    .kb-step-n {
        width: 27px !important;
        height: 27px !important;
    }

    .kb-code {
        margin-top: 15px !important;
        padding: 14px !important;

        font-size: 0.72rem !important;
        line-height: 1.65 !important;
    }

    .kb-warn,
    .kb-ok {
        grid-template-columns: 29px minmax(0, 1fr) !important;
        gap: 9px !important;

        padding: 13px !important;

        font-size: 0.79rem !important;
    }

    .kb-warn-ic,
    .kb-ok-ic {
        width: 29px !important;
        height: 29px !important;
    }

    .kb-warn-ic svg,
    .kb-ok-ic svg {
        width: 15px !important;
        height: 15px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .kb-q {
        grid-template-columns: 35px minmax(0, 1fr) 19px !important;
        gap: 8px !important;
        padding: 11px !important;
    }

    .kb-q-ic {
        width: 35px !important;
        height: 35px !important;
    }

    .kb-q-t b {
        font-size: 0.84rem !important;
    }

    .kb-q-t span {
        font-size: 0.71rem !important;
    }

    .kb-a {
        padding-left: 11px !important;
        padding-right: 11px !important;
    }
}
/**/

/* =========================================
   KB HOW — СВЕТЪЛ KT СТИЛ
   ========================================= */

.kb-head {
    max-width: 720px !important;
    margin: 0 auto 30px !important;
    text-align: center !important;
}

.kb-head h2 {
    margin: 0 0 9px !important;

    color: #27361e !important;

    font-family: inherit !important;
    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
}

.kb-head p {
    margin: 0 !important;

    color: #7a8871 !important;

    font-size: 0.9rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   HOW CARDS
   ========================================= */

.kb-how {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
}


/* =========================================
   SINGLE CARD
   ========================================= */

.kb-how-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    min-width: 0 !important;

    padding: 25px 23px 24px !important;

    border: 1px solid rgba(152, 219, 28, 0.24) !important;
    border-radius: 15px !important;

    background: #ffffff !important;

    box-shadow: 0 5px 18px rgba(48, 90, 8, 0.045) !important;

    color: #65715f !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease !important;
}

.kb-how-i:hover {
    transform: translateY(-3px) !important;

    border-color: rgba(152, 219, 28, 0.42) !important;

    background: #fefffd !important;

    box-shadow: 0 10px 28px rgba(48, 90, 8, 0.075) !important;
}


/* =========================================
   ICON
   ========================================= */

.kb-how-ic {
    width: 44px !important;
    height: 44px !important;

    min-width: 44px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 18px !important;

    border-radius: 11px !important;

    background: rgba(183, 255, 53, 0.15) !important;
    color: #4e850b !important;

    transition:
        background 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease !important;
}

.kb-how-ic svg {
    width: 20px !important;
    height: 20px !important;
}

.kb-how-i:hover .kb-how-ic {
    background: rgba(152, 219, 28, 0.2) !important;
    color: #3f7207 !important;
    transform: translateY(-1px) !important;
}


/* =========================================
   CARD TITLE
   ========================================= */

.kb-how-i > b {
    display: block !important;

    margin-bottom: 8px !important;

    color: #27361e !important;

    font-size: 0.94rem !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;

    transition: color 0.2s ease !important;
}

.kb-how-i:hover > b {
    color: #305a08 !important;
}


/* =========================================
   CARD TEXT
   ========================================= */

.kb-how-i > p {
    margin: 0 !important;

    color: #6f7c69 !important;

    font-size: 0.82rem !important;
    line-height: 1.65 !important;
}


/* =========================================
   SUBTLE TOP ACCENT
   ========================================= */

.kb-how-i::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 23px !important;
    right: 23px !important;

    height: 2px !important;

    border-radius: 0 0 4px 4px !important;

    background: linear-gradient(
        90deg,
        rgba(152, 219, 28, 0),
        rgba(152, 219, 28, 0.38),
        rgba(152, 219, 28, 0)
    ) !important;

    opacity: 0 !important;

    transition: opacity 0.25s ease !important;
}

.kb-how-i:hover::before {
    opacity: 1 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 850px) {

    .kb-how {
        grid-template-columns: 1fr !important;
        gap: 13px !important;
    }

    .kb-how-i {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) !important;
        column-gap: 15px !important;
        padding: 21px !important;
    }

    .kb-how-ic {
        grid-row: span 2 !important;

        margin-bottom: 0 !important;
    }

    .kb-how-i > b {
        margin-bottom: 5px !important;
    }

    .kb-how-i > p {
        grid-column: 2 !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .kb-head {
        margin-bottom: 22px !important;
        padding: 0 5px !important;
    }

    .kb-head h2 {
        font-size: 1.4rem !important;
    }

    .kb-head p {
        font-size: 0.82rem !important;
        line-height: 1.55 !important;
    }

    .kb-how {
        gap: 10px !important;
    }

    .kb-how-i {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        column-gap: 12px !important;

        padding: 18px !important;

        border-radius: 13px !important;
    }

    .kb-how-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;

        border-radius: 10px !important;
    }

    .kb-how-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .kb-how-i > b {
        font-size: 0.87rem !important;
        line-height: 1.4 !important;
    }

    .kb-how-i > p {
        font-size: 0.77rem !important;
        line-height: 1.58 !important;
    }

    .kb-how-i::before {
        left: 18px !important;
        right: 18px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .kb-how-i {
        grid-template-columns: 36px minmax(0, 1fr) !important;
        column-gap: 10px !important;

        padding: 16px !important;
    }

    .kb-how-ic {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
    }

    .kb-how-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    .kb-how-i > b {
        font-size: 0.84rem !important;
    }

    .kb-how-i > p {
        font-size: 0.74rem !important;
    }

    .kb-how-i::before {
        left: 16px !important;
        right: 16px !important;
    }
}
/**/


/* =========================================
   KB MISS — CTA / CONTACT
   СВЕТЪЛ KT СТИЛ
   ========================================= */

.sec-wash {
    position: relative !important;
    overflow: hidden !important;

    background:
        linear-gradient(
            135deg,
            #f5faef 0%,
            #fbfdf9 52%,
            #f1f8e9 100%
        ) !important;
}


/* =========================================
   MAIN CTA
   ========================================= */

.kb-miss {
    position: relative !important;
    overflow: hidden !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;

    gap: 45px !important;

    padding: 42px 46px !important;

    border: 1px solid rgba(152, 219, 28, 0.28) !important;
    border-radius: 20px !important;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.96),
            rgba(247,251,241,0.96)
        ) !important;

    box-shadow:
        0 12px 35px rgba(48, 90, 8, 0.065),
        0 2px 8px rgba(48, 90, 8, 0.025) !important;
}


/* =========================================
   DECORATIVE LIGHT
   ========================================= */

.kb-miss::before {
    content: "" !important;

    position: absolute !important;

    width: 280px !important;
    height: 280px !important;

    right: -105px !important;
    top: -145px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.20) 0%,
            rgba(183, 255, 53, 0.08) 42%,
            rgba(183, 255, 53, 0) 72%
        ) !important;

    pointer-events: none !important;
}


/* =========================================
   SECOND DECORATIVE SHAPE
   ========================================= */

.kb-miss::after {
    content: "" !important;

    position: absolute !important;

    width: 120px !important;
    height: 120px !important;

    left: -55px !important;
    bottom: -65px !important;

    border: 1px solid rgba(152, 219, 28, 0.14) !important;
    border-radius: 50% !important;

    pointer-events: none !important;
}


/* =========================================
   TEXT AREA
   ========================================= */

.kb-miss > div:first-child {
    position: relative !important;
    z-index: 2 !important;

    min-width: 0 !important;
}

.kb-miss h2 {
    margin: 0 0 9px !important;

    color: #27361e !important;

    font-family: inherit !important;

    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;
}

.kb-miss h2::after {
    content: "" !important;

    display: block !important;

    width: 42px !important;
    height: 3px !important;

    margin-top: 13px !important;

    border-radius: 10px !important;

    background: #72ad16 !important;
}

.kb-miss p {
    max-width: 680px !important;

    margin: 0 !important;

    color: #6f7c69 !important;

    font-size: 0.88rem !important;
    line-height: 1.65 !important;
}


/* =========================================
   CHECK LIST
   ========================================= */

.kb-miss-l {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    gap: 9px 14px !important;

    margin-top: 24px !important;
}

.kb-miss-r {
    display: flex !important;
    align-items: flex-start !important;

    gap: 9px !important;

    color: #5f6d59 !important;

    font-size: 0.77rem !important;
    line-height: 1.45 !important;
}


/* =========================================
   CHECK ICON
   ========================================= */

.kb-miss-r i {
    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-top: 0 !important;

    border-radius: 7px !important;

    background: rgba(114, 173, 22, 0.13) !important;
    color: #4e850b !important;

    font-style: normal !important;
}

.kb-miss-r i svg {
    width: 13px !important;
    height: 13px !important;
}


/* =========================================
   BUTTON AREA
   ========================================= */

.kb-miss-go {
    position: relative !important;
    z-index: 3 !important;

    display: flex !important;
    flex-direction: column !important;

    gap: 10px !important;

    min-width: 145px !important;
}


/* =========================================
   PRIMARY BUTTON
   ========================================= */

.kb-miss-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 48px !important;

    padding: 0 24px !important;

    border-radius: 10px !important;

    font-family: inherit !important;
    font-size: 0.86rem !important;
    font-weight: 750 !important;

    text-decoration: none !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease !important;
}


/* =========================================
   LIGHT BUTTON
   ========================================= */

.kb-miss-go .btn-light {
    border: 0 !important;

    background: #72ad16 !important;
    color: #ffffff !important;

    box-shadow:
        0 7px 18px rgba(83, 133, 13, 0.18) !important;
}

.kb-miss-go .btn-light:hover {
    transform: translateY(-2px) !important;

    background: #60960f !important;

    box-shadow:
        0 11px 24px rgba(83, 133, 13, 0.24) !important;
}


/* =========================================
   PHONE / GHOST BUTTON
   ========================================= */

.kb-miss-go .kb-miss-ghost {
    border: 1px solid rgba(114, 173, 22, 0.25) !important;

    background: #ffffff !important;

    color: #4e850b !important;

    box-shadow:
        0 3px 12px rgba(48, 90, 8, 0.035) !important;
}

.kb-miss-go .kb-miss-ghost:hover {
    transform: translateY(-2px) !important;

    border-color: rgba(114, 173, 22, 0.42) !important;

    background: #f4f9ef !important;

    box-shadow:
        0 7px 18px rgba(48, 90, 8, 0.065) !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 900px) {

    .kb-miss {
        grid-template-columns: minmax(0, 1fr) 140px !important;

        gap: 28px !important;

        padding: 34px 34px !important;
    }

    .kb-miss-l {
        grid-template-columns: 1fr !important;

        gap: 8px !important;
    }

    .kb-miss-go {
        min-width: 130px !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 650px) {

    .kb-miss {
        grid-template-columns: 1fr !important;

        gap: 25px !important;

        padding: 29px 24px !important;

        border-radius: 16px !important;
    }

    .kb-miss h2 {
        font-size: 1.4rem !important;
    }

    .kb-miss p {
        font-size: 0.81rem !important;
        line-height: 1.6 !important;
    }

    .kb-miss-l {
        margin-top: 20px !important;

        gap: 9px !important;
    }

    .kb-miss-r {
        font-size: 0.76rem !important;
    }

    .kb-miss-go {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;

        gap: 9px !important;

        width: 100% !important;
    }

    .kb-miss-go .btn {
        width: 100% !important;

        padding: 0 13px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .kb-miss {
        padding: 24px 18px !important;
    }

    .kb-miss-go {
        grid-template-columns: 1fr !important;
    }

    .kb-miss-go .btn {
        min-height: 45px !important;
    }

    .kb-miss::before {
        width: 210px !important;
        height: 210px !important;

        right: -100px !important;
        top: -110px !important;
    }
}
/*obshti-usloviya/*

/* =========================================
   OU GIST — СВЕТЪЛ KT СТИЛ
   ========================================= */

.ou-gist {
    position: relative !important;
    overflow: hidden !important;

    max-width: 980px !important;
    margin: 0 auto !important;

    padding: 32px 34px 26px !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 20px !important;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbfdf9 58%,
            #f5faef 100%
        ) !important;

    box-shadow:
        0 12px 35px rgba(48, 90, 8, 0.055),
        0 2px 8px rgba(48, 90, 8, 0.025) !important;

    color: #6f7c69 !important;
}


/* =========================================
   DECORATIVE SHAPE
   ========================================= */

.ou-gist::before {
    content: "" !important;

    position: absolute !important;

    width: 260px !important;
    height: 260px !important;

    top: -145px !important;
    right: -90px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.17) 0%,
            rgba(183, 255, 53, 0.07) 42%,
            rgba(183, 255, 53, 0) 72%
        ) !important;

    pointer-events: none !important;
}


/* =========================================
   SECOND DECORATION
   ========================================= */

.ou-gist::after {
    content: "" !important;

    position: absolute !important;

    width: 100px !important;
    height: 100px !important;

    left: -55px !important;
    bottom: -55px !important;

    border: 1px solid rgba(152, 219, 28, 0.13) !important;
    border-radius: 50% !important;

    pointer-events: none !important;
}


/* =========================================
   HEADER
   ========================================= */

.ou-gist-h {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    align-items: center !important;

    gap: 13px !important;

    margin-bottom: 24px !important;

    color: #27361e !important;

    font-size: 1.05rem !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;

    letter-spacing: -0.015em !important;
}


/* =========================================
   HEADER ICON
   ========================================= */

.ou-gist-ic {
    width: 43px !important;
    height: 43px !important;

    min-width: 43px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    background: rgba(183, 255, 53, 0.15) !important;

    color: #4e850b !important;

    box-shadow:
        inset 0 0 0 1px rgba(152, 219, 28, 0.08) !important;
}

.ou-gist-ic svg {
    width: 20px !important;
    height: 20px !important;
}


/* =========================================
   LIST
   ========================================= */

.ou-gist-l {
    position: relative !important;
    z-index: 2 !important;

    display: grid !important;

    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 12px !important;
}


/* =========================================
   SINGLE ROW
   ========================================= */

.ou-gist-r {
    position: relative !important;

    display: flex !important;
    align-items: flex-start !important;

    gap: 14px !important;

    min-width: 0 !important;

    padding: 17px 18px !important;

    border: 1px solid rgba(152, 219, 28, 0.16) !important;
    border-radius: 13px !important;

    background: rgba(255, 255, 255, 0.86) !important;

    box-shadow:
        0 4px 13px rgba(48, 90, 8, 0.025) !important;

    transition:
        transform 0.23s ease,
        border-color 0.23s ease,
        box-shadow 0.23s ease,
        background 0.23s ease !important;
}

.ou-gist-r:hover {
    transform: translateY(-2px) !important;

    border-color: rgba(152, 219, 28, 0.34) !important;

    background: #ffffff !important;

    box-shadow:
        0 8px 22px rgba(48, 90, 8, 0.06) !important;
}


/* =========================================
   NUMBER
   ========================================= */

.ou-gist-n {
    width: 31px !important;
    height: 31px !important;

    min-width: 31px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-top: 1px !important;

    border-radius: 9px !important;

    background:
        linear-gradient(
            135deg,
            #b7ff35,
            #7cbf00
        ) !important;

    color: #305a08 !important;

    font-size: 0.76rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;

    box-shadow:
        0 4px 10px rgba(114, 173, 22, 0.13) !important;
}


/* =========================================
   TEXT AREA
   ========================================= */

.ou-gist-t {
    display: block !important;

    min-width: 0 !important;
}


/* =========================================
   TITLE
   ========================================= */

.ou-gist-t > b {
    display: block !important;

    margin: 0 0 5px !important;

    color: #27361e !important;

    font-size: 0.86rem !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;

    letter-spacing: -0.005em !important;
}


/* =========================================
   DESCRIPTION
   ========================================= */

.ou-gist-t > p {
    margin: 0 !important;

    color: #6f7c69 !important;

    font-size: 0.76rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   LINKS
   ========================================= */

.ou-gist-t > p a {
    display: inline-block !important;

    margin-left: 3px !important;

    color: #60960f !important;

    font-weight: 700 !important;

    text-decoration: none !important;

    border-bottom: 1px solid rgba(114, 173, 22, 0.28) !important;

    transition:
        color 0.2s ease,
        border-color 0.2s ease !important;
}

.ou-gist-t > p a:hover {
    color: #3f7207 !important;

    border-color: rgba(63, 114, 7, 0.55) !important;
}


/* =========================================
   BOTTOM NOTICE
   ========================================= */

.ou-gist-say {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin-top: 17px !important;
    padding: 13px 16px !important;

    border-left: 3px solid #7cbf00 !important;
    border-radius: 0 9px 9px 0 !important;

    background: rgba(183, 255, 53, 0.08) !important;

    color: #7a8871 !important;

    font-size: 0.71rem !important;
    line-height: 1.55 !important;
}

.ou-gist-say b {
    color: #53654a !important;

    font-weight: 750 !important;
}


/* =========================================
   SUBTLE TOP ACCENT
   ========================================= */

.ou-gist-h::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    bottom: -13px !important;

    width: 38px !important;
    height: 2px !important;

    border-radius: 5px !important;

    background: #72ad16 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 800px) {

    .ou-gist {
        padding: 28px 26px 23px !important;
    }

    .ou-gist-l {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .ou-gist-r {
        padding: 16px 17px !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .ou-gist {
        padding: 24px 18px 20px !important;

        border-radius: 16px !important;
    }

    .ou-gist-h {
        gap: 11px !important;

        margin-bottom: 20px !important;

        font-size: 0.94rem !important;
    }

    .ou-gist-ic {
        width: 39px !important;
        height: 39px !important;
        min-width: 39px !important;

        border-radius: 10px !important;
    }

    .ou-gist-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .ou-gist-l {
        gap: 9px !important;
    }

    .ou-gist-r {
        gap: 11px !important;

        padding: 14px !important;

        border-radius: 12px !important;
    }

    .ou-gist-n {
        width: 29px !important;
        height: 29px !important;
        min-width: 29px !important;

        border-radius: 8px !important;

        font-size: 0.71rem !important;
    }

    .ou-gist-t > b {
        font-size: 0.82rem !important;
        line-height: 1.4 !important;
    }

    .ou-gist-t > p {
        font-size: 0.73rem !important;
        line-height: 1.57 !important;
    }

    .ou-gist-say {
        margin-top: 13px !important;
        padding: 11px 13px !important;

        font-size: 0.68rem !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .ou-gist {
        padding: 21px 14px 17px !important;

        border-radius: 14px !important;
    }

    .ou-gist-h {
        font-size: 0.88rem !important;
    }

    .ou-gist-ic {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
    }

    .ou-gist-r {
        gap: 9px !important;
        padding: 12px !important;
    }

    .ou-gist-n {
        width: 27px !important;
        height: 27px !important;
        min-width: 27px !important;

        font-size: 0.68rem !important;
    }

    .ou-gist-t > b {
        font-size: 0.79rem !important;
    }

    .ou-gist-t > p {
        font-size: 0.7rem !important;
    }
}
/**/

/* =========================================================
   OU DOCUMENT — СВЕТЪЛ KT СТИЛ
   Съдържание + дълъг документ
   ========================================================= */

.ou-doc {
    display: grid !important;
    grid-template-columns: 245px minmax(0, 1fr) !important;
    gap: 28px !important;
    align-items: start !important;
}


/* =========================================================
   TABLE OF CONTENTS
   ========================================================= */

.ou-toc {
    position: sticky !important;
    top: 25px !important;

    padding: 18px !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 15px !important;

    background: #ffffff !important;

    box-shadow:
        0 5px 18px rgba(48, 90, 8, 0.045) !important;
}

.ou-toc-h {
    margin: 2px 4px 13px !important;

    color: #27361e !important;

    font-size: 0.86rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em !important;
}

.ou-toc-l {
    display: flex !important;
    flex-direction: column !important;

    gap: 3px !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

.ou-toc-l li {
    margin: 0 !important;
    padding: 0 !important;
}

.ou-toc-l a {
    position: relative !important;

    display: block !important;

    padding: 9px 10px 9px 13px !important;

    border-radius: 8px !important;

    color: #6f7c69 !important;

    font-size: 0.74rem !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;

    text-decoration: none !important;

    transition:
        color 0.2s ease,
        background 0.2s ease,
        padding 0.2s ease !important;
}

.ou-toc-l a::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 50% !important;

    width: 3px !important;
    height: 0 !important;

    border-radius: 5px !important;

    background: #72ad16 !important;

    transform: translateY(-50%) !important;

    transition: height 0.2s ease !important;
}

.ou-toc-l a:hover {
    color: #4e850b !important;
    background: #f5faef !important;
    padding-left: 15px !important;
}

.ou-toc-l a:hover::before {
    height: 15px !important;
}

.ou-toc-l a.on {
    color: #4e850b !important;

    background:
        linear-gradient(
            90deg,
            #f1f8e9,
            #f8fbf5
        ) !important;

    font-weight: 750 !important;
}

.ou-toc-l a.on::before {
    height: 18px !important;
}


/* =========================================================
   DOCUMENT BODY
   ========================================================= */

.ou-body {
    min-width: 0 !important;

    padding: 0 !important;
}


/* =========================================================
   INDIVIDUAL SECTION
   ========================================================= */

.ou-part {
    position: relative !important;

    margin: 0 0 18px !important;
    padding: 29px 31px 30px !important;

    border: 1px solid rgba(152, 219, 28, 0.20) !important;
    border-radius: 16px !important;

    background: #ffffff !important;

    box-shadow:
        0 5px 18px rgba(48, 90, 8, 0.035) !important;

    scroll-margin-top: 30px !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}

.ou-part:hover {
    border-color: rgba(152, 219, 28, 0.30) !important;

    box-shadow:
        0 8px 24px rgba(48, 90, 8, 0.055) !important;
}


/* =========================================================
   SMALL SECTION LABEL
   ========================================================= */

.ou-part-n {
    display: inline-flex !important;
    align-items: center !important;

    margin-bottom: 10px !important;
    padding: 5px 9px !important;

    border-radius: 7px !important;

    background: rgba(183, 255, 53, 0.14) !important;
    color: #4e850b !important;

    font-size: 0.67rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;

    letter-spacing: 0.02em !important;
}


/* =========================================================
   HEADINGS
   ========================================================= */

.ou-part h2 {
    position: relative !important;

    margin: 0 0 19px !important;

    padding-bottom: 16px !important;

    color: #27361e !important;

    font-family: inherit !important;

    font-size: clamp(1.25rem, 2vw, 1.55rem) !important;
    line-height: 1.25 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;
}

.ou-part h2::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    bottom: 0 !important;

    width: 38px !important;
    height: 3px !important;

    border-radius: 10px !important;

    background: #72ad16 !important;
}


/* =========================================================
   PARAGRAPHS
   ========================================================= */

.ou-part > p {
    max-width: 850px !important;

    margin: 0 0 14px !important;

    color: #687565 !important;

    font-size: 0.84rem !important;
    line-height: 1.72 !important;
}

.ou-part > p:last-child {
    margin-bottom: 0 !important;
}

.ou-part p b {
    color: #3c512f !important;
    font-weight: 750 !important;
}


/* =========================================================
   LINKS
   ========================================================= */

.ou-part a:not(.ou-toc-l a) {
    color: #5c970c !important;

    font-weight: 700 !important;

    text-decoration:
        underline !important;

    text-decoration-color:
        rgba(114, 173, 22, 0.30) !important;

    text-underline-offset: 3px !important;

    transition:
        color 0.2s ease,
        text-decoration-color 0.2s ease !important;
}

.ou-part a:not(.ou-toc-l a):hover {
    color: #3f7207 !important;

    text-decoration-color:
        rgba(114, 173, 22, 0.65) !important;
}


/* =========================================================
   "С ПРОСТИ ДУМИ" BOX
   ========================================================= */

.ou-plain {
    position: relative !important;

    margin: 0 0 20px !important;
    padding: 16px 18px 16px 19px !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 11px !important;

    background:
        linear-gradient(
            135deg,
            #f5faef 0%,
            #fbfdf9 100%
        ) !important;

    color: #667362 !important;

    font-size: 0.81rem !important;
    line-height: 1.62 !important;
}

.ou-plain::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 13px !important;
    bottom: 13px !important;

    width: 3px !important;

    border-radius: 0 5px 5px 0 !important;

    background: #72ad16 !important;
}

.ou-plain b {
    display: block !important;

    margin-bottom: 5px !important;

    color: #3f7207 !important;

    font-size: 0.72rem !important;
    font-weight: 800 !important;

    text-transform: uppercase !important;
    letter-spacing: 0.035em !important;
}


/* =========================================================
   NUMBER STATISTICS
   ========================================================= */

.ou-nums {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    gap: 10px !important;

    margin: 21px 0 22px !important;
}

.ou-num {
    position: relative !important;

    min-width: 0 !important;

    padding: 17px 16px !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 11px !important;

    background: #fbfdf9 !important;
}

.ou-num::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 16px !important;
    right: 16px !important;

    height: 2px !important;

    border-radius: 0 0 4px 4px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(114, 173, 22, 0.55),
            transparent
        ) !important;
}

.ou-num b {
    display: block !important;

    margin-bottom: 4px !important;

    color: #4e850b !important;

    font-size: 1.15rem !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
}

.ou-num span {
    display: block !important;

    color: #7a8871 !important;

    font-size: 0.69rem !important;
    line-height: 1.45 !important;
}


/* =========================================================
   MARK / IMPORTANT BOX
   ========================================================= */

.ou-mark {
    position: relative !important;

    margin: 20px 0 !important;
    padding: 16px 18px 16px 20px !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 11px !important;

    background:
        linear-gradient(
            135deg,
            #f4f9ed,
            #fbfdf9
        ) !important;

    color: #65715f !important;

    font-size: 0.8rem !important;
    line-height: 1.65 !important;
}

.ou-mark::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 12px !important;
    bottom: 12px !important;

    width: 3px !important;

    border-radius: 0 5px 5px 0 !important;

    background: #72ad16 !important;
}

.ou-mark > b {
    color: #3c512f !important;
    font-weight: 800 !important;
}


/* =========================================================
   LISTS
   ========================================================= */

.ou-part ul,
.ou-part ol {
    margin: 15px 0 18px !important;
    padding: 0 !important;

    list-style: none !important;
}

.ou-part ul li,
.ou-part ol li {
    position: relative !important;

    margin: 0 0 9px !important;
    padding: 10px 13px 10px 36px !important;

    border: 1px solid rgba(152, 219, 28, 0.12) !important;
    border-radius: 9px !important;

    background: #fbfdf9 !important;

    color: #667362 !important;

    font-size: 0.8rem !important;
    line-height: 1.55 !important;
}

.ou-part ul li::before {
    content: "" !important;

    position: absolute !important;

    left: 14px !important;
    top: 17px !important;

    width: 7px !important;
    height: 7px !important;

    border-radius: 50% !important;

    background: #72ad16 !important;

    box-shadow:
        0 0 0 4px rgba(114, 173, 22, 0.09) !important;
}

.ou-part ol {
    counter-reset: ou-counter !important;
}

.ou-part ol li {
    counter-increment: ou-counter !important;
}

.ou-part ol li::before {
    content: counter(ou-counter) !important;

    position: absolute !important;

    left: 10px !important;
    top: 9px !important;

    width: 20px !important;
    height: 20px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 6px !important;

    background: rgba(183, 255, 53, 0.15) !important;
    color: #4e850b !important;

    font-size: 0.65rem !important;
    font-weight: 800 !important;
}


/* =========================================================
   LISTS INSIDE MARK
   ========================================================= */

.ou-mark ul {
    margin: 10px 0 5px !important;
}

.ou-mark ul li {
    margin-bottom: 6px !important;

    padding-top: 7px !important;
    padding-bottom: 7px !important;

    background: rgba(255,255,255,0.55) !important;
}


/* =========================================================
   FIRST SECTION — LITTLE EXTRA ACCENT
   ========================================================= */

.ou-part:first-child {
    border-top-color: rgba(114, 173, 22, 0.38) !important;
}

.ou-part:first-child::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 30px !important;
    right: 30px !important;

    height: 2px !important;

    border-radius: 0 0 5px 5px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(114, 173, 22, 0.45),
            transparent
        ) !important;
}


/* =========================================================
   SECTION SPACING
   ========================================================= */

.ou-part + .ou-part {
    margin-top: 18px !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 950px) {

    .ou-doc {
        grid-template-columns: 205px minmax(0, 1fr) !important;
        gap: 18px !important;
    }

    .ou-toc {
        padding: 14px !important;
    }

    .ou-toc-l a {
        padding: 8px 8px 8px 11px !important;

        font-size: 0.7rem !important;
    }

    .ou-part {
        padding: 25px 26px !important;
    }

    .ou-nums {
        gap: 8px !important;
    }
}


/* =========================================================
   TABLET / SMALL
   ========================================================= */

@media (max-width: 760px) {

    .ou-doc {
        display: block !important;
    }

    .ou-toc {
        position: relative !important;
        top: auto !important;

        margin-bottom: 15px !important;

        padding: 15px !important;
    }

    .ou-toc-h {
        margin-bottom: 10px !important;
    }

    .ou-toc-l {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

        gap: 3px 5px !important;
    }

    .ou-toc-l a {
        font-size: 0.7rem !important;
    }

    .ou-part {
        padding: 24px !important;
    }

    .ou-nums {
        grid-template-columns: 1fr !important;
    }

    .ou-num {
        display: grid !important;
        grid-template-columns: 90px minmax(0, 1fr) !important;
        align-items: center !important;

        gap: 10px !important;
    }

    .ou-num b {
        margin: 0 !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .ou-toc {
        border-radius: 13px !important;
    }

    .ou-toc-l {
        grid-template-columns: 1fr !important;
    }

    .ou-toc-l a {
        padding: 8px 9px 8px 12px !important;

        font-size: 0.72rem !important;
    }

    .ou-part {
        margin-bottom: 11px !important;
        padding: 21px 18px 22px !important;

        border-radius: 13px !important;
    }

    .ou-part h2 {
        margin-bottom: 16px !important;
        padding-bottom: 13px !important;

        font-size: 1.25rem !important;
    }

    .ou-part > p {
        margin-bottom: 12px !important;

        font-size: 0.79rem !important;
        line-height: 1.67 !important;
    }

    .ou-part-n {
        margin-bottom: 8px !important;

        font-size: 0.63rem !important;
    }

    .ou-plain {
        margin-bottom: 17px !important;

        padding: 14px 15px 14px 17px !important;

        font-size: 0.76rem !important;
        line-height: 1.6 !important;
    }

    .ou-mark {
        margin: 17px 0 !important;

        padding: 14px 15px 14px 17px !important;

        font-size: 0.75rem !important;
        line-height: 1.6 !important;
    }

    .ou-part ul,
    .ou-part ol {
        margin: 13px 0 15px !important;
    }

    .ou-part ul li,
    .ou-part ol li {
        padding: 9px 11px 9px 33px !important;

        font-size: 0.75rem !important;
    }

    .ou-part ul li::before {
        left: 12px !important;
        top: 16px !important;
    }

    .ou-part ol li::before {
        left: 8px !important;
        top: 8px !important;
    }

    .ou-num {
        grid-template-columns: 82px minmax(0, 1fr) !important;

        padding: 14px !important;
    }

    .ou-num b {
        font-size: 1rem !important;
    }

    .ou-num span {
        font-size: 0.66rem !important;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 400px) {

    .ou-part {
        padding: 19px 15px 20px !important;
    }

    .ou-part h2 {
        font-size: 1.15rem !important;
    }

    .ou-part > p {
        font-size: 0.76rem !important;
    }

    .ou-plain,
    .ou-mark {
        font-size: 0.73rem !important;
    }

    .ou-num {
        grid-template-columns: 75px minmax(0, 1fr) !important;
    }

    .ou-num b {
        font-size: 0.94rem !important;
    }
}
/**/

/* =========================================
   OU HISTORY — DARK KT STYLE
   ========================================= */

.ou-hist {
    position: relative !important;
    overflow: hidden !important;

    max-width: 900px !important;
    margin: 28px auto 0 !important;

    padding: 0 !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 18px !important;

    background:
        linear-gradient(
            145deg,
            #20291b 0%,
            #182116 55%,
            #151d13 100%
        ) !important;

    box-shadow:
        0 14px 40px rgba(15, 25, 8, 0.20),
        inset 0 1px 0 rgba(255,255,255,0.025) !important;

    color: #dce6d5 !important;
}


/* =========================================
   DECORATIVE GLOW
   ========================================= */

.ou-hist::before {
    content: "" !important;

    position: absolute !important;

    width: 260px !important;
    height: 260px !important;

    right: -100px !important;
    top: -150px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.13) 0%,
            rgba(183, 255, 53, 0.045) 40%,
            rgba(183, 255, 53, 0) 72%
        ) !important;

    pointer-events: none !important;
}


/* =========================================
   SECOND DECORATION
   ========================================= */

.ou-hist::after {
    content: "" !important;

    position: absolute !important;

    width: 100px !important;
    height: 100px !important;

    left: -55px !important;
    bottom: -55px !important;

    border: 1px solid rgba(152, 219, 28, 0.10) !important;

    border-radius: 50% !important;

    pointer-events: none !important;
}


/* =========================================
   HISTORY HEADER
   ========================================= */

.ou-hist-h {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 20px !important;

    padding: 20px 24px !important;

    border-bottom: 1px solid rgba(255,255,255,0.065) !important;

    background:
        rgba(255,255,255,0.018) !important;
}


/* TITLE */

.ou-hist-h > b {
    color: #f0f5eb !important;

    font-size: 0.92rem !important;
    line-height: 1.3 !important;

    font-weight: 800 !important;

    letter-spacing: -0.01em !important;
}


/* SMALL LABEL */

.ou-hist-h > span {
    display: inline-flex !important;
    align-items: center !important;

    padding: 6px 10px !important;

    border: 1px solid rgba(152, 219, 28, 0.15) !important;
    border-radius: 999px !important;

    background: rgba(152, 219, 28, 0.055) !important;

    color: #91a485 !important;

    font-size: 0.68rem !important;
    line-height: 1 !important;
}


/* =========================================
   HISTORY ROW
   ========================================= */

.ou-hist-r {
    position: relative !important;
    z-index: 2 !important;

    display: grid !important;
    grid-template-columns: 135px minmax(0, 1fr) !important;

    gap: 25px !important;

    padding: 21px 24px !important;

    border-bottom: 1px solid rgba(255,255,255,0.055) !important;

    transition:
        background 0.22s ease,
        padding-left 0.22s ease !important;
}


/* REMOVE LAST BORDER */

.ou-hist-r:last-child {
    border-bottom: 0 !important;
}


/* =========================================
   ROW HOVER
   ========================================= */

.ou-hist-r:hover {
    background:
        linear-gradient(
            90deg,
            rgba(152, 219, 28, 0.045),
            rgba(152, 219, 28, 0.012)
        ) !important;

    padding-left: 28px !important;
}


/* =========================================
   DATE
   ========================================= */

.ou-hist-d {
    position: relative !important;

    display: inline-flex !important;
    align-items: flex-start !important;

    padding-top: 2px !important;

    color: #8fa284 !important;

    font-size: 0.72rem !important;
    line-height: 1.5 !important;

    font-weight: 650 !important;
}


/* DATE DOT */

.ou-hist-d::before {
    content: "" !important;

    width: 7px !important;
    height: 7px !important;

    min-width: 7px !important;

    margin: 5px 9px 0 0 !important;

    border-radius: 50% !important;

    background: #72ad16 !important;

    box-shadow:
        0 0 0 4px rgba(114, 173, 22, 0.09) !important;
}


/* =========================================
   TEXT AREA
   ========================================= */

.ou-hist-t {
    display: flex !important;
    flex-direction: column !important;

    min-width: 0 !important;

    gap: 5px !important;
}


/* VERSION TITLE */

.ou-hist-t > b {
    color: #eaf2e4 !important;

    font-size: 0.84rem !important;
    line-height: 1.45 !important;

    font-weight: 750 !important;

    transition: color 0.2s ease !important;
}


.ou-hist-r:hover .ou-hist-t > b {
    color: #b7ff35 !important;
}


/* DESCRIPTION */

.ou-hist-t > span {
    color: #84937c !important;

    font-size: 0.75rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   LEAD TEXT ABOVE HISTORY
   ========================================= */

.ou-lead {
    max-width: 680px !important;

    margin: 9px auto 0 !important;

    color: #7a8871 !important;

    font-size: 0.88rem !important;
    line-height: 1.6 !important;

    text-align: center !important;
}


/* =========================================
   SECTION TITLE
   ========================================= */

.wrap-n > h2 {
    color: #27361e !important;

    font-family: inherit !important;

    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;

    text-align: center !important;

    margin-bottom: 0 !important;
}


/* =========================================
   SUBTLE TOP ACCENT
   ========================================= */

.ou-hist-h::before {
    content: "" !important;

    position: absolute !important;

    left: 24px !important;
    top: 0 !important;

    width: 45px !important;
    height: 2px !important;

    border-radius: 0 0 5px 5px !important;

    background:
        linear-gradient(
            90deg,
            #72ad16,
            #b7ff35
        ) !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 700px) {

    .ou-hist {
        margin-top: 24px !important;

        border-radius: 16px !important;
    }

    .ou-hist-r {
        grid-template-columns: 115px minmax(0, 1fr) !important;

        gap: 18px !important;

        padding: 19px 20px !important;
    }

    .ou-hist-r:hover {
        padding-left: 23px !important;
    }

    .ou-hist-h {
        padding: 18px 20px !important;
    }

    .ou-hist-h::before {
        left: 20px !important;
    }

    .ou-hist-d {
        font-size: 0.69rem !important;
    }

    .ou-hist-t > b {
        font-size: 0.81rem !important;
    }

    .ou-hist-t > span {
        font-size: 0.73rem !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 560px) {

    .ou-hist {
        margin-top: 21px !important;

        border-radius: 14px !important;
    }

    .ou-hist-h {
        align-items: flex-start !important;
        flex-direction: column !important;

        gap: 9px !important;

        padding: 17px 17px !important;
    }

    .ou-hist-h > b {
        font-size: 0.86rem !important;
    }

    .ou-hist-h > span {
        font-size: 0.64rem !important;
    }

    .ou-hist-h::before {
        left: 17px !important;
    }


    .ou-hist-r {
        display: flex !important;
        flex-direction: column !important;

        gap: 7px !important;

        padding: 17px !important;
    }

    .ou-hist-r:hover {
        padding-left: 20px !important;
    }


    .ou-hist-d {
        padding-top: 0 !important;

        font-size: 0.67rem !important;

        color: #91a485 !important;
    }

    .ou-hist-d::before {
        width: 6px !important;
        height: 6px !important;

        min-width: 6px !important;

        margin-top: 5px !important;
        margin-right: 8px !important;
    }


    .ou-hist-t {
        gap: 4px !important;
    }

    .ou-hist-t > b {
        font-size: 0.79rem !important;
        line-height: 1.42 !important;
    }

    .ou-hist-t > span {
        font-size: 0.72rem !important;
        line-height: 1.55 !important;
    }


    .ou-lead {
        padding: 0 8px !important;

        font-size: 0.81rem !important;
        line-height: 1.55 !important;
    }

    .wrap-n > h2 {
        font-size: 1.4rem !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .ou-hist-h {
        padding: 15px !important;
    }

    .ou-hist-r {
        padding: 15px !important;
    }

    .ou-hist-r:hover {
        padding-left: 18px !important;
    }

    .ou-hist-h::before {
        left: 15px !important;
    }

    .ou-hist-t > b {
        font-size: 0.76rem !important;
    }

    .ou-hist-t > span {
        font-size: 0.69rem !important;
    }
}
/**/

/* =========================================
   OU ASK — LIGHT KT STYLE
   ========================================= */

.ou-ask {
    position: relative !important;
    overflow: hidden !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;

    gap: 40px !important;

    padding: 34px 40px !important;

    border: 1px solid rgba(152, 219, 28, 0.25) !important;
    border-radius: 18px !important;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f8fbf5 55%,
            #f1f8e9 100%
        ) !important;

    box-shadow:
        0 10px 32px rgba(48, 90, 8, 0.06),
        0 2px 8px rgba(48, 90, 8, 0.025) !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease !important;
}


/* =========================================
   DECORATIVE GLOW
   ========================================= */

.ou-ask::before {
    content: "" !important;

    position: absolute !important;

    width: 260px !important;
    height: 260px !important;

    right: -110px !important;
    top: -135px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.20) 0%,
            rgba(183, 255, 53, 0.08) 42%,
            rgba(183, 255, 53, 0) 72%
        ) !important;

    pointer-events: none !important;
}


/* =========================================
   SECOND DECORATIVE CIRCLE
   ========================================= */

.ou-ask::after {
    content: "" !important;

    position: absolute !important;

    width: 105px !important;
    height: 105px !important;

    left: -55px !important;
    bottom: -60px !important;

    border: 1px solid rgba(152, 219, 28, 0.14) !important;

    border-radius: 50% !important;

    pointer-events: none !important;
}


/* =========================================
   TEXT AREA
   ========================================= */

.ou-ask > div:first-child {
    position: relative !important;
    z-index: 2 !important;

    min-width: 0 !important;
}


.ou-ask h2 {
    position: relative !important;

    margin: 0 0 10px !important;

    color: #27361e !important;

    font-family: inherit !important;

    font-size: clamp(1.45rem, 2.4vw, 1.9rem) !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;
}


/* SMALL GREEN ACCENT */

.ou-ask h2::after {
    content: "" !important;

    display: block !important;

    width: 40px !important;
    height: 3px !important;

    margin-top: 12px !important;

    border-radius: 10px !important;

    background:
        linear-gradient(
            90deg,
            #72ad16,
            #b7ff35
        ) !important;
}


.ou-ask p {
    max-width: 700px !important;

    margin: 0 !important;

    color: #6f7c69 !important;

    font-size: 0.86rem !important;
    line-height: 1.65 !important;
}


/* =========================================
   BUTTON AREA
   ========================================= */

.ou-ask-go {
    position: relative !important;
    z-index: 3 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 135px !important;
}


/* =========================================
   BUTTON
   ========================================= */

.ou-ask-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 48px !important;

    padding: 0 25px !important;

    border: 0 !important;
    border-radius: 10px !important;

    background: #72ad16 !important;
    color: #ffffff !important;

    font-family: inherit !important;

    font-size: 0.84rem !important;
    font-weight: 750 !important;

    line-height: 1 !important;

    text-decoration: none !important;

    box-shadow:
        0 7px 18px rgba(83, 133, 13, 0.18) !important;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease !important;
}


.ou-ask-go .btn:hover {
    transform: translateY(-2px) !important;

    background: #60960f !important;

    color: #ffffff !important;

    box-shadow:
        0 11px 25px rgba(83, 133, 13, 0.25) !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 750px) {

    .ou-ask {
        grid-template-columns: minmax(0, 1fr) auto !important;

        gap: 25px !important;

        padding: 30px 30px !important;
    }

    .ou-ask-go {
        min-width: 120px !important;
    }

    .ou-ask-go .btn {
        padding: 0 21px !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .ou-ask {
        grid-template-columns: 1fr !important;

        gap: 22px !important;

        padding: 27px 23px !important;

        border-radius: 16px !important;
    }


    .ou-ask h2 {
        font-size: 1.38rem !important;
    }


    .ou-ask p {
        font-size: 0.79rem !important;

        line-height: 1.6 !important;
    }


    .ou-ask-go {
        width: 100% !important;

        justify-content: flex-start !important;
    }


    .ou-ask-go .btn {
        width: 100% !important;

        min-height: 46px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .ou-ask {
        padding: 23px 18px !important;

        border-radius: 14px !important;
    }

    .ou-ask h2 {
        font-size: 1.28rem !important;
    }

    .ou-ask p {
        font-size: 0.75rem !important;
    }

    .ou-ask::before {
        width: 210px !important;
        height: 210px !important;

        right: -100px !important;
        top: -105px !important;
    }
}
/**/

/* =========================================
   OU DOCS — LIGHT DOCUMENT CARDS
   ========================================= */

.ou-docs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    gap: 16px !important;

    margin-top: 28px !important;
}


/* =========================================
   DOCUMENT CARD
   ========================================= */

.ou-doc-i {
    position: relative !important;
    overflow: hidden !important;

    display: flex !important;
    flex-direction: column !important;

    min-width: 0 !important;

    min-height: 205px !important;

    padding: 25px 23px 23px !important;

    border: 1px solid rgba(152, 219, 28, 0.20) !important;
    border-radius: 17px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 60%,
            #f4f9ef 100%
        ) !important;

    color: #27361e !important;

    text-decoration: none !important;

    box-shadow:
        0 6px 20px rgba(48, 90, 8, 0.045) !important;

    transition:
        transform 0.28s ease,
        border-color 0.28s ease,
        box-shadow 0.28s ease,
        background 0.28s ease !important;
}


/* =========================================
   TOP GREEN LINE
   ========================================= */

.ou-doc-i::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 22px !important;

    width: 42px !important;
    height: 3px !important;

    border-radius: 0 0 6px 6px !important;

    background:
        linear-gradient(
            90deg,
            #72ad16,
            #b7ff35
        ) !important;

    transition:
        width 0.28s ease !important;
}


/* =========================================
   DECORATIVE CIRCLE
   ========================================= */

.ou-doc-i::after {
    content: "" !important;

    position: absolute !important;

    width: 125px !important;
    height: 125px !important;

    right: -60px !important;
    bottom: -65px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.12),
            rgba(183, 255, 53, 0)
        ) !important;

    pointer-events: none !important;

    transition:
        transform 0.35s ease,
        opacity 0.35s ease !important;
}


/* =========================================
   HOVER
   ========================================= */

.ou-doc-i:hover {
    transform: translateY(-5px) !important;

    border-color: rgba(114, 173, 22, 0.38) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f9fcf5 50%,
            #eef7e6 100%
        ) !important;

    box-shadow:
        0 14px 32px rgba(48, 90, 8, 0.085),
        0 3px 8px rgba(48, 90, 8, 0.035) !important;
}

.ou-doc-i:hover::before {
    width: 72px !important;
}

.ou-doc-i:hover::after {
    transform: scale(1.25) !important;
}


/* =========================================
   ICON
   ========================================= */

.ou-doc-ic {
    position: relative !important;
    z-index: 2 !important;

    width: 46px !important;
    height: 46px !important;

    min-width: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 22px !important;

    border: 1px solid rgba(152, 219, 28, 0.18) !important;
    border-radius: 12px !important;

    background:
        rgba(183, 255, 53, 0.12) !important;

    color: #4e850b !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.7) !important;

    transition:
        transform 0.28s ease,
        background 0.28s ease,
        color 0.28s ease,
        border-color 0.28s ease !important;
}


.ou-doc-ic svg {
    width: 21px !important;
    height: 21px !important;
}


.ou-doc-i:hover .ou-doc-ic {
    transform: translateY(-2px) rotate(-2deg) !important;

    background: rgba(152, 219, 28, 0.19) !important;

    border-color: rgba(114, 173, 22, 0.30) !important;

    color: #3f7207 !important;
}


/* =========================================
   TITLE
   ========================================= */

.ou-doc-i > b {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin-bottom: 7px !important;

    padding-right: 28px !important;

    color: #27361e !important;

    font-size: 0.91rem !important;
    line-height: 1.4 !important;

    font-weight: 800 !important;

    letter-spacing: -0.01em !important;

    transition:
        color 0.22s ease !important;
}


.ou-doc-i:hover > b {
    color: #4e850b !important;
}


/* =========================================
   DESCRIPTION
   ========================================= */

.ou-doc-i > span:last-child {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    max-width: 290px !important;

    color: #71806b !important;

    font-size: 0.77rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   ARROW
   ========================================= */

.ou-doc-i > b::after {
    content: "→" !important;

    position: absolute !important;

    right: 0 !important;
    top: 50% !important;

    color: #72ad16 !important;

    font-size: 1rem !important;
    font-weight: 500 !important;

    opacity: 0.35 !important;

    transform:
        translateY(-50%)
        translateX(-4px) !important;

    transition:
        opacity 0.25s ease,
        transform 0.25s ease !important;
}


.ou-doc-i:hover > b::after {
    opacity: 1 !important;

    transform:
        translateY(-50%)
        translateX(2px) !important;
}


/* =========================================
   SECTION HEADING
   ========================================= */

.wrap-w > h2 {
    color: #7bb118;

    font-family: inherit !important;

    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;

    letter-spacing: -0.025em !important;

    text-align: center !important;

    margin-bottom: 0 !important;
}


/* =========================================
   LEAD
   ========================================= */

.wrap-w > .ou-lead {
    max-width: 600px !important;

    margin: 9px auto 0 !important;

    color: #7a8871 !important;

    font-size: 0.86rem !important;
    line-height: 1.6 !important;

    text-align: center !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 850px) {

    .ou-docs {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    .ou-doc-i {
        min-height: auto !important;

        display: grid !important;
        grid-template-columns: 46px minmax(0, 1fr) !important;
        column-gap: 17px !important;

        padding: 21px !important;
    }

    .ou-doc-ic {
        grid-row: span 2 !important;

        margin-bottom: 0 !important;
    }

    .ou-doc-i > b {
        align-self: end !important;

        margin-bottom: 3px !important;
    }

    .ou-doc-i > span:last-child {
        align-self: start !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .ou-docs {
        gap: 10px !important;

        margin-top: 22px !important;
    }

    .ou-doc-i {
        grid-template-columns: 40px minmax(0, 1fr) !important;

        column-gap: 13px !important;

        padding: 18px !important;

        border-radius: 14px !important;
    }

    .ou-doc-ic {
        width: 40px !important;
        height: 40px !important;

        min-width: 40px !important;

        border-radius: 10px !important;
    }

    .ou-doc-ic svg {
        width: 18px !important;
        height: 18px !important;
    }

    .ou-doc-i > b {
        font-size: 0.84rem !important;

        padding-right: 23px !important;
    }

    .ou-doc-i > span:last-child {
        font-size: 0.73rem !important;

        line-height: 1.55 !important;
    }

    .ou-doc-i::before {
        left: 18px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .ou-doc-i {
        grid-template-columns: 36px minmax(0, 1fr) !important;

        column-gap: 11px !important;

        padding: 16px !important;
    }

    .ou-doc-ic {
        width: 36px !important;
        height: 36px !important;

        min-width: 36px !important;
    }

    .ou-doc-ic svg {
        width: 17px !important;
        height: 17px !important;
    }

    .ou-doc-i > b {
        font-size: 0.81rem !important;
    }

    .ou-doc-i > span:last-child {
        font-size: 0.70rem !important;
    }

    .ou-doc-i::before {
        left: 16px !important;
    }
}
/**/
/* =========================================
   PV NOTS — KT LIGHT / NUMBERED CARDS
   ========================================= */

.pv-head {
    max-width: 720px !important;
    margin: 0 auto 30px !important;
    text-align: center !important;
}

.pv-head h2 {
    margin: 0 0 9px !important;

    color: #27361e !important;

    font-family: inherit !important;
    font-size: clamp(1.55rem, 2.5vw, 2rem) !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
}

.pv-head p {
    margin: 0 !important;

    color: #7a8871 !important;

    font-size: 0.9rem !important;
    line-height: 1.6 !important;
}


/* =========================================
   GRID
   ========================================= */

.pv-nots {
    display: grid !important;

    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 16px !important;

    max-width: 980px !important;

    margin: 0 auto !important;
}


/* =========================================
   CARD
   ========================================= */

.pv-not {
    position: relative !important;
    overflow: hidden !important;

    display: grid !important;

    grid-template-columns: 46px minmax(0, 1fr) !important;
    column-gap: 16px !important;

    min-width: 0 !important;

    padding: 23px 24px !important;

    border: 1px solid rgba(152, 219, 28, 0.22) !important;
    border-radius: 15px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 100%
        ) !important;

    box-shadow:
        0 5px 18px rgba(48, 90, 8, 0.045) !important;

    color: #65715f !important;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease !important;
}


/* =========================================
   HOVER
   ========================================= */

.pv-not:hover {
    transform: translateY(-3px) !important;

    border-color: rgba(114, 173, 22, 0.38) !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f8fcef 100%
        ) !important;

    box-shadow:
        0 11px 28px rgba(48, 90, 8, 0.075) !important;
}


/* =========================================
   DECORATIVE GLOW
   ========================================= */

.pv-not::before {
    content: "" !important;

    position: absolute !important;

    width: 150px !important;
    height: 150px !important;

    top: -85px !important;
    right: -75px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(183, 255, 53, 0.15) 0%,
            rgba(183, 255, 53, 0.05) 45%,
            transparent 72%
        ) !important;

    pointer-events: none !important;

    opacity: 0.65 !important;

    transition:
        transform 0.3s ease,
        opacity 0.3s ease !important;
}

.pv-not:hover::before {
    transform: scale(1.2) !important;

    opacity: 1 !important;
}


/* =========================================
   NUMBER
   ========================================= */

.pv-not-ic {
    position: relative !important;
    z-index: 2 !important;

    width: 46px !important;
    height: 46px !important;

    min-width: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    grid-row: span 2 !important;

    margin: 0 !important;

    border-radius: 12px !important;

    background:
        rgba(152, 219, 28, 0.11) !important;

    border: 1px solid rgba(152, 219, 28, 0.16) !important;

    color: #4e850b !important;

    font-family: inherit !important;
    font-size: 0 !important;
    font-weight: 800 !important;

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.45) !important;

    transition:
        background 0.25s ease,
        border-color 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease !important;
}


/* Hide original SVG */

.pv-not-ic svg {
    display: none !important;
}


/* Generate numbers */

.pv-not:nth-child(1) .pv-not-ic::before {
    content: "01" !important;
}

.pv-not:nth-child(2) .pv-not-ic::before {
    content: "02" !important;
}

.pv-not:nth-child(3) .pv-not-ic::before {
    content: "03" !important;
}

.pv-not:nth-child(4) .pv-not-ic::before {
    content: "04" !important;
}

.pv-not-ic::before {
    display: block !important;

    font-size: 0.78rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;

    letter-spacing: 0.03em !important;
}


/* Number hover */

.pv-not:hover .pv-not-ic {
    transform: translateY(-2px) !important;

    background:
        rgba(152, 219, 28, 0.18) !important;

    border-color:
        rgba(114, 173, 22, 0.28) !important;

    color: #3f7207 !important;
}


/* =========================================
   TITLE
   ========================================= */

.pv-not > b {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin: 1px 0 6px !important;

    color: #27361e !important;

    font-size: 0.94rem !important;
    line-height: 1.4 !important;

    font-weight: 750 !important;

    transition: color 0.2s ease !important;
}

.pv-not:hover > b {
    color: #4e850b !important;
}


/* =========================================
   DESCRIPTION
   ========================================= */

.pv-not > span:last-child {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    color: #6f7c69 !important;

    font-size: 0.79rem !important;
    line-height: 1.62 !important;
}


/* =========================================
   TOP ACCENT
   ========================================= */

.pv-not::after {
    content: "" !important;

    position: absolute !important;

    left: 24px !important;
    right: 24px !important;
    top: 0 !important;

    height: 2px !important;

    border-radius: 0 0 5px 5px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(114, 173, 22, 0.48),
            transparent
        ) !important;

    opacity: 0 !important;

    transition: opacity 0.25s ease !important;
}

.pv-not:hover::after {
    opacity: 1 !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 750px) {

    .pv-nots {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    .pv-not {
        padding: 20px 21px !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .pv-head {
        margin-bottom: 22px !important;

        padding: 0 5px !important;
    }

    .pv-head h2 {
        font-size: 1.4rem !important;
    }

    .pv-head p {
        font-size: 0.82rem !important;

        line-height: 1.55 !important;
    }

    .pv-nots {
        gap: 10px !important;
    }

    .pv-not {
        grid-template-columns: 40px minmax(0, 1fr) !important;

        column-gap: 13px !important;

        padding: 18px !important;

        border-radius: 13px !important;
    }

    .pv-not-ic {
        width: 40px !important;
        height: 40px !important;

        min-width: 40px !important;

        border-radius: 10px !important;
    }

    .pv-not-ic::before {
        font-size: 0.72rem !important;
    }

    .pv-not > b {
        font-size: 0.87rem !important;

        line-height: 1.4 !important;
    }

    .pv-not > span:last-child {
        font-size: 0.76rem !important;

        line-height: 1.58 !important;
    }

    .pv-not::after {
        left: 18px !important;
        right: 18px !important;
    }
}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 400px) {

    .pv-not {
        grid-template-columns: 36px minmax(0, 1fr) !important;

        column-gap: 10px !important;

        padding: 16px !important;
    }

    .pv-not-ic {
        width: 36px !important;
        height: 36px !important;

        min-width: 36px !important;
    }

    .pv-not-ic::before {
        font-size: 0.68rem !important;
    }

    .pv-not > b {
        font-size: 0.84rem !important;
    }

    .pv-not > span:last-child {
        font-size: 0.73rem !important;
    }

    .pv-not::after {
        left: 16px !important;
        right: 16px !important;
    }
}
/**/

/* ==========================================================================
   PV DATA — PREMIUM СВЕТЪЛ ДИЗАЙН
   Вдъхновен от SL PROBS стила
   ========================================================================== */

/* ==========================================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================================== */

section.sec:has(.pv-data) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.pv-data)::before {
    content: "" !important;

    position: absolute !important;

    width: 700px !important;
    height: 700px !important;

    left: 50% !important;
    top: -180px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.075) 0%,
            rgba(152,219,28,.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-data) .wrap-w {
    position: relative !important;
    z-index: 1 !important;

    max-width: 1120px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-data) .pv-head {
    max-width: 760px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}

section.sec:has(.pv-data) .pv-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}

section.sec:has(.pv-data) .pv-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.pv-data) .pv-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.25) !important;
}


/* ==========================================================================
   TABLE WRAPPER
   ========================================================================== */

section.sec:has(.pv-data) .pv-data {
    position: relative !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 20px !important;

    overflow: hidden !important;

    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;
}

/* Зелена линия отгоре */
section.sec:has(.pv-data) .pv-data::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c
        ) !important;

    opacity: .8 !important;

    z-index: 3 !important;
}


/* ==========================================================================
   TABLE
   ========================================================================== */

section.sec:has(.pv-data) table {
    width: 100% !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    background: #ffffff !important;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.pv-data) thead {
    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.055),
            rgba(255,255,255,0)
        ) !important;
}

section.sec:has(.pv-data) th {
    padding: 20px 19px !important;

    border-bottom: 1px solid #e5e7eb !important;

    color: #374151 !important;

    font-size: 11px !important;
    line-height: 1.3 !important;

    font-weight: 800 !important;

    letter-spacing: .055em !important;

    text-align: left !important;

    text-transform: uppercase !important;
}

section.sec:has(.pv-data) th:first-child {
    padding-left: 24px !important;
}

section.sec:has(.pv-data) th:last-child {
    padding-right: 24px !important;
}


/* ==========================================================================
   TABLE ROWS
   ========================================================================== */

section.sec:has(.pv-data) tbody tr {
    position: relative !important;

    transition:
        background .25s ease !important;
}

section.sec:has(.pv-data) tbody tr:hover {
    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,.045),
            rgba(152,219,28,.012)
        ) !important;
}


/* Хоризонтални линии */
section.sec:has(.pv-data) tbody td {
    padding: 20px 19px !important;

    border-bottom: 1px solid #edf0f2 !important;

    color: #596273 !important;

    font-size: 13px !important;

    line-height: 1.6 !important;

    vertical-align: middle !important;
}

section.sec:has(.pv-data) tbody tr:last-child td {
    border-bottom: 0 !important;
}

section.sec:has(.pv-data) tbody td:first-child {
    padding-left: 24px !important;
}

section.sec:has(.pv-data) tbody td:last-child {
    padding-right: 24px !important;
}


/* ==========================================================================
   FIRST COLUMN
   ========================================================================== */

section.sec:has(.pv-data) tbody td:first-child {
    min-width: 190px !important;
}

section.sec:has(.pv-data) tbody td:first-child b {
    display: block !important;

    margin-bottom: 3px !important;

    color: #172000 !important;

    font-size: 13px !important;

    font-weight: 750 !important;
}

section.sec:has(.pv-data) tbody td:first-child span {
    display: block !important;

    color: #9aa3ad !important;

    font-size: 11px !important;

    line-height: 1.45 !important;
}


/* ==========================================================================
   SECOND COLUMN
   ========================================================================== */

section.sec:has(.pv-data) tbody td:nth-child(2) {
    color: #596273 !important;
}


/* ==========================================================================
   BASIS BADGES
   ========================================================================== */

section.sec:has(.pv-data) .pv-basis {
    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    min-height: 28px !important;

    padding: 5px 10px !important;

    border-radius: 8px !important;

    font-size: 10px !important;

    line-height: 1 !important;

    font-weight: 800 !important;

    letter-spacing: .02em !important;

    white-space: nowrap !important;
}


/* Договор */
section.sec:has(.pv-data) .pv-basis.c {
    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.25) !important;

    color: #5f9008 !important;
}


/* Закон */
section.sec:has(.pv-data) .pv-basis.l {
    background: rgba(59,130,246,.08) !important;

    border: 1px solid rgba(59,130,246,.17) !important;

    color: #2563a8 !important;
}


/* Интерес */
section.sec:has(.pv-data) .pv-basis.i {
    background: rgba(245,158,11,.09) !important;

    border: 1px solid rgba(245,158,11,.18) !important;

    color: #b45309 !important;
}


/* Съгласие */
section.sec:has(.pv-data) .pv-basis.s {
    background: rgba(139,92,246,.08) !important;

    border: 1px solid rgba(139,92,246,.17) !important;

    color: #7048b5 !important;
}


/* ==========================================================================
   RETENTION / KEEP
   ========================================================================== */

section.sec:has(.pv-data) .pv-keep {
    display: block !important;

    margin-bottom: 3px !important;

    color: #26351a !important;

    font-size: 13px !important;

    font-weight: 800 !important;

    line-height: 1.3 !important;
}

section.sec:has(.pv-data) tbody td:last-child > span:not(.pv-keep) {
    display: block !important;

    color: #9aa3ad !important;

    font-size: 10px !important;

    line-height: 1.4 !important;
}


/* ==========================================================================
   LEGEND
   ========================================================================== */

section.sec:has(.pv-data) .pv-legend {
    display: flex !important;

    flex-wrap: wrap !important;
    align-items: center !important;

    gap: 9px 20px !important;

    margin-top: 18px !important;

    padding: 0 4px !important;

    color: #7b8491 !important;

    font-size: 11px !important;

    line-height: 1.5 !important;
}

section.sec:has(.pv-data) .pv-legend > span {
    display: inline-flex !important;

    align-items: center !important;

    gap: 6px !important;
}

section.sec:has(.pv-data) .pv-legend .pv-basis {
    min-height: 23px !important;

    padding: 4px 8px !important;

    border-radius: 7px !important;

    font-size: 9px !important;
}


/* ==========================================================================
   ЛЕК HOVER АКЦЕНТ НА РЕДА
   ========================================================================== */

section.sec:has(.pv-data) tbody tr::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;

    width: 2px !important;

    background: #7cbf00 !important;

    opacity: 0 !important;

    transition: opacity .25s ease !important;
}

section.sec:has(.pv-data) tbody tr:hover::after {
    opacity: .8 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 900px) {

    section.sec:has(.pv-data) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-data) .pv-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.pv-data) th,
    section.sec:has(.pv-data) tbody td {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    section.sec:has(.pv-data) th:first-child,
    section.sec:has(.pv-data) tbody td:first-child {
        padding-left: 18px !important;
    }

    section.sec:has(.pv-data) th:last-child,
    section.sec:has(.pv-data) tbody td:last-child {
        padding-right: 18px !important;
    }

    section.sec:has(.pv-data) tbody td {
        font-size: 12px !important;
    }
}


/* ==========================================================================
   MOBILE — ТАБЛИЦАТА СТАВА НА КАРТИ
   ========================================================================== */

@media (max-width: 700px) {

    section.sec:has(.pv-data) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-data) .pv-head h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-data) .pv-head p {
        font-size: 14px !important;
    }

    section.sec:has(.pv-data) .pv-data {
        border: 0 !important;

        background: transparent !important;

        box-shadow: none !important;

        overflow: visible !important;
    }

    section.sec:has(.pv-data) .pv-data::before {
        display: none !important;
    }

    section.sec:has(.pv-data) table,
    section.sec:has(.pv-data) thead,
    section.sec:has(.pv-data) tbody,
    section.sec:has(.pv-data) tr,
    section.sec:has(.pv-data) th,
    section.sec:has(.pv-data) td {
        display: block !important;
    }

    /* Скриваме оригиналния header */
    section.sec:has(.pv-data) thead {
        display: none !important;
    }

    section.sec:has(.pv-data) tbody {
        display: grid !important;

        gap: 14px !important;
    }

    /* Всяка таблица = отделна карта */
    section.sec:has(.pv-data) tbody tr {
        position: relative !important;

        padding: 20px 18px !important;

        background: #ffffff !important;

        border: 1px solid #e5e7eb !important;

        border-radius: 17px !important;

        overflow: hidden !important;

        box-shadow:
            0 7px 22px rgba(15,23,42,.045),
            0 1px 3px rgba(15,23,42,.025) !important;

        transition:
            transform .25s ease,
            border-color .25s ease,
            box-shadow .25s ease !important;
    }

    section.sec:has(.pv-data) tbody tr::before {
        content: "" !important;

        position: absolute !important;

        left: 0 !important;
        top: 0 !important;

        width: 100% !important;
        height: 3px !important;

        background:
            linear-gradient(
                90deg,
                #7cbf00,
                #c3f36c
            ) !important;

        opacity: .75 !important;
    }

    section.sec:has(.pv-data) tbody tr:hover {
        transform: translateY(-3px) !important;

        border-color: rgba(105,201,14,.4) !important;

        box-shadow:
            0 15px 32px rgba(15,23,42,.07),
            0 4px 14px rgba(152,219,28,.055) !important;
    }

    /* Премахваме старите граници */
    section.sec:has(.pv-data) tbody td {
        position: relative !important;

        width: 100% !important;

        min-width: 0 !important;

        padding: 0 !important;

        border: 0 !important;

        font-size: 13px !important;
    }

    section.sec:has(.pv-data) tbody td:not(:last-child) {
        margin-bottom: 15px !important;

        padding-bottom: 15px !important;

        border-bottom: 1px solid #edf0f2 !important;
    }

    /* Първи ред — основна информация */
    section.sec:has(.pv-data) tbody td:first-child {
        padding-left: 0 !important;
    }

    section.sec:has(.pv-data) tbody td:first-child b {
        margin-bottom: 4px !important;

        font-size: 14px !important;

        color: #172000 !important;
    }

    section.sec:has(.pv-data) tbody td:first-child span {
        font-size: 11px !important;
    }

    /* Етикети пред останалите полета */
    section.sec:has(.pv-data) tbody td:nth-child(2)::before {
        content: "За какво" !important;
    }

    section.sec:has(.pv-data) tbody td:nth-child(3)::before {
        content: "Основание" !important;
    }

    section.sec:has(.pv-data) tbody td:nth-child(4)::before {
        content: "Колко дълго" !important;
    }

    section.sec:has(.pv-data) tbody td:nth-child(2)::before,
    section.sec:has(.pv-data) tbody td:nth-child(3)::before,
    section.sec:has(.pv-data) tbody td:nth-child(4)::before {
        display: block !important;

        margin-bottom: 6px !important;

        color: #9aa3ad !important;

        font-size: 9px !important;

        font-weight: 800 !important;

        letter-spacing: .07em !important;

        text-transform: uppercase !important;
    }

    /* Второ поле */
    section.sec:has(.pv-data) tbody td:nth-child(2) {
        color: #596273 !important;

        line-height: 1.6 !important;
    }

    /* Последно поле */
    section.sec:has(.pv-data) tbody td:last-child {
        margin-bottom: 0 !important;

        padding-bottom: 0 !important;
    }

    /* Legend */
    section.sec:has(.pv-data) .pv-legend {
        display: grid !important;

        grid-template-columns: 1fr 1fr !important;

        gap: 8px !important;

        margin-top: 16px !important;

        padding: 0 !important;
    }

    section.sec:has(.pv-data) .pv-legend > span {
        align-items: flex-start !important;

        font-size: 10px !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 430px) {

    section.sec:has(.pv-data) {
        padding: 52px 12px !important;
    }

    section.sec:has(.pv-data) .pv-head {
        margin-bottom: 30px !important;
    }

    section.sec:has(.pv-data) .pv-head h2 {
        font-size: 27px !important;
    }

    section.sec:has(.pv-data) tbody {
        gap: 11px !important;
    }

    section.sec:has(.pv-data) tbody tr {
        padding: 18px 16px !important;

        border-radius: 15px !important;
    }

    section.sec:has(.pv-data) tbody td {
        font-size: 12px !important;
    }

    section.sec:has(.pv-data) tbody td:first-child b {
        font-size: 13px !important;
    }

    section.sec:has(.pv-data) .pv-legend {
        grid-template-columns: 1fr !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-data) tbody tr,
    section.sec:has(.pv-data) tbody tr::after {
        transition: none !important;
    }

    section.sec:has(.pv-data) tbody tr:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV WHO — ТЪМНА СЕКЦИЯ + СВЕТЛИ БОКСОВЕ
   ========================================================================== */

section.sec:has(.pv-who) {
    position: relative !important;
    background: #111827 !important;
    padding: 90px 20px !important;
    color: #ffffff !important;
    overflow: hidden !important;
}


/* ==========================================================================
   ФОНОВ СВЕТЛИНЕН АКЦЕНТ
   ========================================================================== */

section.sec:has(.pv-who)::before {
    content: "" !important;

    position: absolute !important;

    width: 700px !important;
    height: 700px !important;

    left: 50% !important;
    top: -260px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.11) 0%,
            rgba(152,219,28,.045) 35%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* Допълнителен лек светлинен ореол */

section.sec:has(.pv-who)::after {
    content: "" !important;

    position: absolute !important;

    width: 320px !important;
    height: 320px !important;

    right: -150px !important;
    bottom: -150px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.07),
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-who) .wrap-w {
    position: relative !important;

    z-index: 2 !important;

    max-width: 1050px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-who) .pv-head {
    max-width: 760px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}

section.sec:has(.pv-who) .pv-head h2 {
    margin: 0 0 14px !important;

    color: #ffffff !important;

    font-size: clamp(30px, 4vw, 42px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}

section.sec:has(.pv-who) .pv-head p {
    margin: 0 !important;

    color: #aeb8c7 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент под заглавието */

section.sec:has(.pv-who) .pv-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 14px rgba(152,219,28,.28) !important;
}


/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section.sec:has(.pv-who) .pv-who {
    display: grid !important;

    grid-template-columns: 1fr !important;

    gap: 14px !important;
}


/* ==========================================================================
   БОКС
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-i {
    position: relative !important;

    display: grid !important;

    grid-template-columns: 48px minmax(0, 1fr) auto !important;

    align-items: center !important;

    gap: 18px !important;

    padding: 21px 23px !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 17px !important;

    overflow: hidden !important;

    box-shadow:
        0 7px 25px rgba(0,0,0,.12),
        0 2px 5px rgba(0,0,0,.05) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}


/* Зелена линия отгоре */

section.sec:has(.pv-who) .pv-who-i::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c
        ) !important;

    opacity: .65 !important;
}


/* Hover */

section.sec:has(.pv-who) .pv-who-i:hover {
    transform: translateY(-4px) !important;

    border-color: rgba(152,219,28,.48) !important;

    box-shadow:
        0 17px 38px rgba(0,0,0,.18),
        0 5px 18px rgba(152,219,28,.07) !important;
}


/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-ic {
    width: 48px !important;
    height: 48px !important;

    min-width: 48px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.25) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.pv-who) .pv-who-ic svg {
    width: 22px !important;
    height: 22px !important;
}


/* Hover икона */

section.sec:has(.pv-who) .pv-who-i:hover .pv-who-ic {
    background: #7cbf00 !important;

    color: #172000 !important;

    transform: scale(1.06) !important;
}


/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-t {
    display: flex !important;

    flex-direction: column !important;

    min-width: 0 !important;
}

section.sec:has(.pv-who) .pv-who-t > b {
    display: block !important;

    margin-bottom: 5px !important;

    color: #172000 !important;

    font-size: 16px !important;

    line-height: 1.4 !important;

    font-weight: 750 !important;
}

section.sec:has(.pv-who) .pv-who-t > span {
    display: block !important;

    color: #596273 !important;

    font-size: 13.5px !important;

    line-height: 1.65 !important;
}


/* ==========================================================================
   ЛОКАЦИЯ
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-where {
    min-width: 105px !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: flex-end !important;

    gap: 3px !important;

    padding-left: 18px !important;

    border-left: 1px solid #e5e7eb !important;

    text-align: right !important;
}

section.sec:has(.pv-who) .pv-who-where > b {
    color: #4f7e08 !important;

    font-size: 12px !important;

    line-height: 1.3 !important;

    font-weight: 800 !important;

    text-transform: uppercase !important;

    letter-spacing: .04em !important;
}

section.sec:has(.pv-who) .pv-who-where > span {
    color: #8a94a3 !important;

    font-size: 11px !important;

    line-height: 1.4 !important;
}


/* ==========================================================================
   ДОЛЕН NOTE БОКС
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-note {
    position: relative !important;

    margin-top: 20px !important;

    padding: 19px 22px !important;

    border: 1px solid rgba(152,219,28,.22) !important;

    border-radius: 15px !important;

    background:
        linear-gradient(
            135deg,
            rgba(152,219,28,.09),
            rgba(255,255,255,.045)
        ) !important;

    color: #aeb8c7 !important;

    font-size: 13px !important;

    line-height: 1.65 !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035) !important;
}

section.sec:has(.pv-who) .pv-who-note::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 15px !important;
    bottom: 15px !important;

    width: 3px !important;

    border-radius: 0 4px 4px 0 !important;

    background: #7cbf00 !important;
}

section.sec:has(.pv-who) .pv-who-note > b {
    color: #d8ff9b !important;

    font-weight: 800 !important;
}


/* ==========================================================================
   РАЗЛИЧНИ АКЦЕНТИ
   ========================================================================== */

section.sec:has(.pv-who) .pv-who-i:nth-child(2) .pv-who-ic {
    color: #2563a8 !important;

    background: rgba(59,130,246,.09) !important;

    border-color: rgba(59,130,246,.20) !important;
}

section.sec:has(.pv-who) .pv-who-i:nth-child(2):hover .pv-who-ic {
    background: #3b82f6 !important;

    color: #ffffff !important;
}


section.sec:has(.pv-who) .pv-who-i:nth-child(3) .pv-who-ic {
    color: #7c3aed !important;

    background: rgba(124,58,237,.09) !important;

    border-color: rgba(124,58,237,.20) !important;
}

section.sec:has(.pv-who) .pv-who-i:nth-child(3):hover .pv-who-ic {
    background: #7c3aed !important;

    color: #ffffff !important;
}


section.sec:has(.pv-who) .pv-who-i:nth-child(4) .pv-who-ic {
    color: #b45309 !important;

    background: rgba(245,158,11,.10) !important;

    border-color: rgba(245,158,11,.22) !important;
}

section.sec:has(.pv-who) .pv-who-i:nth-child(4):hover .pv-who-ic {
    background: #f59e0b !important;

    color: #ffffff !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-who) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-who) .pv-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.pv-who) .pv-who-i {
        padding: 20px !important;

        gap: 15px !important;
    }

    section.sec:has(.pv-who) .pv-who-where {
        min-width: 90px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-who) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-who) .pv-head {
        margin-bottom: 30px !important;
    }

    section.sec:has(.pv-who) .pv-head h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-who) .pv-head p {
        font-size: 14px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-who) .pv-who {
        gap: 12px !important;
    }

    section.sec:has(.pv-who) .pv-who-i {
        grid-template-columns: 40px minmax(0, 1fr) !important;

        align-items: start !important;

        gap: 12px !important;

        padding: 18px 16px !important;

        border-radius: 15px !important;
    }

    section.sec:has(.pv-who) .pv-who-ic {
        width: 40px !important;
        height: 40px !important;

        min-width: 40px !important;

        border-radius: 11px !important;
    }

    section.sec:has(.pv-who) .pv-who-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    section.sec:has(.pv-who) .pv-who-t > b {
        font-size: 14px !important;

        line-height: 1.45 !important;
    }

    section.sec:has(.pv-who) .pv-who-t > span {
        font-size: 12.5px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-who) .pv-who-where {
        grid-column: 2 !important;

        align-items: flex-start !important;

        min-width: 0 !important;

        margin-top: 3px !important;

        padding: 8px 0 0 !important;

        border-left: 0 !important;

        border-top: 1px solid #e5e7eb !important;

        text-align: left !important;
    }

    section.sec:has(.pv-who) .pv-who-where > b {
        font-size: 10px !important;
    }

    section.sec:has(.pv-who) .pv-who-where > span {
        font-size: 10px !important;
    }

    section.sec:has(.pv-who) .pv-who-note {
        margin-top: 15px !important;

        padding: 17px 18px !important;

        font-size: 12px !important;

        line-height: 1.6 !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 390px) {

    section.sec:has(.pv-who) {
        padding: 52px 12px !important;
    }

    section.sec:has(.pv-who) .pv-who-i {
        padding: 16px 14px !important;
    }

    section.sec:has(.pv-who) .pv-who-ic {
        width: 38px !important;
        height: 38px !important;

        min-width: 38px !important;
    }

    section.sec:has(.pv-who) .pv-who-t > b {
        font-size: 13.5px !important;
    }

    section.sec:has(.pv-who) .pv-who-t > span {
        font-size: 12px !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-who) .pv-who-i,
    section.sec:has(.pv-who) .pv-who-ic {
        transition: none !important;
    }

    section.sec:has(.pv-who) .pv-who-i:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV RIGHTS — СВЕТЪЛ PREMIUM ДИЗАЙН
   ========================================================================== */

section.sec:has(.pv-rights) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}


/* ==========================================================================
   ЛЕК ЗЕЛЕН ФОН
   ========================================================================== */

section.sec:has(.pv-rights)::before {
    content: "" !important;

    position: absolute !important;

    width: 700px !important;
    height: 700px !important;

    left: 50% !important;
    top: -260px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.075) 0%,
            rgba(152,219,28,.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-rights) .wrap-w {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1050px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-rights) .pv-head {
    max-width: 760px !important;

    margin: 0 auto 48px !important;

    text-align: center !important;
}

section.sec:has(.pv-rights) .pv-head h2 {
    margin: 0 0 14px !important;

    color: #111827 !important;

    font-size: clamp(30px, 4vw, 42px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}

section.sec:has(.pv-rights) .pv-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 16px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент */

section.sec:has(.pv-rights) .pv-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 23px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.25) !important;
}


/* ==========================================================================
   GRID
   ========================================================================== */

section.sec:has(.pv-rights) .pv-rights {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;

    gap: 18px !important;
}


/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-width: 0 !important;

    padding: 24px 24px 21px !important;

    background: #ffffff !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 19px !important;

    overflow: hidden !important;

    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}


/* Зелена линия */

section.sec:has(.pv-rights) .pv-right::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c
        ) !important;

    opacity: .7 !important;
}


/* Hover */

section.sec:has(.pv-rights) .pv-right:hover {
    transform: translateY(-5px) !important;

    border-color: rgba(105,201,14,.42) !important;

    box-shadow:
        0 18px 40px rgba(15,23,42,.075),
        0 5px 18px rgba(152,219,28,.065) !important;
}


/* ==========================================================================
   HEADER НА КАРТАТА
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-h {
    display: flex !important;

    align-items: center !important;

    gap: 14px !important;

    margin-bottom: 14px !important;
}


/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-ic {
    width: 46px !important;
    height: 46px !important;

    min-width: 46px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.24) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.pv-rights) .pv-right-ic svg {
    width: 21px !important;
    height: 21px !important;
}


/* Hover icon */

section.sec:has(.pv-rights) .pv-right:hover .pv-right-ic {
    background: #7cbf00 !important;

    color: #172000 !important;

    transform: scale(1.06) !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ НА ПРАВОТО
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-h > b {
    color: #172000 !important;

    font-size: 16px !important;

    line-height: 1.4 !important;

    font-weight: 750 !important;
}


/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right > p {
    margin: 0 !important;

    color: #596273 !important;

    font-size: 13.5px !important;

    line-height: 1.7 !important;
}


/* ==========================================================================
   ДОЛНА ЧАСТ — ACTION
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-go {
    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    gap: 12px !important;

    margin-top: 21px !important;

    padding-top: 16px !important;

    border-top: 1px solid #edf0f2 !important;
}


/* ==========================================================================
   БУТОНИ
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-go .btn {
    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    min-height: 38px !important;

    padding: 0 17px !important;

    border-radius: 9px !important;

    font-family: inherit !important;

    font-size: 12px !important;

    font-weight: 750 !important;

    line-height: 1 !important;

    text-decoration: none !important;

    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease,
        box-shadow .25s ease !important;
}


/* Зелен бутон */

section.sec:has(.pv-rights) .pv-right-go .btn:not(.btn-ghost) {
    background: #72ad16 !important;

    border: 1px solid #72ad16 !important;

    color: #ffffff !important;

    box-shadow:
        0 5px 14px rgba(83,133,13,.16) !important;
}

section.sec:has(.pv-rights) .pv-right-go .btn:not(.btn-ghost):hover {
    transform: translateY(-2px) !important;

    background: #60960f !important;

    border-color: #60960f !important;

    box-shadow:
        0 8px 19px rgba(83,133,13,.22) !important;
}


/* Ghost бутон */

section.sec:has(.pv-rights) .pv-right-go .btn-ghost {
    background: #ffffff !important;

    border: 1px solid rgba(114,173,22,.28) !important;

    color: #4e850b !important;

    box-shadow:
        0 3px 10px rgba(48,90,8,.025) !important;
}

section.sec:has(.pv-rights) .pv-right-go .btn-ghost:hover {
    transform: translateY(-2px) !important;

    background: #f4f9ef !important;

    border-color: rgba(114,173,22,.45) !important;
}


/* ==========================================================================
   СРОК
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right-when {
    display: inline-flex !important;

    align-items: center !important;

    min-height: 28px !important;

    padding: 0 10px !important;

    border-radius: 7px !important;

    background: #f5f8f2 !important;

    color: #6f7c69 !important;

    font-size: 10.5px !important;

    line-height: 1 !important;

    font-weight: 700 !important;

    white-space: nowrap !important;
}


/* ==========================================================================
   РАЗЛИЧНИ АКЦЕНТИ
   ========================================================================== */

section.sec:has(.pv-rights) .pv-right:nth-child(2) .pv-right-ic,
section.sec:has(.pv-rights) .pv-right:nth-child(5) .pv-right-ic,
section.sec:has(.pv-rights) .pv-right:nth-child(6) .pv-right-ic {
    color: #2563a8 !important;

    background: rgba(59,130,246,.08) !important;

    border-color: rgba(59,130,246,.19) !important;
}

section.sec:has(.pv-rights) .pv-right:nth-child(2):hover .pv-right-ic,
section.sec:has(.pv-rights) .pv-right:nth-child(5):hover .pv-right-ic,
section.sec:has(.pv-rights) .pv-right:nth-child(6):hover .pv-right-ic {
    background: #3b82f6 !important;

    color: #ffffff !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-rights) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-rights) .pv-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.pv-rights) .pv-rights {
        gap: 14px !important;
    }

    section.sec:has(.pv-rights) .pv-right {
        padding: 21px 21px 19px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-rights) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-rights) .pv-head {
        margin-bottom: 30px !important;
    }

    section.sec:has(.pv-rights) .pv-head h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-rights) .pv-head p {
        font-size: 14px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-rights) .pv-rights {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    section.sec:has(.pv-rights) .pv-right {
        padding: 19px 17px 17px !important;

        border-radius: 16px !important;
    }

    section.sec:has(.pv-rights) .pv-right-h {
        gap: 12px !important;

        margin-bottom: 12px !important;
    }

    section.sec:has(.pv-rights) .pv-right-ic {
        width: 41px !important;
        height: 41px !important;

        min-width: 41px !important;

        border-radius: 11px !important;
    }

    section.sec:has(.pv-rights) .pv-right-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    section.sec:has(.pv-rights) .pv-right-h > b {
        font-size: 14px !important;

        line-height: 1.4 !important;
    }

    section.sec:has(.pv-rights) .pv-right > p {
        font-size: 12.5px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-rights) .pv-right-go {
        margin-top: 17px !important;

        padding-top: 13px !important;
    }

    section.sec:has(.pv-rights) .pv-right-go .btn {
        min-height: 36px !important;

        padding: 0 14px !important;

        font-size: 11.5px !important;
    }

    section.sec:has(.pv-rights) .pv-right-when {
        font-size: 10px !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 390px) {

    section.sec:has(.pv-rights) {
        padding: 52px 12px !important;
    }

    section.sec:has(.pv-rights) .pv-right {
        padding: 17px 15px 16px !important;
    }

    section.sec:has(.pv-rights) .pv-right-h > b {
        font-size: 13.5px !important;
    }

    section.sec:has(.pv-rights) .pv-right > p {
        font-size: 12px !important;
    }

    section.sec:has(.pv-rights) .pv-right-go .btn {
        padding: 0 12px !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-rights) .pv-right,
    section.sec:has(.pv-rights) .pv-right-ic,
    section.sec:has(.pv-rights) .pv-right-go .btn {
        transition: none !important;
    }

    section.sec:has(.pv-rights) .pv-right:hover {
        transform: none !important;
    }
}
/**/


/* ==========================================================================
   PV COOK — СВЕТЪЛ PREMIUM ДИЗАЙН
   ========================================================================== */

/* ==========================================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================================== */

section.sec:has(.pv-cook) {
    position: relative !important;

    background: #ffffff !important;

    padding: 90px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}


/* Лек зелен светлинен ефект */

section.sec:has(.pv-cook)::before {
    content: "" !important;

    position: absolute !important;

    width: 650px !important;
    height: 650px !important;

    left: 50% !important;
    top: -100px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.075) 0%,
            rgba(152,219,28,.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-cook) .wrap-w {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1050px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook {
    position: relative !important;

    padding: 42px !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 22px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 55%,
            #f7fbf3 100%
        ) !important;

    box-shadow:
        0 10px 35px rgba(15,23,42,.045),
        0 2px 8px rgba(15,23,42,.025) !important;

    overflow: hidden !important;

    transition:
        border-color .3s ease,
        box-shadow .3s ease !important;
}


/* Горна зелена линия */

section.sec:has(.pv-cook) .pv-cook::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c,
            #7cbf00
        ) !important;

    opacity: .8 !important;
}


/* Декоративен кръг */

section.sec:has(.pv-cook) .pv-cook::after {
    content: "" !important;

    position: absolute !important;

    width: 260px !important;
    height: 260px !important;

    right: -130px !important;
    top: -150px !important;

    border-radius: 50% !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.11),
            rgba(152,219,28,0) 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-cook) h2 {
    position: relative !important;

    margin: 0 0 12px !important;

    color: #172000 !important;

    font-size: clamp(28px, 4vw, 40px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec:has(.pv-cook) h2::after {
    content: "" !important;

    display: block !important;

    width: 43px !important;
    height: 3px !important;

    margin-top: 18px !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.25) !important;
}


/* Intro */

section.sec:has(.pv-cook) > .wrap-w > .pv-cook > p {
    max-width: 720px !important;

    margin: 0 0 30px !important;

    color: #697386 !important;

    font-size: 15px !important;

    line-height: 1.7 !important;
}


/* ==========================================================================
   COOKIE КАРТИ
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-l {
    position: relative !important;

    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 15px !important;

    margin-top: 28px !important;
}


/* ==========================================================================
   SINGLE CARD
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-i {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-width: 0 !important;

    min-height: 175px !important;

    padding: 22px 21px 21px !important;

    border: 1px solid #e3e7df !important;

    border-radius: 16px !important;

    background: #ffffff !important;

    box-shadow:
        0 6px 20px rgba(15,23,42,.035),
        0 1px 3px rgba(15,23,42,.025) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;

    overflow: hidden !important;
}


/* Горна линия на картата */

section.sec:has(.pv-cook) .pv-cook-i::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            rgba(152,219,28,.15),
            rgba(152,219,28,.65),
            rgba(152,219,28,.15)
        ) !important;

    opacity: .65 !important;
}


/* Hover */

section.sec:has(.pv-cook) .pv-cook-i:hover {
    transform: translateY(-5px) !important;

    border-color:
        rgba(105,201,14,.38) !important;

    background:
        linear-gradient(
            180deg,
            #ffffff,
            #fbfdf8
        ) !important;

    box-shadow:
        0 16px 35px rgba(15,23,42,.07),
        0 5px 18px rgba(152,219,28,.065) !important;
}


/* ==========================================================================
   TAG
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-tag {
    display: inline-flex !important;

    align-items: center !important;

    align-self: flex-start !important;

    min-height: 25px !important;

    padding: 4px 9px !important;

    margin-bottom: 16px !important;

    border-radius: 7px !important;

    font-size: 10px !important;

    line-height: 1 !important;

    font-weight: 800 !important;

    letter-spacing: .035em !important;

    text-transform: uppercase !important;
}


/* Задължителни */

section.sec:has(.pv-cook) .pv-cook-tag.need {
    background: rgba(152,219,28,.13) !important;

    border: 1px solid rgba(152,219,28,.24) !important;

    color: #527e08 !important;
}


/* По избор */

section.sec:has(.pv-cook) .pv-cook-tag.opt {
    background: rgba(59,130,246,.07) !important;

    border: 1px solid rgba(59,130,246,.15) !important;

    color: #37699e !important;
}


/* ==========================================================================
   CARD TITLE
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-i > b {
    display: block !important;

    margin-bottom: 8px !important;

    color: #172000 !important;

    font-size: 15px !important;

    line-height: 1.4 !important;

    font-weight: 750 !important;

    transition: color .25s ease !important;
}


section.sec:has(.pv-cook) .pv-cook-i:hover > b {
    color: #4f7908 !important;
}


/* ==========================================================================
   CARD TEXT
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-i > span:last-child {
    display: block !important;

    margin-top: auto !important;

    color: #687284 !important;

    font-size: 12.5px !important;

    line-height: 1.65 !important;
}


/* ==========================================================================
   BOTTOM CTA
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-go {
    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    gap: 20px !important;

    margin-top: 25px !important;

    padding-top: 23px !important;

    border-top: 1px solid #e8ece5 !important;
}


/* ==========================================================================
   BUTTON
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-go .btn {
    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    min-height: 45px !important;

    padding: 0 21px !important;

    border: 0 !important;

    border-radius: 10px !important;

    background: #72ad16 !important;

    color: #ffffff !important;

    font-family: inherit !important;

    font-size: 13px !important;

    font-weight: 750 !important;

    text-decoration: none !important;

    box-shadow:
        0 7px 18px rgba(83,133,13,.16) !important;

    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease !important;
}


section.sec:has(.pv-cook) .pv-cook-go .btn:hover {
    transform: translateY(-2px) !important;

    background: #60960f !important;

    box-shadow:
        0 11px 24px rgba(83,133,13,.22) !important;
}


/* ==========================================================================
   INFO TEXT
   ========================================================================== */

section.sec:has(.pv-cook) .pv-cook-say {
    color: #7a8492 !important;

    font-size: 11.5px !important;

    line-height: 1.55 !important;

    text-align: right !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 850px) {

    section.sec:has(.pv-cook) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-cook) .pv-cook {
        padding: 34px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-l {
        grid-template-columns: 1fr !important;

        gap: 12px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i {
        min-height: 0 !important;

        padding: 20px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-go {
        align-items: flex-start !important;

        flex-direction: column !important;
    }

    section.sec:has(.pv-cook) .pv-cook-say {
        text-align: left !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-cook) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-cook) .pv-cook {
        padding: 27px 18px !important;

        border-radius: 17px !important;
    }

    section.sec:has(.pv-cook) h2 {
        font-size: 28px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-cook) > .wrap-w > .pv-cook > p {
        font-size: 13px !important;

        line-height: 1.65 !important;

        margin-bottom: 23px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-l {
        gap: 10px !important;

        margin-top: 21px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i {
        padding: 18px !important;

        border-radius: 14px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-tag {
        margin-bottom: 13px !important;

        font-size: 9px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i > b {
        font-size: 14px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i > span:last-child {
        font-size: 12px !important;

        line-height: 1.6 !important;
    }

    section.sec:has(.pv-cook) .pv-cook-go {
        gap: 13px !important;

        margin-top: 21px !important;

        padding-top: 20px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-go .btn {
        width: 100% !important;

        min-height: 44px !important;
    }

    section.sec:has(.pv-cook) .pv-cook-say {
        font-size: 10.5px !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-cook) .pv-cook-i,
    section.sec:has(.pv-cook) .pv-cook-go .btn {
        transition: none !important;
    }

    section.sec:has(.pv-cook) .pv-cook-i:hover,
    section.sec:has(.pv-cook) .pv-cook-go .btn:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV LEAK — СВЕТЪЛ PREMIUM ДИЗАЙН
   ========================================================================== */

/* ==========================================================================
   ОСНОВНА СЕКЦИЯ
   ========================================================================== */

section.sec:has(.pv-leak) {
    position: relative !important;

    background: #ffffff !important;

    padding: 90px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}


/* Лек зелен фон */

section.sec:has(.pv-leak)::before {
    content: "" !important;

    position: absolute !important;

    width: 680px !important;
    height: 680px !important;

    left: 50% !important;
    top: -120px !important;

    transform: translateX(-50%) !important;

    background:
        radial-gradient(
            circle,
            rgba(152,219,28,.075) 0%,
            rgba(152,219,28,.025) 38%,
            transparent 70%
        ) !important;

    pointer-events: none !important;
}


/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-leak) .wrap-n {
    position: relative !important;

    z-index: 1 !important;

    max-width: 1050px !important;

    margin: 0 auto !important;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.pv-leak) .pv-head {
    max-width: 760px !important;

    margin: 0 auto 46px !important;

    text-align: center !important;
}


section.sec:has(.pv-leak) .pv-head h2 {
    margin: 0 0 13px !important;

    color: #111827 !important;

    font-size: clamp(29px, 4vw, 42px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}


section.sec:has(.pv-leak) .pv-head p {
    margin: 0 !important;

    color: #6b7280 !important;

    font-size: 15px !important;

    line-height: 1.7 !important;
}


/* Зелен акцент под заглавието */

section.sec:has(.pv-leak) .pv-head::after {
    content: "" !important;

    display: block !important;

    width: 45px !important;
    height: 3px !important;

    margin: 22px auto 0 !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.25) !important;
}


/* ==========================================================================
   MAIN CARD
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak {
    position: relative !important;

    padding: 0 !important;

    border: 1px solid #e3e7df !important;

    border-radius: 21px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 100%
        ) !important;

    box-shadow:
        0 10px 35px rgba(15,23,42,.045),
        0 2px 8px rgba(15,23,42,.025) !important;

    overflow: hidden !important;
}


/* Горна зелена линия */

section.sec:has(.pv-leak) .pv-leak::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7cbf00,
            #c3f36c,
            #7cbf00
        ) !important;

    opacity: .8 !important;
}


/* ==========================================================================
   CARD HEADER
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-h {
    display: flex !important;

    align-items: center !important;

    gap: 15px !important;

    padding: 25px 28px !important;

    border-bottom: 1px solid #e8ece5 !important;

    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.055),
            rgba(255,255,255,0)
        ) !important;
}


/* ==========================================================================
   ICON
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-ic {
    width: 45px !important;
    height: 45px !important;

    min-width: 45px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background: rgba(245,158,11,.09) !important;

    border: 1px solid rgba(245,158,11,.20) !important;

    color: #b45309 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}


section.sec:has(.pv-leak) .pv-leak-ic svg {
    width: 22px !important;
    height: 22px !important;
}


section.sec:has(.pv-leak) .pv-leak:hover .pv-leak-ic {
    background: #f59e0b !important;

    color: #ffffff !important;

    transform: scale(1.05) !important;
}


/* Заглавие */

section.sec:has(.pv-leak) .pv-leak-h > b {
    color: #172000 !important;

    font-size: 17px !important;

    line-height: 1.4 !important;

    font-weight: 750 !important;
}


/* ==========================================================================
   LIST
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-l {
    display: grid !important;

    grid-template-columns: 1fr !important;

    padding: 8px 28px 13px !important;
}


/* ==========================================================================
   SINGLE ROW
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-r {
    display: grid !important;

    grid-template-columns: 105px minmax(0, 1fr) !important;

    align-items: start !important;

    gap: 20px !important;

    padding: 21px 0 !important;

    border-bottom: 1px solid #edf0ec !important;

    transition:
        background .25s ease,
        padding-left .25s ease !important;
}


section.sec:has(.pv-leak) .pv-leak-r:last-child {
    border-bottom: 0 !important;
}


/* ==========================================================================
   HOVER ROW
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-r:hover {
    padding-left: 8px !important;
}


/* ==========================================================================
   TIME BADGE
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-t {
    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    width: fit-content !important;

    min-width: 82px !important;

    min-height: 29px !important;

    padding: 5px 10px !important;

    border-radius: 8px !important;

    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.22) !important;

    color: #527e08 !important;

    font-size: 11px !important;

    line-height: 1 !important;

    font-weight: 800 !important;

    white-space: nowrap !important;

    text-transform: uppercase !important;

    letter-spacing: .025em !important;
}


/* Първият срок е най-важен */

section.sec:has(.pv-leak) .pv-leak-r:first-child .pv-leak-t {
    background: rgba(245,158,11,.10) !important;

    border-color: rgba(245,158,11,.22) !important;

    color: #a65a0a !important;
}


/* ==========================================================================
   TEXT
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-x {
    display: block !important;

    color: #596273 !important;

    font-size: 13.5px !important;

    line-height: 1.7 !important;
}


section.sec:has(.pv-leak) .pv-leak-x b {
    color: #26351a !important;

    font-weight: 750 !important;
}


/* ==========================================================================
   ЛЕК АКЦЕНТ НА ВСЕКИ РЕД
   ========================================================================== */

section.sec:has(.pv-leak) .pv-leak-r::before {
    content: "" !important;

    position: absolute !important;
}


section.sec:has(.pv-leak) .pv-leak-r {
    position: relative !important;
}


/* Малка зелена точка */

section.sec:has(.pv-leak) .pv-leak-r::after {
    content: "" !important;

    position: absolute !important;

    left: -28px !important;

    top: 31px !important;

    width: 5px !important;
    height: 5px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 0 3px rgba(152,219,28,.10) !important;

    opacity: .8 !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-leak) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-leak) .pv-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-h {
        padding: 22px 23px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-l {
        padding-left: 23px !important;
        padding-right: 23px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r {
        grid-template-columns: 90px minmax(0, 1fr) !important;

        gap: 16px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r::after {
        left: -23px !important;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-leak) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-leak) .pv-head {
        margin-bottom: 32px !important;
    }

    section.sec:has(.pv-leak) .pv-head h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-leak) .pv-head p {
        font-size: 14px !important;
    }

    section.sec:has(.pv-leak) .pv-leak {
        border-radius: 17px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-h {
        align-items: flex-start !important;

        gap: 12px !important;

        padding: 19px 17px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-ic {
        width: 40px !important;
        height: 40px !important;

        min-width: 40px !important;

        border-radius: 11px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-h > b {
        padding-top: 3px !important;

        font-size: 14px !important;

        line-height: 1.45 !important;
    }

    section.sec:has(.pv-leak) .pv-leak-l {
        padding: 5px 17px 9px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r {
        grid-template-columns: 1fr !important;

        gap: 9px !important;

        padding: 17px 0 !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r:hover {
        padding-left: 0 !important;
    }

    section.sec:has(.pv-leak) .pv-leak-t {
        min-height: 27px !important;

        font-size: 10px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-x {
        font-size: 12.5px !important;

        line-height: 1.65 !important;
    }

    section.sec:has(.pv-leak) .pv-leak-r::after {
        display: none !important;
    }
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 400px) {

    section.sec:has(.pv-leak) {
        padding: 52px 12px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-h {
        padding: 18px 15px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-l {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    section.sec:has(.pv-leak) .pv-leak-x {
        font-size: 12px !important;
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-leak) .pv-leak-ic,
    section.sec:has(.pv-leak) .pv-leak-r {
        transition: none !important;
    }

    section.sec:has(.pv-leak) .pv-leak:hover .pv-leak-ic {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV ASK — DARK PREMIUM / 2 КАРТИ
   ========================================================================== */

section.sec:has(.pv-ask) {
    position: relative !important;
    background:
        radial-gradient(
            circle at 20% 20%,
            rgba(152,219,28,.09),
            transparent 34%
        ),
        radial-gradient(
            circle at 85% 80%,
            rgba(152,219,28,.055),
            transparent 32%
        ),
        #101713 !important;

    padding: 90px 20px !important;
    overflow: hidden !important;
}

/* Финален зелен отблясък */
section.sec:has(.pv-ask)::before {
    content: "" !important;
    position: absolute !important;
    width: 500px !important;
    height: 500px !important;
    left: -180px !important;
    top: -220px !important;
    border-radius: 50% !important;
    background: rgba(152,219,28,.055) !important;
    filter: blur(20px) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.pv-ask) .wrap-w {
    position: relative !important;
    z-index: 2 !important;
    max-width: 1050px !important;
}

/* ==========================================================================
   ОСНОВНА СТРУКТУРА — САМО 2 КАРТИ
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask {
    position: relative !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;

    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ==========================================================================
   ДВАТА ОСНОВНИ БОКСА
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask-c {
    position: relative !important;

    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,.9) !important;
    border-radius: 22px !important;

    padding: 32px !important;

    box-shadow:
        0 20px 55px rgba(0,0,0,.22),
        0 3px 12px rgba(0,0,0,.08) !important;

    overflow: hidden !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease !important;
}

/* Зелената линия */
section.sec:has(.pv-ask) .pv-ask-c::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 4px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #c4f36b
    ) !important;
}

/* Лек вътрешен зелен glow */
section.sec:has(.pv-ask) .pv-ask-c::after {
    content: "" !important;

    position: absolute !important;
    width: 180px !important;
    height: 180px !important;

    right: -90px !important;
    top: -90px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.055) !important;

    pointer-events: none !important;
}

/* Hover */
section.sec:has(.pv-ask) .pv-ask-c:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(152,219,28,.45) !important;

    box-shadow:
        0 28px 65px rgba(0,0,0,.28),
        0 8px 22px rgba(152,219,28,.08) !important;
}

/* ==========================================================================
   ЗАГЛАВИЯ
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask-c h3 {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 0 12px !important;

    color: #172000 !important;

    font-size: clamp(21px, 2vw, 25px) !important;
    line-height: 1.25 !important;

    font-weight: 800 !important;
    letter-spacing: -.4px !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask-c > p {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 0 24px !important;

    color: #596273 !important;

    font-size: 14px !important;
    line-height: 1.75 !important;
}

section.sec:has(.pv-ask) .pv-ask-c > p b {
    color: #26351a !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ВЪТРЕШНИЯТ pv-ask-box ВЕЧЕ НЕ Е БОКС
   ========================================================================== */

section.sec:has(.pv-ask) .pv-ask-box {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 !important;
    padding: 18px 0 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid #e7ebdf !important;
    border-radius: 0 !important;

    color: #596273 !important;

    font-size: 14px !important;
    line-height: 1.75 !important;

    box-shadow: none !important;
}

/* Име на организацията */
section.sec:has(.pv-ask) .pv-ask-box b {
    display: block !important;

    margin-bottom: 4px !important;

    color: #172000 !important;

    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Линкове */
section.sec:has(.pv-ask) .pv-ask-box a {
    display: inline-block !important;

    margin-top: 5px !important;

    color: #5f9008 !important;

    font-weight: 750 !important;
    text-decoration: none !important;

    transition: color .2s ease !important;
}

section.sec:has(.pv-ask) .pv-ask-box a:hover {
    color: #3f6500 !important;
    text-decoration: underline !important;
}

/* ==========================================================================
   РАЗЛИЧЕН АКЦЕНТ ЗА ДВАТА КАРТА
   ========================================================================== */

/* Първа — контакт */
section.sec:has(.pv-ask) .pv-ask-c:first-child::before {
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c8f56e
    ) !important;
}

/* Втора — жалба */
section.sec:has(.pv-ask) .pv-ask-c:last-child::before {
    background: linear-gradient(
        90deg,
        #6fb91a,
        #7cbf00
    ) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-ask) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-ask) .pv-ask {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c {
        padding: 27px !important;
        border-radius: 18px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-ask) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-ask) .pv-ask {
        gap: 15px !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c {
        padding: 23px 20px !important;
        border-radius: 16px !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c h3 {
        font-size: 20px !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c > p,
    section.sec:has(.pv-ask) .pv-ask-box {
        font-size: 13px !important;
        line-height: 1.7 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-ask) .pv-ask-c {
        transition: none !important;
    }

    section.sec:has(.pv-ask) .pv-ask-c:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV CARE — LIGHT PREMIUM
   ========================================================================== */

section.sec:has(.pv-care) {
    position: relative !important;
    background: #ffffff !important;
    padding: 75px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.pv-care)::before {
    content: "" !important;

    position: absolute !important;
    width: 500px !important;
    height: 500px !important;

    left: 50% !important;
    top: 50% !important;

    transform: translate(-50%, -50%) !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.035) 38%,
        transparent 72%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.pv-care) .wrap-n {
    position: relative !important;
    z-index: 2 !important;

    max-width: 900px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.pv-care) .pv-care {
    position: relative !important;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbfdf8 100%
        ) !important;

    border: 1px solid #e2e8df !important;
    border-radius: 22px !important;

    padding: 32px 36px !important;

    box-shadow:
        0 14px 40px rgba(15,23,42,.055),
        0 2px 8px rgba(15,23,42,.025) !important;

    overflow: hidden !important;

    transition:
        border-color .3s ease,
        box-shadow .3s ease,
        transform .3s ease !important;
}

/* Зелена вертикална линия */
section.sec:has(.pv-care) .pv-care::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;

    width: 4px !important;

    background: linear-gradient(
        180deg,
        #7cbf00,
        #c4f36b
    ) !important;
}

/* Деликатен glow вътре */
section.sec:has(.pv-care) .pv-care::after {
    content: "" !important;

    position: absolute !important;

    width: 240px !important;
    height: 240px !important;

    right: -130px !important;
    top: -130px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.055) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.pv-care) .pv-care-h {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    align-items: center !important;

    gap: 14px !important;

    margin-bottom: 22px !important;
}

/* Икона */
section.sec:has(.pv-care) .pv-care-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 13px !important;

    background: rgba(152,219,28,.12) !important;

    border: 1px solid rgba(152,219,28,.25) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.pv-care) .pv-care-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Заглавие */
section.sec:has(.pv-care) .pv-care-h > b {
    color: #172000 !important;

    font-size: 20px !important;
    line-height: 1.3 !important;

    font-weight: 800 !important;
    letter-spacing: -.3px !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.pv-care) .pv-care > p {
    position: relative !important;
    z-index: 2 !important;

    margin: 0 !important;
    padding: 17px 0 !important;

    color: #596273 !important;

    font-size: 14px !important;
    line-height: 1.75 !important;

    border-top: 1px solid #edf0eb !important;
}

/* Първият параграф */
section.sec:has(.pv-care) .pv-care > p:first-of-type {
    padding-top: 0 !important;
    border-top: 0 !important;
}

/* Bold */
section.sec:has(.pv-care) .pv-care > p b {
    color: #26351a !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.pv-care) .pv-care:hover {
    transform: translateY(-3px) !important;

    border-color: rgba(152,219,28,.4) !important;

    box-shadow:
        0 20px 48px rgba(15,23,42,.08),
        0 5px 18px rgba(152,219,28,.07) !important;
}

section.sec:has(.pv-care) .pv-care:hover .pv-care-ic {
    background: #7cbf00 !important;
    color: #172000 !important;

    transform: scale(1.05) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.pv-care) {
        padding: 65px 18px !important;
    }

    section.sec:has(.pv-care) .pv-care {
        padding: 28px 30px !important;
        border-radius: 18px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-care) {
        padding: 55px 14px !important;
    }

    section.sec:has(.pv-care) .pv-care {
        padding: 24px 20px 24px 22px !important;
        border-radius: 16px !important;
    }

    section.sec:has(.pv-care) .pv-care-h {
        gap: 11px !important;
        margin-bottom: 18px !important;
    }

    section.sec:has(.pv-care) .pv-care-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.pv-care) .pv-care-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    section.sec:has(.pv-care) .pv-care-h > b {
        font-size: 17px !important;
    }

    section.sec:has(.pv-care) .pv-care > p {
        font-size: 13px !important;
        line-height: 1.7 !important;
        padding: 15px 0 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-care) .pv-care,
    section.sec:has(.pv-care) .pv-care-ic {
        transition: none !important;
    }

    section.sec:has(.pv-care) .pv-care:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PV DOCS — LIGHT PREMIUM DOCUMENT NAVIGATION
   ========================================================================== */

section.sec:has(.pv-docs) {
    position: relative !important;

    background: #ffffff !important;

    padding: 85px 20px !important;

    color: #111827 !important;

    overflow: hidden !important;
}

/* Лек зелен фон */
section.sec:has(.pv-docs)::before {
    content: "" !important;

    position: absolute !important;

    width: 620px !important;
    height: 620px !important;

    left: 50% !important;
    top: 50% !important;

    transform: translate(-50%, -50%) !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 40%,
        transparent 72%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   CONTAINER
   ========================================================================== */

section.sec:has(.pv-docs) .wrap-w {
    position: relative !important;

    z-index: 2 !important;

    max-width: 1100px !important;

    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.pv-docs) .wrap-w > h2 {
    margin: 0 0 9px !important;

    color: #111827 !important;

    font-size: clamp(29px, 4vw, 40px) !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -1px !important;
}

/* Подзаглавие */
section.sec:has(.pv-docs) .pv-lead {
    margin: 0 0 38px !important;

    color: #6b7280 !important;

    font-size: 15px !important;

    line-height: 1.65 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.pv-docs) .pv-lead::after {
    content: "" !important;

    display: block !important;

    width: 42px !important;
    height: 3px !important;

    margin-top: 18px !important;

    border-radius: 99px !important;

    background: #7cbf00 !important;

    box-shadow:
        0 4px 12px rgba(152,219,28,.22) !important;
}

/* ==========================================================================
   DOCUMENT GRID
   ========================================================================== */

section.sec:has(.pv-docs) .pv-docs {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 18px !important;
}

/* ==========================================================================
   DOCUMENT CARD
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i {
    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    min-height: 225px !important;

    padding: 26px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf8 100%
        ) !important;

    border: 1px solid #e3e8df !important;

    border-radius: 20px !important;

    color: #111827 !important;

    text-decoration: none !important;

    overflow: hidden !important;

    box-shadow:
        0 8px 28px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}

/* Горна зелена линия */
section.sec:has(.pv-docs) .pv-doc-i::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #c5f36e
    ) !important;

    opacity: .75 !important;
}

/* Светъл зелен glow */
section.sec:has(.pv-docs) .pv-doc-i::after {
    content: "" !important;

    position: absolute !important;

    width: 170px !important;
    height: 170px !important;

    right: -95px !important;
    top: -95px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.055) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ICON
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-ic {
    position: relative !important;

    z-index: 2 !important;

    width: 48px !important;
    height: 48px !important;

    min-width: 48px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 22px !important;

    border-radius: 14px !important;

    background: rgba(152,219,28,.11) !important;

    border: 1px solid rgba(152,219,28,.24) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease,
        border-color .3s ease !important;
}

section.sec:has(.pv-docs) .pv-doc-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* ==========================================================================
   TITLE
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i > b {
    position: relative !important;

    z-index: 2 !important;

    display: block !important;

    margin-bottom: 8px !important;

    color: #172000 !important;

    font-size: 17px !important;

    line-height: 1.35 !important;

    font-weight: 800 !important;
}

/* ==========================================================================
   DESCRIPTION
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i > span:last-child {
    position: relative !important;

    z-index: 2 !important;

    display: block !important;

    color: #697386 !important;

    font-size: 13px !important;

    line-height: 1.65 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i:hover {
    transform: translateY(-6px) !important;

    border-color: rgba(152,219,28,.48) !important;

    background: #ffffff !important;

    box-shadow:
        0 18px 42px rgba(15,23,42,.085),
        0 6px 18px rgba(152,219,28,.07) !important;
}

section.sec:has(.pv-docs) .pv-doc-i:hover .pv-doc-ic {
    background: #7cbf00 !important;

    border-color: #7cbf00 !important;

    color: #172000 !important;

    transform: translateY(-2px) scale(1.04) !important;
}

/* ==========================================================================
   ACTIVE / FOCUS
   ========================================================================== */

section.sec:has(.pv-docs) .pv-doc-i:focus-visible {
    outline: 3px solid rgba(152,219,28,.35) !important;

    outline-offset: 4px !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 850px) {

    section.sec:has(.pv-docs) {
        padding: 70px 18px !important;
    }

    section.sec:has(.pv-docs) .pv-docs {
        grid-template-columns: 1fr 1fr !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i:last-child {
        grid-column: 1 / -1 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.pv-docs) {
        padding: 60px 14px !important;
    }

    section.sec:has(.pv-docs) .wrap-w > h2 {
        font-size: 29px !important;

        letter-spacing: -.7px !important;
    }

    section.sec:has(.pv-docs) .pv-lead {
        font-size: 14px !important;

        margin-bottom: 30px !important;
    }

    section.sec:has(.pv-docs) .pv-docs {
        grid-template-columns: 1fr !important;

        gap: 14px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i:last-child {
        grid-column: auto !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i {
        min-height: auto !important;

        padding: 22px !important;

        border-radius: 16px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-ic {
        width: 43px !important;
        height: 43px !important;

        min-width: 43px !important;

        margin-bottom: 18px !important;

        border-radius: 12px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i > b {
        font-size: 16px !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i > span:last-child {
        font-size: 13px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.pv-docs) .pv-doc-i,
    section.sec:has(.pv-docs) .pv-doc-ic {
        transition: none !important;
    }

    section.sec:has(.pv-docs) .pv-doc-i:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "КАК МЕРИМ"
   ========================================================================== */

section.sec:has(.sl-how) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.sl-how)::before {
    content: "" !important;
    position: absolute !important;
    width: 650px !important;
    height: 650px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.sl-how) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-how) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-how) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-how) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.sl-how) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.sl-how) .sl-how {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 6px rgba(15,23,42,.025) !important;
}

/* Горна зелена линия */
section.sec:has(.sl-how) .sl-how::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-h {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 25px 28px !important;
    background: linear-gradient(
        180deg,
        rgba(152,219,28,.055),
        rgba(255,255,255,0)
    ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* Икона */
section.sec:has(.sl-how) .sl-how-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.12) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #5f9008 !important;
}

section.sec:has(.sl-how) .sl-how-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Заглавие */
section.sec:has(.sl-how) .sl-how-h > b {
    color: #172000 !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-l {
    padding: 8px 28px 18px !important;
}

/* ==========================================================================
   СТЪПКА
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-r {
    display: grid !important;
    grid-template-columns: 48px 1fr !important;
    gap: 18px !important;
    position: relative !important;
    padding: 24px 0 !important;
    border-bottom: 1px solid #edf0f2 !important;
}

section.sec:has(.sl-how) .sl-how-r:last-child {
    border-bottom: 0 !important;
}

/* ==========================================================================
   НОМЕР
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-n {
    width: 42px !important;
    height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: #f4f9ed !important;
    border: 1px solid rgba(152,219,28,.28) !important;
    color: #5f9008 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-t {
    min-width: 0 !important;
}

section.sec:has(.sl-how) .sl-how-t > b {
    display: block !important;
    margin: 2px 0 7px !important;
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section.sec:has(.sl-how) .sl-how-t p {
    margin: 0 !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   CODE
   ========================================================================== */

section.sec:has(.sl-how) code {
    display: inline-block !important;
    padding: 2px 7px !important;
    border-radius: 6px !important;
    background: #f3f7ed !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #527d08 !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;
    font-size: .88em !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   ТОЧКИ ЗА МОНИТОРИНГ
   ========================================================================== */

section.sec:has(.sl-how) .sl-spots {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 14px !important;
}

section.sec:has(.sl-how) .sl-spot {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 7px 11px !important;
    background: #f8faf7 !important;
    border: 1px solid #e4e9df !important;
    border-radius: 999px !important;
    color: #4b5563 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 650 !important;
}

section.sec:has(.sl-how) .sl-spot i {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 0 3px rgba(152,219,28,.12) !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.sl-how) .sl-how-r {
    transition: background .25s ease !important;
}

section.sec:has(.sl-how) .sl-how-r:hover {
    background: linear-gradient(
        90deg,
        rgba(152,219,28,.025),
        transparent
    ) !important;
}

section.sec:has(.sl-how) .sl-how-r:hover .sl-how-n {
    background: #7cbf00 !important;
    color: #172000 !important;
    border-color: #7cbf00 !important;
    box-shadow: 0 5px 15px rgba(152,219,28,.20) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-how) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-how) .sl-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.sl-how) .sl-how-h {
        padding: 22px !important;
    }

    section.sec:has(.sl-how) .sl-how-l {
        padding: 6px 22px 14px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-how) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-how) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-how) .sl-head p {
        font-size: 14px !important;
    }

    section.sec:has(.sl-how) .sl-how {
        border-radius: 17px !important;
    }

    section.sec:has(.sl-how) .sl-how-h {
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-how) .sl-how-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.sl-how) .sl-how-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.sl-how) .sl-how-h > b {
        font-size: 14px !important;
    }

    section.sec:has(.sl-how) .sl-how-l {
        padding: 4px 17px 8px !important;
    }

    section.sec:has(.sl-how) .sl-how-r {
        grid-template-columns: 40px 1fr !important;
        gap: 13px !important;
        padding: 19px 0 !important;
    }

    section.sec:has(.sl-how) .sl-how-n {
        width: 36px !important;
        height: 36px !important;
        border-radius: 10px !important;
        font-size: 13px !important;
    }

    section.sec:has(.sl-how) .sl-how-t > b {
        font-size: 14px !important;
        margin-top: 1px !important;
    }

    section.sec:has(.sl-how) .sl-how-t p {
        font-size: 13px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-how) .sl-spots {
        gap: 6px !important;
        margin-top: 12px !important;
    }

    section.sec:has(.sl-how) .sl-spot {
        padding: 6px 9px !important;
        font-size: 11px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-how) .sl-how-r,
    section.sec:has(.sl-how) .sl-how-n {
        transition: none !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "КОЛКО ПОЛУЧАВАШ"
   ========================================================================== */

section.sec:has(.sl-tiers) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.sl-tiers)::before {
    content: "" !important;
    position: absolute !important;
    width: 650px !important;
    height: 650px !important;
    left: 50% !important;
    top: -170px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.sl-tiers) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-tiers) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-tiers) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-tiers) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.sl-tiers) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ТАБЛИЦА
   ========================================================================== */

section.sec:has(.sl-tiers) .sl-tiers {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 6px rgba(15,23,42,.025) !important;
}

/* Зелена линия */
section.sec:has(.sl-tiers) .sl-tiers::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
    z-index: 2 !important;
}

section.sec:has(.sl-tiers) table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    table-layout: fixed !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.sl-tiers) thead th {
    padding: 20px 22px !important;
    background: #f7faf4 !important;
    color: #26351a !important;
    border-bottom: 1px solid #e3e9dd !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    font-weight: 800 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
}

section.sec:has(.sl-tiers) thead th:nth-child(n+3) {
    text-align: center !important;
}

/* ==========================================================================
   КЛЕТКИ
   ========================================================================== */

section.sec:has(.sl-tiers) tbody td {
    padding: 21px 22px !important;
    border-bottom: 1px solid #edf0f2 !important;
    background: #ffffff !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    vertical-align: middle !important;
    transition:
        background .25s ease,
        color .25s ease !important;
}

section.sec:has(.sl-tiers) tbody tr:last-child td {
    border-bottom: 0 !important;
}

section.sec:has(.sl-tiers) tbody td:nth-child(n+3) {
    text-align: center !important;
}

/* Основен процент */
section.sec:has(.sl-tiers) tbody td:first-child {
    color: #172000 !important;
}

section.sec:has(.sl-tiers) tbody td:first-child b {
    font-weight: 750 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.sl-tiers) tbody tr:hover td {
    background: #fbfdf9 !important;
}

section.sec:has(.sl-tiers) tbody tr:hover td:first-child {
    color: #527d08 !important;
}

/* ==========================================================================
   MINUTES / MONO
   ========================================================================== */

section.sec:has(.sl-tiers) .mono {
    color: #6b7280 !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        monospace !important;
    font-size: 12px !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   ПРОЦЕНТИ
   ========================================================================== */

section.sec:has(.sl-tiers) .sl-pct {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 58px !important;
    height: 34px !important;
    padding: 0 12px !important;
    border-radius: 9px !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    border: 1px solid transparent !important;
}

/* 10% */
section.sec:has(.sl-tiers) .sl-pct.p10 {
    color: #527d08 !important;
    background: rgba(152,219,28,.10) !important;
    border-color: rgba(152,219,28,.24) !important;
}

/* 25% */
section.sec:has(.sl-tiers) .sl-pct.p25 {
    color: #477200 !important;
    background: rgba(152,219,28,.16) !important;
    border-color: rgba(152,219,28,.32) !important;
}

/* 50% */
section.sec:has(.sl-tiers) .sl-pct.p50 {
    color: #3e6200 !important;
    background: rgba(152,219,28,.23) !important;
    border-color: rgba(152,219,28,.38) !important;
}

/* 100% */
section.sec:has(.sl-tiers) .sl-pct.p100 {
    color: #172000 !important;
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.18) !important;
}

/* ==========================================================================
   DASH
   ========================================================================== */

section.sec:has(.sl-tiers) tbody td:has(> :not(*)) {
    text-align: center !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-tiers) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-tiers) .sl-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.sl-tiers) .sl-tiers {
        border-radius: 18px !important;
        overflow-x: auto !important;
    }

    section.sec:has(.sl-tiers) table {
        min-width: 720px !important;
    }

    section.sec:has(.sl-tiers) thead th,
    section.sec:has(.sl-tiers) tbody td {
        padding: 17px 16px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-tiers) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-tiers) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-tiers) .sl-head p {
        font-size: 14px !important;
    }

    section.sec:has(.sl-tiers) .sl-tiers {
        border-radius: 16px !important;
        margin: 0 -1px !important;
    }

    section.sec:has(.sl-tiers) table {
        min-width: 650px !important;
    }

    section.sec:has(.sl-tiers) thead th {
        padding: 15px 13px !important;
        font-size: 10px !important;
    }

    section.sec:has(.sl-tiers) tbody td {
        padding: 16px 13px !important;
        font-size: 13px !important;
    }

    section.sec:has(.sl-tiers) .mono {
        font-size: 11px !important;
    }

    section.sec:has(.sl-tiers) .sl-pct {
        min-width: 52px !important;
        height: 31px !important;
        padding: 0 9px !important;
        border-radius: 8px !important;
        font-size: 12px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-tiers) tbody td {
        transition: none !important;
    }
}
/**/

/* ==========================================================================
   ТЪМЕН PREMIUM ДИЗАЙН — "КОЛКО ПРАВИ ТОВА НА ПРАКТИКА"
   ========================================================================== */

section.sec:has(.sl-calc) {
    position: relative !important;
    background: #111827 !important;
    padding: 90px 20px !important;
    color: #f8fafc !important;
    overflow: hidden !important;
}

/* Зелен glow */
section.sec:has(.sl-calc)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -250px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(94,154,0,.16) 0%,
        rgba(152,219,28,.055) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Допълнителен мек фон */
section.sec:has(.sl-calc)::after {
    content: "" !important;
    position: absolute !important;
    width: 380px !important;
    height: 380px !important;
    right: -180px !important;
    bottom: -180px !important;
    background: rgba(152,219,28,.035) !important;
    border-radius: 50% !important;
    filter: blur(20px) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.sl-calc) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 900px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc {
    position: relative !important;
    background: #ffffff !important;
    color: #111827 !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 24px !important;
    padding: clamp(28px, 5vw, 48px) !important;
    overflow: hidden !important;
    box-shadow:
        0 25px 70px rgba(0,0,0,.28),
        0 4px 16px rgba(0,0,0,.12) !important;
}

/* Горна зелена линия */
section.sec:has(.sl-calc) .sl-calc::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 4px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc h2 {
    margin: 0 0 12px !important;
    color: #111827 !important;
    font-size: clamp(28px, 4vw, 38px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -.8px !important;
}

section.sec:has(.sl-calc) .sl-calc > p {
    max-width: 700px !important;
    margin: 0 0 30px !important;
    color: #687384 !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   КАЛКУЛАТОР
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-box {
    position: relative !important;
    background: #f7faf4 !important;
    border: 1px solid #e1e8da !important;
    border-radius: 17px !important;
    overflow: hidden !important;
}

/* ==========================================================================
   РЕДОВЕ
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-r {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 18px 21px !important;
    border-bottom: 1px solid #e4e9df !important;
}

section.sec:has(.sl-calc) .sl-calc-r span {
    color: #667085 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

section.sec:has(.sl-calc) .sl-calc-r b {
    color: #172000 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    text-align: right !important;
}

/* ==========================================================================
   ПОСЛЕДЕН РЕД — КРЕДИТ
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-t {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 23px 21px !important;
    background: #7cbf00 !important;
    color: #172000 !important;
}

section.sec:has(.sl-calc) .sl-calc-t span {
    font-size: 13px !important;
    font-weight: 750 !important;
}

section.sec:has(.sl-calc) .sl-calc-t b {
    font-size: 22px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
}

/* ==========================================================================
   ОБЯСНЕНИЕ
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-say {
    margin-top: 24px !important;
    padding: 18px 20px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    border-left: 3px solid #7cbf00 !important;
    border-radius: 12px !important;
    color: #687384 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

section.sec:has(.sl-calc) .sl-calc-say b {
    color: #26351a !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ЛЕК HOVER
   ========================================================================== */

section.sec:has(.sl-calc) .sl-calc-box {
    transition:
        box-shadow .3s ease,
        transform .3s ease !important;
}

section.sec:has(.sl-calc) .sl-calc-box:hover {
    box-shadow:
        0 12px 30px rgba(15,23,42,.07),
        0 3px 10px rgba(152,219,28,.05) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-calc) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-calc) .sl-calc {
        border-radius: 20px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-calc) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-calc) .sl-calc {
        padding: 25px 17px 22px !important;
        border-radius: 17px !important;
    }

    section.sec:has(.sl-calc) .sl-calc h2 {
        font-size: 27px !important;
        letter-spacing: -.6px !important;
    }

    section.sec:has(.sl-calc) .sl-calc > p {
        font-size: 13px !important;
        line-height: 1.65 !important;
        margin-bottom: 24px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-r {
        padding: 15px 16px !important;
        gap: 14px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-r span {
        font-size: 12px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-r b {
        font-size: 13px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-t {
        padding: 19px 16px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-t span {
        font-size: 12px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-t b {
        font-size: 20px !important;
    }

    section.sec:has(.sl-calc) .sl-calc-say {
        margin-top: 18px !important;
        padding: 15px 16px !important;
        font-size: 12px !important;
        line-height: 1.65 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-calc) .sl-calc-box {
        transition: none !important;
    }
}
/**/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАКВО НЕ СЕ БРОИ"
   ========================================================================== */

/* Основна секция */
section.sec:has(.sl-exc) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.sl-exc)::before {
    content: "" !important;
    position: absolute !important;
    width: 680px !important;
    height: 680px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-exc) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-exc) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-exc) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-exc) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелената черта */
section.sec:has(.sl-exc) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ОСНОВЕН БОКС
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 7px rgba(15,23,42,.025) !important;
}

/* Зелена линия отгоре */
section.sec:has(.sl-exc) .sl-exc::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА БОКСА
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-h {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 25px 28px !important;
    background: linear-gradient(
        180deg,
        rgba(152,219,28,.055),
        rgba(255,255,255,0)
    ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* Икона */
section.sec:has(.sl-exc) .sl-exc-ic {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.12) !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    color: #5f9008 !important;
}

section.sec:has(.sl-exc) .sl-exc-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Заглавие */
section.sec:has(.sl-exc) .sl-exc-h > b {
    color: #172000 !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ВЪВЕДЕНИЕ
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-lead {
    margin: 0 !important;
    padding: 22px 28px 8px !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   СПИСЪК
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-l {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
    padding: 18px 28px 28px !important;
}

/* ==========================================================================
   ОТДЕЛЕН ЕЛЕМЕНТ
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-i {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    padding: 20px !important;
    background: #f8faf7 !important;
    border: 1px solid #e7ece3 !important;
    border-radius: 15px !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        background .3s ease,
        box-shadow .3s ease !important;
}

/* Hover */
section.sec:has(.sl-exc) .sl-exc-i:hover {
    transform: translateY(-3px) !important;
    background: #ffffff !important;
    border-color: rgba(152,219,28,.42) !important;
    box-shadow:
        0 10px 25px rgba(15,23,42,.055),
        0 4px 12px rgba(152,219,28,.06) !important;
}

/* Зелена точка вместо тежки икони */
section.sec:has(.sl-exc) .sl-exc-i > i {
    position: relative !important;
    display: block !important;
    width: 9px !important;
    height: 9px !important;
    min-width: 9px !important;
    margin-top: 6px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 0 5px rgba(152,219,28,.12) !important;
}

/* Текст */
section.sec:has(.sl-exc) .sl-exc-i > span {
    min-width: 0 !important;
}

section.sec:has(.sl-exc) .sl-exc-i b {
    display: block !important;
    margin: 0 0 7px !important;
    color: #26351a !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section.sec:has(.sl-exc) .sl-exc-i p {
    margin: 0 !important;
    color: #687281 !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   ДОЛЕН АКЦЕНТ
   ========================================================================== */

section.sec:has(.sl-exc) .sl-exc-count {
    margin: 0 28px 28px !important;
    padding: 18px 20px !important;
    background: rgba(152,219,28,.065) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    border-left: 3px solid #7cbf00 !important;
    border-radius: 12px !important;
    color: #596273 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

section.sec:has(.sl-exc) .sl-exc-count b {
    color: #26351a !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec:has(.sl-exc) {
        padding: 75px 18px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-l {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.sl-exc) .sl-exc-h {
        padding: 23px 23px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-lead {
        padding: 21px 23px 8px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-l {
        padding: 17px 23px 24px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-count {
        margin: 0 23px 23px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-exc) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-exc) .sl-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.sl-exc) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-exc) .sl-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-exc) .sl-exc {
        border-radius: 17px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-h {
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-h > b {
        font-size: 14px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-lead {
        padding: 19px 17px 5px !important;
        font-size: 13px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-l {
        gap: 11px !important;
        padding: 14px 17px 19px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-i {
        padding: 17px !important;
        border-radius: 13px !important;
        gap: 13px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-i b {
        font-size: 13px !important;
    }

    section.sec:has(.sl-exc) .sl-exc-i p {
        font-size: 12.5px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-exc) .sl-exc-count {
        margin: 0 17px 19px !important;
        padding: 15px 16px !important;
        font-size: 12px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-exc) .sl-exc-i {
        transition: none !important;
    }

    section.sec:has(.sl-exc) .sl-exc-i:hover {
        transform: none !important;
    }
}
/**/


/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КАК СЕ ИСКА НАМАЛЕНИЕ"
   ========================================================================== */

/* Основна секция */
section.sec:has(.sl-claim) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.sl-claim)::before {
    content: "" !important;
    position: absolute !important;
    width: 680px !important;
    height: 680px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.07) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-claim) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-claim) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section.sec:has(.sl-claim) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-claim) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.sl-claim) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ТРИТЕ СТЪПКИ
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim {
    position: relative !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 18px !important;
}

/* Линия между стъпките */
section.sec:has(.sl-claim) .sl-claim::before {
    content: "" !important;
    position: absolute !important;
    top: 31px !important;
    left: 11% !important;
    right: 11% !important;
    height: 1px !important;
    background: linear-gradient(
        90deg,
        rgba(152,219,28,.15),
        rgba(152,219,28,.65),
        rgba(152,219,28,.15)
    ) !important;
    z-index: 0 !important;
}

/* ==========================================================================
   СТЪПКА
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim-i {
    position: relative !important;
    z-index: 1 !important;
    background: #ffffff !important;
    border: 1px solid #e4e8e1 !important;
    border-radius: 20px !important;
    padding: 28px 25px 27px !important;
    box-shadow:
        0 8px 28px rgba(15,23,42,.045),
        0 2px 6px rgba(15,23,42,.025) !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Горна зелена линия */
section.sec:has(.sl-claim) .sl-claim-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 20px !important;
    right: 20px !important;
    height: 3px !important;
    border-radius: 0 0 99px 99px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
    opacity: .75 !important;
}

/* Hover */
section.sec:has(.sl-claim) .sl-claim-i:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(152,219,28,.45) !important;
    box-shadow:
        0 18px 40px rgba(15,23,42,.075),
        0 5px 18px rgba(152,219,28,.07) !important;
}

/* ==========================================================================
   НОМЕР
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim-n {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 62px !important;
    height: 62px !important;
    margin-bottom: 21px !important;
    border-radius: 17px !important;
    background: #7cbf00 !important;
    color: #172000 !important;
    font-size: 22px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    box-shadow:
        0 8px 18px rgba(152,219,28,.20),
        inset 0 1px 0 rgba(255,255,255,.35) !important;
    transition:
        transform .3s ease,
        box-shadow .3s ease !important;
}

/* Hover номер */
section.sec:has(.sl-claim) .sl-claim-i:hover .sl-claim-n {
    transform: scale(1.05) !important;
    box-shadow:
        0 11px 24px rgba(152,219,28,.27),
        inset 0 1px 0 rgba(255,255,255,.35) !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim-i > b {
    display: block !important;
    margin: 0 0 9px !important;
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 800 !important;
}

section.sec:has(.sl-claim) .sl-claim-i > p {
    margin: 0 !important;
    color: #667085 !important;
    font-size: 13.5px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   ЗАЩО НЕ Е АВТОМАТИЧНО
   ========================================================================== */

section.sec:has(.sl-claim) .sl-claim-why {
    position: relative !important;
    margin-top: 22px !important;
    padding: 22px 25px 22px 27px !important;
    background: #f7faf4 !important;
    border: 1px solid rgba(152,219,28,.25) !important;
    border-left: 4px solid #7cbf00 !important;
    border-radius: 15px !important;
    color: #5d6875 !important;
    font-size: 13.5px !important;
    line-height: 1.75 !important;
    box-shadow:
        inset 0 1px 2px rgba(15,23,42,.02) !important;
}

/* Заглавие в долния блок */
section.sec:has(.sl-claim) .sl-claim-why > b {
    display: block !important;
    margin-bottom: 5px !important;
    color: #26351a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 850px) {

    section.sec:has(.sl-claim) {
        padding: 75px 18px !important;
    }

    section.sec:has(.sl-claim) .sl-claim {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    section.sec:has(.sl-claim) .sl-claim::before {
        display: none !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i {
        padding: 24px 23px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-n {
        width: 52px !important;
        height: 52px !important;
        margin-bottom: 17px !important;
        border-radius: 14px !important;
        font-size: 19px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-claim) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-claim) .sl-head {
        margin-bottom: 36px !important;
    }

    section.sec:has(.sl-claim) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-claim) .sl-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-claim) .sl-claim {
        gap: 12px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i {
        border-radius: 16px !important;
        padding: 20px 18px 21px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i::before {
        left: 17px !important;
        right: 17px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-n {
        width: 44px !important;
        height: 44px !important;
        margin-bottom: 15px !important;
        border-radius: 12px !important;
        font-size: 17px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i > b {
        font-size: 14px !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i > p {
        font-size: 13px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-claim) .sl-claim-why {
        margin-top: 14px !important;
        padding: 17px 17px 18px 19px !important;
        border-radius: 13px !important;
        font-size: 12.5px !important;
        line-height: 1.7 !important;
    }

    section.sec:has(.sl-claim) .sl-claim-why > b {
        font-size: 13px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-claim) .sl-claim-i,
    section.sec:has(.sl-claim) .sl-claim-n {
        transition: none !important;
    }

    section.sec:has(.sl-claim) .sl-claim-i:hover {
        transform: none !important;
    }
}
/**/
/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "КОЛКО СМЕ ПЛАТИЛИ ДОСЕГА"
   ========================================================================== */

/* Основна секция */
section.sec:has(.sl-paid) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Мек зелен glow */
section.sec:has(.sl-paid)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-paid) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-paid) .sl-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.sl-paid) .sl-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-paid) .sl-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.sl-paid) .sl-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 7px rgba(15,23,42,.025) !important;
}

/* Зелена линия отгоре */
section.sec:has(.sl-paid) .sl-paid::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c5f36c
    ) !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-h {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 25px 28px !important;
    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.055),
            rgba(255,255,255,0)
        ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

section.sec:has(.sl-paid) .sl-paid-h b {
    color: #172000 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: -.1px !important;
}

section.sec:has(.sl-paid) .sl-paid-h span {
    color: #7b8491 !important;
    font-size: 13px !important;
}

/* ==========================================================================
   РЕДОВЕ
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 85px minmax(0, 1fr) 120px !important;
    align-items: center !important;
    gap: 25px !important;
    padding: 24px 28px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #edf0f2 !important;
    transition:
        background .25s ease,
        padding-left .25s ease !important;
}

/* Последният ред няма долна граница */
section.sec:has(.sl-paid) .sl-paid-r:last-child {
    border-bottom: 0 !important;
}

/* Hover */
section.sec:has(.sl-paid) .sl-paid-r:hover {
    background: #fbfdf8 !important;
    padding-left: 32px !important;
}

/* ==========================================================================
   ГОДИНА
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-y {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: fit-content !important;
    min-width: 58px !important;
    padding: 7px 10px !important;
    border-radius: 9px !important;
    background: rgba(152,219,28,.11) !important;
    border: 1px solid rgba(152,219,28,.22) !important;
    color: #5f9008 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-t {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    min-width: 0 !important;
}

section.sec:has(.sl-paid) .sl-paid-t b {
    color: #172000 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

section.sec:has(.sl-paid) .sl-paid-t span {
    color: #697386 !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
}

/* ==========================================================================
   СУМА
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-s {
    justify-self: end !important;
    color: #172000 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    letter-spacing: -.3px !important;
    white-space: nowrap !important;
}

/* Сумата за 0 € */
section.sec:has(.sl-paid) .sl-paid-s.zero {
    color: #9ca3af !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   АКЦЕНТ ПРИ HOVER НА СУМАТА
   ========================================================================== */

section.sec:has(.sl-paid) .sl-paid-r:hover .sl-paid-s:not(.zero) {
    color: #5f9008 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-paid) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-paid) .sl-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-h {
        padding: 22px 23px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r {
        grid-template-columns: 70px minmax(0, 1fr) 105px !important;
        gap: 18px !important;
        padding: 22px 23px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r:hover {
        padding-left: 26px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-s {
        font-size: 16px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-paid) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-paid) .sl-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-paid) .sl-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.sl-paid) .sl-paid {
        border-radius: 17px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-h {
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-h b {
        font-size: 13px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-h span {
        font-size: 12px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r {
        grid-template-columns: 54px minmax(0, 1fr) !important;
        gap: 13px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r:hover {
        padding-left: 19px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-y {
        min-width: 50px !important;
        padding: 7px 7px !important;
        font-size: 11px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-t b {
        font-size: 13px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-t span {
        font-size: 12px !important;
        line-height: 1.5 !important;
    }

    section.sec:has(.sl-paid) .sl-paid-s {
        grid-column: 2 !important;
        justify-self: start !important;
        margin-top: -4px !important;
        font-size: 15px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-paid) .sl-paid-r {
        transition: none !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r:hover {
        padding-left: 28px !important;
    }

    section.sec:has(.sl-paid) .sl-paid-r:hover .sl-paid-s:not(.zero) {
        color: #172000 !important;
    }
}
/**/

/* ==========================================================================
   ТЪМНА PREMIUM CTA СЕКЦИЯ — "АКО ТИ ТРЯБВА ПОВЕЧЕ"
   ========================================================================== */

section.sec:has(.sl-more) {
    position: relative !important;
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152,219,28,.10) 0%,
            rgba(152,219,28,.035) 32%,
            transparent 68%
        ),
        #101713 !important;
    padding: 85px 20px !important;
    color: #ffffff !important;
    overflow: hidden !important;
}

/* Декоративен зелен glow */
section.sec:has(.sl-more)::before {
    content: "" !important;
    position: absolute !important;
    width: 520px !important;
    height: 520px !important;
    left: 50% !important;
    top: -320px !important;
    transform: translateX(-50%) !important;
    background: rgba(152,219,28,.10) !important;
    filter: blur(90px) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-more) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН СВЕТЪЛ БОКС
   ========================================================================== */

section.sec:has(.sl-more) .sl-more {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 45px !important;
    padding: 38px 42px !important;

    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,.8) !important;
    border-radius: 22px !important;

    box-shadow:
        0 25px 70px rgba(0,0,0,.28),
        0 8px 25px rgba(0,0,0,.16) !important;

    overflow: hidden !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease !important;
}

/* Зелената линия отгоре */
section.sec:has(.sl-more) .sl-more::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 4px !important;

    background: linear-gradient(
        90deg,
        #7fbd0c,
        #7cbf00,
        #c4f36a
    ) !important;
}

/* Мек зелен фон вътре в картата */
section.sec:has(.sl-more) .sl-more::after {
    content: "" !important;
    position: absolute !important;
    width: 350px !important;
    height: 350px !important;
    right: -180px !important;
    top: -180px !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.09),
        transparent 68%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.sl-more) .sl-more > div:first-child {
    position: relative !important;
    z-index: 2 !important;
}

section.sec:has(.sl-more) .sl-more h3 {
    margin: 0 0 11px !important;

    color: #172000 !important;
    font-size: clamp(22px, 3vw, 29px) !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: -.6px !important;
}

section.sec:has(.sl-more) .sl-more p {
    max-width: 700px !important;
    margin: 0 !important;

    color: #5f6875 !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}

/* ==========================================================================
   БУТОН
   ========================================================================== */

section.sec:has(.sl-more) .sl-more-go {
    position: relative !important;
    z-index: 3 !important;
    flex-shrink: 0 !important;
}

section.sec:has(.sl-more) .sl-more-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 125px !important;
    min-height: 48px !important;
    padding: 12px 22px !important;

    background: #7cbf00 !important;
    border: 1px solid #7cbf00 !important;
    border-radius: 11px !important;

    color: #172000 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-decoration: none !important;

    box-shadow:
        0 8px 20px rgba(152,219,28,.22) !important;

    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease !important;
}

/* Hover бутон */
section.sec:has(.sl-more) .sl-more-go .btn:hover {
    background: #a9eb32 !important;
    border-color: #a9eb32 !important;
    color: #172000 !important;

    transform: translateY(-2px) !important;

    box-shadow:
        0 12px 26px rgba(152,219,28,.30) !important;
}

/* Hover карта */
section.sec:has(.sl-more) .sl-more:hover {
    transform: translateY(-3px) !important;

    box-shadow:
        0 30px 80px rgba(0,0,0,.32),
        0 10px 30px rgba(152,219,28,.06) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.sl-more) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-more) .sl-more {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
        padding: 32px 30px !important;
        border-radius: 19px !important;
    }

    section.sec:has(.sl-more) .sl-more-go {
        justify-self: start !important;
    }

    section.sec:has(.sl-more) .sl-more-go .btn {
        min-width: 135px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-more) {
        padding: 58px 14px !important;
    }

    section.sec:has(.sl-more) .sl-more {
        gap: 22px !important;
        padding: 28px 21px 25px !important;
        border-radius: 17px !important;
    }

    section.sec:has(.sl-more) .sl-more h3 {
        font-size: 22px !important;
        letter-spacing: -.4px !important;
        line-height: 1.25 !important;
    }

    section.sec:has(.sl-more) .sl-more p {
        font-size: 13px !important;
        line-height: 1.7 !important;
    }

    section.sec:has(.sl-more) .sl-more-go {
        width: 100% !important;
    }

    section.sec:has(.sl-more) .sl-more-go .btn {
        width: 100% !important;
        min-height: 46px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-more) .sl-more,
    section.sec:has(.sl-more) .sl-more-go .btn {
        transition: none !important;
    }

    section.sec:has(.sl-more) .sl-more:hover {
        transform: none !important;
    }

    section.sec:has(.sl-more) .sl-more-go .btn:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "ДРУГИТЕ ДОКУМЕНТИ"
   ========================================================================== */

section.sec:has(.sl-docs) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Мек зелен glow */
section.sec:has(.sl-docs)::before {
    content: "" !important;
    position: absolute !important;
    width: 650px !important;
    height: 650px !important;
    left: 50% !important;
    top: -300px !important;
    transform: translateX(-50%) !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.025) 40%,
        transparent 70%
    ) !important;

    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.sl-docs) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.sl-docs) h2 {
    margin: 0 0 10px !important;

    color: #111827 !important;
    font-size: clamp(30px, 4vw, 40px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.sl-docs) .sl-lead {
    margin: 0 0 42px !important;

    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Малък зелен акцент */
section.sec:has(.sl-docs) h2::after {
    content: "" !important;
    display: block !important;

    width: 42px !important;
    height: 3px !important;

    margin-top: 18px !important;
    border-radius: 99px !important;

    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.22) !important;
}

/* ==========================================================================
   ДОКУМЕНТИ
   ========================================================================== */

section.sec:has(.sl-docs) .sl-docs {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 18px !important;
}

/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    min-height: 210px !important;
    padding: 25px 24px 23px !important;

    background: #ffffff !important;
    border: 1px solid #e4e8ec !important;
    border-radius: 18px !important;

    text-decoration: none !important;
    color: inherit !important;

    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;

    overflow: hidden !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Зелената линия */
section.sec:has(.sl-docs) .sl-doc-i::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        #7cbf00,
        #c4f36c
    ) !important;

    opacity: .8 !important;
}

/* Лек вътрешен glow */
section.sec:has(.sl-docs) .sl-doc-i::after {
    content: "" !important;

    position: absolute !important;
    width: 180px !important;
    height: 180px !important;
    right: -100px !important;
    bottom: -100px !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.09),
        transparent 70%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-ic {
    position: relative !important;
    z-index: 1 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;

    margin-bottom: 22px !important;

    border-radius: 13px !important;

    background: rgba(152,219,28,.11) !important;
    border: 1px solid rgba(152,219,28,.23) !important;

    color: #5f9008 !important;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.sl-docs) .sl-doc-ic svg {
    width: 21px !important;
    height: 21px !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-i b {
    position: relative !important;
    z-index: 1 !important;

    display: block !important;

    margin-bottom: 8px !important;

    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 800 !important;
}

/* Описание */
section.sec:has(.sl-docs) .sl-doc-i > span:last-child {
    position: relative !important;
    z-index: 1 !important;

    color: #707987 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

/* ==========================================================================
   HOVER
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-i:hover {
    transform: translateY(-5px) !important;

    border-color: rgba(105,201,14,.45) !important;

    box-shadow:
        0 18px 40px rgba(15,23,42,.08),
        0 5px 18px rgba(152,219,28,.07) !important;
}

section.sec:has(.sl-docs) .sl-doc-i:hover .sl-doc-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}

/* ==========================================================================
   РАЗЛИЧЕН АКЦЕНТ ЗА ТРИТЕ
   ========================================================================== */

section.sec:has(.sl-docs) .sl-doc-i:nth-child(1) .sl-doc-ic {
    color: #5f9008 !important;
}

section.sec:has(.sl-docs) .sl-doc-i:nth-child(2) .sl-doc-ic {
    background: rgba(59,130,246,.08) !important;
    border-color: rgba(59,130,246,.18) !important;
    color: #2563a8 !important;
}

section.sec:has(.sl-docs) .sl-doc-i:nth-child(2):hover .sl-doc-ic {
    background: #3b82f6 !important;
    color: #ffffff !important;
}

section.sec:has(.sl-docs) .sl-doc-i:nth-child(3) .sl-doc-ic {
    background: rgba(245,158,11,.09) !important;
    border-color: rgba(245,158,11,.20) !important;
    color: #b45309 !important;
}

section.sec:has(.sl-docs) .sl-doc-i:nth-child(3):hover .sl-doc-ic {
    background: #f59e0b !important;
    color: #ffffff !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec:has(.sl-docs) {
        padding: 70px 18px !important;
    }

    section.sec:has(.sl-docs) .sl-docs {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i {
        min-height: auto !important;
        padding: 22px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-ic {
        margin-bottom: 17px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.sl-docs) {
        padding: 60px 14px !important;
    }

    section.sec:has(.sl-docs) h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.sl-docs) .sl-lead {
        margin-bottom: 30px !important;
        font-size: 14px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i {
        padding: 20px 18px !important;
        border-radius: 16px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-ic {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 11px !important;
        margin-bottom: 15px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i b {
        font-size: 14px !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i > span:last-child {
        font-size: 12.5px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.sl-docs) .sl-doc-i,
    section.sec:has(.sl-docs) .sl-doc-ic {
        transition: none !important;
    }

    section.sec:has(.sl-docs) .sl-doc-i:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "КАКВО НЕ БИВА"
   ========================================================================== */

section.sec:has(.ap-stop) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.ap-stop)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -180px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.035) 38%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.ap-stop) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.ap-stop) .ap-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.ap-stop) .ap-head h2 {
    margin: 0 0 14px !important;
    color: #111827 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-stop) .ap-head p {
    margin: 0 !important;
    color: #6b7280 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.ap-stop) .ap-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 12px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
}

/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-i {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 20px !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-shadow:
        0 7px 25px rgba(15,23,42,.045),
        0 1px 3px rgba(15,23,42,.025) !important;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

/* Зелена линия отгоре */
section.sec:has(.ap-stop) .ap-stop-i::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c3f36c
    ) !important;
    opacity: .7 !important;
}

/* Hover */
section.sec:has(.ap-stop) .ap-stop-i:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(105,201,14,.42) !important;
    box-shadow:
        0 18px 40px rgba(15,23,42,.08),
        0 5px 18px rgba(152,219,28,.07) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА КАРТАТА
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-h {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 23px 24px !important;
    background:
        linear-gradient(
            180deg,
            rgba(152,219,28,.045),
            rgba(255,255,255,0)
        ) !important;
    border-bottom: 1px solid #edf0f2 !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-ic {
    width: 45px !important;
    height: 45px !important;
    min-width: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.11) !important;
    border: 1px solid rgba(152,219,28,.24) !important;
    color: #5f9008 !important;
    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease !important;
}

section.sec:has(.ap-stop) .ap-stop-ic svg {
    width: 21px !important;
    height: 21px !important;
}

/* Hover икона */
section.sec:has(.ap-stop) .ap-stop-i:hover .ap-stop-ic {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.06) !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ ТЕКСТ
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-h > b {
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-i > p {
    margin: 0 !important;
    padding: 21px 24px 25px !important;
    color: #596273 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   ЛЕКО РАЗНООБРАЗИЕ НА ИКОНИТЕ
   ========================================================================== */

/* 1 — незаконно съдържание */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(1) .ap-stop-ic {
    color: #5f9008 !important;
}

/* 2 — spam */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(2) .ap-stop-ic {
    color: #2563a8 !important;
    background: rgba(59,130,246,.08) !important;
    border-color: rgba(59,130,246,.18) !important;
}

section.sec:has(.ap-stop) .ap-stop-i:nth-child(2):hover .ap-stop-ic {
    background: #3b82f6 !important;
    color: #ffffff !important;
}

/* 3 — измами */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(3) .ap-stop-ic {
    color: #5f9008 !important;
}

/* 4 — malware */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(4) .ap-stop-ic {
    color: #b45309 !important;
    background: rgba(245,158,11,.09) !important;
    border-color: rgba(245,158,11,.20) !important;
}

section.sec:has(.ap-stop) .ap-stop-i:nth-child(4):hover .ap-stop-ic {
    background: #f59e0b !important;
    color: #ffffff !important;
}

/* 5 — авторски права */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(5) .ap-stop-ic {
    color: #5f9008 !important;
}

/* 6 — деца */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(6) .ap-stop-ic {
    color: #7c3aed !important;
    background: rgba(124,58,237,.08) !important;
    border-color: rgba(124,58,237,.18) !important;
}

section.sec:has(.ap-stop) .ap-stop-i:nth-child(6):hover .ap-stop-ic {
    background: #7c3aed !important;
    color: #ffffff !important;
}

/* 7 — атаки */
section.sec:has(.ap-stop) .ap-stop-i:nth-child(7) .ap-stop-ic {
    color: #2563a8 !important;
    background: rgba(59,130,246,.08) !important;
    border-color: rgba(59,130,246,.18) !important;
}

section.sec:has(.ap-stop) .ap-stop-i:nth-child(7):hover .ap-stop-ic {
    background: #3b82f6 !important;
    color: #ffffff !important;
}

/* ==========================================================================
   ПОСЛЕДНАТА КАРТА — ЦЯЛ РЕД
   ========================================================================== */

section.sec:has(.ap-stop) .ap-stop-i:nth-child(7) {
    grid-column: 1 / -1 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.ap-stop) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-stop) .ap-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.ap-stop) .ap-stop {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i:nth-child(7) {
        grid-column: auto !important;
    }

    section.sec:has(.ap-stop) .ap-stop-h {
        padding: 21px 22px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i > p {
        padding: 20px 22px 23px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-stop) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-stop) .ap-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-stop) .ap-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.ap-stop) .ap-stop {
        gap: 13px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i {
        border-radius: 16px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-h {
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-ic svg {
        width: 19px !important;
        height: 19px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-h > b {
        font-size: 14px !important;
        line-height: 1.45 !important;
        padding-top: 3px !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i > p {
        padding: 18px 17px 21px !important;
        font-size: 13px !important;
        line-height: 1.65 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-stop) .ap-stop-i,
    section.sec:has(.ap-stop) .ap-stop-ic {
        transition: none !important;
    }

    section.sec:has(.ap-stop) .ap-stop-i:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM DARK DESIGN — "А ТОВА ВЛИЗА ЛИ?"
   ========================================================================== */

section.sec:has(.ap-grey) {
    position: relative !important;
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(152,219,28,.08) 0,
            rgba(152,219,28,.025) 30%,
            transparent 62%
        ),
        #101612 !important;
    padding: 90px 20px !important;
    color: #ffffff !important;
    overflow: hidden !important;
}

/* Декоративен зелен glow */
section.sec:has(.ap-grey)::after {
    content: "" !important;
    position: absolute !important;
    width: 500px !important;
    height: 500px !important;
    right: -220px !important;
    bottom: -260px !important;
    background: rgba(152,219,28,.06) !important;
    filter: blur(70px) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.ap-grey) .wrap-n {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1050px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.ap-grey) .ap-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.ap-grey) .ap-head h2 {
    margin: 0 0 14px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-grey) .ap-head p {
    margin: 0 !important;
    color: #a9b5aa !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.ap-grey) .ap-head::after {
    content: "" !important;
    display: block !important;
    width: 46px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152,219,28,.35) !important;
}

/* ==========================================================================
   MAIN PANEL
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey {
    position: relative !important;
    background: #f7f9f5 !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow:
        0 25px 70px rgba(0,0,0,.28),
        0 5px 20px rgba(0,0,0,.15) !important;
}

/* Горна зелена линия */
section.sec:has(.ap-grey) .ap-grey::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #78b90d,
        #7cbf00,
        #c5f36c
    ) !important;
}

/* ==========================================================================
   PANEL HEADER
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-h {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 25px 27px !important;
    background:
        linear-gradient(
            135deg,
            #ffffff,
            #f2f6ef
        ) !important;
    border-bottom: 1px solid #e1e7df !important;
}

/* Икона */
section.sec:has(.ap-grey) .ap-grey-ic {
    width: 45px !important;
    height: 45px !important;
    min-width: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    background: rgba(152,219,28,.13) !important;
    border: 1px solid rgba(152,219,28,.28) !important;
    color: #5f9008 !important;
}

section.sec:has(.ap-grey) .ap-grey-ic svg {
    width: 22px !important;
    height: 22px !important;
}

/* Заглавие */
section.sec:has(.ap-grey) .ap-grey-h > b {
    color: #172000 !important;
    font-size: 17px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   QUESTIONS LIST
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-l {
    display: flex !important;
    flex-direction: column !important;
}

/* ==========================================================================
   QUESTION ROW
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 21px 27px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e8ece7 !important;
    transition:
        background .25s ease,
        padding-left .25s ease !important;
}

section.sec:has(.ap-grey) .ap-grey-r:last-child {
    border-bottom: 0 !important;
}

/* Hover */
section.sec:has(.ap-grey) .ap-grey-r:hover {
    background: #fbfdf9 !important;
    padding-left: 31px !important;
}

/* ==========================================================================
   QUESTION MARK
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-q {
    width: 38px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 11px !important;
    background: #f1f5ed !important;
    border: 1px solid #dfe7d9 !important;
    color: #5f9008 !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease !important;
}

section.sec:has(.ap-grey) .ap-grey-r:hover .ap-grey-q {
    background: #7cbf00 !important;
    color: #172000 !important;
    transform: scale(1.05) !important;
}

/* ==========================================================================
   TEXT
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-t {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
}

section.sec:has(.ap-grey) .ap-grey-t > b {
    color: #172000 !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
}

section.sec:has(.ap-grey) .ap-grey-t > span {
    color: #667164 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

/* ==========================================================================
   STATUS BADGES
   ========================================================================== */

section.sec:has(.ap-grey) .ap-grey-a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 78px !important;
    padding: 8px 13px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

/* МОЖЕ */
section.sec:has(.ap-grey) .ap-grey-a.yes {
    color: #477000 !important;
    background: #eef8df !important;
    border: 1px solid #d5eab4 !important;
}

/* ПИТАЙ НИ */
section.sec:has(.ap-grey) .ap-grey-a.ask {
    color: #56615a !important;
    background: #f1f3f1 !important;
    border: 1px solid #dfe3df !important;
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.ap-grey) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-grey) .ap-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.ap-grey) .ap-grey {
        border-radius: 20px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-h {
        padding: 21px 22px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-r {
        grid-template-columns: 40px minmax(0, 1fr) auto !important;
        gap: 13px !important;
        padding: 19px 22px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-r:hover {
        padding-left: 22px !important;
    }
}

/* ==========================================================================
   MOBILE SMALL
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-grey) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-grey) .ap-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-grey) .ap-head p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.ap-grey) .ap-grey {
        border-radius: 17px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-h {
        gap: 12px !important;
        padding: 19px 17px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-ic {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 11px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-ic svg {
        width: 20px !important;
        height: 20px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-h > b {
        font-size: 14px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-r {
        grid-template-columns: 36px minmax(0, 1fr) !important;
        gap: 11px !important;
        padding: 17px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-r:hover {
        padding-left: 17px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-q {
        width: 36px !important;
        height: 36px !important;
        border-radius: 10px !important;
        font-size: 14px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-t > b {
        font-size: 13.5px !important;
    }

    section.sec:has(.ap-grey) .ap-grey-t > span {
        font-size: 12.5px !important;
        line-height: 1.6 !important;
    }

    /* Статусът слиза под текста */
    section.sec:has(.ap-grey) .ap-grey-a {
        grid-column: 2 !important;
        justify-self: start !important;
        min-width: 72px !important;
        padding: 7px 11px !important;
        margin-top: 2px !important;
        font-size: 11px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-grey) .ap-grey-r,
    section.sec:has(.ap-grey) .ap-grey-q {
        transition: none !important;
    }
}
/**/
/* ==========================================================================
   СВЕТЪЛ PREMIUM ДИЗАЙН — "ГРАНИЦИТЕ, С ЧИСЛА"
   ========================================================================== */

/* Основна секция */
section.sec:has(.ap-lim) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #172000 !important;
    overflow: hidden !important;
}

/* Лек зелен ореол */
section.sec:has(.ap-lim)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 500px !important;
    left: 50% !important;
    top: -120px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.075) 0%,
        rgba(152,219,28,.025) 42%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.ap-lim) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1080px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.ap-lim) .ap-head {
    max-width: 760px !important;
    margin: 0 auto 48px !important;
    text-align: center !important;
}

section.sec:has(.ap-lim) .ap-head h2 {
    margin: 0 0 14px !important;
    color: #172000 !important;
    font-size: clamp(30px, 4vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-lim) .ap-head p {
    margin: 0 !important;
    color: #697264 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент под заглавието */
section.sec:has(.ap-lim) .ap-head::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 3px !important;
    margin: 23px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 4px 14px rgba(152,219,28,.28) !important;
}

/* ==========================================================================
   ТАБЛИЦА
   ========================================================================== */

section.sec:has(.ap-lim) .ap-lim {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e4e9df !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 2px 7px rgba(15,23,42,.025) !important;
}

/* Горна зелена линия */
section.sec:has(.ap-lim) .ap-lim::before {
    content: "" !important;
    display: block !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00 0%,
        #c4f36c 50%,
        #7cbf00 100%
    ) !important;
}

/* Самата таблица */
section.sec:has(.ap-lim) .ap-lim table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    background: #ffffff !important;
}

/* Заглавия */
section.sec:has(.ap-lim) .ap-lim thead th {
    padding: 20px 22px !important;
    background: #f6f9f3 !important;
    color: #536044 !important;
    border-bottom: 1px solid #e3e9df !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .65px !important;
    text-align: left !important;
}

/* Първата колона */
section.sec:has(.ap-lim) .ap-lim thead th:first-child {
    width: 34% !important;
}

/* Клетки */
section.sec:has(.ap-lim) .ap-lim tbody td {
    padding: 21px 22px !important;
    border-bottom: 1px solid #edf0eb !important;
    color: #59635a !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    vertical-align: middle !important;
    background: #ffffff !important;
}

/* Последен ред */
section.sec:has(.ap-lim) .ap-lim tbody tr:last-child td {
    border-bottom: 0 !important;
}

/* Име на параметъра */
section.sec:has(.ap-lim) .ap-lim tbody td:first-child {
    color: #26351a !important;
    font-size: 14px !important;
    font-weight: 750 !important;
}

/* Zebra ефект */
section.sec:has(.ap-lim) .ap-lim tbody tr:nth-child(even) td {
    background: #fbfcfa !important;
}

/* Hover */
section.sec:has(.ap-lim) .ap-lim tbody tr {
    transition: background .25s ease !important;
}

section.sec:has(.ap-lim) .ap-lim tbody tr:hover td {
    background: #f5faef !important;
}

/* ==========================================================================
   ЧИСЛА / MONO
   ========================================================================== */

section.sec:has(.ap-lim) .ap-lim .mono {
    color: #354228 !important;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        Consolas,
        "Liberation Mono",
        monospace !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: -.15px !important;
}

/* Втори ред под числото */
section.sec:has(.ap-lim) .ap-lim .mono span {
    display: block !important;
    margin-top: 4px !important;
    color: #8a9385 !important;
    font-family:
        Inter,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif !important;
    font-size: 11px !important;
    line-height: 1.45 !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
}

/* ==========================================================================
   NOTE / ОБЯСНЕНИЕ
   ========================================================================== */

section.sec:has(.ap-lim) .ap-lim-note {
    position: relative !important;
    margin-top: 18px !important;
    padding: 22px 24px 22px 27px !important;
    background: #f7faf4 !important;
    border: 1px solid #e1ead9 !important;
    border-left: 3px solid #7cbf00 !important;
    border-radius: 15px !important;
    color: #65705f !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    box-shadow: 0 5px 18px rgba(15,23,42,.025) !important;
}

/* Заглавие на note */
section.sec:has(.ap-lim) .ap-lim-note b {
    display: block !important;
    margin-bottom: 6px !important;
    color: #26351a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 760px) {

    section.sec:has(.ap-lim) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-lim) .ap-head {
        margin-bottom: 38px !important;
    }

    section.sec:has(.ap-lim) .ap-lim {
        border-radius: 17px !important;
    }

    section.sec:has(.ap-lim) .ap-lim thead th,
    section.sec:has(.ap-lim) .ap-lim tbody td {
        padding: 17px 16px !important;
    }

    section.sec:has(.ap-lim) .ap-lim-note {
        padding: 20px 21px 20px 23px !important;
    }
}

/* ==========================================================================
   MOBILE — хоризонтално превъртане само на таблицата
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-lim) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-lim) .ap-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-lim) .ap-head p {
        font-size: 14px !important;
    }

    section.sec:has(.ap-lim) .ap-lim {
        overflow-x: auto !important;
        border-radius: 16px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    section.sec:has(.ap-lim) .ap-lim table {
        min-width: 690px !important;
    }

    section.sec:has(.ap-lim) .ap-lim thead th {
        padding: 16px 14px !important;
        font-size: 10px !important;
    }

    section.sec:has(.ap-lim) .ap-lim tbody td {
        padding: 17px 14px !important;
        font-size: 13px !important;
    }

    section.sec:has(.ap-lim) .ap-lim tbody td:first-child {
        font-size: 13px !important;
    }

    section.sec:has(.ap-lim) .ap-lim .mono {
        font-size: 12px !important;
    }

    section.sec:has(.ap-lim) .ap-lim .mono span {
        font-size: 10px !important;
    }

    section.sec:has(.ap-lim) .ap-lim-note {
        margin-top: 14px !important;
        padding: 18px 18px 19px 20px !important;
        font-size: 12.5px !important;
        line-height: 1.65 !important;
        border-radius: 14px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-lim) .ap-lim tbody tr {
        transition: none !important;
    }
}
/**/
/* ==========================================================================
   AP FLOW — DARK PREMIUM GRID
   2 КАРТИ НА РЕД • БЕЗ ТОЧКИ • БЕЗ ВЕРТИКАЛНА ЛИНИЯ
   ========================================================================== */

/* Тъмна секция */
section.sec:has(.ap-flow) {
    position: relative !important;
    background: #0b0f0d !important;
    color: #ffffff !important;
    overflow: hidden !important;
}

/* Лек зелен glow */
section.sec:has(.ap-flow)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -280px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.10) 0%,
        rgba(152,219,28,.035) 38%,
        transparent 72%
    ) !important;
    pointer-events: none !important;
}

/* Контейнер */
section.sec:has(.ap-flow) .wrap-n {
    position: relative !important;
    z-index: 2 !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.ap-flow) .ap-head {
    max-width: 780px !important;
    margin: 0 auto 50px !important;
    text-align: center !important;
}

section.sec:has(.ap-flow) .ap-head h2 {
    margin: 0 0 14px !important;
    color: #ffffff !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-flow) .ap-head p {
    margin: 0 !important;
    color: #aeb8b1 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Зелен акцент */
section.sec:has(.ap-flow) .ap-head::after {
    content: "" !important;
    display: block !important;
    width: 48px !important;
    height: 3px !important;
    margin: 24px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
    box-shadow: 0 0 18px rgba(152,219,28,.25) !important;
}

/* ==========================================================================
   GRID
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin: 0 !important;
}

/* ==========================================================================
   КАРТА
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-r {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    align-items: start !important;
    min-height: 190px !important;
    padding: 26px !important;
    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 18px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    box-shadow:
        0 12px 35px rgba(0,0,0,.18),
        0 2px 8px rgba(0,0,0,.10) !important;
    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease !important;
}

/* Зелена горна линия */
section.sec:has(.ap-flow) .ap-flow-r::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #7cbf00,
        #c4f36d
    ) !important;
}

/* Hover */
section.sec:has(.ap-flow) .ap-flow-r:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(152,219,28,.35) !important;
    box-shadow:
        0 18px 45px rgba(0,0,0,.24),
        0 8px 25px rgba(152,219,28,.08) !important;
}

/* ==========================================================================
   МАХАМЕ ТОЧКИТЕ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-d {
    display: none !important;
}

section.sec:has(.ap-flow) .ap-flow-r::before {
    display: none !important;
    content: none !important;
}

/* ==========================================================================
   НОМЕР / ЕТИКЕТ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-t {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 58px !important;
    min-height: 34px !important;
    padding: 7px 9px !important;
    box-sizing: border-box !important;
    border-radius: 9px !important;
    background: #f1f7e9 !important;
    border: 1px solid #dcebc8 !important;
    color: #557c0b !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: .3px !important;
}

/* ==========================================================================
   ТЕКСТ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-x {
    display: block !important;
    min-width: 0 !important;
}

section.sec:has(.ap-flow) .ap-flow-x b {
    display: block !important;
    margin: 2px 0 9px !important;
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
}

section.sec:has(.ap-flow) .ap-flow-x p {
    margin: 0 !important;
    color: #626b64 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   ПЪРВИ ЕЛЕМЕНТ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-r.start {
    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f7faF3 100%
        ) !important;
}

/* ==========================================================================
   ПОСЛЕДЕН / УСПЕШЕН ЕЛЕМЕНТ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-r.good {
    background:
        linear-gradient(
            135deg,
            #f7fceF 0%,
            #ffffff 100%
        ) !important;
    border-color: rgba(152,219,28,.30) !important;
}

section.sec:has(.ap-flow) .ap-flow-r.good .ap-flow-t {
    background: #7cbf00 !important;
    border-color: #7cbf00 !important;
    color: #172000 !important;
}

/* ==========================================================================
   БЪРЗИ СПИРАНИЯ
   ========================================================================== */

section.sec:has(.ap-flow) .ap-flow-fast {
    margin-top: 22px !important;
    padding: 25px 28px !important;
    background: #151b17 !important;
    border: 1px solid rgba(152,219,28,.20) !important;
    border-radius: 18px !important;
    color: #dce4de !important;
    box-shadow: 0 12px 35px rgba(0,0,0,.18) !important;
}

section.sec:has(.ap-flow) .ap-flow-fast > b {
    display: block !important;
    margin-bottom: 8px !important;
    color: #ffffff !important;
    font-size: 16px !important;
}

section.sec:has(.ap-flow) .ap-flow-fast > p {
    margin: 0 0 12px !important;
    color: #9da9a1 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

section.sec:has(.ap-flow) .ap-flow-fast ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
}

section.sec:has(.ap-flow) .ap-flow-fast li {
    position: relative !important;
    padding: 12px 14px 12px 32px !important;
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(255,255,255,.07) !important;
    border-radius: 10px !important;
    color: #d7dfda !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

section.sec:has(.ap-flow) .ap-flow-fast li::before {
    content: "!" !important;
    position: absolute !important;
    left: 11px !important;
    top: 12px !important;
    width: 15px !important;
    height: 15px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    color: #172000 !important;
    font-size: 10px !important;
    font-weight: 900 !important;
}

section.sec:has(.ap-flow) .ap-fast-after {
    margin: 15px 0 0 !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(255,255,255,.07) !important;
    color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 800px) {

    section.sec:has(.ap-flow) .ap-flow {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.ap-flow) .ap-flow-r {
        min-height: auto !important;
    }

    section.sec:has(.ap-flow) .ap-flow-fast ul {
        grid-template-columns: 1fr !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-flow) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-flow) .ap-head {
        margin-bottom: 35px !important;
    }

    section.sec:has(.ap-flow) .ap-head h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-flow) .ap-head p {
        font-size: 14px !important;
    }

    section.sec:has(.ap-flow) .ap-flow {
        gap: 13px !important;
    }

    section.sec:has(.ap-flow) .ap-flow-r {
        grid-template-columns: 62px minmax(0, 1fr) !important;
        padding: 21px 18px !important;
        border-radius: 15px !important;
    }

    section.sec:has(.ap-flow) .ap-flow-t {
        width: 52px !important;
        min-height: 31px !important;
        font-size: 10px !important;
    }

    section.sec:has(.ap-flow) .ap-flow-x b {
        font-size: 14px !important;
        margin-bottom: 7px !important;
    }

    section.sec:has(.ap-flow) .ap-flow-x p {
        font-size: 12.5px !important;
        line-height: 1.65 !important;
    }

    section.sec:has(.ap-flow) .ap-flow-fast {
        padding: 21px 18px !important;
        border-radius: 15px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-flow) .ap-flow-r {
        transition: none !important;
    }

    section.sec:has(.ap-flow) .ap-flow-r:hover {
        transform: none !important;
    }
}
/**/

/* ==========================================================================
   AP APPEAL — CLEAN EDITORIAL DESIGN
   ========================================================================== */

section.sec:has(.ap-appeal) {
    position: relative !important;
    background: #f8faf7 !important;
    color: #172000 !important;
    overflow: hidden !important;
}

/* Лек зелен фон */
section.sec:has(.ap-appeal)::before {
    content: "" !important;
    position: absolute !important;
    width: 720px !important;
    height: 720px !important;
    top: -380px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.11) 0%,
        rgba(152,219,28,.035) 42%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.ap-appeal) .ap-appeal {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1060px !important;
    margin: 0 auto !important;
    padding: clamp(32px, 5vw, 55px) !important;
    background: #ffffff !important;
    border: 1px solid #e4e9e2 !important;
    border-radius: 24px !important;
    box-shadow:
        0 20px 55px rgba(15,23,42,.06),
        0 3px 10px rgba(15,23,42,.025) !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

section.sec:has(.ap-appeal) .ap-appeal > h2 {
    margin: 0 0 12px !important;
    color: #111827 !important;
    text-align: center !important;
    font-size: clamp(29px, 4vw, 41px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

section.sec:has(.ap-appeal) .ap-appeal > p {
    max-width: 720px !important;
    margin: 0 auto !important;
    color: #68736b !important;
    text-align: center !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
}

/* Малък зелен акцент */
section.sec:has(.ap-appeal) .ap-appeal > p::after {
    content: "" !important;
    display: block !important;
    width: 42px !important;
    height: 3px !important;
    margin: 22px auto 0 !important;
    border-radius: 99px !important;
    background: #7cbf00 !important;
}

/* ==========================================================================
   ПРОЦЕС
   ========================================================================== */

section.sec:has(.ap-appeal) .ap-appeal-l {
    position: relative !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    margin-top: 48px !important;
    border-top: 1px solid #e5e9e4 !important;
    border-bottom: 1px solid #e5e9e4 !important;
}

/* Хоризонтална линия между стъпките */
section.sec:has(.ap-appeal) .ap-appeal-i {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 48px 1fr !important;
    column-gap: 17px !important;
    min-height: 145px !important;
    padding: 28px 30px !important;
    box-sizing: border-box !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Разделител */
section.sec:has(.ap-appeal) .ap-appeal-i:not(:last-child) {
    border-right: 1px solid #e5e9e4 !important;
}

/* Номер */
section.sec:has(.ap-appeal) .ap-appeal-n {
    grid-row: 1 / span 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    background: #7cbf00 !important;
    color: #172000 !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    box-shadow: 0 5px 14px rgba(152,219,28,.20) !important;
}

/* Заглавие */
section.sec:has(.ap-appeal) .ap-appeal-i > b {
    display: block !important;
    align-self: end !important;
    margin: 0 0 6px !important;
    color: #172000 !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
}

/* Описание */
section.sec:has(.ap-appeal) .ap-appeal-i > span:last-child {
    display: block !important;
    align-self: start !important;
    color: #69736b !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* Без hover движение */
section.sec:has(.ap-appeal) .ap-appeal-i:hover {
    transform: none !important;
}

/* ==========================================================================
   ДОЛЕН АКЦЕНТ
   ========================================================================== */

section.sec:has(.ap-appeal) .ap-appeal-say {
    position: relative !important;
    margin-top: 25px !important;
    padding: 19px 24px 19px 25px !important;
    background: #f3f8ec !important;
    border: 1px solid #dce8cf !important;
    border-radius: 13px !important;
    color: #59645b !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

/* Лява зелена черта */
section.sec:has(.ap-appeal) .ap-appeal-say::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 11px !important;
    bottom: 11px !important;
    width: 3px !important;
    border-radius: 0 3px 3px 0 !important;
    background: #7cbf00 !important;
}

section.sec:has(.ap-appeal) .ap-appeal-say b {
    color: #26351a !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 820px) {

    section.sec:has(.ap-appeal) .ap-appeal {
        padding: 35px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-l {
        grid-template-columns: 1fr !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i {
        min-height: 0 !important;
        padding: 23px 0 !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i:not(:last-child) {
        border-right: 0 !important;
        border-bottom: 1px solid #e5e9e4 !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-appeal) {
        padding: 55px 14px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal {
        padding: 27px 19px !important;
        border-radius: 18px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal > h2 {
        font-size: 28px !important;
        letter-spacing: -.7px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal > p {
        font-size: 14px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-l {
        margin-top: 34px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i {
        grid-template-columns: 42px 1fr !important;
        column-gap: 14px !important;
        padding: 20px 0 !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-n {
        width: 38px !important;
        height: 38px !important;
        font-size: 13px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i > b {
        font-size: 14px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-i > span:last-child {
        font-size: 12.5px !important;
    }

    section.sec:has(.ap-appeal) .ap-appeal-say {
        margin-top: 18px !important;
        padding: 17px 17px 17px 20px !important;
        font-size: 12.5px !important;
    }
}
/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "ПОДАЙ СИГНАЛ"
   Full-width информационен блок
   ========================================================================== */

section.sec:has(.ap-rep) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Зелен декоративен glow */
section.sec:has(.ap-rep)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -280px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.035) 35%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.ap-rep) .wrap-w {
    position: relative !important;
    z-index: 1 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ОСНОВЕН БЛОК
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 45px !important;
    align-items: center !important;

    padding: clamp(32px, 5vw, 55px) !important;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbfdf9 55%,
            #f5faee 100%
        ) !important;

    border: 1px solid #e1e7dc !important;
    border-radius: 24px !important;

    box-shadow:
        0 20px 55px rgba(15,23,42,.07),
        0 4px 12px rgba(15,23,42,.035) !important;

    overflow: hidden !important;
}

/* Горна зелена линия */
section.sec:has(.ap-rep) .ap-rep::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 4px !important;

    background: linear-gradient(
        90deg,
        #7fbe0c 0%,
        #7cbf00 45%,
        #c7f56c 100%
    ) !important;
}

/* Декоративен кръг */
section.sec:has(.ap-rep) .ap-rep::after {
    content: "" !important;
    position: absolute !important;
    width: 280px !important;
    height: 280px !important;
    right: -130px !important;
    bottom: -160px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.075) !important;
    border: 1px solid rgba(152,219,28,.12) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   ЛЯВА ЧАСТ
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep > div:first-child {
    position: relative !important;
    z-index: 2 !important;
    min-width: 0 !important;
}

section.sec:has(.ap-rep) .ap-rep h3 {
    margin: 0 0 13px !important;

    color: #172000 !important;

    font-size: clamp(25px, 3vw, 34px) !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: -.7px !important;
}

section.sec:has(.ap-rep) .ap-rep p {
    max-width: 720px !important;

    margin: 0 !important;

    color: #596273 !important;

    font-size: 15px !important;
    line-height: 1.75 !important;
}

section.sec:has(.ap-rep) .ap-rep p b {
    color: #385900 !important;
    font-weight: 750 !important;
}

/* ==========================================================================
   НОВИЯТ FULL-WIDTH BOX
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep-box {
    position: relative !important;
    z-index: 2 !important;

    width: 100% !important;
    max-width: none !important;

    box-sizing: border-box !important;

    display: grid !important;
    grid-template-columns: 3fr 3fr 3fr 3fr 3fr !important;
    align-items: center !important;
    gap: 22px !important;

    margin-top: 30px !important;
    padding: 18px 22px !important;

    background: #f3f8ed !important;

    border: 1px solid #dce8d0 !important;
    border-left: 4px solid #7cbf00 !important;

    border-radius: 14px !important;

    box-shadow:
        0 5px 18px rgba(40,65,10,.045) !important;
}

/* Малък етикет */
section.sec:has(.ap-rep) .ap-rep-box > b:first-child {
    display: inline-flex !important;
    align-items: center !important;

    margin: 0 !important;

    padding: 7px 11px !important;

    background: #ffffff !important;
    border: 1px solid #dce7d3 !important;
    border-radius: 8px !important;

    color: #557d0a !important;

    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .5px !important;
    white-space: nowrap !important;
}

/* Email */
section.sec:has(.ap-rep) .ap-rep-box a {
    color: #172000 !important;

    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;

    text-decoration: none !important;

    transition:
        color .2s ease,
        transform .2s ease !important;
}

section.sec:has(.ap-rep) .ap-rep-box a:hover {
    color: #6da800 !important;
}

/* Текст след <br> */
section.sec:has(.ap-rep) .ap-rep-box br {
    display: none !important;
}

section.sec:has(.ap-rep) .ap-rep-box a + * {
    color: #687361 !important;
}

/* Последният bold — 24 часа */
section.sec:has(.ap-rep) .ap-rep-box > b:last-child {
    color: #385900 !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   ДЯСНА ЧАСТ / БУТОН
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep-go {
    position: relative !important;
    z-index: 3 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex-shrink: 0 !important;
}

section.sec:has(.ap-rep) .ap-rep-go .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 145px !important;
    min-height: 50px !important;

    padding: 0 23px !important;

    background: #7cbf00 !important;
    border: 1px solid #7cbf00 !important;
    border-radius: 12px !important;

    color: #172000 !important;

    font-size: 14px !important;
    font-weight: 800 !important;
    text-decoration: none !important;

    box-shadow:
        0 8px 20px rgba(152,219,28,.22) !important;

    transition:
        transform .2s ease,
        background .2s ease,
        box-shadow .2s ease !important;
}

section.sec:has(.ap-rep) .ap-rep-go .btn:hover {
    background: #a8e832 !important;

    transform: translateY(-2px) !important;

    box-shadow:
        0 12px 28px rgba(152,219,28,.30) !important;
}

section.sec:has(.ap-rep) .ap-rep-go .btn:active {
    transform: translateY(0) !important;
}

/* ==========================================================================
   МАЛЪК GREEN INDICATOR
   ========================================================================== */

section.sec:has(.ap-rep) .ap-rep-box::before {
    content: "" !important;

    width: 8px !important;
    height: 8px !important;

    position: absolute !important;
    right: 18px !important;
    top: 12px !important;

    border-radius: 50% !important;

    background: #7cbf00 !important;

    box-shadow:
        0 0 0 4px rgba(152,219,28,.12) !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 820px) {

    section.sec:has(.ap-rep) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-rep) .ap-rep {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
        padding: 34px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-go {
        justify-content: flex-start !important;
    }

    section.sec:has(.ap-rep) .ap-rep-go .btn {
        min-width: 170px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box {
        grid-template-columns: auto 1fr!important;
    }

    section.sec:has(.ap-rep) .ap-rep-box a {
        justify-self: start !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-rep) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-rep) .ap-rep {
        gap: 25px !important;
        padding: 27px 20px 24px !important;
        border-radius: 18px !important;
    }

    section.sec:has(.ap-rep) .ap-rep h3 {
        font-size: 26px !important;
        letter-spacing: -.5px !important;
    }

    section.sec:has(.ap-rep) .ap-rep p {
        font-size: 14px !important;
        line-height: 1.7 !important;
    }

    /* Full-width info panel на мобилен */
    section.sec:has(.ap-rep) .ap-rep-box {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 9px !important;

        margin-top: 24px !important;
        padding: 17px !important;

        border-radius: 13px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box > b:first-child {
        font-size: 10px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box a {
        font-size: 16px !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box br {
        display: block !important;
    }

    section.sec:has(.ap-rep) .ap-rep-go {
        width: 100% !important;
    }

    section.sec:has(.ap-rep) .ap-rep-go .btn {
        width: 100% !important;
        min-width: 0 !important;
    }

    section.sec:has(.ap-rep) .ap-rep-box::before {
        right: 14px !important;
        top: 14px !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-rep) .ap-rep-go .btn,
    section.sec:has(.ap-rep) .ap-rep-box a {
        transition: none !important;
    }
}

/**/

/* ==========================================================================
   PREMIUM СВЕТЪЛ ДИЗАЙН — "ДРУГИТЕ ДОКУМЕНТИ"
   ========================================================================== */

section.sec:has(.ap-docs) {
    position: relative !important;
    background: #ffffff !important;
    padding: 90px 20px !important;
    color: #111827 !important;
    overflow: hidden !important;
}

/* Зелен декоративен glow */
section.sec:has(.ap-docs)::before {
    content: "" !important;
    position: absolute !important;
    width: 700px !important;
    height: 700px !important;
    left: 50% !important;
    top: -320px !important;
    transform: translateX(-50%) !important;

    background: radial-gradient(
        circle,
        rgba(152,219,28,.08) 0%,
        rgba(152,219,28,.035) 35%,
        transparent 70%
    ) !important;

    pointer-events: none !important;
}

/* ==========================================================================
   КОНТЕЙНЕР
   ========================================================================== */

section.sec:has(.ap-docs) .wrap-w {
    position: relative !important;
    z-index: 1 !important;

    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ
   ========================================================================== */

section.sec:has(.ap-docs) h2 {
    margin: 0 0 10px !important;

    color: #172000 !important;

    font-size: clamp(28px, 4vw, 38px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -.8px !important;

    text-align: center !important;
}

/* ==========================================================================
   ПОДЗАГЛАВИЕ — ЦЕНТРИРАНО
   ========================================================================== */

section.sec:has(.ap-docs) .ap-lead {
    max-width: 680px !important;

    margin: 0 auto 32px !important;

    color: #687361 !important;

    font-size: 15px !important;
    line-height: 1.7 !important;

    text-align: center !important;
}

/* ==========================================================================
   ДОКУМЕНТИ — GRID
   ========================================================================== */

section.sec:has(.ap-docs) .ap-docs {
    position: relative !important;
    z-index: 2 !important;

    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    gap: 20px !important;

    margin-top: 30px !important;
}

/* ==========================================================================
   ДОКУМЕНТ — КАРТА
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    min-width: 0 !important;
    box-sizing: border-box !important;

    padding: 28px 26px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdf9 55%,
            #f5faee 100%
        ) !important;

    border: 1px solid #e1e7dc !important;
    border-radius: 18px !important;

    color: #172000 !important;
    text-decoration: none !important;

    box-shadow:
        0 12px 35px rgba(15,23,42,.055),
        0 3px 10px rgba(15,23,42,.025) !important;

    overflow: hidden !important;

    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease,
        background .22s ease !important;
}

/* Горна зелена линия */
section.sec:has(.ap-docs) .ap-doc-i::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 3px !important;

    background: linear-gradient(
        90deg,
        #7fbe0c 0%,
        #7cbf00 50%,
        #c7f56c 100%
    ) !important;

    opacity: .9 !important;
}

/* Декоративен кръг */
section.sec:has(.ap-docs) .ap-doc-i::after {
    content: "" !important;

    position: absolute !important;

    width: 150px !important;
    height: 150px !important;

    right: -75px !important;
    bottom: -85px !important;

    border-radius: 50% !important;

    background: rgba(152,219,28,.055) !important;
    border: 1px solid rgba(152,219,28,.09) !important;

    pointer-events: none !important;

    transition:
        transform .25s ease,
        background .25s ease !important;
}

/* Hover */
section.sec:has(.ap-docs) .ap-doc-i:hover {
    transform: translateY(-4px) !important;

    border-color: #cbdcaf !important;

    box-shadow:
        0 18px 42px rgba(15,23,42,.085),
        0 5px 14px rgba(70,100,20,.045) !important;
}

section.sec:has(.ap-docs) .ap-doc-i:hover::after {
    transform: scale(1.15) !important;
    background: rgba(152,219,28,.08) !important;
}

/* ==========================================================================
   ИКОНА
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-ic {
    position: relative !important;
    z-index: 2 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 48px !important;
    height: 48px !important;

    margin-bottom: 20px !important;

    box-sizing: border-box !important;

    background: #f3f8ed !important;

    border: 1px solid #dce8d0 !important;
    border-radius: 12px !important;

    color: #6da800 !important;

    box-shadow:
        0 5px 15px rgba(70,100,20,.055) !important;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease !important;
}

section.sec:has(.ap-docs) .ap-doc-i:hover .ap-doc-ic {
    background: #7cbf00 !important;
    color: #172000 !important;

    transform: translateY(-2px) !important;
}

/* SVG */
section.sec:has(.ap-docs) .ap-doc-ic svg {
    width: 23px !important;
    height: 23px !important;

    display: block !important;
}

/* ==========================================================================
   ЗАГЛАВИЕ НА ДОКУМЕНТА
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i > b {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin: 0 0 9px !important;

    color: #172000 !important;

    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
    letter-spacing: -.2px !important;
}

/* ==========================================================================
   ОПИСАНИЕ
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i > span:last-child {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;

    margin: 0 !important;

    color: #687361 !important;

    font-size: 14px !important;
    line-height: 1.65 !important;
}

/* ==========================================================================
   GREEN INDICATOR
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i {
    --doc-dot: #7cbf00;
}

section.sec:has(.ap-docs) .ap-doc-i > b::after {
    content: "" !important;

    display: inline-block !important;

    width: 6px !important;
    height: 6px !important;

    margin-left: 8px !important;

    vertical-align: middle !important;

    border-radius: 50% !important;

    background: var(--doc-dot) !important;

    box-shadow:
        0 0 0 3px rgba(152,219,28,.10) !important;

    opacity: .85 !important;
}

/* ==========================================================================
   FOCUS ACCESSIBILITY
   ========================================================================== */

section.sec:has(.ap-docs) .ap-doc-i:focus-visible {
    outline: 3px solid rgba(152,219,28,.35) !important;
    outline-offset: 4px !important;

    border-color: #7cbf00 !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 820px) {

    section.sec:has(.ap-docs) {
        padding: 70px 18px !important;
    }

    section.sec:has(.ap-docs) .ap-docs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-i {
        padding: 25px 22px !important;
    }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 560px) {

    section.sec:has(.ap-docs) {
        padding: 60px 14px !important;
    }

    section.sec:has(.ap-docs) h2 {
        font-size: 27px !important;
        letter-spacing: -.5px !important;
    }

    section.sec:has(.ap-docs) .ap-lead {
        margin: 0 auto 25px !important;

        font-size: 14px !important;
        line-height: 1.65 !important;

        text-align: center !important;
    }

    section.sec:has(.ap-docs) .ap-docs {
        grid-template-columns: 1fr !important;

        gap: 14px !important;

        margin-top: 24px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-i {
        padding: 22px 20px !important;

        border-radius: 15px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-ic {
        width: 44px !important;
        height: 44px !important;

        margin-bottom: 17px !important;

        border-radius: 11px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-i > b {
        font-size: 16px !important;
    }

    section.sec:has(.ap-docs) .ap-doc-i > span:last-child {
        font-size: 13.5px !important;
        line-height: 1.6 !important;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    section.sec:has(.ap-docs) .ap-doc-i,
    section.sec:has(.ap-docs) .ap-doc-i::after,
    section.sec:has(.ap-docs) .ap-doc-ic {
        transition: none !important;
    }
}

/**/


/* ==========================================================================
   ONLY HORIZONTAL SCROLL FIX
   Не променя ширини, размери или layout
   ========================================================================== */

html {
    overflow-x: hidden !important;
}

body {
    overflow-x: hidden !important;
}

/*
 * ═══ ШАПКАТА ОСТАВА ГОРЕ ═══
 *
 * Правилото на ред 180 е вярно, но нещо по-надолу го отменя.
 *
 * Тук то се повтаря в края на файла — последното написано печели.
 *
 * РОДИТЕЛИТЕ СЪЩО СЕ ОПРАВЯТ: лепкавото спира да работи, ако някой от
 * тях има „overflow“ различен от обичайното. Затова те се връщат към
 * него изрично.
 */
/*
 * НИЩО НЕ СЕ ПИПА ПО „body“.
 *
 * „overflow-x“ на него — с каквато и стойност — може да направи от
 * него контейнер за превъртане. Тогава лепкавото се лепи ЗА НЕГО, а
 * не за прозореца, и не се вижда.
 */


/* Шапката остава горе при превъртане. */
.site-header{position:sticky;top:0;z-index:80}

.site-header{position:fixed;top:0;left:0;right:0;z-index:80}
body{padding-top:var(--hd-h, 76px)}

/* Шапката се връща на мястото си, под лентите. */
body{padding-top:0}
.site-header{position:sticky;top:0;z-index:80;left:auto;right:auto}

/* Когато скриптът я закачи · заема мястото на изгубената височина. */
.site-header.is-stuck{position:fixed;top:0;left:0;right:0;z-index:80}
.hd-spacer{display:none}
.hd-spacer.is-on{display:block}










/*
 * ═══ ПАДАЩИТЕ МЕНЮТА СЕ ОТВАРЯТ ПРИ ПОСОЧВАНЕ ═══
 *
 * На голям екран щракането е излишно — мишката вече е там.
 *
 * НА ТЕЛЕФОН ОСТАВА ЩРАКАНЕТО: там няма посочване, а пръст.
 */
@media (min-width:1101px){
  .nav>li.has-drop:hover>.nav-drop,
  .nav>li.has-drop:hover>.drop,
  .nav>li.has-drop:hover>.mega,
  .nav>li.has-drop:focus-within>.nav-drop,
  .nav>li.has-drop:focus-within>.drop,
  .nav>li.has-drop:focus-within>.mega{
    display:block;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
}

/*
 * ═══ МЕНЮТО · ЕДНО ПОВЕДЕНИЕ, НЕ ДВЕ ═══
 *
 * Дотук работеха и посочването, и щракането. Щом човек щракне, менюто
 * оставаше заключено отворено, а после посочването не го затваряше.
 *
 * НА ГОЛЯМ ЕКРАН · само посочване. Класът от щракането се пренебрегва.
 * НА ТЕЛЕФОН · само щракане, защото там няма мишка.
 */
@media (min-width:1101px){
  .nav>li.has-drop:hover>.nav-drop,
  .nav>li.has-drop:hover>.drop,
  .nav>li.has-drop:focus-within>.nav-drop,
  .nav>li.has-drop:focus-within>.drop{display:block}

  .nav>li.has-drop:hover>.mega,
  .nav>li.has-drop:focus-within>.mega{display:grid}

  /* Щракането не оставя менюто отворено. */
  .nav>li.has-drop.is-open:not(:hover):not(:focus-within)>.nav-drop,
  .nav>li.has-drop.is-open:not(:hover):not(:focus-within)>.drop,
  .nav>li.has-drop.is-open:not(:hover):not(:focus-within)>.mega{display:none}
}

/*
 * ═══ БУТОНЪТ НЕ СЕ ЩРАКА НА ГОЛЯМ ЕКРАН ═══
 *
 * Щом менюто пада при посочване, щракането е излишно — а излишното
 * щракане обърква: човек не знае дали е трябвало, или не.
 *
 * НА ТЕЛЕФОН ОСТАВА · там няма посочване.
 */
@media (min-width:1101px){
  .nav>li.has-drop>.nav-top{
    pointer-events:none;
    cursor:default;
  }

  /*
   * Цялото поле остава чувствително · иначе менюто не би се отваряло
   * изобщо. Само самият надпис не се щрака.
   */
  .nav>li.has-drop{pointer-events:auto}
}

/* Иконките в стил „двоен ръб“ · тънка линия, заоблени краища. */
.fi svg,
.nav-drop .fi svg,
.drop .fi svg,
.mega .fi svg{stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ── Шапката на телефон ── */
@media (max-width:1100px){
  .site-header{background:#000}

  .site-header .nav-cart,
  .site-header .nav-toggle,
  .site-header .nav-actions .btn{
    width:42px;height:42px;min-width:42px;min-height:42px;
    padding:0;border-radius:11px;flex:0 0 auto;box-sizing:border-box;
    background:#7cbf00;border-color:#7cbf00;color:#000;
  }

  .site-header .nav-cart svg,
  .site-header .nav-toggle svg{width:19px;height:19px;color:#000}

  .site-header .nav-actions .btn{
    display:grid !important;place-items:center;font-size:0;
    background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:center;background-size:19px 19px;
    box-shadow:none;
  }
  .site-header .nav-actions .btn::before,
  .site-header .nav-actions .btn::after{content:none !important}

  .site-header .nav-actions{gap:8px}

  /* Отвореното меню · тъмен текст на бяло. */
  .nav.is-open{background:#fff}
  .nav.is-open>li>a,
  .nav.is-open>li>.nav-top{color:var(--ink) !important}
  .nav.is-open .nav-drop a,
  .nav.is-open .mega a,
  .nav.is-open .nav-drop b,
  .nav.is-open .mega b{color:var(--ink)}

  /* Горната лента · телефон, помощен център, флагчета. */
  .utilbar{display:block}
  .utilbar .wrap-w{display:flex;align-items:center;justify-content:space-between;
                   gap:10px;padding-block:6px;flex-wrap:nowrap}
  .utilbar .wrap-w > span:not(:first-child){display:none}
  .utilbar .r{margin-left:auto;gap:10px}
  .utilbar .r > a[href^="mailto"]{display:none}
  .utilbar a[hreflang] svg.lang-f{width:22px;height:22px}
}

/*
 * ═══ МЕНЮТО НА ТЕЛЕФОН · ПОД ШАПКАТА, НЕ ВЪРХУ НЕЯ ═══
 *
 * Дотук то се отваряше насред екрана и покриваше логото и копчетата.
 *
 * Сега тръгва точно под шапката и заема цялата ширина.
 */
@media (max-width:1100px){
  .nav{
    position:fixed;
    top:var(--hd-h, 104px);
    left:0;
    right:0;
    bottom:auto;
    width:100%;
    max-height:calc(100dvh - var(--hd-h, 104px));
    overflow-y:auto;
    margin:0;
    padding:8px 0;
    border-radius:0;
    border-top:1px solid var(--line);
    box-shadow:0 12px 28px rgba(0,0,0,.28);
    transform:none;
    display:none;
  }

  .nav.is-open{display:block}

  .nav>li{width:100%}

  .nav>li>a,
  .nav>li>.nav-top{
    width:100%;
    padding:15px 20px;
    font-size:16px;
    border-radius:0;
    justify-content:space-between;
  }

  /* Тънка чертичка между редовете. */
  .nav>li + li>a,
  .nav>li + li>.nav-top{border-top:1px solid var(--line)}

  /* Подменютата · подредени навътре. */
  .nav-drop,
  .drop,
  .mega{
    position:static;
    width:100%;
    min-width:0;
    box-shadow:none;
    border:0;
    border-radius:0;
    padding:0;
    background:var(--wash);
  }

  .nav-drop li a,
  .drop li a,
  .mega li a{padding:13px 20px 13px 34px}
}

/*
 * МЕНЮТО СТОИ В ПОТОКА, не се измерва.
 *
 * Измерването с число винаги бърка при друга височина на шапката.
 * Тук менюто е под нея по естествен ред — не може да я покрие.
 */
@media (max-width:1100px){
  .site-header{position:relative;z-index:80}

  .site-header .wrap-w{position:relative}

  .nav{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    width:auto;
    max-height:calc(100dvh - 100%);
  }
}

/*
 * ═══ БЕЗ КУТИЙКИ · САМО ИКОНКАТА ═══
 *
 * Цветното квадратче отвличаше вниманието от самия знак и правеше
 * всички редове еднакви.
 *
 * ИКОНКАТА ЗАЕМА ЦЯЛОТО МЯСТО на кутийката — така се вижда какво е.
 */
.nav-drop .fi,
.drop .fi,
.mega .fi{
  background:none !important;
  border:0 !important;
  width:38px;
  height:38px;
}

.nav-drop .fi svg,
.drop .fi svg,
.mega .fi svg{
  width:34px;
  height:34px;
  stroke-width:1.4;
}

/*
 * ═══ ИКОНКИТЕ СЕ НАГАЖДАТ КЪМ ФОНА ═══
 *
 * Зеленото беше за тъмната лента. На белия фон на падащото меню то
 * избледнява и знакът се губи.
 *
 * ТУК ТЕ СА ТЪМНИ · същия цвят като текста до тях.
 */
.nav-drop .fi svg,
.drop .fi svg,
.mega .fi svg{color:var(--ink)}

/*
 * ПРИ ПОСОЧВАНЕ · зеленото се връща като акцент.
 *
 * Така то казва „това гледаш“, вместо да стои постоянно.
 */
.nav-drop a:hover .fi svg,
.drop a:hover .fi svg,
.mega a:hover .fi svg{color:#6fa310}



/*
 * ОБЯСНИТЕЛНАТА КУТИЯ ЗА СКОРОСТТА.
 *
 * ЗАГЛАВИЕТО Е ЦЕНТРИРАНО, текстът е подравнен вляво · центриран
 * абзац от пет реда се чете трудно, защото окото губи началото.
 */
.speedbox{
  max-width:141ch;
  margin:0 auto;
}

.speedbox h2{
  margin:0 0 16px;
  font-size:clamp(1.35rem, 2.6vw, 1.85rem);
  line-height:1.25;
  letter-spacing:-.03em;
  text-align:center;
}

.speedbox p{
  margin:0;
  font-size:15.5px;
  line-height:1.75;
  color:var(--ink-2);
}

@media (max-width:640px){
  .speedbox p{font-size:14.5px;line-height:1.7}
}

/* ==== speedbox: начало ==== */
.sb{
  position:relative;overflow:hidden;
  padding:clamp(44px,5.5vw,72px) clamp(22px,4vw,48px);
  background:
    radial-gradient(900px 400px at 88% -10%, rgba(94,154,0,.16), transparent 60%),
    linear-gradient(165deg, #F8FBF2 0%, var(--wash-2) 100%);
}
.sb-in{max-width:1020px;margin:0 auto}

.sb-h{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:end;
      margin-bottom:clamp(26px,3.5vw,40px)}
.sb-h h2{margin:0;font:800 clamp(1.4rem,3vw,2.15rem)/1.15 var(--sans);
         letter-spacing:-.038em;max-width:20ch}

.sb-num{text-align:right}
.sb-num b{display:block;font:900 clamp(2.4rem,6vw,4rem)/1 var(--mono);
          letter-spacing:-.05em;
          background:linear-gradient(160deg,#7cbf00,#7CC00A);
          -webkit-background-clip:text;background-clip:text;color:transparent}
.sb-num span{display:block;font-size:11.5px;color:var(--ink-3);margin-top:4px}

.sb-body{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,4vw,44px)}
.sb-txt{margin:0;font-size:15px;line-height:1.72;color:var(--ink-2)}

.sb-cards{display:grid;grid-template-columns:1fr 1fr;gap:11px;align-content:start}

.sb-c{position:relative;overflow:hidden;padding:16px 15px;border-radius:15px;
      background:var(--paper);border:1px solid var(--line);
      transition:transform .2s cubic-bezier(.2,.9,.2,1),box-shadow .2s}
.sb-c:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(14,39,69,.09)}
.sb-c::before{content:'';position:absolute;top:-34px;right:-34px;
  width:96px;height:96px;border-radius:50%;background:#7cbf00;opacity:.1;
  transition:transform .3s cubic-bezier(.2,.9,.2,1)}
.sb-c:hover::before{transform:scale(1.5)}
.sb-c svg{width:20px;height:20px;color:#7cbf00;position:relative;
          margin-bottom:9px;display:block}
.sb-c b{position:relative;display:block;font:700 13px/1.35 var(--sans)}

@media (max-width:900px){
  .sb-body{grid-template-columns:1fr}
  .sb-h{grid-template-columns:1fr;gap:16px}
  .sb-num{text-align:left}
}
@media (max-width:560px){.sb-cards{grid-template-columns:1fr}}
/* ==== speedbox: край ==== */


/* ==== dtip: начало ==== */
.dtip{padding:clamp(22px,2.6vw,32px);background:var(--wash);border-radius:16px;
      display:flex;flex-direction:column;justify-content:center}

.dtip-k{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;
        font:700 10px/1 var(--sans);letter-spacing:.11em;text-transform:uppercase;
        color:#7cbf00}
.dtip-k::before{content:'';width:20px;height:2px;background:currentColor}

.dtip-h{margin:0 0 16px;font:800 1.12rem/1.24 var(--sans);letter-spacing:-.028em}

.dtip-g{display:grid;grid-template-columns:1fr 1fr;gap:10px}

.dtip-c{position:relative;overflow:hidden;padding:15px 14px;border-radius:14px;
        background:var(--paper);border:1px solid var(--line);
        transition:transform .18s cubic-bezier(.2,.9,.2,1),box-shadow .18s}
.dtip-c:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(14,39,69,.09)}
.dtip-c::before{content:'';position:absolute;top:-30px;right:-30px;
  width:86px;height:86px;border-radius:50%;background:#7cbf00;opacity:.09;
  transition:transform .3s cubic-bezier(.2,.9,.2,1)}
.dtip-c:hover::before{transform:scale(1.45)}
.dtip-c svg{position:relative;width:18px;height:18px;color:#7cbf00;
            margin-bottom:9px;display:block}
.dtip-c b{position:relative;display:block;font:700 12.5px/1.32 var(--sans);
          margin-bottom:3px}
.dtip-c span{position:relative;display:block;font-size:11px;line-height:1.45;
             color:var(--ink-3)}

.dtip-c.is-warm::before{background:#B8862B}
.dtip-c.is-warm svg{color:#B8862B}

.dtip-f{margin:14px 0 0;font-size:12px;color:var(--ink-3)}

@media (max-width:460px){.dtip-g{grid-template-columns:1fr}}
/* ==== dtip: край ==== */

/* ==== shirina: начало ==== */

/*
 * ═══ ПО ЦЯЛАТА ШИРИНА ═══
 *
 * Само таваните. За връщане · махни блока между маркерите.
 */
.wrap-w{max-width:1680px}
.sb-in{max-width:1440px}

/* Правилото на ред 31313 има „important“ и стяга разделите с фон. */
section.sec.sec-wash .wrap-w{max-width:1680px !important}

/* Решетките с точен брой колони · иначе плочките се скупчват вляво. */
@media (min-width:1300px){
  .rev-grid{grid-template-columns:repeat(3,1fr)}
  .pay-grid{grid-template-columns:repeat(3,1fr)}
}

/* ==== shirina: край ==== */

/*
 * ДВЕТЕ КОЛОНИ · равни вместо втората да е на 420.
 *
 * При 420 пиксела четирите подсказки не се побират и падат под
 * търсенето.
 */
/*
 * ПЪРВО ТЕСНИЯТ ЕКРАН, ПОСЛЕ ШИРОКИЯТ.
 *
 * При обратен ред правилото за телефон стои последно и отменя онова
 * за голям екран — затова двете колони падаха една под друга.
 */
@media (max-width:860px){
  .dsearch .wrap-w{grid-template-columns:1fr}
}

@media (min-width:861px){
  .dsearch .wrap-w{grid-template-columns:1.05fr .95fr;align-items:stretch}
}

/*
 * ДВЕТЕ КОЛОНИ · със същия избирач като онзи на ред 2314.
 *
 * Там стои „.dsearch > .wrap-w{grid-template-columns:1fr}“, който е
 * по-специфичен от обикновения и печелеше.
 */
@media (min-width:861px){
  .dsearch > .wrap-w{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:clamp(18px,2.4vw,32px);
    align-items:stretch;
  }
}

/* Двете колони · окончателно. */
section.dsearch > .wrap-w{
  display:grid !important;
  grid-template-columns:1.05fr .95fr !important;
  gap:clamp(18px,2.4vw,32px) !important;
  align-items:stretch !important;
}

@media (max-width:860px){
  section.dsearch > .wrap-w{grid-template-columns:1fr !important}
}

/* Текстът в подсказките · тъмен, окончателно. */
.dsearch .dtip .dtip-h,
.dsearch .dtip .dtip-c b{color:var(--ink) !important}

.dsearch .dtip .dtip-c span,
.dsearch .dtip .dtip-f{color:var(--ink-2) !important}

/* Трите оценки · по-широко разделени, за да не се сливат. */
.rev-scores{gap:clamp(26px,4vw,64px)}

/* Разделителна черта между тях · само на широк екран. */
@media (min-width:900px){
  .rev-score + .rev-score{
    padding-left:clamp(26px,4vw,64px);
    border-left:1px solid var(--line);
    margin-left:calc(-1 * clamp(26px,4vw,64px) / 2);
  }
}

/*
 * ТРИТЕ ОЦЕНКИ · равни разстояния.
 *
 * Предното правило местеше всяка втора наляво и затова разстоянията
 * излизаха различни. Тук няма отместване — само отстъп и черта.
 */
.rev-scores{gap:0}

.rev-score{padding-inline:clamp(18px,3vw,42px)}
.rev-score:first-child{padding-left:0}
.rev-score:last-child{padding-right:0}

@media (min-width:900px){
  .rev-score + .rev-score{
    border-left:1px solid var(--line);
    margin-left:0;
  }
}

@media (max-width:899px){
  .rev-scores{gap:clamp(18px,3vw,32px)}
  .rev-score{padding-inline:0}
  .rev-score + .rev-score{border-left:0}
}


/* ==== poddrujka: начало ==== */

/*
 * ═══ ПОДДРЪЖКАТА · ПОРТРЕТ И ВЪПРОСИ ═══
 *
 * Кръгъл портрет отляво със значка върху него; отдясно заглавието и
 * въпросите, които се отварят. Дотук секцията беше абзац до снимка ·
 * нищо за пипане и нищо, което да отговори на въпроса „а моят случай?“.
 *
 * Отварянето е на „details“ · част от HTML, работи без скрипт и с
 * клавиатура. Появяването при скролване се включва от скрипта — не се
 * ли зареди, всичко просто си стои видимо.
 */
/*
 * Фонът е зает от секцията „как хостингът влияе“ · същото меко
 * сияние горе вдясно и същият преход · за да не изглеждат двете
 * секции като от различни сайтове.
 */
.pd-sec{
  position:relative;overflow:hidden;
  background:
    radial-gradient(900px 400px at 88% -10%, rgba(94,154,0,.16), transparent 60%),
    linear-gradient(165deg, #F8FBF2 0%, var(--wash-2) 100%);
}

.pd{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:clamp(28px,5vw,60px);
  align-items:center;
}

.pd-i{order:1;display:flex;justify-content:center}
.pd-t{order:2}

.pd-kick{
  display:inline-block;margin:0 0 10px;
  font:700 11.5px/1 var(--sans);letter-spacing:.14em;
  text-transform:uppercase;color:#7cbf00;
}

.pd-t h2{
  margin:0 0 14px;
  font:800 clamp(1.35rem,2.7vw,1.95rem)/1.2 var(--sans);
  letter-spacing:-.035em;max-width:24ch;
}

.pd-t p{margin:0;font-size:15.5px;line-height:1.72;color:var(--ink-2);max-width:56ch}

/* ── портретът ── */
.pd-ph{position:relative;width:100%;max-width:420px}

.pd-ph picture{display:block}

.pd-ph img{
  /*
   * „height:auto“ НЕ Е излишно.
   *
   * В разметката снимката носи height="933" · това е подсказка към
   * браузъра и действа като „height:933px“, който побеждава
   * „aspect-ratio“. Кръгът се разтягаше на висока елипса.
   */
  width:100%;height:auto;aspect-ratio:1 / 1;
  object-fit:cover;object-position:50% 28%;
  border-radius:50%;
  box-shadow:var(--sh-l);
  display:block;
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
}

.pd-ph:hover img{transform:scale(1.02)}

.pd-badge{
  position:absolute;right:-6px;bottom:22px;
  display:flex;align-items:center;gap:8px;
  padding:8px 14px;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:100px;
  box-shadow:var(--sh);
  font:600 12.5px/1 var(--sans);
  white-space:nowrap;
}

.pd-badge b{font-weight:600}

.pd-dot{
  position:relative;flex:none;
  width:8px;height:8px;border-radius:50%;background:var(--ok);
}

.pd-dot::after{
  content:'';position:absolute;inset:-4px;
  border-radius:50%;border:1.5px solid var(--ok);
  animation:pdPulse 2.4s ease-out infinite;
}

@keyframes pdPulse{
  0%{transform:scale(.6);opacity:.6}
  70%{transform:scale(1.3);opacity:0}
  100%{opacity:0}
}

/* ── въпросите ── */
.pd-qa{margin:26px 0 0;display:grid;gap:10px}

/* Всеки въпрос е карта · заоблена като съседните секции. */
.pd-qa details{
  position:relative;overflow:hidden;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:15px;
  transition:transform .2s cubic-bezier(.2,.9,.2,1),box-shadow .2s,border-color .2s;
}

.pd-qa details:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(14,39,69,.09);
  border-color:#7cbf0033;
}

/* Петното в ъгъла · расте при отваряне, както при картите. */
.pd-qa details::before{
  content:'';position:absolute;top:-34px;right:-34px;
  width:110px;height:110px;border-radius:50%;
  background:#5E9A00;opacity:.07;
  transition:transform .35s cubic-bezier(.2,.9,.2,1);
}

.pd-qa details[open]::before{transform:scale(1.5)}
.pd-qa details > *{position:relative;z-index:1}

.pd-qa summary{
  list-style:none;cursor:pointer;
  position:relative;
  padding:16px 44px 16px 18px;
  font:600 14.5px/1.4 var(--sans);
  transition:color .2s ease;
}

.pd-qa summary::-webkit-details-marker{display:none}
.pd-qa summary:hover{color:#7cbf00}
.pd-qa summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:var(--r)}

.pd-qa summary::after{
  content:'';position:absolute;right:18px;top:50%;
  width:9px;height:9px;
  border:solid var(--ink-3);border-width:0 1.8px 1.8px 0;
  transform:translateY(-70%) rotate(45deg);
  transition:transform .25s ease;
}

.pd-qa details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}

.pd-qa p{
  margin:0 18px 16px;
  font-size:14.5px;line-height:1.7;color:var(--ink-2);max-width:60ch;
  animation:pdIn .26s ease both;
}

@keyframes pdIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* ── появяване при скролване ── */
.pd-anim .pd-ph{opacity:0;transform:scale(1.015)}
.pd-anim .pd-t > *{opacity:0;transform:translateY(14px)}

.pd-anim.pd-in .pd-ph{
  opacity:1;transform:none;
  transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1);
}

.pd-anim.pd-in .pd-t > *{
  opacity:1;transform:none;
  transition:opacity .55s ease var(--d,0s),transform .6s cubic-bezier(.2,.8,.2,1) var(--d,0s);
}

.pd-t > *:nth-child(1){--d:.14s}
.pd-t > *:nth-child(2){--d:.22s}
.pd-t > *:nth-child(3){--d:.30s}
.pd-t > *:nth-child(4){--d:.38s}

@media (prefers-reduced-motion:reduce){
  .pd-ph img,.pd-qa summary,.pd-qa summary::after{transition:none}
  .pd-ph:hover img{transform:none}
  .pd-dot::after{animation:none;opacity:.3}
  .pd-qa p{animation:none}
  .pd-anim .pd-ph,.pd-anim .pd-t > *{opacity:1;transform:none;transition:none}
}

/* ── тесен екран ── */
@media (max-width:860px){
  .pd{grid-template-columns:1fr;gap:26px}
  .pd-ph{max-width:320px}
  .pd-badge{right:0;bottom:14px}
}

/* ==== poddrujka: край ==== */

/*
 * ═══ ЗАГЛАВИЕТО С ОЦЕНКИТЕ · БЕЗ КУТИЯ ═══
 *
 * Рамката около заглавието и белият фон под оценките ги отделяха от
 * останалото без нужда.
 */
.rev-head{
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
}

.rev-score{
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  padding-block:0 !important;
}







/* ==== welc: начало ==== */

/*
 * ═══ ДОБРЕ ДОШЛИ · ВМЕСТО ПЛОЧКИТЕ ═══
 *
 * Текст отляво, рисуван човек отдясно.
 *
 * ЗА ВРЪЩАНЕ · махни блока между маркерите.
 */
.welc{
  position:relative;
  overflow:hidden;
  padding:clamp(48px,6vw,92px) clamp(20px,4vw,44px);
  background:#F5F8FC;
}

/* Косото зелено петно · дава посока на равнината. */
.welc::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(195deg, rgba(152,219,28,.11) 0 34%, transparent 34%);
}

.welc-in{position:relative;z-index:1;max-width:1180px;margin:0 auto}

.welc-g{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(30px,5vw,64px);
  align-items:center;
}

/* ── текстът ── */
.welc-kick{
  display:inline-block;
  margin-bottom:16px;
  font:700 11px/1 var(--sans);
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#7cbf00;
}

.welc h2{
  margin:0 0 15px;
  font:800 clamp(1.8rem,4vw,2.6rem)/1.1 var(--sans);
  letter-spacing:-.042em;
  max-width:17ch;
}

.welc-lead{
  margin:0 0 26px;
  font-size:15.5px;
  line-height:1.72;
  color:var(--ink-2);
  max-width:44ch;
}

/* ── трите стъпки ── */
.welc-steps{display:grid;gap:14px;margin-bottom:28px}

.welc-st{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:15px;
  align-items:start;
}

.welc-st i{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:10px;
  flex:0 0 auto;
  background:#F4FCE3;
  color:#7cbf00;
  font:800 13px/1 var(--mono);
  font-style:normal;
}

.welc-st b{
  display:block;
  margin-bottom:3px;
  font:700 14.5px/1.4 var(--sans);
}

.welc-st span{
  display:block;
  font-size:13.5px;
  line-height:1.55;
  color:var(--ink-2);
}

/* ── бутонът ── */
.welc-go{display:flex;gap:12px;flex-wrap:wrap;align-items:center}

.welc-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  height:50px;
  padding:0 28px;
  border-radius:12px;
  text-decoration:none;
  background:linear-gradient(135deg,#B4E845,#7cbf00 52%,#7cbf00);
  color:#16250A;
  font:700 14.5px/1 var(--sans);
  box-shadow:0 10px 26px -6px rgba(152,219,28,.55);
  transition:transform .2s, box-shadow .2s;
}
.welc-btn:hover{transform:translateY(-2px);text-decoration:none;color:#16250A}

.welc-btn svg{width:16px;height:16px;transition:transform .25s}
.welc-btn:hover svg{transform:translateX(3px)}

.welc-from{font-size:13px;color:var(--ink-3)}
.welc-from b{
  font:800 1.1rem/1 var(--mono);
  color:var(--ink);
  letter-spacing:-.03em;
}

/* ── рисунката ── */
.welc-art{position:relative}
.welc-art svg{width:100%;height:auto;display:block;overflow:visible}

/*
 * ═══ ДВИЖЕНИЯТА ═══
 *
 * Всяко е поотделно и с различна дължина, за да не съвпадат —
 * иначе човекът би изглеждал като едно люлеене.
 */

/* Дишането · цялото тяло се вдига и спуска. */
@keyframes welc-dishane{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}
.welc-body{
  animation:welc-dishane 4s ease-in-out infinite;
  transform-origin:center bottom;
}

/* Кимането · само главата. */
@keyframes welc-kimane{
  0%,100%{transform:rotate(0deg)}
  30%{transform:rotate(3deg)}
  60%{transform:rotate(-2deg)}
}
.welc-head{
  animation:welc-kimane 5.4s ease-in-out infinite;
  transform-origin:50% 100%;
}

/* Мигането · клепачите се спускат за миг. */
@keyframes welc-migane{
  0%,92%,100%{transform:scaleY(1)}
  96%{transform:scaleY(.08)}
}
.welc-eye{
  animation:welc-migane 4.8s ease-in-out infinite;
  transform-origin:center;
}

/* Махането · само ръката, от рамото. */
@keyframes welc-mahane{
  0%,100%{transform:rotate(0deg)}
  25%{transform:rotate(-18deg)}
  75%{transform:rotate(-6deg)}
}
.welc-wave{
  animation:welc-mahane 2.2s ease-in-out infinite;
  transform-origin:top left;
}

/* Трите знака · пулсират един след друг. */
@keyframes welc-puls{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(1.3);opacity:.6}
}
.welc-dot{animation:welc-puls 2.4s ease-in-out infinite}
.welc-dot:nth-of-type(2){animation-delay:.5s}
.welc-dot:nth-of-type(3){animation-delay:1s}

/*
 * ЗА ХОРАТА, КОИТО НЕ ИСКАТ ДВИЖЕНИЕ.
 *
 * Някои се чувстват зле от движещи се неща на екрана. Браузърът
 * знае това и го казва — тук го уважаваме.
 */
@media (prefers-reduced-motion:reduce){
  .welc-body,.welc-head,.welc-eye,.welc-wave,.welc-dot{animation:none}
}

@media (max-width:980px){
  .welc-g{grid-template-columns:1fr}
  .welc-art{order:-1;max-width:400px;margin:0 auto}
}

/* ==== welc: край ==== */

/* ==== plan-c: начало ==== */

/*
 * ═══ ПЛОЧКИТЕ С ПЛАНОВЕ · РЕДОВЕ С ФОН ПРЕЗ ЕДИН ═══
 *
 * Всеки ред заема цялата ширина: отметка, име отляво, число отдясно.
 * Всеки втори е със сив фон, затова окото го следва без усилие.
 *
 * ЗА ВРЪЩАНЕ · махни блока между маркерите и върни старата функция.
 */

.plan-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  align-items:stretch;
}

.plan-card{
  position:relative;
  display:flex;
  flex-direction:column;
  height:100%;
  overflow:hidden;
  padding:0;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:0 1px 3px rgba(10,22,40,.06), 0 10px 28px -12px rgba(10,22,40,.16);
  transition:transform .24s cubic-bezier(.2,.9,.2,1), box-shadow .24s;
}
.plan-card:hover{
  transform:translateY(-5px);
  box-shadow:0 2px 5px rgba(10,22,40,.07), 0 24px 52px -16px rgba(10,22,40,.24);
}
.plan-card.is-featured{border-color:#7cbf00;border-width:2px}

/* ── лентата „най-често избиран“ ── */
.pl-top{
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:1;
  padding:7px;
  text-align:center;
  background:linear-gradient(90deg,#7cbf00,#7cbf00 52%,#7cbf00);
  color:#16250A;
  font:800 10px/1 var(--sans);
  letter-spacing:.1em;
  text-transform:uppercase;
}

/* ── отстъпката в ъгъла ── */
.pl-off{
  position:absolute;
  top:0;
  right:0;
  z-index:2;
  padding:7px 13px;
  border-radius:0 15px 0 12px;
  background:#D93A5C;
  color:#fff;
  font:800 12px/1 var(--mono);
  letter-spacing:-.02em;
}

/* ── име и описание ── */
.pl-head{padding:24px 22px 20px;border-bottom:1px solid var(--line)}
.plan-card.is-featured .pl-head{padding-top:42px}

.pl-head h3{
  margin:0 0 4px;
  font:800 1.3rem/1.08 var(--sans);
  letter-spacing:-.034em;
}
.pl-head p{
  margin:0;
  font-size:12px;
  line-height:1.45;
  color:var(--ink-3);
  height:35px;
  overflow:hidden;
}

/* ── цената ── */
.plan-card .pl-price{
  padding:20px 22px 18px;
  border-bottom:1px solid var(--line);
  background:none;
  border-radius:0;
}
.plan-card.is-featured .pl-price{
  background:linear-gradient(160deg,#F4FCE3,rgba(244,252,227,.35));
}

.pl-price .n{display:flex;align-items:baseline;gap:4px;margin-bottom:4px}
.pl-price .n b{font:800 2.3rem/1 var(--mono);letter-spacing:-.058em}
.plan-card.is-featured .pl-price .n b{color:#7cbf00}
.pl-price .n i{font-style:normal;font:700 1.1rem/1 var(--mono);color:var(--ink-2)}
.pl-price .n span{margin-left:3px;font-size:12.5px;color:var(--ink-3);font-weight:600}

.pl-price .old{display:block;font-size:12px;color:var(--ink-3);height:18px}
.pl-price .old s{margin-right:6px}
.pl-price .old em{font-style:normal;color:#D93A5C;font-weight:700}

/* ── редът с подновяването ── */
.pl-ren{
  padding:12px 22px;
  background:var(--wash);
  border-bottom:1px solid var(--line);
  font-size:11.5px;
  line-height:1.5;
  color:var(--ink-3);
}
.pl-ren b{color:var(--ink);font-weight:700}
.plan-card.is-featured .pl-ren{background:rgba(244,252,227,.5)}

/* ── подаръкът ── */
.pl-gift{
  display:flex;
  align-items:center;
  gap:9px;
  padding:12px 22px;
  background:linear-gradient(90deg,rgba(240,168,30,.12),rgba(240,168,30,.03));
  border-bottom:1px solid var(--line);
  font:700 12px/1.4 var(--sans);
  color:#8A5E10;
}
.pl-gift svg{width:15px;height:15px;color:#F0A81E;flex:0 0 auto}

/* ── тялото ── */
.pl-body{
  padding:18px 22px 20px;
  flex:1;
  display:flex;
  flex-direction:column;
}

/*
 * СПИСЪКЪТ · всеки втори ред е със сив фон.
 *
 * Така окото следва реда от името до числото, без да се губи по
 * средата — особено при широка карта.
 */
.pl-list{
  border-radius:11px;
  overflow:hidden;
  margin-bottom:16px;
  border:1px solid var(--line);
}

.pl-r{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 14px;
  font-size:12.5px;
  color:var(--ink-2);
  background:var(--paper);
}
.pl-r:nth-child(odd){background:var(--wash)}
.plan-card.is-featured .pl-r:nth-child(odd){background:rgba(244,252,227,.55)}

.pl-r span{min-width:0}
.pl-r b{
  margin-left:auto;
  font:700 13px/1 var(--mono);
  color:var(--ink);
  white-space:nowrap;
}
.pl-r svg{width:14px;height:14px;color:#7cbf00;flex:0 0 auto}

.pl-r.is-no b,
.pl-r.is-no svg{color:var(--line-2, #C9D3E0)}

/* Подзаглавието на групата · вътре в списъка, без да губи място. */
.pl-h{
  padding:8px 14px;
  background:var(--ink);
  color:#fff;
  font:700 8.5px/1.5 var(--sans);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.plan-card.is-featured .pl-h{background:#7cbf00}

/* ── бутонът ── */
.pl-go{margin-top:auto;padding-top:16px}

.pl-go a{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  height:46px;
  border-radius:10px;
  text-decoration:none;
  background:var(--navy, #0A1628);
  color:#fff;
  font:700 14px/1 var(--sans);
  transition:transform .2s, box-shadow .2s;
}
.pl-go a:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px -6px rgba(10,22,40,.34);
  text-decoration:none;
  color:#fff;
}
.plan-card.is-featured .pl-go a{
  background:linear-gradient(135deg,#B4E845,#7cbf00 52%,#7cbf00);
  color:#16250A;
  box-shadow:0 8px 22px -6px rgba(152,219,28,.5);
}
.plan-card.is-featured .pl-go a:hover{color:#16250A}

.pl-go a svg{width:15px;height:15px;transition:transform .25s}
.pl-go a:hover svg{transform:translateX(3px)}

@media (max-width:1400px){
  .plan-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:660px){
  .plan-grid{grid-template-columns:1fr}
  .pl-head p{height:auto}
}

/* ==== plan-c: край ==== */

/*
 * ТОЧНИТЕ ЦВЕТОВЕ ОТ МАКЕТА.
 *
 * Дотук стилът ползваше променливите на сайта, а те са други —
 * затова се разминаваше. Тук стойностите са вписани направо.
 */
.plan-card{background:#fff !important;border-color:#E6EBF2 !important}
.plan-card.is-featured{border-color:#7cbf00 !important}

.pl-head{border-bottom-color:#E6EBF2 !important}
.pl-head h3{color:#0A1628 !important}
.pl-head p{color:#8494AC !important}

.plan-card .pl-price{border-bottom-color:#E6EBF2 !important;background:none !important}
.plan-card.is-featured .pl-price{
  background:linear-gradient(160deg,#F4FCE3,rgba(244,252,227,.35)) !important}
.pl-price .n b{color:#0A1628 !important}
.plan-card.is-featured .pl-price .n b{color:#7cbf00 !important}
.pl-price .n i{color:#44526B !important}
.pl-price .n span{color:#8494AC !important}
.pl-price .old{color:#8494AC !important}

.pl-ren{background:#F7F9FC !important;border-bottom-color:#E6EBF2 !important;
        color:#8494AC !important}
.pl-ren b{color:#0A1628 !important}
.plan-card.is-featured .pl-ren{background:rgba(244,252,227,.5) !important}

.pl-gift{border-bottom-color:#E6EBF2 !important;color:#8A5E10 !important}

.pl-list{border-color:#E6EBF2 !important}
.pl-r{background:#fff !important;color:#44526B !important}
.pl-r:nth-child(odd){background:#F7F9FC !important}
.plan-card.is-featured .pl-r:nth-child(odd){background:rgba(244,252,227,.55) !important}
.pl-r b{color:#0A1628 !important}
.pl-r svg{color:#7cbf00 !important}
.pl-r.is-no b,.pl-r.is-no svg{color:#C9D3E0 !important}

.pl-h{background:#0A1628 !important;color:#fff !important}
.plan-card.is-featured .pl-h{background:#7cbf00 !important}

.pl-go a{background:#0A1628 !important;color:#fff !important}
.plan-card.is-featured .pl-go a{
  background:linear-gradient(135deg,#B4E845,#7cbf00 52%,#7cbf00) !important;
  color:#16250A !important}

/*
 * ЧЕРВЕНОТО И ЗЕЛЕНОТО ОТ МАКЕТА.
 *
 * Отстъпката е червена, лентата „най-често избиран“ е зелена
 * преливка, фонът на раздела е светлосин с ореол.
 */

/* Отстъпката в ъгъла · червена. */
.pl-off{background:#D93A5C !important;color:#fff !important}

/* Лентата отгоре · зелена преливка. */
.pl-top{
  background:linear-gradient(90deg,#7cbf00,#7cbf00 52%,#7cbf00) !important;
  color:#16250A !important;
}

/* Спестеното · червено, за да личи. */
.pl-price .old em{color:#D93A5C !important}

/* Подаръкът · златна лента. */
.pl-gift{
  background:linear-gradient(90deg,rgba(240,168,30,.12),rgba(240,168,30,.03)) !important;
}
.pl-gift svg{color:#F0A81E !important}

/*
 * ФОНЪТ НА РАЗДЕЛА · светлосин с меко зелено сияние.
 *
 * В макета разделът има свой фон, не бял.
 */
.sec:has(.plan-grid),
.sec-wash:has(.plan-grid),
section:has(> .wrap-w > .plan-grid){
  position:relative;
  background:linear-gradient(180deg,#FBFCFE,#EDF2F8) !important;
}

section:has(.plan-grid)::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(900px 440px at 50% -12%,
             rgba(152,219,28,.13), transparent 60%);
}

section:has(.plan-grid) > *{position:relative;z-index:1}

/*
 * ═══ ЕДНО КЪМ ЕДНО С МАКЕТА ═══
 *
 * Старият стил на сайта правеше имената с главни букви и центрирани.
 * Тук се връщат както са в макета: нормални букви, подравнени вляво.
 */
.plan-card .pl-head{text-align:left !important}

.plan-card .pl-head h3{
  text-transform:none !important;
  text-align:left !important;
  font:800 1.3rem/1.08 var(--sans) !important;
  letter-spacing:-.034em !important;
  color:#0A1628 !important;
  margin:0 0 4px !important;
}

.plan-card .pl-head p{
  text-align:left !important;
  font:400 12px/1.45 var(--sans) !important;
  color:#8494AC !important;
  margin:0 !important;
}

/* Празното описание не заема място. */
.plan-card .pl-head p:empty{display:none}

/* Цената · подравнена вляво, както в макета. */
.plan-card .pl-price{text-align:left !important}
.plan-card .pl-price .n{justify-content:flex-start !important}

/* Редът „плащате X за 12 месеца“ · под цената. */
.pl-once{
  padding:10px 22px;
  background:#F7F9FC;
  border-bottom:1px solid #E6EBF2;
  font-size:11.5px;
  line-height:1.5;
  color:#8494AC;
}
.pl-once b{color:#0A1628;font-weight:700}
.plan-card.is-featured .pl-once{background:rgba(244,252,227,.5)}

/* Спестеното · червено, до зачертаната цена. */
.plan-card .pl-price .old{
  display:flex !important;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  font-size:12px;
  color:#8494AC;
  height:auto;
}
.plan-card .pl-price .old s{
  color:#8494AC;
  text-decoration:line-through;
}
.plan-card .pl-price .old em{
  font-style:normal;
  color:#D93A5C !important;
  font-weight:700;
}

/* Спестеното · червено, окончателно. */
.plan-card .pl-price span.old,
.plan-card .pl-price .old{
  display:flex !important;
  align-items:baseline !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  height:auto !important;
  font-size:12px !important;
  color:#8494AC !important;
}

.plan-card .pl-price .old s{
  color:#8494AC !important;
  text-decoration:line-through !important;
  font-weight:400 !important;
}

.plan-card .pl-price .old em,
.plan-card .pl-price span.old em{
  font-style:normal !important;
  color:#D93A5C !important;
  font-weight:700 !important;
  display:inline !important;
}

/* ==== sh-more: начало ==== */

/* Скритите редове на таблицата. */
.sh-tbl tr.hid{display:none}
.sh-tbl.is-open tr.hid{display:table-row}

/* Бутонът за разгъване. */
.sh-more{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:100%;
  margin-top:14px;
  padding:14px;
  border:1px solid #C9D3E0;
  border-radius:11px;
  background:#fff;
  cursor:pointer;
  font:700 13.5px/1 var(--sans);
  color:#0A1628;
  transition:background .2s, border-color .2s;
}
.sh-more:hover{background:#F7F9FC;border-color:#8494AC}

.sh-more svg{width:16px;height:16px;transition:transform .26s}
.sh-tbl.is-open + .sh-more svg,
.sh-more.is-open svg{transform:rotate(180deg)}

/* ==== sh-more: край ==== */

/*
 * ═══ КРЪГЛАТА СТРЕЛКА ═══
 *
 * Седи върху долния ръб на таблицата, наполовина вътре и наполовина
 * навън — като копче на капак.
 */
.sh-tbl{position:relative;padding-bottom:26px}

.sh-more{
  position:absolute !important;
  bottom:0;
  left:50%;
  transform:translate(-50%, 50%);
  z-index:2;

  display:grid !important;
  place-items:center;
  width:52px !important;
  height:52px;
  padding:0 !important;
  margin:0 !important;
  border-radius:50% !important;

  background:#fff;
  border:1px solid #C9D3E0;
  box-shadow:0 2px 6px rgba(10,22,40,.08), 0 10px 26px -8px rgba(10,22,40,.24);
  cursor:pointer;
  transition:transform .24s cubic-bezier(.2,.9,.2,1),
             box-shadow .24s, border-color .2s;
}
.sh-more:hover{
  transform:translate(-50%, 50%) scale(1.08);
  border-color:#7cbf00;
  box-shadow:0 3px 8px rgba(10,22,40,.1), 0 14px 32px -8px rgba(10,22,40,.3);
}

/* Надписът се скрива · остава само стрелката. */
.sh-more span{display:none}

.sh-more svg{
  width:20px !important;
  height:20px !important;
  color:#0A1628;
  transition:transform .3s cubic-bezier(.2,.9,.2,1);
}
.sh-more.is-open svg{transform:rotate(180deg)}

/* Мястото под таблицата, когато е разгъната. */
.sh-tbl.is-open{padding-bottom:26px}

/*
 * ═══ КРЪГЛОТО КОПЧЕ · плътно, върху линията ═══
 *
 * Зелена преливка вместо бяло с рамка. Линията минава точно през
 * средата му, затова изглежда като част от таблицата, не залепено
 * отгоре.
 */
.sh-tbl{position:relative;padding-bottom:0 !important}

/* Линията, през която минава копчето. */
.sh-tbl::after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:26px;
  height:1px;
  background:#E6EBF2;
  pointer-events:none;
}
.sh-tbl.is-open::after{display:none}

.sh-more{
  position:absolute !important;
  bottom:-52px !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  z-index:3;

  display:grid !important;
  place-items:center;
  width:52px !important;
  height:52px !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:50% !important;

  background:linear-gradient(140deg,#B4E845,#7cbf00 50%,#7cbf00) !important;
  box-shadow:0 4px 14px -2px rgba(152,219,28,.55),
             0 0 0 5px #fff !important;
  cursor:pointer;
  transition:transform .26s cubic-bezier(.2,.9,.2,1), box-shadow .26s;
}
.sh-more:hover{
  transform:translateX(-50%) translateY(2px) !important;
  box-shadow:0 8px 22px -2px rgba(152,219,28,.7),
             0 0 0 5px #fff !important;
}

.sh-more span{display:none !important}

.sh-more svg{
  width:22px !important;
  height:22px !important;
  color:#16250A !important;
  stroke-width:3 !important;
  transition:transform .32s cubic-bezier(.2,.9,.2,1);
}
.sh-more.is-open svg{transform:rotate(180deg)}

/* Копчето · на долния ръб на целия блок, не върху реда с цените. */
.sh-tbl{position:relative;padding-bottom:30px}
.sh-tbl table{margin-bottom:0}

.sh-more{
  position:absolute !important;
  left:50% !important;
  bottom:0 !important;
  transform:translate(-50%, 50%) !important;
}
.sh-more:hover{transform:translate(-50%, 50%) scale(1.08) !important}

/* ==== sh-tbl-mob: начало ==== */

/*
 * ═══ ТАБЛИЦАТА НА ТЕЛЕФОН ═══
 *
 * Пет колони не се побират на екран от 360 пиксела. Таблицата се
 * плъзга настрани, а първата колона с имената остава закована —
 * иначе човек забравя кой ред гледа.
 */
@media (max-width:900px){

  .sh-tbl{
    overflow-x:auto;
    overflow-y:visible;
    -webkit-overflow-scrolling:touch;

    /* Меко избледняване вдясно · подсказва, че има още. */
    -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);
    mask-image:linear-gradient(90deg,#000 88%,transparent);
  }

  .sh-tbl.is-end{
    -webkit-mask-image:none;
    mask-image:none;
  }

  .sh-tbl table{
    min-width:600px;
    font-size:13px;
  }

  /* Първата колона остава на място при плъзгане. */
  .sh-tbl th:first-child,
  .sh-tbl td:first-child{
    position:sticky;
    left:0;
    z-index:2;
    background:#fff;
    min-width:132px;
    max-width:132px;
    box-shadow:6px 0 12px -6px rgba(10,22,40,.16);
  }

  .sh-tbl thead th:first-child{z-index:3}

  .sh-tbl td:first-child b{
    font-size:12px;
    line-height:1.35;
    display:block;
  }

  .sh-tbl th,
  .sh-tbl td{
    padding:10px 12px;
    white-space:nowrap;
  }

  /* Копчето се маха от плъзгащата се част. */
  .sh-more{
    position:static !important;
    transform:none !important;
    width:100% !important;
    height:46px !important;
    border-radius:11px !important;
    margin-top:14px !important;
  }
  .sh-more:hover{transform:none !important}
  .sh-more span{display:inline !important;font:700 13.5px/1 var(--sans)}
  .sh-tbl{padding-bottom:0 !important}
  .sh-tbl::after{display:none}
}

@media (max-width:520px){
  .sh-tbl table{min-width:520px;font-size:12.5px}

  .sh-tbl th:first-child,
  .sh-tbl td:first-child{min-width:116px;max-width:116px}

  .sh-tbl th,
  .sh-tbl td{padding:9px 10px}
}

/* ==== sh-tbl-mob: край ==== */

/*
 * БЕЗ ИЗРЯЗВАНЕ НА ТЕЛЕФОН.
 *
 * Мекото избледняване вдясно скриваше част от последната колона.
 * Вместо него · тънка сянка, която подсказва, че има още, без да
 * крие съдържание.
 */
@media (max-width:900px){
  .sh-tbl{
    -webkit-mask-image:none !important;
    mask-image:none !important;

    /* Сянката се появява само докато има накъде да се плъзга. */
    background:
      linear-gradient(90deg, #fff 30%, rgba(255,255,255,0)) left center,
      linear-gradient(90deg, rgba(255,255,255,0), #fff 70%) right center,
      radial-gradient(farthest-side at 0 50%,
        rgba(10,22,40,.12), rgba(10,22,40,0)) left center,
      radial-gradient(farthest-side at 100% 50%,
        rgba(10,22,40,.12), rgba(10,22,40,0)) right center;
    background-repeat:no-repeat;
    background-size:36px 100%, 36px 100%, 14px 100%, 14px 100%;
    background-attachment:local, local, scroll, scroll;
  }
}

/*
 * ПЛЪЗГАНЕТО НА ТЕЛЕФОН · окончателно.
 *
 * По-ранно правило слагаше „overflow:visible !important“ заради
 * кръглото копче. На телефон то спираше плъзгането и таблицата се
 * режеше.
 *
 * Тук копчето излиза от плъзгащата се част, затова видимостта вече
 * не е нужна.
 */
@media (max-width:900px){
  .sh-tbl{
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    padding-bottom:0 !important;
    position:static !important;
  }

  .sh-tbl table{min-width:640px !important}

  /* Копчето излиза извън таблицата · обикновен бутон отдолу. */
  .sh-more{
    position:static !important;
    display:flex !important;
    width:100% !important;
    height:48px !important;
    margin:14px 0 0 !important;
    padding:0 18px !important;
    border-radius:11px !important;
    transform:none !important;
    box-shadow:0 6px 18px -4px rgba(152,219,28,.45) !important;
  }
  .sh-more:hover{transform:none !important}

  .sh-more span{
    display:inline !important;
    font:700 13.5px/1 var(--sans);
    color:#16250A;
  }

  .sh-tbl::after{display:none !important}
}

/*
 * КРЪГЛОТО КОПЧЕ И НА ТЕЛЕФОН.
 *
 * Същото както на компютър · зелено кръгче с бял ръб, на долния край
 * на таблицата.
 *
 * Стои извън плъзгащата се част, затова не пречи на прелистването.
 */
@media (max-width:900px){
  .sh-more{
    display:grid !important;
    place-items:center !important;
    width:52px !important;
    height:52px !important;
    padding:0 !important;
    margin:-26px auto 0 !important;
    border-radius:50% !important;
    position:relative !important;
    z-index:3;

    background:linear-gradient(140deg,#B4E845,#7cbf00 50%,#7cbf00) !important;
    box-shadow:0 4px 14px -2px rgba(152,219,28,.55),
               0 0 0 5px #fff !important;
  }

  .sh-more span{display:none !important}

  .sh-more svg{
    width:22px !important;
    height:22px !important;
    color:#16250A !important;
    stroke-width:3 !important;
  }
  .sh-more.is-open svg{transform:rotate(180deg)}

  /* Място под таблицата, за да има къде да седне копчето. */
  .sh-tbl{margin-bottom:26px !important}
}

/*
 * КОПЧЕТО ИЗЛИЗА ОТ ПЛЪЗГАЩАТА СЕ ЧАСТ.
 *
 * Дотук стоеше вътре в таблицата и се местеше с нея при прелистване
 * настрани — стигаше почти извън екрана.
 *
 * Тук цялата обвивка получава собствено място, а копчето сяда под
 * нея и не мърда.
 */
@media (max-width:900px){

  /* Плъзга се само таблицата, не обвивката. */
  .sh-tbl{
    overflow-x:auto;
    overflow-y:hidden;
    position:relative !important;
    margin-bottom:0 !important;
    padding-bottom:30px !important;
  }

  /* Самата таблица влиза в своя плъзгаща се кутия. */
  .sh-tbl table{
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    min-width:0 !important;
    width:100%;
  }

  .sh-tbl table tbody,
  .sh-tbl table thead{
    display:table;
    width:640px;
  }

  /* Копчето стои под таблицата и не се плъзга. */
  .sh-more{
    position:absolute !important;
    left:50% !important;
    bottom:0 !important;
    transform:translate(-50%, 50%) !important;
    margin:0 !important;
    z-index:4;
  }
  .sh-more:hover{transform:translate(-50%, 50%) !important}
}

/* ==== sh-tbl-svet: начало ==== */

/*
 * ═══ ТАБЛИЦАТА ПО-СВЕТЛА ═══
 *
 * Черната глава притискаше цялата таблица. Тук е светла с тънка
 * линия отдолу, а редовете се редуват през един — окото следва
 * реда, без стените да го гнетят.
 */
.sh-tbl table{
  border-collapse:separate !important;
  border-spacing:0;
  border-radius:14px;
  overflow:hidden;
  border:1px solid #E6EBF2;
  background:#fff;
}

/* ── главата ── */
.sh-tbl thead th{
  background:#F7F9FC !important;
  color:#0A1628 !important;
  border-bottom:2px solid #E6EBF2 !important;
  padding:16px 14px !important;
  font:700 13.5px/1.3 var(--sans) !important;
  letter-spacing:-.01em;
  text-transform:none !important;
}

/* Колоната на препоръчания · светлозелена. */
.sh-tbl thead th.best{
  background:#F4FCE3 !important;
  color:#3E5A0C !important;
  border-bottom-color:#7cbf00 !important;
}

.sh-tbl thead th:first-child{background:#F7F9FC !important}

/* ── редовете ── */
.sh-tbl tbody tr:nth-child(even) td{background:#FBFCFE}
.sh-tbl tbody tr:hover td{background:#F4F7FB}

.sh-tbl tbody td{
  padding:13px 14px !important;
  border-bottom:1px solid #EEF2F7 !important;
  color:#44526B !important;
  font-size:13.5px;
  background:#fff;
  transition:background .18s;
}
.sh-tbl tbody tr:last-child td{border-bottom:0 !important}

/* Имената на редовете. */
.sh-tbl tbody td:first-child{
  background:#FAFBFD !important;
  color:#0A1628 !important;
}
.sh-tbl tbody tr:nth-child(even) td:first-child{background:#F6F8FB !important}
.sh-tbl tbody td:first-child b{
  font:600 13px/1.4 var(--sans) !important;
  color:#0A1628 !important;
}

/* Колоната на препоръчания · лек зелен оттенък. */
.sh-tbl tbody td.best{background:#FCFEF7 !important}
.sh-tbl tbody tr:nth-child(even) td.best{background:#F8FDEF !important}
.sh-tbl tbody tr:hover td.best{background:#F2FBE0 !important}

/* Числата · едноширочинен шрифт, за да се подреждат. */
.sh-tbl td.mono{
  font:600 13px/1 var(--mono) !important;
  color:#0A1628 !important;
  letter-spacing:-.02em;
}

/* Отметките и кръстчетата. */
.sh-tbl i.yes{
  color:#7cbf00 !important;
  font-style:normal;
  font-size:16px;
  font-weight:700;
}
.sh-tbl i.no{
  color:#C9D3E0 !important;
  font-style:normal;
  font-size:15px;
}

/* ==== sh-tbl-svet: край ==== */



/* Подзаглавията вътре в таблицата · също светли. */
.sh-tbl .grp td,
.sh-tbl tr.grp td,
.sh-tbl td.grp,
.sh-tbl .sh-grp{
  background:#EEF2F7 !important;
  color:#44526B !important;
}

/* Тялото. */
.sh-tbl tbody td{
  background:#fff !important;
  color:#44526B !important;
  border-bottom:1px solid #EEF2F7 !important;
}
.sh-tbl tbody tr:nth-child(even) td{background:#FBFCFE !important}
.sh-tbl tbody tr:hover td{background:#F4F7FB !important}

/* Първата колона · с едва доловим оттенък. */
.sh-tbl tbody td:first-child{background:#FAFBFD !important}
.sh-tbl tbody tr:nth-child(even) td:first-child{background:#F6F8FB !important}
.sh-tbl tbody td:first-child b{color:#0A1628 !important}

/* Препоръчаната колона · зелен оттенък, не тъмнина. */
.sh-tbl tbody td.best{background:#FCFEF7 !important}
.sh-tbl tbody tr:nth-child(even) td.best{background:#F8FDEF !important}
.sh-tbl tbody tr:hover td.best{background:#F2FBE0 !important}

/* Числата и знаците. */
.sh-tbl td.mono,
.sh-tbl td.mono b{color:#0A1628 !important}
.sh-tbl i.yes{color:#7cbf00 !important}
.sh-tbl i.no{color:#C9D3E0 !important}

/*
 * ═══ ТАБЛИЦАТА И КАРТИТЕ НА ТЕЛЕФОН ═══
 *
 * Само за тесни екрани · на компютър нищо не се мени.
 */
@media (max-width:900px){

  /* ── таблицата се плъзга цялата, без изрязване ── */
  .sh-tbl{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    -webkit-mask-image:none;
    mask-image:none;
  }

  .sh-tbl table{min-width:620px}

  .sh-tbl th,
  .sh-tbl td{
    padding:11px 12px;
    font-size:12.5px;
    white-space:normal;
    word-break:normal;
    overflow-wrap:anywhere;
    hyphens:auto;
  }

  /* Имената на редовете · пренасят се на два реда вместо да излизат. */
  .sh-tbl td:first-child{min-width:140px;max-width:160px}
  .sh-tbl td:first-child b{
    font-size:12px;
    line-height:1.35;
    display:block;
    white-space:normal;
  }

  /* Числата не се пренасят · те са къси. */
  .sh-tbl td.mono{white-space:nowrap}

  /* ── дългите текстове в плочките ── */
  .pl-r{flex-wrap:wrap;align-items:flex-start}
  .pl-r span{
    flex:1 1 auto;
    min-width:0;
    white-space:normal;
    overflow-wrap:anywhere;
    line-height:1.4;
  }
  .pl-r b{
    flex:0 0 auto;
    margin-left:auto;
    white-space:nowrap;
  }

  .pl-head h3,
  .pl-head p,
  .pl-gift,
  .pl-ren{overflow-wrap:anywhere}

  .pl-price .old{
    flex-wrap:wrap;
    line-height:1.5;
  }
}

@media (max-width:520px){
  .sh-tbl table{min-width:540px}

  .sh-tbl th,
  .sh-tbl td{padding:10px;font-size:12px}

  .sh-tbl td:first-child{min-width:126px;max-width:140px}
}

/*
 * ═══ ТЕЛЕФОН · таблицата се плъзга, копчето е извън нея ═══
 *
 * Досега копчето седеше вътре в таблицата. Щом тя получи плъзгане,
 * всичко извън ръба ѝ се отрязваше — включително половината копче.
 *
 * Тук плъзга се само вътрешна обвивка, а копчето стои под нея.
 */
@media (max-width:900px){

  .sh-tbl{
    overflow:visible !important;
    position:relative !important;
    padding-bottom:0 !important;
    margin-bottom:66px !important;
  }

  /* Плъзга се самата таблица, не обвивката. */
  .sh-tbl table{
    display:block !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    width:100% !important;
    min-width:0 !important;
    border-radius:14px;
  }

  .sh-tbl thead,
  .sh-tbl tbody{
    display:table !important;
    width:620px !important;
  }

  /*
   * Копчето · изцяло под таблицата, както на компютър.
   *
   * При -26 половината му стоеше върху реда с цената; при -52 слиза
   * цялото под него.
   */
  .sh-more{
    position:absolute !important;
    left:50% !important;
    bottom:-52px !important;
    transform:translateX(-50%) !important;
    z-index:5;
    margin:0 !important;
  }
  .sh-more:hover{transform:translateX(-50%) !important}
}

@media (max-width:520px){
  .sh-tbl thead,
  .sh-tbl tbody{width:540px !important}
}

/*
 * ТРИ ПЛАНА СЕ ЦЕНТРИРАТ.
 *
 * Решетката е за четири колони. При три картите оставаха вляво и
 * отдясно зееше празно място.
 *
 * Тук решетката става толкова широка, колкото са картите, и се
 * центрира. При четири нищо не се мени.
 */


.plan-grid:has(> .plan-card:nth-child(3):last-child){
  grid-template-columns:repeat(3, minmax(0, 300px));
}

.plan-grid:has(> .plan-card:nth-child(2):last-child){
  grid-template-columns:repeat(2, minmax(0, 320px));
}

@media (max-width:1400px){
  .plan-grid:has(> .plan-card:nth-child(3):last-child){
    grid-template-columns:repeat(2, minmax(0, 340px));
  }
}

@media (max-width:660px){
  .plan-grid:has(> .plan-card:nth-child(3):last-child),
  .plan-grid:has(> .plan-card:nth-child(2):last-child){
    grid-template-columns:minmax(0, 1fr);
  }
}

/*
 * ═══ КОЛОНИТЕ СЛЕДВАТ БРОЯ ПЛАНОВЕ ═══
 *
 * Решетката е закована на четири колони. При три плана те заемаха
 * три от тях, а четвъртата зееше празна.
 *
 * Тук броят колони следва броя карти · стои най-накрая, затова
 * побеждава по-ранните правила.
 */
.plan-grid:has(> .plan-card:nth-child(3):last-child){
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
}

.plan-grid:has(> .plan-card:nth-child(2):last-child){
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}

.plan-grid:has(> .plan-card:only-child){
  grid-template-columns:minmax(0, 420px) !important;
  justify-content:center;
}

@media (max-width:1400px){
  .plan-grid:has(> .plan-card:nth-child(3):last-child){
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width:660px){
  .plan-grid:has(> .plan-card:nth-child(3):last-child),
  .plan-grid:has(> .plan-card:nth-child(2):last-child){
    grid-template-columns:minmax(0, 1fr) !important;
  }
}

/*
 * ═══ ЕДИН СКРОЛ, НЕ ДВА ═══
 *
 * Обвивката и таблицата имаха плъзгане едновременно — затова при
 * затворена таблица се появяваше втори, едва доловим скрол.
 *
 * Тук плъзга се само таблицата; обвивката стои неподвижна и държи
 * копчето.
 */
.sh-tbl{
  overflow:visible;
}

.sh-tbl table{
  display:block;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
}

.sh-tbl thead,
.sh-tbl tbody{
  display:table;
  width:100%;
  min-width:680px;
}

@media (max-width:900px){
  .sh-tbl thead,
  .sh-tbl tbody{min-width:620px}
}

@media (max-width:520px){
  .sh-tbl thead,
  .sh-tbl tbody{min-width:540px}
}

/*
 * МЯСТОТО ЗА КОПЧЕТО ПОД ТАБЛИЦАТА.
 *
 * Обвивката трябва да носи празнина отдолу, иначе копчето сяда
 * върху последния ред с цените.
 */
.sh-tbl{
  position:relative;
  padding-bottom:0;
  margin-bottom:60px;
}

.sh-more{
  position:absolute;
  left:50%;
  bottom:-52px;
  transform:translateX(-50%);
  margin:0;
  z-index:5;
}
.sh-more:hover{transform:translateX(-50%) scale(1.08)}

@media (max-width:900px){
  .sh-tbl{margin-bottom:66px}
  .sh-more{bottom:-52px}
  .sh-more:hover{transform:translateX(-50%)}
}

/*
 * КОПЧЕТО ПОД ТАБЛИЦАТА · без бялата лента.
 *
 * Белият ореол около копчето се разпъваше по целия ред с цените и
 * изглеждаше като черта през тях.
 *
 * Тук копчето слиза изцяло под таблицата и ореолът отпада.
 */
.sh-tbl{
  position:relative !important;
  margin-bottom:64px !important;
  padding-bottom:0 !important;
}

.sh-more{
  position:absolute !important;
  left:50% !important;
  bottom:-56px !important;
  transform:translateX(-50%) !important;
  margin:0 !important;
  z-index:5;

  /* Само сянка, без бял пръстен. */
  box-shadow:0 4px 14px -2px rgba(152,219,28,.55) !important;
}
.sh-more:hover{
  transform:translateX(-50%) scale(1.08) !important;
  box-shadow:0 8px 22px -2px rgba(152,219,28,.7) !important;
}

@media (max-width:900px){
  .sh-tbl{margin-bottom:64px !important}
  .sh-more{bottom:-56px !important}
  .sh-more:hover{transform:translateX(-50%) !important}
}

/*
 * БЯЛАТА ЧЕРТА ПРЕЗ ЦЕНИТЕ ОТПАДА.
 *
 * Тя беше линията, през която минаваше копчето, докато седеше на
 * ръба на таблицата. Сега копчето е под нея и чертата само задрасква
 * реда с цените.
 */
.sh-tbl::after{display:none !important}

/*
 * ═══ ТАБЛИЦАТА НА WORDPRESS · същата като на споделения ═══
 *
 * Тя има свой клас „wp-tbl“ и остана с тъмния вид. Тук получава
 * същите цветове и същото устройство.
 */
.wp-tbl{
  position:relative;
  overflow:visible;
  margin-bottom:64px;
  padding-bottom:0;
  background:transparent;
}

.wp-tbl table{
  display:block;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid #E6EBF2;
  border-radius:14px;
  background:#fff;
}

.wp-tbl thead,
.wp-tbl tbody{
  display:table;
  width:100%;
  min-width:680px;
}

/* ── главата · светла, не тъмна ── */
.wp-tbl thead th{
  padding:16px 14px;
  background:#F7F9FC;
  color:#0A1628;
  border-bottom:2px solid #E6EBF2;
  font:700 13.5px/1.3 var(--sans);
  letter-spacing:-.01em;
  text-align:center;
  text-transform:none;
}
.wp-tbl thead th:first-child{text-align:left}

.wp-tbl thead th.best{
  background:#F4FCE3;
  color:#3E5A0C;
  border-bottom-color:#7cbf00;
}

/* ── редовете ── */
.wp-tbl tbody td{
  padding:13px 14px;
  background:#fff;
  border-bottom:1px solid #EEF2F7;
  color:#44526B;
  font-size:13.5px;
  text-align:center;
  transition:background .18s;
}
.wp-tbl tbody tr:last-child td{border-bottom:0}
.wp-tbl tbody tr:nth-child(even) td{background:#FBFCFE}
.wp-tbl tbody tr:hover td{background:#F4F7FB}

.wp-tbl tbody td:first-child{
  text-align:left;
  background:#FAFBFD;
}
.wp-tbl tbody tr:nth-child(even) td:first-child{background:#F6F8FB}
.wp-tbl tbody td:first-child b{
  font:600 13px/1.4 var(--sans);
  color:#0A1628;
}

.wp-tbl tbody td.best{background:#FCFEF7}
.wp-tbl tbody tr:nth-child(even) td.best{background:#F8FDEF}
.wp-tbl tbody tr:hover td.best{background:#F2FBE0}

.wp-tbl td.mono,
.wp-tbl td.mono b{
  font:600 13px/1 var(--mono);
  color:#0A1628;
  letter-spacing:-.02em;
}

.wp-tbl i.yes{color:#7cbf00;font-style:normal;font-size:16px;font-weight:700}
.wp-tbl i.no{color:#C9D3E0;font-style:normal;font-size:15px}

.wp-tbl::after{display:none}

/* ── на телефон ── */
@media (max-width:900px){
  .wp-tbl thead,
  .wp-tbl tbody{min-width:620px}

  .wp-tbl th,
  .wp-tbl td{
    padding:11px 12px;
    font-size:12.5px;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .wp-tbl td:first-child{min-width:140px;max-width:160px}
  .wp-tbl td.mono{white-space:nowrap}
}

@media (max-width:520px){
  .wp-tbl thead,
  .wp-tbl tbody{min-width:540px}

  .wp-tbl th,
  .wp-tbl td{padding:10px;font-size:12px}
}



/*
 * ═══ СМЕТКАТА ОТДЯСНО ═══
 *
 * Закована при превъртане · стои на екрана, докато човек попълва.
 */


.oa-box{
  border-radius:17px;
  overflow:hidden;
  background:#fff;
  border:1px solid #E6EBF2;
  box-shadow:0 2px 6px rgba(10,22,40,.07), 0 18px 46px -20px rgba(10,22,40,.24);
}

.oa-body{padding:22px 24px}

/* Планът · иконка, име, ресурси. */
.oa-p{
  display:flex;
  align-items:flex-start;
  gap:13px;
  padding-bottom:18px;
  margin-bottom:18px;
  border-bottom:1px solid #E6EBF2;
}

.oa-ico{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:12px;
  flex:0 0 auto;
  background:#F4FCE3;
  color:#7cbf00;
}
.oa-ico svg{width:21px;height:21px}

/* Редовете на сметката. */
.oa-lines{display:grid;gap:11px}

.oa-line{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  font-size:13.5px;
  color:#44526B;
}
.oa-line b{
  font:600 13.5px/1 var(--mono);
  color:#0A1628;
  white-space:nowrap;
}

/* Общата сума. */
.oa-sum{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  padding-top:18px;
  margin-top:18px;
  border-top:1px solid #E6EBF2;
}
.oa-sum > span{font:700 14.5px/1.3 var(--sans);color:#0A1628}
.oa-sum b{
  font:800 2rem/1 var(--mono);
  letter-spacing:-.056em;
  color:#7cbf00;
}

/* Връзката за промяна. */
.oa-edit{
  font-size:12px;
  color:#8494AC;
  text-decoration:none;
}
.oa-edit:hover{color:#7cbf00;text-decoration:underline}

@media (max-width:1100px){
  
}



/*
 * ═══ ДОБАВКИТЕ ═══
 *
 * Ред с отметка, име, обяснение и цена. Избраната светва в зелено.
 */
.adds{display:grid;gap:10px}

.add{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  padding:16px 18px;
  border-radius:13px;
  cursor:pointer;
  background:#fff;
  border:1.5px solid #E6EBF2;
  transition:border-color .22s, background .22s;
}
.add:hover{border-color:#C9D3E0}
.add.is-on{border-color:#7cbf00;background:#F4FCE3}

.add input{position:absolute;opacity:0;pointer-events:none}

/* Квадратчето. */
.a-box{
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  border-radius:7px;
  flex:0 0 auto;
  background:#fff;
  border:2px solid #C9D3E0;
  color:transparent;
  transition:background .2s, border-color .2s, color .2s;
}
.add.is-on .a-box{background:#7cbf00;border-color:#7cbf00;color:#fff}
.a-box svg{width:13px;height:13px}

.a-txt b{display:block;font:600 14px/1.3 var(--sans);color:#0A1628}
.add.is-on .a-txt b{color:#7cbf00}
.a-txt > span{
  display:block;
  margin-top:3px;
  font-size:12px;
  line-height:1.45;
  color:#8494AC;
}

.a-pr{text-align:right;white-space:nowrap}
.a-pr b{display:block;font:700 14px/1 var(--mono);color:#0A1628}
.add.is-on .a-pr b{color:#7cbf00}
.a-pr b.free{color:#7cbf00}
.a-pr > span{display:block;margin-top:3px;font-size:11px;color:#8494AC}

@media (max-width:640px){
  .add{grid-template-columns:auto 1fr}
  .a-pr{grid-column:2;text-align:left;margin-top:6px}
}








.ordp{--ink:#0A1628; --ink2:#44526B; --ink3:#8494AC;
  --line:#E6EBF2; --line2:#C9D3E0;
  --wash:#F7F9FC; --paper:#fff;
  --green:#7cbf00; --green-d:#7cbf00; --green-w:#F4FCE3;
  --navy:#0A1628; --rose:#D93A5C; --amber:#F0A81E;
  --sans:Onest,system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;}
.ordp *{box-sizing:border-box}
.ordp{margin:0;color:var(--ink);font:400 15px/1.6 var(--sans);
     -webkit-font-smoothing:antialiased;
     background:linear-gradient(180deg,#FBFCFE,#EDF2F8)}
.ordp::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(820px 440px at 84% -6%,rgba(152,219,28,.13),transparent 60%)}
.ordp .sec{position:relative;z-index:1;padding:clamp(26px,3.2vw,48px) clamp(20px,3vw,40px)
     clamp(40px,5vw,72px)}
.ordp .in{max-width:1680px;margin:0 auto}
.ordp .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  height:54px;padding:0 30px;border-radius:13px;text-decoration:none;border:0;
  cursor:pointer;font:700 15.5px/1 var(--sans);
  transition:transform .2s cubic-bezier(.2,.9,.2,1),box-shadow .22s}
.ordp .btn:hover{transform:translateY(-2px)}
.ordp .btn svg{width:17px;height:17px;transition:transform .25s}
.ordp .btn:hover svg{transform:translateX(3px)}
.ordp .b-green{background:linear-gradient(135deg,#B4E845,var(--green) 52%,var(--green-d));
  color:#16250A;box-shadow:0 10px 28px -7px rgba(152,219,28,.55)}
.ordp .b-green:hover{box-shadow:0 16px 38px -8px rgba(152,219,28,.68)}
.ordp .crumb{display:flex;align-items:center;gap:8px;margin-bottom:clamp(18px,2.2vw,26px);
       font-size:13px;color:var(--ink3)}
.ordp .crumb a{color:var(--ink3);text-decoration:none}
.ordp .crumb a:hover{color:var(--green-d)}
.ordp .crumb svg{width:13px;height:13px;opacity:.55}
.ordp .crumb b{color:var(--ink2);font-weight:600}
.ordp .head{display:flex;align-items:flex-end;gap:clamp(18px,2.6vw,40px);flex-wrap:wrap;
      margin-bottom:clamp(22px,2.8vw,34px)}
.ordp .head-l{max-width:620px}
.ordp .head h1{margin:0 0 10px;font:800 clamp(1.85rem,3.8vw,2.5rem)/1.1 var(--sans);
         letter-spacing:-.044em}
.ordp .head p{margin:0;font-size:15px;line-height:1.62;color:var(--ink2)}
.ordp .head-r{display:flex;gap:clamp(14px,2vw,28px);flex-wrap:wrap;margin-left:auto;
        padding-bottom:4px}
.ordp .pledge{display:flex;align-items:center;gap:10px}
.ordp .pledge i{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;
  flex:0 0 auto;background:var(--green-w);color:var(--green-d)}
.ordp .pledge i svg{width:17px;height:17px}
.ordp .pledge b{display:block;font:700 13px/1.25 var(--sans)}
.ordp .pledge span{display:block;font-size:11.5px;color:var(--ink3)}
.ordp .g{display:grid;grid-template-columns:1fr 410px;gap:clamp(20px,2.4vw,34px);
   align-items:start}
.ordp .steps{display:grid;gap:16px}
.ordp .card{position:relative;padding:26px 30px;border-radius:17px;
  background:var(--paper);border:1px solid var(--line);
  box-shadow:0 1px 3px rgba(10,22,40,.05),0 8px 24px -14px rgba(10,22,40,.14);
  transition:box-shadow .24s,border-color .24s}
.ordp .card:hover{border-color:var(--line2);
  box-shadow:0 2px 5px rgba(10,22,40,.06),0 14px 34px -16px rgba(10,22,40,.2)}
.ordp .c-h{display:flex;align-items:center;gap:13px;margin-bottom:20px}
.ordp .c-no{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  flex:0 0 auto;background:var(--navy);color:#fff;font:800 13px/1 var(--mono)}
.ordp .c-no.done{background:var(--green-d)}
.ordp .c-no.done svg{width:15px;height:15px}
.ordp .c-h h2{margin:0;font:700 1.1rem/1.3 var(--sans);letter-spacing:-.024em}
.ordp .c-h .sub{margin-left:auto;font-size:12.5px;color:var(--ink3);text-align:right}
.ordp .c-body{display:grid;gap:16px}
.ordp .f{display:grid;gap:8px}
.ordp .f label{font:600 12.5px/1.3 var(--sans);color:var(--ink2)}
.ordp .f .hint{font-size:11.5px;color:var(--ink3);line-height:1.5}
.ordp .f .hint b{color:var(--ink2);font-weight:600}
.ordp .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ordp .control{width:100%;height:48px;padding:0 15px;border-radius:11px;
  border:1px solid var(--line2);background:var(--paper);
  font:500 14.5px/1 var(--sans);color:var(--ink);
  transition:border-color .2s,box-shadow .2s}
.ordp .control:focus{outline:none;border-color:var(--green-d);box-shadow:0 0 0 3px var(--green-w)}
.ordp select.control{cursor:pointer;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%238494AC' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:18px;
  padding-right:42px}
.ordp .pre{display:flex;align-items:center;border-radius:11px;overflow:hidden;
  border:1px solid var(--line2);background:var(--paper);
  transition:border-color .2s,box-shadow .2s}
.ordp .pre:focus-within{border-color:var(--green-d);box-shadow:0 0 0 3px var(--green-w)}
.ordp .pre input{flex:1;min-width:0;height:46px;padding:0 15px;border:0;background:none;
  font:500 14.5px/1 var(--mono);color:var(--ink)}
.ordp .pre input:focus{outline:none}
.ordp .pre .suf{padding:0 15px;height:46px;display:grid;place-items:center;
  background:var(--wash);border-left:1px solid var(--line);
  font:500 13.5px/1 var(--mono);color:var(--ink3);white-space:nowrap}
/* ── периодите ── */
.ordp .terms{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ordp .t{position:relative;padding:18px 20px 17px;border-radius:13px;cursor:pointer;
  background:var(--paper);border:1.5px solid var(--line);
  transition:border-color .22s,background .22s,transform .2s}
.ordp .t:hover{border-color:var(--line2);transform:translateY(-2px)}
.ordp .t.on{border-color:var(--green-d);background:var(--green-w)}
.ordp .t .dot{position:absolute;top:17px;right:18px;width:18px;height:18px;border-radius:50%;
  border:2px solid var(--line2);background:var(--paper);transition:border-color .22s}
.ordp .t.on .dot{border-color:var(--green-d)}
.ordp .t.on .dot::after{content:"";position:absolute;inset:3px;border-radius:50%;
  background:var(--green-d)}
.ordp .t .nm{display:block;margin-bottom:10px;padding-right:26px;
       font:600 13px/1.3 var(--sans);color:var(--ink2)}
.ordp .t.on .nm{color:var(--green-d)}
.ordp .t .pr{display:flex;align-items:baseline;gap:3px;margin-bottom:5px}
.ordp .t .pr b{font:800 1.5rem/1 var(--mono);letter-spacing:-.052em}
.ordp .t.on .pr b{color:var(--green-d)}
.ordp .t .pr i{font-style:normal;font:700 .86rem/1 var(--mono);color:var(--ink2)}
.ordp .t .pr span{margin-left:3px;font-size:11.5px;color:var(--ink3);font-weight:600}
.ordp .t .once{display:block;font-size:11.5px;color:var(--ink3);line-height:1.4;min-height:16px}
.ordp .t.on .once{color:var(--ink2)}
.ordp .t .once s{color:var(--ink3)}
.ordp .t .off{position:absolute;top:-10px;left:18px;padding:4px 10px;border-radius:6px;
  background:var(--rose);color:#fff;font:800 10px/1 var(--mono);
  box-shadow:0 3px 8px -2px rgba(217,58,92,.5)}
/* ── местата ── */
.ordp .places{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:11px}
.ordp .pl{position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px;
  border-radius:12px;cursor:pointer;background:var(--paper);
  border:1.5px solid var(--line);
  transition:border-color .22s,background .22s,transform .2s}
.ordp .pl:hover{border-color:var(--line2);transform:translateY(-2px)}
.ordp .pl.on{border-color:var(--green-d);background:var(--green-w)}
.ordp .pl .fl{width:28px;height:20px;border-radius:4px;flex:0 0 auto;
  box-shadow:0 0 0 1px rgba(10,22,40,.1)}
.ordp .f-bg{background:linear-gradient(#fff 33%,#00966E 33% 66%,#D62612 66%)}
.ordp .f-de{background:linear-gradient(#000 33%,#D00 33% 66%,#FFCE00 66%)}
.ordp .f-nl{background:linear-gradient(#AE1C28 33%,#fff 33% 66%,#21468B 66%)}
.ordp .pl b{display:block;font:600 13.5px/1.25 var(--sans)}
.ordp .pl.on b{color:var(--green-d)}
.ordp .pl span{display:block;margin-top:2px;font-size:11.5px;color:var(--ink3)}
.ordp .pl .ms{margin-left:auto;display:inline-flex;align-items:center;gap:5px;
        font:600 11px/1 var(--mono);color:var(--ink3);white-space:nowrap}
.ordp .pl .ms i{width:5px;height:5px;border-radius:50%;background:var(--green)}
/* ══════════ ДОБАВКИТЕ ══════════ */
/*
 * Всяка добавка е ред с отметка, име, обяснение и цена.
 *
 * Избраната светва в зелено · вижда се с едно поглеждане какво е
 * включено и колко ще струва отгоре.
 */
.ordp .adds{display:grid;gap:10px}
.ordp .add{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:14px;
  align-items:center;padding:16px 18px;border-radius:13px;cursor:pointer;
  background:var(--paper);border:1.5px solid var(--line);
  transition:border-color .22s,background .22s}
.ordp .add:hover{border-color:var(--line2)}
.ordp .add.on{border-color:var(--green-d);background:var(--green-w)}
/* Квадратчето. */
.ordp .add .box{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;
  flex:0 0 auto;background:var(--paper);border:2px solid var(--line2);
  color:transparent;transition:background .2s,border-color .2s,color .2s}
.ordp .add.on .box{background:var(--green-d);border-color:var(--green-d);color:#fff}
.ordp .add .box svg{width:13px;height:13px}
.ordp .add .txt b{display:block;font:600 14px/1.3 var(--sans)}
.ordp .add.on .txt b{color:var(--green-d)}
.ordp .add .txt span{display:block;margin-top:3px;font-size:12px;line-height:1.45;
               color:var(--ink3)}
.ordp .add .pr{text-align:right;white-space:nowrap}
.ordp .add .pr b{display:block;font:700 14px/1 var(--mono)}
.ordp .add.on .pr b{color:var(--green-d)}
.ordp .add .pr span{display:block;margin-top:3px;font-size:11px;color:var(--ink3)}
.ordp .add .pr .free{color:var(--green-d);font-weight:700}
/* Препоръчаната добавка · тънък етикет. */
.ordp .add .tip{position:absolute;top:-9px;right:16px;padding:3px 9px;border-radius:5px;
  background:var(--amber);color:#3D2A00;font:800 9.5px/1 var(--sans);
  letter-spacing:.06em;text-transform:uppercase}
/* ══════════ РЕСУРСИТЕ ОТГОРЕ ══════════ */
/*
 * Плъзгачите за още памет, ядра и диск.
 *
 * Показват колко става общо, а не само добавката · човек мисли в
 * крайното число, не в разликата.
 */
.ordp .res{display:grid;gap:16px}
.ordp .res-r{padding:16px 18px;border-radius:13px;background:var(--wash);
       border:1px solid var(--line)}
.ordp .res-h{display:flex;align-items:center;gap:11px;margin-bottom:13px}
.ordp .res-h i{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;
  flex:0 0 auto;background:var(--paper);color:var(--ink2);
  box-shadow:0 1px 2px rgba(10,22,40,.06)}
.ordp .res-h i svg{width:16px;height:16px}
.ordp .res-h b{font:600 13.5px/1.3 var(--sans)}
.ordp .res-h .now{margin-left:auto;display:flex;align-items:baseline;gap:6px}
.ordp .res-h .now b{font:800 1.1rem/1 var(--mono);letter-spacing:-.04em;color:var(--ink)}
.ordp .res-h .now span{font-size:11.5px;color:var(--ink3)}
/* Стъпките като редица квадратчета. */
.ordp .res-steps{display:flex;gap:6px}
.ordp .res-s{flex:1;height:34px;border-radius:8px;cursor:pointer;
  display:grid;place-items:center;
  background:var(--paper);border:1.5px solid var(--line);
  font:600 12px/1 var(--mono);color:var(--ink3);
  transition:background .18s,border-color .18s,color .18s}
.ordp .res-s:hover{border-color:var(--line2)}
.ordp .res-s.on{background:var(--green-d);border-color:var(--green-d);color:#fff}
.ordp .res-s.base{background:var(--wash);border-style:dashed;color:var(--ink3)}
.ordp .res-f{display:flex;align-items:center;justify-content:space-between;gap:12px;
       margin-top:11px;font-size:11.5px;color:var(--ink3)}
.ordp .res-f b{color:var(--ink2);font-weight:600}
.ordp .res-f .cost{font:700 12px/1 var(--mono);color:var(--green-d)}
/* ══════════ СИСТЕМАТА · ЛОГО С ЛЕНТА ══════════ */
/*
 * Всяко семейство е правоъгълна плочка · логото отгоре, лента със
 * стрелка отдолу.
 *
 * Стрелката разгъва версиите само на тази плочка. Затова човек
 * избира първо какво познава (Ubuntu), после подробността (коя
 * версия) · вместо да чете двайсет реда наведнъж.
 */
.ordp .os-fam{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:12px;
        align-items:start}
.ordp .os-f{border-radius:13px;overflow:visible;position:relative;
  background:var(--paper);border:1.5px solid var(--line);
  transition:border-color .22s,box-shadow .22s}
.ordp .os-f:hover{border-color:var(--line2)}
.ordp .os-f.on{border-color:var(--green-d);
  box-shadow:0 0 0 3px rgba(94,154,0,.16)}
/* ── горната част · логото ── */
.ordp .os-top{position:relative;display:grid;place-items:center;gap:11px;
  padding:22px 14px 18px;cursor:pointer;border-radius:11px 11px 0 0;
  transition:background .22s}
.ordp .os-f.on .os-top{background:var(--green-w)}
/* Логото · правоъгълник с името на системата. */
.ordp .os-lg{display:grid;place-items:center;width:100%;max-width:112px;height:52px;
  border-radius:9px;padding:0 10px;
  font:800 15px/1 var(--sans);letter-spacing:-.02em;color:#fff;text-align:center;
  box-shadow:0 2px 7px -2px rgba(10,22,40,.28);
  transition:transform .22s}
.ordp .os-top:hover .os-lg{transform:translateY(-2px)}
.ordp .lg-u{background:linear-gradient(135deg,#F2764B,#E95420 58%,#C7411A)}
.ordp .lg-d{background:linear-gradient(135deg,#E0356B,#A80030 58%,#7A0022)}
.ordp .lg-a{background:linear-gradient(135deg,#17A88F,#0B7261 58%,#065044)}
.ordp .lg-r{background:linear-gradient(135deg,#34DDA2,#10B981 58%,#0A8A5F)}
.ordp .lg-c{background:linear-gradient(135deg,#4B49B8,#262577 58%,#181755)}
.ordp .os-top .nm{font:600 12.5px/1.25 var(--sans);color:var(--ink2);text-align:center}
.ordp .os-f.on .os-top .nm{color:var(--green-d)}
/* Отметката при избраното. */
.ordp .os-top .tick{position:absolute;top:10px;right:10px;display:grid;place-items:center;
  width:20px;height:20px;border-radius:50%;background:var(--green-d);color:#fff;
  opacity:0;transform:scale(.7);transition:opacity .2s,transform .2s}
.ordp .os-f.on .os-top .tick{opacity:1;transform:scale(1)}
.ordp .os-top .tick svg{width:11px;height:11px}
/* ── лентата със стрелката ── */
.ordp .os-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:10px 13px;cursor:pointer;border-radius:0 0 11px 11px;
  background:var(--wash);border-top:1px solid var(--line);
  transition:background .2s}
.ordp .os-bar:hover{background:#EEF3F9}
.ordp .os-f.on .os-bar{background:rgba(244,252,227,.6);border-top-color:rgba(152,219,28,.3)}
.ordp .os-bar span{font:600 11.5px/1 var(--mono);color:var(--ink2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ordp .os-f.on .os-bar span{color:var(--green-d)}
.ordp .os-bar svg{width:15px;height:15px;flex:0 0 auto;color:var(--ink3);
  transition:transform .26s cubic-bezier(.2,.9,.2,1)}
.ordp .os-f.open .os-bar svg{transform:rotate(180deg)}
.ordp .os-f.on .os-bar svg{color:var(--green-d)}
/* ── падащото меню ── */
.ordp .os-drop{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:20;
  padding:7px;border-radius:12px;
  background:var(--paper);border:1px solid var(--line2);
  box-shadow:0 6px 16px -4px rgba(10,22,40,.16),
             0 20px 44px -16px rgba(10,22,40,.3);

  /* Затворено по подразбиране. */
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .2s,transform .22s,visibility .22s}
.ordp .os-f.open .os-drop{opacity:1;visibility:visible;transform:translateY(0)}
.ordp .os-v{display:flex;align-items:center;gap:10px;padding:10px 11px;border-radius:9px;
  cursor:pointer;transition:background .16s}
.ordp .os-v:hover{background:var(--wash)}
.ordp .os-v.on{background:var(--green-w)}
.ordp .os-v .dot{position:relative;width:15px;height:15px;border-radius:50%;flex:0 0 auto;
  border:2px solid var(--line2);background:var(--paper);transition:border-color .18s}
.ordp .os-v.on .dot{border-color:var(--green-d)}
.ordp .os-v.on .dot::after{content:"";position:absolute;inset:2.5px;border-radius:50%;
  background:var(--green-d)}
.ordp .os-v b{font:600 12.5px/1.25 var(--sans);white-space:nowrap}
.ordp .os-v.on b{color:var(--green-d)}
.ordp .os-v .note{margin-left:auto;font-size:10.5px;color:var(--ink3);white-space:nowrap}
/* ══════════ ДОМЕЙНЪТ ══════════ */
/*
 * Три пътя, взаимно изключващи се · регистрация, прехвърляне или
 * свой домейн.
 *
 * ЗАДЪЛЖИТЕЛЕН Е · машината трябва да има име. Затова не е „по
 * желание“, а стъпка като всяка друга.
 */
.ordp .dm-ways{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}
.ordp .dm-w{position:relative;padding:15px 16px;border-radius:12px;cursor:pointer;
  background:var(--paper);border:1.5px solid var(--line);
  transition:border-color .22s,background .22s,transform .2s}
.ordp .dm-w:hover{border-color:var(--line2);transform:translateY(-2px)}
.ordp .dm-w.on{border-color:var(--green-d);background:var(--green-w)}
.ordp .dm-w i{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;
  margin-bottom:10px;background:var(--wash);color:var(--ink2);
  transition:background .2s,color .2s}
.ordp .dm-w.on i{background:var(--paper);color:var(--green-d)}
.ordp .dm-w i svg{width:17px;height:17px}
.ordp .dm-w b{display:block;font:600 13.5px/1.25 var(--sans)}
.ordp .dm-w.on b{color:var(--green-d)}
.ordp .dm-w span{display:block;margin-top:3px;font-size:11.5px;line-height:1.45;
           color:var(--ink3)}
.ordp .dm-w .dot{position:absolute;top:14px;right:14px;width:17px;height:17px;
  border-radius:50%;border:2px solid var(--line2);background:var(--paper);
  transition:border-color .2s}
.ordp .dm-w.on .dot{border-color:var(--green-d)}
.ordp .dm-w.on .dot::after{content:"";position:absolute;inset:2.5px;border-radius:50%;
  background:var(--green-d)}
/* ── търсенето ── */
.ordp .dm-find{display:grid;grid-template-columns:1fr auto;gap:10px}
.ordp .dm-find .btn{height:48px;padding:0 24px;font-size:14.5px}
/* Резултатите от търсенето. */
.ordp .dm-res{display:grid;gap:8px;margin-top:14px}
.ordp .dm-r{display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;
  align-items:center;padding:13px 15px;border-radius:11px;
  background:var(--paper);border:1.5px solid var(--line);
  transition:border-color .2s,background .2s}
.ordp .dm-r.on{border-color:var(--green-d);background:var(--green-w)}
.ordp .dm-r.taken{opacity:.55}
.ordp .dm-r .st{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;
  flex:0 0 auto;color:#fff}
.ordp .dm-r .st.free{background:var(--green-d)}
.ordp .dm-r .st.busy{background:var(--ink3)}
.ordp .dm-r .st svg{width:12px;height:12px}
.ordp .dm-r .nm{font:600 14px/1.25 var(--mono)}
.ordp .dm-r.on .nm{color:var(--green-d)}
.ordp .dm-r .nm em{font-style:normal;color:var(--ink3);font-weight:500}
.ordp .dm-r .pr{text-align:right;white-space:nowrap}
.ordp .dm-r .pr b{display:block;font:700 13.5px/1 var(--mono)}
.ordp .dm-r.on .pr b{color:var(--green-d)}
.ordp .dm-r .pr span{display:block;margin-top:2px;font-size:10.5px;color:var(--ink3)}
.ordp .dm-r .go{display:grid;place-items:center;height:34px;padding:0 15px;border-radius:9px;
  cursor:pointer;border:1.5px solid var(--line2);background:var(--paper);
  font:600 12px/1 var(--sans);color:var(--ink2);
  transition:background .18s,border-color .18s,color .18s}
.ordp .dm-r .go:hover{background:var(--wash)}
.ordp .dm-r.on .go{background:var(--green-d);border-color:var(--green-d);color:#fff}
.ordp .dm-r.taken .go{opacity:.5;cursor:default}
/* Полето за свой домейн или прехвърляне. */
.ordp .dm-own{display:grid;gap:14px}
.ordp .dm-note{display:flex;align-items:flex-start;gap:11px;padding:14px 16px;
  border-radius:11px;background:var(--wash);border:1px solid var(--line);
  font-size:12.5px;line-height:1.55;color:var(--ink2)}
.ordp .dm-note svg{width:17px;height:17px;flex:0 0 auto;margin-top:1px;color:var(--green-d)}
.ordp .dm-note b{font-weight:600}
/* ══════════ ДАННИТЕ ЗА ФАКТУРА ══════════ */
/*
 * Превключвател между човек и фирма · полетата се менят според него.
 */
.ordp .who{display:inline-flex;padding:4px;border-radius:11px;margin-bottom:18px;
  background:var(--wash);border:1px solid var(--line)}
.ordp .who-b{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 20px;
  border-radius:8px;border:0;cursor:pointer;background:none;
  font:600 13.5px/1 var(--sans);color:var(--ink2);
  transition:background .2s,color .2s,box-shadow .2s}
.ordp .who-b.on{background:var(--paper);color:var(--ink);
  box-shadow:0 1px 3px rgba(10,22,40,.12)}
.ordp .who-b svg{width:16px;height:16px}
.ordp .three{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
/* Полето, което заема целия ред. */
.ordp .f.wide{grid-column:1 / -1}
/* Отметката за съгласие. */
.ordp .agree{display:flex;align-items:flex-start;gap:11px;padding:15px 17px;
  border-radius:12px;cursor:pointer;
  background:var(--wash);border:1px solid var(--line);
  transition:border-color .2s}
.ordp .agree:hover{border-color:var(--line2)}
.ordp .agree .box{display:grid;place-items:center;width:21px;height:21px;border-radius:6px;
  flex:0 0 auto;margin-top:1px;background:var(--paper);
  border:2px solid var(--line2);color:transparent;
  transition:background .2s,border-color .2s,color .2s}
.ordp .agree.on .box{background:var(--green-d);border-color:var(--green-d);color:#fff}
.ordp .agree .box svg{width:12px;height:12px}
.ordp .agree span{font-size:12.5px;line-height:1.55;color:var(--ink2)}
.ordp .agree a{color:var(--green-d);text-decoration:none;font-weight:600}
.ordp .agree a:hover{text-decoration:underline}
/* ══════════ СТРАНИЧНАТА КОЛОНА ══════════ */
.ordp .side{position:sticky;top:20px;display:grid;gap:14px}
/* Полета с числа · едноширочинен шрифт. */
.ordp .control.mono{font-family:var(--mono);font-size:14px}
.ordp .sum{border-radius:17px;overflow:hidden;background:var(--paper);
  border:1px solid var(--line);
  box-shadow:0 2px 6px rgba(10,22,40,.07),0 18px 46px -20px rgba(10,22,40,.24)}
/*
 * ПЛАНЪТ В СМЕТКАТА · прост ред, както в първия макет.
 *
 * Без зелена глава и без мрежа · само иконка, име и ресурсите на
 * един ред под него.
 */
.ordp .v1-plan{display:flex;align-items:flex-start;gap:13px;padding-bottom:18px;
  margin-bottom:18px;border-bottom:1px solid var(--line)}
.ordp .v1-plan .ic{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;
  flex:0 0 auto;background:var(--green-w);color:var(--green-d)}
.ordp .v1-plan .ic svg{width:21px;height:21px}
.ordp .v1-plan b{display:block;font:700 15px/1.3 var(--sans)}
.ordp .v1-plan span{display:block;margin-top:2px;font-size:12.5px;color:var(--ink3)}
.ordp .sum-body{padding:22px 24px}
.ordp .rows{display:grid;gap:11px;padding-bottom:18px;margin-bottom:18px;
      border-bottom:1px solid var(--line)}
.ordp .r{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
   font-size:13.5px;color:var(--ink2)}
.ordp .r b{font:600 13.5px/1 var(--mono);color:var(--ink);white-space:nowrap}
.ordp .r.save, .ordp .r.save b{color:var(--green-d)}
.ordp .r s{color:var(--ink3)}
.ordp .r.sm{font-size:12.5px;color:var(--ink3)}
.ordp .r.sm b{font-size:12.5px;color:var(--ink2)}
/* Заглавие вътре в списъка. */
.ordp .rows .ttl{margin-top:4px;font:700 9.5px/1 var(--sans);letter-spacing:.12em;
           text-transform:uppercase;color:var(--ink3)}
.ordp .tot{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
     margin-bottom:7px}
.ordp .tot span{font:700 14.5px/1.3 var(--sans)}
.ordp .tot b{font:800 2rem/1 var(--mono);letter-spacing:-.056em;color:var(--green-d)}
.ordp .vat{display:block;margin-bottom:20px;font-size:11.5px;line-height:1.5;color:var(--ink3)}
.ordp .vat b{color:var(--ink2);font-weight:600}
.ordp .sum-body .btn{width:100%}
.ordp .after{display:flex;align-items:center;justify-content:center;gap:8px;
       margin-top:13px;font-size:11.5px;color:var(--ink3)}
.ordp .after svg{width:13px;height:13px;color:var(--green-d)}
.ordp .pays{padding:16px 20px;border-radius:14px;background:var(--paper);
      border:1px solid var(--line)}
.ordp .pays .ttl{display:block;margin-bottom:11px;font:700 10.5px/1 var(--sans);
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.ordp .pays-r{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.ordp .pay{display:grid;place-items:center;height:30px;padding:0 11px;border-radius:7px;
  background:var(--wash);border:1px solid var(--line);
  font:700 10.5px/1 var(--sans);color:var(--ink2)}
.ordp .help{display:flex;align-items:center;gap:13px;padding:16px 20px;border-radius:14px;
  background:var(--wash);border:1px solid var(--line)}
.ordp .help .ic{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;
  flex:0 0 auto;background:var(--paper);color:var(--green-d);
  box-shadow:0 1px 3px rgba(10,22,40,.07)}
.ordp .help .ic svg{width:18px;height:18px}
.ordp .help b{display:block;font:700 13px/1.25 var(--sans)}
.ordp .help span{display:block;margin-top:2px;font-size:11.5px;color:var(--ink3)}
@media (max-width:1150px){
  .ordp .g{grid-template-columns:1fr}
  .ordp .side{position:static}
  .ordp .head-r{margin-left:0}
}
@media (max-width:700px){
  .ordp .terms{grid-template-columns:1fr}
  .ordp .two{grid-template-columns:1fr}
  .ordp .t .off{top:-10px;left:auto;right:18px}
  .ordp .add{grid-template-columns:auto 1fr;gap:12px}
  .ordp .add .pr{grid-column:2;text-align:left;margin-top:6px}
  .ordp .res-steps{flex-wrap:wrap}
  .ordp .res-s{flex:0 0 calc(25% - 5px)}
}



/* Формата е решетка · картите са нейни деца. */
.ordp .order-form{display:grid;gap:16px}

/* Полетата вътре в картите. */
.ordp .f{display:grid;gap:8px}
.ordp .f > label{font:600 12.5px/1.3 var(--sans);color:var(--ink2)}
.ordp .hint{font-size:11.5px;line-height:1.5;color:var(--ink3)}

.ordp .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* Търсенето на домейн · поле и копче. */
.ordp .dm-find{display:grid;grid-template-columns:1fr auto;gap:10px}
.ordp .dm-find .btn{height:46px;padding:0 24px;font-size:14.5px}

/* Полето с представка. */
.ordp .ns-row{
  display:flex;
  align-items:center;
  border-radius:11px;
  overflow:hidden;
  border:1px solid var(--line2);
  background:var(--paper);
}
.ordp .ns-row:focus-within{border-color:var(--green-d);box-shadow:0 0 0 3px var(--green-w)}
.ordp .ns-row .control{border:0;border-radius:0;height:44px;box-shadow:none}
.ordp .suf{
  padding:0 14px;
  height:44px;
  display:grid;
  place-items:center;
  background:var(--wash);
  border-left:1px solid var(--line);
  font:500 13.5px/1 var(--mono);
  color:var(--ink3);
  white-space:nowrap;
}

/* Съобщението за грешка. */
.ordp .form-error{
  padding:14px 18px;
  border-radius:12px;
  background:#FEE2E2;
  border:1px solid #FCA5A5;
  color:#991B1B;
  font-size:13.5px;
}

/* Копчето в сметката заема цялата ширина. */
.ordp .sum-body .btn{width:100%;border:0;cursor:pointer}

/* Квадратчетата за ресурси са етикети с полета вътре. */
.ordp .res-s{position:relative}
.ordp .res-s input{position:absolute;opacity:0;pointer-events:none}

/* Плочките крият полетата си. */
.ordp .t input,
.ordp .pl input,
.ordp .dm-w input,
.ordp .add input,
.ordp .os-v input{position:absolute;opacity:0;pointer-events:none}









/* Числото в средата. */
.ordp .res-v{
  display:grid;
  place-items:center;
  gap:2px;
  padding:8px 12px;
  border-radius:11px;
  background:#F7F9FC;
  border:1px solid #E6EBF2;
}
.ordp .res-v b{
  font:800 1.16rem/1 var(--mono);
  letter-spacing:-.04em;
  color:#0A1628;
}
.ordp .res-v > span{
  font-size:10px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#8494AC;
}

/* Надграденото свети зелено. */
.ordp .res-r.is-up .res-v{
  background:#F4FCE3;
  border-color:#D9EDB0;
}
.ordp .res-r.is-up .res-v b{color:#7cbf00}

/* Цената горе вдясно. */
.ordp .res-h .cost{
  margin-left:auto;
  font:700 12px/1 var(--mono);
  color:#8494AC;
  white-space:nowrap;
}
.ordp .res-r.is-up .res-h .cost{color:#7cbf00}

/* Редът отдолу · какво влиза и докъде стига. */
.ordp .res-f{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-size:11.5px;
  color:#8494AC;
}
.ordp .res-f b{color:#44526B;font-weight:600}

@media (max-width:520px){
  .ordp .res-cnt{grid-template-columns:40px 1fr 40px;gap:8px}
  .ordp .res-b{width:40px;height:40px}
}



/* Вътре в тясната плочка · по-стегнато. */
.ordp .res-r{padding:14px 15px}
.ordp .res-h{gap:9px;margin-bottom:10px}
.ordp .res-h b{font-size:12.5px}
.ordp .res-h i{width:26px;height:26px;border-radius:8px}
.ordp .res-h i svg{width:14px;height:14px}
.ordp .res-h .cost{font-size:11px}

.ordp .res-cnt{grid-template-columns:38px 1fr 38px;gap:8px;margin:10px 0 9px}
.ordp .res-b{width:38px;height:38px;font-size:18px}
.ordp .res-v{padding:7px 8px}
.ordp .res-v b{font-size:1rem}

.ordp .res-f{font-size:11px}

/* Първият ред · четири плочки за системите също. */
.ordp .os-fam{grid-template-columns:repeat(4,1fr)}

@media (max-width:1150px){
  .ordp .res{grid-template-columns:repeat(2,1fr)}
  .ordp .os-fam{grid-template-columns:repeat(3,1fr)}
}

@media (max-width:640px){
  .ordp .res{grid-template-columns:1fr}
  .ordp .os-fam{grid-template-columns:repeat(2,1fr)}
}












.ordp{--canvas:#F3F6FA; --card:#fff;
  --line:#E4EAF2;   --line-2:#C9D4E2;
  --ink:#0E1828;    --ink-2:#1C2A42;
  --dim:#57667C;    --faint:#8896AA;
  --cy:#0B84A5;     --cy-bg:#E4F3F8;
  --vi:#6D4BC7;     --vi-bg:#EFEAFB;
  --or:#C25E12;     --or-bg:#FCF0E6;
  --ok:#12855C;     --ok-bg:#E7F6EF;
  --go:#7cbf00;     --go-l:#7cbf00;
  --sans:Onest,system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;}
.ordp *{box-sizing:border-box}
.ordp{margin:0;color:var(--ink);font:400 14.5px/1.55 var(--sans);
     -webkit-font-smoothing:antialiased;background:var(--canvas)}
.ordp .sec{padding:22px clamp(16px,2.6vw,32px) 60px}
.ordp .in{max-width:1220px;margin:0 auto}
.ordp .ctrl{width:100%;height:42px;padding:0 14px;border-radius:10px;
  border:1px solid var(--line-2);background:var(--card);
  font:500 14px/1 var(--sans);color:var(--ink);
  transition:border-color .16s,box-shadow .16s}
.ordp .ctrl:focus{outline:none;border-color:var(--cy);box-shadow:0 0 0 3px var(--cy-bg)}
.ordp .ctrl.mono{font-family:var(--mono);font-size:13.5px}
.ordp select.ctrl{cursor:pointer;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%238896AA' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;background-size:16px;
  padding-right:38px}
.ordp .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:44px;padding:0 24px;border-radius:11px;border:0;cursor:pointer;
  text-decoration:none;font:700 14px/1 var(--sans);
  transition:box-shadow .2s,transform .16s,background .18s}
.ordp .btn svg{width:15px;height:15px;transition:transform .22s}
.ordp .btn:hover svg{transform:translateX(3px)}
.ordp .b-ink{background:linear-gradient(140deg,#1C2A42,#0E1828);color:#fff}
.ordp .b-ink:hover{box-shadow:0 8px 22px -6px rgba(14,24,40,.5);transform:translateY(-1px)}
.ordp .b-go{background:linear-gradient(138deg,#A8E33A,#7FB812 46%,#7cbf00);color:#12240B;
      box-shadow:0 6px 18px -5px rgba(95,140,10,.45)}
.ordp .b-go:hover{box-shadow:0 12px 30px -7px rgba(95,140,10,.6);transform:translateY(-1px)}
.ordp .b-l{background:var(--card);color:var(--dim);border:1px solid var(--line-2)}
.ordp .b-l:hover{background:var(--canvas)}
/* ═══════════════════════════════════════════════════════════
   ГЛАВАТА · планът и периодът в тъмна лента
   ═══════════════════════════════════════════════════════════ */
.ordp .hero{position:relative;overflow:hidden;margin-bottom:16px;
  border-radius:17px;padding:18px 22px;
  background:linear-gradient(120deg,#0F1B2E,#1A2B47 48%,#123049);
  box-shadow:0 16px 40px -20px rgba(14,24,40,.7)}
.ordp .hero::after{content:"";position:absolute;top:-90px;right:8%;
  width:320px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(11,132,165,.55),transparent 66%);
  filter:blur(44px);pointer-events:none}
.ordp .hero > *{position:relative;z-index:1}
.ordp .hero-r{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.ordp .hero-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;
  flex:0 0 auto;color:#7FD4EC;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
.ordp .hero-ic svg{width:22px;height:22px}
.ordp .hero-n b{display:block;font:800 1.2rem/1.14 var(--sans);letter-spacing:-.032em;
          color:#fff}
.ordp .hero-n span{display:block;margin-top:4px;font:500 12px/1 var(--mono);
             color:rgba(255,255,255,.55)}
.ordp .hero-n a{color:#7FD4EC;text-decoration:none;font-weight:600;
          font-family:var(--sans);font-size:11.5px;margin-left:8px}
.ordp .hero-n a:hover{text-decoration:underline}
/* Периодът · сегментиран, не падащ списък. */
.ordp .cyc{margin-left:auto;display:flex;gap:3px;padding:4px;border-radius:12px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.ordp .cy{position:relative;padding:8px 15px 7px;border-radius:9px;cursor:pointer;
  border:0;background:none;text-align:center;min-width:86px;
  transition:background .2s}
.ordp .cy:hover{background:rgba(255,255,255,.07)}
.ordp .cy.on{background:#fff;box-shadow:0 2px 8px -2px rgba(0,0,0,.3)}
.ordp .cy .t{display:block;font:600 11px/1 var(--sans);color:rgba(255,255,255,.6)}
.ordp .cy.on .t{color:var(--dim)}
.ordp .cy .p{display:block;margin-top:5px;font:800 .96rem/1 var(--mono);
       letter-spacing:-.03em;color:#fff}
.ordp .cy.on .p{color:var(--ink)}
.ordp .cy .off{position:absolute;top:-7px;right:6px;padding:2px 6px;border-radius:4px;
  background:linear-gradient(120deg,#FF6B8A,#D93A5C);color:#fff;
  font:800 8.5px/1 var(--mono)}
/* ═══════════════════════════════════════════════════════════
   РЕШЕТКАТА
   ═══════════════════════════════════════════════════════════ */
.ordp .g{display:grid;grid-template-columns:1fr 316px;gap:16px;align-items:start}
.ordp .col{display:grid;gap:14px;min-width:0}
/* ── карта ── */
.ordp .c{border-radius:15px;background:var(--card);border:1px solid var(--line);
   overflow:hidden;transition:box-shadow .24s}
.ordp .c:hover{box-shadow:0 6px 20px -14px rgba(14,24,40,.3)}
.ordp .c-h{display:flex;align-items:center;gap:12px;padding:15px 20px 14px}
.ordp .c-n{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;
  flex:0 0 auto;font:800 11.5px/1 var(--mono);
  background:var(--canvas);border:1px solid var(--line);color:var(--faint)}
.ordp .c.ok .c-n{background:linear-gradient(140deg,#2EC48E,#12855C);
  border-color:transparent;color:#fff}
.ordp .c-n svg{width:13px;height:13px}
.ordp .c-h h2{margin:0;font:700 14px/1.25 var(--sans);letter-spacing:-.02em}
.ordp .c-h .sub{margin-left:auto;font-size:11.5px;color:var(--faint);text-align:right}
.ordp .c-b{padding:0 20px 20px}
/* ── полета ── */
.ordp .f{display:grid;gap:6px}
.ordp .f > label{font:700 10px/1.3 var(--sans);letter-spacing:.09em;
           text-transform:uppercase;color:var(--faint)}
.ordp .f .n{font-size:11px;color:var(--faint);line-height:1.45}
.ordp .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ordp .three{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
/* ═══════════════════════════════════════════════════════════
   ДОМЕЙНЪТ
   ═══════════════════════════════════════════════════════════ */
.ordp .dtab{display:flex;gap:20px;margin-bottom:14px;border-bottom:1px solid var(--line)}
.ordp .dt{display:inline-flex;align-items:center;gap:7px;padding:0 0 11px;cursor:pointer;
  border:0;background:none;position:relative;
  font:600 13px/1 var(--sans);color:var(--faint);transition:color .18s}
.ordp .dt:hover{color:var(--dim)}
.ordp .dt.on{color:var(--ink)}
.ordp .dt.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2.5px;
  border-radius:3px;background:linear-gradient(90deg,var(--cy),#3FB4D2)}
.ordp .dt svg{width:14px;height:14px}
.ordp .dfind{display:grid;grid-template-columns:1fr auto;gap:9px}
/* Резултатите · първият е едър, останалите тесни. */
.ordp .dres{display:grid;gap:7px;margin-top:13px}
.ordp .dr{display:grid;grid-template-columns:auto 1fr auto auto;gap:13px;
  align-items:center;padding:10px 13px;border-radius:10px;
  border:1px solid var(--line);background:var(--card);
  transition:border-color .18s,background .18s}
.ordp .dr:hover{border-color:var(--line-2)}
.ordp .dr .dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto;background:var(--line-2)}
.ordp .dr.free .dot{background:var(--ok)}
.ordp .dr .nm{font:600 13.5px/1 var(--mono)}
.ordp .dr .nm em{font-style:normal;color:var(--faint);font-weight:500}
.ordp .dr.busy .nm{color:var(--faint);text-decoration:line-through}
.ordp .dr .pr{font:700 12.5px/1 var(--mono);white-space:nowrap}
.ordp .dr.busy .pr{color:var(--faint)}
.ordp .dr .take{padding:6px 13px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line-2);background:var(--card);
  font:600 11px/1 var(--sans);color:var(--dim);white-space:nowrap;
  transition:background .16s,border-color .16s,color .16s}
.ordp .dr .take:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.ordp .dr.busy .take{opacity:.4;cursor:default}
/* Избраният · по-едър и в зелено. */
.ordp .dr.on{grid-template-columns:auto 1fr auto auto;padding:14px 16px;
  border-color:var(--ok);
  background:linear-gradient(104deg,var(--ok-bg),rgba(231,246,239,.3));
  box-shadow:inset 0 0 0 1px var(--ok)}
.ordp .dr.on .dot{width:20px;height:20px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(140deg,#2EC48E,#12855C)}
.ordp .dr.on .dot svg{width:11px;height:11px}
.ordp .dr.on .nm{font-size:15px;color:#0C6B4A}
.ordp .dr.on .pr{font-size:14px;color:#0C6B4A}
.ordp .dr.on .take{background:linear-gradient(140deg,#2EC48E,#12855C);
             border-color:transparent;color:#fff}
/* ═══════════════════════════════════════════════════════════
   НАДГРАЖДАНЕ · лента, не карта
   ═══════════════════════════════════════════════════════════ */
/*
 * ═══ ЗАЩО ТУК ═══
 *
 * На витрината човек сравнява планове; тук вече е приел цената и
 * разликата от няколко евро му изглежда малка.
 *
 * Лента, не карта · предложението не бива да тежи колкото стъпка.
 */
.ordp .up{position:relative;overflow:hidden;
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  padding:14px 18px;border-radius:13px;
  background:linear-gradient(110deg,#F1ECFD,#F8F5FE 56%,#EFF7FB);
  border:1px solid #DED4F4}
.ordp .up::after{content:"";position:absolute;top:-56px;right:12%;
  width:190px;height:160px;border-radius:50%;
  background:radial-gradient(circle,rgba(109,75,199,.26),transparent 66%);
  filter:blur(30px);pointer-events:none}
.ordp .up > *{position:relative;z-index:1}
.ordp .up-ic{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;
  flex:0 0 auto;color:#fff;
  background:linear-gradient(140deg,#9077E6,#6D4BC7);
  box-shadow:0 5px 14px -4px rgba(109,75,199,.55)}
.ordp .up-ic svg{width:19px;height:19px}
.ordp .up-t b{display:block;font:700 13.5px/1.25 var(--sans)}
.ordp .up-t b strong{color:var(--vi)}
.ordp .up-t p{margin:4px 0 0;font-size:11.5px;line-height:1.45;color:var(--dim)}
.ordp .up-a{display:flex;align-items:center;gap:12px;white-space:nowrap}
.ordp .up-a .d{font:800 1rem/1 var(--mono);letter-spacing:-.035em;color:var(--vi)}
.ordp .up-a .d span{font:600 10px/1 var(--sans);color:var(--dim)}
.ordp .up-a button{padding:9px 16px;border-radius:9px;border:0;cursor:pointer;
  background:linear-gradient(140deg,#9077E6,#6D4BC7);color:#fff;
  font:700 12px/1 var(--sans);
  transition:box-shadow .2s,transform .16s}
.ordp .up-a button:hover{box-shadow:0 7px 18px -5px rgba(109,75,199,.6);
                   transform:translateY(-1px)}
/* ═══════════════════════════════════════════════════════════
   РЕСУРСИТЕ · поле с бърз избор отстрани
   ═══════════════════════════════════════════════════════════ */
.ordp .rg{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.ordp .rr{padding:13px 15px;border-radius:12px;
    background:var(--canvas);border:1px solid var(--line)}
.ordp .rr.up2{border-color:#A8D6E5;
        background:linear-gradient(120deg,var(--cy-bg),rgba(228,243,248,.4))}
.ordp .rr-h{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.ordp .rr-h i{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;
  flex:0 0 auto;background:var(--card);color:var(--dim);
  box-shadow:0 1px 2px rgba(14,24,40,.07)}
.ordp .rr.up2 .rr-h i{color:var(--cy)}
.ordp .rr-h i svg{width:14px;height:14px}
.ordp .rr-h b{font:700 12.5px/1.2 var(--sans)}
.ordp .rr-h .inc{margin-left:auto;font:500 10.5px/1 var(--sans);color:var(--faint)}
.ordp .rr-in{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.ordp .rf{display:flex;align-items:center;border-radius:9px;overflow:hidden;
  border:1px solid var(--line-2);background:var(--card)}
.ordp .rf:focus-within{border-color:var(--cy);box-shadow:0 0 0 3px var(--cy-bg)}
.ordp .rf input{flex:1;min-width:0;width:100%;height:38px;padding:0 12px;border:0;
  background:none;font:800 14px/1 var(--mono);color:var(--ink);
  -moz-appearance:textfield}
.ordp .rf input:focus{outline:none}
.ordp .rf input::-webkit-outer-spin-button, .ordp .rf input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ordp .rr.up2 .rf input{color:var(--cy)}
.ordp .rf .ed{padding:0 11px;height:38px;display:grid;place-items:center;
  background:var(--canvas);border-left:1px solid var(--line);
  font:700 11px/1 var(--sans);color:var(--faint)}
/* Бързите стойности · за тези, които не искат да пишат. */
.ordp .rq{display:flex;gap:5px}
.ordp .rq button{padding:0 9px;height:38px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line-2);background:var(--card);
  font:700 11px/1 var(--mono);color:var(--dim);
  transition:background .16s,border-color .16s,color .16s}
.ordp .rq button:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.ordp .rq button.on{background:var(--cy);border-color:var(--cy);color:#fff}
.ordp .rr-f{margin-top:8px;font-size:10.5px;color:var(--faint)}
.ordp .rr-f b{font:700 10.5px/1 var(--mono);color:var(--cy)}
/* ═══════════════════════════════════════════════════════════
   ДОБАВКИТЕ · редове с превключвател
   ═══════════════════════════════════════════════════════════ */
.ordp .sw{position:relative;width:38px;height:22px;border-radius:99px;cursor:pointer;
  background:var(--line-2);flex:0 0 auto;transition:background .2s}
.ordp .sw.on{background:linear-gradient(140deg,#2EC48E,#12855C)}
.ordp .sw::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;
  border-radius:50%;background:#fff;transition:transform .2s;
  box-shadow:0 1px 3px rgba(14,24,40,.28)}
.ordp .sw.on::after{transform:translateX(16px)}
.ordp .ad{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:11px;
  cursor:pointer;border:1px solid transparent;
  transition:background .18s,border-color .18s}
.ordp .ad:hover{background:var(--canvas)}
.ordp .ad.on{background:linear-gradient(104deg,var(--ok-bg),rgba(231,246,239,.3));
       border-color:#BFE5D4}
.ordp .ad .tx{flex:1;min-width:0}
.ordp .ad .tx b{display:block;font:600 13px/1.25 var(--sans)}
.ordp .ad.on .tx b{color:#0C6B4A}
.ordp .ad .tx span{display:block;margin-top:3px;font-size:11px;line-height:1.4;
             color:var(--faint)}
.ordp .ad .p{text-align:right;white-space:nowrap;font:700 12.5px/1 var(--mono)}
.ordp .ad .p.free{color:var(--ok)}
.ordp .ad .p span{display:block;margin-top:3px;font:400 10px/1 var(--sans);color:var(--faint)}
.ordp .ad .hot{display:inline-block;margin-left:7px;padding:2px 7px;border-radius:4px;
  vertical-align:1px;
  background:linear-gradient(120deg,#FDE9C8,#FBD9A0);
  font:800 8.5px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:#7A4A05}
/* ═══════════════════════════════════════════════════════════
   ДОПЪЛНЕНИЯТА · хоризонтални плочки
   ═══════════════════════════════════════════════════════════ */
.ordp .cross{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}
.ordp .cx{position:relative;overflow:hidden;
  padding:15px 16px;border-radius:13px;cursor:pointer;
  border:1px solid var(--line);background:var(--card);
  transition:border-color .2s,box-shadow .2s,transform .18s}
.ordp .cx:hover{transform:translateY(-3px);box-shadow:0 12px 26px -14px rgba(14,24,40,.35)}
.ordp .cx.c-cy{background:linear-gradient(132deg,#fff 40%,#F1FAFD)}
.ordp .cx.c-vi{background:linear-gradient(132deg,#fff 40%,#F7F4FE)}
.ordp .cx.c-or{background:linear-gradient(132deg,#fff 40%,#FDF7F1)}
.ordp .cx.on{border-color:var(--ok);
  background:linear-gradient(132deg,#fff 40%,var(--ok-bg));
  box-shadow:inset 0 0 0 1px var(--ok)}
.ordp .cx-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.ordp .cx-ic{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;
  flex:0 0 auto;color:#fff}
.ordp .c-cy .cx-ic{background:linear-gradient(140deg,#3FB4D2,#0B84A5)}
.ordp .c-vi .cx-ic{background:linear-gradient(140deg,#9077E6,#6D4BC7)}
.ordp .c-or .cx-ic{background:linear-gradient(140deg,#E08A3C,#C25E12)}
.ordp .cx-ic svg{width:15px;height:15px}
.ordp .cx-sw{margin-left:auto}
.ordp .cx b{display:block;font:700 12.5px/1.2 var(--sans);margin-bottom:5px}
.ordp .cx p{margin:0 0 11px;font-size:11px;line-height:1.45;color:var(--dim)}
.ordp .cx-p{display:flex;align-items:baseline;gap:6px}
.ordp .cx-p b{font:800 .98rem/1 var(--mono);letter-spacing:-.03em;margin:0}
.ordp .c-cy .cx-p b{color:var(--cy)}
.ordp .c-vi .cx-p b{color:var(--vi)}
.ordp .c-or .cx-p b{color:var(--or)}
.ordp .cx-p span{font-size:10.5px;color:var(--faint)}
.ordp .cx-p s{font-size:10.5px;color:var(--faint)}
.ordp .cx-tag{position:absolute;top:0;right:0;padding:4px 10px;border-radius:0 12px 0 9px;
  font:800 8.5px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#fff}
.ordp .c-cy .cx-tag{background:linear-gradient(120deg,#3FB4D2,#0B84A5)}
.ordp .c-vi .cx-tag{background:linear-gradient(120deg,#9077E6,#6D4BC7)}
.ordp .c-or .cx-tag{background:linear-gradient(120deg,#E08A3C,#C25E12)}
/* ═══════════════════════════════════════════════════════════
   ЗАВЪРШВАНЕ
   ═══════════════════════════════════════════════════════════ */
.ordp .hand{display:grid;grid-template-columns:1.2fr 1fr;gap:12px}
.ordp .hi{position:relative;overflow:hidden;
  display:flex;align-items:center;gap:14px;
  padding:17px 18px;border-radius:13px;text-decoration:none;
  border:1px solid var(--line);background:var(--card);
  transition:border-color .2s,box-shadow .2s,transform .18s}
.ordp .hi:hover{transform:translateY(-2px);box-shadow:0 12px 28px -14px rgba(14,24,40,.35)}
.ordp .hi i{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;
  flex:0 0 auto;background:var(--canvas);color:var(--dim)}
.ordp .hi i svg{width:18px;height:18px}
.ordp .hi .hi-t{flex:1;min-width:0}
.ordp .hi b{display:block;font:700 14px/1.2 var(--sans);color:var(--ink)}
.ordp .hi p{margin:4px 0 0;font-size:11.5px;line-height:1.45;color:var(--faint)}
.ordp .hi .ar{color:var(--faint);transition:transform .22s}
.ordp .hi:hover .ar{transform:translateX(4px)}
.ordp .hi .ar svg{width:16px;height:16px}
.ordp .hi.main{border-color:transparent;
  background:linear-gradient(120deg,#0F1B2E,#1A2B47 52%,#123049)}
.ordp .hi.main::after{content:"";position:absolute;top:-60px;right:10%;
  width:190px;height:160px;border-radius:50%;
  background:radial-gradient(circle,rgba(11,132,165,.48),transparent 66%);
  filter:blur(30px);pointer-events:none}
.ordp .hi.main > *{position:relative;z-index:1}
.ordp .hi.main i{background:rgba(255,255,255,.12);color:#7FD4EC}
.ordp .hi.main b{color:#fff}
.ordp .hi.main p{color:rgba(255,255,255,.56)}
.ordp .hi.main .ar{color:#7FD4EC}
/* ═══════════════════════════════════════════════════════════
   СМЕТКАТА
   ═══════════════════════════════════════════════════════════ */
.ordp .side{position:sticky;top:18px;display:grid;gap:11px}
.ordp .sum{border-radius:15px;background:var(--card);border:1px solid var(--line);
  box-shadow:0 2px 5px rgba(14,24,40,.06),0 18px 40px -22px rgba(14,24,40,.34);
  overflow:hidden}
.ordp .sum-h{display:flex;align-items:center;padding:13px 17px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(118deg,var(--canvas),rgba(243,246,250,.4))}
.ordp .sum-h b{font:800 10.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;
         color:var(--faint)}
.ordp .sum-h span{margin-left:auto;font-size:10.5px;color:var(--faint)}
.ordp .sum-b{padding:15px 17px}
.ordp .sr{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
    padding:5px 0;font-size:12.5px;color:var(--dim)}
.ordp .sr b{font:600 12.5px/1 var(--mono);color:var(--ink);white-space:nowrap}
.ordp .sr.sm{font-size:11px;color:var(--faint);padding:3px 0}
.ordp .sr.sm b{font-size:11px;color:var(--dim)}
.ordp .sr.save, .ordp .sr.save b{color:var(--ok)}
.ordp .sr s{color:var(--faint)}
.ordp .sgr{margin:11px 0;height:1px;background:var(--line)}
.ordp .sttl{display:block;margin:11px 0 5px;font:800 8.5px/1 var(--sans);
  letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.ordp .stot{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
      margin-bottom:5px}
.ordp .stot span{font:700 13px/1.2 var(--sans)}
.ordp .stot b{font:800 1.72rem/1 var(--mono);letter-spacing:-.055em;
  background:linear-gradient(140deg,#1C2A42,#0E1828);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.ordp .svat{display:block;margin-bottom:13px;font-size:10.5px;line-height:1.45;
      color:var(--faint)}
/* Спестеното · бутa към по-дълъг период. */
.ordp .saved{display:flex;align-items:center;gap:9px;margin-bottom:12px;
  padding:10px 12px;border-radius:10px;
  background:linear-gradient(108deg,var(--ok-bg),rgba(231,246,239,.35));
  border:1px solid #BFE5D4;font-size:11.5px;color:#0C6B4A}
.ordp .saved svg{width:15px;height:15px;flex:0 0 auto;color:var(--ok)}
.ordp .saved b{font-weight:800}
.ordp .sum-b .btn{width:100%}
.ordp .trust{display:grid;gap:8px;margin-top:13px;padding-top:13px;
       border-top:1px solid var(--line)}
.ordp .trust div{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--dim)}
.ordp .trust svg{width:13px;height:13px;color:var(--ok);flex:0 0 auto}
.ordp .trust b{color:var(--ink);font-weight:700}
@media (max-width:1020px){
  .ordp .g{grid-template-columns:1fr}
  .ordp .side{position:static}
  .ordp .cross{grid-template-columns:1fr}
}
@media (max-width:760px){
  .ordp .hero-r{gap:12px}
  .ordp .cyc{margin-left:0;width:100%;overflow-x:auto}
  .ordp .rg, .ordp .two, .ordp .three, .ordp .hand{grid-template-columns:1fr}
  .ordp .dfind{grid-template-columns:1fr}
  .ordp .dtab{gap:14px;overflow-x:auto}
  .ordp .dr{grid-template-columns:auto 1fr;row-gap:8px}
  .ordp .dr .pr, .ordp .dr .take{grid-column:2}
  .ordp .up{grid-template-columns:auto 1fr;row-gap:12px}
  .ordp .up-a{grid-column:2}
}


/*
 * ═══ ОБВИВКАТА ═══
 *
 * Макетът рисуваше фона на „body“; тук е на самия раздел, за да не
 * пипне другите страници.
 *
 * Без „overflow“ · то реже лепенето на сметката.
 */
.ordp{
  padding:22px clamp(16px,2.6vw,32px) 60px;
  background:var(--canvas);
}
.ordp .in{max-width:1220px;margin:0 auto}

/*
 * ═══ ПОПРАВКИ ПО МАКЕТА ═══
 *
 * Страницата е разпъната докрай; сметката се лепи под менюто.
 */
.ordp .in{max-width:1680px}

.ordp .g{
  grid-template-columns:1fr minmax(300px,340px);
  align-items:start;
}

.ordp .side{
  position:-webkit-sticky;
  position:sticky;
  top:calc(var(--hd-h, 82px) + 16px);
  align-self:start;
}

@media (max-width:1020px){
  .ordp .side{position:static}
}

/*
 * ЛЕПЕНЕТО ИСКА ЧИСТИ „HTML“ И „BODY“.
 *
 * Всеки родител с „overflow“, различен от „visible“, прави своя
 * превъртаща се кутия · лепенето се мери спрямо нея, не спрямо
 * екрана, и затова не се вижда.
 */
html,
body{
  overflow:visible !important;
}

/*
 * ДОБАВКИТЕ · по две на ред, всяка в един ред.
 *
 * По-общо правило за етикети ги изправяше в колона и центрираше ·
 * тук редът се връща както е в макета.
 */
.ordp .c-b > .ad{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  text-align:left !important;
  gap:13px !important;
  margin:0 !important;
}

/* Двете колони · обвивка около редовете. */
.ordp .adds{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.ordp .adds > .ad{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  text-align:left !important;
  gap:13px !important;
  margin:0 !important;
  border:1px solid var(--line);
}
.ordp .adds > .ad.on{border-color:#BFE5D4}

/* Вътрешността · нищо не се центрира. */
.ordp .ad > .sw{flex:0 0 auto;align-self:center}
.ordp .ad > .tx{flex:1 1 auto;min-width:0;text-align:left}
.ordp .ad > .p{flex:0 0 auto;text-align:right;white-space:nowrap}

/* Етикетът стои до името, не под него. */
.ordp .ad .hot{
  display:inline-block !important;
  width:auto !important;
  vertical-align:middle;
}

@media (max-width:820px){
  .ordp .adds{grid-template-columns:1fr}
}

/*
 * ДВАТА ПЪТЯ НАВЪН.
 *
 * Класът „t“ се биеше с друг в сайта и рисуваше бяла кутия · тук
 * е с отделно име.
 */
.ordp .hi{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  padding:17px 18px !important;
  text-align:left !important;
  width:100%;
  cursor:pointer;
}

.ordp .hi > i{flex:0 0 auto}
.ordp .hi .hi-t{
  flex:1 1 auto;
  min-width:0;
  background:none !important;
  border:0 !important;
  padding:0 !important;
  text-align:left;
}
.ordp .hi .hi-t b{display:block;font:700 14px/1.2 var(--sans);color:var(--ink)}
.ordp .hi .hi-t p{margin:4px 0 0;font-size:11.5px;line-height:1.45;color:var(--faint)}

.ordp .hi.main .hi-t b{color:#fff}
.ordp .hi.main .hi-t p{color:rgba(255,255,255,.58)}

.ordp .hi > .ar{flex:0 0 auto}

/*
 * ═══ СМЕТКАТА В НОВАТА РАМКА ═══
 *
 * „c_order_aside“ рисува своя кутия · тук тя получава вида на
 * останалите карти, за да не изглежда като чужда.
 */
.ordp .ord-aside{
  display:block;
  width:100%;
  min-width:0;
}

.ordp .oa-box{
  border-radius:15px;
  background:var(--card);
  border:1px solid var(--line);
  box-shadow:0 2px 5px rgba(14,24,40,.06),0 18px 40px -22px rgba(14,24,40,.34);
  padding:15px 17px;
  min-width:0;
}

.ordp .oa-box > h3{
  margin:0 0 13px;
  font:800 10.5px/1 var(--sans);
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--faint);
}

/* Редовете · една колона, не разливане настрани. */
.ordp .oa-lines{display:grid;gap:0;min-width:0}

.ordp .oa-line{
  display:grid;
  grid-template-columns:30px 1fr auto;
  gap:11px;
  align-items:center;
  padding:9px 0;
  min-width:0;
}
.ordp .oa-line + .oa-line{border-top:1px solid var(--line)}

.ordp .oa-ico{
  width:30px;height:30px;border-radius:9px;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--canvas);color:var(--dim);
}
.ordp .oa-ico svg{width:15px;height:15px}

.ordp .oa-body{min-width:0}
.ordp .oa-body b{
  display:block;
  font:600 12.5px/1.25 var(--sans);
  color:var(--ink);
  overflow-wrap:anywhere;
}
.ordp .oa-body > span{
  display:block;margin-top:2px;
  font-size:11px;color:var(--faint);
}

.ordp .oa-p{
  font:700 12.5px/1 var(--mono);
  color:var(--ink);
  white-space:nowrap;
  text-align:right;
}

/* Сумата долу · на два реда, не един дълъг. */
.ordp .oa-sum{
  display:grid;
  gap:7px;
  padding-top:13px;
  margin-top:13px;
  border-top:1px solid var(--line);
  min-width:0;
}

.ordp .oa-sum > div,
.ordp .oa-sum > p{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  margin:0;
  font-size:12.5px;
  color:var(--dim);
  min-width:0;
}

.ordp .oa-sum b,
.ordp .oa-sum strong{
  font-family:var(--mono);
  color:var(--ink);
  white-space:nowrap;
}

.ordp .oa-edit{
  display:block;
  margin-top:11px;
  text-align:center;
  font-size:11.5px;
  color:var(--faint);
  text-decoration:none;
}
.ordp .oa-edit:hover{color:var(--cy);text-decoration:underline}

/*
 * ═══ ПРЕВКЛЮЧВАТЕЛЯТ Е КОПЧЕ ═══
 *
 * На страницата с допълненията той е „button“, а не „span“ ·
 * браузърът му слага своя рамка и отстояние и го разтяга.
 */
.ordp .ad .sw,
.ordp .sw{
  appearance:none;
  -webkit-appearance:none;
  width:38px !important;
  min-width:38px;
  height:22px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:99px !important;
  flex:0 0 38px !important;
  box-shadow:none !important;
  font-size:0;
}

/*
 * ═══ ЧИСЛАТА В СМЕТКАТА ═══
 *
 * Общият стил на сайта ги рисува едри за цяла страница · в тясната
 * колона те изглеждат като грешка.
 */
.ordp .oa-sum{
  display:grid !important;
  gap:8px !important;
  grid-template-columns:1fr !important;
}

.ordp .oa-sum > *{
  display:flex !important;
  align-items:baseline !important;
  justify-content:space-between !important;
  gap:10px !important;
  margin:0 !important;
  padding:0 !important;
  font:400 12.5px/1.3 var(--sans) !important;
  color:var(--dim) !important;
  border:0 !important;
}

.ordp .oa-sum b,
.ordp .oa-sum strong,
.ordp .oa-sum span{
  font:600 12.5px/1 var(--mono) !important;
  color:var(--ink) !important;
  white-space:nowrap;
}

/* Последният ред е общата сума · само той е едър. */
.ordp .oa-sum > *:last-of-type{
  padding-top:9px !important;
  margin-top:2px !important;
  border-top:1px solid var(--line) !important;
  font-weight:700 !important;
  color:var(--ink) !important;
}
.ordp .oa-sum > *:last-of-type b,
.ordp .oa-sum > *:last-of-type strong,
.ordp .oa-sum > *:last-of-type span{
  font:800 1.3rem/1 var(--mono) !important;
  letter-spacing:-.04em;
  color:var(--ink) !important;
}

/* Планът горе · на един ред, цената вдясно. */
.ordp .oa-line{
  grid-template-columns:30px 1fr auto !important;
  align-items:center !important;
}
.ordp .oa-p{
  font:700 12.5px/1 var(--mono) !important;
  color:var(--ink) !important;
}

/*
 * МИНАТА СТЪПКА НАПРЕД.
 *
 * Човек, който се е върнал да поправи нещо, трябва да вижда, че
 * може да скочи обратно · иначе минава целия път отново.
 */
.steps .st.is-open .st-n{
  background:var(--paper, #fff);
  border:1.5px solid #C9D3E0;
  color:#5C6B80;
}
.steps .st.is-open .st-l{color:#5C6B80}
.steps .st.is-open .st-back:hover .st-n{border-color:#0B84A5;color:#0B84A5}
.steps .st.is-open .st-back:hover .st-l{color:#101A2B}

/*
 * ЦЕНАТА В ТЪМНАТА ЛЕНТА.
 *
 * На следващите стъпки периодът вече е избран · показва се като
 * надпис, не като кутия за избор.
 */
.ordp .hero-p{
  margin-left:auto;
  text-align:right;
  white-space:nowrap;
}
.ordp .hero-p b{
  display:block;
  font:800 1.5rem/1 var(--mono);
  letter-spacing:-.05em;
  background:linear-gradient(140deg,#B4E845,#7cbf00 48%,#7FB812);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.ordp .hero-p span{
  display:block;
  margin-top:4px;
  font-size:11.5px;
  color:rgba(255,255,255,.55);
}

/*
 * ═══ ВРЪЗКАТА КЪМ ОСТАНАЛИТЕ УСЛУГИ ═══
 *
 * Три отпред стигат · останалите се разгъват с едно натискане,
 * без да разсейват този, който не ги търси.
 */
.ordp .more-b{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  margin-top:10px;
  padding:11px;
  border-radius:10px;
  cursor:pointer;
  background:var(--canvas);
  border:1px dashed var(--line-2);
  font:600 12.5px/1 var(--sans);
  color:var(--dim);
  transition:background .18s,border-color .18s,color .18s;
}
.ordp .more-b:hover{
  background:var(--card);
  border-color:var(--cy);
  color:var(--cy);
}
.ordp .more-b svg{
  width:15px;
  height:15px;
  transition:transform .24s;
}
.ordp .more-b.open svg{transform:rotate(180deg)}

.ordp .adds.more{margin-top:8px}

/*
 * ═══ ПЕРИОДИТЕ В ТЪМНАТА ЛЕНТА ═══
 *
 * Голямата цифра е на месец за всички · под нея стоят зачертаната
 * редовна цена и какво се плаща наведнъж.
 */
.ordp .cy{
  min-width:104px;
  padding:9px 14px 10px;
}

.ordp .cy .p{
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:2px;
}
.ordp .cy .p i{
  font-style:normal;
  font:600 9.5px/1 var(--sans);
  color:rgba(255,255,255,.5);
}
.ordp .cy.on .p i{color:var(--faint)}

/* Зачертаната редовна цена. */
.ordp .cy .was{
  display:block;
  margin-top:3px;
  font:500 9.5px/1 var(--mono);
  color:rgba(255,255,255,.38);
  min-height:10px;
}
.ordp .cy.on .was{color:var(--faint)}

/* Какво се плаща наведнъж. */
.ordp .cy .once{
  display:block;
  margin-top:4px;
  font:500 9px/1.3 var(--sans);
  color:rgba(255,255,255,.42);
  white-space:nowrap;
}
.ordp .cy.on .once{color:var(--dim)}

/* Името на периода · отделен клас, за да не се бие с другите. */
.ordp .cy .cy-t{
  display:block;
  font:600 11px/1 var(--sans);
  color:rgba(255,255,255,.6);
}
.ordp .cy.on .cy-t{color:var(--dim)}

/*
 * УСЛУГИТЕ СЕ ПЪЛНЯТ ПО РЕДОВЕ.
 *
 * Скритите стоят в своя мрежа · без това двете мрежи се разминават
 * и лявата колона събира повече.
 */
.ordp .adds{grid-auto-flow:row}
.ordp .adds.more{grid-template-columns:1fr 1fr}

@media (max-width:820px){
  .ordp .adds.more{grid-template-columns:1fr}
}

/*
 * СКРИТИТЕ УСЛУГИ СА В СЪЩАТА МРЕЖА.
 *
 * Обвивката се прави прозрачна · децата ѝ стават направо клетки и
 * продължават реда, вместо да почват нов.
 */
.ordp .more-w{display:contents}
.ordp .more-w[hidden]{display:none}

/*
 * СКРИТИТЕ УСЛУГИ ИЗГЛЕЖДАТ КАТО ВИДИМИТЕ.
 *
 * „display:contents“ на обвивката прави децата ѝ клетки, но
 * наследените правила за реда им се губят · тук се връщат изрично.
 */
.ordp .more-w > .ad{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  text-align:left !important;
  gap:13px !important;
  margin:0 !important;
  padding:12px 14px !important;
  border-radius:11px !important;
  border:1px solid var(--line) !important;
  background:var(--card);
}
.ordp .more-w > .ad.on{
  border-color:#BFE5D4 !important;
  background:linear-gradient(104deg,var(--ok-bg),rgba(231,246,239,.3)) !important;
}
.ordp .more-w > .ad:hover{background:var(--canvas)}
.ordp .more-w > .ad.on:hover{
  background:linear-gradient(104deg,var(--ok-bg),rgba(231,246,239,.3)) !important;
}

.ordp .more-w > .ad > .sw{flex:0 0 38px;align-self:center}
.ordp .more-w > .ad > .tx{flex:1 1 auto;min-width:0;text-align:left}
.ordp .more-w > .ad > .p{flex:0 0 auto;text-align:right;white-space:nowrap}

/*
 * ═══ БЕЛЕЖКАТА ЗА ПАРОЛАТА ═══
 *
 * Човек трябва да разбере, че тя не се пази · иначе разчита да му
 * я покажем после.
 */
.ordp .pw-note{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin-top:14px;
  padding:13px 15px;
  border-radius:11px;
  background:linear-gradient(108deg,#FDF5E4,rgba(253,245,228,.4));
  border:1px solid #EFD9A8;
  font-size:11.5px;
  line-height:1.5;
  color:#7A5510;
}
.ordp .pw-note svg{
  width:15px;
  height:15px;
  flex:0 0 auto;
  margin-top:1px;
  color:#9A6512;
}
.ordp .pw-note b{font-weight:700;color:#5E410C}

/* Подсказките под полетата за парола. */
.ordp [data-pw-sila].ok,
.ordp [data-pw-ravni].ok{color:var(--ok);font-weight:600}
.ordp [data-pw-sila].bad,
.ordp [data-pw-ravni].bad{color:var(--rose);font-weight:600}

/*
 * ═══ ЗВЕЗДАТА ЗА ЗАДЪЛЖИТЕЛНО ═══
 *
 * Човек трябва да вижда кое ще го спре, преди да е стигнал долу и
 * да е натиснал копчето.
 */
.ordp .req{
  font-style:normal;
  margin-left:3px;
  color:var(--rose);
  font-weight:700;
}

/* Празното задължително поле се обажда. */
.ordp .ctrl:required:invalid:not(:placeholder-shown){
  border-color:var(--rose);
}
.ordp .ctrl:required:invalid:focus{
  box-shadow:0 0 0 3px rgba(192,51,92,.12);
}

/*
 * ВРЪЗКАТА ЗА ИЗЧИСТВАНЕ.
 *
 * Дребна и сива · не съперничи на главното действие, но се намира,
 * когато потрябва.
 */
.ordp .sum-clr{
  display:block;
  margin-top:11px;
  text-align:center;
  font-size:11.5px;
  color:var(--faint);
  text-decoration:none;
}
.ordp .sum-clr:hover{color:var(--rose);text-decoration:underline}

/*
 * КРЪСТЧЕТО ЗА МАХАНЕ.
 *
 * Появява се при посочване на реда · иначе сметката изглежда като
 * поле за редактиране, не като сметка.
 */
.ordp .sr{position:relative;padding-right:18px}

.ordp .sr-x{
  position:absolute;
  right:-2px;
  top:50%;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  width:17px;
  height:17px;
  border-radius:50%;
  font:400 14px/1 var(--sans);
  color:var(--faint);
  text-decoration:none;
  opacity:0;
  transition:opacity .16s,background .16s,color .16s;
}
.ordp .sr:hover .sr-x{opacity:1}
.ordp .sr-x:hover{background:var(--rose);color:#fff}

/* На допир винаги се вижда · няма посочване. */
@media (hover:none){
  .ordp .sr-x{opacity:.5}
}

/*
 * КРЪСТЧЕТАТА СА ВИНАГИ ВИДИМИ.
 *
 * Скрити до посочване, те не се намират · човек не знае, че изобщо
 * може да махне нещо.
 */
.ordp .sr-x{opacity:.45 !important}
.ordp .sr:hover .sr-x{opacity:1 !important}
.ordp .sr-x:hover{background:var(--rose) !important;color:#fff !important;opacity:1 !important}

/*
 * ═══════════════════════════════════════════════════════════
 * РЕДОВЕТЕ В СМЕТКАТА · име, цена, кръстче
 * ═══════════════════════════════════════════════════════════
 *
 * Дотук кръстчето висеше над реда и се губеше · сега има своя
 * колона и винаги се вижда.
 */
.ordp .sum-b .sr{
  display:grid !important;
  grid-template-columns:1fr auto 22px !important;
  gap:8px !important;
  align-items:center !important;
  padding:6px 0 !important;
  position:static !important;
}

.ordp .sum-b .sr .sr-n{
  min-width:0;
  overflow-wrap:anywhere;
}

.ordp .sum-b .sr > b{
  text-align:right;
  white-space:nowrap;
}

/* Кръстчето · винаги видимо, червено при посочване. */
.ordp .sum-b .sr-x{
  position:static !important;
  transform:none !important;
  display:grid !important;
  place-items:center !important;
  width:22px !important;
  height:22px !important;
  border-radius:7px !important;
  opacity:1 !important;
  color:var(--line-2);
  background:transparent;
  text-decoration:none;
  transition:background .16s,color .16s;
}
.ordp .sum-b .sr-x svg{width:12px;height:12px}

.ordp .sum-b .sr-x:hover{
  background:#FDF3F6 !important;
  color:var(--rose) !important;
}

/* Редовете без кръстче пазят колоната · иначе цените подскачат. */
.ordp .sum-b .sttl{padding-right:30px}

/*
 * ═══════════════════════════════════════════════════════════
 * КАРТАТА С ПОРЪЧАНОТО
 * ═══════════════════════════════════════════════════════════
 *
 * Сметката отдясно казва КОЛКО · тази карта казва КАКВО.
 */
.ordp .op-r{
  display:grid;
  grid-template-columns:32px 1fr auto 26px;
  gap:12px;
  align-items:center;
  padding:11px 0;
  border-bottom:1px solid var(--line);
}
.ordp .op-r:first-child{padding-top:0}
.ordp .op-r:last-child{border-bottom:0;padding-bottom:0}

.ordp .op-i{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:9px;
  background:var(--canvas);
  color:var(--dim);
}
.ordp .op-i svg{width:16px;height:16px}

/* Всеки вид със своя тон. */
.ordp .op-plan .op-i{background:var(--cy-bg);color:var(--cy)}
.ordp .op-domain .op-i{background:var(--vi-bg);color:var(--vi)}
.ordp .op-addon .op-i{background:var(--ok-bg);color:var(--ok)}
.ordp .op-resource .op-i{background:var(--or-bg);color:var(--or)}

.ordp .op-t{min-width:0}
.ordp .op-t b{
  display:block;
  font:600 13.5px/1.25 var(--sans);
  color:var(--ink);
  overflow-wrap:anywhere;
}
.ordp .op-t span{
  display:block;
  margin-top:2px;
  font:600 10px/1 var(--sans);
  letter-spacing:.07em;
  text-transform:uppercase;
  color:var(--faint);
}

.ordp .op-p{
  font:700 13px/1 var(--mono);
  color:var(--ink);
  white-space:nowrap;
}

.ordp .op-x{
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:8px;
  color:var(--line-2);
  text-decoration:none;
  transition:background .16s,color .16s;
}
.ordp .op-x svg{width:13px;height:13px}
.ordp .op-x:hover{background:#FDF3F6;color:var(--rose)}

@media (max-width:600px){
  .ordp .op-r{grid-template-columns:32px 1fr 26px;row-gap:6px}
  .ordp .op-p{grid-column:2;text-align:left}
}

/*
 * ═══════════════════════════════════════════════════════════
 * НАЧИНИТЕ НА ПЛАЩАНЕ
 * ═══════════════════════════════════════════════════════════
 */
.ordp .payg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}

.ordp .pi{
  display:flex;
  align-items:center;
  gap:13px;
  padding:13px 15px;
  border-radius:11px;
  cursor:pointer;
  border:1px solid var(--line);
  background:var(--card);
  transition:border-color .18s,background .18s;
}
.ordp .pi:hover{border-color:var(--line-2)}
.ordp .pi.on{
  border-color:var(--cy);
  background:linear-gradient(112deg,#fff,var(--cy-bg));
  box-shadow:inset 0 0 0 1px var(--cy);
}

.ordp .pi .dot{
  width:17px;height:17px;border-radius:50%;flex:0 0 auto;position:relative;
  border:1.5px solid var(--line-2);background:var(--card);
}
.ordp .pi.on .dot{border-color:var(--cy)}
.ordp .pi.on .dot::after{
  content:'';position:absolute;inset:3.5px;border-radius:50%;background:var(--cy);
}

.ordp .pi-t{flex:1;min-width:0}
.ordp .pi-t b{display:block;font:600 13px/1.2 var(--sans);color:var(--ink)}
.ordp .pi.on .pi-t b{color:var(--cy)}
.ordp .pi-t span{
  display:block;margin-top:3px;
  font-size:11px;line-height:1.4;color:var(--faint);
}

.ordp .pi .lg{margin-left:auto;display:flex;gap:5px;flex:0 0 auto}
.ordp .pi .lg span{
  display:grid;place-items:center;height:23px;padding:0 9px;border-radius:5px;
  background:var(--canvas);border:1px solid var(--line);
  font:700 9px/1 var(--sans);color:var(--dim);
}

/*
 * ═══════════════════════════════════════════════════════════
 * ПРЕГЛЕДЪТ
 * ═══════════════════════════════════════════════════════════
 */
.ordp .rv{display:grid;gap:0}

.ordp .rv-r{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
  padding:10px 0;
  border-bottom:1px solid var(--line);
  font-size:13px;
  color:var(--dim);
}
.ordp .rv-r:first-child{padding-top:0}
.ordp .rv-r:last-child{border-bottom:0;padding-bottom:0}

.ordp .rv-r b{
  font:600 13px/1 var(--mono);
  color:var(--ink);
  text-align:right;
  overflow-wrap:anywhere;
}

.ordp .rv-edit{
  display:inline-block;
  margin-top:13px;
  font-size:11.5px;
  color:var(--cy);
  text-decoration:none;
}
.ordp .rv-edit:hover{text-decoration:underline}

@media (max-width:600px){
  .ordp .pi{flex-wrap:wrap}
  .ordp .pi .lg{margin-left:30px;width:100%}
}

/*
 * ═══════════════════════════════════════════════════════════
 * КАРТАТА С ПОРЪЧАНОТО · допълнена
 * ═══════════════════════════════════════════════════════════
 */

/* Лек тон отгоре · картата не изглежда като празен лист. */
.ordp .op-c{
  background:linear-gradient(168deg,#FAFCFE 0%,var(--card) 42%);
  border-color:#D9E4F0;
}

.ordp .op-c .c-h{border-bottom:1px solid var(--line)}
.ordp .op-c .c-n{
  background:linear-gradient(140deg,#2EC48E,#12855C);
  border-color:transparent;
  color:#fff;
}

/* Периодът до името. */
.ordp .op-b{
  display:inline-block;
  margin-left:8px;
  padding:3px 8px;
  border-radius:5px;
  vertical-align:1px;
  background:var(--cy-bg);
  border:1px solid #BEDFEB;
  font:700 9px/1 var(--sans);
  letter-spacing:.07em;
  text-transform:uppercase;
  color:var(--cy);
  font-style:normal;
}

/* Подробностите · моноширинен, за да се четат числата. */
.ordp .op-s{
  display:block;
  margin-top:3px;
  font:500 11px/1.35 var(--mono);
  color:var(--faint);
}

/* Подножието. */
.ordp .op-f{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  padding:12px 20px;
  border-top:1px solid var(--line);
  background:linear-gradient(112deg,var(--canvas),rgba(243,246,250,.4));
}

.ordp .op-fn{font-size:11.5px;color:var(--faint)}

.ordp .op-ft{
  font-size:12px;
  color:var(--dim);
}
.ordp .op-ft b{
  margin-left:5px;
  font:800 1.06rem/1 var(--mono);
  letter-spacing:-.035em;
  color:var(--ink);
}

/*
 * ═══ СМЯНАТА Е ПЛАВНА ═══
 *
 * Сметката се пречертава при всяка промяна · рязката подмяна
 * изглежда като трепване и човек се чуди дали нещо не е станало.
 *
 * Кратко избледняване прави прехода видим, но спокоен.
 */
.ordp .sum,
.ordp .op-c{
  transition:opacity .18s ease;
}

.ordp .sum.mig,
.ordp .op-c.mig{
  opacity:.45;
}

/* Редовете се появяват отдолу нагоре · движението води окото. */
@keyframes ordRed{
  from{opacity:0;transform:translateY(-3px)}
  to{opacity:1;transform:none}
}

.ordp .sum-b .sr{animation:ordRed .22s ease both}

/* При хора, които не искат движение · само появяване. */
@media (prefers-reduced-motion:reduce){
  .ordp .sum-b .sr{animation:none}
  .ordp .sum,
  .ordp .op-c{transition:none}
}

/*
 * ═══ ЗАКЛЮЧЕНАТА ДОБАВКА ═══
 *
 * Вижда се, но не се щраква · човек знае, че я има, и разбира какво
 * трябва, за да я получи.
 */
.ordp .ad-lock{
  display:flex !important;
  align-items:center !important;
  gap:13px !important;
  padding:12px 14px !important;
  border-radius:11px !important;
  border:1px dashed var(--line-2) !important;
  background:var(--canvas) !important;
  cursor:not-allowed;
  opacity:.72;
}

.ordp .ad-lock .ad-l{
  display:grid;
  place-items:center;
  width:38px;
  height:22px;
  flex:0 0 38px;
  border-radius:99px;
  background:var(--line-2);
  color:var(--card);
}
.ordp .ad-lock .ad-l svg{width:11px;height:11px}

.ordp .ad-lock .tx b{color:var(--dim) !important}

.ordp .ad-why{
  display:block;
  margin-top:3px;
  font-size:10.5px;
  line-height:1.4;
  color:var(--faint);
  font-style:italic;
}

.ordp .ad-lock .p{color:var(--faint) !important;font-weight:500 !important}

/*
 * ═══════════════════════════════════════════════════════════
 * ПЛОЧКИТЕ ЗА ПЛАЩАНЕ · в един ред
 * ═══════════════════════════════════════════════════════════
 *
 * Същото по-общо правило за етикети, което изправяше добавките
 * в колона и ги центрираше, хващаше и тези плочки: кръгчето
 * отиваше горе в средата, текстът под него, значките на трети
 * ред. Тук редът се връща както е в макета.
 */
.ordp .payg > .pi{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  text-align:left !important;
  gap:13px !important;
  margin:0 !important;
  padding:13px 15px !important;
}

/* Вътрешността · нищо не се центрира. */
.ordp .payg > .pi > .dot{flex:0 0 auto;align-self:center}
.ordp .payg > .pi > .pi-t{flex:1 1 auto;min-width:0;text-align:left}
.ordp .payg > .pi > .lg{flex:0 0 auto;margin-left:auto}

@media (max-width:600px){
  .ordp .payg > .pi{flex-wrap:wrap !important}
  .ordp .payg > .pi > .lg{margin-left:30px;width:100%}
}

/* Избраната плочка · без да се чака сървърът. */
.ordp .payg > .pi:has(input:checked){
  border-color:var(--cy);
  background:linear-gradient(112deg,#fff,var(--cy-bg));
  box-shadow:inset 0 0 0 1px var(--cy);
}
.ordp .payg > .pi:has(input:checked) .dot{border-color:var(--cy)}
.ordp .payg > .pi:has(input:checked) .dot::after{
  content:'';position:absolute;inset:3.5px;border-radius:50%;background:var(--cy);
}
.ordp .payg > .pi:has(input:checked) .pi-t b{color:var(--cy)}

/* На тесен екран пак едно под друго. */
@media (max-width:860px){
  .ordp .payg{grid-template-columns:1fr}
}

/*
 * ═══════════════════════════════════════════════════════════
 * ПОЛЕТАТА ВЪВ ФОРМАТА · звездичка до етикета, равни редове
 * ═══════════════════════════════════════════════════════════
 *
 * Етикетът беше решетка и звездичката падаше на нов ред под
 * името. А полето с пояснение под себе си имаше три реда срещу
 * два при съседите · решетката ги разтягаше и полетата не
 * започваха на една височина.
 */
.ordp .f > label{
  display:block !important;
  align-items:baseline;
}
.ordp .f > label > .req{
  display:inline !important;
  width:auto !important;
  margin-left:3px;
  vertical-align:baseline;
}

/* Редовете не се разтягат · полетата започват наравно. */
.ordp .three > .f,
.ordp .two > .f,
.ordp .rg > .f{align-content:start}

/*
 * ═══════════════════════════════════════════════════════════
 * ВХОД И РЕГИСТРАЦИЯ В КОЛИЧКАТА
 * ═══════════════════════════════════════════════════════════
 *
 * Формата е истинската · стои тук, за да не изхвърля човека на
 * друг адрес точно преди плащането.
 */
.ordp .auf{display:block}

.ordp .au-kak{
  margin:0 0 14px;
  font-size:12.5px;
  line-height:1.55;
  color:var(--dim);
}

/* Копчето · същото зелено като това, което взима парите. */
.ordp .au-go{
  display:block;
  width:100%;
  margin-top:16px;
  padding:15px 20px;
  border:0;
  border-radius:11px;
  background:linear-gradient(140deg,var(--go-l),var(--go));
  color:#fff;
  font:700 14px/1 var(--sans);
  cursor:pointer;
  transition:filter .18s,opacity .18s;
}
.ordp .au-go:hover{filter:brightness(1.06)}
.ordp .au-go:disabled{opacity:.55;cursor:default}

.ordp .au-alt{
  display:inline-block;
  margin-top:12px;
  font-size:12px;
  color:var(--cy);
  text-decoration:none;
}
.ordp .au-alt:hover{text-decoration:underline}

/* Грешката · на място, без да изхвърля страницата. */
.ordp .au-err{
  margin-top:14px;
  padding:11px 14px;
  border-radius:9px;
  background:var(--rose-w,#FDECEF);
  border:1px solid var(--rose,#D6336C);
  font-size:12.5px;
  line-height:1.5;
  color:var(--rose,#D6336C);
}
.ordp .au-err[hidden]{display:none}

/* Скритата форма си остава скрита · „display“ надбиваше „hidden“. */
.ordp .auf[hidden]{display:none !important}

/* Отметките във формата за регистрация. */
.ordp .au-chk{
  display:flex;
  align-items:flex-start;
  gap:11px;
  cursor:pointer;
  font-size:12.5px;
  line-height:1.5;
  color:var(--ink);
}
.ordp .au-chk input{
  width:17px;height:17px;flex:0 0 auto;margin-top:1px;
  accent-color:var(--cy);cursor:pointer;
}
.ordp .au-chk b{display:block;font-size:13px;font-weight:700}
.ordp .au-chk small{
  display:block;margin-top:2px;
  font-size:11.5px;color:var(--faint);
}
.ordp .au-chk a{color:var(--cy)}

.ordp .au-co[hidden]{display:none !important}

/* Падащото меню да е като полетата. */
.ordp select.ctrl{
  width:100%;
  appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%237A8AA3' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 13px center;
  background-size:16px;
  padding-right:38px;
  cursor:pointer;
}

/* Една форма наведнъж · показва се само включената. */
.ordp .auf{display:none !important}
.ordp .auf.is-on{display:block !important}

/*
 * ЕДНА ФОРМА НАВЕДНЪЖ · без скрипт.
 *
 * Табовете са радиобутони · кой е отметнат решава коя форма се
 * вижда. Скриптът само дублира това.
 */
.ordp .au-box:has(input[name="au"][value="in"]:checked) .auf[data-auf="up"],
.ordp .au-box:has(input[name="au"][value="up"]:checked) .auf[data-auf="in"]{
  display:none !important;
}
.ordp .au-box:has(input[name="au"][value="in"]:checked) .auf[data-auf="in"],
.ordp .au-box:has(input[name="au"][value="up"]:checked) .auf[data-auf="up"]{
  display:block !important;
}
.ordp .au-tab .dt:has(input:checked){color:var(--cy)}

/*
 * ОТМЕТКИТЕ ВЪВ ФОРМАТА · квадратчето до текста, не над него.
 *
 * Същото по-общо правило за етикети, което изправяше добавките
 * и плочките за плащане в колона, хващаше и тях.
 */
.ordp .au-box .au-chk{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  text-align:left !important;
  gap:11px !important;
}
.ordp .au-box .au-chk > input{flex:0 0 auto;align-self:flex-start;margin-top:2px}
.ordp .au-box .au-chk > span{flex:1 1 auto;min-width:0;text-align:left}

/* Копчето на лилавата лента · същото като останалата ѝ. */
.ordp .up-a .btn{
  display:inline-grid;
  place-items:center;
  padding:9px 16px;
  border-radius:9px;
  border:0;
  background:linear-gradient(140deg,#9077E6,#6D4BC7);
  color:#fff;
  font:700 12px/1 var(--sans);
  text-decoration:none;
  transition:box-shadow .2s,transform .16s;
}
.ordp .up-a .btn:hover{
  box-shadow:0 7px 18px -5px rgba(109,75,199,.6);
  transform:translateY(-1px);
}
.ordp .up{margin-bottom:16px}

/* Периодът под цената, не залепен за нея. */
.ordp .up-a .d{display:block;text-align:right}
.ordp .up-a .d span{display:block;margin-top:4px}

/* Логата на плащанията · в същия правоъгълник като значките. */
.ordp .pi .lg{align-items:center}
.ordp .pi .lg .pl-img{
  display:block;
  height:24px;
  width:auto;
  max-width:74px;
  object-fit:contain;
  padding:3px 8px;
  border-radius:6px;
  background:var(--card);
  border:1px solid var(--line);
}

/* Логата на плащанията · в същия правоъгълник като значките. */
.ordp .pi .lg{align-items:center}
.ordp .pi .lg .pl-img{
  display:block;
  height:24px;
  width:auto;
  max-width:74px;
  object-fit:contain;
  padding:3px 8px;
  border-radius:6px;
  background:var(--card);
  border:1px solid var(--line);
}

/*
 * ═══════════════════════════════════════════════════════════
 * ПЛАЩАНЕТО · само логата
 * ═══════════════════════════════════════════════════════════
 */
.ordp .payg > .pi{
  display:grid !important;
  place-items:center !important;
  position:relative;
  min-height:86px;
  padding:16px 18px !important;
  gap:0 !important;
}
.ordp .payg > .pi .lg{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin:0 !important;
  width:auto;
}
.ordp .payg > .pi .lg .pl-img{
  height:40px;
  max-width:132px;
  width:auto;
  padding:0;
  border:0;
  background:none;
  border-radius:0;
  filter:saturate(.92);
  transition:filter .2s,transform .2s;
}
.ordp .payg > .pi:hover .lg .pl-img{filter:none;transform:scale(1.03)}
.ordp .payg > .pi.on .lg .pl-img{filter:none}

/* Отметката в ъгъла · вместо кръгчето отпред. */
.ordp .payg > .pi .pi-ok{
  position:absolute;top:9px;right:9px;
  display:grid;place-items:center;
  width:21px;height:21px;border-radius:50%;
  background:var(--cy);color:#fff;
  opacity:0;transform:scale(.7);
  transition:opacity .18s,transform .18s;
}
.ordp .payg > .pi .pi-ok svg{width:12px;height:12px}
.ordp .payg > .pi.on .pi-ok,
.ordp .payg > .pi:has(input:checked) .pi-ok{opacity:1;transform:scale(1)}

/* Какво става после · един ред под плочките. */
.ordp .pay-sled{margin-top:13px;min-height:19px}
.ordp .pay-sl{display:none;font-size:12.5px;line-height:1.5;color:var(--dim)}
.ordp .pay-sl.on{display:block}
.ordp .pay-sl b{color:var(--ink);font-weight:700}

/* Логото пълни плочката · марката се чете от разстояние. */
.ordp .payg > .pi{min-height:104px;padding:14px 16px !important}
.ordp .payg > .pi .lg{width:100%;gap:16px}
.ordp .payg > .pi .lg .pl-img{
  flex:1 1 0;
  min-width:0;
  width:100%;
  height:auto;
  max-width:none;
  max-height:66px;
  object-fit:contain;
}

/*
 * ═══════════════════════════════════════════════════════════
 * САМОТО ПЛАЩАНЕ · формата на Stripe и платежното нареждане
 * ═══════════════════════════════════════════════════════════
 */
.ordp .pay-box{margin-top:18px}
.ordp .pay-box[hidden]{display:none !important}

.ordp .pay-load{
  padding:26px;
  border-radius:12px;
  background:var(--canvas);
  border:1px dashed var(--line-2);
  text-align:center;
  font-size:12.5px;
  color:var(--faint);
}
.ordp .pay-load[hidden]{display:none !important}

.ordp .pay-card{
  padding:18px;
  border-radius:12px;
  background:var(--card);
  border:1px solid var(--line);
}
.ordp .pay-card[hidden]{display:none !important}

/* Платежното нареждане · редове за преписване. */
.ordp .pay-bank{
  padding:18px 20px;
  border-radius:12px;
  background:var(--canvas);
  border:1px solid var(--line-2);
}
.ordp .pay-bank[hidden]{display:none !important}

.ordp .pb-r{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  padding:9px 0;
  border-bottom:1px solid var(--line);
  font-size:12.5px;
  color:var(--dim);
}
.ordp .pb-r:last-of-type{border-bottom:0}
.ordp .pb-r b{
  font:600 13px/1.35 var(--mono);
  color:var(--ink);
  text-align:right;
  overflow-wrap:anywhere;
}
.ordp .pb-r.big b{font-size:16px;font-weight:800;color:var(--green-d)}

.ordp .pb-kop{
  margin-top:14px;
  padding:11px 16px;
  border-radius:9px;
  border:1px solid var(--line-2);
  background:var(--card);
  cursor:pointer;
  font:700 12px/1 var(--sans);
  color:var(--ink);
}
.ordp .pb-kop:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* Влязъл клиент · вместо формата. */
.ordp .au-veche{
  display:flex;
  align-items:center;
  gap:13px;
  padding:15px 17px;
  border-radius:12px;
  background:linear-gradient(112deg,#fff,var(--cy-bg));
  border:1px solid var(--cy);
}
.ordp .au-veche .au-ok{
  display:grid;place-items:center;
  width:30px;height:30px;border-radius:50%;
  flex:0 0 auto;background:var(--cy);color:#fff;
}
.ordp .au-veche .au-ok svg{width:16px;height:16px}
.ordp .au-veche .au-t{flex:1 1 auto;min-width:0}
.ordp .au-veche .au-t b{display:block;font:700 13.5px/1.25 var(--sans)}
.ordp .au-veche .au-t span{
  display:block;margin-top:2px;
  font-size:11.5px;color:var(--dim);
}
.ordp .au-veche .au-alt{margin:0;flex:0 0 auto}

/*
 * ═══════════════════════════════════════════════════════════
 * СГРЕШЕНОТО ПОЛЕ · червена рамка и причина под него
 * ═══════════════════════════════════════════════════════════
 */
.ordp .f.is-bad .ctrl,
.ordp .f.is-bad select.ctrl{
  border-color:var(--rose) !important;
  background:var(--rose-w,#FDF2F5);
}
.ordp .f.is-bad .ctrl:focus{
  box-shadow:0 0 0 3px rgba(214,51,108,.15);
}
.ordp .f.is-bad > label{color:var(--rose)}

.ordp .au-chk.is-bad{
  border-radius:9px;
  outline:1px solid var(--rose);
  outline-offset:6px;
}

.ordp .f-err{
  display:block;
  margin-top:5px;
  font:600 11.5px/1.4 var(--sans);
  font-style:normal;
  color:var(--rose);
}

/*
 * ═══════════════════════════════════════════════════════════
 * КАРТОВАТА ФОРМА · наша отвън, Stripe отвътре
 * ═══════════════════════════════════════════════════════════
 */
.ordp .pc-h{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
  padding:10px 13px;
  border-radius:9px;
  background:var(--cy-bg);
  border:1px solid #BFE0EC;
  font-size:11.5px;
  line-height:1.45;
  color:var(--dim);
}
.ordp .pc-h .pc-lock{
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  flex:0 0 auto;
  color:var(--cy);
}
.ordp .pc-h .pc-lock svg{width:14px;height:14px}

/*
 * Рамката на Stripe стои в нашето поле · тя носи собствена
 * височина, затова полето само я обгражда.
 */
.ordp .pc-el{
  display:block;
  width:100%;
  min-height:46px;
  padding:14px;
  background:var(--card);
  border:1px solid var(--line-2);
  border-radius:10px;
  transition:border-color .18s,box-shadow .18s;
}
.ordp .pc-el.StripeElement--focus{
  border-color:var(--cy);
  box-shadow:0 0 0 3px var(--cy-bg);
}
.ordp .pc-el.StripeElement--invalid{
  border-color:var(--rose);
  background:var(--rose-w,#FDF2F5);
}
.ordp .pc-el iframe{display:block !important;width:100% !important}

.ordp .pc-err{margin-top:14px}
.ordp .pc-err[hidden]{display:none !important}


/* ══════════════════════════════════════════════════════════
   ТАБЛОТО · показалец върху кривата
   ══════════════════════════════════════════════════════════
   Идва последен в листа · печели над по-ранните правила,
   независимо че файлът носи всеки блок по два пъти.          */

/* Балончето трябва да излезе извън рамката · затова отрязването
   пада САМО когато вътре стои кривата с показалец.            */
.dash-graph:has(.gwrap){overflow:visible}

.gwrap{position:relative;height:100%;overflow:visible;cursor:crosshair}
.gwrap svg{width:100%;height:100%;display:block;overflow:hidden;border-radius:16px}

/* Трите следящи елемента спят, докато мишката не влезе. */
.gcur,.gdot,.gtip{position:absolute;opacity:0;pointer-events:none;
                  transition:opacity .16s ease}
.gwrap:hover .gcur,.gwrap:hover .gdot,.gwrap:hover .gtip{opacity:1}

.gcur{top:0;bottom:0;width:1px;left:0;margin-left:-.5px;
      background:linear-gradient(to bottom,rgba(255,255,255,0),
                 rgba(255,255,255,.34) 22%,rgba(255,255,255,.34) 78%,
                 rgba(255,255,255,0))}

/* Цветът идва от самата крива · подава се върху .gwrap. */
.gdot{width:9px;height:9px;border-radius:50%;left:0;top:0;
      transform:translate(-50%,-50%);background:var(--gc,#7cbf00);
      box-shadow:0 0 0 3px rgba(255,255,255,.2),0 2px 6px rgba(0,0,0,.45)}

.gtip{left:0;top:0;transform:translate(-50%,-132%);
      padding:7px 11px;border-radius:10px;white-space:nowrap;
      background:rgba(9,20,34,.96);border:1px solid rgba(255,255,255,.14);
      box-shadow:0 6px 18px rgba(0,0,0,.34)}
.gtip b{display:block;font:700 12.5px/1.2 var(--sans);color:#fff}
.gtip span{display:block;margin-top:2px;
           font:600 10px/1 var(--sans);letter-spacing:.06em;
           text-transform:uppercase;color:rgba(255,255,255,.5)}

/* Остана само едно число горе · взима целия ред, вместо да виси
   в лявата половина с дупка до себе си. */
.dash-top .dm:only-child{grid-column:1/-1}

@media (prefers-reduced-motion:reduce){
  .gcur,.gdot,.gtip{transition:none}
}


/* ══════════════════════════════════════════════════════════
   ТАБЛОТО · пръстен и списък
   ══════════════════════════════════════════════════════════ */
.dash-ring{display:flex;align-items:center;gap:18px;margin-bottom:14px}

.dring{position:relative;width:118px;height:118px;flex:0 0 auto}
.dring svg{width:100%;height:100%;display:block;transform:rotate(-90deg)}
.dring circle{fill:none;stroke-linecap:round}
.dring-b{stroke:rgba(255,255,255,.09);stroke-width:9}

/* Пръстенът се изписва · спира там, където му казва „--off“. */
.dring-f{stroke:url(#dgr);stroke-width:9;
         stroke-dasharray:351.86;stroke-dashoffset:351.86;
         animation:dring-in 1.5s cubic-bezier(.2,.9,.2,1) forwards}
@keyframes dring-in{to{stroke-dashoffset:var(--off,351.86)}}

.dring-m{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.dring-m em{display:block;font:800 28px/1 var(--sans);font-style:normal;
            letter-spacing:-.03em;color:#fff}
.dring-m small{display:block;margin-top:5px;font:700 9px/1 var(--sans);
               letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.42)}

.dlist{flex:1;min-width:0;display:grid;gap:8px}
.dli{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;
     background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);
     transition:background .2s ease,border-color .2s ease}
.dli:hover{background:rgba(124,191,0,.1);border-color:rgba(124,191,0,.38)}
.dli-p{width:6px;height:6px;border-radius:50%;background:#7cbf00;flex:0 0 auto;
       box-shadow:0 0 9px rgba(124,191,0,.8)}
.dli b{flex:1;min-width:0;font:700 11.5px/1 var(--sans);color:rgba(255,255,255,.55);
       white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dli em{font:800 15px/1 var(--sans);font-style:normal;color:#fff;white-space:nowrap}
.dli em small{font:700 11px/1 var(--sans);color:rgba(255,255,255,.42)}

@media (max-width:560px){
  .dash-ring{flex-direction:column;gap:14px}
  .dring{width:104px;height:104px}
  .dlist{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .dring-f{animation:none;stroke-dashoffset:var(--off,351.86)}
}


/* ══════════════════════════════════════════════════════════
   УСЛУГИТЕ · пет карти на ред
   ══════════════════════════════════════════════════════════
   Картите са пет · три колони оставяха две сами на втори ред.
   Идва последен в листа, значи печели над всяко по-ранно
   правило, включително над по-ранните медия заявки.          */
.svc-cards{grid-template-columns:repeat(5,1fr);gap:13px}

/* Под 1180 пет карти стават ивици · слизат на три, после две. */
@media (max-width:1180px){.svc-cards{grid-template-columns:repeat(3,1fr);gap:16px}}
@media (max-width:860px){.svc-cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.svc-cards{grid-template-columns:1fr}}


/* ══════════════════════════════════════════════════════════
   ТАБЛОТО · бенто плочки
   ══════════════════════════════════════════════════════════ */
.dbento{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}

.dbt{position:relative;padding:13px 14px;border-radius:15px;
     background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);
     transition:transform .22s cubic-bezier(.2,.9,.2,1),background .22s ease,
                border-color .22s ease,box-shadow .22s ease}
.dbt:hover{transform:translateY(-3px);background:rgba(124,191,0,.09);
           border-color:rgba(124,191,0,.42);box-shadow:0 10px 26px rgba(0,0,0,.34)}

/* Широката заема целия ред · балончето на кривата излиза извън нея. */
.dbt-w{grid-column:1/-1;overflow:visible}

.dbt-l{display:block;font:700 9.5px/1 var(--sans);letter-spacing:.11em;
       text-transform:uppercase;color:rgba(255,255,255,.42)}
.dbt em{display:block;margin-top:6px;font:800 23px/1 var(--sans);font-style:normal;
        letter-spacing:-.03em;color:#fff}
.dbt em small{font:700 12px/1 var(--sans);color:rgba(255,255,255,.42)}
.dbt-w em{font-size:31px}

.dbt-b{display:block;margin-top:9px;height:3px;border-radius:99px;
       background:rgba(255,255,255,.12);overflow:hidden}
.dbt-b i{display:block;height:100%;border-radius:99px;
         background:linear-gradient(90deg,#7cbf00,#B7FF35);
         animation:dbt-grow 1.3s cubic-bezier(.2,.9,.2,1) both}
@keyframes dbt-grow{from{width:0}}

.dbt-w .gwrap{height:70px;margin-top:9px}
.dbt-w .gwrap svg{border-radius:10px}

@media (max-width:560px){.dbento{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion:reduce){
  .dbt{transition:none}
  .dbt-b i{animation:none}
}


/* ══════════════════════════════════════════════════════════
   ТАБЛОТО · бенто, две тесни плочки
   ══════════════════════════════════════════════════════════
   Както в макета: широката отгоре, две под нея.               */
.dbento{grid-template-columns:repeat(2,1fr)}

.dbs{display:flex;align-items:flex-end;gap:2px;height:20px;margin-top:9px}
.dbs i{flex:1;border-radius:2px;background:rgba(255,255,255,.22);
       transition:background .22s ease;
       animation:dbs-up .8s cubic-bezier(.2,.9,.2,1) both}
.dbt:hover .dbs i{background:#7cbf00}
@keyframes dbs-up{from{height:0!important}}

@media (prefers-reduced-motion:reduce){.dbs i{animation:none}}


/* ══════════════════════════════════════════════════════════
   ЛОКАЦИИ · дясната колона с поканата към плановете
   ══════════════════════════════════════════════════════════ */
.loc-vps{align-self:start;position:relative;overflow:hidden;
         background:var(--paper);border:1px solid var(--line);
         border-radius:14px;padding:26px 26px 24px}

/* Тънка цветна ивица отгоре · като печат на кутия. */
.loc-vps::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;
                 background:linear-gradient(90deg,#7cbf00,#B7FF35)}

.loc-vps-k{display:block;margin-bottom:10px;font:700 10px/1 var(--sans);
           letter-spacing:.12em;text-transform:uppercase;color:#7cbf00}
.loc-vps h2{margin:0 0 10px;font-size:23px;line-height:1.2;letter-spacing:-.02em}
.loc-vps-l{margin:0 0 12px;font-size:15.5px;font-weight:600;color:var(--ink)}
.loc-vps p{margin:0 0 12px;font-size:14px;line-height:1.65;color:var(--ink-2)}

.loc-vps-b{display:inline-flex;align-items:center;gap:9px;margin-top:6px;
           padding:12px 20px;border-radius:9px;text-decoration:none;
           background:#7cbf00;color:#0E2745;font:700 14.5px/1 var(--sans);
           transition:transform .2s cubic-bezier(.2,.9,.2,1),
                      box-shadow .2s ease,background .2s ease}
.loc-vps-b svg{width:17px;height:17px;flex:0 0 auto;transition:transform .22s ease}
.loc-vps-b:hover{background:#8ed400;transform:translateY(-2px);
                 box-shadow:0 8px 20px rgba(124,191,0,.34);color:#0E2745}
.loc-vps-b:hover svg{transform:translateX(3px)}

@media (max-width:860px){.loc-vps{padding:22px 20px}}
@media (prefers-reduced-motion:reduce){.loc-vps-b,.loc-vps-b svg{transition:none}}

/* dsearch · заглавие на един ред + по-видим надпис */
/*
 * ЗАГЛАВИЕТО СЕ СЪБИРА НА ЕДИН РЕД.
 *
 * Новият текст е по-дълъг от стария и при 2,7rem падаше на два реда.
 * Тук се смалява, а „nowrap“ важи само от 900px нагоре — на телефон
 * пренасянето е нужно, иначе текстът излиза извън екрана.
 */
/*
 * РАЗМЕРЪТ СЕ СМЯТА ОТ ШИРИНАТА НА БОКСА, не от екрана.
 *
 * „cqw“ е процент от ширината на контейнера. При 37 знака и този шрифт
 * един знак заема около 0.52em, тоест текстът е ~19em — затова
 * 100/19 ≈ 5.2cqw го разпъва точно до края на бокса и никога не излиза
 * извън него. Без „nowrap“ на тесен екран, там пренасянето е нужно.
 */
.dsearch .wrap-w > div:first-child{container-type:inline-size}

.dsearch h2{
  font-size:clamp(1.3rem,5.6vw,1.9rem);
  letter-spacing:-.025em;
  padding-top:90px;
}

@media (min-width:900px){
  .dsearch h2{
    font-size:min(2.6rem,5.1cqw);
    white-space:nowrap;
  }
}

/*
 * НАДПИСЪТ СТАВА ЗНАЧЕ, НЕ ДРЕБЕН ТЕКСТ.
 *
 * При 10px тънък шрифт се губеше. Като плътно зелено значе се вижда
 * веднага, а бялото върху зелено държи четимостта.
 */
.dtip-k{
  padding:5px 11px;
  border-radius:999px;
  background:#7cbf00;
  color:#fff;
  font-size:12px;
  letter-spacing:.07em;
  margin-bottom:14px;
}

.dtip-k::before{display:none}

/* карти с услуги · втори абзац и „От“ пред цената */
/*
 * ЦЕНАТА СТОИ ДОЛУ, при всички карти на един ред.
 *
 * Текстовете са с различна дължина; без това редът с цената тръгва
 * веднага след текста и петте карти изглеждат разкривени.
 */
.svc-card{display:flex;flex-direction:column}
.svc-card .svc-p{margin-top:auto}

/* Вторият абзац е обяснение, не заглавие · по-дребен и по-светъл. */
.svc-card .svc-d2{
  margin:8px 0 0;
  font-size:13px;
  line-height:1.55;
  opacity:.72;
}

/* „От“ е бележка към цената, не част от числото. */
.svc-from{
  margin-right:5px;
  font-size:12px;
  font-weight:700;
  opacity:.6;
}

/* надписът в заглавието на секция + цената на един ред */
/*
 * НАДПИСЪТ НАД ЗАГЛАВИЕТО НА СЕКЦИЯ.
 *
 * „.eyebrow“ имаше цвят само в героя и в тъмните секции; в светла
 * секция излизаше като обикновен текст. Тук е зелен като останалите
 * акценти и удебелен.
 */
.sec-head .eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  margin-bottom:12px;
  font:800 12.5px/1 var(--sans);
  letter-spacing:.09em;
  text-transform:uppercase;
  color:#7cbf00;
}

.sec-head.is-center .eyebrow{justify-content:center}

/*
 * ЦЕНАТА НЕ СЕ ЧУПИ, докато копчето се разпъва.
 *
 * Редът е „flex“ без пренасяне, но при посочване копчето расте и
 * свиваше „/месец“ — текстът му падаше на втори ред. Сега цената и
 * мярката не се свиват, а копчето отстъпва, ако мястото не стига.
 */
.svc-p{flex-wrap:nowrap}

.svc-p b,
.svc-p > span:not(.svc-go){
  flex:0 0 auto;
  white-space:nowrap;
}

.svc-go{
  flex:0 1 auto;
  min-width:0;
}

/* копчето на картата · свой ред, целият текст */
/*
 * КОПЧЕТО СЛИЗА НА СВОЙ РЕД.
 *
 * Разпъващото се кръгче работеше, докато текстът беше „Поръчай“. С
 * „Вижте VPS плановете“ при пет карти на ред просто няма място: цената
 * заема две трети от ширината. Едно от двете трябваше да отстъпи —
 * отстъпва подредбата, не текстът, защото той казва къде се щраква.
 *
 * Така копчето е видимо и без посочване, а целият надпис се чете.
 */
.svc-p{flex-wrap:wrap}

.svc-go{
  flex:1 0 100%;
  margin:12px 0 0;
  justify-content:center;
  gap:8px;
  padding:0 14px;
}

.svc-go > span{
  max-width:none;
  overflow:visible;
}

/* При посочване копчето само потъмнява · няма какво да се разпъва. */
.svc-card:hover .svc-go{
  gap:8px;
  padding:0 14px;
}

.svc-card:hover .svc-go > span{max-width:none}

/* секцията за скоростта · няколко абзаца и четирите фактора */
/* Текстът вече е няколко абзаца · трябва им разстояние. */
.sb-txt + .sb-txt{margin-top:14px}

/*
 * ЧЕТИРИТЕ ФАКТОРА.
 *
 * Понятието е удебелено и на свой ред, обяснението под него е по-светло.
 * Тънката линия отляво ги свързва като списък, без точки и цифри.
 */
.sb-fx{
  margin:20px 0 18px;
  padding:0 0 0 16px;
  border-left:2px solid rgba(124,191,0,.45);
}

.sb-fx dt{
  margin:0;
  font:800 15.5px/1.35 var(--sans);
  letter-spacing:-.01em;
}

.sb-fx dd{
  margin:5px 0 16px;
  font-size:14.5px;
  line-height:1.62;
  opacity:.78;
}

.sb-fx dd:last-child{margin-bottom:0}

/* секцията за скоростта · заглавие на два реда, текст в една колона */
/*
 * ЗАГЛАВИЕТО НА ДВА РЕДА.
 *
 * „max-width:20ch“ беше писано за старото кратко заглавие; новото е 68
 * знака и падаше на четири реда. 34ch го дели на две, а „balance“ прави
 * двата реда приблизително равни, вместо дълъг и къс.
 */
/*
 * ЗАГЛАВИЕТО НА ЕДИН РЕД, ПО ЦЯЛАТА ШИРИНА.
 *
 * Старото „max-width:20ch“ беше за краткото заглавие. Новото е 68 знака,
 * тоест около 34em — затова размерът се смята от ширината на секцията:
 * 100/34 ≈ 2.9cqw, минус мястото на числото отдясно, значи 2.5cqw.
 *
 * „nowrap“ важи само от 1100px нагоре. Под това пренасянето е нужно,
 * иначе текстът излиза извън екрана.
 */
.sb-in{container-type:inline-size}

.sb-h h2{
  max-width:none;
  text-wrap:balance;
}

@media (min-width:1100px){
  .sb-h h2{
    font-size:min(2.15rem,2.5cqw);
    white-space:nowrap;
    text-wrap:nowrap;
  }
}

/* Текстът е една колона · абзаците вече не са отделни клетки. */
.sb-col{min-width:0}
.sb-col > .sb-txt + .sb-txt{margin-top:14px}

/* секцията за скоростта · текст в две колони, карти на лента */
/*
 * ТЕКСТЪТ СЕ РАЗЛИВА В ДВЕ КОЛОНИ, картите слизат под него.
 *
 * Дотук „sb-body“ беше текст отляво и карти отдясно. Текстът стана пет
 * пъти по-дълъг от картите — оттам оставаше половин екран празно под
 * тях. Сега текстът тече в две колони по цялата ширина и се запълва сам,
 * а картите са лента от четири отдолу.
 */
@media (min-width:900px){
  .sb-body{display:block}

  .sb-col{
    columns:2;
    column-gap:clamp(28px,3.4vw,48px);
  }

  /* Понятие и обяснение не се разделят между колоните. */
  .sb-fx dt{break-after:avoid}
  .sb-fx dt,
  .sb-fx dd{break-inside:avoid}

  .sb-cards{
    grid-template-columns:repeat(4,1fr);
    margin-top:clamp(24px,3vw,34px);
  }
}

/* Първият абзац няма нужда от отстъп отгоре в началото на колона. */
.sb-col > .sb-txt:first-child{margin-top:0}

/* заглавията на четирите фактора · по-тежки */
/*
 * ПО-ТЕЖКИ ЗАГЛАВИЯ НА ФАКТОРИТЕ.
 *
 * „800“ е най-тежкото рязане на Manrope — над него шрифтът не става
 * по-черен, а браузърът започва да го дебелее изкуствено и буквите
 * замазват. Затова тежестта идва от размера и от плътния цвят, а не от
 * ново число.
 */
.sb-fx dt{
  position:relative;
  margin-top:2px;
  font-size:19px;
  font-weight:800;
  line-height:1.28;
  color:var(--ink);
  letter-spacing:-.022em;
}

/*
 * ЗЕЛЕНА ТОЧКА ОТПРЕД.
 *
 * Тежестта на шрифта е на тавана си; окото различава заглавието по
 * знака пред него, не по още половин пункт дебелина.
 */
.sb-fx dt::before{
  content:'';
  position:absolute;
  left:-23px;
  top:.52em;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#7cbf00;
}

/* защо да изберете нас · увод, подзаглавия, заключение */
/*
 * УВОДЪТ · два абзаца под заглавието.
 *
 * Центриран и с ограничена ширина: дълъг ред през целия екран се чете
 * трудно, защото окото губи началото на следващия.
 */
.feat-intro{
  max-width:74ch;
  margin:0 auto clamp(26px,3.4vw,38px);
  text-align:center;
}

.feat-intro p{
  margin:0;
  font-size:15.5px;
  line-height:1.7;
  color:var(--ink-2);
}

.feat-intro p + p{margin-top:12px}

/*
 * ПОДЗАГЛАВИЕТО В КАРТАТА.
 *
 * Стои между заглавието и текста · зелено и удебелено, за да се различи
 * от абзаца отдолу без да спори със заглавието.
 */
.feat-card .feat-sub{
  margin:2px 0 10px;
  font:800 13.5px/1.4 var(--sans);
  letter-spacing:-.005em;
  color:#6aa300;
}

/* Вторият абзац е допълнение · по-дребен и по-светъл. */
.feat-card .feat-d2{
  margin:9px 0 0;
  font-size:13.5px;
  line-height:1.6;
  opacity:.74;
}

/*
 * ЗАКЛЮЧЕНИЕТО под мрежата.
 *
 * Отделено с линия отгоре: то не е девета карта, а извод от всички.
 */
.feat-grow{
  max-width:74ch;
  margin:clamp(28px,3.6vw,44px) auto 0;
  padding-top:clamp(22px,2.8vw,30px);
  border-top:1px solid var(--line);
  text-align:center;
}

.feat-grow h3{
  margin:0 0 12px;
  font:800 clamp(1.15rem,2.2vw,1.5rem)/1.28 var(--sans);
  letter-spacing:-.028em;
}

.feat-grow p{
  margin:0;
  font-size:15.5px;
  line-height:1.7;
  color:var(--ink-2);
}

.feat-grow p + p{margin-top:12px}

/* увод и заключение · центрирано, тъмнозелено */
/*
 * Уводът и заключението са изводи, не описания · затова са отделени
 * с цвят от обикновения текст. Зеленото е по-тъмно от акцентното
 * (#6aa300), за да остане четимо при дълъг абзац.
 */
.feat-intro,
.feat-grow{
  text-align:center;
}

.feat-intro p,
.feat-grow h3,
.feat-grow p{
  text-align:center;
  color:#3f6b00;
}

/* картата · подзаглавие и втори абзац над !important */
/*
 * По-нагоре в файла .feat-card p е с !important (14px, сиво, margin:0).
 * Затова тук също е с !important — иначе подзаглавието и вторият
 * абзац изглеждат като основния текст и абзаците се залепват.
 */
.feat-card .feat-sub{
  margin:2px 0 12px !important;
  font-size:13.5px !important;
  font-weight:800 !important;
  line-height:1.4 !important;
  color:#6aa300 !important;
}

.feat-card .feat-d2{
  margin:10px 0 0 !important;
  font-size:13.5px !important;
  line-height:1.6 !important;
  color:#6b6e66 !important;
}

/* увод и заключение · по цялата ширина на секцията */
/*
 * По-горе тези два блока бяха стеснени до 74ch и центрирани в средата
 * на секцията. Тук ограничението пада: текстът тръгва от левия ръб на
 * решетката и стига до десния, а редовете остават центрирани.
 */
.feat-intro,
.feat-grow{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* увод · текст вляво, снимка вдясно на същия ред */
/*
 * Две колони: текстът заема свободното място, снимката е с таван 380px.
 * align-items:center изравнява снимката спрямо средата на текста, а не
 * спрямо първия му ред.
 */
.feat-intro{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,380px);
  gap:clamp(20px,3vw,40px);
  align-items:center;
}

/* Без min-width:0 дългата дума не позволява на колоната да се свие. */
.feat-intro-txt{min-width:0}

.feat-intro-img{
  display:block;
  width:100%;
  height:auto;
  border-radius:14px;
  box-shadow:0 14px 30px rgba(48,90,8,.10);
}

/*
 * Под 860px двете колони не се събират · снимката минава под текста
 * и се ограничава, за да не стане цяла екранна ширина.
 */
@media (max-width:860px){
  .feat-intro{grid-template-columns:1fr}
  .feat-intro-img{max-width:420px;margin:0 auto}
}

/* увод · текстът е ляво подравнен */
/*
 * Само двата абзаца до снимката · заключението отдолу остава центрирано.
 * В тясна колона до картинка центрираният текст има начупен ляв ръб.
 */
.feat-intro-txt,
.feat-intro-txt p{
  text-align:left;
}

/* как да започнете · подзаглавие, помощ, бутон */
/*
 * Подзаглавието стои между H2 и водещия абзац · зелено и удебелено,
 * за да се отличи от текста без да спори със заглавието.
 */
.welc-sub{
  margin:8px 0 14px;
  font:800 clamp(1rem,1.7vw,1.18rem)/1.35 var(--sans);
  letter-spacing:-.01em;
  color:#6aa300;
}

/*
 * Блокът с помощта е отделен с линия отгоре · той не е четвърта стъпка,
 * а изход от трите.
 */
.welc-help{
  margin-top:clamp(22px,2.6vw,30px);
  padding-top:clamp(18px,2.2vw,24px);
  border-top:1px solid var(--line);
}

.welc-help h3{
  margin:0 0 8px;
  font:800 1.06rem/1.3 var(--sans);
  letter-spacing:-.02em;
}

.welc-help p{
  margin:0 0 18px;
  font-size:14.5px;
  line-height:1.65;
  color:var(--ink-2);
}

/* inline-flex · стрелката стои на един ред с текста и не се пренася. */
.welc-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}

/* как да започнете · заглавието на един ред */
/*
 * Текстовата колона става контейнер за измерване · тогава cqw е процент
 * от НЕЙНАТА ширина, не от екрана. Така шрифтът се смалява точно колкото
 * трябва, за да влезе заглавието на един ред в своята колона.
 *
 * min(...) слага таван: на широк екран колоната е голяма и 5.2cqw би
 * станало огромно.
 */
.welc-g > div:not(.welc-art){
  container-type:inline-size;
}

.welc-g > div:not(.welc-art) > h2{
  font-size:min(5.2cqw,2.1rem) !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
}

/* как да започнете · водещият текст по цялата ширина */
/*
 * По-нагоре водещият абзац е стеснен · тук ограничението пада и той
 * стига до десния ръб на стъпките под него.
 */
.welc-lead{
  max-width:none !important;
  width:100% !important;
  margin-right:0 !important;
}

/* увод · текст и снимка на равни половини */
/*
 * Досега снимката имаше таван 380px и текстът взимаше остатъка. Сега
 * двете колони са равни · снимката става значително по-голяма.
 *
 * Медия заявката се повтаря тук с !important, защото правилото отгоре
 * е с !important и иначе би отменило събирането в една колона на телефон.
 */
.feat-intro{
  grid-template-columns:1fr 1fr !important;
  align-items:center;
}

@media (max-width:860px){
  .feat-intro{grid-template-columns:1fr !important}
}

/* увод · заглавието вътре в текстовата колона */
/*
 * Заглавието вече е част от колоната до снимката · затова е ляво
 * подравнено и с по-малко разстояние отдолу, отколкото когато стоеше
 * самостоятелно над цялата секция.
 */
.feat-intro-txt .sec-head{
  margin:0 0 16px !important;
  text-align:left !important;
  max-width:none !important;
}

.feat-intro-txt .sec-head h2{
  margin:0 0 8px;
  text-align:left !important;
}

.feat-intro-txt .sec-head p{
  margin:0;
  text-align:left !important;
}

/* увод · снимката се изравнява по височина с текста */
/*
 * Снимката е 3:2 и на половин ширина излиза по-висока от текста ·
 * оттам идват празните ленти над заглавието и под абзаците.
 *
 * aspect-ratio я свежда до 16:9, а object-fit:cover изрязва горе и долу
 * вместо да я сплесква. object-position определя кое остава в кадъра.
 */
.feat-intro-img{
  aspect-ratio:16/9 !important;
  height:auto !important;
  object-fit:cover;
  object-position:center 40%;
}

/* поддръжка · водещ ред в отговора, списък и заключение */
/*
 * Първият ред на всеки отговор · зелен и удебелен, за да се отдели от
 * абзаците под него.
 */
.pd-qa .pd-as{
  margin:0 0 10px !important;
  font:800 14px/1.45 var(--sans) !important;
  color:#6aa300 !important;
}

/* Между абзаците в отговора трябва да има въздух. */
.pd-qa details p + p{margin-top:10px}

/*
 * СПИСЪКЪТ „с какво помагаме“ · стои под двете колони, на цяла ширина.
 * auto-fit сам решава колко колони влизат · на телефон става една.
 */
.pd-help{
  margin-top:clamp(28px,3.4vw,44px);
  padding-top:clamp(20px,2.6vw,28px);
  border-top:1px solid var(--line);
}

.pd-help h3{
  margin:0 0 16px;
  font:800 clamp(1.1rem,2vw,1.35rem)/1.3 var(--sans);
  letter-spacing:-.025em;
}

.pd-help ul{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:10px 24px;
  margin:0;
  padding:0;
  list-style:none;
}

/* Отметката е нарисувана с текст · без картинка и без шрифт с икони. */
.pd-help li{
  position:relative;
  padding-left:24px;
  font-size:14.5px;
  line-height:1.5;
}

.pd-help li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  font-weight:800;
  color:#6aa300;
}

/*
 * ЗАКЛЮЧЕНИЕТО · centered и стеснено, защото е извод, а не описание.
 */
.pd-end{
  max-width:74ch;
  margin:clamp(26px,3.2vw,40px) auto 0;
  padding-top:clamp(20px,2.6vw,28px);
  border-top:1px solid var(--line);
  text-align:center;
}

.pd-end h3{
  margin:0 0 10px;
  font:800 clamp(1.1rem,2vw,1.35rem)/1.3 var(--sans);
  letter-spacing:-.025em;
}

.pd-end p{
  margin:0;
  font-size:15.5px;
  line-height:1.7;
  color:var(--ink-2);
}

/* поддръжка · заглавие и увод до ръба на въпросите */
/*
 * Заглавието и двата уводни абзаца бяха стеснени, а блокът с въпросите
 * под тях е на цялата колона · оттам идва различният десен ръб.
 *
 * „> p“ хваща само уводните абзаци · отговорите в details са вътре в
 * .pd-qa и не се засягат.
 */
.pd-t h2,
.pd-t > p{
  max-width:none !important;
  width:auto !important;
}

/* поддръжка · водещият ред със страничните отстъпи на абзаците */
/*
 * .pd-qa p е с margin:0 18px 16px · предишното правило за .pd-as го
 * занули и редът опря в рамката. Тук страничните 18px се връщат.
 */
.pd-qa .pd-as{
  margin:0 18px 10px !important;
}

/* поддръжка · водещият ред в по-тъмно зелено */
/* Същото тъмно зелено, с което са уводът и заключението на началната. */
.pd-qa .pd-as{
  color:#3f6b00 !important;
  font-size:14.5px !important;
}

/* поддръжка · списъкът центриран */
/*
 * Мрежата от колони се сменя с редица, която се пренася · така всеки
 * ред е центриран спрямо секцията, вместо да стои в твърди колони.
 * Самите точки остават ляво подравнени вътре в себе си, за да е отметката
 * плътно пред текста.
 */
.pd-help{
  text-align:center;
}

.pd-help ul{
  display:flex !important;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px 28px;
}

.pd-help li{
  text-align:left;
}

/* поддръжка · списъкът в тъмно зелено, отметките светли */
/*
 * Текстът минава в тъмно зелено, а отметката запазва светлото ·
 * ::before носи свой цвят, затова не наследява новия.
 */
.pd-help h3{
  text-align:center !important;
}

.pd-help ul{
  justify-content:center !important;
}

.pd-help li{
  color:#3f6b00 !important;
  font-weight:600;
}

.pd-help li::before{
  color:#6aa300 !important;
}

/* поддръжка · значката с четим текст */
/*
 * Значката няма собствен цвят на текста · наследява го и на бял фон
 * излиза бледа. Тук цветът е изричен, а контурът по-ясен, за да се
 * отделя хапът от светлия фон на секцията.
 */
.pd-badge{
  background:#fff !important;
  border-color:#d5dde4 !important;
  color:#16212f !important;
  box-shadow:0 6px 18px rgba(14,39,69,.14) !important;
}

.pd-badge b{
  font-weight:800 !important;
  font-size:13px !important;
  color:#16212f !important;
}

/* поддръжка · заключението по цялата ширина */
/* Пада ограничението от 74ch · текстът тръгва от левия и стига до десния ръб. */
.pd-end{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* картата · да не излиза от екрана */
/*
 * По-горе .map-wrapper е с width:120% · картата е по-широка от родителя
 * си и на тесен екран се появява хоризонтален скрол.
 *
 * min() пази нарочното разширяване на голям екран, но никога не
 * позволява да мине ширината на видимата област (минус 32px за
 * страничните полета).
 */
.map-wrapper{
  width:min(120%, calc(100vw - 32px)) !important;
  max-width:1600px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Под 900px няма смисъл от разширяване · картата е по ширината на бокса. */
@media (max-width:900px){
  .map-wrapper{
    width:100% !important;
    max-width:100% !important;
  }

  .map-box-section{
    margin:32px auto !important;
    padding:26px 14px !important;
  }

  .map-box-section h2{
    font-size:1.5rem !important;
  }
}

/* герой · трите числа на един ред на телефон */
/*
 * Дотук блокът е flex с 26px отстояние и на тесен екран третото число
 * пада на нов ред. Мрежа с три равни колони го държи на един ред,
 * а шрифтовете се смаляват, за да се съберат.
 */
@media (max-width:760px){
  .hero-art-tr{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:10px !important;
    flex-wrap:nowrap !important;
  }

  .hero-fact{
    min-width:0 !important;
    text-align:center !important;
  }

  /* Числото не бива да се пренася · то е смисълът на плочката. */
  .hero-fact b{
    font-size:1rem !important;
    margin-bottom:3px !important;
    white-space:nowrap !important;
  }

  .hero-fact span{
    display:block !important;
    font-size:10.5px !important;
    line-height:1.25 !important;
  }
}

/* Под 380px числата стават още малко по-дребни, за да не се чупят. */
@media (max-width:380px){
  .hero-fact b{font-size:.92rem !important}
  .hero-fact span{font-size:9.8px !important}
  .hero-art-tr{gap:7px !important}
}

/* споделен хостинг · градиентът на героя както на началната */
/*
 * Същият фон като .hero-art на началната · три слоя: два меки кръга
 * отгоре-вдясно и отдолу-вляво, и диагонален преход отдолу.
 */
.sh-hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(1100px 620px at 84% -12%, rgba(194,86,47,.34), transparent 62%),
    radial-gradient(760px 420px at 6% 108%, rgba(184,134,43,.18), transparent 58%),
    linear-gradient(178deg, #1A1411 0%, var(--navy) 48%, #7cbf00 100%) !important;
  color:#fff;
}

/*
 * Ситните точки отгоре · маската ги избледнява към краищата, за да не
 * се бият с текста.
 */
.sh-hero::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.07) 1.2px, transparent 1.2px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(closest-side at 50% 40%, #000 40%, transparent 100%);
  mask-image:radial-gradient(closest-side at 50% 40%, #000 40%, transparent 100%);
}

/* Съдържанието остава над точките. */
.sh-hero > .wrap-w{position:relative;z-index:1}

/* споделен хостинг · бележката под графиките по цялата ширина */
/* Пада стеснението · текстът стига до десния ръб на бокса със скоростите. */
.sh-speed-note{
  max-width:none !important;
  width:100% !important;
  margin-right:0 !important;
}

/* планове · заглавието и текстът по ширината на плочките */
/*
 * Заглавието на секцията беше стеснено, а мрежата с плановете под него е
 * на цялата ширина · оттам различният десен ръб. Ограничението пада само
 * в тази секция (#plans), другите заглавия остават както са.
 */
#plans .sec-head,
#plans .sec-head h2,
#plans .sec-head p{
  max-width:none !important;
  width:auto !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* планове · sh-head на цяла ширина, заглавието на един ред */
/*
 * Блокът е .sh-head.mid (не .sec-head) · затова предишното правило нямаше
 * ефект. Тук ограничението в ширина пада, а заглавието се мери спрямо
 * самия блок (container-type) и се смалява точно колкото да влезе на
 * един ред.
 */
#plans .sh-head,
#plans .sh-head.mid{
  max-width:none !important;
  width:100% !important;
  container-type:inline-size;
}

#plans .sh-head p{
  max-width:none !important;
  width:100% !important;
}

#plans .sh-head h2{
  font-size:min(4cqw,2rem) !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
}

/* На телефон един ред би станал нечетим · там заглавието се пренася. */
@media (max-width:560px){
  #plans .sh-head h2{
    white-space:normal !important;
    font-size:1.25rem !important;
  }
}

/* споделен хостинг · заглавията на секциите на един ред */
/*
 * .sh-head става контейнер за измерване · cqw е процент от неговата
 * ширина, затова шрифтът се смалява точно колкото трябва, за да влезе
 * заглавието на един ред. min() слага таван, за да не порасне при
 * кратко заглавие.
 */
.sh-head{
  container-type:inline-size;
  max-width:none;
}

.sh-head > h2{
  font-size:min(3.6cqw,2rem) !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
}

/* На телефон един ред би станал нечетим · там заглавието се пренася. */
@media (max-width:560px){
  .sh-head > h2{
    white-space:normal !important;
    font-size:1.3rem !important;
  }
}

/* споделен хостинг · подзаглавията на секциите по цялата ширина */
/* Пада стеснението под заглавията · текстът стига до десния ръб на секцията. */
.sh-head > p{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* споделен хостинг · sh-head без стеснение, над по-специфичните правила */
/*
 * По-нагоре има правила с по-висока специфичност (div.wrap-w .sh-head,
 * section#which .sh-head и др.), които слагат max-width. Затова тук
 * селекторът е също толкова специфичен и с !important.
 */
div.wrap-w .sh-head,
section .sh-head,
.sh-head{
  max-width:none !important;
  width:100% !important;
}

div.wrap-w .sh-head > p,
section .sh-head > p,
.sh-head > p{
  max-width:none !important;
  width:100% !important;
}

/* картата · от край до край */
/*
 * По-нагоре сложих ограничител (min(120%, 100vw - 32px)), който пазеше
 * от хоризонтален скрол, но оставяше по 16px отстрани. Тук картата взима
 * цялата ширина на своя контейнер · без 120%, значи и без скрол.
 */
.map-box-section{
  max-width:none !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

.map-wrapper{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}

/* На телефон остава същото · картата е по ширината на екрана. */
@media (max-width:900px){
  .map-wrapper{
    width:100% !important;
    max-width:none !important;
  }

  .map-box-section{
    padding:26px 0 !important;
  }
}

/* поддръжка · списъкът на 4 колони и 2 реда */
/*
 * По-нагоре списъкът е flex с център · при 8 точки редовете излизаха
 * различни. Мрежа с четири равни колони дава точно 4 x 2.
 */
.pd-help ul{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px 24px !important;
  justify-content:stretch !important;
}

/* Точките са ляво подравнени, за да е отметката плътно пред текста. */
.pd-help li{
  text-align:left !important;
}

@media (max-width:900px){
  .pd-help ul{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}

@media (max-width:520px){
  .pd-help ul{grid-template-columns:1fr !important}
}

/* поддръжка · колоните на списъка центрирани */
/*
 * justify-items центрира всяка точка в своята колона, а текстът вътре в
 * нея остава ляво подравнен · иначе отметката се отделя от думите.
 */
.pd-help ul{
  justify-items:center !important;
}

/* таблица за сравнение · светъл вид, без тъмен фон и ховър */
/*
 * Един завършен светъл вид · слага се накрая и с !important, защото
 * по-нагоре таблицата се стилизира на няколко места, включително с тъмен
 * фон и тъмен ховър.
 *
 * Рамката е на обвивката, а таблицата отвътре скролира хоризонтално ·
 * така заобленият ъгъл не се чупи при скрол.
 */
.sh-tbl{
  background:#fff !important;
  border:1px solid #e6ebe2 !important;
  border-radius:16px !important;
  box-shadow:0 10px 30px rgba(14,39,69,.05) !important;
  padding:6px !important;
}

.sh-tbl table{
  background:transparent !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  color:#1d2a38 !important;
}

/* ── ГЛАВАТА ── */
.sh-tbl thead th{
  background:#f4f8ec !important;
  color:#3f6b00 !important;
  font:800 13.5px/1.3 var(--sans) !important;
  letter-spacing:-.01em !important;
  text-align:center !important;
  padding:14px 12px !important;
  border:0 !important;
  border-bottom:1px solid #e6ebe2 !important;
  white-space:nowrap !important;
}

.sh-tbl thead th:first-child{
  background:#fff !important;
  text-align:left !important;
}

.sh-tbl thead th:first-child{border-top-left-radius:12px !important}
.sh-tbl thead th:last-child{border-top-right-radius:12px !important}

/* ── РЕДОВЕТЕ ── */
.sh-tbl tbody td{
  background:transparent !important;
  color:#1d2a38 !important;
  font-size:14px !important;
  text-align:center !important;
  padding:11px 12px !important;
  border:0 !important;
  border-bottom:1px solid #f0f3ec !important;
}

.sh-tbl tbody td:first-child{
  text-align:left !important;
  color:#3c4654 !important;
}

.sh-tbl tbody td:first-child b{
  font-weight:600 !important;
  color:#1d2a38 !important;
}

/* Редуващ се фон · окото не губи реда при много колони. */
.sh-tbl tbody tr:nth-child(even) td{
  background:#fafbf7 !important;
}

/* Ховърът е бледозелен, не черен. */
.sh-tbl tbody tr:hover td{
  background:#f2f8e6 !important;
}

/* ── КОЛОНАТА „НАЙ-ДОБЪР“ ── */
.sh-tbl th.best{
  background:#e8f4d0 !important;
  color:#2f5200 !important;
}

.sh-tbl td.best{
  background:#f3f9e4 !important;
  font-weight:700 !important;
}

.sh-tbl tbody tr:hover td.best{
  background:#eaf5d2 !important;
}

/* ── ОТМЕТКИТЕ ── */
.sh-tbl i.yes,
.sh-tbl i.no{
  font-style:normal !important;
  font-weight:800 !important;
  font-size:14px !important;
}

.sh-tbl i.yes{color:#6aa300 !important}
.sh-tbl i.no{color:#c3cbd4 !important}

/* Тиретата да не тежат колкото числата. */
.sh-tbl tbody td.mono{
  font-variant-numeric:tabular-nums !important;
}

/* ── ПОСЛЕДНИЯТ РЕД · цената ── */
.sh-tbl tbody tr:last-child td{
  background:#f4f8ec !important;
  border-bottom:0 !important;
  padding-top:14px !important;
  padding-bottom:14px !important;
}

.sh-tbl tbody tr:last-child td b{
  font-size:16px !important;
  color:#3f6b00 !important;
}

.sh-tbl tbody tr:last-child td:first-child{border-bottom-left-radius:12px !important}
.sh-tbl tbody tr:last-child td:last-child{border-bottom-right-radius:12px !important}

/* ── БУТОНЪТ „ПОКАЖИ ВСИЧКИ“ ── */
.sh-more{
  background:#fff !important;
  color:#3f6b00 !important;
  border:1px solid #cfe0a8 !important;
  border-radius:100px !important;
  box-shadow:0 6px 16px rgba(14,39,69,.08) !important;
  font:800 13.5px/1 var(--sans) !important;
  padding:11px 20px !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
}

.sh-more:hover{
  background:#f4f8ec !important;
  border-color:#a8cc63 !important;
  color:#2f5200 !important;
}

.sh-more svg{width:16px;height:16px}

/* таблица · по-тъмно зелено и светъл ховър над всичко */
/*
 * Ховърът се задава на РЕДА, на клетките и на таблицата поотделно,
 * защото по-нагоре тъмният фон идва от няколко различни селектора.
 * Дългият селектор е нарочен · трябва да е по-специфичен от тях.
 */
.sh-tbl table tbody tr:hover,
.sh-tbl table tbody tr:hover td,
.sh-tbl tbody tr:hover,
.sh-tbl tbody tr:hover td{
  background:#f2f8e6 !important;
  color:#1d2a38 !important;
}

.sh-tbl table tbody tr:hover td.best,
.sh-tbl tbody tr:hover td.best{
  background:#e6f3cb !important;
}

.sh-tbl table tbody tr:hover td b,
.sh-tbl tbody tr:hover td b{
  color:#16212f !important;
}

/* ── ПО-ТЪМНО ЗЕЛЕНО ── */
.sh-tbl thead th{
  color:#2c4c00 !important;
  background:#eef5dd !important;
}

.sh-tbl thead th.best{
  background:#ddeeba !important;
  color:#243f00 !important;
}

.sh-tbl tbody tr:last-child td b{
  color:#2c4c00 !important;
}

.sh-tbl i.yes{color:#3f6b00 !important}

/* Числата стават по-тъмни и по-плътни, за да се четат отдалеч. */
.sh-tbl tbody td.mono{
  color:#16212f !important;
  font-weight:600 !important;
}

.sh-tbl tbody td.best,
.sh-tbl tbody td.mono.best{
  color:#243f00 !important;
  font-weight:700 !important;
}

.sh-more{color:#2c4c00 !important}
.sh-more:hover{color:#243f00 !important;background:#eef5dd !important}

/* таблица · ховърът светъл при всички варианти на селектора */
/*
 * По-нагоре тъмният ховър се задава с осем различни селектора, част от
 * които са по-специфични от обикновеното „tr:hover td“ · например
 * „tr:last-child:hover > td“ и „td:first-child b“.
 *
 * Тук всеки от тях е повторен с добавено „table“ · това дава един
 * елемент повече специфичност и правилото минава над оригинала.
 */
.sh-tbl table tbody tr:hover > td,
.sh-tbl table tbody tr:hover > td:first-child,
.sh-tbl table tbody tr:hover > td.mono{
  background:#f2f8e6 !important;
  color:#16212f !important;
}

.sh-tbl table tbody tr:hover > td:first-child b,
.sh-tbl table tbody tr:hover > td b{
  color:#16212f !important;
}

.sh-tbl table tbody tr:hover > td.best{
  background:#e6f3cb !important;
  color:#243f00 !important;
}

/* Редът с цената · и той светъл при посочване. */
.sh-tbl table tbody tr:last-child:hover > td,
.sh-tbl table tbody tr:last-child:hover > td:first-child{
  background:#eef5dd !important;
  color:#16212f !important;
}

.sh-tbl table tbody tr:last-child:hover > td.best{
  background:#ddeeba !important;
}

.sh-tbl table tbody tr:last-child:hover > td:not(:first-child) b,
.sh-tbl table tbody tr:last-child:hover > td b{
  color:#243f00 !important;
}

/* таблица · редът с цената светъл и с тъмнозелен текст */
/*
 * Редът „На месец“ идваше с тъмен фон от по-горно правило · тук фонът е
 * бледозелен, а числата и надписът са в тъмнозелено, и то преди ховър.
 * Селекторът пак носи „table“, за да е по-специфичен от оригинала.
 */
.sh-tbl table tbody tr:last-child > td,
.sh-tbl table tbody tr:last-child > td:first-child,
.sh-tbl table tbody tr:last-child > td.mono{
  background:#eef5dd !important;
  color:#243f00 !important;
  border-bottom:0 !important;
}

.sh-tbl table tbody tr:last-child > td.best{
  background:#ddeeba !important;
}

.sh-tbl table tbody tr:last-child > td b,
.sh-tbl table tbody tr:last-child > td:first-child b,
.sh-tbl table tbody tr:last-child > td:not(:first-child) b{
  color:#243f00 !important;
  font-weight:800 !important;
}

/* таблица · еднакви колони в главата и тялото */
/*
 * thead и tbody са с display:table · тоест две отделни таблици, всяка от
 * които мери колоните по своето съдържание. Оттам идва разминаването.
 *
 * table-layout:fixed изключва измерването по съдържание, а зададените
 * проценти правят колоните еднакви и в двете. 32% + 4 x 17% = 100%.
 */
.sh-tbl thead,
.sh-tbl tbody{
  table-layout:fixed !important;
  width:100% !important;
}

.sh-tbl thead th:first-child,
.sh-tbl tbody td:first-child{
  width:32% !important;
}

.sh-tbl thead th:not(:first-child),
.sh-tbl tbody td:not(:first-child){
  width:17% !important;
}

/* При фиксирани колони дългите надписи трябва да могат да се пренасят. */
.sh-tbl tbody td:first-child,
.sh-tbl tbody td:first-child b{
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}

/* всички тъмни глави · същият градиент като началната */
/*
 * Всички глави на вътрешните страници бяха плътен тъмносин цвят.
 * Тук получават същия фон като началната: два меки кръга и диагонален
 * преход към зеленото на бранда.
 *
 * Списъкът е съставен автоматично от файла · това са класовете, чийто
 * фон беше var(--navy).
 */
.ded-hero,
.sh-hero,
.wp-hero,
.bz-hero,
.rs-hero,
.vp-hero,
.mv-hero,
.dd-hero,
.sl-hero,
.kt-hero,
.zn-hero,
.kb-hero,
.ou-hero,
.pv-hero,
.ap-hero,
.hero-art{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(1100px 620px at 84% -12%, rgba(194,86,47,.34), transparent 62%),
    radial-gradient(760px 420px at 6% 108%, rgba(184,134,43,.18), transparent 58%),
    linear-gradient(178deg, #1A1411 0%, var(--navy) 48%, #7cbf00 100%) !important;
  color:#fff !important;
}

/* Ситните точки отгоре · маската ги избледнява към краищата. */
.ded-hero::before,
.sh-hero::before,
.wp-hero::before,
.bz-hero::before,
.rs-hero::before,
.vp-hero::before,
.mv-hero::before,
.dd-hero::before,
.sl-hero::before,
.kt-hero::before,
.zn-hero::before,
.kb-hero::before,
.ou-hero::before,
.pv-hero::before,
.ap-hero::before,
.hero-art::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.07) 1.2px, transparent 1.2px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(closest-side at 50% 40%, #000 40%, transparent 100%);
  mask-image:radial-gradient(closest-side at 50% 40%, #000 40%, transparent 100%);
}

/* Съдържанието остава над точките. */
.ded-hero > .wrap-w,
.sh-hero > .wrap-w,
.wp-hero > .wrap-w,
.bz-hero > .wrap-w,
.rs-hero > .wrap-w,
.vp-hero > .wrap-w,
.mv-hero > .wrap-w,
.dd-hero > .wrap-w,
.sl-hero > .wrap-w,
.kt-hero > .wrap-w,
.zn-hero > .wrap-w,
.kb-hero > .wrap-w,
.ou-hero > .wrap-w,
.pv-hero > .wrap-w,
.ap-hero > .wrap-w,
.hero-art > .wrap-w{
  position:relative;
  z-index:1;
}

/* WordPress глава · бележката под стъпките в бяло */
/*
 * Бележката беше с тъмен текст · върху новия градиент не се чете.
 * Бялото е с малко прозрачност за обикновения текст и плътно за
 * удебелената част, за да има разлика между двете.
 */
.wp-flow-note{
  color:rgba(255,255,255,.82) !important;
}

.wp-flow-note b{
  color:#fff !important;
}

/* дребният ред под заглавието на плановете */
/* По-дребен и по-светъл · той е уточнение, не част от офертата. */
.plans-note{
  margin:8px 0 0 !important;
  font-size:13.5px !important;
  line-height:1.5 !important;
  opacity:.75 !important;
}

/* светлите секции · четим цвят и нов вид на включеното във всеки план */
/*
 * По-нагоре има section.sec.sec-wash{color:#7cbf00} · светлозелено върху
 * светъл фон не се чете. Тук цветът става тъмнозелен.
 */
section.sec.sec-wash{
  color:#2c4c00 !important;
}

/* ── ГЛАВАТА НА БЛОКА ── */
.wp-all-h{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  flex-wrap:wrap !important;
  margin-bottom:16px !important;
}

.wp-all-h b{
  font:800 clamp(1.15rem,2.2vw,1.6rem)/1.25 var(--sans) !important;
  letter-spacing:-.025em !important;
  color:#243f00 !important;
}

/* ── УВОДЪТ ── */
.wp-all-intro{
  max-width:92ch !important;
  color:#3c4654 !important;
  font-size:15px !important;
  line-height:1.72 !important;
}

/*
 * ── ТОЧКИТЕ КАТО КАРТИ ──
 *
 * Дотук бяха редове в списък · при десет точки с описания това става
 * стена от текст. Картите дават граница между тях и позволяват две
 * колони, без редовете да се сливат.
 */
.wp-all-l{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(340px,1fr)) !important;
  gap:14px !important;
}

.wp-all-l > div{
  display:flex !important;
  align-items:flex-start !important;
  gap:12px !important;
  background:#fff !important;
  border:1px solid #e6ebe2 !important;
  border-radius:14px !important;
  padding:16px 18px !important;
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

.wp-all-l > div:hover{
  border-color:#cfe0a8 !important;
  box-shadow:0 8px 22px rgba(14,39,69,.07) !important;
  transform:translateY(-2px) !important;
}

/* Отметката стои в зелено кръгче · вижда се веднага кое е включено. */
.wp-all-l .wp-fi{
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:26px !important;
  height:26px !important;
  border-radius:50% !important;
  background:#eef5dd !important;
  color:#3f6b00 !important;
  margin-top:1px !important;
}

.wp-all-l .wp-fi svg{width:15px;height:15px}

.wp-all-l b{
  display:block !important;
  font:700 14.5px/1.4 var(--sans) !important;
  color:#243f00 !important;
  margin-bottom:5px !important;
}

.wp-all-l small{
  display:block !important;
  font-size:13px !important;
  line-height:1.62 !important;
  color:#4b5563 !important;
}

/* ── ЗАКЛЮЧЕНИЕТО ── */
.wp-all-foot{
  margin-top:clamp(20px,2.6vw,28px) !important;
  padding:16px 18px !important;
  border:0 !important;
  border-left:3px solid #7cbf00 !important;
  border-radius:0 12px 12px 0 !important;
  background:#f6faee !important;
  font-size:14.5px !important;
  line-height:1.7 !important;
  color:#3c4654 !important;
}

.wp-all-foot b{color:#243f00 !important}

/* WordPress · уводът и снимката в две колони */
/*
 * Текстът заема свободното място, снимката е с таван 400px и се изравнява
 * по средата на текста. min-width:0 позволява на текстовата колона да се
 * свива, вместо да избутва снимката.
 */
.wp-all-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,400px);
  gap:clamp(20px,3vw,36px);
  align-items:center;
  margin-bottom:clamp(20px,2.6vw,28px);
}

.wp-all-txt{min-width:0}

.wp-all-txt .wp-all-intro:last-child{margin-bottom:0 !important}

.wp-all-img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  border-radius:14px;
  box-shadow:0 12px 28px rgba(14,39,69,.10);
}

/* Под 860px снимката минава под текста и се ограничава по ширина. */
@media (max-width:860px){
  .wp-all-top{grid-template-columns:1fr}
  .wp-all-img{max-width:460px;margin:0 auto}
}

/* WordPress · снимката до увода по-голяма */
/*
 * Снимката имаше таван 400px · сега двете колони са равни половини,
 * тоест снимката е широка колкото около два бокса от мрежата под нея.
 */
.wp-all-top{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  align-items:center !important;
}

.wp-all-img{
  max-width:none !important;
  width:100% !important;
}

@media (max-width:860px){
  .wp-all-top{grid-template-columns:1fr !important}
  .wp-all-img{max-width:520px !important;margin:0 auto !important}
}

/* WordPress · снимката заема 60% от реда */
/*
 * Съотношението става 40 / 60 в полза на снимката · тя вече е по-широка
 * от текстовата колона. По-нататък се променя само с тези две числа.
 */
.wp-all-top{
  grid-template-columns:minmax(0,40fr) minmax(0,60fr) !important;
}

@media (max-width:860px){
  .wp-all-top{grid-template-columns:1fr !important}
}

/* WordPress · сигурността · текст и снимка в две колони */
/*
 * Съотношението е 40 / 60 в полза на снимката · същото като в блока
 * „включено във всеки план“, за да изглеждат двете секции като едно.
 */
.wp-sec-top{
  display:grid;
  grid-template-columns:minmax(0,40fr) minmax(0,60fr);
  gap:clamp(20px,3vw,36px);
  align-items:center;
  margin-bottom:clamp(22px,2.8vw,32px);
}

.wp-sec-top .wp-head{
  margin:0 !important;
  min-width:0;
}

.wp-sec-img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  border-radius:14px;
  box-shadow:0 12px 28px rgba(14,39,69,.10);
}

@media (max-width:860px){
  .wp-sec-top{grid-template-columns:1fr}
  .wp-sec-img{max-width:520px;margin:0 auto}
}

/* WordPress · защитата · боксовете под текста, снимката вдясно */
/*
 * Сега лявата колона носи заглавието, увода и четирите бокса · затова е
 * по-широка от снимката. align-items:start залепва снимката горе, а
 * position:sticky я държи видима, докато се чете списъкът.
 */
.wp-sec-top{
  grid-template-columns:minmax(0,58fr) minmax(0,42fr) !important;
  align-items:start !important;
}

.wp-sec-txt{min-width:0}

.wp-sec-top .wp-head{margin:0 0 18px !important}

/* В по-тясната колона боксовете стоят един под друг. */
.wp-sec-top .wp-shield{
  grid-template-columns:1fr !important;
  gap:12px !important;
}

.wp-sec-img{
  position:sticky;
  top:96px;
}

@media (max-width:860px){
  .wp-sec-top{grid-template-columns:1fr !important}
  .wp-sec-img{position:static;max-width:520px;margin:0 auto}
}

/* WordPress · защитата · снимката по-голяма, боксовете по-тесни */
/*
 * Съотношението беше 58 / 42 в полза на текста · сега е обратното:
 * снимката взима повече, а колоната с боксовете се стеснява.
 */
.wp-sec-top{
  grid-template-columns:minmax(0,44fr) minmax(0,56fr) !important;
}

@media (max-width:860px){
  .wp-sec-top{grid-template-columns:1fr !important}
}

/* WordPress · заглавията и текстовете на секциите по цялата ширина */
/*
 * .wp-head е стеснен на няколко места, част от които с по-специфични
 * селектори (div.wrap-w .wp-head). Затова тук селекторът е също толкова
 * специфичен и с !important.
 *
 * В двуколонните редове (.wp-sec-top) главата и без това е в своя колона,
 * така че 100% значи ширината на колоната, не на секцията.
 */
div.wrap-w .wp-head,
section .wp-head,
.wp-head{
  max-width:none !important;
  width:100% !important;
}

div.wrap-w .wp-head > p,
section .wp-head > p,
.wp-head > p{
  max-width:none !important;
  width:100% !important;
}

/* WordPress · преместването · текстът по цялата ширина на колоната */
/*
 * Абзаците в лявата колона бяха стеснени · сега заемат цялата ѝ ширина,
 * както в блоковете по-горе. Двата абзаца получават и разстояние между
 * себе си.
 */
.wp-move > div > p,
.wp-move h2{
  max-width:none !important;
  width:100% !important;
}

.wp-move > div > p + p{
  margin-top:12px !important;
}


/* ─────────── RS-VISUAL · hero, вместо сметката ─────────── */
.rs-visual{
  position:relative;
  padding:28px;
  border:1px solid rgba(20,30,45,.09);
  border-radius:24px;
  background:
    radial-gradient(circle at 85% 10%, rgba(225,72,112,.12), transparent 35%),
    linear-gradient(145deg,#fff 0%,#f8fafc 100%);
  box-shadow:0 20px 60px rgba(20,30,45,.08);
  overflow:hidden;
}

.rs-visual-head{margin-bottom:24px}

.rs-visual-badge{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  margin-bottom:12px;
  border-radius:999px;
  background:rgba(225,72,112,.09);
  color:#c63d68;
  font-size:12px;
  font-weight:700;
  letter-spacing:.02em;
}

.rs-hero .rs-visual .rs-visual-head h2{
  margin:0 0 8px;
  font-size:28px;
  line-height:1.1;
  letter-spacing:-.03em;
  color:#18202b;
  text-align:left;
}

.rs-hero .rs-visual .rs-visual-head p{
  margin:0;
  color:#687180;
  font-size:14px;
  line-height:1.5;
  text-align:left;
}

.rs-visual-flow{display:flex;flex-direction:column;gap:0}

.rs-visual-card{
  display:flex;
  align-items:center;
  gap:13px;
  padding:15px;
  border:1px solid rgba(20,30,45,.08);
  border-radius:15px;
  background:#fff;
  box-shadow:0 5px 18px rgba(20,30,45,.045);
}

.rs-hero .rs-visual .rs-visual-card b{
  display:block;
  margin-bottom:3px;
  font-size:14px;
  color:#18202b;
}

.rs-hero .rs-visual .rs-visual-card div span{
  display:block;
  color:#7b8491;
  font-size:12px;
  line-height:1.35;
}

.rs-visual-icon{
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:grid;
  place-items:center;
  border-radius:11px;
  color:#c63d68;
  background:rgba(225,72,112,.09);
}

.rs-visual-icon svg{width:21px;height:21px}

.rs-clients .rs-visual-icon{color:#5267d9;background:rgba(82,103,217,.09)}
.rs-infra .rs-visual-icon{color:#198b68;background:rgba(25,139,104,.09)}

.rs-visual-line{
  height:22px;
  position:relative;
  margin-left:34px;
  border-left:1px dashed rgba(20,30,45,.18);
}

.rs-visual-line span{
  position:absolute;
  left:-3px;
  bottom:-1px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#c63d68;
}

.rs-hero .rs-visual .rs-visual-note{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:20px;
  padding-top:18px;
  border-top:1px solid rgba(20,30,45,.08);
  color:#596371;
  font-size:12px;
  line-height:1.4;
}

.rs-hero .rs-visual .rs-visual-check{
  width:20px;
  height:20px;
  flex:0 0 20px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#e9f8f1;
  color:#198b68;
  font-size:12px;
  font-weight:800;
}

@media (max-width:700px){
  .rs-visual{padding:22px;border-radius:20px}
  .rs-hero .rs-visual .rs-visual-head h2{font-size:24px}
}


/* ─────────── RS-VISUAL · оеднаквен с хеда ─────────── */
/*
 * Боксът е стъклен като стария бокс на сметката: същите
 * rgba(255,255,255,…) тонове, същият радиус и padding, зеленото
 * на тикчетата от .rs-notes. Бялата карта висеше като чуждо тяло.
 */
.rs-visual{
  padding:22px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-lg, 16px);
  background:rgba(255,255,255,.05);
  box-shadow:none;
}

.rs-visual-head{margin-bottom:18px}

.rs-visual-badge{
  display:inline-flex;
  align-items:center;
  padding:5px 10px;
  margin-bottom:12px;
  border-radius:999px;
  background:rgba(152,219,28,.14);
  color:#98db1c;
  font:700 12px/1 var(--sans);
  letter-spacing:.06em;
  text-transform:uppercase;
}

.rs-hero .rs-visual .rs-visual-head h2{
  margin:0 0 8px;
  font-size:clamp(22px,2.4vw,28px);
  line-height:1.12;
  letter-spacing:-.03em;
  color:#fff;
  text-align:left;
}

.rs-hero .rs-visual .rs-visual-head p{
  margin:0;
  color:rgba(255,255,255,.58);
  font-size:13px;
  line-height:1.55;
  text-align:left;
}

.rs-visual-card{
  gap:12px;
  padding:13px 14px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  box-shadow:none;
}

.rs-hero .rs-visual .rs-visual-card b{
  margin-bottom:3px;
  font:600 14px/1.2 var(--sans);
  color:#fff;
}

.rs-hero .rs-visual .rs-visual-card div span{
  color:rgba(255,255,255,.5);
  font-size:12px;
  line-height:1.4;
}

.rs-visual-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:10px;
  background:rgba(152,219,28,.14);
  color:#98db1c;
}

.rs-clients .rs-visual-icon{background:rgba(111,217,172,.14);color:#6FD9AC}
.rs-infra .rs-visual-icon{background:rgba(255,255,255,.08);color:#fff}

.rs-visual-line{
  margin-left:32px;
  border-left:1px dashed rgba(255,255,255,.18);
}

.rs-visual-line span{background:#98db1c}

.rs-hero .rs-visual .rs-visual-note{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.45);
  font-size:11.5px;
  line-height:1.55;
}

.rs-hero .rs-visual .rs-visual-check{
  width:18px;
  height:18px;
  flex:0 0 18px;
  background:rgb(152 219 28);
  color:#000;
  font-size:11px;
  font-weight:800;
}

@media (max-width:700px){
  .rs-visual{padding:18px;border-radius:14px}
  .rs-hero .rs-visual .rs-visual-head h2{font-size:22px}
}


/* ─────────── RS-HEAD · от край до край ─────────── */
/*
 * Селекторите са огледални на по-горните и с !important, защото
 * там главата е стеснена с max-width — иначе по-специфичното печели.
 */
div.wrap-w .rs-head,
section .rs-head,
section.sec .rs-head,
.rs-head{
  max-width:none !important;
  width:100% !important;
}

div.wrap-w .rs-head.mid,
section .rs-head.mid,
.rs-head.mid{
  max-width:none !important;
  width:100% !important;
  margin-inline:auto;
}


/* ─────────── RS-HEAD · над :has() правилата ─────────── */
/*
 * По-горе стоят:
 *   section.sec:has(.rs-white) .rs-head{max-width:760px !important}
 *   section.sec:has(.rs-who)   .rs-head{max-width:720px !important}
 *   section.sec.sec-wash:has(.rs-vs) .rs-head{max-width:760px !important}
 * Специфичността им е по-висока от предишния ми блок, а и двете са с
 * „important“ — затова тук класът .sec е повторен: това вдига
 * специфичността, без да променя кои елементи се хващат.
 */
section.sec.sec:has(.rs-white) .rs-head,
section.sec.sec:has(.rs-who) .rs-head,
section.sec.sec:has(.rs-revs) .rs-head,
section.sec.sec.sec-wash:has(.rs-vs) .rs-head{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}


/* ─────────── RS-WHITE-BOX · разширеният макет ─────────── */
.rs-white-header{
  margin:14px 0;
  padding-bottom:12px;
  border-bottom:1px solid rgba(20,30,45,.08);
}

.rs-white-header b{
  display:block;
  margin-bottom:6px;
  font:800 15px/1.3 var(--sans);
  letter-spacing:-.01em;
  color:var(--ink);
}

.rs-white-header p{
  margin:0;
  font-size:12px;
  line-height:1.55;
  color:var(--ink-2);
}

.rs-white-box .rs-white-r{align-items:flex-start;gap:12px}

.rs-white-box .rs-white-r span b{
  display:block;
  margin-bottom:3px;
  font:600 12.5px/1.3 var(--sans);
  color:var(--ink);
  white-space:normal;
}

.rs-white-box .rs-white-r small{
  display:block;
  font-size:11px;
  line-height:1.45;
  color:var(--ink-2);
}

.rs-white-features{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(20,30,45,.08);
}

.rs-white-ft{
  display:block;
  margin-bottom:9px;
  font:700 12.5px/1.3 var(--sans);
  color:var(--ink);
}

.rs-white-features ul{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:7px;
}

.rs-white-features li{
  position:relative;
  padding-left:16px;
  font-size:11.5px;
  line-height:1.5;
  color:var(--ink-2);
}

.rs-white-features li::before{
  content:"";
  position:absolute;
  left:0;
  top:6px;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#7cbf00;
}

.rs-white-features li b{color:var(--ink);font-weight:700}

.rs-white-cta{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  margin-top:15px;
}

.rs-btn-primary,
.rs-btn-secondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:9px 14px;
  border-radius:10px;
  font:700 12px/1 var(--sans);
}

.rs-btn-primary{background:#7cbf00;color:#0f1a05}
.rs-btn-secondary{background:transparent;border:1px solid rgba(20,30,45,.16);color:var(--ink)}


/* ─────────── RS-WHITE-CTA · връзки ─────────── */
.rs-white-cta a.rs-btn-primary,
.rs-white-cta a.rs-btn-secondary{
  text-decoration:none;
  transition:filter .16s ease, background .16s ease;
}

.rs-white-cta a.rs-btn-primary:hover{filter:brightness(1.06)}
.rs-white-cta a.rs-btn-secondary:hover{background:rgba(20,30,45,.05)}

.rs-white-cta a:focus-visible{outline:2px solid #7cbf00;outline-offset:3px}


/* ─────────── RS-VS-H · заглавия h3 ─────────── */
/* Колонните заглавия вече са <h3> заради структурата за
 * търсачките. Видът е буквално копиран от .rs-vs-h b. */
.rs-vs-h h3{margin:0;flex:1;font:700 15px/1.3 var(--sans)}


/* ─────────── RS-VS-H · h3 в бяло ─────────── */
/* Разделът е с тъмен фон: h3 наследяваше тъмния цвят от общото
 * правило за заглавия и не се четеше. */
section.sec.sec-wash:has(.rs-vs) .rs-vs-h h3,
section.sec:has(.rs-vs) .rs-vs-h h3,
.rs-vs-h h3{
  color:#fff !important;
}


/* ─────────── RS-BADGES · условията над плановете ─────────── */
.rs-features-badge-group{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin:0 0 clamp(24px,3vw,34px);
}

.rs-badge-item{
  display:flex;
  align-items:flex-start;
  gap:11px;
  padding:15px 16px;
  border:1px solid rgba(20,30,45,.09);
  border-radius:14px;
  background:#fff;
  box-shadow:0 4px 16px rgba(20,30,45,.04);
  font-size:13.5px;
  line-height:1.55;
  color:#3f6b00;
}

.rs-badge-item b{color:#2c4c00;font-weight:700}

.rs-badge-icon{
  width:22px;
  height:22px;
  flex:0 0 22px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgb(152 219 28);
  color:#0f1a05;
  font:800 12px/1 var(--sans);
}

.rs-head .rs-subtitle b{color:#2c4c00;font-weight:700}

@media (max-width:900px){
  .rs-features-badge-group{grid-template-columns:1fr}
}


/* ─────────── RS-ALL · h3 и точки с описание ─────────── */
/* Заглавието стана <h3> заради структурата; видът е копиран от
 * .rs-all-h b. Точките вече имат <b> начало и по-дълъг текст. */
.rs-all-h h3{margin:0;font:700 15px/1.3 var(--sans)}

.rs-all-l > div{align-items:flex-start}
.rs-all-l > div > span:last-child{line-height:1.55}
.rs-all-l b{font-weight:700}


/* ─────────── RS-ALL · снимка до списъка ─────────── */
.rs-all-top{
  display:grid;
  grid-template-columns:minmax(0,58fr) minmax(0,42fr);
  gap:clamp(18px,3vw,34px);
  align-items:start;
}

.rs-all-top .rs-all-l{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px 22px;
}

.rs-all-img{
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 50px rgba(0,0,0,.22);
}

@media (max-width:1100px){
  .rs-all-top{grid-template-columns:1fr}
  .rs-all-img{order:-1}
}

@media (max-width:700px){
  .rs-all-top .rs-all-l{grid-template-columns:1fr}
}


/* ─────────── RS-ALL · подзаглавие ─────────── */
/* Цветът е inherit с прозрачност, за да е четимо и на светъл,
 * и на тъмен фон — без да залагам конкретен цвят. */
.rs-all-sub{
  margin:8px 0 clamp(16px,2.2vw,24px);
  font-size:14.5px;
  line-height:1.6;
  color:inherit;
  opacity:.72;
}


/* ─────────── RS-WHO · h3 и точки с описание ─────────── */
.rs-who-h h3{margin:0;font:700 15px/1.3 var(--sans)}

.rs-who-l li{align-items:flex-start}
.rs-who-l li span{line-height:1.55}
.rs-who-l b{font-weight:700}


/* ─────────── RS-WHITE-BOX · панел без цени ─────────── */
.rs-white-demo{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-bottom:12px;
  padding:5px 10px;
  border-radius:999px;
  background:rgba(124,191,0,.12);
  color:#3f6b00;
  font:700 10.5px/1 var(--sans);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.rs-white-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
  margin:0 0 14px;
}

.rs-white-stat{
  padding:11px 12px;
  border:1px solid rgba(20,30,45,.08);
  border-radius:12px;
  background:rgba(20,30,45,.02);
  text-align:center;
}

.rs-white-stat b{
  display:block;
  font:800 17px/1 var(--mono);
  letter-spacing:-.02em;
  color:var(--ink);
}

.rs-white-stat span{
  display:block;
  margin-top:4px;
  font-size:10.5px;
  line-height:1.3;
  color:var(--ink-2);
}

.rs-white-st{
  flex:0 0 auto;
  padding:4px 9px;
  border-radius:999px;
  font:700 10.5px/1.35 var(--sans);
  white-space:nowrap;
}

.rs-white-st.is-ok{background:rgba(124,191,0,.14);color:#3f6b00}
.rs-white-st.is-info{background:rgba(20,30,45,.06);color:#46525f}

/* Редовете реагират на посочване · панелът изглежда жив. */
.rs-white-box .rs-white-r{
  padding:11px 12px;
  border:1px solid rgba(20,30,45,.07);
  border-radius:12px;
  background:#fff;
  transition:border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.rs-white-box .rs-white-r:hover{
  border-color:rgba(124,191,0,.5);
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(20,30,45,.06);
}

@media (max-width:520px){
  .rs-white-stats{grid-template-columns:1fr}
}


/* ─────────── RS-WHITE · от край до край ─────────── */
/*
 * По-горе стои section.sec:has(.rs-white) .wrap-w{max-width:1200px !important},
 * а останалите раздели са на 1680px. Класът .sec е повторен, за да вдигне
 * специфичността над онова правило.
 */
section.sec.sec:has(.rs-white) .wrap-w{
  max-width:1680px !important;
  margin-inline:auto !important;
}

section.sec.sec:has(.rs-white) .rs-white{
  width:100% !important;
  max-width:none !important;
}


/* ─────────── RS-WHITE-IMG · снимка под боксовете ─────────── */
.rs-white-img{
  grid-column:1 / -1;
  width:100%;
  height:auto;
  margin-top:clamp(18px,2.6vw,30px);
  aspect-ratio:16/9;
  object-fit:cover;
  border-radius:18px;
  border:1px solid rgba(20,30,45,.09);
  box-shadow:0 16px 44px rgba(20,30,45,.10);
}

@media (max-width:700px){
  .rs-white-img{border-radius:14px;aspect-ratio:4/3}
}


/* ─────────── RS-WHITE · три колони на един ред ─────────── */
/*
 * Снимката вече не е под боксовете, а е трета колона на същия ред:
 * панел · текст · снимка. Затова е и по-малка.
 */
section.sec.sec:has(.rs-white) .rs-white{
  display:grid !important;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,.62fr) !important;
  gap:clamp(16px,2.2vw,28px) !important;
  align-items:start !important;
}

section.sec.sec:has(.rs-white) .rs-white-img{
  grid-column:auto !important;
  margin-top:0 !important;
  width:100% !important;
  aspect-ratio:3 / 4 !important;
  object-fit:cover;
  border-radius:16px;
}

@media (max-width:1200px){
  section.sec.sec:has(.rs-white) .rs-white{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  }

  section.sec.sec:has(.rs-white) .rs-white-img{
    grid-column:1 / -1 !important;
    aspect-ratio:16 / 9 !important;
    max-width:760px;
    margin-inline:auto !important;
  }
}

@media (max-width:760px){
  section.sec.sec:has(.rs-white) .rs-white{
    grid-template-columns:1fr !important;
  }

  section.sec.sec:has(.rs-white) .rs-white-img{
    aspect-ratio:4 / 3 !important;
    max-width:none;
  }
}


/* ─────────── RS-WHITE-IMG · до долния край на реда ─────────── */
/*
 * Съотношението се маха: снимката се разтяга на височината на реда,
 * тоест до долния край на панела, а изрязването пази кадъра.
 */
section.sec.sec:has(.rs-white) .rs-white-img{
  align-self:stretch !important;
  height:100% !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  object-fit:cover;
  object-position:center;
}

@media (max-width:1200px){
  section.sec.sec:has(.rs-white) .rs-white-img{
    align-self:auto !important;
    height:auto !important;
    aspect-ratio:16 / 9 !important;
  }
}

@media (max-width:760px){
  section.sec.sec:has(.rs-white) .rs-white-img{
    aspect-ratio:4 / 3 !important;
  }
}


/* ─────────── VP-FORK-H · заглавия h3 ─────────── */
/* Заглавията на двата варианта станаха <h3> заради структурата;
 * видът е копиран от .vp-fork-h b. */
.vp-fork-h h3{margin:0;flex:1;font:800 1.15rem/1.2 var(--sans);letter-spacing:-.02em}


/* ─────────── VP-HEAD · от край до край ─────────── */
/*
 * Главите на VPS разделите са стеснени с max-width на няколко места,
 * част от тях с :has() селектори и „important“. Затова тук класът .sec
 * е повторен — вдига специфичността, без да променя кои елементи хваща.
 */
section.sec.sec:has(.vp-fork) .vp-head,
section.sec.sec:has(.vp-grow) .vp-head,
section.sec.sec:has(.vp-plans) .vp-head,
div.wrap-w .vp-head,
section .vp-head,
.vp-head{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

div.wrap-w .vp-head.mid,
section .vp-head.mid,
.vp-head.mid{
  max-width:none !important;
  width:100% !important;
  margin-inline:auto !important;
}

div.wrap-w .vp-head > p,
section .vp-head > p,
.vp-head > p{
  max-width:none !important;
  width:100% !important;
}


/* ─────────── VP-HEAD · подравняване вляво ─────────── */
/*
 * Ширината вече е пълна, но по-горните правила слагат text-align:center
 * (section.sec:has(.vp-fork), :has(.vp-grow) и общото section.sec .vp-head).
 * Класът .sec е повторен, за да вдигне специфичността над тях. Главите с
 * клас .mid остават центрирани нарочно.
 */
section.sec.sec:has(.vp-fork) .vp-head:not(.mid),
section.sec.sec:has(.vp-grow) .vp-head:not(.mid),
section.sec.sec .vp-head:not(.mid){
  text-align:left !important;
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

section.sec.sec .vp-head:not(.mid) h2,
section.sec.sec .vp-head:not(.mid) p{
  text-align:left !important;
  max-width:none !important;
  width:100% !important;
  margin-inline:0 !important;
}


/* ─────────── VP-ALL · h3, точки с описание и снимка ─────────── */
.vp-all-h h3{margin:0;font:700 15px/1.3 var(--sans)}

.vp-all-top{
  display:grid;
  grid-template-columns:minmax(0,58fr) minmax(0,42fr);
  gap:clamp(18px,3vw,34px);
  align-items:start;
}

.vp-all-top .vp-all-l{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px 22px;
}

.vp-all-top .vp-all-l > div{align-items:flex-start}
.vp-all-top .vp-all-l > div > span:last-child{line-height:1.55}
.vp-all-l b{font-weight:700}

.vp-all-img{
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  border-radius:16px;
  border:1px solid rgba(20,30,45,.09);
  box-shadow:0 14px 40px rgba(20,30,45,.10);
}

@media (max-width:1100px){
  .vp-all-top{grid-template-columns:1fr}
  .vp-all-img{order:-1}
}

@media (max-width:700px){
  .vp-all-top .vp-all-l{grid-template-columns:1fr}
}


/* ─────────── VP-ALL · от край до край ─────────── */
/*
 * По-горе стои section.sec.vp-all-sec .wrap-w{max-width:1200px !important},
 * а останалите раздели са на 1680px. Класът .sec е повторен, за да вдигне
 * специфичността над онова правило.
 */
section.sec.sec.vp-all-sec .wrap-w{
  max-width:1680px !important;
  width:100% !important;
  margin-inline:auto !important;
}

section.sec.sec.vp-all-sec .vp-all{
  max-width:none !important;
  width:100% !important;
}


/* ─────────── VP-GROW-H · zaglavie h3 ─────────── */
/* Заглавието на бокса стана <h3> заради структурата за търсачките;
 * вижда се точно като преди, защото стиловете са на .vp-grow-h. */
.vp-grow-h h3{
  margin:0;
  font:inherit;
  color:inherit;
  letter-spacing:inherit;
}


/* ─────────── VP-GSTEP · stapki v details ─────────── */
/* Разделът е с тъмен фон, затова тоновете са бели с прозрачност. */
section.sec .vp-grow-steps{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:8px !important;
}

.vp-gstep{
  border:1px solid rgba(255,255,255,.13);
  border-radius:12px;
  background:rgba(255,255,255,.05);
  overflow:hidden;
  transition:border-color .16s ease, background .16s ease;
}

.vp-gstep:hover{border-color:rgba(152,219,28,.45);background:rgba(255,255,255,.07)}
.vp-gstep[open]{border-color:rgba(152,219,28,.45)}

.vp-gstep summary{
  display:flex;
  align-items:center;
  gap:11px;
  padding:12px 14px;
  cursor:pointer;
  list-style:none;
  color:#fff;
}

.vp-gstep summary::-webkit-details-marker{display:none}

.vp-gstep summary b{
  flex:1;
  font:600 14px/1.35 var(--sans);
  color:#fff;
}

.vp-gstep summary::after{
  content:"+";
  font:700 15px/1 var(--mono);
  color:rgb(152 219 28);
}

.vp-gstep[open] summary::after{content:"−"}

.vp-gstep-n{
  width:22px;
  height:22px;
  flex:0 0 22px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgb(152 219 28);
  color:#0f1a05;
  font:800 11px/1 var(--mono);
}

.vp-gstep p{
  margin:0;
  padding:0 14px 13px 47px;
  font-size:13px;
  line-height:1.6;
  color:rgba(255,255,255,.62);
}

@media (max-width:520px){
  .vp-gstep p{padding-left:14px}
}


/* ─────────── VP-WHERE-TOP · zaglavia h3 ─────────── */
/* Трите заглавия станаха <h3> заради структурата; видът е копиран
 * от .vp-where-top b. */
.vp-where-top h3{margin:0;flex:1;font:700 15px/1.3 var(--sans)}


/* ─────────── VP-OS · nov dizayn ─────────── */
section.sec .vp-os{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr)) !important;
  gap:12px !important;
  margin:0 0 18px !important;
}

.vp-os-i{
  display:flex !important;
  align-items:center;
  gap:12px;
  padding:14px 15px !important;
  border:1px solid rgba(20,30,45,.09) !important;
  border-radius:14px !important;
  background:#fff !important;
  box-shadow:0 4px 16px rgba(20,30,45,.045);
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.vp-os-i:hover{
  transform:translateY(-2px);
  border-color:rgba(124,191,0,.5) !important;
  box-shadow:0 10px 26px rgba(20,30,45,.08);
}

.vp-os-mark{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:grid;
  place-items:center;
  border-radius:11px;
  font:800 12.5px/1 var(--mono);
  letter-spacing:.02em;
}

.vp-os-i.is-alma   .vp-os-mark{background:rgba(31,89,158,.12);color:#1f599e}
.vp-os-i.is-ubuntu .vp-os-mark{background:rgba(233,84,32,.12);color:#c2451b}
.vp-os-i.is-debian .vp-os-mark{background:rgba(168,0,48,.12);color:#a80030}
.vp-os-i.is-rocky  .vp-os-mark{background:rgba(16,185,129,.14);color:#0b7a56}
.vp-os-i.is-win    .vp-os-mark{background:rgba(0,120,212,.12);color:#0067b8}

.vp-os-txt{display:flex;flex-direction:column;gap:5px;min-width:0}

.vp-os-txt b{
  font:700 14px/1.2 var(--sans);
  color:var(--ink);
}

.vp-os-vers{display:flex;gap:5px;flex-wrap:wrap}

.vp-os-vers i{
  padding:2px 7px;
  border-radius:999px;
  background:rgba(20,30,45,.05);
  color:var(--ink-2);
  font:600 10.5px/1.45 var(--mono);
  font-style:normal;
}

section.sec .vp-os-note{
  display:block;
  margin:0 !important;
  padding:13px 15px;
  border:1px dashed rgba(124,191,0,.45);
  border-radius:12px;
  background:rgba(124,191,0,.06);
  font-size:13.5px;
  line-height:1.6;
  color:#3f6b00;
}

section.sec .vp-os-note b{color:#2c4c00}


/* ─────────── VP-OS · shiroko i svetlo ─────────── */
/*
 * Разделът стоеше в тесния контейнер .wrap-n и на тъмен фон.
 * Тук е разпънат до 1680px като останалите и е върнат на светло.
 */
section.sec:has(.vp-os){
  background:#fff !important;
  color:var(--ink) !important;
}

section.sec:has(.vp-os)::before,
section.sec:has(.vp-os)::after{
  content:none !important;
  background:none !important;
}

section.sec:has(.vp-os) .wrap-n{
  max-width:1680px !important;
  width:100% !important;
  margin-inline:auto !important;
  padding-inline:22px !important;
}

section.sec:has(.vp-os) .vp-head h2{color:var(--ink) !important}
section.sec:has(.vp-os) .vp-head p{color:var(--ink-2) !important}


/* ─────────── VP-OS · svetli karti i interaktiven vid ─────────── */
/*
 * Селекторът е с :has(), защото по-старите правила за тъмните карти са
 * също толкова специфични — по-кратък селектор не ги пребива.
 */
section.sec:has(.vp-os) .vp-os-i{
  position:relative;
  overflow:hidden;
  background:#fff !important;
  border:1px solid rgba(20,30,45,.10) !important;
  border-radius:14px !important;
  color:var(--ink) !important;
  box-shadow:0 4px 16px rgba(20,30,45,.05) !important;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

/* Тънка цветна лента, която изплува при посочване. */
section.sec:has(.vp-os) .vp-os-i::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:currentColor;
  opacity:0;
  transition:opacity .18s ease;
}

section.sec:has(.vp-os) .vp-os-i:hover{
  transform:translateY(-3px);
  border-color:rgba(124,191,0,.55) !important;
  box-shadow:0 14px 32px rgba(20,30,45,.10) !important;
}

section.sec:has(.vp-os) .vp-os-i:hover::before{opacity:.9}

section.sec:has(.vp-os) .vp-os-i.is-alma::before{color:#1f599e}
section.sec:has(.vp-os) .vp-os-i.is-ubuntu::before{color:#e95420}
section.sec:has(.vp-os) .vp-os-i.is-debian::before{color:#a80030}
section.sec:has(.vp-os) .vp-os-i.is-rocky::before{color:#10b981}
section.sec:has(.vp-os) .vp-os-i.is-win::before{color:#0078d4}

section.sec:has(.vp-os) .vp-os-mark{
  transition:transform .18s ease;
}

section.sec:has(.vp-os) .vp-os-i:hover .vp-os-mark{transform:scale(1.08)}

section.sec:has(.vp-os) .vp-os-txt b{color:var(--ink) !important}

section.sec:has(.vp-os) .vp-os-vers i{
  background:rgba(20,30,45,.05) !important;
  color:var(--ink-2) !important;
  transition:background .18s ease, color .18s ease;
}

section.sec:has(.vp-os) .vp-os-i:hover .vp-os-vers i{
  background:rgba(124,191,0,.14) !important;
  color:#3f6b00 !important;
}


/* ─────────── VP · byala belezhka i tsentrirani karti ─────────── */
/* Бележката е в тъмния бокс на hero частта — трябва бял текст. */
section.vp-hero .vp-res-note,
.vp-res .vp-res-note,
.vp-res-note{
  color:rgba(255,255,255,.78) !important;
}

section.vp-hero .vp-res-note b,
.vp-res .vp-res-note b,
.vp-res-note b{
  color:#fff !important;
}

/* На мобилно картите със системите са центрирани. */
@media (max-width:700px){
  section.sec:has(.vp-os) .vp-os{
    grid-template-columns:1fr !important;
  }

  section.sec:has(.vp-os) .vp-os-i{
    justify-content:center !important;
    text-align:center;
  }

  section.sec:has(.vp-os) .vp-os-txt{
    align-items:center;
    flex:0 1 auto;
  }

  section.sec:has(.vp-os) .vp-os-vers{justify-content:center}
}


/* ─────────── VP-OS · znachkata otgore na mobilno ─────────── */
/* На тесен екран картата се подрежда вертикално: значка, име, версии —
 * всичко центрирано една под друга. */
@media (max-width:700px){
  section.sec:has(.vp-os) .vp-os-i{
    flex-direction:column !important;
    align-items:center !important;
    gap:10px !important;
    padding:16px 14px !important;
  }

  section.sec:has(.vp-os) .vp-os-mark{
    margin:0 auto !important;
  }

  section.sec:has(.vp-os) .vp-os-txt{
    align-items:center !important;
    text-align:center;
  }
}


/* ─────────── VP-RES · nov vid na resursite ─────────── */
/* Боксът е в тъмната hero част — тоновете са бели с прозрачност. */
.vp-res-h{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px !important;
}

.vp-res-badge{
  flex:0 0 auto;
  padding:4px 9px;
  border-radius:999px;
  background:rgba(152,219,28,.16);
  color:#98db1c;
  font:700 10px/1.4 var(--sans);
  letter-spacing:.06em;
  text-transform:uppercase;
}

.vp-res-row{
  display:flex !important;
  align-items:center;
  gap:14px;
  margin:0 0 9px !important;
  padding:13px 14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:13px;
  background:rgba(255,255,255,.05);
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}

.vp-res-row:hover{
  border-color:rgba(152,219,28,.5);
  background:rgba(255,255,255,.08);
  transform:translateX(2px);
}

.vp-res-val{
  flex:0 0 74px;
  display:flex;
  align-items:baseline;
  gap:3px;
  justify-content:center;
  padding:8px 6px;
  border-radius:11px;
  background:rgba(152,219,28,.12);
}

.vp-res-val b{
  font:800 20px/1 var(--mono);
  letter-spacing:-.03em;
  color:#98db1c;
}

.vp-res-val i{
  font:700 10.5px/1 var(--mono);
  font-style:normal;
  color:rgba(152,219,28,.8);
}

.vp-res-txt{display:flex;flex-direction:column;gap:3px;min-width:0}

.vp-res-txt b{
  font:600 14px/1.3 var(--sans);
  color:#fff;
}

.vp-res-txt small{
  font-size:12px;
  line-height:1.5;
  color:rgba(255,255,255,.58);
}

.vp-res-note{
  margin-top:14px !important;
  padding-top:13px;
  border-top:1px solid rgba(255,255,255,.12);
  font-size:12.5px;
  line-height:1.6;
}

@media (max-width:520px){
  .vp-res-row{flex-direction:column;align-items:flex-start}
  .vp-res-val{flex:0 0 auto}
}


/* ─────────── MV-NIGHT · nov interaktiven vid ─────────── */
/* Хронология на реален случай, в тъмната hero част. */
.mv-night-h{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px !important;
}

.mv-night-h span{
  font:700 11px/1.4 var(--sans);
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(255,255,255,.55);
}

.mv-night-h b{
  flex:0 0 auto;
  padding:4px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.72);
  font:700 10.5px/1.4 var(--sans);
}

.mv-night-l{display:grid;gap:7px}

.mv-night-r{
  display:grid !important;
  grid-template-columns:52px 16px 1fr;
  align-items:start;
  gap:10px;
  padding:11px 12px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}

.mv-night-r:hover{
  border-color:rgba(152,219,28,.45);
  background:rgba(255,255,255,.07);
  transform:translateX(2px);
}

.mv-night-t{
  font:700 12px/1.5 var(--mono);
  color:rgba(255,255,255,.62);
}

.mv-night-d{display:grid;place-items:center;padding-top:3px}

.mv-night-d i{
  width:9px;
  height:9px;
  border-radius:50%;
  background:rgba(255,255,255,.35);
  display:block;
}

.mv-night-r.is-bad .mv-night-d i{
  background:#ff8fab;
  box-shadow:0 0 0 0 rgba(255,143,171,.55);
  animation:mvPulse 1.9s ease-out infinite;
}

.mv-night-r.is-ok .mv-night-d i{background:rgb(152 219 28)}

@keyframes mvPulse{
  0%{box-shadow:0 0 0 0 rgba(255,143,171,.5)}
  70%{box-shadow:0 0 0 9px rgba(255,143,171,0)}
  100%{box-shadow:0 0 0 0 rgba(255,143,171,0)}
}

@media (prefers-reduced-motion:reduce){
  .mv-night-r.is-bad .mv-night-d i{animation:none}
}

.mv-night-x{display:flex;flex-direction:column;gap:3px;min-width:0}
.mv-night-x b{font:600 13.5px/1.35 var(--sans);color:#fff}
.mv-night-x span{font-size:12px;line-height:1.5;color:rgba(255,255,255,.58)}

.mv-night-end{
  margin-top:14px !important;
  padding-top:13px;
  border-top:1px solid rgba(255,255,255,.12);
  font-size:12.5px;
  line-height:1.6;
  color:rgba(255,255,255,.7) !important;
}

.mv-night-end b{color:#fff !important}

@media (max-width:520px){
  .mv-night-r{grid-template-columns:46px 14px 1fr;gap:8px}
}


/* ─────────── MV-HEAD · ot kray do kray ─────────── */
/* Главите на управлявания VPS са стеснени с max-width на няколко места;
 * класът .sec е повторен, за да вдигне специфичността над тях. */
section.sec.sec .mv-head,
div.wrap-w .mv-head,
section .mv-head,
.mv-head{
  max-width:none !important;
  width:100% !important;
}

section.sec.sec .mv-head > p,
div.wrap-w .mv-head > p,
.mv-head > p{
  max-width:none !important;
  width:100% !important;
}

section.sec.sec .mv-head:not(.mid),
div.wrap-w .mv-head:not(.mid){
  margin-left:0 !important;
  margin-right:0 !important;
}

section.sec.sec .mv-head.mid,
div.wrap-w .mv-head.mid{
  margin-inline:auto !important;
}


/* ─────────── MV-PACKS · svetal fon ─────────── */
/* Разделът с пакетите беше на тъмен фон; тук е върнат на светло. */
section.sec:has(.mv-packs),
section.sec.sec-wash:has(.mv-packs),
section.sec#packs,
section.sec.sec-wash#packs{
  background:#fff !important;
  color:var(--ink) !important;
}

section.sec:has(.mv-packs)::before,
section.sec:has(.mv-packs)::after,
section.sec#packs::before,
section.sec#packs::after{
  content:none !important;
  background:none !important;
}

section.sec:has(.mv-packs) .mv-head h2,
section.sec#packs .mv-head h2{color:var(--ink) !important}

section.sec:has(.mv-packs) .mv-head p,
section.sec#packs .mv-head p{color:var(--ink-2) !important}


/* ─────────── MV-PACKS · shirina i tsvyat ─────────── */
/*
 * Разделът с пакетите: пълна ширина като останалите (1680px) и мек
 * цветен фон вместо бяло — зелен градиент в тона на бранда.
 */
section.sec.sec#packs,
section.sec.sec.sec-wash#packs{
  background:
    radial-gradient(900px 420px at 12% 0%, rgba(124,191,0,.14), transparent 60%),
    radial-gradient(700px 380px at 92% 100%, rgba(31,89,158,.10), transparent 60%),
    linear-gradient(180deg,#f7fbf0 0%,#ffffff 100%) !important;
  color:var(--ink) !important;
}

section.sec.sec#packs .wrap-w{
  max-width:1680px !important;
  width:100% !important;
  margin-inline:auto !important;
}

section.sec.sec#packs .mv-head{
  max-width:none !important;
  width:100% !important;
}

section.sec.sec#packs .mv-head h2{color:#17210f !important}
section.sec.sec#packs .mv-head p{color:#4a5a3e !important}


/* ─────────── MV-PACKS · zeleni butoni i poleta ─────────── */
/*
 * Само в раздела с пакетите: тъмното по бутоните и превключвателя
 * става зелено #7cbf00. Обхватът е ограничен с #packs, за да не
 * променя бутоните на другите страници.
 */
section#packs .btn,
section#packs a.btn,
section#packs .plan-card .btn{
  background:#7cbf00 !important;
  border-color:#7cbf00 !important;
  color:#0f1a05 !important;
}

section#packs .btn:hover,
section#packs a.btn:hover,
section#packs .plan-card .btn:hover{
  background:#6aa600 !important;
  border-color:#6aa600 !important;
  color:#0f1a05 !important;
}

/* Превключвателят за периода. */
section#packs .cyc-box{
  background:rgba(124,191,0,.10) !important;
  border-color:rgba(124,191,0,.35) !important;
}

section#packs .cyc-box button{
  color:#3f6b00 !important;
}

section#packs .cyc-box button.is-on{
  background:#7cbf00 !important;
  border-color:#7cbf00 !important;
  color:#0f1a05 !important;
}

section#packs .cyc-box button.is-on .cyc-price{
  color:#0f1a05 !important;
  opacity:.75;
}

section#packs .cyc-box button:hover:not(.is-on){
  background:rgba(124,191,0,.16) !important;
}

/* Тъмната шапка на препоръчания пакет. */
section#packs .plan-card.is-featured .pl-head,
section#packs .mv-pack.is-best .mv-pack-h{
  background:#7cbf00 !important;
  color:#0f1a05 !important;
}

section#packs .plan-card.is-featured .pl-head h3,
section#packs .plan-card.is-featured .pl-head p{
  color:#0f1a05 !important;
}


/* ─────────── MV-PACKS · zeleno pl-go ─────────── */
/* Бутонът за поръчка в картите е в .pl-go и е без клас .btn,
 * затова се оцветява отделно. Обхватът е само #packs. */
section#packs .pl-go > a,
section#packs .pl-go > button,
section#packs .pl-go a[href]{
  background:#7cbf00 !important;
  background-image:none !important;
  border-color:#7cbf00 !important;
  color:#0f1a05 !important;
}

section#packs .pl-go > a:hover,
section#packs .pl-go > button:hover,
section#packs .pl-go a[href]:hover{
  background:#6aa600 !important;
  border-color:#6aa600 !important;
  color:#0f1a05 !important;
}

/* Превключвателят за периода — бутоните са без клас, само .is-on. */
section#packs .plan-cycle .cyc-box{
  background:rgba(124,191,0,.10) !important;
  border-color:rgba(124,191,0,.35) !important;
}

section#packs .plan-cycle .cyc-box > button{
  background:transparent !important;
  background-image:none !important;
  color:#3f6b00 !important;
}

section#packs .plan-cycle .cyc-box > button.is-on{
  background:#7cbf00 !important;
  background-image:none !important;
  border-color:#7cbf00 !important;
  color:#0f1a05 !important;
}

section#packs .plan-cycle .cyc-box > button.is-on .cyc-price{
  color:#0f1a05 !important;
  opacity:.8;
}


/* ─────────── MV-SPLIT · snimka na reda i h3 ─────────── */
/* Снимката е трета колона на същия ред и се опъва до долния край.
 * Заглавията <b> станаха <h3> и пазят точно старите си стилове. */
section#split .mv-head{max-width:none !important;width:100% !important}
section#split .mv-head > p{max-width:none !important}

section#split .mv-split{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.06fr) !important;
  align-items:stretch !important;
  gap:20px !important;
}

section#split .mv-split-img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:50% 42% !important;
  border-radius:18px !important;
  align-self:stretch !important;
  border:1px solid rgba(15,27,45,.08) !important;
}

@media (max-width:1180px){
  section#split .mv-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important}
  section#split .mv-split-img{grid-column:1 / -1 !important;height:280px !important}
}

@media (max-width:760px){
  section#split .mv-split{grid-template-columns:minmax(0,1fr) !important}
  section#split .mv-split-img{height:210px !important}
}

section#split .mv-split-h h3{font:700 15px/1.3 var(--sans);margin:0 !important}
section#split .mv-split-not h3{font-weight:700;display:block;margin-bottom:6px;margin:0 0 8px !important}


/* ─────────── MV-CASES · chetiri na red ─────────── */
/* Четирите случая на един ред, от край до край; .who остава долепен
 * до долния край, за да са равни картите. */
section.sec.sec:has(.mv-cases) .wrap-n{
  max-width:1680px !important;
  width:100% !important;
}

section.sec.sec:has(.mv-cases) .mv-head{
  max-width:none !important;
  width:100% !important;
}

section.sec.sec:has(.mv-cases) .mv-head > p{max-width:none !important}

section.sec.sec:has(.mv-cases) .mv-cases{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  align-items:stretch !important;
  gap:16px !important;
}

section.sec.sec:has(.mv-cases) .mv-case{
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
}

section.sec.sec:has(.mv-cases) .mv-case-a{flex:1 1 auto !important}

section.sec.sec:has(.mv-cases) .mv-case-who{margin-top:auto !important}

@media (max-width:1240px){
  section.sec.sec:has(.mv-cases) .mv-cases{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:720px){
  section.sec.sec:has(.mv-cases) .mv-cases{
    grid-template-columns:minmax(0,1fr) !important;
  }
}


/* ─── MV-CASE-Q · zaglavie h3 ─── */
/* <b> стана <h3> и пази точно старите си стилове. */
.mv-case-q h3{flex:1;font:700 14.5px/1.35 var(--sans);margin:0 !important}


/* ─────────── MV-CASE-S · chetim tekst ─────────── */
/* При четири карти на ред часът и текстът се слепваха.
 * Часът минава на отделен ред като етикет, текстът — под него. */
section.sec.sec:has(.mv-cases) .mv-case-a{
  display:grid !important;
  gap:14px !important;
}

section.sec.sec:has(.mv-cases) .mv-case-s{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:5px !important;
  align-items:start !important;
}

section.sec.sec:has(.mv-cases) .mv-case-s .mv-case-t{
  display:inline-block !important;
  width:auto !important;
  min-width:0 !important;
  max-width:max-content !important;
  flex:none !important;
  justify-self:start !important;
  margin:0 !important;
  padding:3px 9px !important;
  border-radius:999px !important;
  background:rgba(124,191,0,.16) !important;
  color:#3d6800 !important;
  font:700 11.5px/1.45 var(--sans) !important;
  letter-spacing:.01em !important;
  text-align:left !important;
  white-space:nowrap !important;
}

section.sec.sec:has(.mv-cases) .mv-case-s > span:not(.mv-case-t){
  display:block !important;
  margin:0 !important;
  font-size:13.5px !important;
  line-height:1.55 !important;
}


/* ─────────── MV-CASE · bez vertikalna liniya ─────────── */
/* Вертикалната черта между стъпките се маха. */
section.sec.sec:has(.mv-cases) .mv-case-s,
section.sec.sec:has(.mv-cases) .mv-case-a{
  border-left:0 !important;
  border-inline-start:0 !important;
  box-shadow:none !important;
}

section.sec.sec:has(.mv-cases) .mv-case-s::before,
section.sec.sec:has(.mv-cases) .mv-case-s::after,
section.sec.sec:has(.mv-cases) .mv-case-a::before,
section.sec.sec:has(.mv-cases) .mv-case-a::after,
section.sec.sec:has(.mv-cases) .mv-case-t::before,
section.sec.sec:has(.mv-cases) .mv-case-t::after{
  content:none !important;
  display:none !important;
  background:none !important;
  border:0 !important;
  width:0 !important;
}


/* ─────────── MV-CASE · bez liniya vtori sloy ─────────── */
/* Всички pseudo-елементи и рамки вътре в тялото на картата се махат;
 * в тази секция няма <i> точки, така че нищо смислено не пада. */
section.sec.sec:has(.mv-cases) .mv-case-a *::before,
section.sec.sec:has(.mv-cases) .mv-case-a *::after,
section.sec.sec:has(.mv-cases) .mv-case-a::before,
section.sec.sec:has(.mv-cases) .mv-case-a::after{
  content:none !important;
  display:none !important;
  background:none !important;
  border:0 !important;
  width:0 !important;
  height:0 !important;
}

section.sec.sec:has(.mv-cases) .mv-case-a,
section.sec.sec:has(.mv-cases) .mv-case-a > *,
section.sec.sec:has(.mv-cases) .mv-case-s > *{
  border-left:0 !important;
  border-right:0 !important;
  border-inline:0 !important;
  background-image:none !important;
}


/* ─────────── MV-CASE-S · chas i tekst na edin red ─────────── */
/* Часът и текстът се връщат на един ред — две колони с ясно
 * разстояние, за да не се слепват както преди. */
section.sec.sec:has(.mv-cases) .mv-case-s{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) !important;
  column-gap:10px !important;
  row-gap:0 !important;
  align-items:start !important;
}

section.sec.sec:has(.mv-cases) .mv-case-s .mv-case-t{
  grid-column:1 !important;
  align-self:start !important;
  justify-self:start !important;
  display:inline-block !important;
  width:auto !important;
  max-width:max-content !important;
  margin:0 !important;
  padding:2px 8px !important;
  border-radius:999px !important;
  background:rgba(124,191,0,.16) !important;
  color:#3d6800 !important;
  font:700 11px/1.5 var(--sans) !important;
  white-space:nowrap !important;
  text-align:left !important;
}

section.sec.sec:has(.mv-cases) .mv-case-s > span:not(.mv-case-t){
  grid-column:2 !important;
  display:block !important;
  margin:0 !important;
  font-size:13px !important;
  line-height:1.5 !important;
}

section.sec.sec:has(.mv-cases) .mv-case-a{gap:10px !important}


/* ─────────── MV-LOG-ROW · dnevnik i snimka ─────────── */
/* Дневникът заема ширината на две от четирите плочки отгоре,
 * снимката — на другите две. Отстоянието е същото като на .mv-work,
 * за да съвпадат ръбовете. */
.mv-log-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:12px;
  align-items:stretch;
}

.mv-log-row > .mv-log{
  margin:0 !important;
  width:auto !important;
  max-width:none !important;
  min-width:0;
}

.mv-log-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 45%;
  border-radius:18px;
  align-self:stretch;
  border:1px solid rgba(15,27,45,.08);
}

@media (max-width:980px){
  .mv-log-row{grid-template-columns:minmax(0,1fr)}
  .mv-log-img{height:260px}
}

@media (max-width:640px){
  .mv-log-img{height:200px}
}


/* ─────────── DED-VIZ · dve lenti ─────────── */
/* Дясната страна на главата: бяла карта, която работи и на светъл,
 * и на тъмен фон. Без анимации, само ясни цветове. */
.ded-viz{
  background:#fff;
  border:1px solid #E6EBF2;
  border-radius:20px;
  padding:20px 20px 16px;
  box-shadow:0 18px 44px rgba(15,27,45,.10);
  color:#0F1B2D;
  display:grid;
  gap:16px;
}

.ded-viz-h{display:grid;gap:3px}
.ded-viz-h b{font:800 15.5px/1.3 var(--sans)}
.ded-viz-h span{font-size:12.5px;color:#5A6B80}

.ded-viz-row{display:grid;gap:8px}

.ded-viz-lab{display:grid;gap:2px}
.ded-viz-lab b{font:700 13px/1.35 var(--sans)}
.ded-viz-lab small{font-size:11.5px;color:#5A6B80;line-height:1.4}

.ded-viz-bar{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:1fr;
  gap:4px;
  height:48px;
}

.ded-viz-seg{
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  background:#EEF2F7;
  border:1px solid #E1E7EF;
  font-style:normal;
  overflow:hidden;
}

.ded-viz-seg span{
  font:600 10px/1.2 var(--sans);
  color:#7A8899;
  text-align:center;
  padding:0 4px;
}

.ded-viz-seg.is-you{
  background:rgba(124,191,0,.18);
  border-color:rgba(124,191,0,.45);
}

.ded-viz-seg.is-you span{color:#3D6800;font-weight:800}

.ded-viz-seg.is-all{
  background:#7cbf00;
  border-color:#7cbf00;
}

.ded-viz-seg.is-all span{color:#16250A;font-weight:800;font-size:12px}

.ded-viz-row.is-yours .ded-viz-lab b{color:#3D6800}

.ded-viz-f{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  border-top:1px solid #EEF2F7;
  padding-top:14px;
}

.ded-viz-f span{
  display:grid;
  gap:1px;
  text-align:center;
  font-size:11.5px;
  color:#5A6B80;
}

.ded-viz-f b{font:800 17px/1.1 var(--sans);color:#0F1B2D}

@media (max-width:560px){
  .ded-viz{padding:16px 16px 14px}
  .ded-viz-bar{height:42px}
  .ded-viz-seg span{font-size:9px}
}


/* ─────────── DED-VIZ · kato heada ─────────── */
/* Главата е тъмна (.ded-hero h1{color:#fff}, .ded-bay е бяло на 16%),
 * затова картата минава на прозрачен слой със същата логика на цветовете
 * вместо бял фон. */
.ded-viz{
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  box-shadow:none !important;
  color:#fff !important;
  backdrop-filter:blur(6px);
}

.ded-viz-h b{color:#fff !important}
.ded-viz-h span{color:rgba(255,255,255,.62) !important}

.ded-viz-lab b{color:#fff !important}
.ded-viz-lab small{color:rgba(255,255,255,.58) !important}

.ded-viz-seg{
  background:rgba(255,255,255,.09) !important;
  border-color:rgba(255,255,255,.14) !important;
}

.ded-viz-seg span{color:rgba(255,255,255,.55) !important}

.ded-viz-seg.is-you{
  background:rgba(124,191,0,.26) !important;
  border-color:rgba(124,191,0,.58) !important;
}

.ded-viz-seg.is-you span{color:#DCF3A4 !important}

.ded-viz-seg.is-all{
  background:#7cbf00 !important;
  border-color:#7cbf00 !important;
}

.ded-viz-seg.is-all span{color:#16250A !important}

.ded-viz-row.is-yours .ded-viz-lab b{color:#B6E36A !important}

.ded-viz-f{border-top-color:rgba(255,255,255,.12) !important}
.ded-viz-f span{color:rgba(255,255,255,.58) !important}
.ded-viz-f b{color:#fff !important}

/* ─────────── DED-SPEC · specifikaciya v heada ─────────── */
/* Същата логика на цветовете като хеда: прозрачен слой, бял текст,
 * зеленото е акцент върху отговорите, които продават. */
.ded-spec{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:20px;
  padding:20px 20px 16px;
  color:#fff;
  display:grid;
  gap:14px;
  backdrop-filter:blur(6px);
}
.ded-spec-h{display:grid;gap:4px}
.ded-spec-h b{font:800 16px/1.3 var(--sans);color:#fff}
.ded-spec-h span{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.45}
.ded-spec-l{display:grid}
.ded-spec-r{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  padding:11px 0;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.ded-spec-r:last-child{border-bottom:0}
.ded-spec-k{font:500 13px/1.4 var(--sans);color:rgba(255,255,255,.70)}
.ded-spec-v{
  font:700 13px/1.4 var(--sans);
  color:#fff;
  text-align:right;
  flex:0 0 auto;
  max-width:52%;
}
.ded-spec-v.is-hot{color:#B6E36A}
.ded-spec-f{
  font-size:12px;
  color:rgba(255,255,255,.58);
  border-top:1px solid rgba(255,255,255,.12);
  padding-top:12px;
}
@media (max-width:560px){
  .ded-spec{padding:16px 16px 14px}
  .ded-spec-r{padding:10px 0}
  .ded-spec-k,.ded-spec-v{font-size:12.5px}
}

/* ─────────── DED-HEAD-MID · centrirana glava ─────────── */
/* .ded-head е max-width:640px с margin:0 — липсваше вариант .mid. */
.ded-head.mid{
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}

.ded-head.mid > p{margin-left:auto;margin-right:auto}

/* <b> в главите на двете колони стана <h3> — пази стария стил
 * (.ded-vs-h b{flex:1;font:700 15px/1.3 var(--sans)}). */
.ded-vs-h h3{flex:1;font:700 15px/1.3 var(--sans);margin:0}

/* ─────────── DED-VS-GO · butonat vdyasno ─────────── */
/* Бутонът застава в десния край на колоната, с отстояние от списъка. */
.ded-vs-i{display:flex;flex-direction:column}

.ded-vs-go{
  align-self:flex-end !important;
  margin-top:18px !important;
  margin-left:auto !important;
}

@media (max-width:560px){
  .ded-vs-go{align-self:stretch !important;text-align:center}
}

/* ─────────── DED-CASES-ROW · snimka na reda ─────────── */
/* Случаите остават вляво, снимката е на същия ред вдясно и се
 * опъва до долния край на картите. */
.ded-cases-row{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(0,1fr);
  gap:18px;
  align-items:stretch;
}

.ded-cases-row > .ded-cases{margin:0;min-width:0}

.ded-cases-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 45%;
  border-radius:18px;
  align-self:stretch;
  border:1px solid rgba(15,27,45,.08);
}

@media (max-width:1180px){
  .ded-cases-row{grid-template-columns:minmax(0,1fr)}
  .ded-cases-img{height:280px}
}

@media (max-width:640px){
  .ded-cases-img{height:200px}
}

/* ─────────── DED-CASES · edin pod drug ─────────── */
/* Трите случая застават един под друг вляво, снимката е на същия
 * ред вдясно и се опъва до долния край на колоната. */
.ded-cases-row{
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) !important;
}

.ded-cases-row > .ded-cases{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:12px !important;
}

@media (max-width:1180px){
  .ded-cases-row{grid-template-columns:minmax(0,1fr) !important}
}

/* ─────────── DED-INCL · zaglavie h3 ─────────── */
/* <b> стана <h3>; пази точния стар стил. */
.ded-incl-i h3{display:block;font:700 14px/1.35 var(--sans);margin:0 0 6px}

/* ─────────── DED-ADDS · po tri na red ─────────── */
/* Добавките бяха по една на ред в тясната обвивка. Сега секцията е
 * на цялата ширина и картите се подреждат по три. */
section.sec:has(.ded-adds) .wrap-n{max-width:1680px}
section.sec:has(.ded-adds) .ded-head{max-width:none}

.ded-adds{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
}

.ded-add-t h3{display:block;font:600 14px/1.3 var(--sans);margin:0 0 4px}

@media (max-width:1180px){
  .ded-adds{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}

@media (max-width:700px){
  .ded-adds{grid-template-columns:minmax(0,1fr) !important}
}

/* ─────────── DED-ADDS · sedem na edin red ─────────── */
/* Всичките седем добавки на един ред. При тази ширина картата
 * минава вертикално: заглавие, описание, после цената долу. */
.ded-adds{
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  gap:8px !important;
  align-items:stretch !important;
}

.ded-add{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:8px !important;
  height:100% !important;
}

.ded-add-t{flex:1 1 auto}
.ded-add-t h3{font-size:13px !important;line-height:1.3 !important}
.ded-add-t > span{font-size:11.5px !important;line-height:1.4 !important;display:block}

.ded-add-p{
  margin-top:auto !important;
  text-align:left !important;
  font-size:15px !important;
  white-space:nowrap;
}

.ded-add-p > span{display:block;font-size:10.5px !important;white-space:normal}

@media (max-width:1400px){
  .ded-adds{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
}

@media (max-width:1000px){
  .ded-adds{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}

@media (max-width:640px){
  .ded-adds{grid-template-columns:minmax(0,1fr) !important}
}

/* ─────────── DED-ADDS · po chetiri ot kray do kray ─────────── */
/* Седем на ред режеше текста. Секцията се разпъва от край до край и
 * добавките стават по четири (4 + 3), за да се чете всичко докрай. */
section.sec:has(.ded-adds) .wrap-n{
  max-width:1760px !important;
  width:100% !important;
  padding-inline:clamp(14px,2vw,32px) !important;
}

section.sec:has(.ded-adds) .ded-head{max-width:none !important}

.ded-adds{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px !important;
  align-items:stretch !important;
}

/* Нищо да не се реже. */
.ded-add,
.ded-add-t,
.ded-add-t h3,
.ded-add-t > span,
.ded-add-p{
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:normal !important;
  -webkit-line-clamp:none !important;
  max-height:none !important;
}

.ded-add-t h3{font-size:14px !important;line-height:1.3 !important}
.ded-add-t > span{font-size:12.5px !important;line-height:1.5 !important;display:block}

.ded-add-p{
  margin-top:auto !important;
  font-size:16px !important;
  white-space:nowrap !important;
}

.ded-add-p > span{display:block;font-size:11px !important;white-space:normal !important}

@media (max-width:1300px){
  .ded-adds{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
}

@media (max-width:980px){
  .ded-adds{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}

@media (max-width:620px){
  .ded-adds{grid-template-columns:minmax(0,1fr) !important}
}

/* ─────────── DED-ADDS · po-svetal fon ─────────── */
/* Разделът с добавките минава на светъл фон; картите са бели,
 * текстът е с тъмните цветове на сайта, за да се чете. */
section.sec:has(.ded-adds),
section.sec.sec-wash:has(.ded-adds){
  background:#F7F9FC !important;
  color:var(--ink) !important;
}

section.sec:has(.ded-adds)::before,
section.sec:has(.ded-adds)::after{
  content:none !important;
  background:none !important;
}

section.sec:has(.ded-adds) .ded-head h2{color:var(--ink) !important}
section.sec:has(.ded-adds) .ded-head p{color:#5A6B80 !important}

.ded-add{
  background:#fff !important;
  border:1px solid #E6EBF2 !important;
  border-radius:14px !important;
  padding:14px 15px !important;
  box-shadow:0 2px 10px rgba(15,27,45,.04) !important;
}

.ded-add-t h3{color:var(--ink) !important}
.ded-add-t > span{color:#5A6B80 !important}
.ded-add-p{color:var(--ink) !important}
.ded-add-p > span{color:#7A8899 !important}
.ded-add-p.free{color:#3D6800 !important}

/* ─────────── DED-ADDS · zelen hover ─────────── */
/* При посочване картата светва в зелено. Преходът е изключен при
 * системна настройка за намалено движение. */
.ded-add{
  transition:border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.ded-add:hover{
  background:rgba(124,191,0,.07) !important;
  border-color:#7cbf00 !important;
  box-shadow:0 6px 18px rgba(124,191,0,.16) !important;
}

.ded-add:hover .ded-add-t h3{color:#3D6800 !important}
.ded-add:hover .ded-add-p{color:#3D6800 !important}

@media (prefers-reduced-motion:reduce){
  .ded-add{transition:none}
}

/* ─────────── DED-ADD · svetla bezplatna karta ─────────── */
/* Картата с „Безплатно“ оставаше тъмна; изравнява се с останалите,
 * а зеленото остава само върху цената. */
.ded-add:has(.ded-add-p.free){
  background:#fff !important;
  background-image:none !important;
  border:1px solid #E6EBF2 !important;
  color:var(--ink) !important;
}

.ded-add:has(.ded-add-p.free):hover{
  background:rgba(124,191,0,.07) !important;
  border-color:#7cbf00 !important;
}

.ded-add .ded-add-p.free{
  background:none !important;
  background-image:none !important;
  color:#3D6800 !important;
  padding:0 !important;
  border:0 !important;
}

.ded-add .ded-add-p.free > span{color:#7A8899 !important}

.ded-add:has(.ded-add-p.free) .ded-add-t h3{color:var(--ink) !important}
.ded-add:has(.ded-add-p.free) .ded-add-t > span{color:#5A6B80 !important}

/* ─────────── DED-ADD · tvard beyal fon ─────────── */
/* Нулира всякакъв фон, наследен или зададен, по всички карти с
 * добавки — включително по вътрешните елементи. */
section.sec:has(.ded-adds) .ded-adds > .ded-add,
section.sec:has(.ded-adds) .ded-adds > .ded-add > *,
section.sec:has(.ded-adds) .ded-adds > .ded-add > * > *{
  background-image:none !important;
}

section.sec:has(.ded-adds) .ded-adds > .ded-add > *,
section.sec:has(.ded-adds) .ded-adds > .ded-add > * > *{
  background-color:transparent !important;
}

section.sec:has(.ded-adds) .ded-adds > .ded-add{
  background-color:#fff !important;
  border:1px solid #E6EBF2 !important;
  border-radius:14px !important;
  padding:14px 15px !important;
}

section.sec:has(.ded-adds) .ded-adds > .ded-add:hover{
  background-color:#F4FBE6 !important;
  border-color:#7cbf00 !important;
}

section.sec:has(.ded-adds) .ded-adds > .ded-add .ded-add-t h3{color:#0F1B2D !important}
section.sec:has(.ded-adds) .ded-adds > .ded-add .ded-add-t > span{color:#5A6B80 !important}
section.sec:has(.ded-adds) .ded-adds > .ded-add .ded-add-p{color:#0F1B2D !important}
section.sec:has(.ded-adds) .ded-adds > .ded-add .ded-add-p.free{color:#3D6800 !important}
section.sec:has(.ded-adds) .ded-adds > .ded-add .ded-add-p > span{color:#7A8899 !important}

/* ─────────── DED-ADDS · sedem ot kray do kray ─────────── */
/* Седемте добавки на един ред, на цялата ширина на страницата.
 * Шрифтовете са смалени, за да се чете всичко при ~250 px колона,
 * и е позволено пренасяне на дълга дума, за да не излиза извън боксa. */
section.sec:has(.ded-adds) .wrap-n{
  max-width:none !important;
  width:100% !important;
  padding-inline:16px !important;
}

section.sec:has(.ded-adds) .ded-adds{
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  gap:10px !important;
  align-items:stretch !important;
}

section.sec:has(.ded-adds) .ded-adds > .ded-add{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:8px !important;
  height:100% !important;
  min-width:0 !important;
  padding:13px 13px !important;
  overflow:visible !important;
}

section.sec:has(.ded-adds) .ded-add-t{
  flex:1 1 auto !important;
  min-width:0 !important;
}

section.sec:has(.ded-adds) .ded-add-t h3{
  font-size:12.5px !important;
  line-height:1.3 !important;
  margin:0 0 4px !important;
  overflow-wrap:anywhere;
}

section.sec:has(.ded-adds) .ded-add-t > span{
  display:block !important;
  font-size:11px !important;
  line-height:1.45 !important;
  overflow-wrap:anywhere;
}

section.sec:has(.ded-adds) .ded-add-p{
  margin-top:auto !important;
  font-size:14px !important;
  line-height:1.2 !important;
  text-align:left !important;
  white-space:nowrap !important;
  min-width:0 !important;
}

section.sec:has(.ded-adds) .ded-add-p > span{
  display:block !important;
  font-size:10px !important;
  line-height:1.3 !important;
  white-space:normal !important;
}

@media (max-width:1500px){
  section.sec:has(.ded-adds) .ded-adds{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
  section.sec:has(.ded-adds) .ded-add-t h3{font-size:14px !important}
  section.sec:has(.ded-adds) .ded-add-t > span{font-size:12.5px !important}
}

@media (max-width:980px){
  section.sec:has(.ded-adds) .ded-adds{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}

@media (max-width:620px){
  section.sec:has(.ded-adds) .ded-adds{grid-template-columns:minmax(0,1fr) !important}
}

/* ─────────── DED-WHERE · glavata ot kray do kray ─────────── */
/* .ded-head е стеснена с max-width:640px — тук се разпъва.
 * Класът .sec е повторен, за да вдигне специфичността. */
section.sec.sec:has(.ded-dc) .ded-head,
section.sec.sec:has(.ded-dc) .ded-head > p{
  max-width:none !important;
  width:100% !important;
}

section.sec.sec:has(.ded-dc) .ded-head:not(.mid){
  margin-left:0 !important;
  margin-right:0 !important;
}

/* ─────────── DED-DC-IMG · snimka vmesto boksa ─────────── */
/* Снимката заема мястото на бившия бокс и се опъва до височината
 * на четирите факта отдясно. */
.ded-dc-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 50%;
  border-radius:18px;
  align-self:stretch;
  border:1px solid rgba(15,27,45,.08);
  min-width:0;
}

@media (max-width:900px){
  .ded-dc-img{height:260px}
}

@media (max-width:620px){
  .ded-dc-img{height:200px}
}

/* ─────────── REV-GRID · chetiri na red ─────────── */
/* Класът е повторен, за да победи правилото в медия заявката по-горе. */
.rev-grid.rev-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  align-items:stretch;
}

@media (max-width:1180px){
  .rev-grid.rev-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:680px){
  .rev-grid.rev-grid{grid-template-columns:1fr}
}

/* ─────────── REV-SHARED · ot kray do kray i podzaglavie ─────────── */
/* .sec-wash оцветява всичко в зелено, затова цветът е изричен. */
.rev-head p{
  max-width:720px;
  margin:10px auto 0;
  color:#5a6b80;
  font-size:15px;
  line-height:1.6;
  text-align:center;
}

/* Само секцията с отзивите на споделения хостинг се разтяга. */
section.rev-shared .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}

@media (max-width:680px){
  section.rev-shared .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── DWHY-H3 · zaglavie na boks ─────────── */
/* Същите декларации като на бившия <b>, плюс нулиране на
 * собствените отстояния на <h3>. */
.dwhy-i h3{
  display:block;
  font:700 14.5px/1.35 var(--sans);
  margin:0 0 6px;
}

/* ─────────── DWHY-ROW · boksove i snimka na edin red ─────────── */
/* Вляво четирите бокса един под друг, вдясно снимката. */
.dwhy-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  align-items:stretch;
}

.dwhy-row .dwhy{
  display:grid;
  grid-template-columns:1fr !important;
  gap:14px;
  align-content:start;
}

.dwhy-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 50%;
  border-radius:18px;
  border:1px solid rgba(15,27,45,.08);
  min-width:0;
  align-self:stretch;
}

@media (max-width:900px){
  .dwhy-row{grid-template-columns:1fr}
  .dwhy-img{height:280px;order:-1}
}

@media (max-width:620px){
  .dwhy-img{height:200px}
}

/* ─────────── DWHY-WIDE · ot kray do kray i 2x2 ─────────── */
/* Секцията се разтяга, боксовете стават две по две,
 * снимката остава вдясно на същия ред. */
section.dsec-adv .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}

.dwhy-row{
  grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
  gap:28px;
}

.dwhy-row .dwhy{
  grid-template-columns:1fr 1fr !important;
  gap:16px;
  align-content:stretch;
}

@media (max-width:900px){
  section.dsec-adv .wrap-w{padding-left:16px;padding-right:16px}
  .dwhy-row{grid-template-columns:1fr}
}

@media (max-width:620px){
  .dwhy-row .dwhy{grid-template-columns:1fr !important}
}

/* ─────────── DTIP-H4 · zaglavie na kartichka ─────────── */
/* Същите декларации като на бившия <b>, плюс нулиране на
 * собствените отстояния на <h4>. */
.dtip-c h4{color:var(--ink) !important;margin:0;font-size:inherit}

/* ─────────── DSEARCH-LEAD · do kraya na boksa ─────────── */
/* Водещият текст беше ограничен на 52 знака ред. Пуска се
 * до ширината на колоната, в която стои. */
.dsearch .wrap-w > div:first-child > p{
  max-width:none;
}

/* ─────────── DSEARCH-MID · lqvata kolona po sredata ─────────── */
/* Решетката е със stretch, затова лявата колона се лепи горе.
 * Центрира се спрямо дясната кутия с подсказките. */
.dsearch .wrap-w > div:first-child{
  align-self:center;
}

@media (max-width:900px){
  .dsearch .wrap-w > div:first-child{align-self:start}
}

/* ─────────── SL-FAQ-SEC · centrirana i ot kray do kray ─────────── */
/* Само секцията с въпросите на страницата за сертификати. */
section.sl-faq-sec .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}

section.sl-faq-sec .sl-head{
  text-align:center;
}

section.sl-faq-sec .sl-head p{
  margin-left:auto;
  margin-right:auto;
}

@media (max-width:680px){
  section.sl-faq-sec .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── SL-FAQ-SEC · glavata ot kray do kray ─────────── */
/* .sl-head е ограничена на 680px, затова центрирането се виждаше
 * вътре в тясна кутия вляво. Тук тя заема цялата ширина. */
section.sl-faq-sec .sl-head{
  max-width:none !important;
  margin-left:auto;
  margin-right:auto;
  text-align:center;
}

section.sl-faq-sec .sl-head h2,
section.sl-faq-sec .sl-head p{
  max-width:none;
}

/* ─────────── SL-FAQ-SEC · sila nad :has ─────────── */
/* section.sec:has(.sl-faq) .sl-head е с по-висока специфичност,
 * затова класът се повтаря и стойностите са изрични. */
section.sl-faq-sec.sl-faq-sec .sl-head{
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}

section.sl-faq-sec.sl-faq-sec .sl-head h2,
section.sl-faq-sec.sl-faq-sec .sl-head p{
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}

section.sl-faq-sec.sl-faq-sec .sl-head::after{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ─────────── SL-FAQ-SEC · lentata po sredata ─────────── */
/* Лентата е блок с ширина 44px, затова се лепи вляво.
 * Класът е повторен, за да победи :has() правилото по-горе. */
section.sl-faq-sec.sl-faq-sec .sl-head{
  max-width:none !important;
  text-align:center !important;
}

section.sl-faq-sec.sl-faq-sec .sl-head::after{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ─────────── SL-BAR-NOTE · beyal tekst ─────────── */
/* Зеленото върху тъмния фон се четеше трудно.
 * Рамката и фонът остават, текстът става бял. */
.sl-bar-note{
  color:#ffffff;
}

.sl-bar-note b{
  color:#ffffff;
}

/* ─────────── MYTH-HEAD · ot kray do kray ─────────── */
/* Главата беше ограничена на 680px в обвивка от 1200px.
 * Селекторът е с id, затова бие правилата с :has(). */
section#myth .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}

section#myth .sl-head{
  max-width:none !important;
}

section#myth .sl-head h2,
section#myth .sl-head p{
  max-width:none !important;
}

@media (max-width:680px){
  section#myth .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── SL-MYTH · tri na red ─────────── */
/* Двете колони с точки и снимката до тях, на един ред. */
.sl-myth{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  align-items:stretch;
}

.sl-myth-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 50%;
  border-radius:18px;
  border:1px solid rgba(15,27,45,.08);
  min-width:0;
  align-self:stretch;
}

@media (max-width:980px){
  .sl-myth{grid-template-columns:1fr 1fr}
  .sl-myth-img{grid-column:1 / -1;height:280px}
}

@media (max-width:620px){
  .sl-myth{grid-template-columns:1fr}
  .sl-myth-img{height:200px}
}

/* ─────────── SL-MYTH · sila nad :has ─────────── */
/* Трите на един ред · двата списъка по-тесни, снимката по-широка.
 * Класът е повторен, за да бие правилата с :has(). */
.sl-myth.sl-myth{
  display:grid !important;
  grid-template-columns:minmax(0,.85fr) minmax(0,.85fr) minmax(0,1.3fr) !important;
  gap:20px !important;
  align-items:stretch !important;
}

.sl-myth.sl-myth .sl-myth-img{
  grid-column:auto !important;
  height:100% !important;
}

@media (max-width:980px){
  .sl-myth.sl-myth{grid-template-columns:1fr 1fr !important}
  .sl-myth.sl-myth .sl-myth-img{grid-column:1 / -1 !important;height:280px !important}
}

@media (max-width:620px){
  .sl-myth.sl-myth{grid-template-columns:1fr !important}
  .sl-myth.sl-myth .sl-myth-img{height:200px !important}
}

/* ─────────── SL-MYTH · tri do 720 ─────────── */
/* Трите остават на един ред до 720px, не до 980px. */
@media (min-width:721px){
  .sl-myth.sl-myth{
    grid-template-columns:minmax(0,.8fr) minmax(0,.8fr) minmax(0,1.4fr) !important;
  }
  .sl-myth.sl-myth .sl-myth-img{
    grid-column:auto !important;
    height:100% !important;
  }
}

@media (max-width:720px){
  .sl-myth.sl-myth{grid-template-columns:1fr !important}
  .sl-myth.sl-myth .sl-myth-img{grid-column:1 / -1 !important;height:220px !important}
}

/* ─────────── SL-MYTH · po-tesni spisatsi ─────────── */
/* Двата списъка се стесняват още, снимката взема остатъка. */
@media (min-width:721px){
  .sl-myth.sl-myth{
    grid-template-columns:minmax(0,.62fr) minmax(0,.62fr) minmax(0,1.76fr) !important;
  }
}

/* ─────────── SL-MYTH · mobilno nad vgradeniya stil ─────────── */
/* Решетката е вградена в тага, за да не зависи от кеш.
 * !important в стилов файл бие вграден стил без !important. */
@media (max-width:720px){
  .sl-myth{grid-template-columns:1fr !important}
  .sl-myth .sl-myth-img{height:220px !important}
}

/* ─────────── FREE-HEAD · ot kray do kray ─────────── */
/* Главата на сравнението заема цялата ширина.
 * Селекторът е с id и !important, за да бие всичко по-горе. */
section#free .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}

section#free .sl-head{
  max-width:none !important;
}

section#free .sl-head h2,
section#free .sl-head p{
  max-width:none !important;
}

@media (max-width:680px){
  section#free .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── SL-WHEN · centrirana glava ─────────── */
/* Главата на „Кога платеният има смисъл“ се центрира,
 * заедно с лентата под нея. */
section.sec:has(.sl-when) .sl-head{
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}

section.sec:has(.sl-when) .sl-head h2,
section.sec:has(.sl-when) .sl-head p{
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}

section.sec:has(.sl-when) .sl-head::after{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ─────────── RENEW-HEAD · ot kray do kray ─────────── */
/* Секцията за подновяването заема цялата ширина. */
section#renew .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}

section#renew .sl-head{
  max-width:none !important;
}

section#renew .sl-head h2,
section#renew .sl-head p{
  max-width:none !important;
}

@media (max-width:680px){
  section#renew .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── RENEW-ROW · svetal boks i snimka na edin red ─────────── */
section#renew .sl-renew-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:24px;
  align-items:stretch;
}
section#renew .sl-renew-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:24px;
  border:1px solid rgba(15,23,42,.10);
}
section#renew .sl-renew{
  background:#fff !important;
  border:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 10px 30px rgba(15,23,42,.06) !important;
  color:#0f172a !important;
  height:100%;
}
section#renew .sl-renew::before{opacity:.9 !important}
section#renew .sl-renew-h{color:#0f172a !important}
section#renew .sl-life-bar{background:rgba(15,23,42,.05) !important}
section#renew .sl-life-p.used{background:rgba(15,23,42,.07) !important;color:rgba(15,23,42,.62) !important}
section#renew .sl-life-p.left{background:rgba(15,23,42,.04) !important;color:rgba(15,23,42,.45) !important}
section#renew .sl-life-marks,
section#renew .sl-life-marks span{color:rgba(15,23,42,.55) !important}
section#renew .sl-renew-l::before{display:none !important}
section#renew .sl-renew-l{padding-left:0 !important}
section#renew .sl-renew-r{background:transparent !important;border-color:rgba(15,23,42,.10) !important}
section#renew .sl-renew-d{
  color:#0f172a !important;
  background:rgba(15,23,42,.05) !important;
  border-color:rgba(15,23,42,.14) !important;
}
section#renew .sl-renew-t b{color:#0f172a !important}
section#renew .sl-renew-t span{color:rgba(15,23,42,.62) !important}
section#renew .sl-renew-end{
  color:#0f172a !important;
  background:rgba(15,23,42,.03) !important;
  border-color:rgba(15,23,42,.10) !important;
}
section#renew .sl-renew-end b{color:#0f172a !important}
@media (max-width:980px){
  section#renew .sl-renew-row{grid-template-columns:1fr}
  section#renew .sl-renew-img{height:auto;aspect-ratio:16/9}
}

/* ─────────── PROBS-ROW · tri boksa na edin red ─────────── */
section#probs .wrap-n{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}
section#probs .sl-head,
section#probs .sl-head h2,
section#probs .sl-head p{max-width:none !important}

section#probs .sl-probs{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:20px !important;
  align-items:stretch !important;
}
section#probs .sl-prob{height:100% !important}
section#probs .sl-prob-code{overflow-x:auto;white-space:nowrap}

@media (max-width:1100px){
  section#probs .sl-probs{grid-template-columns:1fr !important}
}
@media (max-width:680px){
  section#probs .wrap-n{padding-left:16px;padding-right:16px}
}

/* ─────────── KINDS-LIGHT · svetal fon na trite vida ─────────── */
section#kinds{background:#F7F9FB !important}
section#kinds::before{display:none !important}
section#kinds .sl-head h2{color:#0f172a !important}
section#kinds .sl-head p{color:rgba(15,23,42,.62) !important}

section#kinds .sl-kind{
  background:#fff !important;
  border:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 10px 30px rgba(15,23,42,.06) !important;
  color:#0f172a !important;
}
section#kinds .sl-kind::before{display:none !important}
section#kinds .sl-kind.is-yours{
  background:#E7F5EF !important;
  border-color:#127A55 !important;
}
section#kinds .sl-kind-top > b,
section#kinds .sl-kind-top b{color:#0f172a !important}
section#kinds .sl-kind-what{color:rgba(15,23,42,.65) !important}
section#kinds .sl-kind-check{
  background:rgba(15,23,42,.04) !important;
  color:rgba(15,23,42,.72) !important;
  border-color:rgba(15,23,42,.10) !important;
}
section#kinds .sl-kind-check b{color:#0f172a !important}
section#kinds .sl-kind:not(.is-yours) .sl-kind-tag{
  background:rgba(15,23,42,.06) !important;
  color:#0f172a !important;
  border-color:rgba(15,23,42,.12) !important;
}
section#kinds .sl-kind.is-yours .sl-kind-check{
  background:rgba(255,255,255,.75) !important;
}

/* ─────────── KINDS-WIDE · ot kray do kray ─────────── */
section#kinds .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}
section#kinds .sl-head,
section#kinds .sl-head h2,
section#kinds .sl-head p{max-width:none !important}
@media (max-width:680px){
  section#kinds .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── DD-MONTH-NOTE · tekstat do kraya na boksa ─────────── */
.dd-hero .dd-month .dd-month-note{
  max-width:none !important;
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
}

/* ─────────── DD-HOW · tekstov boks vmesto chislata ─────────── */
.dd-hero .dd-how{display:grid;gap:12px}
.dd-hero .dd-how-i{
  background:rgba(255,255,255,.06);
  border-radius:var(--r, 10px);
  padding:14px 16px;
}
.dd-hero .dd-how-i b{
  display:block;
  color:#fff;
  font:700 14px/1.35 var(--sans);
  margin-bottom:5px;
}
.dd-hero .dd-how-i span{
  font-size:12.5px;
  color:rgba(255,255,255,.6);
  line-height:1.5;
}

/* ─────────── DD-HEAD · zaglaviyata ot kray do kray ─────────── */
.dd-head{max-width:none !important}
.dd-head h2,
.dd-head p{max-width:none !important}

/* ─────────── DD-WIDE · sekciite ot kray do kray ─────────── */
section.sec:has(.dd-head) .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}
@media (max-width:680px){
  section.sec:has(.dd-head) .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── LAYERS-LIGHT · svetla sekciya sas snimka za fon ─────────── */
section#layers{
  background-color:#F7F9FB !important;
  background-image:
    linear-gradient(rgb(247 249 251 / 0%), rgba(247, 249, 251, .93)),
    url('/assets/img/ssl3.webp?v=1790941753') !important;
  background-size:auto, cover !important;
  background-position:center, center !important;
  background-repeat:no-repeat, no-repeat !important;
}
section#layers::before{display:none !important}

section#layers .dd-head h2{color:#fff !important;text-shadow:0 1px 3px rgba(0,0,0,.45)}
section#layers .dd-head p{color:rgba(255,255,255,.92) !important;text-shadow:0 1px 3px rgba(0,0,0,.45)}

section#layers .dd-layers{
  background:rgba(255,255,255,.92) !important;
  border:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 10px 30px rgba(15,23,42,.06) !important;
}
section#layers .dd-layers::before{display:none !important}
section#layers .dd-layers-h{
  color:#0f172a !important;
  border-color:rgba(15,23,42,.12) !important;
}
section#layers .dd-layer{
  background:transparent !important;
  border-color:rgba(15,23,42,.10) !important;
}
section#layers .dd-layer-n{
  background:rgba(15,23,42,.06) !important;
  color:#0f172a !important;
  border-color:rgba(15,23,42,.14) !important;
}
section#layers .dd-layer-t b{color:#0f172a !important}
section#layers .dd-layer-t span{color:rgba(15,23,42,.62) !important}
section#layers .dd-layer-cut b{color:#0f172a !important}
section#layers .dd-layer-cut span{color:rgba(15,23,42,.55) !important}
section#layers .dd-layers-end{
  background:rgba(15,23,42,.04) !important;
  color:rgba(15,23,42,.72) !important;
  border-color:rgba(15,23,42,.10) !important;
}
section#layers .dd-layers-end b{color:#0f172a !important}

/* ─────────── LAYERS-BOX · po-tesen boks ─────────── */
section#layers .dd-layers{
  max-width:980px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ─────────── DD-HEAD · centrirani zaglaviya ─────────── */
.dd-head{text-align:center !important}
.dd-head p{margin-left:auto !important;margin-right:auto !important}
.dd-head::after{margin-left:auto !important;margin-right:auto !important}

/* ─────────── DD-ATT-ROW · shemata i snimkata na edin red ─────────── */
section#inside .wrap-n{max-width:none !important;padding-left:28px;padding-right:28px}
@media (max-width:680px){section#inside .wrap-n{padding-left:16px;padding-right:16px}}
section#inside .dd-att-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:24px;
  align-items:stretch;
}
section#inside .dd-att{height:100%}
section#inside .dd-att-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:16px;
  border:1px solid rgba(15,23,42,.10);
}
@media (max-width:980px){
  section#inside .dd-att-row{grid-template-columns:1fr}
  section#inside .dd-att-img{height:auto;aspect-ratio:3/2}
}

/* ─────────── DD-INSIDE-HEAD · zaglavieto i izrechenieto na edin red ─────────── */
@media (min-width:1100px){
  section#inside .dd-head h2,
  section#inside .dd-head p{
    white-space:nowrap;
    max-width:none !important;
  }
}

/* ─────────── DD-HONEST · dva boksa na edin red, svetlo ─────────── */
section#honest .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}
section#honest .dd-honest-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:24px;
  align-items:start;
}
section#honest .dd-honest-c{min-width:0}
section#honest .dd-you{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:12px !important}
@media (max-width:1100px){section#honest .dd-you{grid-template-columns:1fr !important}}
section#honest .dd-you-i.big{grid-column:auto !important}
section#honest .dd-you-h{margin-bottom:14px}
section#honest .dd-you-h b{
  display:block;
  font:700 15px/1.35 var(--sans);
  color:var(--ink, #0f172a);
  margin-bottom:5px;
}
section#honest .dd-you-h span{
  font-size:13px;
  color:var(--steel, rgba(15,23,42,.62));
  line-height:1.55;
}
@media (max-width:980px){
  section#honest .dd-honest-row{grid-template-columns:1fr}
}
@media (max-width:680px){
  section#honest .wrap-w{padding-left:16px;padding-right:16px}
}


/* ─────────── DD-HONEST-CENTER · centrirana glava ─────────── */
section#honest .dd-head{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
section#honest .dd-head h2,
section#honest .dd-head p{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
section#honest .dd-head::after{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ─────────── DD-HONEST-CENTER2 · glavata centrirana kato blok ─────────── */
section#honest .dd-head{
  display:block !important;
  width:100% !important;
  max-width:1100px !important;
  margin:0 auto clamp(26px,3.5vw,40px) !important;
  text-align:center !important;
}
section#honest .dd-head h2{
  display:block !important;
  width:auto !important;
  text-align:center !important;
  white-space:normal !important;
}
section#honest .dd-head p{
  display:block !important;
  width:auto !important;
  text-align:center !important;
  white-space:normal !important;
}

/* ─────────── PHERO · tekst vlyavo, mostra na panela vdyasno ─────────── */
.pg-hero .phero-in{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(26px,4vw,56px);
  align-items:center;
}
.pg-hero .phero-t{min-width:0}

.pg-hero .phero-panel{
  background:rgba(127,127,127,.09);
  border:1px solid rgba(127,127,127,.26);
  border-radius:16px;
  padding:20px 20px 16px;
}
.pg-hero .pp-h{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-bottom:12px;
  margin-bottom:12px;
  border-bottom:1px solid rgba(127,127,127,.26);
  font-size:13.5px;
}
.pg-hero .pp-h b{font-weight:700}
.pg-hero .pp-h span{opacity:.6}
.pg-hero .pp-l{display:grid;gap:9px}
.pg-hero .pp-r{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:10px;
  align-items:center;
  background:rgba(127,127,127,.08);
  border-radius:10px;
  padding:11px 13px;
  font-size:13px;
}
.pg-hero .pp-r i{
  width:7px;height:7px;border-radius:50%;
  background:#7cbf00;
}
.pg-hero .pp-r i.warn{background:#E0A526}
.pg-hero .pp-n{
  margin:14px 0 0;
  font-size:11.5px;
  opacity:.6;
  line-height:1.5;
}
@media (max-width:900px){
  .pg-hero .phero-in{grid-template-columns:1fr}
  .pg-hero .phero-panel{order:2}
}

/* ─────────── STAPALA · centrirana glava, ot kray do kray ─────────── */
section#stapala .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}
section#stapala .sh{
  max-width:none !important;
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
section#stapala .sh h2,
section#stapala .sh p{
  max-width:none !important;
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
section#stapala .plan-note{text-align:center !important}
@media (max-width:680px){
  section#stapala .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── PPAY-FIT · kratka liniya "podhodyashto, kogato" ─────────── */
.ppay .ppay-fit{
  display:block;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid rgba(127,127,127,.22);
  font-size:12.5px;
  line-height:1.55;
  opacity:.75;
}

/* ─────────── PLASHTA · centrirana glava, dva boksa v kolona + snimka ─────────── */
section#plashta .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}
section#plashta .sh{
  max-width:none !important;
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
section#plashta .sh h2,
section#plashta .sh p{
  max-width:none !important;
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
section#plashta .ppay-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:24px;
  align-items:stretch;
}
section#plashta .ppays{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:16px !important;
  align-content:start;
}
section#plashta .ppay-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:16px;
  border:1px solid rgba(127,127,127,.22);
}
@media (max-width:980px){
  section#plashta .ppay-row{grid-template-columns:1fr}
  section#plashta .ppay-img{height:auto;aspect-ratio:3/2}
}
@media (max-width:680px){
  section#plashta .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── PANELAT · snimka za fon na cyalata sekciya ─────────── */
section#panelat{
  background-color:#0B1220 !important;
  background-image:
    linear-gradient(rgba(11,18,32,.86), rgba(11,18,32,.86)),
    url('/assets/img/za-agencii2.webp?v=1790948816') !important;
  background-size:auto, cover !important;
  background-position:center, center !important;
  background-repeat:no-repeat, no-repeat !important;
  color:#fff !important;
}
section#panelat .wrap-w{
  max-width:none !important;
  padding-left:28px;
  padding-right:28px;
}
section#panelat h2{color:#fff !important}
section#panelat p{color:rgba(255,255,255,.80) !important}
section#panelat .ptick li{color:#0f172a !important}
@media (max-width:680px){
  section#panelat .wrap-w{padding-left:16px;padding-right:16px}
}

/* ─────────── PANELAT-PAD · padding na sekciyata ─────────── */
section#panelat{
  padding-top:clamp(44px,6vw,78px) !important;
  padding-bottom:clamp(44px,6vw,78px) !important;
}

/* ─────────── PANELAT-GUTTER · otstoyanie otlyavo i otdyasno ─────────── */
section#panelat .wrap-w.psplit{
  padding-left:clamp(16px,4vw,152px) !important;
  padding-right:clamp(16px,4vw,152px) !important;
  box-sizing:border-box !important;
}

/* ─────────── PG-PARTNERS-SH · centrirani zaglaviya na sekciite ─────────── */
.pg-partners .sh{
  max-width:none !important;
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.pg-partners .sh h2,
.pg-partners .sh p{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ─────────── PFORM-ROW · formata vlyavo, snimka vdyasno ─────────── */
section#kandidatstvane .wrap-w{
  max-width:1200px !important;
  margin-inline:auto !important;
  padding-left:clamp(16px,4vw,48px);
  padding-right:clamp(16px,4vw,48px);
  box-sizing:border-box;
}
section#kandidatstvane .pform-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:28px;
  align-items:stretch;
}
section#kandidatstvane .pform{min-width:0}
section#kandidatstvane .pform-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:16px;
  border:1px solid rgba(127,127,127,.22);
}
@media (max-width:980px){
  section#kandidatstvane .pform-row{grid-template-columns:1fr}
  section#kandidatstvane .pform-img{height:auto;aspect-ratio:16/9;order:2}
}

/* ─────────── PVAPROSI · zaglavie ot kray do kray, vaprosi v dve koloni ─────────── */
section#pvaprosi .wrap-w{
  max-width:none !important;
  padding-left:clamp(16px,4vw,52px);
  padding-right:clamp(16px,4vw,52px);
  box-sizing:border-box;
}
section#pvaprosi .sh,
section#pvaprosi .sh h2{
  max-width:none !important;
}
section#pvaprosi .pfaq{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:14px !important;
  align-items:start !important;
}
@media (min-width:1100px){
  section#pvaprosi .sh h2{white-space:nowrap}
}
@media (max-width:900px){
  section#pvaprosi .pfaq{grid-template-columns:1fr !important}
}

/* ─────────── PVAPROSI · centrirana lenta pod zaglavieto ─────────── */
section#pvaprosi .sh::after{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ─────────── PVAPROSI · centrirana lenta pod zaglavieto ─────────── */
section#pvaprosi .sh::after{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ─────────── PVAPROSI · po-shiroki boksove i centrirana glava ─────────── */
section#pvaprosi .sh,
section#pvaprosi .sh h2{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
  max-width:none !important;
}
section#pvaprosi .pfaq{
  max-width:none !important;
  width:100% !important;
}
section#pvaprosi .pfaq details{
  max-width:none !important;
  width:100% !important;
  box-sizing:border-box !important;
}

/* ─────────── RESHENIE · razpanat svetal boks ─────────── */
section#reshenie .wrap-n{
  max-width:none !important;
  padding-left:clamp(16px,4vw,52px);
  padding-right:clamp(16px,4vw,52px);
  box-sizing:border-box;
}
section#reshenie .pcta{
  max-width:none !important;
  width:100% !important;
  box-sizing:border-box !important;
  background:#F7F9FB !important;
  background-image:none !important;
  border:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 10px 30px rgba(15,23,42,.05) !important;
  color:#0f172a !important;
}
section#reshenie .pcta::before,
section#reshenie .pcta::after{display:none !important}
section#reshenie .pcta h2{color:#0f172a !important}
section#reshenie .pcta p{color:rgba(15,23,42,.70) !important}

/* ─────────── RESHENIE · tekstat ot kray do kray ─────────── */
section#reshenie .pcta h2,
section#reshenie .pcta p{
  max-width:none !important;
  width:auto !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ─────────── PVAPROSI · bez liniya nad boksovete ─────────── */
section#pvaprosi .pfaq{
  border-top:0 !important;
  padding-top:0 !important;
}
section#pvaprosi .pfaq::before{display:none !important}