/* Blog, artículos y páginas legales. Usa la cabecera, el pie y las fuentes de site.css. */
.blog-page main,.legal-page main{padding:56px 0 24px}
.accent{color:#00a8e8}

.blog-hero{margin-bottom:40px}
.blog-hero h1{font-family:Inter,Montserrat,sans-serif;font-size:56px;line-height:1;font-weight:900;margin:0 0 14px}
.blog-hero p{font-size:20px;color:#54595f;margin:0}

.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 30px}
.post-card{display:flex;flex-direction:column}
.post-card-image{display:block;aspect-ratio:3/2;border-radius:16px;overflow:hidden;background:#f4f4f4;margin-bottom:18px}
.post-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.post-card:hover .post-card-image img{transform:scale(1.03)}
.post-category{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue);margin:0 0 8px}
.post-card h2,.post-card h3{font-size:20px;line-height:1.25;margin:0 0 10px}
.post-card h2 a:hover,.post-card h3 a:hover{color:var(--blue)}
.post-card p:not(.post-category){font-size:15px;line-height:1.55;color:#555;margin:0 0 14px}
.post-more{margin-top:auto;font-size:15px;font-weight:600;color:var(--blue)}
.post-more::after{content:' →'}

.article{max-width:800px}
.breadcrumb{display:flex;gap:8px;font-size:14px;color:#777;margin-bottom:22px}
.breadcrumb a{color:var(--blue)}
.article h1{font-family:Inter,Montserrat,sans-serif;font-size:44px;line-height:1.12;font-weight:800;margin:0 0 14px}
.article-date{font-size:15px;color:#777;margin:0 0 34px}
.article-body{font-size:18px;line-height:1.7;color:#333}
.article-body p,.article-body ul,.article-body ol{margin:0 0 22px}
.article-body ul,.article-body ol{padding-left:26px}
.article-body li{margin-bottom:8px}
.article-body h2{font-size:28px;line-height:1.25;color:var(--ink);margin:44px 0 16px}
.article-body strong{color:var(--ink)}
.article-body figure{margin:0 0 32px}
.article-body img{width:100%;height:auto;border-radius:16px}
.article-share{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;border-top:1px solid var(--line);margin-top:44px;padding-top:26px}
.article-share p{font-weight:700;margin:0}
.article-share div{display:flex;flex-wrap:wrap;gap:10px}
.article-share a{border:1px solid var(--line);border-radius:99px;padding:8px 16px;font-size:14px}
.article-share a:hover{border-color:var(--blue);color:var(--blue)}

.related{margin-top:80px}
.related h2{font-family:Inter,Montserrat,sans-serif;font-size:34px;font-weight:800;margin:0 0 32px}

.legal{max-width:860px;font-size:15px;line-height:1.7;color:#333}
.legal h1{font-family:Inter,Montserrat,sans-serif;font-size:44px;line-height:1.1;font-weight:800;color:var(--ink);margin:0 0 30px}
.legal h3{font-size:18px;color:var(--ink);margin:34px 0 12px}
.legal p,.legal ul{margin:0 0 16px}
.legal a{color:var(--blue);text-decoration:underline}

@media(max-width:900px){
  .post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:767px){
  .blog-page main,.legal-page main{padding-top:36px}
  .blog-hero h1{font-size:40px}
  .blog-hero p{font-size:17px}
  .post-grid{grid-template-columns:1fr;gap:36px}
  .article h1,.legal h1{font-size:31px}
  .article-body{font-size:17px}
  .article-body h2{font-size:23px;margin-top:36px}
  .related{margin-top:60px}
  .related h2{font-size:27px}
}