/* Volt theme: server lists (Figma "01 Home" and "02 Category (SMP)") */
.hero{position:relative;min-height:640px;background:#141414 center/cover}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg) 0,rgba(30,30,30,.85) 9%,rgba(30,30,30,0) 32%),linear-gradient(90deg,#000 calc(50vw - 264px),rgba(0,0,0,0) calc(50vw + 120px)),linear-gradient(180deg,rgba(18,18,18,.75) 0,rgba(18,18,18,0) 22%),linear-gradient(90deg,rgba(18,18,18,.85) 0%,rgba(18,18,18,.5) 40%,rgba(18,18,18,.1) 62%,rgba(18,18,18,.35)),linear-gradient(0deg,var(--bg) 0%,transparent 30%)}
.hero .w{position:relative;display:flex;justify-content:space-between;align-items:center;gap:40px;min-height:640px;padding-top:110px;padding-bottom:70px;box-sizing:border-box}
.hero .l{width:520px;max-width:100%}
.hero .h{font-size:76px;line-height:.95}
.hero .h span{color:var(--a);display:block}
.hero p{margin:22px 0 28px;color:#ddd;font-size:17px;max-width:440px}
.srch{display:flex;width:500px;max-width:100%;height:52px}
.srch input{flex:1;min-width:0;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.25);border-right:0;color:#eee;font:400 15px Cairo,sans-serif;padding:0 18px;outline:0}
.srch input:focus{border-color:var(--a)}
.srch .btn{height:52px;border:0;cursor:pointer}
.hero .meta{display:flex;gap:26px;margin-top:22px}
.hero .meta b{display:block;font:800 italic 13px/1.2 Kanit;color:var(--a);text-transform:uppercase}
.hero .meta i{font:italic 400 12px/1.2 Cairo;color:#bbb}
.hero .r{width:400px;max-width:100%}
.hero .r .k{font-size:14px;color:#fff;margin-bottom:12px;display:flex;justify-content:space-between}
.hero .r .k em{color:var(--a);font-style:italic}
.tl{border-top:1px solid rgba(255,255,255,.9)}
.tl a{display:flex;align-items:center;gap:16px;height:74px;border-bottom:1px solid rgba(255,255,255,.9);padding:0 8px}
.tl a:hover{background:rgba(255,255,255,.05)}
.tl img,.tl .noic{width:42px;height:42px;image-rendering:pixelated;background:#222;flex:none}
.tl b{display:block;font:800 italic 17px/1.1 Kanit;color:#fff;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:250px}
.tl small{font:400 13px/1.3 Cairo;color:#ccc}
.tl .n{margin-left:auto;font:800 italic 22px/1 Kanit;color:var(--a)}
.modes{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:-40px;position:relative}
.mode{height:130px;background:#2a2a2a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;filter:grayscale(1);opacity:.55;transition:filter .2s,opacity .2s}
.mode:hover,.mode.on{filter:none;opacity:1;background:#2f2f2f}
.mode.on{outline:2px solid var(--a);outline-offset:-2px}
.mode img{height:62px;width:auto}
.mode b{font:800 italic 15px/1 Kanit;color:#fff;text-transform:uppercase}
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:70px;border-top:1px solid var(--ln);border-bottom:1px solid var(--ln)}
.stats div{padding:26px 0 24px;text-align:center;border-right:1px solid var(--ln)}
.stats div:last-child{border:0}
.stats b{display:block;font:800 italic 44px/1 Kanit;color:#fff}
.stats small{font:800 italic 12px/1 Kanit;color:var(--a);text-transform:uppercase;letter-spacing:.5px}
.sec{padding-top:90px}.sec .h{font-size:44px;margin:8px 0 10px}.sec .lead{max-width:560px}
.fg{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:40px}
.fc{background:var(--s1);padding:34px 26px 32px;text-align:center}
.fc .fi{height:64px;width:auto}
.fc b{display:block;margin:18px 0 10px;font:800 italic 19px/1.2 Kanit;color:#fff;text-transform:uppercase}
.fc p{font-size:15px;line-height:1.55;margin:0}
.lx{display:grid;grid-template-columns:minmax(0,640px) 1fr;gap:56px;align-items:center}
.lx .shot{border:2px solid var(--a);line-height:0}
.lx .shot img{width:100%}
.lx .h{font-size:46px}
.lx p{margin:14px 0 22px}
.chk{border-top:1px solid rgba(255,255,255,.85);margin-bottom:26px}
.chk div{display:flex;justify-content:space-between;align-items:center;min-height:56px;border-bottom:1px solid rgba(255,255,255,.85);font:800 italic 15px/1.2 Kanit;color:#fff;text-transform:uppercase}
.chk small{display:block;font:400 12px/1.4 Cairo;color:#aaa;text-transform:none}
.chk em{color:var(--a);font-style:normal;font-size:20px}
/* chips as links */
/* rows (real markup) */
/* category page */
.pghead{background-size:cover;background-position:center}
.crumb a:hover{color:#fff}
.flt .card{padding:22px}
.flt .g{margin-bottom:22px}
.flt .g:last-child{margin:0}
.flt .ks{margin-bottom:12px}
.ck{display:flex;gap:10px;font:600 14px/2.1 Cairo;color:#ccc}
.ck i{font-style:normal;color:#777;margin-left:auto}
.ck:before{content:"□";color:#666}
.ck.on{color:#fff}.ck.on:before{content:"■";color:var(--a)}
.ck:hover{color:#fff}
.bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.bar .in{width:300px;height:40px;line-height:38px;color:#eee;outline:0}
.flt .row{grid-template-columns:44px 48px 170px minmax(0,1fr) 56px 96px;gap:12px;padding:10px 14px}
.flt .row .ip{display:none}
.flt .row .ic{width:52px;height:52px}
/* pagination (paginate()) */
.pg{margin-top:26px}
@media (max-width:980px){
  .hero .w{flex-direction:column;align-items:stretch}.hero .h{font-size:56px}.hero .r{width:auto}
  .modes{grid-template-columns:repeat(3,1fr)}.stats{grid-template-columns:repeat(2,1fr)}.stats div:nth-child(2){border-right:0}
  .fg{grid-template-columns:1fr 1fr}.lx{grid-template-columns:minmax(0,1fr);gap:32px}
  .flt .row{grid-template-columns:44px 48px 1fr 96px;gap:12px;height:auto;padding:12px}
  .sideL{grid-template-columns:1fr}
}
.hero .r{background:rgba(18,18,18,.82);padding:18px 22px 6px;box-sizing:border-box}.hero .tl{border-top-color:rgba(255,255,255,.5)}.hero .tl a{border-bottom-color:rgba(255,255,255,.25)}
.hero{background-color:#000;background-size:auto 112%!important;background-position:left calc(50vw - 264px) top 30%!important;background-repeat:no-repeat}
@media (max-width:980px){.hero{background-size:cover!important;background-position:70% 20%!important}}
@media (max-width:980px){.hero:before{background:linear-gradient(180deg,rgba(18,18,18,.75) 0,rgba(18,18,18,0) 22%),linear-gradient(90deg,rgba(18,18,18,.85) 0%,rgba(18,18,18,.5) 40%,rgba(18,18,18,.1) 62%,rgba(18,18,18,.35)),linear-gradient(0deg,var(--bg) 0%,transparent 30%)}}
