/* Winlead — общая дизайн-система (светлая + тёмная). Источник: landing-visual / STYLE.md.
   Станет style.css темы WordPress. */
:root{
  --bg:#f7f7fb; --card:#ffffff; --raise:#f2f1f8; --brd:#ececf2; --brd-2:#e0deea;
  --tx:#14121f; --tx-2:#5a5c64; --tx-3:#9a97a8;
  --acc:#7262b0; --acc-2:#9b86e8; --acc-dim:#ede9f8; --acc-warm:#e8714a; --good:#1a9e52; --good-bg:#e4f6ec; --crit:#d14b52; --crit-bg:#fdecee;
  --muted-fill:#c9c6d6; --blob1:#ddd2f7; --blob2:#d4e6fb; --header-bg:rgba(247,247,251,.8);
  --disp:'Unbounded',system-ui,sans-serif; --body:'Inter',system-ui,sans-serif; color-scheme:light;
}
:root[data-theme="dark"]{
  --bg:#0c0d14; --card:#15161f; --raise:rgba(255,255,255,.05); --brd:rgba(255,255,255,.09); --brd-2:rgba(255,255,255,.14);
  --tx:#eceaf4; --tx-2:#a3a0b4; --tx-3:#6f6c82;
  --acc:#8b7ad4; --acc-2:#c3b3ff; --acc-dim:rgba(139,122,212,.2); --good:#34cf74; --good-bg:rgba(52,207,116,.15); --crit:#ef6f76; --crit-bg:rgba(239,111,118,.15);
  --muted-fill:rgba(255,255,255,.16); --blob1:#7262b0; --blob2:#4b4a8e; --header-bg:rgba(12,13,20,.75); color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden}
body{margin:0;background:var(--bg);color:var(--tx);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
.blob{position:fixed;border-radius:50%;filter:blur(90px);z-index:-1}
.b1{width:560px;height:560px;top:-16%;right:-6%;background:radial-gradient(circle,var(--blob1),transparent 66%);opacity:.9}
.b2{width:520px;height:520px;bottom:-20%;left:-10%;background:radial-gradient(circle,var(--blob2),transparent 66%);opacity:.85}
:root[data-theme="dark"] .blob{opacity:.42}
.wrap{max-width:1100px;margin:0 auto;padding-inline:22px}
.wrap.narrow{max-width:760px}
h1,h2,h3{margin:0;font-family:var(--disp);font-weight:800;line-height:1.06;letter-spacing:-.025em;text-wrap:balance}
p{margin:0;text-wrap:pretty}a{color:inherit;text-decoration:none}
svg{display:block}
.grad{background:linear-gradient(110deg,#9b86e8,#7262b0);-webkit-background-clip:text;background-clip:text;color:transparent}
.dot-acc{color:var(--acc-warm)}
.btn{font-family:var(--body);font-weight:600;font-size:15px;border:1px solid var(--brd-2);background:var(--card);color:var(--tx);padding:13px 22px;border-radius:12px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .15s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px -12px rgba(60,40,120,.4)}
.btn.pri{background:var(--acc);border-color:transparent;color:#fff;box-shadow:0 8px 22px -8px var(--acc)}
.btn.sm{padding:9px 16px;font-size:14px}
.kick{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--acc);background:var(--acc-dim);padding:7px 14px;border-radius:999px}

/* header */
header.site{position:sticky;top:0;z-index:30;background:var(--header-bg);backdrop-filter:blur(14px);border-bottom:1px solid var(--brd)}
.hdr{display:flex;align-items:center;gap:16px;height:64px}
.brand img{height:25px;display:block}.brand .logo-w{display:none}
:root[data-theme="dark"] .brand .logo-c{display:none}
:root[data-theme="dark"] .brand .logo-w{display:block}
.links{margin-left:auto;display:flex;gap:22px;font-size:14px;color:var(--tx-2)}.links a:hover{color:var(--tx)}.links a.on{color:var(--acc)}
.tgl{background:var(--raise);border:1px solid var(--brd-2);color:var(--tx-2);border-radius:999px;width:36px;height:36px;cursor:pointer;font-size:15px}
.burger{display:none;background:var(--raise);border:1px solid var(--brd-2);color:var(--tx);border-radius:10px;width:40px;height:40px;cursor:pointer;align-items:center;justify-content:center;flex:none}
.burger svg{width:20px;height:20px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}
.m-cta{display:none}
@media(max-width:760px){
  .hdr .hdr-cta{display:none}
  .burger{display:inline-flex}
  .tgl{margin-left:auto}
  .links{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;margin:0;background:var(--card);border-bottom:1px solid var(--brd);box-shadow:0 22px 44px -22px rgba(60,40,120,.4);padding:10px 22px 18px;display:none}
  .links.open{display:flex}
  .links a{padding:13px 2px;font-size:16px;color:var(--tx-2)}
  .links a.on{color:var(--acc)}
  .m-cta{display:inline-flex;justify-content:center;margin-top:10px;font-size:15px;color:#fff}
}

/* footer */
footer.site{color:var(--tx-3);font-size:13px;padding-block:28px;border-top:1px solid var(--brd);margin-top:48px}
.foot-grid{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.fcol{display:flex;flex-direction:column}
.fcol-brand{gap:14px;max-width:280px}
.fcol-brand .brand img{height:26px}
.fabout{font-size:13px;color:var(--tx-3);line-height:1.55}
.foot-menu{gap:11px}
.foot-menu .fm-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--tx-3);margin-bottom:2px}
.foot-menu a{color:var(--tx-2);font-size:14px}.foot-menu a:hover{color:var(--acc)}
.foot-contacts{gap:14px;align-items:flex-start}
.qlead{font-size:13px;color:var(--tx-2);font-weight:600}
@media(max-width:620px){.foot-grid{gap:30px}}
.qrow{display:flex;gap:18px;flex-wrap:wrap}
.qcard{display:flex;flex-direction:column;align-items:center;gap:8px;color:inherit;transition:transform .15s cubic-bezier(.34,1.56,.64,1)}
.qcard:hover{transform:translateY(-2px)}
.qcard .qbox{width:92px;height:92px;background:#fff;border-radius:12px;padding:7px;border:1px solid var(--brd-2);display:block;box-shadow:0 8px 22px -14px rgba(60,40,120,.4)}
.qcard .qbox img{width:100%;height:100%;display:block}
.qcard .qlbl{font-size:12px;color:var(--tx-2);font-weight:600}

/* page head */
.phead{padding-block:40px 6px}
.phead .kick{margin-bottom:14px}
.phead h1{font-size:clamp(30px,5vw,50px);font-weight:900;letter-spacing:-.03em}
.phead p{color:var(--tx-2);font-size:17px;margin-top:12px;max-width:62ch}

/* search */
.search{display:flex;gap:10px;margin-top:24px;max-width:560px}
.search .fld{flex:1;position:relative;display:flex;align-items:center}
.search .fld svg{position:absolute;left:14px;width:18px;height:18px;stroke:var(--tx-3);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.search input{flex:1;font-family:var(--body);font-size:15px;color:var(--tx);background:var(--raise);border:1px solid var(--brd-2);border-radius:12px;padding:13px 16px 13px 42px;width:100%}
.search input::placeholder{color:var(--tx-3)}
.search input:focus{outline:none;border-color:var(--acc)}

/* category chips */
.cats{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.cat{font-size:13px;font-weight:600;color:var(--tx-2);background:var(--raise);border:1px solid var(--brd);padding:8px 14px;border-radius:999px;cursor:pointer;transition:color .15s}
.cat:hover{color:var(--tx)}
.cat.on{background:var(--acc);border-color:transparent;color:#fff}
.cat .c{opacity:.55;margin-left:5px;font-weight:500}

/* article cards grid */
.arts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
@media(max-width:860px){.arts{grid-template-columns:1fr 1fr}}@media(max-width:560px){.arts{grid-template-columns:1fr}}
.art{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--brd);border-radius:16px;overflow:hidden;color:inherit;transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .15s}
.art:hover{transform:translateY(-3px);box-shadow:0 18px 40px -22px rgba(60,40,120,.4)}
.art .thumb{aspect-ratio:16/9;background:var(--raise);overflow:hidden;position:relative}
.art .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.art .tag{position:absolute;top:11px;left:11px;font-size:11px;font-weight:700;color:#fff;background:rgba(114,98,176,.92);padding:4px 11px;border-radius:999px;backdrop-filter:blur(4px)}
.art .body{padding:18px;display:flex;flex-direction:column;gap:9px;flex:1}
.art h3{font-family:var(--body);font-weight:700;font-size:16px;line-height:1.32;letter-spacing:0}
.art .ex{font-size:13.5px;color:var(--tx-2);line-height:1.5}

/* byline + stats (author, date, reading time, views, likes) */
.byline{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--tx-2)}
.byline .av{width:22px;height:22px;border-radius:50%;background:var(--acc-dim);color:var(--acc);display:grid;place-items:center;font-size:10px;font-weight:700;font-family:var(--body);flex:none}
.byline .dot{color:var(--tx-3)}
.stats{margin-top:auto;display:flex;align-items:center;gap:15px;flex-wrap:wrap;font-size:12px;color:var(--tx-3);padding-top:4px}
.stats .m{display:inline-flex;align-items:center;gap:5px}
.stats .m svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.stats .m.liked svg{fill:var(--crit);stroke:var(--crit)}.stats .m.liked{color:var(--crit)}

/* listing utility */
.count{color:var(--tx-3);font-size:14px;margin-top:22px}
.count b{color:var(--tx);font-weight:700}
.empty{margin-top:40px;text-align:center;color:var(--tx-2)}
.empty .ic-badge{width:56px;height:56px;border-radius:15px;background:var(--acc-dim);display:grid;place-items:center;margin:0 auto 16px}
.empty .ic-badge svg{width:28px;height:28px;stroke:var(--acc);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* 404 */
.e404{text-align:center;padding-block:60px 30px}
.e404 .code{font-family:var(--disp);font-weight:900;font-size:clamp(96px,16vw,170px);line-height:1;letter-spacing:-.04em;background:linear-gradient(110deg,#9b86e8,#7262b0);-webkit-background-clip:text;background-clip:text;color:transparent}
.e404 .code .dot-acc{-webkit-text-fill-color:var(--acc-warm);color:var(--acc-warm)}
.e404 h1{font-size:clamp(26px,4vw,38px);font-weight:900;letter-spacing:-.03em;margin-top:4px}
.e404 p{color:var(--tx-2);font-size:17px;margin:14px auto 0;max-width:46ch}
.e404 .search{margin:24px auto 0;justify-content:center}
.e404-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:22px}

/* cookie-баннер (152-ФЗ) */
.cookiebar{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:560px;margin:0 auto;background:var(--card);border:1px solid var(--brd-2);border-radius:14px;box-shadow:0 24px 60px -24px rgba(60,40,120,.45);padding:16px 18px;display:none;align-items:center;gap:14px;flex-wrap:wrap}
.cookiebar.show{display:flex}
.cookiebar p{font-size:13.5px;color:var(--tx-2);line-height:1.5;flex:1;min-width:220px;margin:0}
.cookiebar a{color:var(--acc);text-decoration:underline;text-underline-offset:2px}
.cookiebar .btn{white-space:nowrap}
@media(prefers-reduced-motion:no-preference){.cookiebar.show{animation:cbup .3s cubic-bezier(.34,1.56,.64,1)}}
@keyframes cbup{from{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}

/* single article */
.ahero{padding-block:28px 10px}
.ahero .kick{margin-bottom:16px}
.ahero h1{font-size:clamp(28px,4.4vw,46px);font-weight:900;letter-spacing:-.03em;max-width:22ch}
.ahero .meta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:18px;font-size:13.5px;color:var(--tx-2)}
.ahero .meta .byline{font-size:13.5px}
.ahero .meta .byline .av{width:28px;height:28px;font-size:12px}
.ahero .meta .stats{margin:0;padding:0;font-size:13.5px;color:var(--tx-2)}
.ahero .meta .stats .m svg{width:15px;height:15px}
.cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:18px;border:1px solid var(--brd);margin-top:22px}

/* prose (post body) */
.prose{font-size:17px;line-height:1.72;color:var(--tx);margin-top:30px}
.prose>*+*{margin-top:18px}
.prose h2{font-family:var(--disp);font-size:clamp(22px,3.1vw,30px);font-weight:800;letter-spacing:-.02em;margin-top:40px}
.prose h3{font-family:var(--body);font-weight:700;font-size:20px;margin-top:30px}
.prose a{color:var(--acc);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.prose ul,.prose ol{padding-left:22px}.prose li{margin-top:8px}
.prose img{width:100%;border-radius:14px;border:1px solid var(--brd)}
.prose blockquote{border-left:3px solid var(--acc);padding:2px 0 2px 20px;margin-left:0;color:var(--tx-2);font-size:19px;font-style:italic}
.prose code{background:var(--raise);padding:2px 7px;border-radius:6px;font-size:.9em}
.prose strong{font-weight:700;color:var(--tx)}
.prose .tbl{border:1px solid var(--brd);border-radius:12px;overflow-x:auto;margin-top:12px}
.prose table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:520px}
.prose th,.prose td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--brd);vertical-align:top}
.prose th{background:var(--raise);font-weight:700;color:var(--tx);font-size:12px;letter-spacing:.02em;text-transform:uppercase}
.prose tbody tr:last-child td{border-bottom:none}
.prose td{color:var(--tx-2)}
/* нейтрализуем инлайн-цвета из вставок (Google Docs и т.п.) — чтобы работала тёмная тема */
.prose :not(a)[style*="color"]{color:var(--tx) !important}

/* like / share bar */
.actbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:34px}
.lk{display:inline-flex;align-items:center;gap:8px;font-family:var(--body);font-weight:600;font-size:14px;color:var(--tx-2);background:var(--card);border:1px solid var(--brd-2);border-radius:999px;padding:9px 16px;cursor:pointer;transition:transform .15s cubic-bezier(.34,1.56,.64,1)}
.lk:hover{transform:translateY(-2px)}
.lk svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.lk.on{color:var(--crit);border-color:var(--crit)}.lk.on svg{fill:var(--crit);stroke:var(--crit)}

/* author box */
.authorbox{display:flex;gap:16px;align-items:center;background:var(--card);border:1px solid var(--brd);border-radius:18px;padding:22px;margin-top:40px}
.authorbox .big{width:54px;height:54px;border-radius:50%;background:var(--acc-dim);color:var(--acc);display:grid;place-items:center;font-size:20px;font-weight:800;font-family:var(--disp);flex:none}
.authorbox .who{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--acc);font-weight:700}
.authorbox h3{font-family:var(--body);font-weight:700;font-size:17px;margin-top:2px}
.authorbox p{color:var(--tx-2);font-size:14px;margin-top:4px}

/* section heading */
.sh{margin:0 0 20px}
.sh h2{font-size:clamp(22px,3.4vw,32px);font-weight:900;letter-spacing:-.03em}

/* CTA band */
.final{text-align:center;background:linear-gradient(135deg,#7262b0,#9b86e8);color:#fff;border-radius:24px;padding:clamp(34px,5vw,52px);margin-top:48px}
.final h2{font-size:clamp(26px,4vw,40px);font-weight:900}.final p{opacity:.9;margin-top:12px;font-size:16px}.final .btn{margin-top:22px;background:#fff;color:var(--acc);border-color:transparent}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}