/* Inline styles extracted from dacht.njk */
#s-dacht .gp-section__inner {
  --gp-section-pt: 0px;
  --gp-section-pb: 120px;
}



#s-dacht .gp-spacer {
  --gp-height: 30px;
}

/* Section-specific styles extracted from style.css */
@media (min-width: 769px) {
  .gp-dacht-flex-container {
    transform: translateY(-24%);
    max-width: 84%;
    margin: 0 auto;
  }
}

@media (min-width: 1024px) and (max-width: 1024px) {
  .gp-dacht-flex-container {
    transform: translateY(0%);
  }
}

@media (max-width: 1023px) {
  .gp-dacht-flex-container {
    flex-direction: column;
    gap: 0;
    width: 100%;
    max-width: 60%;
    margin-inline: auto;
    margin-top: 4vh;
  }

  /* Push the section's centered content below the floating G + DACHT text on
     every viewport. .gp-branding is position:absolute at top:0 with internal
     padding-top (font-size - 4.5rem) and a line-height-block of font-size *
     line-height, so DACHT's visible bottom = font-size * 1.83 - 4.5rem from
     section top. Setting section padding-top to that value (+ 24px breathing)
     guarantees the centered Lorem heading can never ride up into DACHT, even
     when 100svh shrinks to ~620px (iPhone 13 Pro Chrome). */
  #s-dacht .gp-section__inner {
    --gp-section-pt: calc(var(--gp-branding-font-size) * 1.83 - 4.5rem + 24px) !important;
  }
}

@media (max-width: 599px) {
  .gp-dacht-flex-container {
    max-width: 260px;
  }
}

@media (max-width: 767px) {
  .gp-dacht-flex-container .gp-heading {
    font-size: 2.9vmax;
  }
}

.gp-dacht-flex-item-container {
  width: 100%;
}

@media (min-width: 769px) {
  .gp-dacht-flex-item-container {
    max-width: 370px;
  }
}

/* Desktop: the screendesign runs the copy column full-bleed to the container's
   right edge at 460px wide. 120px of bottom padding pushed the section past
   100svh and broke the scroll-snap resting position. */
@media (min-width: 1000px) {
  #s-dacht .gp-section__inner {
    --gp-section-pb: 80px;
  }
  #s-dacht .gp-dacht-flex-container {
    /* `margin: 0 auto` from the 769px rule is an auto cross-axis margin inside
       .gp-section__inner's column flexbox, which suppresses the stretch and
       shrink-wrapped the row to its content. */
    max-width: 100%;
    width: 100%;
    margin-inline: 0;
    margin-top: -40px;
  }
  #s-dacht .gp-dacht-flex-item-container {
    width: 460px;
    max-width: 460px;
    flex: 0 0 460px;
  }
}