.antos-page { position: relative; background: #000; color: #fff; padding: 60px 20px; text-align: center; width: 100%; overflow: hidden; }
.antos-page::before { content: ""; position: absolute; top: 420px; left: 0; width: 100%; height: 500px; background-image: url('/assets/site/6eced05404b847df9bf5.webp'); background-repeat: no-repeat; background-size: cover; background-position: center; transform: rotate(3.58deg); opacity: 0.3; z-index: 0; pointer-events: none; }
.antos-page::after { content: ""; position: absolute; top: 1363px; left: 200px; width: 100%; height: 757px; background-image: url('/assets/site/6eced05404b847df9bf5.webp'); background-repeat: no-repeat; background-size: cover; background-position: center; transform: rotate(-80deg); opacity: 0.3; z-index: 0; pointer-events: none; }
.antos-page > * { position: relative; z-index: 1; }
.antos-hero { max-width: 1200px; margin: 0 auto 80px; padding: 0 15px; }
.antos-subtitle { color: #666666; font-size: clamp(18px, 3vw, 25px); font-weight: 700; line-height: 1.4; margin-bottom: 30px; }
.antos-brand { font-size: clamp(32px, 5vw, 50px); font-weight: 700; background: linear-gradient(to right, #20A8FF, #1589EA); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-bottom: 30px; }
.antos-description { max-width: 900px; margin: 0 auto 20px; font-size: clamp(14px, 2vw, 18px); line-height: 1.8; color: #ffffff; }
.antos-highlight { color: #ffffff; font-weight: 700; }
.antos-tagline { margin-top: 20px; font-size: clamp(12px, 1.5vw, 15px); line-height: 1.8; }
.antos-training { max-width: 1200px; margin: 100px auto 80px; padding: 0 15px; }
.antos-training-title { color: #6DEEFF; font-size: clamp(24px, 4vw, 32px); font-weight: 700; line-height: 1.4; margin-bottom: 30px; }
.antos-training-text { font-size: clamp(14px, 2vw, 18px); line-height: 1.8; color: #ffffff; margin-bottom: 15px; }
.antos-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; max-width: 1200px; margin: 80px auto; padding: 0 15px; }
.antos-feature-card { border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 12px; padding: 30px; text-align: center; transition: transform 0.3s ease, box-shadow 0.3s ease; background: rgba(0, 0, 0, 0.3); }
.antos-feature-card:hover { transform: translateY(-8px); box-shadow: 0 0 20px rgba(77, 181, 255, 0.4); }
.antos-feature-icon { width: 120px; height: 120px; margin: 0 auto 20px; object-fit: contain; }
.antos-feature-title { color: #6DEEFF; font-size: clamp(18px, 2.5vw, 28px); font-weight: 700; line-height: 1.3; }
.antos-arena { max-width: 1200px; margin: 100px auto; padding: 0 15px; }
.antos-arena-content { display: grid; grid-template-columns: 1fr; gap: 60px; align-items: center; }
.antos-arena-image-box { position: relative; width: 100%; max-width: 600px; margin: 0 auto; border-radius: 18px; box-shadow: inset 0 0 10px rgba(128, 128, 128, 0.6); padding: 5%; }
.antos-arena-image { position: relative; z-index: 2; width: 100%; height: auto; border-radius: 18px; object-fit: cover; }
.antos-arena-title { color: #6DEEFF; font-size: clamp(22px, 3vw, 32px); font-weight: 700; margin-bottom: 20px; text-align: center; }
.antos-arena-description { font-size: clamp(14px, 2vw, 18px); line-height: 1.8; margin-bottom: 30px; text-align: left; }
.antos-arena-features { display: flex; flex-direction: column; gap: 20px; transform: translateX(5%) !important; }
.antos-arena-feature { display: flex; align-items: flex-start; gap: 15px; text-align: left; padding-bottom: 15px; border-bottom: 1px solid rgba(109, 238, 255, 0.2); }
.antos-arena-feature img { width: 40px; height: 40px; flex-shrink: 0; }
.antos-arena-feature span { font-size: clamp(14px, 2vw, 18px); line-height: 1.6; color: #ffffff; }
.antos-dual-section { max-width: 1200px; margin: 100px auto; padding: 0 15px; }
.antos-dual-grid { display: grid; grid-template-columns: 1fr; gap: 60px; }
.antos-section-title { color: #6DEEFF; font-size: clamp(22px, 3vw, 32px); font-weight: 700; margin-bottom: 20px; text-align: center; }
.antos-section-text { font-size: clamp(14px, 2vw, 18px); line-height: 1.8; margin-bottom: 30px; text-align: left; }
.antos-leaderboard-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin-top: 30px; }
.antos-leaderboard-card { border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 12px; padding: 20px; background: rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 10px rgba(128, 128, 128, 0.3); transition: transform 0.3s ease; }
.antos-leaderboard-card:hover { transform: translateY(-5px); box-shadow: 0 0 15px rgba(77, 181, 255, 0.4); }
.antos-leaderboard-card span { font-size: clamp(14px, 2vw, 18px); line-height: 1.6; }
.antos-ecosystem-list { list-style: none; padding: 0; text-align: left; }
.antos-ecosystem-list li { position: relative; padding-left: 25px; margin-bottom: 15px; font-size: clamp(14px, 2vw, 18px); line-height: 1.6; }
.antos-ecosystem-list li::before { content: "●"; color: #4db5ff; position: absolute; left: 0; }
.antos-unlock-section { max-width: 1200px; margin: 100px auto; padding: 0 15px; }
.antos-unlock-wrapper { display: grid; grid-template-columns: 1fr; gap: 60px; align-items: start; }
.antos-unlock-title { color: #666666; font-size: clamp(20px, 3vw, 28px); font-weight: 700; margin-bottom: 25px; text-align: left; position: relative;}
.antos-unlock-title::after {content: "";display: block;width: 65%; height: 3px; background-color: #4db5ff;margin-top: 8px; border-radius: 2px; filter: brightness(1.0);opacity: 0.2;}
.antos-unlock-list { list-style: none; padding: 0; text-align: left; }
.antos-unlock-list li { position: relative; padding-left: 25px; margin-bottom: 15px; color: #6DEEFF; font-size: clamp(14px, 2vw, 18px); font-weight: 700; line-height: 1.6; }
.antos-unlock-list li::before { content: "●"; color: #20A8FF; position: absolute; left: 0; }
.antos-timeline-section { max-width: 100%; margin: 0; padding: 0; }
.antos-timeline-title { color: #666666; font-size: clamp(24px, 3vw, 32px); font-weight: 700; margin-bottom: 50px; text-align: left; }
.antos-timeline { position: relative; display: grid; grid-template-columns: 1fr; gap: 40px; padding-top: 60px; }
.antos-timeline::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: #6DEEFF; }
.antos-timeline-step { position: relative; text-align: left; }
.antos-timeline-step::before { content: ""; position: absolute; top: -60px; left: 50%; transform: translateX(-50%); width: 5px; height: 40px; background: #6DEEFF; }
.antos-timeline-step::after { content: ""; position: absolute; top: -63px; left: 50%; transform: translateX(-50%); width: 12px; height: 12px; background: #6DEEFF; border-radius: 50%; }
.antos-step-title { color: #6DEEFF; font-size: clamp(18px, 2.5vw, 24px); font-weight: 700; margin-bottom: 15px; }
.antos-step-text { font-size: clamp(14px, 2vw, 16px); line-height: 1.6; color: #ffffff; }
.antos-community { max-width: 1200px; margin: 100px auto; padding: 0 15px; }
.antos-community-title { color: #6DEEFF; font-size: clamp(22px, 3vw, 32px); font-weight: 700; margin-bottom: 20px; text-align: left; }
.antos-community-text { font-size: clamp(14px, 2vw, 18px); line-height: 1.8; margin-bottom: 40px; text-align: left; }
.antos-community-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20% !important; }
.antos-community-card { display: flex; align-items: center; gap: 20px; }
.antos-community-icon-box { width: 80px; height: 80px; border-radius: 12px; display: flex; align-items: center; justify-content: center; box-shadow: inset 0 0 10px rgba(128, 128, 128, 0.3); flex-shrink: 0; }
.antos-community-icon { width: 50px; height: 50px; object-fit: contain; }
.antos-community-label { color: #6DEEFF; font-size: clamp(16px, 2vw, 22px); font-weight: 700; line-height: 1.3; }
.antos-cta { max-width: 900px; margin: 200px auto 60px; padding: 60px 30px; border-radius: 32px; border: 2px solid rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 15px rgba(128, 128, 128, 0.3); text-align: center; }
.antos-cta-title { background: linear-gradient(to right, #20A8FF, #1589EA); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-size: clamp(28px, 5vw, 50px); font-weight: 700; margin-bottom: 30px; }
.antos-cta-text { font-size: clamp(14px, 2vw, 20px); line-height: 1.8; margin-bottom: 40px; }
.antos-cta-button { padding: 15px 40px; font-size: clamp(14px, 2vw, 18px); font-weight: 600; border-radius: 15px; border: none; background: #000; color: #fff; box-shadow: 0 0 8px #f8f9fa; cursor: pointer; transition: all 0.3s ease; }
.antos-cta-button:hover { background: linear-gradient(90deg, #19e0ff 0%, #1589ea 100%); transform: scale(1.05); }

@media (min-width: 768px) { 
.antos-arena-content { grid-template-columns: 1fr 1fr; } 
.antos-dual-grid { grid-template-columns: 1fr 1fr; } 
.antos-unlock-wrapper { grid-template-columns: 1fr 1.5fr; } 
.antos-timeline { grid-template-columns: repeat(3, 1fr); } 
}

@media (max-width: 767px) {
.antos-page::before,.antos-page::after {opacity: 0.15;}
.antos-hero,.antos-training,.antos-arena,.antos-dual-section,.antos-timeline-section,.antos-community,
.antos-cta {margin-top: 60px; margin-bottom: 60px;}
.antos-arena-image-box {margin-bottom: 30px;}
.antos-timeline {padding-top: 20px;}
.antos-timeline::before {display: none;}
.antos-timeline-step::before, .antos-timeline-step::after {display: none;}
}

@media (max-width: 431px){
.antos-cta{margin-top: 80% !important;}
.antos-timeline{margin-top: -10%;}
.antos-community{margin-top:-4%;}
}

@media (max-width: 391px){
.antos-brand{margin-top: -6%;}
.antos-description{margin-top:-2%}
}

    