/* ============================================
   RESPONSIVE — Media queries
============================================ */

@media (max-width: 1024px) {
    .ficha, .ficha--invertida { grid-template-columns: 300px 1fr; padding: 2rem; }
    .libro-card { grid-template-columns: 240px 1fr; }
    .footer__grid { grid-template-columns: 1fr 1fr; }
  }
  
  @media (max-width: 860px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.6rem; }
    h3 { font-size: 1.25rem; }
    .section { padding: 3rem 0; }
  
    .hamburger {
      display: flex !important;
      flex-direction: column; justify-content: center; gap: 5px;
      width: 44px; height: 44px;
      background: transparent; border: none; cursor: pointer;
      z-index: 1100;
    }
    .hamburger span {
      width: 26px; height: 3px; border-radius: 3px;
      background: var(--tierra-texto);
      transition: transform 0.3s, opacity 0.3s;
    }
    .hamburger.open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
    .hamburger.open span:nth-child(2) { opacity: 0; }
    .hamburger.open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
  
    .nav {
      display: none;
      position: fixed;
      top: 0; right: 0;
      width: min(320px, 85vw);
      height: 100vh;
      background: var(--blanco-felpa);
      flex-direction: column;
      justify-content: center;
      gap: 1.6rem;
      padding: 2rem;
      box-shadow: -8px 0 30px rgba(74,64,58,0.2);
      z-index: 1050;
    }
    .nav--open { display: flex; }
    .nav a { font-size: 1.15rem; }
  
    .grid--3, .grid--4 { grid-template-columns: 1fr; }
    .grid--2 { grid-template-columns: 1fr; }
  
    .ficha, .ficha--invertida { grid-template-columns: 1fr; }
    .ficha--invertida .ficha__img { order: 0; }
    .ficha__img { min-height: 280px; }
  
    .libro-card { grid-template-columns: 1fr; text-align: center; }
    .libro-portada { max-width: 260px; margin: 0 auto; }
  
    .contacto-grid { grid-template-columns: 1fr; }
    .eco-card { flex-direction: column; text-align: center; align-items: center; }
  
    .nube--3 { display: none; }
    .hero { min-height: auto; padding-top: calc(var(--header-alto) + 3.5rem); }
  }
  
  @media (max-width: 480px) {
    h1 { font-size: 1.7rem; }
    .hero__subtitle { font-size: 1.05rem; }
    .hero__ctas .btn { width: 100%; text-align: center; }
    .cancion { padding: 1.5rem; }
    .ficha { padding: 1.5rem; }
  }