/* Layout utilities shim — deterministic export without Tailwind JIT */
.hidden { display: none !important; }

.h-full { height: 100%; }

.w-full { width: 100%; }

.inline-flex { display: inline-flex; }

.flex { display: flex; }

.flex-col { flex-direction: column; }

.flex-wrap { flex-wrap: wrap; }

.items-center { align-items: center; }

.items-start { align-items: flex-start; }

.items-stretch { align-items: stretch; }

.items-baseline { align-items: baseline; }

.justify-center { justify-content: center; }

.justify-start { justify-content: flex-start; }

.text-center { text-align: center; }

.grid { display: grid; }

.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }

.trf-media-frame img,
.trf-collage-tile__inner img,
[style*="aspect-ratio"] img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.trf-timeline-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: calc(var(--space-scale, 1.125) * 1rem);
  align-items: stretch;
}

.trf-timeline-spacer {
  display: none;
  min-width: 0;
}

.trf-gallery figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Carousel card images must fill their fixed-aspect frame. !important is
   required because block templates may carry object-fit as an inline style
   (the old slider stub shipped `object-fit:contain`, which letterboxed
   landscape cards with portrait/odd-ratio photos). */
.trf-swiper .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover !important;
  object-position: center !important;
  display: block;
}

.trf-footer-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-xl);
}

@media (min-width: 640px) {
  .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
  .md\:block { display: block; }
  .md\:order-3 { order: 3; }
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .md\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .md\:col-span-1 { grid-column: span 1 / span 1; }
  .md\:col-span-3 { grid-column: span 3 / span 3; }
  .md\:col-span-4 { grid-column: span 4 / span 4; }
  .md\:col-span-5 { grid-column: span 5 / span 5; }
  .md\:col-span-7 { grid-column: span 7 / span 7; }
  .md\:col-span-8 { grid-column: span 8 / span 8; }
  .md\:col-span-12 { grid-column: span 12 / span 12; }
  .lg\:justify-end { justify-content: flex-end; }

  .trf-timeline-row {
    grid-template-columns: 1fr auto 1fr;
  }

  .trf-timeline-spacer {
    display: block;
  }

  .trf-timeline-row .trf-timeline-order-1 { order: 1; }
  .trf-timeline-row .trf-timeline-order-2 { order: 2; }
  .trf-timeline-row .trf-timeline-order-3 { order: 3; }

  .trf-footer-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
    gap: var(--spacing-xl);
    align-items: start;
  }

  .trf-footer-nav-cols {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--spacing-md);
  }

  .trf-section-header {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: calc(var(--space-scale, 1.125) * 1.25rem);
    align-items: end;
  }

  .trf-posts-list-header {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: calc(var(--space-scale, 1.125) * 1.25rem);
    align-items: end;
  }
}

@media (min-width: 1024px) {
  .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lg\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .lg\:col-span-12 { grid-column: span 12 / span 12; }
}