/* ==========================================================================
   Editorial-Sektionen: Hero-Slider, Statement, Leistungen, Bruch, Anker, CTA
   ========================================================================== */

/* ---- Hero-Slider (vollflächig, Text-Overlay unten links) ---- */
.hero-slider{
  position: relative;
  min-height: 640px;
  height: 92vh;
  max-height: 980px;
  overflow: hidden;
  background: var(--ink);
}
.hero-slider__slide{
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 900ms var(--ease-out);
}
.hero-slider__slide.is-active{ opacity: 1; z-index: 1; }
.hero-slider__slide img{
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
}
.hero-slider::after{
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to top, oklch(10% 0.01 55 / 0.82) 0%, oklch(10% 0.01 55 / 0.25) 42%, transparent 68%);
  z-index: 2;
  pointer-events: none;
}
.hero-slider__content{
  position: absolute;
  left: 0; right: 0; bottom: 0;
  z-index: 3;
  padding: var(--space-md) var(--gutter) var(--space-lg);
  color: var(--paper);
}
.hero-slider__content-inner{ max-width: 46rem; }
.hero-slider__eyebrow{ color: var(--brass); }
.hero-slider__title{
  font-size: var(--step-5);
  color: var(--paper);
  margin-top: 0.5rem;
}
.hero-slider__subtitle{
  font-size: var(--step-0);
  color: oklch(92% 0.02 80);
  margin: 1rem 0 1.75rem;
  max-width: 46ch;
}
.hero-slider__actions{ display: flex; gap: 1rem; flex-wrap: wrap; }

.hero-slider__nav{
  position: absolute;
  right: var(--gutter);
  bottom: var(--space-md);
  z-index: 4;
  display: flex;
  gap: 0.6rem;
}
.hero-slider__dot{
  width: 34px; height: 3px;
  background: oklch(100% 0 0 / 0.35);
  border: none;
  cursor: pointer;
  padding: 0;
  transition: background var(--dur-med) var(--ease-out);
}
.hero-slider__dot.is-active{ background: var(--brass); }

@media (max-width: 600px){
  .hero-slider{ height: 82vh; min-height: 560px; }
  .hero-slider__content{ padding: var(--space-sm) 1.25rem var(--space-md); }
  .hero-slider__nav{ right: 1.25rem; bottom: 1.5rem; }
}

/* ---- Editorial-Statement (abwechselnd links/rechts) ---- */
.editorial{ padding-block: var(--space-xl); }
.editorial__label{ grid-column: 1 / span 3; }
.editorial__text{ grid-column: 5 / span 8; }
.editorial__text h2{ margin-bottom: 1.1rem; }
.editorial__text p{ font-size: var(--step-1); color: var(--text-muted); max-width: 58ch; }

.editorial--right{ text-align: right; }
.editorial--right .editorial__label{ grid-column: 10 / span 3; justify-self: end; }
.editorial--right .editorial__text{ grid-column: 1 / span 8; text-align: right; margin-left: auto; }
.editorial--right .eyebrow{ flex-direction: row-reverse; }

@media (max-width: 900px){
  .editorial{ padding-block: var(--space-md); }
  .editorial__label,
  .editorial--right .editorial__label{ grid-column: 1 / -1; justify-self: start; }
  .editorial__text,
  .editorial--right .editorial__text{ grid-column: 1 / -1; text-align: left; margin-left: 0; }
  .editorial--right{ text-align: left; }
  .editorial--right .eyebrow{ flex-direction: row; }
}

/* ---- Leistungen: versetztes Raster ---- */
.services-section{ padding-block: var(--space-lg); }
.services-section__head{ grid-column: 1 / span 6; margin-bottom: var(--space-sm); }
.services-grid{ grid-column: 1 / -1; }

.service-card{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}
.service-card__media{
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: var(--bg-dim);
}
.service-card__media img{ width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease-out); }
.service-card:hover .service-card__media img{ transform: scale(1.045); }
.service-card__index{
  font-family: var(--font-display);
  font-size: var(--step--1);
  color: var(--accent);
  letter-spacing: 0.08em;
}
.service-card__title{ font-size: var(--step-2); }
.service-card__title a{ text-decoration: none; }
.service-card__title a:hover{ color: var(--accent); }
.service-card p{ color: var(--text-muted); }
.service-card__link{
  font-size: var(--step--1);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  border-bottom: 1px solid var(--accent);
  padding-bottom: 0.2em;
  align-self: flex-start;
  transition: gap var(--dur-med) var(--ease-out);
}
.service-card__link:hover{ gap: 0.85em; }

.services-grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(1.5rem, 3vw, 3rem) clamp(1.5rem, 3vw, 3rem);
}
.service-card:nth-child(1){ grid-column: 1 / span 5; }
.service-card:nth-child(2){ grid-column: 7 / span 6; margin-top: var(--space-md); }
.service-card:nth-child(3){ grid-column: 2 / span 5; }
.service-card:nth-child(4){ grid-column: 8 / span 5; margin-top: calc(-1 * var(--space-sm)); }

@media (max-width: 900px){
  .services-section__head{ grid-column: 1 / -1; }
  .service-card,
  .service-card:nth-child(1),
  .service-card:nth-child(2),
  .service-card:nth-child(3),
  .service-card:nth-child(4){ grid-column: 1 / -1; margin-top: 0; }
}

/* ---- Bewusster Bruch: vollflächiges Bild ---- */
.fullbleed-break{
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  height: min(72vh, 640px);
  min-height: 420px;
  overflow: hidden;
  margin-block: var(--space-xl);
}
.fullbleed-break img{ width: 100%; height: 100%; object-fit: cover; }
.fullbleed-break__caption{
  position: absolute;
  right: var(--gutter);
  bottom: var(--space-sm);
  max-width: 26rem;
  text-align: right;
  color: var(--paper);
  z-index: 2;
}
.fullbleed-break__caption .eyebrow{ color: var(--brass); flex-direction: row-reverse; justify-content: flex-end; }
.fullbleed-break__caption p{ font-size: var(--step-1); font-family: var(--font-display); margin-left: auto; }
.fullbleed-break::after{
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to top, oklch(10% 0.01 55 / 0.7), transparent 55%);
}

@media (max-width: 600px){
  .fullbleed-break{ height: 52vh; min-height: 340px; margin-block: var(--space-md); }
  .fullbleed-break__caption{ right: 1.25rem; bottom: 1.25rem; text-align: right; }
}

/* ---- Lokaler Anker: Text + versetztes Bild ---- */
.anchor-section{ padding-block: var(--space-lg); }
.anchor-section__text{ grid-column: 1 / span 6; align-self: center; }
.anchor-section__facts{ display: flex; gap: var(--space-sm); margin-top: var(--space-sm); flex-wrap: wrap; }
.anchor-fact{ border-left: 1px solid var(--accent); padding-left: 1rem; }
.anchor-fact dt{ font-size: var(--step--1); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.06em; margin: 0; }
.anchor-fact dd{ font-family: var(--font-display); font-size: var(--step-1); color: var(--ink); margin: 0.2rem 0 0; }
.anchor-section__media{
  grid-column: 7 / span 6;
  aspect-ratio: 4 / 5;
  margin-top: var(--space-md);
  overflow: hidden;
  background: var(--bg-dim);
}
.anchor-section__media img{ width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 900px){
  .anchor-section__text,
  .anchor-section__media{ grid-column: 1 / -1; margin-top: var(--space-sm); }
}

/* ---- CTA-Streifen ---- */
.cta-strip{
  background: var(--ink);
  color: var(--paper);
  padding-block: var(--space-md);
}
.cta-strip__grid{ align-items: center; }
.cta-strip__text{ grid-column: 1 / span 7; }
.cta-strip__text h2{ color: var(--paper); }
.cta-strip__actions{
  grid-column: 9 / span 4;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1rem;
}
.cta-strip__phone{
  font-family: var(--font-display);
  font-size: var(--step-2);
  color: var(--paper);
  text-decoration: none;
}
.cta-strip__phone:hover{ color: var(--brass); }

@media (max-width: 900px){
  .cta-strip__text, .cta-strip__actions{ grid-column: 1 / -1; align-items: flex-start; text-align: left; }
}
