/* Beitrag "Aspect Connect" – Layout wie im Original (1200px breite Bereiche, Spalten 2:1)
   + Smartphone-Rahmen (Original-CSS des Betreibers, ohne den globalen "* { margin:0; padding:0 }"-Reset). */

/* ---------- Bereiche: brechen aus der schmalen Lesespalte auf max. 1200px aus ---------- */
.prose .acn-band {
  --bw: min(1200px, calc(100vw - 2 * var(--gutter)));
  width: var(--bw);
  margin: clamp(90px, 80px + 3vw, 138px) 0 0 calc(50% - var(--bw) / 2);
}
.prose .acn-band:first-child { margin-top: 0; }

/* Typografie (Original: Absatz 22px/1.4, mobil ca. 18px; h2 32px/28px) */
.acn-copy p, .acn-copy li { font-size: clamp(18px, 16.5px + .4vw, 22px); line-height: 1.4; color: var(--ink); }
.acn-copy p { margin: 0 0 .9em; }
.acn-copy > :last-child, .acn-copy p:last-child { margin-bottom: 0; }
.prose .acn-title {
  margin: 0 0 .7em; color: var(--ink);
  font-size: clamp(28px, 26.5px + .4vw, 32px); font-weight: 700; line-height: 1.125; letter-spacing: -.01em;
}
.prose .acn-copy ul { margin: 0 0 .9em; padding-left: 1.3em; }
.prose .acn-copy li { margin: .35em 0; }
.prose .acn-copy li::marker { color: var(--ink); }
.prose .acn-copy a { color: var(--ink); font-weight: 700; text-decoration: underline; }
.prose .acn-copy a:hover { color: var(--accent-dark); }

/* Spalten (Original: 66,66 % / 33,33 %, Abstand 50px) */
.acn-cols { display: grid; gap: 30px; align-items: start; }
.acn-cols + p { margin-top: 1.2em; }
.prose .acn-figure { margin: 0; }
.prose .acn-figure img { width: 100%; height: auto; border-radius: 0; }
@media (min-width: 782px) {
  .acn-cols { column-gap: 50px; }
  .acn-cols--text-wide { grid-template-columns: 2fr 1fr; }
  .acn-cols--media-first { grid-template-columns: 1fr 2fr; }
  .acn-cols--media-wide { grid-template-columns: 1fr 2fr; margin-bottom: .2em; }
}

/* ---------- Smartphone-Rahmen ---------- */
.acn-phone { display: flex; justify-content: center; }
.acn-phone__frame {
  position: relative; width: 300px; max-width: 100%; padding: 10px; margin: 10px 0 30px;
  border-radius: 2.4rem;
  background: linear-gradient(180deg, #1c1c1c 0%, #111 100%);
  box-shadow: 0 14px 25px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .07);
}
.acn-phone__screen { position: relative; overflow: hidden; border-radius: 1.9rem; line-height: 0; }
.prose .acn-phone__screen img { display: block; width: 100%; height: auto; border-radius: 1.9rem; }
.acn-phone__btn { position: absolute; width: 3px; background: #2a2a2a; }
.acn-phone__btn--r1 { right: -3px; top: 28%; height: 52px; border-radius: 0 2px 2px 0; }
.acn-phone__btn--r2 { right: -3px; top: 42%; height: 36px; border-radius: 0 2px 2px 0; }
.acn-phone__btn--l1 { left: -3px; top: 26%; height: 40px; border-radius: 2px 0 0 2px; }
.acn-phone__btn--l2 { left: -3px; top: 38%; height: 40px; border-radius: 2px 0 0 2px; }