/* hirorszag.com — modern információs útmutató (Mostbet Magyarország) */
:root{--ink:#0f131a;--ink2:#0a0d12;--navy:#161b24;--acc:#e2571c;--acc2:#ff9a3c;--amber:#ffc457;
--blue:#2f6fed;--line:#e7eaf0;--muted:#5f6a7a;--bg:#f5f7fb;--card:#ffffff;--radius:14px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:#1b2432;line-height:1.65;
font-family:'Inter','Segoe UI',Roboto,-apple-system,Arial,sans-serif}
img{max-width:100%}
a{color:#1b4fd8}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}

/* ---- top bar ---- */
.top{background:linear-gradient(90deg,#0a0d12,#1b2130);color:#9fadc0;font-size:13px;
letter-spacing:.01em}
.top .wrap{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:10px 20px}
.top b{color:#ffb85c}

/* ---- header ---- */
.hed{background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(8px);
border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40}
.hed .row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;padding:13px 0}
.logo img{height:46px;width:auto;display:block}
.nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:0;justify-content:center;flex-wrap:wrap}
.nav a{color:#26313f;font-size:14.5px;font-weight:600;text-decoration:none;padding:8px 12px;
border-radius:9px;transition:background .15s,color .15s;display:inline-block}
.nav a:hover{background:#fdf0e7;color:var(--acc)}
.btn{display:inline-block;background:linear-gradient(120deg,var(--acc),var(--acc2));color:#fff;
border-radius:10px;padding:11px 19px;font-weight:700;font-size:14.5px;text-decoration:none;
box-shadow:0 6px 16px rgba(226,87,28,.28);transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(226,87,28,.34);color:#fff}
.btn.alt{background:#fff;color:var(--navy);border:1px solid #d7dde7;box-shadow:none}
.btn.ghost{background:transparent;color:var(--acc);border:1px solid #f0c6ae;box-shadow:none}
.btn.sm{padding:8px 13px;font-size:13.5px;border-radius:9px}

/* ---- hero ---- */
.hero{background:radial-gradient(1200px 420px at 12% -10%,#2b3548,transparent),
linear-gradient(120deg,#0d1119,#1d2534);color:#fff;border-radius:18px;overflow:hidden;
margin:20px 0;display:grid;grid-template-columns:1.12fr .88fr;box-shadow:0 18px 44px rgba(13,17,25,.28)}
.hero .txt{padding:34px}
.hero h1{font-size:33px;line-height:1.2;margin:0 0 13px;color:#fff;letter-spacing:-.02em;font-weight:800}
.hero p{color:#c4cedb;font-size:16px;margin:0 0 18px;max-width:640px}
.hero .art{background:#0b0f16;display:flex;align-items:center;justify-content:center;padding:0}
.hero .art img{width:100%;height:100%;min-height:250px;object-fit:cover;display:block}
.hero .btn{margin-right:9px}

/* ---- trust strip ---- */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:18px 0}
.trust div{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:17px;
box-shadow:0 2px 10px rgba(15,19,26,.04)}
.trust b{display:block;color:var(--navy);font-size:16px;margin-bottom:6px}
.trust span{font-size:14.5px;color:var(--muted)}

/* ---- headings ---- */
h1{font-weight:800;letter-spacing:-.02em;color:var(--navy)}
h2{font-size:23px;color:var(--navy);margin:30px 0 13px;letter-spacing:-.015em;font-weight:750}
h2.sec{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
border-bottom:2px solid var(--line);padding-bottom:9px}
h2.sec a{font-size:13.5px;color:var(--acc);font-weight:600;text-decoration:none;white-space:nowrap}
h3{font-size:17.5px;color:#152237;margin:14px 0 7px;font-weight:700}
p,li{font-size:15.5px;color:#3a4658}
.crum{font-size:13px;color:var(--muted);padding:14px 0 0}
.crum a{color:var(--muted);text-decoration:none}
.crum a:hover{color:var(--acc)}
.leadb{font-size:17px;background:#eef3fe;border-left:4px solid var(--blue);padding:15px 17px;
border-radius:10px;color:#1e2b3f}

/* ---- cards ---- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
box-shadow:0 2px 12px rgba(15,19,26,.05);transition:transform .18s,box-shadow .18s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(15,19,26,.12)}
.card .ph{height:158px;background:#e9eef6 center/cover no-repeat}
.card .bd{padding:15px 16px 17px;display:flex;flex-direction:column;gap:7px;flex:1}
.card .tag{align-self:flex-start;background:#fdece2;color:#a83d10;border-radius:999px;padding:3px 10px;
font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.card h3{margin:0}
.card h3 a{color:#152237;text-decoration:none}
.card h3 a:hover{color:var(--acc)}
.card p{margin:0;color:var(--muted);font-size:14px}
.acov{height:172px;background:#e9eef6 center/cover no-repeat;border-radius:var(--radius);margin:14px 0}
.ameta{font-size:13px;color:var(--muted);margin:0 0 12px}

/* ---- article table ---- */
.article-table-wrap{overflow-x:auto;margin:18px 0;border-radius:12px}
table.article-table{width:100%;border-collapse:separate;border-spacing:0;font-size:15px;background:#fff;
border:1px solid var(--line);border-radius:12px;overflow:hidden}
table.article-table th,table.article-table td{border-bottom:1px solid var(--line);padding:12px 14px;
text-align:left;vertical-align:top}
table.article-table tr:last-child td{border-bottom:0}
table.article-table th{background:#f3f6fb;color:var(--navy);font-weight:700}

/* ---- list / news ---- */
.news{border-left:3px solid var(--acc);padding-left:15px;margin:16px 0}
.news h3{margin:0 0 4px;font-size:16.5px}
.news p{margin:0;font-size:14.5px;color:var(--muted)}
.rg{background:linear-gradient(120deg,#fff5f2,#fdeee6);border:1px solid #f6d2bd;border-radius:12px;
padding:15px 17px;font-size:14.5px;color:#8f3410;margin:20px 0}
.rg b{color:#7a2a0a}

/* ---- layout ---- */
.main{display:grid;grid-template-columns:1fr 320px;gap:26px;align-items:start}
.side .box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
padding:17px;margin-bottom:16px;box-shadow:0 2px 10px rgba(15,19,26,.04)}
.side h4{color:var(--navy);font-size:16px;margin:0 0 11px}
.side a{display:block;padding:8px 0;border-bottom:1px dashed var(--line);color:#3b4657;font-size:14.5px;
text-decoration:none}
.side a:hover{color:var(--acc)}
.side a:last-child{border-bottom:0}
article{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px 30px;
box-shadow:0 2px 14px rgba(15,19,26,.05)}
article p{margin:0 0 14px}
article ul,article ol{margin:0 0 16px;padding-left:22px}
article li{margin-bottom:6px}

/* ---- footer ---- */
footer{background:linear-gradient(180deg,#131922,#080b10);color:#b7c2d1;margin-top:34px;padding:30px 0 22px}
footer a{color:#fff;font-size:14px;text-decoration:none}
footer a:hover{color:var(--amber)}
.frow{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:24px}
.frow h4{color:#fff;font-size:15px;margin:0 0 10px;letter-spacing:.01em}
.frow p{font-size:13.5px;color:#8d99a9;margin:6px 0 0}
.fcont{display:flex;flex-direction:column;gap:6px}
.fcont a{color:#c6d0dd;font-size:14px}
.fpays{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.paycell{display:inline-flex;align-items:center;justify-content:center;background:#1c2434;
border:1px solid #2c3648;border-radius:9px;padding:8px 14px;height:44px}
.fpaycap{font-size:12.5px;color:#8d99a9;margin-top:10px}

@media (max-width:980px){
  .cards,.main,.hero,.trust,.hed .row,.frow{grid-template-columns:1fr}
  .hero .art{min-height:210px}
  .nav ul{justify-content:flex-start}
  article{padding:20px}
  .hero h1{font-size:26px}
}