*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#050302;color:#f7e3b5;font-family:Georgia,"Times New Roman",serif}.page{min-height:100vh;position:relative;background:linear-gradient(180deg,rgba(4,2,1,.15),#070302 980px),url("./site-bg.jpg") top center/cover fixed no-repeat}.page:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,#000b,transparent 28%,transparent 72%,#000b),radial-gradient(circle at 50% 30%,transparent,#0007 72%)}.topbar,.mainnav,.hero,.cards,.lower,.section-panel,footer{position:relative;z-index:1}.topbar{height:70px;max-width:1700px;margin:auto;padding:13px 4%;display:flex;justify-content:space-between;direction:ltr}.topbar button{height:34px;min-width:52px;background:#090705e8;border:1px solid #7e4d18;color:#f3cd7c}.languages button{min-width:105px}.languages .selected{background:#651006}.mainnav{max-width:1660px;height:118px;margin:0 auto 28px;display:grid;grid-template-columns:repeat(3,1fr) 2.2fr repeat(3,1fr);background:#070605f2;border:1px solid #a86b20;box-shadow:0 0 28px #000}.mainnav a{display:flex;flex-direction:column;justify-content:center;align-items:center;text-decoration:none;color:#f8d58b;border-inline-end:1px solid #2b1b10;direction:ltr}.mainnav a:hover,.mainnav a.active{background:linear-gradient(#a51f0d,#450703)}.mainnav .ico{font-size:31px;color:#ffc35c}.mainnav b{font-size:15px;margin-top:8px}.nav-center{display:grid;place-items:center;overflow:hidden}.vmark{font-size:76px;font-weight:900;color:#d79327;text-shadow:0 3px #542000,0 0 18px #ff6b003d}.hero{max-width:1660px;height:600px;margin:0 auto;position:relative}.intro{position:absolute;left:2.5%;top:85px;width:35%;text-align:center;z-index:3}.welcome{letter-spacing:9px;color:#f2d491}.intro h1{direction:ltr!important;unicode-bidi:isolate;font-size:68px;line-height:1;margin:18px 0 10px;white-space:nowrap;background:linear-gradient(#fff0a2 0,#ffc64c 30%,#a8520e 58%,#f5cf71 78%,#77330a);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:1px #632500;filter:drop-shadow(0 4px 0 #4b1300) drop-shadow(0 0 12px #ff6500)}.intro h1 span{direction:ltr!important;unicode-bidi:isolate}.intro h2{font-size:20px;letter-spacing:5px;color:#fff}.divider{display:flex;align-items:center;gap:8px;justify-content:center;color:#d7952c}.divider i{height:1px;width:90px;background:#a86b20}.intro>p{margin-top:25px;color:#fff;font-weight:bold}.center-art{position:absolute;left:50%;top:10px;transform:translateX(-50%);width:430px;height:430px;display:grid;place-items:center}.center-art img{width:100%;height:100%;object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 0 20px #ff5d004f)}.status{position:absolute;right:2%;top:68px;width:350px;background:#080705ef;border:1px solid #aa6a1d;padding:16px 22px;box-shadow:0 0 25px #000;z-index:4}.panel-head{text-align:center;color:#ffd378;font-size:20px;border-bottom:1px solid #493018;padding-bottom:10px}.online{text-align:center;color:#20ef72;font-size:25px;padding:10px;border-bottom:1px solid #17452a}.online span{display:inline-block;width:12px;height:12px;background:#20ef72;border-radius:50%;box-shadow:0 0 12px #20ef72}.stat{display:flex;justify-content:space-between;align-items:center;direction:ltr;padding:11px 0;border-bottom:1px solid #34271a;color:#eee}.stat label{display:flex;gap:7px}.stat label i{font-style:normal}.stat strong{color:#f5ce76;direction:ltr}.hero-actions{position:absolute;bottom:38px;left:31%;right:31%;display:flex;gap:12px;direction:ltr;z-index:5}.hero-actions a,.section-panel button{flex:1;text-align:center;text-decoration:none;color:#ffe3a0;border:1px solid #cf8b28;background:linear-gradient(#8b5a10,#352005);padding:18px;font-weight:bold;font-size:18px}.hero-actions .danger{background:linear-gradient(#a32210,#480803)}.cards{max-width:1660px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.cards a{background:#080706ef;border:1px solid #a66a20;text-decoration:none;color:#f4ce74;overflow:hidden;transition:.18s}.cards a:hover{transform:translateY(-4px);border-color:#e1a13a}.cards img{width:100%;height:135px;display:block;object-fit:cover;filter:saturate(1.1) contrast(1.08)}.cards div{position:relative;padding:10px 17px 13px}.cards h3{margin:0 0 4px;direction:ltr}.cards p{margin:0;color:#eee}.cards div>b{position:absolute;right:16px;bottom:18px;color:#ffb52c}.lower{max-width:1660px;margin:16px auto 0;display:grid;grid-template-columns:1.05fr 1.28fr .95fr;gap:18px}.lower article,.section-panel{background:#080706ef;border:1px solid #9d641e;padding:15px}.lower h3{margin:0 0 10px;color:#f6ce73;border-bottom:1px solid #3a2818;padding-bottom:10px}.lower h3 small{color:#8f8069;margin-inline:12px}.news>div{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;border-bottom:1px solid #30241a;padding:10px}.news>div>b{font-size:25px}.news p{margin:0}.news p strong,.news p span{display:block}.news p span{font-size:12px;color:#a99b84;margin-top:4px}.news time{direction:ltr;color:#8e816e}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.feature-grid span{height:76px;border:1px solid #3b2917;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:23px}.feature-grid b{font-size:10px;margin-top:7px;color:#f6c25b}.ranktabs{display:flex;direction:ltr}.ranktabs button{flex:1;background:#0b0806;color:#d8ba7a;border:1px solid #4c3119;padding:6px}table{width:100%;border-collapse:collapse;direction:ltr;color:#eee}td{padding:8px;border-bottom:1px solid #30251a;text-align:center}.section-panel{max-width:900px;margin:35px auto;text-align:center}.section-panel form{max-width:450px;margin:auto;display:grid;gap:10px;direction:ltr}.section-panel input{padding:14px;background:#100b08;border:1px solid #63411d;color:#fff}.section-panel button{cursor:pointer}footer{text-align:center;padding:35px;color:#8d7959}.rtl{text-align:right;direction:rtl}.ltr{text-align:left;direction:ltr}@media(max-width:1150px){.mainnav{grid-template-columns:repeat(3,1fr);height:auto}.nav-center{display:none}.mainnav a{min-height:90px}.hero{height:auto;padding:20px}.intro,.center-art,.status,.hero-actions{position:relative;left:auto;right:auto;top:auto;bottom:auto;transform:none;width:min(92%,520px);margin:25px auto}.center-art{height:390px}.hero-actions{display:flex}.cards,.lower{margin-inline:4%;grid-template-columns:1fr 1fr}}@media(max-width:650px){.intro h1{font-size:48px}.center-art{height:320px}.hero-actions{flex-direction:column}.cards,.lower{grid-template-columns:1fr}.feature-grid{grid-template-columns:1fr 1fr}}
/* v5 — branding artwork is background-only */
.mainnav{
  grid-template-columns:repeat(6,1fr)!important;
}
.nav-center,.center-art{display:none!important}

/* Hero rebalanced after removing the center emblem */
.hero{
  min-height:560px;
  height:560px;
}
.intro{
  left:4%!important;
  width:40%!important;
}
.status{
  right:4%!important;
}
.hero-actions{
  left:30%!important;
  right:30%!important;
}
@media(max-width:1150px){
  .mainnav{grid-template-columns:repeat(3,1fr)!important}
  .hero{height:auto!important;min-height:0!important}
  .intro,.status,.hero-actions{
    position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    width:min(92%,520px)!important;
    margin:25px auto!important;
  }
}

/* v6 — custom card artwork */
.cards img{
  height:155px!important;
  object-fit:cover!important;
  object-position:center!important;
  filter:saturate(1.08) contrast(1.06) brightness(.94)!important;
}
.cards a{
  border-color:#a96c20!important;
  background:linear-gradient(180deg,#0d0805,#060403)!important;
}
.cards a:hover img{filter:saturate(1.18) contrast(1.08) brightness(1.02)!important}

/* v7 — Victor CQ logo at the top */
.brand-top{
  position:relative;
  z-index:2;
  height:105px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding-top:8px;
  pointer-events:none;
}
.brand-top img{
  display:block;
  width:min(330px,72vw);
  max-height:96px;
  object-fit:contain;
  filter:drop-shadow(0 5px 8px #000) drop-shadow(0 0 12px rgba(215,147,39,.25));
}
@media(max-width:650px){
  .brand-top{height:88px}
  .brand-top img{max-height:78px;width:min(280px,76vw)}
}

/* ===== Mobile responsive layer — desktop design unchanged ===== */
.mobile-menu-btn{display:none}

@media(max-width:760px){
  body{overflow-x:hidden}
  .page{background-attachment:scroll;background-position:center top}
  .brand-top{height:82px;padding:5px 12px 0}
  .brand-top img{width:min(260px,72vw);max-height:74px}

  .topbar{
    height:auto;
    min-height:54px;
    padding:8px 12px;
    align-items:center;
    gap:8px;
  }
  .social{display:flex;gap:5px}
  .social button{min-width:38px;height:36px}
  .languages{display:flex;gap:5px}
  .languages button{min-width:82px;height:36px;font-size:12px}

  .mobile-menu-btn{
    position:relative;z-index:8;
    display:flex;width:calc(100% - 24px);height:50px;margin:8px 12px 0;
    align-items:center;justify-content:center;gap:10px;
    background:linear-gradient(#20130a,#080503);
    border:1px solid #a86b20;color:#f7d17a;
    font:700 15px Georgia,"Times New Roman",serif;
  }
  .mobile-menu-btn span{font-size:23px;color:#ffc35c}

  .mainnav{
    display:none!important;
    width:calc(100% - 24px)!important;height:auto!important;
    margin:0 12px 18px!important;
    grid-template-columns:1fr 1fr!important;
    border-top:0!important;
  }
  .mainnav.mobile-open{display:grid!important}
  .mainnav a{
    min-height:76px!important;
    padding:9px 5px!important;
    border:1px solid #2d1c10!important;
  }
  .mainnav .ico{font-size:24px}
  .mainnav b{font-size:12px;margin-top:5px}

  .hero{
    width:100%;height:auto!important;min-height:0!important;
    padding:4px 14px 22px!important;margin:0!important;
  }
  .intro{
    position:relative!important;left:auto!important;right:auto!important;top:auto!important;
    width:100%!important;margin:20px auto 26px!important;padding:0 4px;
  }
  .welcome{font-size:12px;letter-spacing:5px}
  .intro h1{font-size:clamp(42px,14vw,62px);margin:14px 0 10px;white-space:nowrap}
  .intro h2{font-size:17px;letter-spacing:2px;margin-inline:auto}
  .intro>p{font-size:11px;line-height:1.7;letter-spacing:.4px}
  .divider i{width:62px}

  .status{
    position:relative!important;left:auto!important;right:auto!important;top:auto!important;
    width:100%!important;max-width:480px;margin:0 auto 18px!important;
    padding:14px 17px!important;
  }
  .panel-head{font-size:18px}
  .online{font-size:21px}
  .stat{font-size:13px;gap:10px}
  .stat label{min-width:0}
  .stat strong{white-space:nowrap}

  .hero-actions{
    position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;
    width:100%!important;max-width:480px;margin:0 auto!important;
    display:grid!important;grid-template-columns:1fr!important;gap:9px!important;
  }
  .hero-actions a{padding:15px 10px;font-size:16px;min-height:50px}

  .cards{
    margin:0 12px!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
  }
  .cards img{height:112px!important}
  .cards div{padding:9px 10px 11px}
  .cards h3{font-size:13px}
  .cards p{font-size:11px;padding-right:18px}
  .cards div>b{right:9px;bottom:13px}

  .lower{
    margin:14px 12px 0!important;
    grid-template-columns:1fr!important;gap:12px!important;
  }
  .lower article{padding:12px}
  .news>div{grid-template-columns:34px 1fr;gap:7px}
  .news time{grid-column:2;font-size:10px}
  .feature-grid{grid-template-columns:1fr 1fr!important}
  .feature-grid span{height:68px}
  .ranktabs{overflow-x:auto}
  .ranktabs button{min-width:95px}

  .section-panel{margin:22px 12px!important;padding:14px!important}
  .section-panel form{width:100%}
  .section-panel input,.section-panel button{min-height:48px;font-size:16px}
  footer{padding:25px 12px;font-size:11px}
}

@media(max-width:380px){
  .languages button{min-width:70px;font-size:11px}
  .social button:nth-child(3){display:none}
  .cards{grid-template-columns:1fr!important}
  .cards img{height:145px!important}
  .intro h1{font-size:40px}
}
