/* =========================================================
   PUBLICATIONS - page stylesheet
   Mockup: 20251013-004_Mockup_Spectre_Publications_v001
   ========================================================= */

/* --- Hero: plain deep navy, centred, curved bottom edge (see .pub-hero-curve) --- */
.hero.hero--publications {
  background: #030b1a radial-gradient(ellipse 60% 85% at 50% 0%, #06173a 0%, rgba(3, 11, 26, 0) 100%);
  padding: clamp(3.5rem, 7vw, 5.4rem) 0 clamp(1.5rem, 3vw, 2.2rem);
}
.hero--publications .hero__title { margin-bottom: 1.6rem; }
.hero--publications .hero__subtitle {
  max-width: 24rem;
  margin-bottom: 0;
  color: #fff;
}
.pub-hero-curve { height: clamp(40px, 6.5vw, 90px); margin-bottom: calc(-1 * clamp(40px, 6.5vw, 90px)); }
.pub-hero-curve + .section { padding-top: calc(clamp(40px, 6.5vw, 90px) + 3.8rem); }

/* --- Featured publications --- */
.section.section--featured-pubs {
  position: relative;
  overflow: hidden;
  padding-bottom: 3.5rem;
}
.section.section--featured-pubs--curved { padding-bottom: calc(clamp(40px, 6.5vw, 90px) + 3.6rem); }
.section--featured-pubs .section__title {
  text-align: center;
  color: #fff;
  margin: 0 0 clamp(2.5rem, 6vw, 4.6rem);
}

.featured-carousel { position: relative; }

.featured-carousel .featured-pubs__track {
  display: grid;
  position: static;
  min-height: 0;
}
.featured-carousel .featured-pubs__slide {
  position: static;
  inset: auto;
  grid-area: 1 / 1;
  display: grid;
  grid-template-columns: 26.4% minmax(0, 1fr);
  gap: 0 7%;
  align-items: start;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.45s ease, visibility 0.45s;
}
.featured-carousel .featured-pubs__slide.is-active { opacity: 1; visibility: visible; }

/* JS driven switch (publications.js): the card fades out - cover and text together - then the next one fades in
   (0.5 s each, matching T_FADE in publications.js); nothing moves */
.featured-carousel--anim .featured-pubs__slide { transition: none; }
.featured-carousel--anim .featured-pubs__cover,
.featured-carousel--anim .featured-pubs__body { transition: opacity 0.5s ease; }
.featured-carousel--anim .featured-pubs__slide.is-out .featured-pubs__cover,
.featured-carousel--anim .featured-pubs__slide.is-out .featured-pubs__body { opacity: 0; }
.featured-carousel--anim .featured-pubs__slide.is-in .featured-pubs__cover,
.featured-carousel--anim .featured-pubs__slide.is-in .featured-pubs__body { opacity: 0; transition: none; }
.featured-carousel--anim .featured-pubs__slide.is-busy { pointer-events: none; }
/* swipe with a finger or the mouse (spectreSwipe in main.js): grab cursor, nothing follows the pointer */
.featured-carousel .featured-pubs__track { cursor: grab; }
.featured-carousel .featured-pubs__track a,
.featured-carousel .featured-pubs__track button { cursor: pointer; }
@media (prefers-reduced-motion: reduce) {
  .featured-carousel--anim .featured-pubs__cover,
  .featured-carousel--anim .featured-pubs__body { transition: opacity 0.01ms; }
}

/* cover with mirrored reflection (same technique as the home page covers) */
.featured-carousel .featured-pubs__cover {
  position: relative;
  width: 100%;
  aspect-ratio: auto;
  overflow: visible;
  background: none;
  border-radius: 0;
  box-shadow: none;
  margin-bottom: 1rem;
}
.featured-carousel .featured-pubs__cover-img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.45);
}
.featured-carousel .featured-pubs__cover-reflection {
  display: block;
  position: absolute;
  left: 0;
  top: calc(100% + 12px);
  width: 100%;
  height: auto;
  border-radius: 4px;
  transform: scaleY(-1);
  filter: blur(3px);
  opacity: 0.9;
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 72%, rgba(0,0,0,0.05) 84%, rgba(0,0,0,0.22) 100%);
          mask-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 72%, rgba(0,0,0,0.05) 84%, rgba(0,0,0,0.22) 100%);
  pointer-events: none;
}

.featured-carousel .featured-pubs__body { color: #fff; padding-top: 0; }
/* cover and title start at the same height: the negative margin removes the space above the
   capitals (half leading + ascender room of Inter = 0.27 em) */
@media (min-width: 601px) {
  .featured-carousel .featured-pubs__body > :first-child { margin-top: -0.27em; }
}
.featured-carousel .featured-pubs__title {
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: 1.3;
  margin: 0 0 1rem;
  color: #fff;
}
.featured-carousel .featured-pubs__abstract {
  font-size: var(--fs-small);   /* full abstracts are long - running text size keeps the slide compact */
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.92);
  margin: 0 0 1rem;
}
.featured-carousel .featured-pubs__btn {
  display: inline-block;
  padding: 0.12rem 0.9rem;
  border-radius: 999px;
  background: #6d28d9;
  color: #fff;
  font-size: var(--fs-ui);
  font-weight: 500;
  line-height: 1.5;
  text-decoration: none;
  transition: background 0.2s ease;
}
.featured-carousel .featured-pubs__btn:hover { background: #7c3aed; text-decoration: none; }
.featured-carousel .featured-pubs__authors {
  font-size: var(--fs-small);
  line-height: 1.45;
  color: #fff;
  margin: 1.4rem 0 0;
}

/* large plain chevrons at the page sides */
.featured-carousel .featured-pubs__arrow {
  position: absolute;
  top: 38%;
  transform: translateY(-50%);
  z-index: 3;
  width: 3rem;
  height: 4rem;
  padding: 0.6rem 0.8rem;
  border: 0;
  border-radius: 8px;
  background: none;
  color: #fff;
  cursor: pointer;
  display: block;
  opacity: 0.95;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.featured-carousel .featured-pubs__arrow svg { display: block; width: 100%; height: 100%; }
.featured-carousel .featured-pubs__arrow--prev { left: clamp(0.25rem, 5.2vw, 6rem); }
.featured-carousel .featured-pubs__arrow--next { right: clamp(0.25rem, 5.2vw, 6rem); }
.featured-carousel .featured-pubs__arrow:hover { background: none; opacity: 1; }
.featured-carousel .featured-pubs__arrow--prev:hover { transform: translate(-3px, -50%); }
.featured-carousel .featured-pubs__arrow--next:hover { transform: translate(3px, -50%); }
.featured-carousel .featured-pubs__arrow:focus-visible,
.featured-carousel .featured-pubs__dot:focus-visible { outline: 2px solid #a78bfa; outline-offset: 3px; }

/* dots: white rings, the active one with a violet core */
.featured-carousel .featured-pubs__dots {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: 1.35rem;
  margin: 2.2rem 0 0;
}
.featured-carousel .featured-pubs__dot {
  box-sizing: border-box;
  width: 1.05rem;
  height: 1.05rem;
  padding: 3px;
  border: 1.5px solid #fff;
  border-radius: 50%;
  background: transparent;
  background-clip: content-box;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.featured-carousel .featured-pubs__dot:hover { background-color: rgba(255, 255, 255, 0.35); }
.featured-carousel .featured-pubs__dot.is-active { background-color: #8b5cf6; }

/* --- "NEW:" on the dark curved background --- */
.pub-new-curve {
  position: relative;
  z-index: 2;
  height: clamp(40px, 6.5vw, 90px);
  margin-top: calc(-1 * clamp(40px, 6.5vw, 90px));
  line-height: 0;
  pointer-events: none;
}
.pub-new-curve svg { display: block; width: 100%; height: calc(100% + 2px); overflow: visible; }   /* 2px under the dark area below: no seam line at zoom levels */
.pub-new {
  position: relative;
  z-index: 3;
  background: #020d1f;
  color: #fff;
  text-align: center;
  /* more air above "NEW:" (customer feedback) */
  padding: clamp(1.25rem, 3vw, 2.25rem) 0 clamp(3rem, 6vw, 4.6rem);
}
.pub-new .container { position: relative; top: 0; margin-bottom: 0; }
.pub-new--flat { padding-top: clamp(3rem, 6vw, 4.6rem); }
.pub-new--flat .container { top: 0; margin-bottom: 0; }
.pub-new__title {
  font-size: calc(var(--fs-h2) * 0.72);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 1rem;
}
.pub-new__text {
  font-size: var(--fs-body);
  line-height: 1.55;
  letter-spacing: 0.01em;
  color: #fff;
  max-width: 47rem;
  margin: 0 auto;
}
.pub-new__text p { margin: 0 0 0.6rem; }
.pub-new__text p:last-child { margin-bottom: 0; }
.pub-new__text a { color: #c4b5fd; }

/* --- All publications: Google Scholar style table --- */
.section.section--pub-table {
  background: #fff;
  padding: clamp(2.75rem, 6vw, 3.6rem) 0 clamp(3rem, 6vw, 5rem);
}
.section--pub-table .section__title {
  font-size: calc(var(--fs-h2) * 0.72);
  font-weight: 600;
  text-align: center;
  color: #1c2e40;
  margin: 0 0 1.4rem;
}
.section--pub-table .section__text {
  font-size: var(--fs-body);
  line-height: 1.55;
  letter-spacing: 0.01em;
  text-align: center;
  color: #1c2e40;
  max-width: none;
  margin: 0 auto;
}
.section--pub-table .pub-table-wrapper { margin-top: clamp(2rem, 5vw, 3.4rem); overflow-x: visible; }
/* button at the end of the section (e.g. Google Scholar profile) */
.pub-table__cta { margin: 2rem 0 0; text-align: center; }
.pub-table__cta-btn { display: inline-flex; align-items: center; gap: 0.5rem; }
/* "Show all" below the automatically loaded list + source note */
.pub-table__more { margin: 1.4rem 0 0; text-align: center; }
.pub-table__more[hidden] { display: none; }
.pub-table__more-btn { display: inline-flex; align-items: center; gap: 0.35rem; }
.pub-table__row[hidden] { display: none; }
.pub-table__note { margin: 1rem 0 0; font-size: var(--fs-small); line-height: 1.5; color: #667085; text-align: center; }
.section--pub-table .pub-table {
  width: 100%;
  min-width: 0;
  table-layout: auto;
  border-collapse: collapse;
  border: 0;
  border-radius: 0;
  background: #fff;
  font-size: var(--fs-body);
}
.section--pub-table .pub-table .pub-table__th {
  padding: 0.8rem 1rem;
  background: #f5f5f5;
  border: 0;
  font-size: var(--fs-small);
  font-weight: 400;
  letter-spacing: 0;
  text-transform: uppercase;
  text-align: left;
  color: #1a0dab;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}
.section--pub-table .pub-table .pub-table__th--num { text-align: right; width: 1%; min-width: 0; }
.section--pub-table .pub-table .pub-table__th--cited { color: #222; padding-right: 0.5rem; }
.section--pub-table .pub-table .pub-table__th { transition: color 0.2s ease; }
.section--pub-table .pub-table .pub-table__th:hover { text-decoration: none; color: #6d28d9; }
.section--pub-table .pub-table .pub-table__th[data-sort-dir]::after { content: " \2193"; }
.section--pub-table .pub-table .pub-table__th[data-sort-dir="asc"]::after { content: " \2191"; }

.section--pub-table .pub-table .pub-table__row,
.section--pub-table .pub-table tr { border: 0; background: none; }
.section--pub-table .pub-table tr:hover { background: none; }
.section--pub-table .pub-table .pub-table__td {
  padding: 0.45rem 1rem;
  border: 0;
  vertical-align: top;
  font-weight: 400;
  max-width: none;
}
.section--pub-table .pub-table tbody tr:first-child .pub-table__td { padding-top: 1.3rem; }
.section--pub-table .pub-table .pub-table__td--title { padding-right: 2rem; }
.section--pub-table .pub-table__title {
  display: block;
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: 1.3;
  color: #1a0dab;
  text-decoration: none;
  margin-bottom: 0.15rem;
}
.section--pub-table a.pub-table__title { transition: color 0.2s ease; }
.section--pub-table a.pub-table__title:hover { text-decoration: none; color: #6d28d9; }
.section--pub-table a.pub-table__title:visited { color: #660099; }
.section--pub-table .pub-table__title--plain { color: #222; }
.section--pub-table .pub-table__meta {
  display: block;
  margin: 0;
  font-size: var(--fs-small);
  line-height: 1.35;
  color: #777;
}
.section--pub-table .pub-table .pub-table__td--cited,
.section--pub-table .pub-table .pub-table__td--year {
  font-size: var(--fs-small);
  text-align: right;
  white-space: nowrap;
  padding-top: 0.65rem;
}
.section--pub-table .pub-table tbody tr:first-child .pub-table__td--cited,
.section--pub-table .pub-table tbody tr:first-child .pub-table__td--year { padding-top: 1.5rem; }
.section--pub-table .pub-table .pub-table__td--cited { color: #1a0dab; padding-right: 0.5rem; }
.section--pub-table .pub-table .pub-table__td--year { color: #222; }

/* --- Impact stories --- */
.section.section--impact {
  padding: clamp(3rem, 6vw, 4.7rem) 0 clamp(3.5rem, 7vw, 5.6rem);
  text-align: center;
}
.impact-stories__icon {
  display: block;
  width: clamp(6rem, 12vw, 9.4rem);
  height: auto;
  margin: 0 auto 1.6rem;
}
.impact-stories__title {
  font-size: calc(var(--fs-h2) * 0.72);
  font-weight: 600;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 1rem;
}
.section--impact .impact-stories__subtitle {
  font-size: var(--fs-body);
  line-height: 1.55;
  letter-spacing: 0.01em;
  color: #fff;
  max-width: 27rem;
  margin: 0 auto;
}
.section--impact .impact-stories__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem;
  margin-top: clamp(2.25rem, 5vw, 3.4rem);
  text-align: left;
}
.section--impact .impact-stories__grid--single { grid-template-columns: minmax(0, 30rem); justify-content: center; }
.section--impact .impact-card {
  position: relative;
  background: #fff;
  border: 0;
  border-radius: 10px;
  padding: 1.8rem 3rem 1.8rem 2.1rem;
  box-shadow: 0 8px 0 #7a2df0;
  color: #213342;
}
.section--impact .impact-card:hover { transform: none; box-shadow: 0 8px 0 #7a2df0; }
/* violet triangle marker at the right edge, level with the card title */
.section--impact .impact-card::after {
  content: "";
  position: absolute;
  right: 0;
  top: 1.75rem;
  border-style: solid;
  border-width: 1.1rem 1.1rem 1.1rem 0;
  border-color: transparent #7a2df0 transparent transparent;
}
.section--impact .impact-card__title {
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: 1.25;
  color: #213342;
  margin: 0 0 0.9rem;
}
.section--impact .impact-card__list {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: var(--fs-small);
  line-height: 1.5;
  letter-spacing: 0.01em;
  color: #213342;
}
.section--impact .impact-card__item {
  position: relative;
  margin: 0 0 0.45rem;
  padding: 0 0 0 1.05rem;
  border: 0;
  font-size: var(--fs-small);
  color: #213342;
}
.section--impact .impact-card__item:last-child { margin-bottom: 0; }
.section--impact .impact-card__item::before { content: "\2022"; position: absolute; left: 0; top: 0; }

/* --- Contact: grey, left aligned, violet rule before the footer --- */
.section.section--pub-contact {
  background: #f1f1f1;
  padding: clamp(2.5rem, 5vw, 3.6rem) 0 clamp(2.5rem, 5vw, 3.4rem);
  border-bottom: 4px solid #6d28d9;
}
.section--pub-contact .pub-contact {
  max-width: none;
  margin: 0;
  text-align: left;
}
.section--pub-contact .pub-contact__title {
  font-size: var(--fs-body);
  font-weight: 600;
  line-height: 1.5;
  color: #0f172a;
  margin: 0 0 0.2rem;
}
.section--pub-contact .pub-contact__text {
  font-size: var(--fs-body);
  line-height: 1.5;
  color: #0f172a;
  margin: 0 0 1.6rem;
}
.section--pub-contact .pub-contact__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.9rem 1.5rem;
}
.section--pub-contact .pub-contact__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.5rem 1rem 0.5rem 0.9rem;
  border-radius: 7px;
  background: #9964ff;
  color: #fff;
  font-size: var(--fs-ui);
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none;
  transition: background 0.2s ease;
}
.section--pub-contact .pub-contact__btn:hover { background: #7c3aed; text-decoration: none; }
.section--pub-contact .pub-contact__btn .icon { width: 1.25em; height: 1.25em; }
.section--pub-contact .pub-contact__link {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: #9964ff;
  font-size: var(--fs-ui);
  font-weight: 500;
  text-decoration: none;
  transition: color 0.2s ease;
}
.section--pub-contact .pub-contact__link .icon { transition: transform 0.2s ease; }
.section--pub-contact .pub-contact__link:hover { color: #6d28d9; text-decoration: none; }
.section--pub-contact .pub-contact__link:hover .icon { transform: translateY(-3px); }
.section--pub-contact .pub-contact__link .icon { width: 1.05em; height: 1.05em; }

/* --- Responsive --- */
@media (max-width: 1150px) {
  /* no room beside the container: chevrons move next to the dots */
  .featured-carousel .featured-pubs__arrow {
    top: auto;
    bottom: -0.95rem;
    transform: none;
    width: 2.2rem;
    height: 3rem;
  }
  .featured-carousel .featured-pubs__arrow--prev { left: calc(50% - 8rem); }
  .featured-carousel .featured-pubs__arrow--next { right: calc(50% - 8rem); }
  .featured-carousel .featured-pubs__arrow--prev:hover,
  .featured-carousel .featured-pubs__arrow--next:hover { transform: none; }
}
@media (max-width: 900px) {
  .featured-carousel .featured-pubs__slide { grid-template-columns: 30% minmax(0, 1fr); gap: 0 2rem; }
  .featured-carousel .featured-pubs__body { padding-top: 0; }
  .section--impact .impact-stories__grid { gap: 1.5rem; }
  .section--impact .impact-card { padding: 1.5rem 2.6rem 1.5rem 1.5rem; }
  .section--pub-table .pub-table .pub-table__td,
  .section--pub-table .pub-table .pub-table__th { padding-left: 0.6rem; padding-right: 0.6rem; }
  .section--pub-table .pub-table .pub-table__td--title { padding-right: 1rem; }
}
@media (max-width: 600px) {
  .featured-carousel .featured-pubs__slide { grid-template-columns: 1fr; gap: 0; }
  .featured-carousel .featured-pubs__cover { width: 55%; max-width: 13rem; margin: 0 auto 1.75rem; }
  .featured-carousel .featured-pubs__cover-reflection { display: none; }
  .section--impact .impact-stories__grid { grid-template-columns: 1fr; gap: 2rem; }
  .section--pub-table .pub-table { font-size: var(--fs-body); min-width: 0; }
  .section--pub-table .pub-table .pub-table__th--year,
  .section--pub-table .pub-table .pub-table__td--year { padding-left: 0.2rem; }
  .hero--publications .hero__subtitle { max-width: none; }
}