/* ═══════════════════════════════════════════════════════════════════════════
   ОБЩ СТИЛ на страниците извън уроците (начална, категории, комплекти).
   Уроците на дъската си остават с `deck-core.css` - там правилата са други
   (чете се от последния чин, всичко се мери във `vh`).

   ⚠ Картите за областите и уроците показват БАНЕРИ 2400x840 (2.857:1). Кутията
     на корицата е със същото съотношение (`aspect-ratio:1200/420`), за да не
     реже банера отгоре-отдолу - точно това правеше `height:180px;object-fit:cover`.
   ⚠ Шрифтът е Sofia Sans (публичен, с кирилица). Пада на системния, ако Google
     Fonts е недостъпен - страницата остава четима.
   ═══════════════════════════════════════════════════════════════════════════ */
*{box-sizing:border-box;margin:0;padding:0}
:root{--navy:#071A3D;--blue:#1B5FAF;--blued:#12457f;--ink:#4F4C51;--soft:#F4F7FB;
      --line:#e3e9f1;--muted:#7a8699}
body{font-family:'Sofia Sans',system-ui,sans-serif;color:var(--ink);background:#fff;line-height:1.6}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}

header.top{border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:20}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:18px}
.logo{height:30px;width:auto}
nav.main{display:flex;gap:24px;font-size:15px;font-weight:600;flex-wrap:wrap}
nav.main a{color:var(--navy)}
.cta{background:var(--blue);color:#fff;padding:9px 18px;border-radius:4px;font-weight:600;font-size:15px;white-space:nowrap}
.cta:hover{background:var(--blued);color:#fff;text-decoration:none}

.hero{position:relative;min-height:440px;display:flex;align-items:center;
      background:linear-gradient(135deg,#071A3D 0%,#123A72 55%,#1B5FAF 100%);
      background-size:cover;background-position:center}
/* ⚠ Банерите носят СОБСТВЕН текст (заглавие на урока). През светлия край на
   воала той прозираше и се четеше зад заглавието на страницата. Затова воалът е
   плътен докрай, а снимката остава само като фон с настроение. */
.hero .veil{position:absolute;inset:0;backdrop-filter:blur(3px);
  background:linear-gradient(90deg,rgba(7,26,61,.96) 0%,rgba(7,26,61,.90) 55%,rgba(7,26,61,.72) 100%)}
.hero .wrap{position:relative;z-index:2;color:#fff;padding:66px 24px}
.hero h1{font-size:56px;line-height:1.06;font-weight:800;letter-spacing:-.01em;max-width:18ch}
.hero .sub{font-size:23px;font-weight:600;margin-top:10px;color:#cbd8ea}
.hero .lead{font-size:17px;margin-top:16px;max-width:54ch;color:#e4ebf5}
.hero .btns{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap}
.hero .btn{background:var(--blue);color:#fff;padding:12px 22px;border-radius:4px;font-weight:600}
.hero .btn:hover{background:var(--blued);color:#fff;text-decoration:none}
.hero .btn.ghost{background:transparent;border:2px solid #ffffff66}
.hero .btn.ghost:hover{background:#ffffff1a}

.crumbs{background:var(--soft);font-size:14px}
.crumbs .wrap{padding:12px 24px;color:var(--muted)}
.crumbs a{color:var(--muted)}

section{padding:60px 0}
h2{color:var(--navy);font-size:34px;font-weight:800;margin-bottom:16px}
h3{color:var(--navy);font-size:20px;font-weight:700;margin-bottom:8px}
p{margin-bottom:14px}
.two{display:grid;grid-template-columns:1fr 1.1fr;gap:46px;align-items:start}

.stats{background:var(--soft)}
.stats .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:26px}
.stat{background:var(--blue);color:#fff;border-radius:6px;padding:32px 20px;text-align:center}
.stat .ico{font-size:32px;line-height:1}
.stat .num{font-size:42px;font-weight:800;margin:8px 0 2px}
.stat .lbl{font-size:16px;color:#d8e4f4}

/* ── карти: корицата е с пропорцията на банера, за да не се реже ── */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:24px}
.cards.two-col{grid-template-columns:repeat(2,1fr)}
.card{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#fff;
      display:flex;flex-direction:column;color:inherit}
.card:hover{box-shadow:0 10px 26px #071a3d1a;text-decoration:none}
.card .cover{position:relative;aspect-ratio:1200/420;background:var(--soft);overflow:hidden}
.card .cover img{width:100%;height:100%;object-fit:cover;display:block}
.card .body{padding:16px 18px 20px}
.card .ttl{color:var(--navy);font-size:19px;font-weight:700;margin-bottom:6px;line-height:1.25}
.card .meta{font-size:13.5px;color:var(--muted);margin-bottom:8px}
.card .meta b{color:var(--navy)}
.card .hook{font-size:15px}
.card .acc{position:absolute;left:0;bottom:0;background:#0E7C7B;color:#fff;font-size:12.5px;
           font-weight:700;padding:5px 14px;border-radius:0 4px 0 0}
.card .acc.reg{background:#b4690e}
.tag{display:inline-block;font-size:12.5px;color:var(--blue);background:#eaf2fb;
     border-radius:3px;padding:3px 9px;margin-bottom:8px}

.pill{display:block;border:2px solid var(--blue);color:var(--blue);border-radius:4px;
      padding:13px 18px;font-weight:600;text-align:center;margin-bottom:12px;background:#fff}
.pill:hover{background:var(--blue);color:#fff;text-decoration:none}
.pill small{display:block;font-weight:500;font-size:13px;opacity:.75}

.note{background:#fff8e6;border:1px solid #f0d79a;border-radius:6px;padding:14px 18px;
      font-size:14px;color:#7a5a12;margin:24px 0}

/* ── търсачка (началната страница) ── */
.search{position:relative;max-width:620px;margin-top:22px}
.search input{width:100%;font:inherit;font-size:17px;color:var(--ink);background:#fff;
  border:2px solid transparent;border-radius:6px;padding:15px 18px}
.search input:focus{outline:none;border-color:var(--blue)}
.res{display:none;position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;
  border:1px solid var(--line);border-radius:6px;box-shadow:0 18px 40px #071a3d33;
  max-height:60vh;overflow:auto;z-index:30;text-align:left}
.res.on{display:block}
.res a{display:block;padding:11px 16px;border-bottom:1px solid #f1f4f8;color:var(--navy)}
.res a:hover{background:var(--soft);text-decoration:none}
.res .rt{font-weight:600;font-size:15.5px}
.res .rc{font-size:13px;color:var(--muted)}

footer.site{background:var(--navy);color:#c3cde0;padding:52px 0 26px}
footer.site .grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:36px}
footer.site h4{color:#fff;font-size:16px;margin-bottom:12px}
footer.site a{color:#c3cde0;display:block;padding:4px 0;font-size:15px}
footer.site .fine{border-top:1px solid #ffffff1f;margin-top:32px;padding-top:16px;
                  font-size:13px;color:#8a97ae}

@media (max-width:900px){
  .two,.cards,.cards.two-col,.stats .grid,footer.site .grid{grid-template-columns:1fr}
  .hero h1{font-size:38px}
  .hero{min-height:360px}
  nav.main{display:none}
}