/* Estilos principales para la web "le magocloud" */
:root{
    --bg-1: #0f172a; /* azul oscuro */
    --bg-2: #0b1220; /* degradado */
    --card: rgba(255,255,255,0.05);
    --accent: #9b5cff;
    --muted: #cbd5e1;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    color: #e6edf3;
    background: linear-gradient(180deg,var(--bg-1),var(--bg-2));
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    line-height:1.45;
}

.container{max-width:1000px;margin:0 auto;padding:32px}

.site-header{padding:28px 0;border-bottom:1px solid rgba(255,255,255,0.04)}
.header-inner{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.site-header h1{font-size:28px;letter-spacing:0.5px}
.site-header .tagline{color:var(--muted);font-size:14px}

.hero{display:grid;grid-template-columns:1fr 320px;gap:28px;align-items:center;padding:48px 0}
.hero-content h2{font-size:22px;margin-bottom:8px;color:#fff}
.lead{color:var(--muted);margin-bottom:18px}

.links ul{list-style:none;display:flex;gap:12px}
.links a{display:inline-block;padding:10px 14px;border-radius:10px;background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02));color:#fff;text-decoration:none;transition:transform .12s ease,box-shadow .12s ease}
.links a:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,0.45)}

.hero-image{display:flex;justify-content:center}
.hero-image img{width:100%;max-width:320px;border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,0.6);border:1px solid rgba(255,255,255,0.03)}

/* Small screens */
@media (max-width:800px){
    .hero{grid-template-columns:1fr;gap:18px}
    .hero-image{order:-1}
    .header-inner{align-items:center;text-align:center}
}

/* Accessibility helpers */
a:focus{outline:2px solid var(--accent);outline-offset:2px}

/* Little card feel for main */
main{background:transparent}

/* Footer styles (if added later) */
footer{color:var(--muted);font-size:13px;padding:28px 0;text-align:center}