/* One statement, one screenful. The agency deck has no photographs and says so — so
   this block carries type and nothing else, and gets the room a picture would have had.
   Which face it wears is the site's business, as everywhere in these modules. */
[qcms-mod="cont.luca.slide"] {
  display: grid;
  place-items: center;
  /* svh, not vh: on a phone the browser chrome must not push the last line out of view.
     Standing in a cms.cont.luca.slides, the run decides how much room one statement gets;
     standing alone, this is the room. */
  min-height: var(--slide-height, 78svh);
  padding-block: clamp(2rem, 8vw, 5rem);
  text-align: center;

  /* Auf dem Telefon stand die Aussage bisher an der Kante — der Rand gehört zur Lesbarkeit,
     nicht zur Verzierung. Er sitzt am inneren Behälter und nicht an der Aussage selbst:
     im Karussell ist die Aussage ein Flex-Element, und was an ihr aussen anliegt, zählt
     dort in eine Summe, die den Slider zu breit macht (die Notiz in cms.cont.luca.slides
     erzählt es ganz). */
  > .u2-width { padding-inline: clamp(3rem, 6vw, 3.5rem) }

  .line {
    /* Grundgrösse statt Bildschirmbreite: mit reinem `7.5vw` fiel die Aussage auf einem
       Telefon auf den Boden von 2rem und wirkte dort klein. Der Anstieg ist jetzt flacher
       (`3.4vw`), die Basis dafür höher — auf dem grossen Bildschirm bleibt es, wie es war. */
    font-size: clamp(2.5rem, 1.7rem + 3.4vw, 4.5rem);
    line-height: 1.05;
    text-wrap: balance; /* a statement broken into ragged lines reads as an accident */

    /* In dieser Grösse ist ein deutsches Wort schnell breiter als ein Telefon — und die
       Breite eines solchen Wortes ist es, aus der sich die min-content-Breite der Aussage
       ergibt. Im fade-Karussell hängt daran mehr als der Zeilenumbruch: der Slot im Shadow
       DOM steht auf `min-width: auto` und wächst mit dieser Zahl mit (siehe die Notiz in
       cms.cont.luca.slides). Darum beides — `auto` trennt an den Silben, `anywhere` ist der
       Notausgang für ein Wort, das auch das nicht rettet, und nur diese Fassung zählt für
       die min-content-Breite (`break-word` täte es nicht). */
    hyphens: auto;
    overflow-wrap: anywhere;
  }

  .line :is(p, h1, h2) {
    font-size: inherit;
    line-height: inherit;
    margin: 0;
  }

  [qcms-name=actions] {
    margin-top: clamp(1.5rem, 4vw, 2.5rem);

    p { margin: 0 }
  }

  /* A statement after a statement needs a breath between them, not a rule. */
  & + [qcms-mod="cont.luca.slide"] {
    border-top: 1px solid color-mix(in srgb, currentColor, transparent 88%);
  }
}
