/* ─────────────────────────────────────────
   HISTORIAS.CSS — ConservasDeNavarra.org
   Artículos largos / narrativa editorial.
   Carga tras base.css. No duplica tokens.
───────────────────────────────────────── */

/* HERO */
.hist-hero{
  background:var(--os);
  padding:7rem 2.5rem 6rem;
  display:grid;grid-template-columns:1fr 1fr;
  gap:8rem;align-items:end;
  position:relative;overflow:hidden;
}
.hist-hero-left{position:relative;z-index:2;}
.hist-seccion{
  font-size:13px;letter-spacing:0.25em;text-transform:uppercase;
  color:rgba(196,176,124,0.72);margin-bottom:1.5rem;display:block;
  font-weight:400;
}
.hist-h1{
  font-family:'Cormorant Garamond',serif;
  font-size:68px;font-weight:300;line-height:0.88;
  color:var(--c);letter-spacing:-0.03em;margin-bottom:2rem;
}
.hist-h1 em{font-style:italic;color:rgba(196,176,124,0.72);}
.hist-rule{width:28px;height:1px;background:rgba(196,176,124,0.25);margin-bottom:2rem;}
.hist-deck{
  font-family:'Cormorant Garamond',serif;
  font-size:20px;font-weight:300;font-style:italic;
  color:rgba(245,237,224,0.88);line-height:1.6;max-width:460px;
}

/* índice lateral */
.hist-indice{
  position:relative;z-index:2;
  border-left:0.5px solid rgba(196,176,124,0.12);
  padding-left:2.5rem;
}
.hist-indice-label{
  font-size:11px;letter-spacing:0.2em;text-transform:uppercase;
  color:rgba(196,176,124,0.42);margin-bottom:1.25rem;display:block;
}
.hist-indice a{
  display:block;
  font-size:15px;color:rgba(245,237,224,0.65);
  padding:0.5rem 0;
  border-bottom:0.5px solid rgba(196,176,124,0.06);
  transition:color 0.2s;
}
.hist-indice a:hover{color:rgba(245,237,224,0.95);}
.hist-indice a:last-child{border-bottom:none;}

/* CUERPO */
.hist-body{
  max-width:740px;margin:0 auto;
  padding:5rem 2.5rem;
}

/* apertura */
.hist-apertura{
  font-family:'Cormorant Garamond',serif;
  font-size:24px;font-weight:300;font-style:italic;
  color:var(--t);line-height:1.58;
  border-left:2px solid var(--e);
  padding-left:1.75rem;margin-bottom:3rem;
}

/* párrafo cuerpo */
.hist-p{
  font-size:18px;color:var(--g);font-weight:400;
  line-height:1.90;margin-bottom:1.6rem;
}
.hist-p strong{color:var(--o);font-weight:500;}
.hist-p em{font-style:italic;}

/* sección interna */
.hist-section{
  padding:3.5rem 0;
  border-top:0.5px solid rgba(122,92,58,0.1);
  margin-top:1rem;
}
.hist-section:first-of-type{border-top:none;padding-top:0;}

.hist-h2{
  font-family:'Cormorant Garamond',serif;
  font-size:38px;font-weight:300;color:var(--o);
  line-height:1.05;margin-bottom:1.75rem;
}
.hist-h2 em{font-style:italic;color:var(--t);}

/* pull quote */
.hist-pull{
  font-family:'Cormorant Garamond',serif;
  font-size:26px;font-weight:300;font-style:italic;
  color:var(--t);line-height:1.45;
  padding:2rem 2.5rem;
  background:var(--cw);
  border-left:3px solid var(--e);
  margin:2.5rem 0;
}

/* dato destacado */
.hist-dato{
  background:var(--os);
  padding:2rem 2.5rem;
  margin:2.5rem 0;
}
.hist-dato-n{
  font-family:'Cormorant Garamond',serif;
  font-size:52px;font-weight:300;
  color:rgba(196,176,124,0.65);line-height:1;
  margin-bottom:0.5rem;
}
.hist-dato-txt{
  font-size:15px;color:rgba(245,237,224,0.82);
  font-weight:400;line-height:1.65;
}

/* cierre editorial */
.hist-cierre{
  padding:3rem 0 0;
  border-top:0.5px solid rgba(122,92,58,0.1);
  margin-top:2rem;
}
.hist-cierre-titulo{
  font-family:'Cormorant Garamond',serif;
  font-size:28px;font-weight:300;color:var(--o);
  margin-bottom:1.5rem;
}
.hist-cierre-titulo em{font-style:italic;color:var(--t);}

/* relacionados */
.hist-relacionados{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1px;background:var(--cw);
  margin-top:3rem;
}
.hist-rel{
  background:var(--w);padding:2rem;
  display:flex;flex-direction:column;gap:0.5rem;
}
.hist-rel-tipo{
  font-size:11px;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--tl);font-weight:400;
}
.hist-rel-title{
  font-family:'Cormorant Garamond',serif;
  font-size:20px;font-weight:400;color:var(--o);
}
.hist-rel-cta{
  font-size:12px;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--t);margin-top:0.5rem;
  border-bottom:0.5px solid rgba(122,92,58,0.25);
  padding-bottom:2px;width:fit-content;
  transition:color 0.2s;
}
.hist-rel-cta:hover{color:var(--o);}

/* instagram */
.hist-instagram{
  background:var(--cw);
  padding:2.5rem 3rem;margin-top:3rem;
}
.hist-ig-ey{
  font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--tl);margin-bottom:1.5rem;font-weight:400;
}
.hist-ig-caption{font-size:16px;color:var(--o);font-weight:400;line-height:1.72;margin-bottom:1.25rem;}
.hist-ig-frase{
  font-family:'Cormorant Garamond',serif;
  font-size:21px;font-style:italic;font-weight:300;
  color:var(--t);border-left:2px solid var(--e);
  padding-left:1.25rem;margin-bottom:1.25rem;line-height:1.45;
}
.hist-ig-ideas{font-size:14px;color:var(--g);font-weight:400;line-height:1.7;}
.hist-ig-ideas li{padding:0.35rem 0;list-style:none;padding-left:1rem;position:relative;}
.hist-ig-ideas li::before{content:'—';position:absolute;left:0;color:var(--tl);}

/* índice de historias */
.historias-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--cw);
}
.hcard{background:var(--w);display:flex;flex-direction:column;text-decoration:none;transition:background 0.2s;}
.hcard:hover{background:var(--c);}
.hcard-foto{width:100%;height:260px;background:var(--os);overflow:hidden;position:relative;}
.hcard-foto img{width:100%;height:100%;object-fit:cover;}
.hcard-body{padding:2rem;display:flex;flex-direction:column;flex:1;}
.hcard-tipo{font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--tl);margin-bottom:0.5rem;}
.hcard-title{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:400;color:var(--o);margin-bottom:0.65rem;line-height:1.1;}
.hcard-desc{font-size:15px;color:var(--g);font-weight:400;line-height:1.65;flex:1;margin-bottom:1.25rem;}
.hcard-cta{font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--t);}

/* RESPONSIVE */
@media(max-width:1024px){
  .hist-hero{grid-template-columns:1fr;gap:3.5rem;padding:4rem 1.5rem 3.5rem;}
  .hist-h1{font-size:48px;}
  .hist-indice{border-left:none;padding-left:0;border-top:0.5px solid rgba(196,176,124,0.1);padding-top:1.5rem;}
  .historias-grid{grid-template-columns:1fr 1fr;}
  .hist-relacionados{grid-template-columns:1fr;}
}
@media(max-width:768px){
  .hist-body{padding:3rem 1.25rem;}
  .hist-h1{font-size:38px;}
  .hist-h2{font-size:30px;}
  .hist-pull{padding:1.5rem;}
  .hist-dato{padding:1.5rem;}
  .hist-instagram{padding:2rem 1.5rem;}
  .historias-grid{grid-template-columns:1fr;}
}
