@media (max-width : 900px) {
  main {
    padding: 0;
    row-gap: 0;
    margin-bottom: 5rem; } }

.featurerow {
  grid-column: 1/16;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: auto;
  height: calc((100vw - (2 * var(--pm))) * 0.470588235); }
  @media (max-width : 900px) {
    .featurerow {
      grid-template-columns: repeat(1, 1fr); } }
  .featurerow > * {
    grid-row: 1; }
  @media (max-width : 900px) {
    .featurerow {
      grid-template-columns: repeat(1, 1fr);
      height: calc((100vw - (2 * var(--ph))) * 1.41492); }
      .featurerow:nth-of-type(even) .mobile-graphic {
        grid-column: 1/5; }
      .featurerow:nth-of-type(even) a {
        grid-column: 1/5; }
      .featurerow:nth-of-type(odd) .headline h2 {
        right: auto;
        left: var(--ph); }
      .featurerow:nth-of-type(odd) .headline .mobile-graphic {
        grid-column: 2/6; }
      .featurerow:nth-of-type(odd) .headline a {
        grid-column: 2/6; } }
h2 {
  font-family: 'SoehneBreit';
  letter-spacing: 0.2em;
  font-weight: normal;
  font-size: var(--fl);
  text-transform: uppercase;
  position: absolute;
  transform: rotate(180deg);
  writing-mode: vertical-rl; }
  @media (max-width : 900px) {
    h2 {
      font-size: 1.75rem; } }
  @media (max-width: 1050px) {
    h2 {
      height: min-content; } }
.headline {
  position: relative;
  padding: var(--ss);
  display: flex;
  justify-content: flex-end;
  align-items: flex-end; }
  .headline h2 {
    right: var(--ss);
    top: var(--pm); }
  .headline a span {
    border-bottom: 1px solid currentColor;
    padding-bottom: 0.8em; }
  .headline .mobile-graphic {
    display: none; }
  @media (max-width : 900px) {
    .headline {
      position: relative;
      grid-template-columns: repeat(15, 1fr);
      grid-auto-rows: auto;
      display: grid;
      column-gap: var(--ph);
      row-gap: 1em !important;
      padding: var(--ph) var(--ph) var(--pm);
      align-items: flex-start;
      grid-template-rows: 0fr; } }
  @media (max-width : 900px) and (max-width : 900px) {
    .headline {
      grid-template-columns: repeat(5, 1fr);
      row-gap: var(--pm); } }
  @media (max-width : 900px) {
      .headline h2 {
        right: var(--ph);
        height: max-content;
        grid-row: 1/3;
        top: 0; }
      .headline a {
        grid-column-end: span 3;
        grid-row: 2; }
      .headline .mobile-graphic {
        display: block;
        grid-row: 1; }
        .headline .mobile-graphic .aspectholder[data-orientation="portrait"] {
          padding-bottom: 142.8030303%; }
        .headline .mobile-graphic .aspectholder[data-orientation="landscape"] {
          padding-bottom: 70.77747989%; } }
.featuredcard {
  position: relative; }
  .featuredcard .aspectholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: initial;
    z-index: 1;
    opacity: 1;
    transition: opacity var(--timing); }
    .featuredcard .aspectholder img {
      position: absolute;
      top: 0;
      left: 0;
      object-fit: cover;
      object-position: center;
      height: 100%;
      width: 100%; }
  @media (max-width : 900px) {
    .featuredcard {
      display: none; } }
@media (min-width : 900px) {
  [single] .headline[left] {
    grid-column: 1; }
  [single] .headline[center] {
    grid-column: 2; }
  [single] .headline[right] {
    grid-column: 3; }
  [single] .featuredcard[left] {
    grid-column: 1; }
  [single] .featuredcard[center] {
    grid-column: 2; }
  [single] .featuredcard[right] {
    grid-column: 3; }
  [double][left] .headline {
    grid-column: 1; }
  [double][left] .featuredcard {
    grid-column: 2/4; }
  [double][right] .headline {
    grid-column: 3; }
  [double][right] .featuredcard {
    grid-column: 1/3; }
  [doubledouble][left] .headline {
    grid-column: 1; }
  [doubledouble][left] .featuredcard.one {
    grid-column: 2; }
  [doubledouble][left] .featuredcard.two {
    grid-column: 3; }
  [doubledouble][center] .headline {
    grid-column: 2; }
  [doubledouble][center] .featuredcard.one {
    grid-column: 1; }
  [doubledouble][center] .featuredcard.two {
    grid-column: 3; }
  [doubledouble][right] .headline {
    grid-column: 3; }
  [doubledouble][right] .featuredcard.one {
    grid-column: 1; }
  [doubledouble][right] .featuredcard.two {
    grid-column: 2; } }