
:root{
  --bg:#070914;--bg2:#0d1021;--panel:rgba(18,23,48,.74);--panel2:#111831;
  --text:#f7f9ff;--muted:#aab4d0;--cyan:#28e6e3;--blue:#4d7cff;--violet:#b96cff;
  --pink:#ff4fa3;--line:rgba(255,255,255,.10);--shadow:0 24px 70px rgba(0,0,0,.35);
  --radius:24px;--max:1180px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:
radial-gradient(circle at 20% -10%,rgba(77,124,255,.22),transparent 32%),
radial-gradient(circle at 95% 10%,rgba(185,108,255,.15),transparent 28%),
linear-gradient(180deg,var(--bg),#080b18 50%,#050711);color:var(--text);
font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65;overflow-x:hidden}
a{color:inherit;text-decoration:none}.container{width:min(var(--max),calc(100% - 38px));margin:auto}
.topbar{font-size:.88rem;text-align:center;padding:8px 16px;background:linear-gradient(90deg,rgba(40,230,227,.16),rgba(185,108,255,.16));border-bottom:1px solid var(--line);color:#dce7ff}
header{position:sticky;top:0;z-index:50;background:rgba(7,9,20,.72);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav{height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:.4px}
.brandmark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:
linear-gradient(135deg,var(--cyan),var(--blue) 55%,var(--violet));color:#031118;box-shadow:0 0 35px rgba(40,230,227,.23);font-weight:1000}
.brand small{display:block;font-size:.62rem;color:var(--muted);font-weight:700;letter-spacing:1.6px}
.navlinks{display:flex;gap:4px;align-items:center}.navlinks a{padding:9px 12px;border-radius:11px;color:#cbd5ef;font-size:.92rem}
.navlinks a:hover,.navlinks a.active{background:rgba(255,255,255,.06);color:white}
.menu{display:none;background:none;border:1px solid var(--line);color:white;border-radius:12px;padding:8px 11px;font-size:1.2rem}
.hero{min-height:78vh;display:grid;align-items:center;padding:78px 0 58px;position:relative}
.grid2{display:grid;grid-template-columns:1.12fr .88fr;gap:50px;align-items:center}
.eyebrow{display:inline-flex;gap:8px;align-items:center;padding:7px 11px;border:1px solid rgba(40,230,227,.28);border-radius:99px;background:rgba(40,230,227,.07);color:#aef9f7;font-size:.82rem;font-weight:800;letter-spacing:.7px;text-transform:uppercase}
h1,h2,h3{line-height:1.08;margin:0 0 18px}h1{font-size:clamp(3rem,7vw,6.7rem);letter-spacing:-.065em}h2{font-size:clamp(2rem,4vw,3.7rem);letter-spacing:-.045em}h3{font-size:1.35rem}
.gradient{background:linear-gradient(90deg,#fff 0%,#98f8f4 30%,#8fa9ff 64%,#df9cff 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:clamp(1.05rem,1.8vw,1.25rem);color:#bac5df;max-width:720px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:14px;font-weight:850;border:1px solid var(--line);transition:.25s}
.btn.primary{background:linear-gradient(135deg,var(--cyan),#45a7ff);color:#06111c;border:none;box-shadow:0 14px 38px rgba(40,230,227,.18)}
.btn:hover{transform:translateY(-2px);filter:brightness(1.07)}.btn.ghost{background:rgba(255,255,255,.045)}
.orbit{height:460px;position:relative;display:grid;place-items:center;perspective:800px}
.core{width:210px;height:210px;border-radius:50%;background:
radial-gradient(circle at 50% 45%,#dfffff 0 5%,#56f8f0 6% 12%,#1a75ff 23%,#142256 43%,#080b19 66%);
box-shadow:0 0 40px rgba(40,230,227,.4),0 0 120px rgba(77,124,255,.3);animation:pulse 4s ease-in-out infinite}
.ring{position:absolute;border:1px solid rgba(137,214,255,.26);border-radius:50%;animation:spin 18s linear infinite}
.r1{width:310px;height:310px}.r2{width:390px;height:190px;transform:rotate(24deg);animation-duration:13s}.r3{width:440px;height:270px;transform:rotate(-20deg);animation-direction:reverse}
.dot{width:12px;height:12px;background:var(--pink);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(152px,-90px);box-shadow:0 0 20px var(--pink)}
@keyframes spin{to{rotate:360deg}}@keyframes pulse{50%{transform:scale(1.045);filter:brightness(1.15)}}
section{padding:86px 0}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:34px}.section-head p{max-width:600px;color:var(--muted);margin:0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{position:relative;background:linear-gradient(180deg,rgba(20,27,55,.83),rgba(11,15,32,.82));border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow);overflow:hidden;transition:.28s}
.card:before{content:"";position:absolute;inset:-1px;background:radial-gradient(420px circle at var(--x,50%) var(--y,50%),rgba(40,230,227,.13),transparent 45%);opacity:0;transition:.2s;pointer-events:none}.card:hover:before{opacity:1}.card:hover{transform:translateY(-5px);border-color:rgba(40,230,227,.23)}
.icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;margin-bottom:28px;font-size:1.35rem;background:rgba(255,255,255,.07);border:1px solid var(--line)}
.card p,.muted{color:var(--muted)}.kicker{color:var(--cyan);text-transform:uppercase;letter-spacing:1.3px;font-weight:900;font-size:.78rem}
.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat{padding:22px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.035)}.stat strong{font-size:1.5rem;display:block}
.feature{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch}.visual{min-height:360px;border-radius:28px;border:1px solid var(--line);background:
linear-gradient(135deg,rgba(40,230,227,.12),rgba(77,124,255,.08),rgba(185,108,255,.13)),#0b1023;position:relative;overflow:hidden}
.visual:after{content:"";position:absolute;width:360px;height:360px;border-radius:50%;right:-80px;bottom:-120px;background:radial-gradient(circle,#60f4ef 0 3%,#2874ff 22%,transparent 58%);filter:blur(3px);opacity:.8}
.visual .tag{position:absolute;z-index:2;left:28px;bottom:28px;background:rgba(6,9,18,.6);border:1px solid var(--line);padding:12px 15px;border-radius:14px;backdrop-filter:blur(10px)}
.content{padding:18px 0}.list{display:grid;gap:13px;margin:24px 0}.list div{display:flex;gap:12px}.check{color:var(--cyan);font-weight:1000}
.banner{padding:34px;border:1px solid rgba(40,230,227,.18);border-radius:28px;background:linear-gradient(105deg,rgba(40,230,227,.10),rgba(185,108,255,.10));display:flex;justify-content:space-between;align-items:center;gap:25px}
.pagehero{padding:82px 0 50px}.pagehero h1{font-size:clamp(2.8rem,6vw,5.3rem)}.prose{max-width:860px}.prose p{color:#c0c9de}.prose h2{margin-top:44px;font-size:2rem}.prose h3{margin-top:30px}
.timeline{display:grid;gap:16px}.timeline .item{display:grid;grid-template-columns:90px 1fr;gap:18px;padding:20px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}.timeline .year{font-weight:900;color:var(--cyan)}
.chips{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0}.chip{padding:8px 11px;border-radius:99px;border:1px solid var(--line);color:#cad3ea;background:rgba(255,255,255,.035);font-size:.86rem}
.filterbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.filter{cursor:pointer;border:1px solid var(--line);background:rgba(255,255,255,.03);color:white;padding:8px 12px;border-radius:99px}.filter.active{background:var(--cyan);color:#061116}
.media-card{min-height:220px;display:flex;flex-direction:column;justify-content:flex-end}.media-card .thumb{height:110px;border-radius:16px;margin-bottom:18px;background:linear-gradient(135deg,rgba(40,230,227,.18),rgba(77,124,255,.14),rgba(185,108,255,.18));display:grid;place-items:center;font-size:2rem}
.wave{height:80px;display:flex;gap:4px;align-items:center;justify-content:center}.wave i{display:block;width:5px;border-radius:9px;background:linear-gradient(var(--cyan),var(--violet));animation:wave 1.2s ease-in-out infinite}.wave i:nth-child(2n){animation-delay:.15s}.wave i:nth-child(3n){animation-delay:.3s}@keyframes wave{0%,100%{height:12px}50%{height:62px}}
.form{display:grid;gap:14px}.form label{font-size:.9rem;color:#c8d2e8}.form input,.form textarea,.form select{width:100%;padding:13px 14px;border-radius:13px;border:1px solid var(--line);background:#0b1020;color:white;outline:none}.form input:focus,.form textarea:focus{border-color:rgba(40,230,227,.55);box-shadow:0 0 0 3px rgba(40,230,227,.08)}textarea{min-height:150px;resize:vertical}
footer{border-top:1px solid var(--line);padding:48px 0 28px;margin-top:50px;background:rgba(1,3,10,.35)}.footergrid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:30px}.footergrid a{display:block;color:var(--muted);margin:7px 0}.footergrid a:hover{color:white}.copyright{margin-top:30px;padding-top:20px;border-top:1px solid var(--line);color:#77829d;font-size:.86rem}
.reveal{opacity:0;transform:translateY(22px);transition:.7s cubic-bezier(.2,.8,.2,1)}.reveal.show{opacity:1;transform:none}.glow{position:fixed;width:360px;height:360px;border-radius:50%;pointer-events:none;z-index:-1;background:radial-gradient(circle,rgba(40,230,227,.06),transparent 65%);transform:translate(-50%,-50%)}
.notice{padding:16px 18px;border-left:3px solid var(--cyan);background:rgba(40,230,227,.06);border-radius:12px;color:#c9d9e8}
@media(max-width:900px){.grid2,.feature{grid-template-columns:1fr}.orbit{height:360px}.cards{grid-template-columns:1fr 1fr}.statgrid{grid-template-columns:1fr 1fr}.navlinks{display:none;position:absolute;top:74px;left:19px;right:19px;padding:12px;background:#0b1020;border:1px solid var(--line);border-radius:18px;flex-direction:column;align-items:stretch}.navlinks.open{display:flex}.menu{display:block}.footergrid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.cards,.statgrid,.footergrid{grid-template-columns:1fr}.hero{padding-top:48px}.orbit{height:300px;scale:.78}.section-head,.banner{align-items:flex-start;flex-direction:column}.timeline .item{grid-template-columns:1fr}.pagehero{padding-top:58px}section{padding:64px 0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}

.image-slot{min-height:250px;border:1px dashed rgba(153,199,255,.42);border-radius:24px;background:linear-gradient(135deg,rgba(40,230,227,.05),rgba(77,124,255,.06),rgba(185,108,255,.05));display:grid;place-items:center;padding:28px;text-align:center}.image-slot strong{display:block;font-size:1.05rem;margin-bottom:6px}.image-slot span{display:block;color:var(--muted);font-size:.9rem}.image-slot .idea{margin-top:12px;color:#aef9f7;font-size:.82rem;text-transform:uppercase;letter-spacing:.7px;font-weight:800}.social-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.social{padding:16px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.035);transition:.22s;display:flex;align-items:center;gap:10px}.social:hover{transform:translateY(-3px);border-color:rgba(40,230,227,.35)}.social small{display:block;color:var(--muted);font-size:.72rem}.linkhub{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.linktile{padding:20px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.03)}.linktile p{color:var(--muted)}.badge-new{display:inline-flex;padding:6px 10px;border-radius:99px;background:rgba(255,79,163,.13);border:1px solid rgba(255,79,163,.26);color:#ffacd2;font-size:.76rem;font-weight:900;text-transform:uppercase}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media(max-width:900px){.social-grid{grid-template-columns:1fr 1fr}.linkhub{grid-template-columns:1fr 1fr}.two-col{grid-template-columns:1fr}}@media(max-width:620px){.social-grid,.linkhub{grid-template-columns:1fr}}

/* Coach de vida */
.coach-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;
border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.045);color:#dce6ff;font-weight:800;font-size:.82rem}
.coach-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.coach-step{padding:22px;border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.coach-step b{display:block;margin-bottom:8px}
@media(max-width:800px){.coach-steps{grid-template-columns:1fr}}

/* Enlaces externos y ecosistema MentoresWorkTrain */
.ecosystem-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.eco-card{padding:22px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.03);display:flex;flex-direction:column;gap:10px}
.eco-card .btn{margin-top:auto}
.external-note{font-size:.82rem;color:var(--muted)}
.podcast-card{display:flex;flex-direction:column;height:100%}
.podcast-card .actions{margin-top:auto}
@media(max-width:1000px){.ecosystem-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.ecosystem-grid{grid-template-columns:1fr}}

/* Identidad visual oficial TODOALEXGAMER */
.brand-logo-img{display:block;width:min(350px,42vw);height:auto;object-fit:contain}
.footer-brand-icon{width:46px;height:46px;object-fit:cover;border-radius:13px;box-shadow:0 0 28px rgba(40,230,227,.18)}
.profile-photo{width:100%;height:100%;min-height:430px;object-fit:cover;object-position:center 38%;border-radius:24px;display:block}
.profile-frame{padding:0;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:#0b1020;box-shadow:var(--shadow)}
.mwt-logo-link{display:flex;align-items:center;justify-content:center;min-height:150px;padding:24px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(40,230,227,.035));transition:.25s;margin-bottom:28px}
.mwt-logo-link:hover{transform:translateY(-3px);border-color:rgba(40,230,227,.34)}
.mwt-logo-link img{width:min(520px,90%);height:auto;display:block}
.mwt-mini{display:flex;align-items:center;justify-content:center;margin:2px 0 10px}
.mwt-mini img{width:min(300px,90%);height:auto;display:block}
@media(max-width:900px){.brand-logo-img{width:min(310px,62vw)}}
@media(max-width:620px){.brand-logo-img{width:min(245px,68vw)}.profile-photo{min-height:330px}}

/* Imagenes finales integradas */
.media-frame{overflow:hidden;border-radius:26px;border:1px solid var(--line);background:#090d1b;box-shadow:var(--shadow)}
.media-frame img{width:100%;height:100%;display:block;object-fit:cover}
.media-frame.hero-img,.media-frame.hero-img img{min-height:360px}
.media-frame.book-cover{min-height:430px}.media-frame.book-cover img{object-fit:contain;max-height:560px;padding:18px}
.media-frame.mockup img,.media-frame.wide img{aspect-ratio:16/9;object-fit:cover}
.media-frame.square img{aspect-ratio:1/1;object-fit:cover}
.podcast-thumb{margin-bottom:18px;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.podcast-thumb img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
@media(max-width:700px){.media-frame.hero-img,.media-frame.hero-img img{min-height:260px}.media-frame.book-cover{min-height:330px}}

/* Ajuste de encuadre: conservar a ALEX visible en portadas */
.focus-right img{
  object-position: right center !important;
}
@media(max-width:700px){
  .focus-right img{
    object-position: 82% center !important;
  }
}

/* Hero principal TODOALEXGAMER */
.hero-main-image{
  position:relative;
  min-height:430px;
  overflow:hidden;
  border-radius:28px;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  background:#050914;
}
.hero-main-image img{
  width:100%;
  height:100%;
  min-height:430px;
  object-fit:cover;
  object-position:72% center;
  display:block;
}
@media(max-width:900px){
  .hero-main-image,.hero-main-image img{min-height:360px}
  .hero-main-image img{object-position:74% center}
}
@media(max-width:620px){
  .hero-main-image,.hero-main-image img{min-height:300px}
  .hero-main-image img{object-position:76% center}
}


/* Agradecimientos: comunidad cosmica */
.community-visual{isolation:isolate;background:
radial-gradient(circle at 50% 48%,rgba(40,230,227,.08),transparent 20%),
radial-gradient(circle at 80% 86%,rgba(77,124,255,.22),transparent 36%),
linear-gradient(135deg,rgba(40,230,227,.08),rgba(77,124,255,.06),rgba(185,108,255,.12)),#091022}
.community-visual:after{opacity:.34;z-index:0}
.community-cosmos{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1}
.community-core-label{position:absolute;left:50%;top:48%;width:84px;height:84px;transform:translate(-50%,-50%);border-radius:50%;z-index:2;pointer-events:none;background:radial-gradient(circle,rgba(234,255,255,.18),rgba(40,230,227,.04) 42%,transparent 72%);filter:drop-shadow(0 0 20px rgba(40,230,227,.2));animation:community-breathe 3.2s ease-in-out infinite}
.community-core-label span{position:absolute;inset:37px;border-radius:50%;background:#eaffff;box-shadow:0 0 11px #eaffff,0 0 26px rgba(40,230,227,.95),0 0 48px rgba(77,124,255,.62)}
@keyframes community-breathe{50%{transform:translate(-50%,-50%) scale(1.08);opacity:.82}}
@media(max-width:620px){.community-visual{min-height:330px}.visual .tag{left:18px;right:18px;bottom:18px}}
@media(prefers-reduced-motion:reduce){.community-core-label{animation:none}}
