/* ================================================================
   LIMONAZUL — "Qué es LimónAzul" (/acerca)
   Continuación de la portada: usa la paleta, la tipografía y los
   componentes de home.css (.ed-*). Aquí solo va lo propio de esta
   página: columnas de texto e imagen, y los huecos de imagen.
   ================================================================ */

.ac-hero{ padding:clamp(44px,7vw,84px) 0 clamp(20px,3vw,34px); }
.ac-hero-in{ display:grid; gap:clamp(30px,5vw,52px); align-items:center; }
.ac-hero .ed-display{ max-width:14ch; }
.ac-hero .ed-lead{ max-width:42ch; }

.ac-sec{ padding:clamp(48px,7vw,86px) 0; }
.ac-banda{ background:var(--paper-2); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }

/* Bloques de lectura: ~68ch como pide la especificación. Cuando .ac-prosa va
   en el mismo elemento que .container, el bloque queda centrado en la página;
   es deliberado y por eso el margen automático se declara aquí. */
.ac-prosa{ max-width:68ch; }
.container.ac-prosa{ margin-inline:auto; }
.ac-prosa .ed-title{ margin-bottom:clamp(18px,2.4vw,26px); }
.ac-prosa p{ margin:0 0 18px; font-size:1.04rem; line-height:1.8; color:var(--ink-70); }
.ac-prosa p:last-child{ margin-bottom:0; }
.ac-prosa strong{ color:var(--ink); font-weight:500; }
.ac-remate{
  font-family:var(--font-serif); font-weight:400; font-style:italic;
  font-size:clamp(1.3rem,2.6vw,1.8rem); line-height:1.4; color:var(--ink) !important;
}

/* Texto + imagen: en escritorio alternan lado */
.ac-dos{ display:grid; gap:clamp(30px,4.5vw,56px); align-items:center; }
.ac-figura{ margin:0; }
.ac-figura img, .ac-figura picture{ display:block; width:100%; height:auto; }
.ac-figura picture img{ border:1px solid var(--rule); background:var(--paper-2); }
.ac-figura-marca picture img{ border:0; background:transparent; }
.ac-figura-marca{ max-width:340px; justify-self:center; }
.ac-figura-firma{ max-width:220px; justify-self:center; }
.ac-figura-hero picture img{ border:0; background:transparent; }

/* Marcador de hueco sin archivo (solo en desarrollo) */
.img-slot-vacio{
  display:grid; place-items:center; width:100%;
  background:rgba(13,28,64,.06); border:1px dashed rgba(13,28,64,.35);
  color:var(--ink-70); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; text-align:center;
}

.ac-cierre .ed-close-title{ max-width:20ch; }
.ac-acciones{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:14px 28px; }

@media (min-width:880px){
  .ac-hero-in{ grid-template-columns:1fr .9fr; }
  .ac-dos{ grid-template-columns:1.05fr .95fr; }
  .ac-dos-inv .ac-prosa{ order:2; }   /* alterna el lado de la imagen */
  .ac-dos-inv .ac-figura{ order:1; }
  .ac-dos .ac-prosa{ max-width:60ch; }
}
@media (max-width:560px){
  .ac-acciones .ed-btn{ flex:1 1 100%; }
}