/* blog */
.posts{display:grid; grid-template-columns:repeat(3,1fr); gap:30px}
.post{display:flex; flex-direction:column}
.post .ph{background:var(--foto); border:1px solid var(--tinta); aspect-ratio:4/3; overflow:hidden}
.post .ph img{width:100%; height:100%; object-fit:cover; filter:grayscale(.35) contrast(1.05);
  transition:transform .45s cubic-bezier(.2,.7,.3,1), filter .45s}
.post:hover{opacity:1}
.post:hover .ph img{transform:scale(1.06); filter:grayscale(0) contrast(1.08)}
.post .date{font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gris); padding-top:14px}
.post h3{font-family:'Anton',Impact,sans-serif; font-size:25px; text-transform:uppercase; line-height:1.02;
  padding-top:8px; font-weight:400; transition:color .22s}
.post:hover h3{color:var(--rojo)}
.post p{font-size:15px; line-height:1.6; color:#4a443a; padding-top:10px}
.post .more{font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--rojo); padding-top:12px}
@media (prefers-reduced-motion:reduce){.post .ph img{transition:none}.post:hover .ph img{transform:none}}

.posthead{display:grid; grid-template-columns:1.15fr .85fr; border-bottom:1px solid var(--tinta)}
.posthead .ph{background:var(--foto); border-right:1px solid var(--tinta); min-height:440px; overflow:hidden}
.posthead .ph img{width:100%; height:100%; object-fit:cover; filter:grayscale(.3) contrast(1.05)}
.posthead .tx{padding:44px 34px; display:flex; flex-direction:column; gap:18px; justify-content:center}
.posthead h1{font-family:'Anton',Impact,sans-serif; font-size:44px; text-transform:uppercase; line-height:.96}
.posthead .meta{font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--gris)}
.posthead .sum{font-family:'Source Serif 4',Georgia,serif; font-size:20px; line-height:1.5; color:#3a352d}

.article{max-width:74ch; padding:56px 44px 20px}
.article h2{font-family:'Anton',Impact,sans-serif; font-size:30px; text-transform:uppercase; line-height:1; margin:46px 0 14px}
.article h2:first-child{margin-top:0}
.article h3{font-family:'Source Serif 4',Georgia,serif; font-size:22px; font-weight:600; margin:32px 0 10px}
.article p{font-size:17px; line-height:1.75; color:#332f28; margin-bottom:16px}
.article ul{list-style:disc; padding-left:22px; margin-bottom:16px}
.article li{font-size:17px; line-height:1.7; color:#332f28; margin-bottom:8px}
.article a{color:var(--rojo); border-bottom:1px solid var(--linea)}
.article a:hover{opacity:1; border-color:var(--rojo)}
.article .cierre{font-family:'Source Serif 4',Georgia,serif; font-size:20px; color:var(--rojo)}
.article .rel{border-top:1px solid var(--tinta); margin-top:46px; padding-top:22px; display:flex; flex-direction:column; gap:12px}
.article .rel b{font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--gris); font-weight:400}
.article .rel a{font-family:'Source Serif 4',Georgia,serif; font-size:19px; border:0}
.article .rel a:hover{opacity:1; color:var(--rojo)}
@media (max-width:1024px){
  .posts{grid-template-columns:repeat(2,1fr)}
  .posthead{grid-template-columns:1fr}
  .posthead .ph{border-right:0; border-bottom:1px solid var(--tinta); min-height:300px}
}
@media (max-width:720px){
  .posts{grid-template-columns:1fr; gap:26px}
  .posthead h1{font-size:31px}
  .posthead .tx{padding:26px 20px}
  .article{padding:34px 20px 20px}
  .article h2{font-size:24px}
  .article p,.article li{font-size:16px}
}