/* DBS V5 – echte MTB-Motive. Nur auf der Startseite eingebunden.
   Bilddateien bleiben vollständig; Ausschnitte werden responsiv per CSS gesetzt. */
.dbs-trail-photo { position: relative; min-width: 0; margin: 0; overflow: hidden; }
.dbs-trail-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dbs-photo-intro { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: clamp(2rem, 5vw, 5rem); margin-bottom: 4rem; }
.dbs-photo-intro .dbs-photo-intro__copy { margin: 0; text-align: left; }
.dbs-photo-intro__copy h2 { overflow-wrap: normal; hyphens: auto; }
.dbs-trail-photo--forest { width: 100%; max-width: 480px; aspect-ratio: 4 / 5; border: 1px solid #27272a; border-radius: 1.75rem; }
.dbs-trail-photo--forest img { object-position: center 54%; }
.dbs-setup-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(2rem, 5vw, 5rem); margin-top: 4rem; border-block: 1px solid #27272a; background: #09090b; }
.dbs-setup-story__copy { padding: 2rem 0; }
.dbs-setup-story h3 { margin: 1.25rem 0; font-size: clamp(1.9rem, 3vw, 3rem); line-height: 1.05; font-weight: 900; letter-spacing: -.025em; text-transform: uppercase; }
.dbs-setup-story h3 em { color: #ef4444; font-style: normal; }
.dbs-setup-story p { max-width: 34rem; margin: 0; color: #d4d4d8; line-height: 1.85; }
.dbs-trail-photo--rider { aspect-ratio: 4 / 5; }
.dbs-trail-photo--rider img { object-position: center 65%; }
.dbs-trail-photo--rider::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #09090b, transparent 14%), linear-gradient(0deg, #09090b, transparent 10%, transparent 95%, #09090b); }
.dbs-story-layout { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 2rem; align-items: center; }
.dbs-trail-photo--summit { aspect-ratio: 4 / 3; }
.dbs-trail-photo--summit img { object-position: center 64%; }
.dbs-trail-photo--summit::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #09090b, transparent 12%), linear-gradient(0deg, #09090b, transparent 10%, transparent 94%, #09090b); }
.dbs-panorama-cta { isolation: isolate; }
.dbs-panorama-cta > .dbs-panorama-cta__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: -2; }
.dbs-panorama-cta::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(180deg, #09090b, rgba(9,9,11,.12) 24%, rgba(9,9,11,.12) 76%, #09090b); }
.dbs-panorama-cta .cta-panel { background: rgba(9,9,11,.8); border-color: rgba(161,161,170,.32); }
@media (max-width: 1023px) {
  .dbs-story-layout { grid-template-columns: 1fr; }
  .dbs-trail-photo--summit { width: 100%; max-width: 800px; margin-inline: auto; }
  .dbs-trail-photo--summit::after { background: linear-gradient(0deg, #09090b, transparent 8%, transparent 96%, #09090b); }
}
@media (max-width: 767px) {
  .dbs-photo-intro, .dbs-setup-story { grid-template-columns: 1fr; gap: 1.75rem; }
  .dbs-photo-intro { margin-bottom: 2.5rem; }
  .dbs-photo-intro__copy { grid-row: 1; }
  .dbs-trail-photo--forest { margin-inline: auto; border-radius: 1.25rem; }
  .dbs-setup-story { margin-top: 2.5rem; padding-top: 1.75rem; }
  .dbs-setup-story__copy { padding: 0; }
  .dbs-trail-photo--rider { width: 100%; max-width: 540px; margin-inline: auto; aspect-ratio: 3 / 4; }
  .dbs-trail-photo--rider::after { background: linear-gradient(0deg, #09090b, transparent 6%, transparent 96%, #09090b); }
  .dbs-story-layout { gap: 1rem; }
  .dbs-panorama-cta { padding-top: 12rem; }
  .dbs-panorama-cta > .dbs-panorama-cta__image { height: 17rem; object-position: 48% center; }
  .dbs-panorama-cta::before { height: 17rem; bottom: auto; background: linear-gradient(180deg, #09090b, transparent 12%, transparent 48%, #09090b); }
  .dbs-panorama-cta .cta-panel { padding: 2.5rem 1.1rem; border-radius: 1.5rem; background: rgba(9,9,11,.93); }
}