
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');
:root{
 --blue:#8edcf3;--blue-strong:#25acd3;--blue-dark:#176b86;
 --orange:#f28a32;--orange-dark:#d86b17;--bg:#f7fbfd;--white:#fff;
 --text:#16232b;--muted:#6d7e87;--line:#e4eef2;--panel:#fff;
 --shadow:0 18px 55px rgba(28,117,145,.12);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}
a{text-decoration:none;color:inherit}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 6%;
 border-bottom:1px solid var(--line);background:rgba(255,255,255,.94);backdrop-filter:blur(14px);
 position:sticky;top:0;z-index:20}
.brand{font-size:25px;font-weight:900;display:flex;align-items:center;gap:10px;color:var(--blue-dark)}
.dot{width:12px;height:12px;background:var(--orange);border-radius:50%;box-shadow:0 0 18px #f28a3260}
.nav nav{display:flex;gap:7px;color:#50636d;font-size:13px;font-weight:700}
.nav nav a{padding:10px 13px;border-radius:10px}.nav nav a:hover{background:#eaf9fd;color:var(--blue-dark)}
.menu{display:none;background:none;border:0;color:var(--blue-dark);font-size:25px}
.hero{min-height:700px;position:relative;display:flex;align-items:center;overflow:hidden;
 background:linear-gradient(135deg,#fff 0%,#effaff 53%,#fff7ef 100%)}
.hero:before{content:"";position:absolute;right:-130px;top:-150px;width:520px;height:520px;border-radius:50%;
 background:radial-gradient(circle,#8edcf360 0,#8edcf310 48%,transparent 70%)}
.hero:after{content:"";position:absolute;left:-170px;bottom:-250px;width:600px;height:600px;border-radius:50%;
 background:radial-gradient(circle,#f28a3222 0,transparent 68%)}
.hero-bg{position:absolute;inset:0;opacity:.35;
 background-image:linear-gradient(135deg,transparent 47%,#8edcf333 48%,transparent 50%),
 linear-gradient(45deg,transparent 48%,#f28a3220 49%,transparent 51%);background-size:120px 120px}
.hero-content{position:relative;z-index:1;width:min(1120px,88%);margin:auto;padding:90px 0}
.badge,.eyebrow{color:var(--blue-dark);font-size:11px;font-weight:900;letter-spacing:2px}
.badge{display:inline-block;border:1px solid #b9e9f5;background:#fff;padding:9px 13px;border-radius:99px;letter-spacing:.4px;box-shadow:0 6px 22px #277e9910}
.hero h1{font-size:clamp(48px,8vw,92px);line-height:.95;margin:20px 0;color:var(--text)}
.hero h1 span{color:var(--orange);text-shadow:0 8px 28px #f28a3225}
.hero p{max-width:650px;color:var(--muted);font-size:18px;line-height:1.7}
.buttons{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:30px}
.primary,.secondary{border-radius:11px;padding:14px 20px;font-weight:900;font-size:12px;letter-spacing:.5px;cursor:pointer;display:inline-block}
.primary{border:1px solid var(--orange);background:var(--orange);color:#fff;box-shadow:0 8px 20px #f28a3230}
.secondary{border:1px solid #cfe4eb;background:#fff;color:var(--blue-dark)}
.primary:hover{background:var(--orange-dark);border-color:var(--orange-dark);transform:translateY(-1px)}
.secondary:hover{border-color:var(--blue-strong);background:#f1fbfe}
.server-card{margin-top:55px;width:min(720px,100%);display:grid;grid-template-columns:1fr auto auto;gap:30px;align-items:center;
 background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 22px;box-shadow:var(--shadow)}
.server-card small{display:block;color:#8b9aa2;font-size:9px;letter-spacing:1.5px;font-weight:900}
.server-card strong{font-size:15px;color:var(--blue-dark)}
.status{color:#6d7e87;font-size:12px}.status i{display:inline-block;width:8px;height:8px;background:#46c77d;border-radius:50%;margin-right:7px}
.players{text-align:right}.players b{font-size:23px;color:var(--orange)}
.section{width:min(1120px,88%);margin:auto;padding:105px 0}
.section h2,.join h2{font-size:clamp(32px,5vw,52px);margin:10px 0 15px;color:var(--text)}
.lead{color:var(--muted);max-width:680px;line-height:1.7}
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:50px}
.features article,.price{border:1px solid var(--line);background:var(--panel);border-radius:17px;padding:25px;box-shadow:0 10px 35px #277e9910}
.features article:hover,.price:hover{transform:translateY(-4px);box-shadow:var(--shadow);transition:.2s}
.icon{font-size:30px;margin-bottom:25px}.features h3,.price h3{margin:0 0 10px}
.features p,.price p{color:var(--muted);font-size:14px;line-height:1.6}
.dark-section{background:#edf9fc;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.rules{margin-top:40px;max-width:900px}.rules div{display:flex;gap:25px;padding:22px 0;border-bottom:1px solid #d9eaf0;color:var(--muted);line-height:1.6}
.rules b{color:var(--orange);min-width:30px}.rules strong{color:var(--text)}
.store-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:45px}
.price{position:relative}.price.featured{border:2px solid var(--blue-strong)}
.price>span{position:absolute;right:18px;top:18px;color:#fff;background:var(--orange);padding:5px 8px;border-radius:5px;font-size:9px;font-weight:900}
.price strong{display:block;font-size:36px;margin:20px 0;color:var(--blue-dark)}.small{display:inline-block;margin-top:15px}
.note{color:#829199;font-size:11px;margin-top:18px}
.join{width:min(1120px,88%);margin:80px auto;padding:55px;border:1px solid #bde8f2;border-radius:20px;
 background:linear-gradient(135deg,#eafaff,#fff 58%,#fff4e9);box-shadow:var(--shadow)}
.join p{color:var(--muted)}.join .buttons{margin-top:0}
footer{border-top:1px solid var(--line);padding:35px 6%;display:flex;justify-content:space-between;gap:20px;color:#788990;font-size:12px;background:#fff}
footer b{color:var(--blue-dark);margin-right:12px}
.toast{position:fixed;right:25px;bottom:25px;background:#e9fbff;color:var(--blue-dark);border:1px solid #bde8f2;padding:13px 17px;border-radius:10px;font-weight:800;font-size:13px;transform:translateY(100px);transition:.25s;z-index:50;box-shadow:var(--shadow)}
.toast.show{transform:translateY(0)}
@media(max-width:800px){
 .nav nav{display:none}.menu{display:block}.features{grid-template-columns:1fr 1fr}.store-grid{grid-template-columns:1fr}
 .server-card{grid-template-columns:1fr 1fr}.players{text-align:left}.join{padding:35px 25px}footer{flex-direction:column}
}
@media(max-width:500px){
 .features{grid-template-columns:1fr}.hero{min-height:650px}.hero-content{padding:60px 0}.hero p{font-size:15px}
 .server-card{gap:14px}.nav{padding:0 5%}
}
.features article strong{color:var(--orange)}

/* HayWorld 2.0 additions */
.nav nav{align-items:center;flex-wrap:wrap}.nav-login{border:1px solid #b9e9f5;background:#effaff;color:#176b86;padding:10px 12px;border-radius:10px;font-weight:800;cursor:pointer}
.donate-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:35px 0 25px}.tab{border:1px solid #b9e9f5;background:#fff;color:#176b86;padding:13px 16px;border-radius:11px;font-weight:900;cursor:pointer}.tab.active{background:var(--blue-strong);border-color:var(--blue-strong);color:#fff}
.hidden{display:none!important}.rank-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.price h3{color:var(--blue-dark);margin:0 0 18px}.buy-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;border-bottom:1px solid var(--line);padding:11px 0}.buy-row:last-child{border-bottom:0}.buy-name{font-size:13px;font-weight:800;line-height:1.45}.buy-price{font-size:13px;font-weight:900;color:var(--orange-dark);white-space:nowrap}.buy-btn{grid-column:1/-1;width:100%;padding:9px 12px;text-align:center;font-size:11px}
.news-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-top:30px}.news-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:20px;box-shadow:0 10px 35px #277e9910;overflow:hidden}.news-card img{width:100%;max-height:280px;object-fit:cover;border-radius:11px;margin-bottom:14px}.news-card h3{margin:0 0 9px}.news-card p{white-space:pre-wrap;line-height:1.7;color:var(--muted)}.news-meta{color:#8b9aa2;font-size:11px;margin-top:15px}.empty{color:var(--muted);padding:24px 0}.admin-box{max-width:850px;margin-top:25px;padding:26px;background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow)}.field{display:grid;gap:8px;margin:16px 0}.field label{font-size:13px;font-weight:800}.field input,.field textarea{width:100%;padding:13px;border:1px solid #d7e7ed;border-radius:10px;background:#fbfeff;color:var(--text);font:inherit}.field textarea{min-height:130px;resize:vertical}.field small,.admin-box small{color:var(--muted);font-size:11px}.form-status{color:var(--blue-dark);font-weight:800;font-size:13px;min-height:18px}.admin-post{padding:14px 0;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.danger{background:#fff0ee;color:#a42c21;border:1px solid #ffd2cc;border-radius:8px;padding:8px 10px;cursor:pointer;font-weight:800}.modal-backdrop{position:fixed;inset:0;z-index:100;background:#081722b8;display:grid;place-items:center;padding:18px}.modal{width:min(450px,100%);position:relative;background:#fff;border:1px solid #b9e9f5;border-radius:18px;padding:28px;box-shadow:0 20px 70px #0003}.modal h2{margin:0 0 8px}.modal-close{position:absolute;right:13px;top:10px;border:0;background:transparent;font-size:27px;color:#617781;cursor:pointer}.modal .buttons{margin-top:18px}.modal .buttons button{flex:1}.modal input{background:#fbfeff}.nav nav a{white-space:nowrap}
@media(max-width:1000px){.rank-grid{grid-template-columns:1fr 1fr}.nav nav{gap:2px}.nav nav a{padding:9px 7px}}
@media(max-width:800px){.nav{height:auto;min-height:72px;flex-wrap:wrap;padding-top:15px;padding-bottom:15px}.nav nav{display:none;flex-basis:100%;flex-direction:column;align-items:stretch;padding:12px 0 0}.nav nav.open{display:flex}.nav nav a,.nav-login{text-align:left;width:100%;padding:12px}.menu{display:block}.rank-grid{grid-template-columns:1fr}.donate-tabs{display:grid;grid-template-columns:1fr}.buy-row{grid-template-columns:minmax(0,1fr) auto}.admin-box{padding:18px}}
