/* ============================================================================
   FRANJA «DEL BLOG» · portada de Marie Antoinette          Jairo 30-oct
   Las 3 últimas notas, en el mismo idioma visual de la página: vino y negro,
   filete de oro, Playfair en los títulos. Nace oculta (hidden) y solo aparece
   si el blog contesta: sin notas no hay franja rota.
   ============================================================================ */
.diario{ padding-block:clamp(56px,9vw,120px); }
.diario[hidden]{ display:none; }
.diario .label{ text-align:center; margin-bottom:12px; }
.diario__grid{
  list-style:none; margin:0 0 clamp(32px,4vw,52px); padding:0;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,2.4vw,32px);
}
.diario__card a{
  display:block; height:100%; padding:12px; border:1px solid var(--line);
  background:linear-gradient(180deg,var(--wine),var(--noir-2));
  transition:border-color .4s var(--ease), transform .4s var(--ease), box-shadow .4s var(--ease);
}
.diario__card a:hover, .diario__card a:focus-visible{
  border-color:var(--line-oro); transform:translateY(-4px); box-shadow:0 18px 44px -24px rgba(201,162,90,.45);
}
.diario__card figure{ margin:0; aspect-ratio:4/3; overflow:hidden; background:var(--carbon); }
.diario__card figure.sin{ background:radial-gradient(circle at 50% 40%,rgba(209,10,109,.35),transparent 60%),var(--carbon); }
.diario__card img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.diario__card a:hover img{ transform:scale(1.05); }
.diario__meta{
  margin:16px 4px 6px; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--oro);
}
.diario__card h3{ margin:0 4px 8px; font-size:clamp(19px,1.7vw,23px); line-height:1.28; color:var(--cream); }
.diario__card p.diario__ex{ margin:0 4px 6px; font-size:14.5px; line-height:1.6; color:var(--cream-2); }
.diario__cta{ text-align:center; margin:0; }
/* Entra suave, sin depender del observador de scroll de la página: ya se ve en reposo. */
@media (prefers-reduced-motion:no-preference){
  .diario__card{ animation:diarioEntra .8s var(--ease) both; }
  .diario__card:nth-child(2){ animation-delay:.12s; }
  .diario__card:nth-child(3){ animation-delay:.24s; }
}
@keyframes diarioEntra{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
@media (max-width:900px){ .diario__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .diario__card:nth-child(3){ display:none; } }
@media (max-width:560px){ .diario__grid{ grid-template-columns:minmax(0,1fr); } .diario__card:nth-child(3){ display:block; } }