/* Vuslat Haber — газетный скин vuslathaber.com (по паспорту пина) */
:root{
  --red:#d81f26; --red-d:#b0161c; --ink:#1c1c1c; --ink2:#333;
  --gray:#6f7276; --line:#e4e6e9; --bg:#eef0f2; --soft:#f5f6f7;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  font-size:17px;line-height:1.62;
}
img{max-width:100%;display:block}
a{color:var(--red);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px}

/* --- верхняя тонкая полоса --- */
.top{background:var(--ink);color:#e9e9ea;font-size:12.5px;letter-spacing:.2px}
.top .wrap{display:flex;justify-content:space-between;gap:12px;padding:7px 16px;text-transform:uppercase}

/* --- шапка: логотип + меню рубрик + кнопка --- */
.hed{background:#fff;border-bottom:3px solid var(--red);box-shadow:0 1px 2px rgba(0,0,0,.05)}
.hed .row{display:flex;align-items:center;gap:22px;padding:14px 16px;flex-wrap:wrap}
.hed .logo img{height:52px;width:auto}
.nav{flex:1 1 auto}
.nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:4px 18px;margin:0;padding:0}
.nav ul li a{
  color:var(--ink2);font-weight:800;font-size:13.5px;text-transform:uppercase;letter-spacing:.3px;
  padding:6px 0;border-bottom:2px solid transparent
}
.nav ul li a:hover{color:var(--red);border-bottom-color:var(--red);text-decoration:none}
.btn{
  display:inline-block;background:var(--red);color:#fff!important;font-weight:800;font-size:13.5px;
  text-transform:uppercase;letter-spacing:.3px;padding:11px 18px;border:0;border-radius:3px;cursor:pointer
}
.btn:hover{background:var(--red-d);text-decoration:none}
.btn.ghost{background:transparent;color:var(--red)!important;border:2px solid var(--red)}
.btn.sm{padding:8px 13px;font-size:12.5px}

/* --- герой главной --- */
.hero{
  display:flex;gap:26px;align-items:stretch;background:#fff;border:1px solid var(--line);
  border-left:5px solid var(--red);border-radius:2px;margin:22px 0;padding:0;overflow:hidden
}
.hero .txt{padding:26px 26px 26px 24px;flex:1 1 55%}
.hero .txt h1{font-size:31px;line-height:1.22;margin:0 0 14px;letter-spacing:-.3px}
.hero .txt p{color:var(--gray);margin:0 0 16px;font-size:17.5px}
.hero .art{flex:1 1 45%;min-height:280px;background:#111}
.hero .art img{width:100%;height:100%;object-fit:cover}

/* --- полоса доверия --- */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 22px}
.trust>div{background:#fff;border:1px solid var(--line);border-top:3px solid var(--red);padding:14px 16px;border-radius:2px}
.trust b{display:block;font-size:15px;margin-bottom:3px}
.trust span{color:var(--gray);font-size:14px}

/* --- заголовки секций --- */
.sec{
  font-size:20px;text-transform:uppercase;letter-spacing:.4px;margin:30px 0 16px;padding:9px 0 9px 13px;
  border-left:5px solid var(--red);border-bottom:1px solid var(--line);color:var(--ink)
}
.sec a{float:right;font-size:13px;font-weight:700;text-transform:none;color:var(--red)}

/* --- карточки новостей --- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:2px;overflow:hidden;display:flex;flex-direction:column}
.card .ph{height:170px;background:#d9dbde center/cover no-repeat}
.card .bd{padding:14px 15px 18px;display:flex;flex-direction:column;flex:1}
.card .tag{
  display:inline-block;background:var(--red);color:#fff;font-size:11px;font-weight:800;
  text-transform:uppercase;letter-spacing:.4px;padding:3px 8px;border-radius:2px;margin-bottom:9px;align-self:flex-start
}
.card h3{margin:0 0 8px;font-size:16.5px;line-height:1.32}
.card h3 a{color:var(--ink)}
.card h3 a:hover{color:var(--red)}
.card p{margin:0;color:var(--gray);font-size:14.5px}

/* --- две колонки: контент + сайдбар --- */
.main{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:32px;align-items:start}
.main.single{grid-template-columns:minmax(0,1fr)}
.side{position:sticky;top:16px}
.box{background:#fff;border:1px solid var(--line);border-radius:2px;padding:15px 17px;margin-bottom:20px}
.box h4{
  margin:0 0 12px;font-size:15px;text-transform:uppercase;letter-spacing:.4px;
  border-bottom:2px solid var(--red);padding-bottom:8px
}
.box a{display:block;padding:7px 0;border-bottom:1px dashed var(--line);color:var(--ink2);font-weight:600;font-size:14.5px}
.box a:last-child{border-bottom:0}
.box a:hover{color:var(--red);text-decoration:none}
.box div{font-size:14.5px;color:var(--gray)}

/* --- статья --- */
.crum{font-size:13.5px;color:var(--gray);margin:20px 0 6px}
.crum a{color:var(--gray)}
.ameta{font-size:13px;color:var(--gray);text-transform:uppercase;letter-spacing:.4px;margin:0 0 16px}
.acov{width:100%;border-radius:3px;margin:0 0 22px}
.leadb{font-size:18.5px;color:var(--ink2);font-weight:500}
.prose{background:#fff;border:1px solid var(--line);border-radius:2px;padding:6px 26px 26px;margin-top:8px}
.prose p{margin:0 0 16px}
.prose h2{font-size:21px;line-height:1.3;margin:26px 0 12px;padding-bottom:7px;border-bottom:1px solid var(--line)}
.prose h3{font-size:18px;margin:20px 0 10px}
.prose ul,.prose ol{padding-left:22px;margin:0 0 16px}
.prose li{margin:6px 0}
.prose img{border-radius:3px}
.article-table-wrap{overflow-x:auto;margin:18px 0}
table.article-table{width:100%;border-collapse:collapse;font-size:15px}
table.article-table th,table.article-table td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
table.article-table th{background:var(--soft);font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:.3px}
.news{border-bottom:1px solid var(--line);padding:12px 0}
.news h3{margin:0 0 5px;font-size:17px}
.news h3 a{color:var(--ink)}
.news p{margin:0;color:var(--gray);font-size:14.5px}
.rg{background:#fff7f7;border:1px solid #f2d2d4;color:#8a1418;font-size:14px;padding:12px 15px;border-radius:2px;margin:22px 0}

/* --- футер --- */
footer{background:var(--ink);color:#d4d6d9;margin-top:36px;padding:30px 0 20px;font-size:14.5px}
footer a{color:#fff}
footer .frow{display:grid;grid-template-columns:1.2fr 1.4fr 1fr;gap:26px;align-items:start;margin-bottom:18px}
footer img{background:#fff;border-radius:4px;padding:6px 9px}
footer .fcont b,footer b{color:#fff}
footer div[style]{color:#c4c7cb}
.paycell{display:inline-flex;align-items:center;justify-content:center;background:#111827;border-radius:6px;padding:8px 12px;margin:0 8px 8px 0;min-width:70px;min-height:38px}
.paycell img{max-height:22px;width:auto}
figure{margin:16px 0}
figcaption{font-size:12.5px;color:var(--gray);margin-top:6px}

/* --- адаптив --- */
@media (max-width:960px){
  .main{grid-template-columns:minmax(0,1fr)}
  .side{position:static}
  .cards{grid-template-columns:repeat(2,1fr)}
  .trust{grid-template-columns:1fr}
  .hero{flex-direction:column}
  .hero .art{min-height:220px;order:-1}
  .hero .txt h1{font-size:25px}
  footer .frow{grid-template-columns:1fr}
}
@media (max-width:600px){
  body{font-size:16px}
  .cards{grid-template-columns:1fr}
  .hed .row{gap:12px}
  .hed .logo img{height:42px}
  .nav ul{gap:4px 14px}
  .prose{padding:4px 15px 18px}
  .top .wrap{flex-direction:column;gap:2px}
}