/* Immersive / image-first archive presentation.
 * Loaded only for a resolved custom archive whose visual mode is immersive.
 */

.td-archive-presentation--immersive .td-category-archive {
  --td-archive-surface: #f6f8fb;
  --td-archive-text: #111827;
  --td-archive-accent: #0a1a3c;
}

.td-archive-presentation--immersive .td-category-hero {
  position: relative;
  overflow: hidden;
  min-height: clamp(260px, 34vw, 430px);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: end;
  align-items: end;
  gap: clamp(0.75rem, 1.4vw, 1rem);
  padding: clamp(1.4rem, 4vw, 3.25rem);
  border-radius: clamp(24px, 3vw, 38px);
  color: #fff;
  background:
    radial-gradient(circle at 78% 20%, rgb(255 255 255 / 0.2) 0 12%, transparent 33%),
    radial-gradient(circle at 20% 110%, rgb(148 163 184 / 0.36) 0 18%, transparent 46%),
    linear-gradient(135deg, #050816 0%, #102044 54%, #253b62 100%);
  box-shadow: 0 28px 80px rgb(15 23 42 / 0.22);
}

.td-archive-presentation--immersive .td-category-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(90deg, rgb(0 0 0 / 0.38), transparent 58%),
    repeating-linear-gradient(90deg, rgb(255 255 255 / 0.045) 0 1px, transparent 1px 96px);
  pointer-events: none;
}

.td-archive-presentation--immersive .td-category-hero::after {
  z-index: 0;
  opacity: 0.88;
}

.td-archive-presentation--immersive .td-hero-text-content,
.td-archive-presentation--immersive .td-hero-sidebar {
  position: relative;
  z-index: 1;
}

.td-archive-presentation--immersive .td-hero-text-content {
  max-width: 760px;
}

.td-archive-presentation--immersive .td-hero-sidebar {
  max-width: 900px;
  display: flex;
  flex-flow: row wrap;
  gap: 0.7rem;
  align-items: flex-start;
}

.td-archive-presentation--immersive .td-category-hero__eyebrow {
  color: rgb(255 255 255 / 0.72);
}

.td-archive-presentation--immersive .td-category-hero h1 {
  max-width: 720px;
  font-size: clamp(2.35rem, 7vw, 6.25rem);
  line-height: 0.88;
  letter-spacing: -0.075em;
  color: #fff;
}

.td-archive-presentation--immersive .td-category-hero__description {
  max-width: 620px;
  font-size: clamp(1rem, 1.6vw, 1.18rem);
  color: rgb(255 255 255 / 0.82);
}

.td-archive-presentation--immersive .td-category-semantic__stats span,
.td-archive-presentation--immersive .td-category-semantic__children a {
  border-color: rgb(255 255 255 / 0.22);
  background: rgb(255 255 255 / 0.13);
  color: #fff;
  backdrop-filter: blur(14px);
}

.td-archive-presentation--immersive .td-category-semantic__stats strong {
  color: #fff;
}

.td-archive-presentation--immersive .td-category-results {
  margin-top: clamp(2rem, 5vw, 4rem);
}

.td-archive-presentation--immersive .td-category-results__heading {
  align-items: end;
  border: 0;
  padding-bottom: clamp(1rem, 2vw, 1.35rem);
}

.td-archive-presentation--immersive .td-category-results__heading h2 {
  font-size: clamp(1.75rem, 3vw, 2.55rem);
  line-height: 1;
  letter-spacing: -0.055em;
}

.td-archive-presentation--immersive .td-category-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(0.9rem, 1.8vw, 1.35rem);
}

.td-archive-presentation--immersive .td-category-card {
  position: relative;
  display: block;
  grid-column: span 4;
  min-height: clamp(300px, 30vw, 420px);
  overflow: hidden;
  border: 0;
  border-radius: clamp(20px, 2.4vw, 30px);
  background: #0f172a;
  box-shadow: 0 24px 60px rgb(15 23 42 / 0.14);
  isolation: isolate;
  transition: transform 260ms ease, box-shadow 260ms ease;
}

.td-archive-presentation--immersive .td-category-card--lead {
  display: block;
  grid-column: span 8;
  min-height: clamp(360px, 40vw, 560px);
}

.td-archive-presentation--immersive .td-category-card__media {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.td-archive-presentation--immersive .td-category-card__media picture,
.td-archive-presentation--immersive .td-category-card__image {
  display: block;
  width: 100%;
  height: 100%;
}

.td-archive-presentation--immersive .td-category-card__image {
  object-fit: cover;
  object-position: center;
  transform: scale(1.01);
  transition: transform 260ms ease, filter 260ms ease;
}

.td-archive-presentation--immersive .td-category-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgb(15 23 42 / 0.04) 0%, rgb(15 23 42 / 0.24) 44%, rgb(15 23 42 / 0.88) 100%);
  pointer-events: none;
}

.td-archive-presentation--immersive .td-category-card__body {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  z-index: 2;
  display: grid;
  gap: 0.55rem;
  padding: clamp(1rem, 2.4vw, 1.65rem);
  color: #fff;
}

.td-archive-presentation--immersive .td-category-card__meta,
.td-archive-presentation--immersive .td-category-card__excerpt,
.td-archive-presentation--immersive .td-category-card__read-more {
  color: rgb(255 255 255 / 0.76);
}

.td-archive-presentation--immersive .td-category-card__meta {
  order: -1;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.td-archive-presentation--immersive .td-category-card h3 {
  margin: 0;
  max-width: 760px;
  font-size: clamp(1.15rem, 2.1vw, 2rem);
  line-height: 1.02;
  letter-spacing: -0.045em;
}

.td-archive-presentation--immersive .td-category-card:not(.td-category-card--lead) h3 {
  font-size: clamp(1.05rem, 1.45vw, 1.35rem);
}

.td-archive-presentation--immersive .td-category-card h3 a,
.td-archive-presentation--immersive .td-category-card h3 a:visited {
  color: #fff;
}

.td-archive-presentation--immersive .td-category-card__excerpt {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}

.td-archive-presentation--immersive .td-category-card:not(.td-category-card--lead) .td-category-card__excerpt,
.td-archive-presentation--immersive .td-category-card:not(.td-category-card--lead) .td-category-card__read-more {
  display: none;
}

.td-archive-presentation--immersive .td-category-card:focus-within,
.td-archive-presentation--immersive .td-category-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 30px 72px rgb(15 23 42 / 0.18);
}

.td-archive-presentation--immersive .td-category-card:focus-within .td-category-card__image,
.td-archive-presentation--immersive .td-category-card:hover .td-category-card__image {
  transform: scale(1.055);
  filter: saturate(1.06) contrast(1.02);
}

.td-archive-presentation--immersive .td-category-card--no-media {
  background: linear-gradient(135deg, #111827, #334155);
}

.td-archive-presentation--immersive.td-category-archive-migrated .td-category-card.td-category-card--lead.td-category-card--no-media {
  display: block !important;
  grid-column: span 8 !important;
  min-height: clamp(300px, 30vw, 420px);
}

.td-archive-presentation--immersive.td-category-archive-migrated .td-category-card.td-category-card--lead.td-category-card--no-media .td-category-card__body {
  position: absolute !important;
  padding: clamp(1rem, 2.4vw, 1.65rem) !important;
}

@media (max-width: 980px) {
  .td-archive-presentation--immersive .td-category-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .td-archive-presentation--immersive .td-category-card,
  .td-archive-presentation--immersive .td-category-card--lead,
  .td-archive-presentation--immersive.td-category-archive-migrated .td-category-card.td-category-card--lead.td-category-card--no-media {
    grid-column: span 6 !important;
  }
}

@media (max-width: 620px) {
  .td-archive-presentation--immersive .td-category-hero {
    min-height: 330px;
    border-radius: 24px;
  }

  .td-archive-presentation--immersive .td-category-card,
  .td-archive-presentation--immersive .td-category-card--lead {
    min-height: 330px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .td-archive-presentation--immersive .td-category-card,
  .td-archive-presentation--immersive .td-category-card__image {
    transition: none !important;
  }
}