/* Research area detail page - shares everything with the research overview */
@import url("research.css");

.research-details--single { padding-bottom: 0; }
.research-details--single .area-panel { margin-bottom: 1rem; }

.area-about { padding-top: 2.5rem; padding-bottom: 2rem; }
.area-about .area-about__title { text-align: left; color: #0f172a; margin: 0 0 1.4rem; }
.area-about .area-about__title--sub { margin-top: 3rem; }
.area-about__text { font-size: var(--fs-body); line-height: 1.75; color: #0f172a; }
.area-about__text p { margin: 0 0 0.9rem; }
.area-about__text strong { font-weight: 600; }
.area-about__text a { color: var(--area-accent); }
/* images inserted into the description with (image: ...) */
.area-about__text figure { margin: 1.8rem 0 2rem; max-width: 760px; }
.area-about__text figure img { display: block; width: 100%; height: auto; border-radius: 10px; }
.area-about__text figcaption { margin-top: 0.5rem; font-size: var(--fs-small); line-height: 1.5; color: #555; }

.area-about__methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; }
.area-about__method { padding: 1.25rem 1.4rem; border: 1px solid #8f8f8f; border-radius: 10px; background: #fff; }
.area-about__method-title { position: relative; margin: 0 0 0.9rem; padding-bottom: 0.7rem; font-size: var(--fs-h3); font-weight: 600; color: #0f172a; }
.area-about__method-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 1.4rem; height: 2px; background: var(--area-accent); }
.area-about__method-text { font-size: var(--fs-small); line-height: 1.6; color: #333; }
.area-about__method-text p { margin: 0 0 0.6rem; }

.research-siblings { padding-top: 2rem; padding-bottom: 4rem; }
.research-siblings .research-siblings__heading { text-align: left; color: #0f172a; margin: 0 0 1.75rem; }
.research-summary__grid.research-summary__grid--siblings { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; }

@media (max-width: 900px) {
  .area-about__methods { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .research-summary__grid.research-summary__grid--siblings { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}