:root{
  --ink:#0a0a0a;
  --char:#111418;         /* gris oscuro base */
  --char-2:#181e24;       /* paneles */
  --char-3:#222b33;       /* bordes/hover */
  --slate:#3a454e;
  --mist:#9aa7b1;         /* texto secundario */
  --paper:#e8edf1;        /* texto principal */
  --aqua:#ff7a00;         /* naranja brillante */
  --aqua-2:#ff9533;
  --aqua-deep:#cc5f00;
  --gold:#cdb07a;         /* acento cálido sutil */
  --r:14px;
  --maxw:1140px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:#111418;background-color:#111418;scrollbar-width:none;-ms-overflow-style:none;}
html::-webkit-scrollbar{display:none}
body{
  background:#111418 !important;
  background-color:#111418 !important;

  color:#e8edf1;
  font-family:'Inter',system-ui,sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
body::-webkit-scrollbar{display:none;width:0}
h1,h2{font-family:'Bebas Neue',sans-serif;line-height:1.0;font-weight:400;letter-spacing:.04em;text-transform:uppercase}
h3,h4{font-family:'Inter',sans-serif;line-height:1.2;font-weight:700;letter-spacing:-.02em}
.mono{font-family:'JetBrains Mono',monospace}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
a{color:inherit;text-decoration:none}
.aqua{color:var(--aqua)}

/* ---------- NAV ---------- */
header.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(14,17,20,.78);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--char-3);
}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:60px;gap:12px;flex-wrap:nowrap;position:relative}
.brand{display:flex;align-items:center;gap:12px;font-family:'Sora',sans-serif;font-weight:800;font-size:1.28rem;letter-spacing:-.01em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;position:relative;z-index:1}
.chip{
  width:38px;height:38px;display:grid;place-items:center;
}
.nav-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;position:relative;z-index:1}
.nav-links{display:flex;gap:30px;font-size:.94rem;color:var(--mist);position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap}
.nav-links a:hover{color:var(--paper)}
.nav-cta{white-space:nowrap;
  background:var(--aqua);color:var(--ink);font-weight:600;
  padding:10px 20px;border-radius:10px;font-size:.92rem;transition:.2s;
}
.nav-cta:hover{background:var(--aqua-2);transform:translateY(-1px)}
.burger{
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;
  width:42px;height:42px;border-radius:10px;
  background:var(--char-2);
  border:1px solid var(--char-3);cursor:pointer;flex-shrink:0;
}
.burger span{display:block;width:18px;height:2px;background:var(--paper);border-radius:2px;transition:.2s}
.burger:hover{border-color:var(--aqua)}
.burger:hover span{background:var(--aqua)}
.mobile-menu{
  display:block;position:fixed;top:0;left:0;bottom:0;height:100vh;
  width:80vw;max-width:320px;
  background:rgba(14,17,20,.98);backdrop-filter:blur(16px);
  border-right:1px solid var(--char-3);
  padding:88px 24px 24px;
  transform:translateX(-100%);
  transition:transform .38s cubic-bezier(.22,.68,0,1.2);
  z-index:60;overflow-y:auto;
  box-shadow:24px 0 48px -24px rgba(0,0,0,.5);
}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu a{
  display:block;padding:14px 0;font-size:1.1rem;color:var(--mist);
  border-bottom:1px solid var(--char-3);transition:.2s;
}
.mobile-menu a:last-child{border-bottom:none}
.mobile-menu a:hover{color:var(--aqua)}
.menu-close{
  position:absolute;top:16px;right:16px;
  width:36px;height:36px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  background:var(--char-2);border:1px solid var(--char-3);
  color:var(--paper);font-size:1.2rem;cursor:pointer;line-height:1;
}
.menu-close:hover{border-color:var(--aqua);color:var(--aqua)}
.menu-overlay{
  display:none;position:fixed;inset:0;z-index:59;
  background:rgba(0,0,0,.55);opacity:0;
  transition:opacity .35s ease;
}
.menu-overlay.open{display:block;opacity:1}
@media(min-width:601px) and (max-width:900px){
  .mobile-menu{width:340px;max-width:340px}
}

/* ---------- SECTION SHELL ---------- */
section{padding:78px 0}

/* ---------- CTA + FOOTER ---------- */
footer{background:var(--ink);border-top:1px solid var(--char-3);padding:54px 0 36px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.foot-grid h5{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mist);font-family:'JetBrains Mono';margin-bottom:16px;font-weight:700}
.foot-grid a{display:block;color:var(--mist);font-size:.92rem;padding:5px 0}
.foot-grid a:hover{color:var(--aqua)}
.foot-bot{display:flex;justify-content:space-between;align-items:center;margin-top:40px;padding-top:24px;border-top:1px solid var(--char-3);color:var(--mist);font-size:.84rem;flex-wrap:wrap;gap:12px}

/* ---------- RESPONSIVE (shared) ---------- */
@media(max-width:900px){
  header.nav{position:fixed;left:0;right:0;width:100%}
  body{padding-top:56px}
  .wrap.nav-in{padding:0 16px}
  .nav-in{height:56px;gap:8px}
  .brand{font-size:.98rem;gap:8px;letter-spacing:-.01em}
  .chip{width:29px;height:29px;border-radius:6px}
  .lang-dd-toggle{height:36px;padding:0 10px;font-size:.72rem;gap:5px}
  .nav-links{display:none}
  .burger{display:flex;width:34px;height:34px;flex-shrink:0}
  .nav-cta{padding:9px 16px;font-size:.85rem}
  .foot-grid{grid-template-columns:1fr}
  section{padding:56px 0}
}
@media(max-width:400px){
  .wrap.nav-in{padding:0 12px}
  .nav-in{gap:6px}
  .brand{font-size:.9rem;gap:6px}
  .chip{width:24px;height:24px}
}
@media(max-width:330px){
  .brand-full{display:none}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
:focus-visible{outline:2px solid var(--aqua);outline-offset:3px;border-radius:4px}

/* ---------- LANG DROPDOWN (nav) ---------- */
.lang-dd{position:relative;flex-shrink:0}
.lang-dd-toggle{
  display:flex;align-items:center;gap:7px;
  height:42px;padding:0 13px;border-radius:10px;
  background:var(--char-2);border:1px solid var(--char-3);
  color:var(--paper);cursor:pointer;transition:.2s;
  font-family:'JetBrains Mono',monospace;font-weight:700;font-size:.8rem;letter-spacing:.04em;
}
.lang-dd-toggle:hover,.lang-dd.open .lang-dd-toggle{border-color:var(--aqua)}
.lang-dd-toggle .lang-flag{font-size:.95rem;line-height:1}
.lang-dd-caret{width:9px;height:9px;flex-shrink:0;transition:.2s;color:var(--mist)}
.lang-dd.open .lang-dd-caret{transform:rotate(180deg);color:var(--aqua)}
.lang-dd-menu{
  position:absolute;top:calc(100% + 8px);right:0;min-width:168px;
  background:rgba(14,17,20,.98);backdrop-filter:blur(14px);
  border:1px solid var(--char-3);border-radius:12px;
  box-shadow:0 20px 44px -16px #000;padding:6px;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s;
  z-index:95;
}
.lang-dd.open .lang-dd-menu{opacity:1;visibility:visible;transform:translateY(0)}
.lang-dd-menu button{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:none;border:0;cursor:pointer;color:var(--mist);
  font-family:'Inter',sans-serif;font-size:.9rem;font-weight:500;
  padding:10px 12px;border-radius:8px;transition:.15s;text-align:left;
}
.lang-dd-menu button:hover{background:var(--char-3);color:var(--paper)}
.lang-dd-menu button.active{color:var(--aqua);font-weight:700}
.lang-dd-menu button .lang-check{color:var(--aqua);font-size:.85rem;opacity:0;flex-shrink:0}
.lang-dd-menu button.active .lang-check{opacity:1}
.lang-dd-hint{
  padding:8px 12px 4px;font-size:.68rem;color:var(--slate);
  text-transform:uppercase;letter-spacing:.1em;font-family:'JetBrains Mono',monospace;
}
@media(max-width:520px){
  .lang-dd-toggle{height:38px;padding:0 10px;font-size:.74rem}
  .lang-dd-menu{right:-4px;min-width:150px}
}

/* ---------- ASK CTA (Discord) ---------- */
.ask-cta{
  position:fixed;right:20px;bottom:20px;z-index:90;
  display:flex;align-items:center;gap:11px;
  background:#5865F2;color:#fff;border:0;cursor:pointer;
  padding:14px 20px 14px 16px;border-radius:99px;
  font-family:'Inter',sans-serif;font-weight:700;font-size:.92rem;
  box-shadow:0 16px 36px -12px rgba(88,101,242,.65),0 4px 14px -4px #000;
  transition:.2s;
}
.ask-cta:hover{background:#4752c4;transform:translateY(-2px);box-shadow:0 20px 40px -12px rgba(88,101,242,.75),0 4px 14px -4px #000}
.ask-cta svg{width:22px;height:22px;flex-shrink:0}
.ask-cta-text{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15}
.ask-cta-free{
  font-family:'JetBrains Mono',monospace;font-weight:700;font-size:.62rem;letter-spacing:.08em;
  text-transform:uppercase;color:#c9ceff;
}
.ask-cta-bar{display:none}
@media(max-width:900px){
  .ask-cta{display:none}
  .ask-cta-bar{
    display:flex;align-items:center;gap:12px;
    position:fixed;left:0;right:0;bottom:0;z-index:90;
    background:#5865F2;color:#fff;border:0;cursor:pointer;
    padding:14px 18px calc(14px + env(safe-area-inset-bottom,0px));
    font-family:'Inter',sans-serif;
    box-shadow:0 -10px 30px -10px #000;
    width:100%;
  }
  .ask-cta-bar svg{width:24px;height:24px;flex-shrink:0}
  .ask-cta-bar-txt{flex:1;text-align:left;line-height:1.2}
  .ask-cta-bar-title{font-weight:700;font-size:.94rem}
  .ask-cta-bar-sub{font-size:.72rem;color:#c9ceff;font-family:'JetBrains Mono',monospace;letter-spacing:.04em}
  .ask-cta-bar-arrow{font-size:1.3rem;flex-shrink:0}
  body{padding-bottom:64px}
}

/* ---------- ASK MODAL ---------- */
.ask-modal-overlay{
  display:none;position:fixed;inset:0;z-index:210;
  background:rgba(10,13,15,.88);backdrop-filter:blur(10px);
  align-items:center;justify-content:center;padding:16px;
}
.ask-modal-overlay.open{display:flex}
.ask-modal{
  width:100%;max-width:460px;max-height:90vh;overflow-y:auto;
  background:var(--char-2);border:1px solid var(--char-3);border-radius:18px;
  padding:32px 28px;position:relative;
  box-shadow:0 30px 80px -20px #000;
}
.ask-modal-close{
  position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  background:var(--char-3);border:0;color:var(--paper);font-size:1.1rem;cursor:pointer;line-height:1;
}
.ask-modal-close:hover{background:var(--ink);color:var(--aqua)}
.ask-modal-icon{
  width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:#5865F2;margin-bottom:16px;
}
.ask-modal-icon svg{width:26px;height:26px}
.ask-modal h3{font-family:'Inter',sans-serif;font-weight:800;font-size:1.3rem;letter-spacing:-.01em;margin-bottom:8px}
.ask-modal p.ask-modal-sub{color:var(--mist);font-size:.92rem;margin-bottom:22px;line-height:1.5}
.ask-field{margin-bottom:16px}
.ask-field label{
  display:block;font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--mist);margin-bottom:7px;
}
.ask-field input,.ask-field textarea{
  width:100%;background:var(--ink);border:1px solid var(--char-3);border-radius:10px;
  padding:12px 14px;color:var(--paper);font-family:'Inter',sans-serif;font-size:.94rem;
  transition:.2s;resize:vertical;
}
.ask-field input:focus,.ask-field textarea:focus{outline:0;border-color:#5865F2;box-shadow:0 0 0 3px rgba(88,101,242,.25)}
.ask-field textarea{min-height:96px;line-height:1.5}
.ask-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.ask-submit{
  width:100%;display:flex;align-items:center;justify-content:center;gap:9px;
  background:#5865F2;color:#fff;border:0;cursor:pointer;
  padding:14px;border-radius:10px;font-family:'Inter',sans-serif;font-weight:700;font-size:.96rem;
  transition:.2s;margin-top:6px;
}
.ask-submit:hover{background:#4752c4}
.ask-submit:disabled{opacity:.6;cursor:not-allowed}
.ask-submit svg{width:18px;height:18px}
.ask-modal-note{
  margin-top:14px;text-align:center;font-size:.78rem;color:var(--slate);
  display:flex;align-items:center;justify-content:center;gap:6px;
}
.ask-status{
  display:none;text-align:center;padding:8px 4px 2px;font-size:.88rem;line-height:1.5;
}
.ask-status.show{display:block}
.ask-status.ok{color:#7ee0a4}
.ask-status.err{color:#ff8f7a}

/* ---------- CONTACT MODAL (orange brand) ---------- */
.contact-modal-overlay{
  display:none;position:fixed;inset:0;z-index:210;
  background:rgba(10,13,15,.88);backdrop-filter:blur(10px);
  align-items:center;justify-content:center;padding:16px;
}
.contact-modal-overlay.open{display:flex}
.contact-modal{
  width:100%;max-width:460px;max-height:90vh;overflow-y:auto;
  background:var(--char-2);border:1px solid var(--char-3);border-radius:18px;
  padding:32px 28px;position:relative;
  box-shadow:0 30px 80px -20px #000;
}
.contact-modal-close{
  position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  background:var(--char-3);border:0;color:var(--paper);font-size:1.1rem;cursor:pointer;line-height:1;
}
.contact-modal-close:hover{background:var(--ink);color:var(--aqua)}
.contact-modal-icon{
  width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--aqua);margin-bottom:16px;
  box-shadow:0 10px 24px -10px rgba(255,122,0,.65);
}
.contact-modal-icon svg{width:26px;height:26px}
.contact-modal h3{font-family:'Inter',sans-serif;font-weight:800;font-size:1.3rem;letter-spacing:-.01em;margin-bottom:8px}
.contact-modal p.contact-modal-sub{color:var(--mist);font-size:.92rem;margin-bottom:22px;line-height:1.5}
.contact-field{margin-bottom:16px}
.contact-field label{
  display:block;font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--mist);margin-bottom:7px;
}
.contact-field input,.contact-field textarea{
  width:100%;background:var(--ink);border:1px solid var(--char-3);border-radius:10px;
  padding:12px 14px;color:var(--paper);font-family:'Inter',sans-serif;font-size:.94rem;
  transition:.2s;resize:vertical;
}
.contact-field input:focus,.contact-field textarea:focus{outline:0;border-color:var(--aqua);box-shadow:0 0 0 3px rgba(255,122,0,.25)}
.contact-field textarea{min-height:80px;line-height:1.5}
.contact-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.contact-method-pills{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px;
}
.contact-method-pill{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  padding:12px 8px;border-radius:10px;border:1px solid var(--char-3);
  background:var(--ink);color:var(--mist);cursor:pointer;
  font-family:'Inter',sans-serif;font-weight:600;font-size:.78rem;
  transition:.18s;
}
.contact-method-pill svg{width:18px;height:18px;flex-shrink:0}
.contact-method-pill:hover{border-color:var(--aqua);color:var(--paper)}
.contact-method-pill.active{
  background:var(--aqua);border-color:var(--aqua);color:var(--ink);
  box-shadow:0 8px 20px -10px rgba(255,122,0,.65);
}
.contact-submit{
  width:100%;display:flex;align-items:center;justify-content:center;gap:9px;
  background:var(--aqua);color:var(--ink);border:0;cursor:pointer;
  padding:14px;border-radius:10px;font-family:'Inter',sans-serif;font-weight:700;font-size:.96rem;
  transition:.2s;margin-top:6px;
  box-shadow:0 14px 34px -14px var(--aqua);
}
.contact-submit:hover{background:var(--aqua-2)}
.contact-submit:disabled{opacity:.6;cursor:not-allowed}
.contact-submit svg{width:18px;height:18px}
.contact-modal-note{
  margin-top:14px;text-align:center;font-size:.78rem;color:var(--slate);
  display:flex;align-items:center;justify-content:center;gap:6px;
}
.contact-status{
  display:none;text-align:center;padding:8px 4px 2px;font-size:.88rem;line-height:1.5;
}
.contact-status.show{display:block}
.contact-status.ok{color:#7ee0a4}
.contact-status.err{color:#ff8f7a}