.trips-index__container {
  padding: 36px 0 64px;
  color: #263238;
}

.trips-index__breadcrumbs { margin-bottom: 20px; }

.trips-index__hero {
  position: relative;
  display: flex;
  min-height: 280px;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  padding: clamp(30px, 5vw, 62px);
  border: 1px solid #d8e7da;
  border-radius: 20px;
  background-image: linear-gradient(90deg, rgba(238, 247, 239, .97) 0%, rgba(248, 251, 247, .9) 48%, rgba(232, 241, 228, .22) 100%), url('/img/hero-fundacja.jpg');
  background-position: center;
  background-size: cover;
  box-shadow: 0 12px 32px rgba(39, 90, 47, .08);
}

.trips-index__hero-content { position: relative; z-index: 1; }
.trips-index__eyebrow { display: block; margin-bottom: 10px; color: #397342; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.trips-index__hero h1 { margin: 0; color: #234d2a; font-size: clamp(30px, 4vw, 48px); font-weight: 700; line-height: 1.12; }
.trips-index__hero p { max-width: 780px; margin: 15px 0 0; color: #47604a; font-size: clamp(16px, 2vw, 19px); line-height: 1.65; }
.trips-index__materials { margin-top: 30px; }
.trips-index__materials-header { margin-bottom: 16px; }
.trips-index__materials-header h2 { margin: 0; color: #314a35; font-size: clamp(24px, 3vw, 30px); font-weight: 700; line-height: 1.25; }
.trips-index__materials-header p { max-width: 760px; margin: 8px 0 0; color: #647565; font-size: 16px; line-height: 1.6; }
.trips-index__materials-card { padding: 28px; border: 1px solid #e1e9e2; border-radius: 16px; background: #fff; box-shadow: 0 8px 20px rgba(36, 70, 40, .05); }
.trips-index__materials-card > .row { margin-bottom: -35px; }
.trips-index__materials-card .film { min-width: 0; }
.trips-index__materials-card .nsm { min-width: 0; }

@media (max-width: 767px) {
  .trips-index__container { padding-top: 20px; padding-bottom: 44px; }
  .trips-index__breadcrumbs { margin-bottom: 14px; }
  .trips-index__hero { min-height: 0; padding: 25px 20px; border-radius: 14px; }
  .trips-index__hero h1 { font-size: 2rem; }
  .trips-index__hero p { font-size: 1rem; }
  .trips-index__materials { margin-top: 22px; }
  .trips-index__materials-header { margin-bottom: 13px; }
  .trips-index__materials-header h2 { font-size: 1.5rem; }
  .trips-index__materials-header p { font-size: 15px; }
  .trips-index__materials-card { padding: 20px 16px; border-radius: 12px; }
  .trips-index__materials-card > .row { margin-bottom: -35px; }
}