/* =========================================================
   ТЕМА: LIQUID GLASS
   Плътно, пречупващо стъкло: капсулни форми, концентрични
   радиуси, светъл ръб отгоре и тъмен отдолу, плаващ навбар.
   ========================================================= */

:root{
  --ink:#0B1220; --ink-2:#33405A; --muted:#6B7896;
  --line:rgba(255,255,255,.72); --line-2:rgba(255,255,255,.45);
  --sand:#E7ECF3; --sand-2:rgba(255,255,255,.42); --paper:rgba(255,255,255,.58);
  --pine:#0B1220; --pine-2:#0A84FF; --pine-3:#0A84FF;
  --clay:#0A84FF; --clay-2:#0071E3;
  --gold:#FFD60A; --ok:#30D158;
  --serif:"Inter",system-ui,-apple-system,sans-serif;
  --sans:"Inter",system-ui,-apple-system,sans-serif;
  --r:18px; --r-l:28px; --r-xl:36px;
  --shadow:0 10px 30px rgba(11,18,32,.10);
  --shadow-l:0 24px 60px rgba(11,18,32,.16);
}

body{background:#E7ECF3}
body::before{
  content:"";position:fixed;inset:0;z-index:-2;
  background:
    radial-gradient(70% 60% at 8% 0%,rgba(120,180,255,.55),transparent 60%),
    radial-gradient(60% 55% at 96% 6%,rgba(190,160,255,.45),transparent 62%),
    radial-gradient(70% 60% at 60% 100%,rgba(120,225,220,.42),transparent 62%),
    linear-gradient(165deg,#F2F6FB,#DDE5EF);
}

h1,h2,h3,h4{font-weight:640;letter-spacing:-.035em}
h1,.h1{letter-spacing:-.045em}
.lead{color:#3E4A63}
.eyebrow{color:#0A84FF;font-weight:700;letter-spacing:.1em}
.eyebrow::before{background:#0A84FF;opacity:.7}

/* --- стъклени слоеве --- */
.card,.tbl-wrap,.stats,.float-card,.note,.mnav,.dash{
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.46));
  -webkit-backdrop-filter:blur(30px) saturate(190%);
  backdrop-filter:blur(30px) saturate(190%);
  border:1px solid rgba(255,255,255,.75);
  border-radius:var(--r-l);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 -1px 0 rgba(11,18,32,.07),
    0 18px 44px rgba(11,18,32,.13);
}
.card{position:relative;overflow:hidden}
.card::after{
  content:"";position:absolute;left:0;right:0;top:0;height:45%;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.5),transparent);
}
.card > *{position:relative;z-index:1}
.card-hover:hover{transform:translateY(-4px);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 30px 70px rgba(11,18,32,.2)}
.stats{gap:0}
.stat{background:transparent}
.stat + .stat{border-left:1px solid rgba(255,255,255,.6)}
@media(max-width:780px){.stat + .stat{border-left:0}}
.card-dark,.dark{
  background:linear-gradient(180deg,rgba(16,24,40,.72),rgba(8,12,22,.82));
  -webkit-backdrop-filter:blur(34px) saturate(160%);
  backdrop-filter:blur(34px) saturate(160%);
  color:#fff;border:1px solid rgba(255,255,255,.14);
}
.dark{border-left:0;border-right:0;border-radius:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.16)}
.card-dark{border-radius:var(--r-l)}
.dark .card{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.06));border-color:rgba(255,255,255,.2)}
.dark .stats{background:transparent;border-color:rgba(255,255,255,.2)}
.dark .stat{background:transparent}
.dark .eyebrow{color:#64D2FF}
.dark .eyebrow::before{background:#64D2FF}

/* --- плаващ навбар-капсула --- */
.topbar{background:rgba(11,18,32,.55);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.nav{background:transparent;border-bottom:0;padding:10px 0;-webkit-backdrop-filter:none;backdrop-filter:none}
.nav-in{
  height:66px;padding:0 10px 0 20px;border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,.5));
  -webkit-backdrop-filter:blur(30px) saturate(190%);
  backdrop-filter:blur(30px) saturate(190%);
  border:1px solid rgba(255,255,255,.8);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 12px 34px rgba(11,18,32,.16);
}
.logo-mark{background:linear-gradient(180deg,#3AA0FF,#0A84FF);border-radius:11px;box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 6px 14px rgba(10,132,255,.4)}
.menu > li > a{border-radius:999px;font-weight:600}
.menu > li > a:hover{background:rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.sub{border-radius:24px;padding:8px}
.sub a{border-radius:16px}
.burger{border-radius:999px;background:rgba(255,255,255,.7);border-color:rgba(255,255,255,.85)}

/* --- бутони: капсули със специален блик --- */
.btn{
  border-radius:999px;font-weight:650;position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,.5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 8px 20px rgba(11,18,32,.14);
}
.btn::after{content:"";position:absolute;inset:0 0 55% 0;background:linear-gradient(180deg,rgba(255,255,255,.45),transparent);pointer-events:none}
.btn-primary{background:linear-gradient(180deg,#3AA0FF,#0A84FF);border-color:rgba(255,255,255,.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 10px 26px rgba(10,132,255,.42)}
.btn-primary:hover{background:linear-gradient(180deg,#4AA9FF,#0B7BEF)}
.btn-dark{background:linear-gradient(180deg,rgba(30,40,60,.9),rgba(11,18,32,.95));border-color:rgba(255,255,255,.2)}
.btn-ghost{background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.45));border-color:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.btn-light{background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.78))}
.btn-outline-l{background:linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,.1));border-color:rgba(255,255,255,.4);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}

/* --- дребни елементи --- */
.badge{
  background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.55));
  border:1px solid rgba(255,255,255,.8);color:var(--ink-2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 3px 10px rgba(11,18,32,.08);
}
.badge.pine{background:linear-gradient(180deg,rgba(10,132,255,.24),rgba(10,132,255,.12));color:#0060C8;border-color:rgba(10,132,255,.28)}
.badge.clay{background:linear-gradient(180deg,rgba(255,159,10,.26),rgba(255,159,10,.12));color:#A85F00;border-color:rgba(255,159,10,.3)}
.badge.gold{background:linear-gradient(180deg,rgba(255,214,10,.3),rgba(255,214,10,.14));color:#8A6E00;border-color:rgba(255,214,10,.35)}
.badge-live{background:linear-gradient(180deg,rgba(48,209,88,.26),rgba(48,209,88,.12));color:#1B8A38;border-color:rgba(48,209,88,.3)}
.badge-live::before{background:#30D158}
.icon{
  background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,.5));
  border:1px solid rgba(255,255,255,.85);border-radius:16px;color:#0A84FF;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 6px 16px rgba(11,18,32,.1);
}
.dark .icon{background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.08));border-color:rgba(255,255,255,.24);color:#64D2FF}
.ribbon{background:linear-gradient(180deg,#3AA0FF,#0A84FF);border-radius:999px;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 8px 20px rgba(10,132,255,.4)}
.price-card.feature{border-color:rgba(10,132,255,.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 30px 70px rgba(10,132,255,.24)}
.link-arrow{color:#0A84FF;font-weight:650}

/* --- плейсхолдъри --- */
.ph,.shot{border-radius:var(--r-l);border:1px solid rgba(255,255,255,.5);box-shadow:0 20px 46px rgba(11,18,32,.16),inset 0 1px 0 rgba(255,255,255,.5)}
.ph::before{background:linear-gradient(160deg,rgba(120,180,255,.95),rgba(10,132,255,.85) 55%,rgba(20,40,90,.9))}
.ph.clay::before{background:linear-gradient(160deg,rgba(255,200,120,.9),rgba(255,120,60,.85))}
.ph.sand::before{background:linear-gradient(160deg,rgba(255,255,255,.95),rgba(200,215,235,.9))}
.ph.sand .ph-label{color:rgba(11,18,32,.5);border-color:rgba(11,18,32,.2)}
.ph.slate::before{background:linear-gradient(160deg,rgba(150,230,225,.9),rgba(20,60,90,.92))}
.ph::after{opacity:.08}
.ph-label{border-radius:999px}

/* --- форми --- */
input,select,textarea{
  background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.55));
  border:1px solid rgba(255,255,255,.85);border-radius:16px;
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(11,18,32,.05);
}
input:focus,select:focus,textarea:focus{border-color:rgba(10,132,255,.6);box-shadow:0 0 0 4px rgba(10,132,255,.18)}
.choice label{
  background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.5));
  border:1px solid rgba(255,255,255,.85);border-radius:999px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
.choice input:checked + label{background:linear-gradient(180deg,#3AA0FF,#0A84FF);color:#fff;border-color:rgba(255,255,255,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 8px 18px rgba(10,132,255,.35)}

/* --- таблици, акордеон, стъпки --- */
thead th{background:rgba(255,255,255,.5);color:var(--muted)}
th,td{border-bottom-color:rgba(255,255,255,.6)}
.acc,.acc details{border-color:rgba(255,255,255,.65)}
.acc summary::after{border-color:#0A84FF}
.steps{background:transparent;border:0;gap:12px}
.step{
  background:linear-gradient(180deg,rgba(255,255,255,.66),rgba(255,255,255,.42));
  -webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);
  border:1px solid rgba(255,255,255,.75);border-radius:var(--r-l);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 12px 30px rgba(11,18,32,.08);
  padding-left:clamp(16px,3vw,30px);padding-right:clamp(16px,3vw,30px);
}
.step-n{color:#0A84FF;opacity:.85}
.avatar{background:linear-gradient(180deg,#3AA0FF,#0A84FF);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.note{border-left:0;border-top:1px solid rgba(255,214,10,.6);background:linear-gradient(180deg,rgba(255,247,214,.8),rgba(255,247,214,.4))}
.dash{background:linear-gradient(180deg,rgba(16,24,40,.8),rgba(8,12,22,.9));border:1px solid rgba(255,255,255,.16)}
.dash-card{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.06));border-color:rgba(255,255,255,.2);border-radius:20px}
.bars i{background:linear-gradient(180deg,#FFD60A,rgba(255,214,10,.25));border-radius:6px}
.bars i.hi{background:linear-gradient(180deg,#64D2FF,rgba(100,210,255,.25))}
.loc-card{border-radius:var(--r-l);box-shadow:0 20px 44px rgba(11,18,32,.18)}
.feat-list li::before{background:rgba(10,132,255,.16);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A84FF' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E")}

footer.site{
  background:linear-gradient(180deg,rgba(16,24,40,.86),rgba(8,12,22,.94));
  -webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);
  border-top:1px solid rgba(255,255,255,.16);
}
footer.site .logo-mark{background:linear-gradient(180deg,#3AA0FF,#0A84FF)}

/* --- Падащото меню трябва да е четимо, не прозрачно --- */
.sub{
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,251,255,.97));
  -webkit-backdrop-filter:blur(30px) saturate(190%);
  backdrop-filter:blur(30px) saturate(190%);
  border:1px solid rgba(255,255,255,.9);
  border-radius:24px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,1),0 24px 50px rgba(11,18,32,.22);
}
.sub a{color:var(--ink)}
.sub a span{color:var(--muted)}
.sub a:hover{background:rgba(10,132,255,.10);color:var(--pine-2)}

/* --- избор върху тъмен фон: четимост --- */
.dark .choice label,.card-dark .choice label{
  background:linear-gradient(180deg,rgba(255,255,255,.20),rgba(255,255,255,.10));
  border-color:rgba(255,255,255,.34);color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28)
}
.dark .choice input:checked + label,.card-dark .choice input:checked + label{
  background:linear-gradient(180deg,#3AA0FF,#0A84FF);border-color:rgba(255,255,255,.45);color:#fff
}
.dark input,.dark select,.dark textarea,.card-dark input,.card-dark select,.card-dark textarea{
  background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.08));
  border-color:rgba(255,255,255,.28);color:#fff
}
.dark select option{color:#0B1220}

/* --- етикети в тъмни секции --- */
.dark .badge,.card-dark .badge{background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.10));border-color:rgba(255,255,255,.3);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.dark .badge.gold,.card-dark .badge.gold{background:linear-gradient(180deg,rgba(255,214,10,.34),rgba(255,214,10,.14));color:#FFE58A;border-color:rgba(255,214,10,.4)}
.dark .badge.pine,.card-dark .badge.pine{background:linear-gradient(180deg,rgba(100,210,255,.3),rgba(100,210,255,.12));color:#BFEAFF;border-color:rgba(100,210,255,.4)}
.dark .badge.clay,.card-dark .badge.clay{background:linear-gradient(180deg,rgba(255,159,10,.34),rgba(255,159,10,.14));color:#FFD9A8;border-color:rgba(255,159,10,.4)}

/* --- банер за бисквитки в стъкления стил --- */
.cc{
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.72));
  backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);
  border-color:rgba(255,255,255,.7);
  box-shadow:0 8px 40px rgba(16,24,21,.18),inset 0 1px 0 rgba(255,255,255,.8)
}