/* =========================
   DOTA 2 — SETEC ARENA 2026
   ========================= */
html,body { margin:0; padding:0; background:#08090b; }

/* PAGE AND BATTLEFIELD */
.arena-page.dota-page { position:relative; width:100%; height:100vh; height:100dvh; min-height:550px; margin:0; padding:0; overflow:hidden; box-sizing:border-box; background:#08090b; font-family:'Segoe UI',Arial,sans-serif; color:#e8d8ce; animation:dotaPageEnter 2.6s ease-out both; }
.dota-hero-video { position:absolute; inset:0; z-index:0; display:block; width:100%; height:100%; object-fit:cover; object-position:center; pointer-events:none; }
.dota-atmosphere { position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg,rgba(0,0,0,.3),transparent 28%,transparent 75%,rgba(0,0,0,.2)),linear-gradient(0deg,rgba(0,0,0,.5),transparent 38%); }

/* HEADER — SHARED WITH CS2 */
.dota-page .arena-header { position:absolute; z-index:10; top:0; left:0; right:0; width:100%; box-sizing:border-box; }
.dota-back-btn { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 18px; border:1px solid #ff8500; border-radius:4px; background:rgba(0,0,0,.35); color:#ff8500; font-size:12px; font-weight:800; text-decoration:none; box-sizing:border-box; transition:background .2s,color .2s; }
.dota-back-btn:hover { background:#ff8500; color:#08090b; }

/* DOTA / AMD BRANDING */
.dota-branding { position:absolute; z-index:3; left:3%; bottom:5%; width:420px; max-width:27%; pointer-events:none; }
.dota-branding img { display:block; width:100%; height:auto; object-fit:contain; filter:drop-shadow(0 4px 16px rgba(0,0,0,.7)); }

/* DESKTOP STONE FRAME */
.dota-panel { position:absolute; z-index:2; top:53%; left:50%; transform:translate(-50%,-50%); width:calc(100% - 40px); max-width:700px; height:calc(100% - 110px); box-sizing:border-box; }
.dota-panel::before { content:""; position:absolute; z-index:0; inset:7% 12% 6%; background:rgba(5,6,8,.95); pointer-events:none; }
.dota-stone { position:absolute; inset:0; z-index:2; width:100%; height:100%; object-fit:fill; pointer-events:none; }
.dota-panel-badge { position:absolute; z-index:4; top:0; left:50%; transform:translateX(-50%); display:flex; align-items:center; justify-content:center; width:54px; height:54px; pointer-events:none; }
.dota-panel-badge img { display:block; width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 3px 10px rgba(0,0,0,.65)); }
.dota-content { position:absolute; z-index:3; top:13%; bottom:10%; left:15%; width:70%; overflow-y:auto; overflow-x:hidden; box-sizing:border-box; padding:0 7px 12px 0; scrollbar-width:thin; scrollbar-color:#69372d transparent; }
.dota-content::-webkit-scrollbar { width:4px; }
.dota-content::-webkit-scrollbar-thumb { background:#69372d; border-radius:5px; }

/* INTRODUCTION */
.dota-heading { text-align:center; }
.dota-heading h1 { max-width:470px; margin:10px auto 20px; color:#e8d8ce; font-family:'Segoe UI',Arial,sans-serif; font-size:16px; font-weight:600; line-height:1.6; letter-spacing:0; text-align:center; text-shadow:0 2px 8px rgba(0,0,0,.6); }
.dota-heading-line { width:85%; height:2px; margin:0 auto 22px; background:linear-gradient(90deg,transparent,#ff5934,transparent); box-shadow:0 0 12px rgba(255,75,30,.65); }
.dota-heading p { max-width:470px; margin:0 auto; color:#c4bab5; font-size:13px; line-height:1.8; text-align:center; }

/* REGISTRATION FORM */
.dota-form { width:100%; margin-top:23px; }
.dota-section-title { display:flex; align-items:center; gap:11px; margin:0 0 12px; padding-bottom:9px; border-bottom:1px solid rgba(255,255,255,.12); color:#e9dcd5; font-size:11px; font-weight:900; letter-spacing:1px; }
.dota-section-title span { color:#ff6946; font-size:17px; font-weight:900; }
.dota-form-grid,.dota-players-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:13px; row-gap:11px; }
.dota-form-grid { margin-bottom:22px; }
.dota-full { grid-column:1/-1; }
.dota-field { min-width:0; }
.dota-field label { display:block; margin-bottom:5px; color:#bcb4ae; font-size:10px; font-weight:800; letter-spacing:1px; }
.dota-field input { display:block; width:100%; height:37px; padding:0 11px; border:1px solid #3a3332; border-radius:2px; box-sizing:border-box; outline:none; background:rgba(10,11,14,.94); color:#f3e8e1; font-family:'Segoe UI',Arial,sans-serif; font-size:12px; transition:border-color .2s,box-shadow .2s; }
.dota-field input::placeholder { color:#77716f; }
.dota-field input:focus { border-color:#ef6849; box-shadow:0 0 0 2px rgba(239,104,73,.13); }
.dota-form-bottom { margin-top:20px; padding-bottom:8px; }
.dota-submit-btn { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; height:41px; border:1px solid #db6548; border-radius:2px; background:linear-gradient(135deg,#9b3022,#c64b32); color:#fff; font-family:inherit; font-size:12px; font-weight:900; letter-spacing:1.5px; }
.dota-submit-btn:disabled { opacity:.55; cursor:not-allowed; }

/* TABLET — UNCHANGED DESKTOP STRUCTURE */
@media(max-width:1100px) {
    .dota-branding { left:2%; bottom:4%; width:280px; max-width:27%; }
    .dota-page .arena-header-inner { width:calc(100% - 40px); }
}

/* MOBILE — SCROLLABLE PAGE, TWO-ROW HEADER, BRANDING AT THE VERY BOTTOM */
@media(max-width:700px) {
    .arena-page.dota-page { display:flex; flex-direction:column; align-items:stretch; height:auto; min-height:100vh; min-height:100dvh; padding:0 14px 30px; overflow:visible; isolation:isolate; }
    .dota-hero-video { position:fixed; inset:0; height:100vh; height:100dvh; }
    .dota-atmosphere { position:fixed; inset:0; background:rgba(0,0,0,.5); }

    /* Keep the original header and all four navigation links */
    .dota-page .arena-header { position:relative; flex-shrink:0; display:flex; flex-direction:column; height:auto; min-height:0; width:calc(100% + 28px); margin:0 -14px; background:rgba(5,6,9,.96); }
    .dota-page .arena-header-inner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; width:calc(100% - 24px); height:auto; min-height:60px; gap:0; padding:8px 0 0; box-sizing:border-box; }
    .dota-page .arena-nav { display:flex; order:3; width:100%; height:44px; align-items:center; justify-content:center; gap:18px; margin-top:8px; border-top:1px solid rgba(255,255,255,.08); }
    .dota-page .arena-nav a { display:inline-flex; align-items:center; justify-content:center; height:100%; font-size:10px; white-space:nowrap; }
    .dota-page .arena-nav a.active { color:#ff8500; }
    .dota-back-btn { min-height:34px; padding:0 10px; font-size:10px; }

    /* Remove narrow stone frame only on mobile */
    .dota-stone,.dota-panel-badge { display:none; }
    .dota-panel { position:relative; order:2; flex-shrink:0; top:auto; left:auto; transform:none; width:100%; max-width:none; height:auto; margin:18px auto 0; padding:20px 16px 25px; background:rgba(6,7,10,.88); border:1px solid rgba(255,80,40,.35); border-top:2px solid #ff5934; border-radius:4px; box-shadow:0 15px 45px rgba(0,0,0,.6); }
    .dota-panel::before { display:none; }
    .dota-content { position:relative; top:auto; bottom:auto; left:auto; width:100%; height:auto; overflow:visible; padding:0; }
    .dota-heading h1 { font-size:16px; margin:0 auto 12px; }
    .dota-heading-line { margin-bottom:12px; }
    .dota-heading p { font-size:12px; line-height:1.7; }
    .dota-form { margin-top:15px; }
    .dota-form-grid,.dota-players-grid { grid-template-columns:1fr; column-gap:8px; row-gap:10px; }
    .dota-full { grid-column:auto; }
    .dota-form-grid { margin-bottom:18px; }
    .dota-section-title { font-size:10px; }
    .dota-field label { font-size:10px; }
    .dota-field input { height:42px; padding:0 11px; font-size:13px; }
    .dota-submit-btn { height:42px; }
    .dota-form-bottom { margin-top:20px; }

    /* Same ASPX image, visually moved beneath the entire form */
    .dota-branding { display:block; position:relative; z-index:3; order:3; flex-shrink:0; top:auto; right:auto; bottom:auto; left:auto; width:250px; max-width:85%; margin:22px auto 10px; }
    .dota-branding img { display:block; width:100%; height:auto; }
}

@keyframes dotaPageEnter { from { opacity:0; } to { opacity:1; } }
@media(prefers-reduced-motion:reduce) {
    .arena-page.dota-page { animation:none; }
    .dota-hero-video { display:none; }
    .arena-page.dota-page { background:#08090b url('../Content/Images/dota2hero.png') center/cover no-repeat; }
}
/* REGISTRATION INFORMATION */
.arena-registration-note {
    margin-top:18px;
    padding:15px 10px 0;
    border-top:1px solid rgba(255,255,255,.10);
    text-align:center;
}

.arena-registration-note p {
    margin:0 0 10px;
    color:#aaa7a7;
    font-size:11px;
    line-height:1.6;
}

.arena-registration-note .arena-note-intro {
    color:#e7e1df;
    font-size:12px;
    font-weight:700;
}

.arena-registration-note .arena-note-age {
    margin-top:12px;
    margin-bottom:0;
    color:#ff8b4a;
    font-size:11px;
    font-weight:700;
}
.dota-submit-btn{
    cursor:pointer;
    font-family:inherit;
}

.dota-submit-btn:hover{
    filter:brightness(1.12);
}