:root{--carbon:#0F0F10;--grafito:#222E30;--piedra:#6B6B6E;--niebla:#D9D9DC;--hueso:#F4F4F5;--calma:#BDDFFC;--ambar:#F6C877}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:Inter,system-ui,-apple-system,sans-serif;background:var(--hueso);color:var(--carbon);min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}
a{color:inherit}
.top{display:flex;align-items:center;justify-content:space-between;padding:24px clamp(16px,5vw,56px)}
.marca{display:inline-flex;color:var(--carbon)}
.marca svg{height:34px;width:auto}
.pill{font-size:13px;font-weight:500;color:var(--grafito);background:#fff;border:1px solid var(--niebla);border-radius:999px;padding:7px 14px;display:inline-flex;align-items:center;gap:8px}
.pill i{width:8px;height:8px;border-radius:50%;background:var(--calma);box-shadow:0 0 0 3px rgba(189,223,252,.45);animation:late 2.4s ease-in-out infinite}
@keyframes late{50%{box-shadow:0 0 0 7px rgba(189,223,252,0)}}
.hero{flex:1;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(16px,4vw,64px);max-width:1180px;width:100%;margin:0 auto;padding:clamp(8px,3vw,40px) clamp(16px,5vw,56px) clamp(40px,6vw,80px)}
.texto h1{font-family:"Inter Tight",Inter,sans-serif;font-weight:600;font-size:clamp(44px,7vw,92px);line-height:.98;letter-spacing:-.035em;margin:22px 0 22px}
.texto h1 span{color:var(--piedra);white-space:nowrap}
.texto p{font-size:clamp(17px,1.6vw,20px);line-height:1.55;color:var(--grafito);max-width:30em}
.valores{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px;margin-bottom:0}
.valores li{list-style:none;font-size:14px;font-weight:500;padding:9px 15px;border-radius:999px;background:#fff;border:1px solid var(--niebla)}
.tag{margin-top:30px;font-weight:600;font-size:15px;color:var(--piedra)}
.zalu{position:relative;display:grid;place-items:center;aspect-ratio:1}
.zalu::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 45%,var(--calma) 0%,rgba(189,223,252,.55) 38%,rgba(189,223,252,0) 70%)}
.zalu::after{content:"";position:absolute;bottom:9%;left:30%;right:30%;height:5%;border-radius:50%;background:rgba(15,15,16,.10);filter:blur(10px);animation:sombra 5s ease-in-out infinite}
.zalu img{position:relative;z-index:1;width:118%;max-width:none;margin:-6% -9%;height:auto;animation:flota 5s ease-in-out infinite;filter:drop-shadow(0 24px 30px rgba(34,46,48,.12))}
@keyframes flota{50%{transform:translateY(-14px)}}
@keyframes sombra{50%{transform:scaleX(.85);opacity:.7}}
footer{border-top:1px solid var(--niebla);padding:26px clamp(16px,5vw,56px);display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;justify-content:space-between;font-size:14px;color:var(--piedra)}
footer nav{display:flex;flex-wrap:wrap;gap:8px 22px}
footer nav a{text-decoration:none;color:var(--grafito);font-weight:500}
footer nav a:hover{text-decoration:underline}
.legal{max-width:760px;width:100%;margin:0 auto;padding:24px clamp(16px,5vw,32px) 72px;flex:1}
.legal h1{font-family:"Inter Tight",Inter,sans-serif;font-weight:600;font-size:clamp(34px,5vw,48px);letter-spacing:-.025em;line-height:1.05;margin:12px 0 10px}
.legal .fecha{color:var(--piedra);font-size:14px;margin-bottom:36px}
.legal h2{font-size:19px;font-weight:700;margin:34px 0 10px}
.legal p,.legal li{font-size:16px;line-height:1.65;color:var(--grafito)}
.legal ul{padding-left:22px;margin-top:8px}
.legal li{margin:4px 0}
.volver{display:inline-block;margin-top:8px;font-size:14px;font-weight:500;color:var(--piedra);text-decoration:none}
@media (max-width:860px){.hero{grid-template-columns:1fr;text-align:center}.zalu{order:-1;max-width:380px;width:84%;margin:0 auto}.texto p{margin:0 auto}.valores{justify-content:center}.texto h1{margin-top:14px}.top .pill{display:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}
