.content-container { width: min(980px, calc(100% - 40px)); margin: 0 auto; }
.scroll-reveal { opacity: 0; transform: translateY(34px); transition: opacity .7s ease, transform .7s cubic-bezier(.2, .75, .3, 1); }.scroll-reveal.is-visible { opacity: 1; transform: translateY(0); }
.server-status-card { display: flex; align-items: center; justify-content: center; width: min(680px, 100%); gap: 24px; min-height: 98px; padding: 22px 32px; margin-top: 76px; border: 1px solid rgba(132, 255, 164, .2); border-radius: 18px; background: linear-gradient(115deg, rgba(19, 80, 37, .42), rgba(4, 28, 13, .5)); box-shadow: inset 0 1px 0 rgba(232, 255, 237, .06), 0 18px 52px rgba(0, 0, 0, .18); backdrop-filter: blur(14px); }.status-light { width: 9px; height: 9px; border-radius: 50%; background: #d5a76f; box-shadow: 0 0 0 6px rgba(213, 167, 111, .1), 0 0 20px #d5a76f; }.status-light.is-online { background: #72ff96; box-shadow: 0 0 0 6px rgba(114, 255, 150, .1), 0 0 20px #72ff96; }.status-light.is-offline { background: #ff6974; box-shadow: 0 0 0 6px rgba(255, 105, 116, .1), 0 0 20px #ff6974; }.status-label { display: block; margin-bottom: 5px; color: #93ae9b; font-size: 11px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }.server-status-card strong { color: #e7ffec; font-size: 15px; }.status-divider { width: 1px; height: 38px; background: rgba(143, 255, 169, .17); }
.about-server, .start-section { padding: 110px 0; border-top: 1px solid rgba(142, 255, 169, .09); }.about-layout { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 72px; }.section-label { color: #76ff99; font-size: 11px; font-weight: 800; letter-spacing: .18em; }.about-text h2, .start-card h2 { margin: 18px 0; color: #effff2; font: 700 clamp(30px, 4vw, 48px)/1.18 Unbounded, sans-serif; letter-spacing: -2px; }.about-text p { max-width: 440px; margin: 0; color: #aebeb3; font-size: 16px; line-height: 1.75; }
.about-image { height: 290px; margin: 0; overflow: hidden; border: 1px solid rgba(142, 255, 169, .2); border-radius: 20px; background: #06180c; box-shadow: 0 20px 54px rgba(0, 0, 0, .24); }.about-image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }.about-image:hover img { transform: scale(1.04); }
.start-section { padding-bottom: 140px; }.start-card { display: grid; grid-template-columns: .9fr 1.1fr; overflow: hidden; border: 1px solid rgba(142, 255, 169, .2); border-radius: 23px; background: linear-gradient(125deg, rgba(14, 75, 31, .48), rgba(4, 28, 13, .66)); box-shadow: 0 24px 70px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(231, 255, 235, .06); }.start-card-intro { padding: 48px; border-right: 1px solid rgba(142, 255, 169, .16); }.start-card-intro h2 { margin-top: 16px; }.start-card-intro p { margin: 0; color: #adc1b2; font-size: 15px; line-height: 1.7; }.discord-button { display: inline-flex; align-items: center; gap: 10px; padding: 13px 17px; margin-top: 28px; border: 1px solid rgba(139, 255, 165, .32); border-radius: 10px; background: rgba(104, 255, 137, .12); color: #dfffe6; font-size: 14px; font-weight: 700; text-decoration: none; transition: background .2s ease, transform .2s ease; }.discord-button:hover { background: rgba(104, 255, 137, .23); transform: translateY(-2px); }.discord-button span { font-size: 17px; }.start-steps { display: grid; gap: 0; padding: 22px 44px; margin: 0; list-style: none; }.start-steps li { display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 17px; min-height: 116px; border-bottom: 1px solid rgba(142, 255, 169, .12); }.start-steps li:last-child { border-bottom: 0; }.start-steps > li > span { color: #71ff94; font: 700 13px/1 Unbounded, sans-serif; }.start-steps h3 { margin: 0 0 7px; color: #effff2; font-size: 16px; }.start-steps p { margin: 0; color: #a5b8aa; font-size: 13px; line-height: 1.5; }.start-steps strong { color: #b4ffc5; font-weight: 700; }.site-footer { padding: 28px 20px 36px; border-top: 1px solid rgba(142, 255, 169, .09); color: #6f8b77; font: 700 10px/1 Unbounded, sans-serif; letter-spacing: .16em; text-align: center; }
@media (max-width: 780px) { .content-container { width: min(100% - 28px, 560px); }.server-status-card { display: grid; grid-template-columns: 10px 1fr; justify-content: start; gap: 18px 14px; padding: 23px; }.status-light { grid-row: 1 / 4; align-self: center; }.status-divider { display: none; }.about-server, .start-section { padding: 76px 0; }.about-layout { grid-template-columns: 1fr; gap: 38px; }.about-text h2, .start-card h2 { font-size: 29px; letter-spacing: -1.5px; }.about-image { height: 235px; }.start-section { padding-bottom: 88px; }.start-card { grid-template-columns: 1fr; }.start-card-intro { padding: 32px 26px; border-right: 0; border-bottom: 1px solid rgba(142, 255, 169, .16); }.start-steps { padding: 8px 26px; }.start-steps li { min-height: 104px; } }
@media (prefers-reduced-motion: reduce) { .scroll-reveal { opacity: 1; transform: none; transition: none; } }