*,:before,:after{box-sizing:border-box}html,body{font-family:var(--font-inter), -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;margin:0;padding:0;overflow-x:hidden}img{max-width:100%;height:auto;display:block}.hero{--btnVolver:#4a54f1;--btnVolverBg:#5b7cff14;--btnVolverBorder:#5b7cff26;--btnVolverBgHover:#5b7cff24;--btnVolverBorderHover:#5b7cff66;--btnVolverShadowHover:#5b7cff2e;--color-brand:#0f376a;--color-brand-shadow:#5b7cff59;--btnSecundarioText:#24292e;--btnSecundarioBg:#00000008;--btnSecundarioBorder:#282d3333;--btnSecundarioBgHover:#00000014;--blob3-color:#e8f2fc;--blob2-color:#0f376a;--blob1-color:#002a49;--card-bg:#111;--card-border:#0000000d;--card-shadow:#0000001f;min-height:100vh;color:var(--text-primary,#222);background-color:#0000;justify-content:center;align-items:center;padding:120px 8% 100px;display:flex;position:relative;overflow-x:hidden}.btn-retro{z-index:100;color:var(--blob2-color);background:var(--blob3-color);letter-spacing:.02em;-webkit-backdrop-filter:blur(10px);box-shadow:0 8px 24px var(--btnVolverBg);border:1px solid #c0d8f6;border-radius:20px;align-items:center;gap:12px;padding:12px 22px;font-size:.95rem;font-weight:600;text-decoration:none;transition:transform .25s,background .25s,box-shadow .25s,border-color .25s;display:inline-flex;position:absolute;top:35px;left:8%}.btn-retro:hover{border-color:#c0d8f6;transform:translateY(-3px)}.btn-retro:active{transform:translateY(0)}.btn-retro .btn-icon{justify-content:center;align-items:center;transition:transform .25s;display:flex}.btn-retro .btn-icon svg{width:20px;height:20px}.btn-retro:hover .btn-icon{transform:translate(-4px)}.hero-background{z-index:0;pointer-events:none;position:absolute;inset:0;overflow:hidden}.blob{filter:blur(130px);opacity:.18;border-radius:50%;position:absolute}.blob1{background:var(--blob1-color);width:min(500px,80vw);height:min(500px,80vw);top:-120px;left:-120px}.blob2{background:var(--blob2-color);width:min(450px,70vw);height:min(450px,70vw);top:120px;right:-100px}.blob3{background:var(--blob3-color);width:min(550px,90vw);height:min(550px,90vw);bottom:-250px;left:40%}.hero-content{z-index:2;grid-template-columns:1.1fr .9fr;align-items:center;gap:50px;width:100%;display:grid;position:relative}.hero-tag{backdrop-filter:blur(15px);letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary,#666);font-size:.85rem;font-family:var(--font-jetbrains-mono), monospace;background:#0000000d;border-radius:50px;margin-bottom:25px;padding:8px 18px;display:inline-flex}.hero h1{font-size:clamp(2.5rem,4.5vw,5rem);font-weight:800;line-height:1.1;font-family:var(--font-baloo-2), cursive, sans-serif;color:var(--color-brand);margin-bottom:25px}.hero h1 span{color:var(--color-brand)}.hero-description{white-space:pre-line;max-width:620px;color:var(--text-secondary,#666);margin-bottom:30px;font-size:clamp(1rem,1.1vw,1.15rem);line-height:1.7}.hero-techs{flex-wrap:wrap;gap:10px;margin-bottom:40px;display:flex}.hero-techs span{font-size:.88rem;font-weight:600;font-family:var(--font-jetbrains-mono), monospace;border-radius:12px;align-items:center;gap:8px;padding:8px 14px;display:inline-flex}.hero-techs span svg{flex-shrink:0;width:16px;height:16px}.tech-html{border:1px solid #e44f2626;color:#b93818!important;background:#e44f2614!important}.tech-css{border:1px solid #1572b626;color:#075a91!important;background:#1572b614!important}.tech-js{border:1px solid #e6b40026;color:#806500!important;background:#e6b40014!important}.tech-firebase{border:1px solid #71350126;color:#221000!important;background:#f57f1714!important}.tech-android{border:1px solid #34c57526;color:#087a43!important;background:#3ddc8414!important}.hero-buttons{flex-wrap:wrap;gap:14px;display:flex}.btn-primary,.btn-secondary{border-radius:14px;justify-content:center;align-items:center;gap:10px;padding:14px 28px;font-size:.95rem;font-weight:600;text-decoration:none;transition:transform .25s,background .25s,box-shadow .25s;display:inline-flex}.btn-primary{background:var(--color-brand);color:#fff}.btn-primary:hover{box-shadow:0 20px 40px var(--color-brand-shadow);transform:translateY(-5px)}.btn-secondary{border:1px solid var(--btnSecundarioBorder);color:var(--btnSecundarioText);background:var(--btnSecundarioBg)}.btn-secondary:hover{background:var(--btnSecundarioBgHover);transform:translateY(-3px)}.btn-primary svg,.btn-secondary svg{flex-shrink:0;width:18px;height:18px}.hero-image{justify-content:center;align-items:center;width:100%;display:flex}.image-card{background:var(--card-bg);width:100%;max-width:550px;box-shadow:0 30px 60px var(--card-shadow);border:1px solid var(--card-border);border-radius:24px;overflow:hidden}.image-card img{object-fit:cover;width:100%;height:auto;display:block}.hero-scroll{z-index:5;flex-direction:column;align-items:center;gap:12px;display:flex;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.hero-scroll span{letter-spacing:.05em;color:var(--text-secondary,#666);font-size:.8rem;font-weight:600}.scroll-indicator{border:2px solid var(--text-secondary,#666);opacity:.5;border-radius:30px;justify-content:center;width:26px;height:44px;display:flex}.scroll-indicator div{background:var(--text-secondary,#666);border-radius:20px;width:4px;height:8px;margin-top:8px;animation:2s infinite scrollAnimation}@keyframes scrollAnimation{0%{opacity:0;transform:translateY(0)}40%{opacity:1}to{opacity:0;transform:translateY(14px)}}.contenedor-secciones{flex-direction:column;gap:100px;width:100%;margin:0 auto;padding:40px 8% 100px;display:flex}.details-section{position:relative}.section-header{text-align:center;max-width:700px;margin:0 auto 50px}.section-badge{color:var(--color-brand,#0f376a);text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;font-weight:700;font-family:var(--font-jetbrains-mono), monospace;background:#e8f2fc;border:1px solid #c0d8f6;border-radius:20px;margin-bottom:12px;padding:6px 16px;display:inline-block}.section-header h2{font-size:clamp(1.8rem,3vw,2.8rem);font-weight:800;font-family:var(--font-baloo-2), cursive, sans-serif;color:var(--text-primary,#222);margin-bottom:10px}.section-subtitle{color:var(--text-secondary,#666);font-size:1.05rem}.justification-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;display:grid}.info-card{backdrop-filter:blur(10px);background:#fff9;border:1px solid #00000014;border-radius:20px;padding:30px;transition:transform .3s,border-color .3s,box-shadow .3s}.descard{white-space:pre-line}.info-card:hover{border-color:var(--color-brand,#0f376a);transform:translateY(-5px);box-shadow:0 15px 35px #5b7cff1a}.card-icon{width:48px;height:48px;color:var(--color-brand,#0f376a);background:#e8f2fc;border:1px solid #c0d8f6;border-radius:14px;justify-content:center;align-items:center;margin-bottom:20px;display:flex}.info-card:nth-of-type(3) svg{width:32px;height:32px}.info-card:nth-of-type(4) svg{width:30px;height:30px}.card-icon svg{width:24px;height:24px}.info-card h3{font-size:1.25rem;font-weight:700;font-family:var(--font-baloo-2), cursive, sans-serif;color:var(--text-primary,#222);margin-bottom:12px}.info-card p{color:var(--text-secondary,#666);font-size:.95rem;line-height:1.6}.funcionalidades{flex-direction:column;gap:35px;width:100%;margin:50px 0;display:flex;position:relative}.funcionalidades:before{content:"";background:linear-gradient(to bottom, transparent, var(--color-brand,#0f376a), transparent);opacity:.5;width:3px;position:absolute;top:20px;bottom:20px;left:50%;transform:translate(-50%)}.funcionalidades-generales,.funcionalidades-web,.funcionalidades-movil{background:#00000005;border:1px solid #0000000f;border-radius:16px;width:45%;padding:24px 28px;transition:transform .3s,border-color .3s;position:relative}.funcionalidades-generales:hover,.funcionalidades-web:hover,.funcionalidades-movil:hover{border-color:var(--color-brand,#0f376a);transform:translateY(-4px)}.funcionalidades-generales{text-align:left;align-self:flex-end}.funcionalidades-web,.funcionalidades-movil{text-align:left;align-self:flex-start}.funcionalidades h3{color:var(--text-primary,#222);font-size:1.15rem;font-weight:700;font-family:var(--font-baloo-2), cursive, sans-serif;margin:0 0 12px}.funcionalidades li{margin:0;padding:0;list-style:none}.funcionalidades ul{color:var(--text-secondary,#666);align-items:center;gap:8px;margin:0;padding:0;font-size:.95rem;line-height:1.6;display:inline-flex}.funcionalidades-web ul:before,.funcionalidades-generales ul:before,.funcionalidades-movil ul:before{content:"";background-color:var(--color-brand,#0f376a);border-radius:50%;flex-shrink:0;width:6px;height:6px;display:inline-block}.ecosystem-container{grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;display:grid}.platform-card{background:#00000005;border:1px solid #00000014;border-radius:24px;padding:35px}.platform-header{align-items:center;gap:16px;margin-bottom:25px;display:flex}.platform-icon{background:var(--color-brand,#e8f2fc);color:#fff;border:1px solid #c0d8f6;border-radius:16px;justify-content:center;align-items:center;width:52px;height:52px;display:flex}.platform-icon svg{color:#0f376a;width:26px;height:26px}.platform-header h3{font-size:1.35rem;font-weight:700;font-family:var(--font-baloo-2), cursive, sans-serif;color:var(--text-primary,#222)}.tech-stack-label{color:var(--text-secondary,#666);font-size:.8rem;font-weight:600;font-family:var(--font-jetbrains-mono), monospace}.feature-list{flex-direction:column;gap:14px;margin:0;padding:0;list-style:none;display:flex}.feature-list li{color:var(--text-secondary,#666);align-items:flex-start;gap:12px;font-size:.95rem;line-height:1.5;display:flex}.feature-list li svg{color:#0f9d58;flex-shrink:0;width:18px;height:18px;margin-top:2px}.hub-connector{flex-direction:row;justify-content:center;align-items:center;gap:10px;display:flex}.hub-line{background:#f57f174d;width:40px;height:2px}.hub-badge{color:#e65100;text-align:center;background:#f57f171a;border:1px solid #f57f1733;border-radius:16px;flex-direction:column;align-items:center;gap:6px;padding:12px 18px;font-size:.75rem;font-weight:700;display:flex}.hub-badge svg{width:24px;height:24px}.docs-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;display:grid}.doc-card{background:#00000005;border:1px solid #00000014;border-radius:20px;flex-direction:column;padding:30px;display:flex;position:relative}.doc-badge{color:var(--text-secondary,#666);font-size:.75rem;font-weight:700;font-family:var(--font-jetbrains-mono), monospace;background:#0000000d;border-radius:8px;align-self:flex-start;margin-bottom:16px;padding:4px 12px}.doc-card h3{font-size:1.25rem;font-weight:700;font-family:var(--font-baloo-2), cursive, sans-serif;color:var(--text-primary,#222);margin-bottom:10px}.doc-card p{color:var(--text-secondary,#666);flex-grow:1;margin-bottom:24px;font-size:.92rem;line-height:1.6}.doc-actions{flex-wrap:wrap;gap:10px;display:flex}.doc-btn{color:#0f376a;background:#e8f2fc;border:1px solid #c0d8f6;border-radius:10px;align-items:center;gap:8px;padding:10px 18px;font-size:.88rem;font-weight:600;text-decoration:none;transition:all .3s;display:inline-flex}.doc-btn:hover{color:#0f376a;background-color:#d8e8fa;transform:translateY(-2px);box-shadow:0 8px 20px #c0d8f6}.doc-btn svg{width:20px;height:20px}.buttongithub{justify-content:center;align-items:center;width:100%;margin-top:24px;display:flex}.btn-github-main{color:#fff;background-color:#24292e;border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:12px 26px;font-size:.95rem;font-weight:600;text-decoration:none;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex;box-shadow:0 4px 12px #0000001a}.btn-github-main svg{flex-shrink:0;width:24px;height:24px;transition:transform .25s}.btn-github-main:hover{color:#fff;background-color:#1a1e22;transform:translateY(-2px);box-shadow:0 8px 20px #0000002e}.btn-github-main:hover svg{transform:scale(1.1)}.btn-github-main:active{transform:translateY(0)}@media (width<=1024px){.hero{padding-top:140px}.hero-content{gap:40px}.ecosystem-container{grid-template-columns:1fr}.hub-connector{flex-direction:row;margin:10px 0}.hub-line{width:40px;height:2px}}@media (width<=900px){.hero{padding:140px 24px 100px}.btn-retro{top:25px;left:24px}.hero-content{text-align:center;grid-template-columns:1fr;gap:40px}.hero-description{margin:0 auto 30px}.hero-techs,.hero-buttons{justify-content:center}.hero-scroll{bottom:20px}.hub-connector{flex-direction:column}.hub-line{width:2px;height:40px}.funcionalidades:before{left:0}.funcionalidades-generales,.funcionalidades-web,.funcionalidades-movil{text-align:left;align-self:stretch;width:100%}}@media (width<=700px){.hero{padding:130px 16px 120px}.btn-retro{padding:10px 18px;font-size:.7rem;top:20px;left:16px}.hero-buttons{flex-direction:column;width:100%}.btn-primary,.btn-secondary{width:100%;padding:14px 20px}.contenedor-secciones{gap:60px;padding-left:5%;padding-right:5%}}
