:root{
  --tm-navy:#151722;
  --tm-navy-2:#1c1e2c;
  --tm-panel:#222433;
  --tm-blue:#478ac9;
  --tm-blue-dark:#387cbd;
  --tm-pink:#ff80de;
  --tm-teal:#19c1c2;
  --tm-purple:#601569;
  --tm-line:#33364a;
  --tm-muted:#a9adc0;
  --tm-ok:#4bd18a;
}
html{background:var(--tm-navy)}
body.u-body{background:var(--tm-navy-2);color:#fff;font-family:"Open Sans","Geologica",-apple-system,"Segoe UI",sans-serif}
.u-sheet{width:100%;max-width:1180px;margin:0 auto;padding:0 18px;box-sizing:border-box}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto}
.u-custom-color-14{background:var(--tm-navy)}
.u-custom-color-15{background:var(--tm-blue)}
.u-custom-color-16{background:var(--tm-blue)}
.u-custom-color-17{background:var(--tm-navy-2)}
.u-custom-color-18{background:var(--tm-panel)}

/* ---------- header ---------- */
.u-header{position:relative;z-index:20;min-height:auto;padding:14px 0;border-bottom:1px solid var(--tm-line)}
.u-header .u-sheet-1{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:auto}
a.u-logo{display:inline-flex;align-items:center;gap:10px;flex:0 0 auto}
.u-logo-text{font-size:24px;font-weight:800;letter-spacing:.4px;color:#fff;line-height:1;white-space:nowrap}
.u-logo-text b{color:var(--tm-blue);font-weight:800}
.u-head-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.u-search{display:flex;align-items:center;gap:6px;background:var(--tm-panel);border:1px solid var(--tm-line);border-radius:999px;padding:5px 5px 5px 14px}
.u-search input{background:transparent;border:0;outline:0;color:#fff;font:inherit;font-size:14px;min-width:150px;padding:5px 0}
.u-search button{background:var(--tm-blue);color:#fff;border:0;border-radius:999px;padding:8px 15px;font-weight:700;cursor:pointer;font-size:13px}
.u-search button:hover{background:var(--tm-blue-dark)}
a.u-btn-round{u-border:0;display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:999px;padding:10px 20px;font-size:14px;font-weight:700;color:#fff;line-height:1;white-space:nowrap;border:0;cursor:pointer}
a.u-btn-round.u-custom-color-16:hover{background:var(--tm-blue-dark)}
.u-langs{display:flex;gap:5px;flex-wrap:wrap}
.u-langs a{font-size:12px;padding:5px 9px;border:1px solid var(--tm-line);border-radius:999px;color:var(--tm-muted)}
.u-langs a.on{background:var(--tm-blue);color:#fff;border-color:var(--tm-blue);font-weight:700}

/* ---------- page blocks ---------- */
section.u-section{padding:34px 0 6px;clear:both;overflow:hidden}
.u-block-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 16px}
.u-block-title{font-size:22px;font-weight:800;line-height:1.25;color:#fff;margin:0;display:flex;align-items:center;gap:10px}
.u-block-title:before{content:"";width:5px;height:22px;border-radius:3px;background:var(--tm-blue);display:inline-block}
a.u-seeall{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;color:var(--tm-blue);border:1px solid var(--tm-line);border-radius:999px;padding:8px 16px}
a.u-seeall:hover{background:var(--tm-panel)}
.u-page-title{font-size:29px;font-weight:800;color:#fff;margin:4px 0 10px;line-height:1.25}
.u-catnav-wrap{background:var(--tm-panel);border-bottom:1px solid var(--tm-line);padding:10px 0;clear:both}
.u-catnav ul{display:flex;flex-wrap:wrap;gap:8px}
.u-catnav li a{display:inline-flex;align-items:center;padding:8px 16px;border-radius:999px;font-size:13.5px;font-weight:700;color:#fff;border:1px solid var(--tm-line);white-space:nowrap}
.u-catnav li a:hover{background:var(--tm-blue);border-color:var(--tm-blue);color:#fff}
.u-lead{color:var(--tm-muted);font-size:15px;line-height:1.65;max-width:820px;margin:0 0 10px}
.u-crumbs{padding:16px 0 0;font-size:13px;color:var(--tm-muted);display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.u-crumbs a{color:var(--tm-blue)}
.u-crumbs span.sep{opacity:.5}

/* ---------- hero ---------- */
.u-hero{border-radius:18px;background:linear-gradient(118deg,#1d2233 0%,#151722 48%,#242a44 100%);border:1px solid var(--tm-line);padding:40px 36px;position:relative;overflow:hidden}
.u-hero:after{content:"";position:absolute;right:-70px;top:-80px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(71,138,201,.34),transparent 70%)}
.u-hero-inner{position:relative;z-index:1;max-width:730px}
.u-hero-title{font-size:34px;line-height:1.18;font-weight:800;color:#fff;margin:0 0 12px}
.u-hero-sub{color:var(--tm-muted);font-size:15px;line-height:1.65;max-width:640px;margin:0 0 22px}
a.u-hero-cta{display:inline-flex;align-items:center;gap:9px;background:var(--tm-blue);color:#fff;font-weight:800;border-radius:999px;padding:14px 26px;font-size:15px}
a.u-hero-cta:hover{background:var(--tm-blue-dark)}

/* ---------- article cards ---------- */
.u-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
article.u-card{margin:0;display:block;min-width:0}
article.u-card > a{display:block;height:100%;box-sizing:border-box;background:var(--tm-panel);border:1px solid var(--tm-line);border-radius:14px;overflow:hidden;transition:transform .15s,border-color .15s}
article.u-card > a:hover{transform:translateY(-3px);border-color:var(--tm-blue)}
.u-card-img{position:relative;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;overflow:hidden}
.u-card-img span{font-size:24px;font-weight:800;color:#fff;letter-spacing:1px}
.u-thumb-0{background:linear-gradient(135deg,#243a55,#151722)}
.u-thumb-1{background:linear-gradient(135deg,#4a2350,#151722)}
.u-thumb-2{background:linear-gradient(135deg,#123f42,#151722)}
.u-thumb-3{background:linear-gradient(135deg,#1b2a52,#151722)}
.u-thumb-4{background:linear-gradient(135deg,#452033,#151722)}
.u-thumb-5{background:linear-gradient(135deg,#2a2f18,#151722)}
.u-card-body{padding:13px 14px 15px}
.u-card-title{display:block;font-size:14.5px;font-weight:700;line-height:1.35;color:#fff}
.u-card-text{display:block;margin-top:7px;font-size:12px;color:var(--tm-muted);line-height:1.55}
a.u-card-more{display:inline-block;margin-top:10px;font-size:12.5px;font-weight:700;color:var(--tm-blue)}

/* ---------- article body ---------- */
.u-post{max-width:900px;margin:0 auto;font-size:16px;line-height:1.78;color:#e8e9f0}
.u-post h1{font-size:31px;line-height:1.24;font-weight:800;color:#fff;margin:6px 0 16px}
.u-post h2{font-size:21px;font-weight:800;color:var(--tm-blue);margin:28px 0 10px;line-height:1.32}
.u-post h3{font-size:17.5px;font-weight:800;color:#fff;margin:22px 0 8px}
.u-post p{margin:0 0 15px}
.u-post a{color:var(--tm-blue);text-decoration:underline}
.u-post ul{margin:0 0 15px;padding-left:20px}
.u-post ul li{list-style:disc;margin:0 0 7px}
.u-post table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:14.5px;background:var(--tm-panel);border-radius:10px;overflow:hidden}
.u-post th{background:var(--tm-blue);color:#fff;text-align:left;padding:11px 13px;font-weight:800}
.u-post td{padding:10px 13px;border-top:1px solid var(--tm-line)}
.u-post-meta{display:flex;gap:15px;flex-wrap:wrap;color:var(--tm-muted);font-size:13px;margin:0 0 20px}
.u-post-meta a{color:var(--tm-blue);text-decoration:none}

/* ---------- promo component skin ---------- */
.pp-promos{background:var(--tm-panel);border-color:var(--tm-line);
  --pp-title-color:#fff;--pp-row-bg:#1a1c29;--pp-row-border:var(--tm-line);
  --pp-name:#fff;--pp-muted:var(--tm-muted);--pp-muted-2:#9ba0b4;--pp-bonus:var(--tm-ok);
  --pp-btn-bg:var(--tm-blue);--pp-btn-color:#fff;--pp-btn-bg-hover:var(--tm-blue-dark);
  --pp-shadow:0 16px 34px rgba(0,0,0,.5);--pp-num-bg:rgba(71,138,201,.18);
  --pp-wrap-bg:#1a1c29;--pp-wrap-border:var(--tm-line);--pp-more-bg:rgba(71,138,201,.12);
  --pp-more-bg-hover:rgba(71,138,201,.22);--pp-more-color:var(--tm-blue);
  --pp-stars-off:#454a5e;border-radius:16px}
.pp-promos-title{color:#fff}
.pp-row{color:#e8e9f0}
.pp-row-terms{color:var(--tm-muted)}
.pp-num{color:#fff}
.pp-btn{color:#fff;font-weight:800}

/* ---------- pager / comments ---------- */
.u-pager{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:center;padding:24px 0 8px}
.u-pager a,.u-pager span{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 12px;border-radius:999px;border:1px solid var(--tm-line);background:var(--tm-panel);color:#fff;font-size:14px;font-weight:700}
.u-pager a:hover{border-color:var(--tm-blue);color:var(--tm-blue)}
.u-pager span.on{background:var(--tm-blue);color:#fff;border-color:var(--tm-blue)}
.u-cmt{margin-top:26px;border-top:1px solid var(--tm-line);padding-top:20px}
.u-cmt h2{font-size:19px;font-weight:800;color:#fff;margin:0 0 14px}
.u-cmt-item{background:var(--tm-panel);border:1px solid var(--tm-line);border-radius:12px;padding:14px 16px;margin-bottom:11px}
.u-cmt-head{display:flex;gap:10px;align-items:center;margin-bottom:7px}
.u-cmt-ava{width:34px;height:34px;border-radius:50%;background:var(--tm-blue);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:14px}
.u-cmt-name{font-weight:800;color:#fff;font-size:14px}
.u-cmt-date{color:var(--tm-muted);font-size:12px}
.u-cmt-body{color:#d6d8e3;font-size:14.5px;line-height:1.65}

/* ---------- footer ---------- */
.u-footer{background:var(--tm-navy);border-top:1px solid var(--tm-line);margin-top:38px;padding:36px 0 24px;text-align:left}
.u-foot-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.u-foot-col h3{margin:0 0 12px;font-size:14px;font-weight:800;color:var(--tm-blue);text-transform:uppercase;letter-spacing:.6px}
.u-foot-col ul li{margin:0 0 8px;font-size:13.5px;color:var(--tm-muted);line-height:1.5}
.u-foot-col ul li a{color:var(--tm-muted)}
.u-foot-col ul li a:hover{color:var(--tm-blue)}
.u-foot-bottom{margin-top:26px;padding-top:18px;border-top:1px solid var(--tm-line);font-size:12.5px;color:#8b90a4;line-height:1.65}

@media (max-width:1080px){
  .u-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .u-foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .u-hero-title{font-size:25px}
  .u-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .u-post h1{font-size:24px}
  .u-page-title{font-size:23px}
  .u-search input{min-width:90px}
}
@media (max-width:560px){
  .u-header .u-sheet-1{flex-wrap:wrap}
  .u-head-right{width:100%;justify-content:flex-start}
  .u-grid{grid-template-columns:1fr}
  .u-foot-grid{grid-template-columns:1fr}
  .u-hero{padding:26px 20px}
}