*{box-sizing:border-box}
body{margin:0;background:#0b0b0d;color:#f4f4f5;font-family:'Barlow',system-ui,sans-serif;font-size:17px;line-height:1.6;overflow-x:hidden}
a{color:#ff4a58}a:hover{color:#ff7a85}
img{max-width:100%}
h1,h2,h3{font-family:'Chakra Petch',sans-serif;margin:0}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}

/* Navegación */
.nav{border-bottom:1px solid #1f1f24;background:#0b0b0d}
.nav .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff}
.brand img{width:52px;height:52px;object-fit:contain}
.brand span{font-family:'Chakra Petch',sans-serif;font-weight:700;font-size:22px;letter-spacing:.06em;text-transform:uppercase}
.brand span b{color:#ff4a58}
.links{display:flex;flex-wrap:wrap;align-items:center;gap:8px 26px}
.links a.l{color:#d4d4dc;text-decoration:none;font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:14px;padding:10px 4px;border-bottom:2px solid transparent}
.links a.l:hover,.links a.l.on{color:#fff;border-bottom-color:#e11d2e}

/* Botones */
.btn{display:inline-block;font-family:'Chakra Petch',sans-serif;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:16px;padding:14px 28px;border-radius:6px;text-decoration:none;cursor:pointer;border:2px solid transparent;transition:transform .15s ease,background .15s ease,border-color .15s ease}
.btn:hover{transform:translateY(-2px)}
.btn-red{background:#c8101e;color:#fff}
.btn-red:hover{background:#e11d2e;color:#fff}
.btn-ghost{color:#fff;border-color:#3a3a42}
.btn-ghost:hover{color:#fff;border-color:#e11d2e}
.btn-sm{padding:10px 20px;font-size:14px}
.btn-lg{padding:18px 40px;font-size:18px;border-radius:8px}
.btns{display:flex;flex-wrap:wrap;gap:14px}

/* Tipografía */
.eyebrow{font-family:'Chakra Petch',sans-serif;font-weight:600;color:#ff4a58;letter-spacing:.24em;text-transform:uppercase;font-size:13px}
.h2{font-size:44px;text-transform:uppercase;line-height:1.05}

/* Portada */
.hero{background:radial-gradient(ellipse at 72% 45%,rgba(225,29,46,.34) 0%,rgba(120,10,20,.18) 38%,rgba(11,11,13,0) 70%),#0b0b0d}
.hero .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:48px;padding-top:72px;padding-bottom:88px}
.hero .txt{flex:1 1 460px;min-width:0;display:flex;flex-direction:column;gap:24px}
.hero .eyebrow{font-size:14px}
.hero h1{font-size:clamp(46px,8vw,92px);line-height:.95;text-transform:uppercase;letter-spacing:.01em}
.hero h1 span{color:#ff4a58}
.lead{margin:0;max-width:520px;color:#c4c4cc;font-size:19px}
.hero .logo{flex:1 1 380px;min-width:0;display:flex;justify-content:center}
.hero .logo img{width:100%;max-width:560px;height:auto;display:block;filter:drop-shadow(0 0 50px rgba(225,29,46,.45));animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.online{display:flex;align-items:center;gap:10px;color:#c4c4cc;font-size:16px}
.dot{width:10px;height:10px;border-radius:50%;background:#3ddc84;flex:0 0 auto}
.ipbox{display:flex;flex-wrap:wrap;max-width:520px;border:2px solid #2a2a30;border-radius:8px;background:#121215;overflow:hidden}
.ipbox .info{flex:1 1 200px;min-width:0;padding:14px 18px;display:flex;flex-direction:column;justify-content:center}
.ipbox small,.ipbar small{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#a8a8b3;font-weight:600}
.ipbox strong{font-family:'Chakra Petch',sans-serif;font-weight:600;font-size:22px;word-break:break-all}
.ipbox button{border-radius:0;border:0;min-height:56px;padding:0 26px;flex:0 0 auto}

/* Cabecera de páginas interiores */
.banner{background:radial-gradient(ellipse at 80% 50%,rgba(225,29,46,.3) 0%,rgba(11,11,13,0) 65%),#0b0b0d;border-bottom:1px solid #1f1f24;padding:72px 0}
.banner .wrap{display:flex;flex-direction:column;gap:16px}
.banner h1{font-size:clamp(42px,7vw,72px);line-height:1;text-transform:uppercase}
.banner p{margin:0;max-width:640px;color:#c4c4cc;font-size:19px}

/* Secciones */
.sec{padding:88px 0}
.sec-alt{background:#0e0e11;border-top:1px solid #1f1f24;border-bottom:1px solid #1f1f24}
.head{display:flex;flex-direction:column;gap:10px;margin-bottom:40px}
.grid{display:flex;flex-wrap:wrap;gap:24px}
.grid>*{flex:1 1 300px;min-width:0}
.grid.s>*{flex-basis:240px}

/* Tarjetas */
.card{background:#151518;border:1px solid #26262b;border-radius:10px;padding:28px;display:flex;flex-direction:column;gap:14px;transition:transform .2s ease,border-color .2s ease}
.card h3{font-size:24px;line-height:1.2}
.card p{margin:0;color:#b4b4be}
a.card,a.card:hover{text-decoration:none;color:#fff}
.card.hover:hover{transform:translateY(-4px);border-color:#e11d2e}
.card.feature{background:linear-gradient(160deg,#1d1013 0%,#151518 65%);border-radius:12px;padding:32px}
.card.feature h3{font-size:28px;text-transform:uppercase}
.meta{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#a8a8b3;font-weight:600}
.more{margin-top:auto;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:14px;color:#ff4a58;text-decoration:none}
.card.feature .more{margin-top:8px}
.num{font-family:'Chakra Petch',sans-serif;font-weight:700;font-size:54px;line-height:1;color:#ff4a58}
.steps{display:flex;flex-direction:column;gap:20px}
.stepx{background:#151518;border:1px solid #26262b;border-radius:12px;padding:28px 32px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 32px}
.stepx .num{flex:0 0 84px;font-size:60px}
.stepx .t{flex:1 1 320px;min-width:0}
.stepx h3{font-size:24px;margin-bottom:4px}
.stepx p{margin:0;color:#b4b4be}

/* Bloques destacados */
.cta{background:radial-gradient(ellipse at 20% 0%,rgba(225,29,46,.4),#140809 65%);border:1px solid #5a1219;border-radius:16px;padding:56px 40px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px}
.cta .txt{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:14px}
.cta .eyebrow{color:#ff8a93}
.cta p{margin:0;color:#e4e4ea;max-width:520px}
.helpbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px}
.helpbar .txt{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:10px}
.helpbar h2{font-size:36px;text-transform:uppercase;line-height:1.05}
.helpbar p{margin:0;color:#c4c4cc}
.ipbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(90deg,rgba(225,29,46,.22),rgba(225,29,46,.04));border:1px solid #5a1219;border-radius:12px;padding:32px 36px}
.ipbar small{display:block;color:#d4d4dc}
.ipbar strong{font-family:'Chakra Petch',sans-serif;font-weight:700;font-size:36px;word-break:break-all}
.ipbar button{border:0;min-height:56px;padding:0 32px;font-size:17px}

/* Modpack */
.split{display:flex;flex-wrap:wrap;align-items:stretch;gap:48px}
.split>*{flex:1 1 420px;min-width:0}
.split .txt{display:flex;flex-direction:column;gap:22px;justify-content:center}
.split .txt p{margin:0;color:#c4c4cc}
.spec{background:linear-gradient(160deg,#1a1215 0%,#121215 60%);border:1px solid #2a2a30;border-radius:12px;padding:12px 32px}
.spec div{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;border-bottom:1px solid #26262b}
.spec div:last-child{border-bottom:0}
.spec span:first-child{color:#a8a8b3;letter-spacing:.1em;text-transform:uppercase;font-size:13px;font-weight:600}
.spec span:last-child{font-family:'Chakra Petch',sans-serif;font-weight:600;font-size:20px}

/* Normas */
.block{background:#151518;border:1px solid #26262b;border-radius:12px;padding:32px;display:flex;flex-direction:column;gap:16px;margin-bottom:24px}
.block h2{font-size:30px;text-transform:uppercase;line-height:1.05}
.block p{margin:0;color:#c4c4cc}

/* Pie */
.foot{background:#070708;border-top:1px solid #1f1f24}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:32px;padding-top:48px;padding-bottom:48px}
.foot .col{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:14px}
.foot .brandline{display:flex;align-items:center;gap:12px;font-family:'Chakra Petch',sans-serif;font-weight:700;font-size:20px;letter-spacing:.06em;text-transform:uppercase}
.foot .brandline img{width:44px;height:44px;object-fit:contain}
.foot p{margin:0;color:#9a9aa6;font-size:14px;max-width:520px}
.foot .links2{display:flex;flex-direction:column;gap:8px;font-size:14px}
.foot .links2 b{font-family:'Chakra Petch',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#fff}
.foot .links2 a{text-decoration:none}
.foot .copy{border-top:1px solid #1a1a1f;padding:18px 24px;text-align:center;color:#8a8a96;font-size:13px}

/* Normas con selector */
.rules{display:flex;flex-wrap:wrap;align-items:flex-start;gap:32px}
.tabs{flex:0 0 300px;display:flex;flex-direction:column;gap:8px;position:sticky;top:16px}
.tabs-label{font-family:'Chakra Petch',sans-serif;font-weight:600;color:#ff4a58;letter-spacing:.2em;text-transform:uppercase;font-size:12px;margin-bottom:4px}
.tabs button{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:#151518;border:1px solid #26262b;border-radius:8px;color:#d4d4dc;padding:12px 16px;font-family:'Chakra Petch',sans-serif;font-weight:600;font-size:15px;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;transition:border-color .15s ease,background .15s ease}
.tabs button .n{color:#ff4a58;font-weight:700}
.tabs button:hover{border-color:#e11d2e;color:#fff}
.tabs button[aria-selected="true"]{background:#2a0f14;border-color:#e11d2e;color:#fff}
.panels{flex:1 1 520px;min-width:0}
.rule{background:#151518;border:1px solid #26262b;border-radius:12px;padding:40px;display:flex;flex-direction:column;gap:18px}
.rule[hidden]{display:none}
.rule .num{font-family:'Chakra Petch',sans-serif;font-weight:700;font-size:54px;line-height:1;color:#ff4a58}
.rule h2{font-size:34px;text-transform:uppercase;line-height:1.05}
.rule p{margin:0;color:#d4d4dc}
.rule ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:14px}
.rule li{position:relative;padding-left:28px;color:#d4d4dc}
.rule li::before{content:"";position:absolute;left:0;top:.55em;width:9px;height:9px;border-radius:2px;background:#e11d2e;transform:rotate(45deg)}
.chain{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.chip{padding:8px 14px;border:1px solid #5a1219;border-radius:6px;background:#1d1013;font-family:'Chakra Petch',sans-serif;font-weight:600;text-transform:uppercase;font-size:14px}
.chain i{color:#ff4a58;font-style:normal;font-weight:700}
.pager{display:flex;justify-content:space-between;gap:12px;margin-top:12px;padding-top:20px;border-top:1px solid #26262b}
.pager button{background:transparent}
@media (max-width:860px){
.tabs{flex:1 1 100%;flex-direction:row;overflow-x:auto;position:static;padding-bottom:8px}
.tabs-label{display:none}
.tabs button{width:auto;flex:0 0 auto;white-space:nowrap}
.rule{padding:28px}
}

@media (prefers-reduced-motion:reduce){.btn,.card{transition:none}.hero .logo img{animation:none}}
