
:root{--negro:#121110;--carbon:#1b1918;--papel:#faf7f2;--rojo:#c0272d;--gris:#8a847e;--griscl:#b8b2ac;--hueso:#efeae3}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--negro);color:var(--hueso);font:16px/1.65 'Segoe UI',system-ui,-apple-system,Roboto,Arial,sans-serif}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1100px;margin:0 auto;padding:0 22px}
h2{font-size:clamp(26px,4vw,38px);letter-spacing:.5px;color:#fff;margin-bottom:8px;text-transform:uppercase;font-weight:800}
.kick{display:flex;align-items:center;gap:10px;color:var(--gris);letter-spacing:3px;font-size:12px;font-weight:700;text-transform:uppercase;margin-bottom:10px}
.kick::before{content:"";width:26px;height:3px;background:var(--rojo)}
section{padding:74px 0}
nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:14px 26px;background:linear-gradient(#121110ee,#12111000);backdrop-filter:blur(6px);transition:.3s}
nav.solid{background:#121110f2;box-shadow:0 2px 18px #0009}
nav .logo{font-weight:800;letter-spacing:2px;font-size:18px;text-decoration:none;display:flex;align-items:center;gap:9px}
nav .logo b{color:var(--rojo)}
nav ul{display:flex;gap:22px;list-style:none;align-items:center}
nav a{text-decoration:none;font-size:13.5px;letter-spacing:1px;text-transform:uppercase;opacity:.85}
nav a:hover{color:#fff;opacity:1}
.langs{display:flex;gap:8px;margin-left:14px}
.langs a{border:1px solid #444;padding:3px 8px;border-radius:3px;font-size:12px}
.langs a.on{background:var(--rojo);border-color:var(--rojo);color:#fff}
#burger{display:none;background:none;border:0;color:#fff;font-size:26px}
.hero{position:relative;height:100svh;min-height:560px;display:flex;align-items:flex-end;overflow:hidden}
.hero video,.hero img.fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#12111066 0%,#12111022 40%,#121110 96%)}
.hero .inner{position:relative;z-index:2;padding-bottom:9vh;width:100%}
.hero h1{font-size:clamp(46px,9vw,104px);line-height:.95;color:#fff;letter-spacing:2px;font-weight:900}
.hero .tag{color:var(--rojo);letter-spacing:6px;font-weight:800;margin:14px 0 6px;font-size:clamp(13px,2vw,18px)}
.hero .sub{color:var(--griscl);max-width:640px}
.cta{display:inline-block;margin:22px 14px 0 0;padding:13px 26px;border-radius:3px;text-decoration:none;font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:13.5px}
.cta.red{background:var(--rojo);color:#fff}
.cta.ghost{border:1.5px solid #fff5;color:#fff}
.cta:hover{filter:brightness(1.15)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#2a2726;border-top:3px solid var(--rojo)}
.stats div{background:var(--carbon);padding:28px 16px;text-align:center}
.stats b{display:block;font-size:clamp(28px,4vw,44px);color:#fff;font-weight:900}
.stats span{color:var(--gris);font-size:13px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-top:26px}
.card{background:var(--carbon);border-top:3px solid var(--rojo);padding:26px}
.card h3{color:#fff;margin-bottom:10px;font-size:19px}
.card p{color:var(--griscl);font-size:14.5px}
.note{background:var(--carbon);border-left:3px solid var(--rojo);padding:18px 22px;margin-top:26px;color:var(--griscl);font-size:15px}
.note b{color:#fff}
.viral{background:var(--carbon);border-top:3px solid var(--rojo);padding:40px;margin-bottom:34px;display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}
.viral .num{font-size:clamp(52px,7vw,84px);font-weight:900;color:var(--rojo);line-height:1}
.viral p{color:var(--griscl);margin:10px 0 16px}
.viral blockquote{font-style:italic;color:#fff;border-left:3px solid var(--rojo);padding-left:14px;margin:12px 0 4px;font-size:15px}
.viral cite{color:var(--gris);font-size:13px;font-style:normal}
.videos{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.videos .v{background:var(--carbon);padding:0 0 12px}
.videos .frame{aspect-ratio:16/9;width:100%;border:0}
.videos h3{font-size:15px;color:var(--griscl);padding:12px 14px 0}
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.gal a{display:block;aspect-ratio:1;overflow:hidden;background:#000}
.gal img{width:100%;height:100%;object-fit:cover;transition:.35s;opacity:.92}
.gal a:hover img{transform:scale(1.06);opacity:1}
#lb{position:fixed;inset:0;background:#000e;z-index:99;display:none;align-items:center;justify-content:center;padding:30px}
#lb.on{display:flex}
#lb img{max-width:94vw;max-height:92vh;object-fit:contain}
#lb button{position:absolute;top:18px;right:24px;font-size:34px;background:none;border:0;color:#fff;cursor:pointer}
.tray{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;margin-top:22px}
.tray h3{color:#fff;font-size:16px;margin-bottom:6px;border-bottom:2px solid var(--rojo);display:inline-block;padding-bottom:3px}
.tray p{color:var(--gris);font-size:13.5px}
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-top:24px}
.quotes .q{background:var(--carbon);padding:24px;border-top:3px solid var(--rojo)}
.quotes .q p{font-style:italic;color:#fff;font-size:15px}
.quotes .q span{display:block;margin-top:12px;color:var(--gris);font-size:13px}
.dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-top:24px}
.dl a{display:flex;align-items:center;gap:12px;background:var(--carbon);padding:16px 18px;text-decoration:none;border-left:3px solid var(--rojo);font-size:14.5px;color:var(--hueso)}
.dl a:hover{background:#242120;color:#fff}
.dl a::before{content:"⬇";color:var(--rojo);font-size:17px}
.contact{background:var(--carbon);border-top:3px solid var(--rojo);padding:46px;text-align:center}
.contact h2{margin-bottom:4px}
.contact p{color:var(--gris)}
.contact .big{font-size:clamp(20px,3.4vw,30px);font-weight:800;margin:18px 0 4px}
.contact .big a{color:#fff;text-decoration:none;border-bottom:2px solid var(--rojo)}
.contact .tel{font-size:19px;color:var(--griscl);margin-bottom:18px}
.soc a{color:var(--griscl);text-decoration:none;margin:0 10px;font-size:14.5px}
.soc a:hover{color:#fff}
footer{padding:30px 0 40px;text-align:center;color:#57524e;font-size:13px}
@media(max-width:840px){
 nav ul{position:fixed;inset:0;background:#121110f8;flex-direction:column;justify-content:center;display:none}
 nav ul.open{display:flex}
 #burger{display:block;z-index:60}
 .viral{grid-template-columns:1fr;padding:26px}
 .stats{grid-template-columns:repeat(2,1fr)}
 section{padding:54px 0}
}
