*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,sans-serif;line-height:1.6}body.light{background:linear-gradient(to bottom right,#f8fafc,#e0f2fe,#e0e7ff);color:#1e293b}body.dark{background:linear-gradient(to bottom right,#0f172a,#1e293b,#334155);color:#f1f5f9}.nav-header{position:fixed;top:0;left:0;right:0;z-index:50}body.light .nav-header{background:#ffffffd9;border-bottom:1px solid rgba(148,163,184,.3)}body.dark .nav-header{background:#0f172ad9;border-bottom:1px solid rgba(74,85,104,.5)}.nav-container{max-width:1200px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:.5rem 1.5rem;height:64px}body.light .nav-links a{color:#475569}body.dark .nav-links a{color:#cbd5e1}.nav-links a{margin-left:1rem;padding:.5rem 1rem;border-radius:9999px;text-decoration:none;transition:all .3s ease}.nav-links a.active,.nav-links a:hover{box-shadow:0 4px 6px #0000001a}body.light .nav-links a.active,body.light .nav-links a:hover{background-color:#1e293b;color:#fff}body.dark .nav-links a.active,body.dark .nav-links a:hover{background-color:#334155;color:#f1f5f9}body.light .logo{color:#1e293b}body.dark .logo{color:#f1f5f9}.logo{font-weight:700;font-size:1.25rem;text-decoration:none}#hero{min-height:50vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:6rem 1.5rem 1rem}#hero a{display:inline-flex;align-items:center;gap:.5rem;margin-top:1rem;color:#fc4c02;font-weight:600;text-decoration:none;font-size:1.1rem;transition:transform .2s ease,color .2s ease}#hero a:hover{color:#e04000;transform:translateY(-2px)}#hero h1{font-size:3rem;font-weight:700;margin-bottom:1rem}.resumen{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-top:1.5rem;font-weight:600}.resumen div{margin:0 1rem;font-weight:600;border:2px solid currentColor;padding:.25rem .75rem;border-radius:.5rem}.gradient-text{background:linear-gradient(to right,#2563eb,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}body.light #hero p{color:#475569}body.dark #hero p{color:#cbd5e1}.connect-section{max-width:1200px;margin:0 auto 4rem;padding:0 1.5rem}.connect-section h2{font-size:2.25rem;font-weight:700;text-align:center;margin-bottom:.5rem}body.light .connect-section h2{color:#1e293b}body.dark .connect-section h2{color:#f1f5f9}.subtitle{text-align:center;margin-bottom:2rem;opacity:.8}body.light .subtitle{color:#475569}body.dark .subtitle{color:#cbd5e1}.platforms-grid{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:3rem}@media (min-width: 768px){.platforms-grid{grid-template-columns:repeat(2,1fr)}}.platform-card{display:flex;align-items:center;padding:1rem 1.5rem;border-radius:1rem;text-decoration:none;transition:all .2s ease;color:#fff;font-weight:500}.platform-card:hover{transform:translateY(-2px);box-shadow:0 6px 12px #00000026}.platform-icon{margin-right:1rem;display:flex;align-items:center}.platform-info{flex:1;text-align:left}.platform-title{font-weight:600;margin-bottom:.25rem}.platform-desc{font-size:.875rem;opacity:.9}.platform-arrow{font-size:1.25rem;opacity:.8}.github{background:#24292e}.linkedin{background:#0a66c2}.strava{background:#fc4c02}.instagram{background:#e4405f}.youtube{background:red}.chess{background:#28a745}.gaming-section{background:#ffffffb3;border:1px solid rgba(148,163,184,.3);border-radius:1rem;padding:1.5rem;margin-bottom:3rem;box-shadow:0 4px 6px #0000000d}body.dark .gaming-section{background:#0f172ab3;border:1px solid rgba(74,85,104,.5)}.gaming-section h3{font-size:1.25rem;font-weight:700;display:flex;align-items:center;gap:.5rem;margin-bottom:1.5rem}body.light .gaming-section h3{color:#1e293b}body.dark .gaming-section h3{color:#f1f5f9}.games-grid{display:grid;grid-template-columns:1fr;gap:1rem}@media (min-width: 768px){.games-grid{grid-template-columns:repeat(3,1fr)}}.game-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem 1rem;border-radius:1rem;text-decoration:none;font-weight:600;transition:all .2s ease;color:#fff}.game-card:hover{transform:translateY(-2px);box-shadow:0 6px 12px #00000026}.game-icon{font-size:2rem;margin-bottom:.5rem}.clash-royale{background:#00a1ff}.clash-clans{background:#fc0}.brawl-stars{background:#ff6f00}.extra-socials{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:2rem}@media (min-width: 768px){.extra-socials{grid-template-columns:repeat(4,1fr)}}.extra-social{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.25rem .5rem;border-radius:1rem;text-decoration:none;transition:all .2s ease;background:#ffffffb3;border:1px solid rgba(148,163,184,.3);color:#1e293b}body.dark .extra-social{background:#0f172ab3;border:1px solid rgba(74,85,104,.5);color:#f1f5f9}.extra-social:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000001a}.extra-social svg{margin-bottom:.5rem}.portfolio-grid{display:grid;gap:1.5rem;padding:2rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}body.light .portfolio-card{background:#ffffffb3;border:1px solid rgba(148,163,184,.3);color:#1e293b}body.dark .portfolio-card{background:#0f172ab3;border:1px solid rgba(74,85,104,.5);color:#f1f5f9}.portfolio-card{border-radius:12px;padding:1.5rem;text-align:center;transition:transform .2s ease,box-shadow .2s ease}.portfolio-card:hover{transform:translateY(-5px);box-shadow:0 8px 16px #00000026}.portfolio-card h3{font-size:1.5rem;margin-bottom:.5rem}.edition-selector{display:flex;justify-content:center;gap:.5rem;margin-bottom:1rem}.edition-selector button{border:1px solid #fff;background:transparent;color:inherit;padding:.25rem .6rem;border-radius:4px;cursor:pointer;font-size:.85rem;transition:background .2s}.edition-selector button.active{background:#fff3;font-weight:700}body.light .portfolio-card p,body.light .portfolio-card .preview{color:#475569}body.dark .portfolio-card p,body.dark .portfolio-card .preview{color:#cbd5e1}.portfolio-card a{display:flex;align-items:center;font-weight:500;text-decoration:none;transition:all .3s ease}body.light .portfolio-card a{color:#1e293b}body.dark .portfolio-card a{color:#f1f5f9}.portfolio-card a:hover svg{transform:translate(4px)}.portfolio-card svg{margin-left:.5rem;transition:transform .3s ease}.footer{padding:3rem 1.5rem;text-align:center}body.light .footer{background-color:#1e293b;color:#fff}body.dark .footer{background-color:#0f172a;color:#cbd5e1}.footer p{margin-top:.5rem}body.light .footer p{color:#cbd5e1}body.dark .footer p{color:#94a3b8}@media (max-width: 400px){#hero{padding:5rem 1rem 1.5rem}#hero h1{font-size:2.25rem}.resumen{flex-direction:column}.resumen div{margin:.5rem 0;text-align:center;box-sizing:border-box;width:30%;display:flex;place-items:center;justify-content:center}}