/* RIK MEDIA — brand assets page */
.bk-hero .ctas{justify-content:center;margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.bk-grid{display:grid;grid-template-columns:200px 1fr;gap:48px;align-items:start;padding-bottom:40px}
.bk-toc{position:sticky;top:110px;display:flex;flex-direction:column;gap:2px;padding:14px;border-radius:18px;background:var(--panel);border:1px solid var(--line)}
.bk-toc a{padding:9px 12px;border-radius:10px;color:var(--tx2);font-weight:500;font-size:15px;border-inline-start:2px solid transparent;transition:.2s}
.bk-toc a:hover{color:var(--tx);background:rgba(255,255,255,.04)}
.bk-toc a.on{color:var(--cyan);border-inline-start-color:var(--cyan);background:rgba(25,198,245,.06)}
.bk-toc .bk-toc-dl{margin-top:8px;display:flex;align-items:center;gap:8px;justify-content:center;background:var(--grad);color:#fff;font-weight:700;border:0}
.bk-toc .bk-toc-dl:hover{color:#fff;background:var(--grad);filter:brightness(1.1)}
.bk-toc .i,.bk-dl .i,.bk-font .i{width:17px;height:17px}
.bk-main{min-width:0}
.bk-sec{padding:34px 0 46px;border-bottom:1px solid var(--line);scroll-margin-top:100px}
.bk-sec:last-child{border-bottom:0}
.bk-sec>h2{font-size:clamp(28px,3vw,38px);font-weight:800;margin-bottom:26px}
.bk-h3{font-size:20px;font-weight:700;margin:34px 0 16px;color:var(--tx)}
.bk-lead,.bk-note{color:var(--tx2)}
.bk-note{font-size:14px;margin-top:14px}
/* logos */
.bk-logos{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.bk-logo{margin:0;border-radius:18px;overflow:hidden;background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column}
.bk-pv{position:relative;aspect-ratio:4/3}
.bk-pv img{position:absolute;inset:0;margin:auto;max-width:calc(100% - 44px);max-height:calc(100% - 44px);object-fit:contain}
.bg-light{background:#fff}
.bg-dark{background:#050b1a;background-image:radial-gradient(circle at 80% 10%,rgba(10,108,240,.35),transparent 60%)}
.bg-grad{background:linear-gradient(135deg,#19c6f5,#0a6cf0 55%,#0b3a8a)}
.bg-ice{background:#eaf1ff}
.bk-logo figcaption{padding:14px 16px;display:flex;flex-direction:column;gap:3px}
.bk-logo figcaption b{font-size:16px}
.bk-logo figcaption small{color:var(--tx3);font-size:13px}
.bk-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.bk-dl{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:9px;border:1px solid var(--line2);font-size:13px;font-weight:700;color:var(--tx);transition:.2s}
.bk-dl:hover{border-color:var(--cyan);color:var(--cyan)}
/* rules */
.bk-rules{display:grid;grid-template-columns:260px 1fr;gap:26px;margin-top:30px;align-items:center}
.bk-space{display:flex;flex-direction:column;gap:12px}
.bk-space-box{position:relative;background:#fff;border-radius:16px;padding:34px;display:grid;place-items:center}
.bk-space-box img{width:100%;max-width:150px;outline:1px dashed rgba(10,108,240,.5);outline-offset:18px}
.bk-space-box i{position:absolute;background:rgba(25,198,245,.18)}
.bk-space-box .t,.bk-space-box .b{left:16px;right:16px;height:16px}.bk-space-box .t{top:16px}.bk-space-box .b{bottom:16px}
.bk-space-box .l,.bk-space-box .r{top:16px;bottom:16px;width:16px}.bk-space-box .l{left:16px}.bk-space-box .r{right:16px}
.bk-space p{font-size:14px;color:var(--tx2)}.bk-space p b{display:block;color:var(--tx);font-size:15px}
.bk-list{display:flex;flex-direction:column;gap:12px;padding:0;margin:0}
.bk-list li{list-style:none;position:relative;padding-inline-start:28px;color:var(--tx2)}
.bk-list li::before{content:"";position:absolute;inset-inline-start:0;top:9px;width:14px;height:8px;border-inline-start:2px solid var(--cyan);border-bottom:2px solid var(--cyan);transform:rotate(-45deg)}
.bk-list b{color:var(--tx)}
/* donts */
.bk-donts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.bk-dont{margin:0;border-radius:16px;overflow:hidden;border:1px solid rgba(239,68,68,.35);background:var(--panel)}
.bk-dont .bk-pv{aspect-ratio:16/10}
.bk-dont .bk-pv img{max-width:60%;max-height:70%}
.bk-dont .bk-pv::after{content:"";position:absolute;top:10px;inset-inline-end:10px;width:24px;height:24px;border-radius:50%;background:#ef4444 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E") center/14px no-repeat}
.bk-dont figcaption{padding:10px 12px;font-size:13.5px;color:#fca5a5;font-weight:700;text-align:center}
.d-st img{transform:scaleX(1.55) scaleY(.7)}
.d-hue img{filter:hue-rotate(150deg) saturate(1.6)}
.d-rot img{transform:rotate(-22deg)}
.d-busy{background:repeating-linear-gradient(45deg,#f59e0b 0 14px,#ec4899 14px 28px,#22c55e 28px 42px)}
.d-fx img{filter:drop-shadow(6px 8px 0 #ef4444) drop-shadow(-4px -4px 10px #f59e0b)}
.d-low img{opacity:.35}
/* colors */
.bk-gradient{position:relative;display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;min-height:130px;padding:20px;border-radius:18px;background:linear-gradient(135deg,#19c6f5 0%,#0a6cf0 55%,#0b3a8a 100%);margin-bottom:16px;color:#fff}
.bk-gradient span{font-weight:800;font-size:18px;width:100%}
.bk-gradient code{direction:ltr;font-size:13px;background:rgba(0,0,0,.22);padding:6px 10px;border-radius:8px}
.bk-gradient button{margin-inline-start:auto;padding:8px 14px;border-radius:10px;background:#fff;color:var(--navy);font-weight:700;font-size:13px;cursor:pointer}
.bk-colors{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.bk-color{display:flex;flex-direction:column;text-align:right;border-radius:18px;overflow:hidden;background:var(--panel);border:1px solid var(--line);cursor:pointer;color:var(--tx);font:inherit;padding:0;transition:.2s}
.bk-color:hover{border-color:var(--cyan);transform:translateY(-3px)}
.bk-color .sw{height:110px;border-bottom:1px solid var(--line)}
.bk-color .ci{padding:14px 16px;display:flex;flex-direction:column;align-items:stretch;gap:4px;text-align:right}
.bk-color .ci>*{text-align:right}
.bk-color b{font-size:17px}.bk-color b small{color:var(--tx3);font-weight:500;font-size:13px}
.bk-color em{font-style:normal;color:var(--tx3);font-size:13px}
.bk-color dl{display:grid;grid-template-columns:52px 1fr;gap:3px 12px;margin:8px 0 0;font-size:13.5px}
.bk-color dt{color:var(--tx3);font-weight:700}.bk-color dd{margin:0;direction:ltr;text-align:right;font-family:ui-monospace,Consolas,monospace}
/* type */
.bk-type{display:grid;gap:12px}
.ty{padding:20px 22px;border-radius:18px;background:var(--panel);border:1px solid var(--line);display:grid;grid-template-columns:150px 1fr auto;gap:16px;align-items:center}
.ty span{color:var(--tx3);font-size:13px;font-weight:700}
.ty p{margin:0;color:var(--tx)}
.ty code{direction:ltr;font-size:12.5px;color:var(--cyan);background:rgba(25,198,245,.08);padding:5px 9px;border-radius:8px;white-space:nowrap}
.t1 p{font-size:clamp(26px,3.4vw,42px);font-weight:800;line-height:1.2}
.t2 p{font-size:24px;font-weight:700}
.t3 p{font-size:16px;line-height:1.8;color:var(--tx2)}
.t4 p{font-size:22px;font-weight:700;letter-spacing:.5px;text-align:right}
.bk-font{margin-top:18px}
/* name */
.bk-dodont{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.bk-dodont>div{padding:20px 22px;border-radius:18px;background:var(--panel);border:1px solid var(--line)}
.bk-dodont .do{border-color:rgba(34,197,94,.4)}.bk-dodont .dont{border-color:rgba(239,68,68,.4)}
.bk-dodont h4{display:flex;align-items:center;gap:8px;font-size:18px;margin-bottom:12px}
.bk-dodont .do h4{color:#4ade80}.bk-dodont .dont h4{color:#f87171}
.bk-dodont h4 .i{width:20px;height:20px}
.bk-dodont ul{padding-inline-start:18px;display:flex;flex-direction:column;gap:8px;color:var(--tx2)}
.bk-dodont b{color:var(--tx)}
/* templates */
.bk-tpls{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.bk-tpl{display:flex;flex-direction:column;gap:3px;padding:10px;border-radius:16px;background:var(--panel);border:1px solid var(--line);transition:.2s}
.bk-tpl:hover{border-color:var(--cyan);transform:translateY(-3px)}
.bk-tpl .th{position:relative;aspect-ratio:4/3;border-radius:10px;background:var(--bg2);overflow:hidden;margin-bottom:8px}
.bk-tpl .th img{position:absolute;inset:0;margin:auto;max-width:calc(100% - 20px);max-height:calc(100% - 20px);object-fit:contain;border-radius:4px;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.bk-tpl b{font-size:14.5px}.bk-tpl small{color:var(--tx3);font-size:12.5px}
.bk-checks{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:30px}
.bk-checks>div{padding:20px 22px;border-radius:18px;background:var(--panel);border:1px solid var(--line)}
.bk-checks h4{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:17px}
.bk-checks h4 .i{width:20px;height:20px;color:var(--cyan)}
.bk-checks ul{padding-inline-start:18px;display:flex;flex-direction:column;gap:7px;color:var(--tx2);font-size:15px}
/* icons */
.bk-icons{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
.bk-ic{padding:20px 14px;border-radius:18px;background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.bk-ic img{margin-bottom:6px;filter:drop-shadow(0 10px 18px rgba(10,108,240,.35))}
.bk-ic code{direction:ltr;color:var(--tx3);font-size:12px}
.bk-ic .bk-btns{justify-content:center}
.bk .band{margin-top:10px}
/* toast */
.bk-toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:11px 18px;border-radius:12px;background:var(--panel2);border:1px solid var(--line2);color:var(--tx);font-weight:700;font-size:14px;transition:.25s;z-index:99;direction:ltr}
.bk-toast.on{opacity:1;transform:translate(-50%,0)}
@media (max-width:1180px){.bk-logos{grid-template-columns:repeat(3,1fr)}}
@media (max-width:980px){
  .bk-logos{grid-template-columns:repeat(2,1fr)}
  .bk-donts{grid-template-columns:repeat(2,1fr)}
  .bk-grid{grid-template-columns:1fr;gap:10px}
  .bk-toc{position:sticky;top:70px;z-index:5;flex-direction:row;overflow-x:auto;padding:8px;border-radius:14px;scrollbar-width:none}
  .bk-toc a{white-space:nowrap;border-inline-start:0;border-bottom:2px solid transparent;font-size:14px;padding:8px 12px}
  .bk-toc a.on{border-bottom-color:var(--cyan)}
  .bk-toc .bk-toc-dl{margin:0}
  .bk-rules,.bk-dodont,.bk-checks{grid-template-columns:1fr}
  .ty{grid-template-columns:1fr;gap:8px}
  .ty code{justify-self:start}
}