/* =====================================================================
   academia.css — Pàgina «L'Acadèmia» (#936)
   31/8/2026

   La pàgina es va refer amb blocs de Kadence (Row Layout + Advanced Text +
   Info Box). El GRUIX DEL DISSENY VIU ALS ATRIBUTS DELS BLOCS, no aquí:
   colors, mides, farciments i vores es posen a la barra lateral perquè
   l'Andrea els vegi i els pugui canviar.

   Aquí només hi ha el que els atributs no cobreixen:
     1. La foto que ha d'omplir l'alçada de la columna de text.
     2. El comportament responsive de les dues columnes.
     3. El titular que rota, que necessita un ample de referència.

   ⚠️ Les regles porten :is(.entry-content, .block-editor-block-list__layout)
   perquè .entry-content NO existeix a l'editor. `:is()` agafa
   l'especificitat del seu argument més alt, així que el pes no canvia.
   ===================================================================== */

/* ---- Secció «Sobre nosaltres»: text + foto ---- */

/* La foto omple l'alçada de la columna del text i es retalla pel centre,
   així les dues columnes acaben a la mateixa línia sigui quin sigui el text
   que hi escrigui l'Andrea. Sense això, la foto queda surant al mig. */
:is(.entry-content, .block-editor-block-list__layout) .academia-foto img {
  width: 100%;
  height: 100%;
  min-height: 260px;
  object-fit: cover;
  border-radius: var(--passa-radius);
  display: block;
}
:is(.entry-content, .block-editor-block-list__layout) .academia-foto {
  height: 100%;
  margin: 0;
}

/* ---- Titular que rota: «T'ajudem a complir el teu somni!» ----

   El motor és el mateix del hero (hero.js + .passa-cycle a hero.css). Aquí
   només cal garantir-li un ample de referència: hero.js mesura
   wrap.clientWidth per decidir si ha d'abaixar la mida de la paraula, i si la
   columna no té ample propi la mesura surt 0 i no ajusta res.

   Les paraules s'editen al Personalitzador → 🎓 L'Acadèmia · paraules que
   roten. NO viuen al contingut: Gutenberg neteja els data-* del text
   enriquit i el bloc quedaria ineditable (mateixa lliçó que el hero, 20/8). */
:is(.entry-content, .block-editor-block-list__layout) .academia-perque__claim {
  min-width: 0;
}
:is(.entry-content, .block-editor-block-list__layout) .academia-rotatiu {
  max-width: 320px;
}

/* ---- Fitxes de les seus ----
   Fons, vora, radi i farciment van als atributs de l'Info Box. Aquí només
   l'alçada igualada: dues targetes amb adreces de llargada diferent han
   d'acabar a la mateixa línia. */
:is(.entry-content, .block-editor-block-list__layout) .academia-seu,
:is(.entry-content, .block-editor-block-list__layout) .academia-seu .kt-blocks-info-box-link-wrap {
  height: 100%;
}

/* ---- Responsive ----

   Regla de la casa: en baixar d'ample, una secció no pot fer-se MÉS ALTA que
   al graó anterior. Les dues columnes de la intro apilen a 1024 (tauleta),
   no a 768: a 900px la foto quedava tan estreta que el retall li menjava el
   docent i el text baixava a 11 línies.

   Kadence ja apila els seus Row Layout sol; el que s'ajusta aquí és només
   l'alçada mínima de la foto, que apilada no ha de ser un panorama. */
@media (max-width: 1024px) {
  :is(.entry-content, .block-editor-block-list__layout) .academia-foto img {
    min-height: 0;
    height: auto;
    aspect-ratio: 3 / 2;
  }
  :is(.entry-content, .block-editor-block-list__layout) .academia-rotatiu {
    max-width: none;
  }
}