:root { 
    --bg:#FFFFFF; 
    --text:#0A0A0A; 
    --accent:#F36F21; 
    --accent-blue:#1B3A6B; 
    --border:#E5E5E5; 
    --gray:#F5F5F5; 
    --nav-height:72px; 
}

*{margin:0;padding:0;box-sizing:border-box} 
html{scroll-behavior:smooth}

body{
    background:var(--bg);
    color:var(--text);
    font-family:'Satoshi',sans-serif;
    overflow-x:hidden;
    padding-top:var(--nav-height);
    line-height:1.6
}

h1,h2,h3,h4{
    font-family:'Clash Display',sans-serif;
    font-weight:700;
    letter-spacing:-0.02em
}

.container{width:90%;max-width:1240px;margin:0 auto} 
.accent{color:var(--accent)}

/* NAV V2 - FIX DEFINITIVO */
.nav{
    position:fixed;
    width:100%;
    top:0;
    height:var(--nav-height);
    background:#FFFFFF;
    border-bottom:1px solid var(--border);
    z-index:1000
}

.nav .container{
    display:flex;
    justify-content:space-between;
    align-items:center;
    height:100%
}

.logo img{height:42px;width:auto;flex-shrink:0;display:block}
.nav-links{display:flex;gap:32px;align-items:center;flex-shrink:0}
.nav-links a{color:var(--text);text-decoration:none;font-weight:500;font-size:15px;white-space:nowrap;transition:color 0.2s}
.nav-links a:hover{color:var(--accent)}
.nav-cta{background:var(--accent);color:white!important;padding:10px 20px;border-radius:4px;font-weight:700}
.nav-cta:hover{background:#E05F15}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.hamburger span{width:24px;height:2px;background:var(--text);display:block}

/* HERO - LOGO + HACES + 4 RECUADROS */
.hero{min-height:300vh;position:relative}
.hero-sticky{position:sticky;top:var(--nav-height);height:calc(100vh - var(--nav-height));display:flex;align-items:center;justify-content:center;overflow:hidden}
.animacion-container{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.logo-centro{width:240px;height:auto;position:absolute;left:8%;top:50%;transform:translateY(-50%);z-index:10}
.haz{
    position:absolute;
    height:3px;
    background:var(--accent);
    transform-origin:left center;
    opacity:0;
    z-index:5
}
.punto-animado{
    position:absolute;
    width:10px;
    height:10px;
    background:var(--accent);
    border-radius:50%;
    opacity:0;
    z-index:6;
    box-shadow:0 0 16px var(--accent), 0 0 4px var(--accent)
}
.csre-grid{position:absolute;width:100%;height:100%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:80px;padding:100px 8% 100px 45%;pointer-events:none}
.csre-box{border:3px solid var(--accent-blue);background:white;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;opacity:0;transform:scale(0.8);width:160px;height:160px;justify-self:center;align-self:center}
.csre-letra{font-size:52px;font-weight:700;color:var(--accent-blue);font-family:'Clash Display';line-height:1}
.csre-palabra{font-size:15px;font-weight:700;margin-top:8px;text-align:center}
.hero-content{text-align:center;opacity:0;position:absolute;width:100%;max-width:800px;z-index:20;padding:0 20px}
.hero-title{font-size:clamp(42px,8vw,88px);line-height:0.95;margin-bottom:24px}
.hero-sub{font-size:20px;margin-bottom:40px;opacity:0.7;max-width:600px;margin-left:auto;margin-right:auto}
.cta-primary{display:inline-block;background:var(--accent);color:white;padding:18px 36px;text-decoration:none;font-weight:700;border-radius:4px;font-size:16px;transition:all 0.2s}
.cta-primary:hover{background:#E05F15;transform:translateY(-2px)}

.mobile-hero{display:none;padding:80px 0;text-align:center;background:white}
.logo-centro-mobile{width:220px;margin:0 auto 50px;display:block}
.mobile-csre{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:400px;margin:0 auto 50px}
.csre-box-mobile{border:3px solid var(--accent-blue);background:white;padding:24px;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center}

/* SECCIONES V2 */
.manifiesto{padding:120px 0;background:white;border-top:1px solid var(--border)}
.manifiesto-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:start}
.manifiesto-label{font-size:13px;letter-spacing:0.15em;text-transform:uppercase;opacity:0.5;font-weight:700;margin-bottom:24px;display:block}
.manifiesto h2{font-size:clamp(36px,5vw,56px);line-height:1;margin-bottom:32px}
.manifiesto p{font-size:18px;opacity:0.8;margin-bottom:20px}
.manifiesto-list{list-style:none;margin-top:32px}
.manifiesto-list li{padding:16px 0;border-bottom:1px solid var(--border);font-weight:500;display:flex;gap:16px}
.manifiesto-list li span{color:var(--accent);font-weight:700}

.metodo{padding:120px 0;background:var(--gray)}
.section-header{text-align:center;max-width:700px;margin:0 auto 80px}
.section-title{font-size:clamp(36px,6vw,64px);line-height:0.95;margin-bottom:20px}
.section-sub{font-size:18px;opacity:0.6}
.metodo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.metodo-card{background:white;border:1px solid var(--border);padding:40px;border-radius:8px;transition:all 0.3s}
.metodo-card:hover{border-color:var(--text);transform:translateY(-4px)}
.metodo-num{font-family:'Clash Display';font-size:14px;color:var(--accent);font-weight:700;margin-bottom:16px;display:block}
.metodo-card h3{font-size:26px;margin-bottom:16px;line-height:1.1}
.metodo-card p{opacity:0.7;font-size:16px}
.metodo-card ul{list-style:none;margin-top:24px}
.metodo-card ul li{font-size:14px;padding:6px 0;opacity:0.6;display:flex;gap:8px}
.metodo-card ul li::before{content:"→";color:var(--accent)}

.campo-batalla{padding:120px 0;background:white}
.batalla-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:20px}
.batalla-card{border:1px solid var(--border);padding:40px;border-radius:8px;background:white}
.batalla-card h4{font-size:20px;margin-bottom:12px}
.batalla-card p{font-size:15px;opacity:0.7;margin-bottom:24px;line-height:1.6}
.batalla-tag{display:inline-block;background:var(--gray);padding:4px 10px;border-radius:20px;font-size:12px;font-weight:700}
.batalla-no{margin-top:80px;padding:32px;background:#0A0A0A;color:white;border-radius:8px;text-align:center}

.cta-section{padding:140px 0;background:#0A0A0A;color:white;text-align:center;position:relative;overflow:hidden}
.cta-section::before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at center, rgba(243,111,33,0.15) 0%, transparent 50%);pointer-events:none}
.cta-section .container{position:relative;z-index:2}
.cta-section h2{font-size:clamp(40px,7vw,72px);line-height:0.9;margin-bottom:20px;color:white}
.cta-section p{font-size:20px;margin-bottom:40px;opacity:0.7;color:white;max-width:600px;margin-left:auto;margin-right:auto}
.cta-nota{font-size:13px!important;opacity:0.4!important;margin-top:20px!important}

.footer{padding:80px 0 40px;border-top:1px solid var(--border);background:white}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px;margin-bottom:60px}
.footer-col h4{margin-bottom:20px;font-size:14px;letter-spacing:0.1em;text-transform:uppercase}
.footer-col a{display:block;color:var(--text);text-decoration:none;opacity:0.6;margin-bottom:10px;font-size:15px}
.footer-col a:hover{opacity:1}
.footer-col p{opacity:0.6;font-size:15px;line-height:1.6}
.copyright{text-align:center;opacity:0.4;font-size:13px;padding-top:40px;border-top:1px solid var(--border);display:flex;justify-content:space-between}

@media (max-width:1024px){.csre-grid{padding:80px 5% 80px 40%;gap:40px}.logo-centro{left:5%;width:200px}.manifiesto-grid{grid-template-columns:1fr;gap:40px}.metodo-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:768px){
    :root{--nav-height:60px}
    .nav-links{display:none;position:absolute;top:var(--nav-height);left:0;width:100%;background:white;flex-direction:column;padding:24px;border-bottom:1px solid var(--border);gap:20px;align-items:flex-start}
    .nav-links.active{display:flex}.hamburger{display:flex}.logo img{height:36px}
    .hero{display:none}.mobile-hero{display:block}
    .metodo-grid{grid-template-columns:1fr}.batalla-grid{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr;text-align:left}
    .copyright{flex-direction:column;gap:10px}
}