/* ═══ HISTORIA ═══ */
.h-hero {
  position:relative; min-height:70vh; overflow:hidden;
  display:flex; align-items:center; padding-top:var(--nav-h);
}
.h-sky { position:absolute; inset:0; background:linear-gradient(180deg,#a0d0f0 0%,#c8e8f8 40%,#d0e8c8 80%,#a8d090 100%); }
.h-hero-content { position:relative; z-index:10; padding:4rem 2rem 10rem 5%; max-width:540px; }
.h-kicker { font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:.8rem; }
.h-title { font-family:var(--serif); font-size:clamp(2.8rem,7vw,5rem); font-weight:300; line-height:1.05; color:var(--ink); margin-bottom:1rem; }
.h-title em { color:var(--teal); font-weight:400; }
.h-sub { font-family:var(--serif); font-size:1.05rem; font-style:italic; color:var(--ink-soft); line-height:1.7; }
.h-hero-photo {
  position:absolute; right:6%; bottom:100px; z-index:10;
  width:clamp(180px,26vw,300px); aspect-ratio:3/4;
  border-radius:50% 40% 50% 40%/40% 50% 40% 50%;
  overflow:hidden;
  border:3px solid rgba(255,255,255,.85);
  box-shadow:0 20px 60px rgba(44,62,45,.22);
}
.hero-grass { position:absolute; bottom:0; left:0; right:0; height:160px; background:linear-gradient(180deg,transparent 0%,#4a8c40 55%,#2d5a27 100%); clip-path:ellipse(60% 70% at 50% 100%); z-index:2; }

/* Timeline */
.h-timeline-section { padding:6rem 0 4rem; background:var(--cream); }
.h-tl-item { display:grid; grid-template-columns:auto 1fr; gap:2rem; margin-bottom:4rem; }
.h-tl-item.right { direction:rtl; }
.h-tl-item.right > * { direction:ltr; }
.h-tl-line { display:flex; flex-direction:column; align-items:center; padding-top:.5rem; }
.h-tl-dot { width:18px; height:18px; border-radius:50%; border:3px solid var(--cream); box-shadow:0 0 0 3px currentColor; flex-shrink:0; }
.gold-dot { background:var(--gold)!important; box-shadow:0 0 0 3px var(--gold)!important; }
.h-tl-line::after { content:''; flex:1; width:2px; background:var(--line); margin-top:6px; }
.h-tl-card { background:white; border-radius:20px; overflow:hidden; border:1.5px solid var(--line); box-shadow:0 4px 24px rgba(44,62,45,.06); display:grid; grid-template-columns:200px 1fr; }
.h-tl-photo-card { height:100%; min-height:160px; overflow:hidden; }
.h-tl-photo-card img { width:100%; height:100%; object-fit:cover; display:block; }
.h-tl-card.special { border-color:var(--gold); box-shadow:0 4px 24px rgba(201,168,76,.15); }
.h-tl-art { height:100%; min-height:160px; overflow:hidden; }
.h-tl-art svg { width:100%; height:100%; }
.h-tl-text { padding:1.75rem; }
.h-tl-date { font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); }
.h-tl-text h3 { font-family:var(--serif); font-size:1.4rem; font-weight:400; color:var(--ink); margin:.4rem 0 .8rem; }
.h-tl-text p { font-family:var(--serif); font-size:.95rem; color:var(--ink-soft); line-height:1.7; font-style:italic; margin-bottom:.6rem; }

/* Next CTA */
.h-next { padding:6rem 0; background:linear-gradient(160deg,#2d5a27 0%,#1a3a1a 100%); text-align:center; }
.h-next-label { font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(200,240,200,.6); margin-bottom:.8rem; }
.h-next-title { font-family:var(--serif); font-size:clamp(1.8rem,4vw,3rem); font-weight:300; color:white; margin-bottom:2.5rem; line-height:1.2; }
.h-next-title em { color:#a8d8a8; }
.btn-ghibli {
  display:inline-block; padding:.9rem 2.5rem;
  background:rgba(255,255,255,.1); border:1.5px solid rgba(255,255,255,.3);
  color:white; font-family:var(--serif); font-size:1rem; font-style:italic;
  border-radius:50px; backdrop-filter:blur(8px);
  transition:background .3s ease,transform .3s var(--ease);
}
.btn-ghibli:hover { background:rgba(255,255,255,.2); transform:translateY(-3px); }

@media(max-width:900px){
  .h-tl-card { grid-template-columns:1fr; }
  .h-tl-art { height:160px; }
  .h-hero-photo { display:none; }
  .h-tl-item.right { direction:ltr; }
}
@media(max-width:600px){
  .h-tl-item { grid-template-columns:1fr; }
  .h-tl-line { display:none; }
}
