:root{--ink:#111111;--ink-2:#333333;--line:#e3ddd3;--line-strong:#d0c9bd;--bg:#f6f4f1;--surface:#ffffff;--yellow:#ffc107;--red:#ff3b30;--maxw:1160px;--radius:20px;--radius-sm:12px;--font-title:"Inter",system-ui,sans-serif;--font-signature:"Playfair Display",Georgia,serif;--ease:cubic-bezier(.16,1,.3,1);--ease-soft:cubic-bezier(.4,0,.2,1)}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *{animation-duration:.01ms !important;transition-duration:.01ms !important} }
body{font-family:var(--font-title);background:var(--bg);color:var(--ink-2);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.kicker{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--red);font-weight:700;margin-bottom:10px}
section{padding:88px 0}

/* Scroll reveal ------------------------------------------------------*/
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease-soft),transform .6s var(--ease-soft)}
.reveal.is-visible{opacity:1;transform:translateY(0)}
.reveal-item{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease-soft),transform .7s var(--ease-soft);transition-delay:calc(var(--i,0) * .09s)}
.reveal-item.is-visible{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){ .reveal-item{transition-delay:0s} }
section h2{font-family:var(--font-title);font-weight:800;font-size:clamp(1.6rem,3.2vw,2.2rem);color:var(--ink);line-height:1.2}

/* Buttons -----------------------------------------------------------*/
.lp-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;border-radius:999px;font-weight:700;font-size:.95rem;font-family:inherit;border:none;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.lp-btn--primary{background:var(--red);color:#fff}
.lp-btn--primary:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(255,59,48,.35)}
.lp-btn--outline{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.lp-btn--outline:hover{background:var(--ink);color:#fff}
.lp-btn--sm{padding:10px 20px;font-size:.85rem}

/* Header --------------------------------------------------------------*/
.site-header{position:sticky;top:0;z-index:100;background:transparent;padding:12px 16px;transition:padding .2s var(--ease)}
.site-header.scrolled{padding:8px 16px}
.header-inner{display:flex;align-items:center;gap:20px;height:58px;background:#fff;border-radius:var(--radius-sm);box-shadow:0 12px 30px rgba(17,17,17,.16);padding:0 20px;max-width:var(--maxw);margin:0 auto;transition:height .2s var(--ease)}
.site-header.scrolled .header-inner{height:52px}
.site-logo{flex-shrink:0}
.site-logo img{height:36px;width:auto}
.site-nav{display:flex;gap:26px;margin-left:12px;margin-right:auto}
.site-nav a{font-size:.9rem;font-weight:600;color:var(--ink-2);transition:color .15s}
.site-nav a:hover,.site-nav a.active{color:var(--red)}
.header-actions{display:flex;align-items:center;gap:10px}
.menu-btn{display:none;background:none;border:none;color:var(--ink);width:40px;height:40px;cursor:pointer}
@media (max-width:820px){
  .site-nav,.header-actions .lp-btn--outline{display:none}
  .menu-btn{display:flex;align-items:center;justify-content:center}
}
.mobile-nav{display:none;position:fixed;inset:104px 0 0 0;background:var(--bg);z-index:99;flex-direction:column;padding:24px;gap:6px;overflow-y:auto}
.mobile-nav.open{display:flex}
.mobile-nav a{padding:14px 6px;font-size:1.05rem;font-weight:700;border-bottom:1px solid var(--line)}

/* Footer ------------------------------------------------------------------*/
.site-footer{padding:56px 0 32px;background:var(--ink);color:rgba(255,255,255,.7)}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
@media (max-width:720px){ .footer-grid{grid-template-columns:1fr;gap:28px} }
.footer-logo img{height:30px;width:auto;filter:brightness(0) invert(1)}
.footer-brand p{margin-top:14px;font-size:.88rem;max-width:34ch;opacity:.8}
.footer-col h4{color:#fff;font-size:.82rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:14px}
.footer-col a{display:block;font-size:.9rem;padding:5px 0;opacity:.8;transition:opacity .15s}
.footer-col a:hover{opacity:1;color:var(--yellow)}
.footer-bottom{margin-top:44px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);font-size:.8rem;opacity:.55;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

/* Blog index — hero + card grid -------------------------------------------*/
.blog-hero{padding:56px 0 8px}
.blog-hero h1{font-family:var(--font-title);font-weight:800;font-size:clamp(2rem,4vw,2.8rem);color:var(--ink);line-height:1.15;letter-spacing:-.01em}
.blog-hero p{margin-top:16px;font-size:1.05rem;color:var(--ink-2);max-width:56ch}
.post-grid{display:grid;gap:28px;margin-top:44px;grid-template-columns:repeat(2,1fr)}
@media (max-width:760px){ .post-grid{grid-template-columns:1fr} }
.post-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.post-card.reveal-item{transition:transform .5s var(--ease-soft),box-shadow .5s var(--ease-soft),opacity .7s var(--ease-soft);transition-delay:calc(var(--i,0) * .09s)}
.post-card:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(17,17,17,.1)}
.post-card-img{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--line)}
.post-card-img img{width:100%;height:100%;object-fit:cover}
.post-card-img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,17,17,0) 40%,rgba(17,17,17,.85) 100%)}
.post-card-img h2{position:absolute;left:22px;right:22px;bottom:18px;z-index:1;color:#fff;font-size:1.15rem;line-height:1.3;font-weight:800}
.post-card-body{padding:20px 26px 28px}
.post-card-body p{font-size:.92rem;opacity:.78;line-height:1.55}
.post-card-meta{margin-top:16px;font-size:.8rem;opacity:.55;display:flex;gap:10px}

/* Post page — cover banner + article body -----------------------------------*/
.post-cover{position:relative;aspect-ratio:21/9;overflow:hidden}
.post-cover img{width:100%;height:100%;object-fit:cover}
.post-cover::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,17,17,.05) 30%,rgba(17,17,17,.88) 100%)}
.post-cover .post-head{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:0 0 32px}
.post-cover .post-head h1{color:#fff;font-family:var(--font-title);font-weight:800;font-size:clamp(1.7rem,3.8vw,2.4rem);line-height:1.2;letter-spacing:-.01em}
.post-cover .post-head .post-meta{margin-top:14px;color:rgba(255,255,255,.75)}
.post-meta{font-size:.85rem;opacity:.6;display:flex;gap:12px}
article.post-body{max-width:720px;margin:0 auto;padding:44px 24px 0}
article.post-body p{font-size:1.05rem;line-height:1.8;color:var(--ink-2)}
article.post-body p + p{margin-top:20px}
article.post-body h2{font-size:1.35rem;color:var(--ink);margin:44px 0 16px;line-height:1.3}
article.post-body h3{font-size:1.1rem;color:var(--ink);margin:32px 0 12px}
article.post-body ul,article.post-body ol{margin:20px 0 20px 22px}
article.post-body li{font-size:1.02rem;line-height:1.75;color:var(--ink-2);margin-bottom:8px}
article.post-body strong{color:var(--ink)}
article.post-body blockquote{margin:28px 0;padding:20px 26px;border-left:3px solid var(--red);background:var(--surface);font-size:1.05rem;font-style:italic;color:var(--ink)}
.post-cta{position:relative;max-width:720px;margin:48px auto 0;padding:44px 30px;text-align:center;border-radius:var(--radius);color:#fff;overflow:hidden;background:linear-gradient(180deg,rgba(17,17,17,.82),rgba(17,17,17,.92)),var(--ink) url("/imagenes/video-cover.jpg") center 15%/cover no-repeat}
article.post-body .post-cta h3{color:#fff;font-size:1.25rem}
article.post-body .post-cta p{color:rgba(255,255,255,.75);margin-top:10px;font-size:.95rem}
.post-cta .lp-btn{margin-top:20px}
.post-footer-nav{max-width:720px;margin:40px auto 0;padding:0 24px}
.post-footer-nav a{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.9rem;color:var(--ink)}