/* ============================================================
   O projektu — besedilna stran (obe spletišči)

   Leži v assets/ in ne pri strani: isto stran imata MaliGenij in
   Glasbeni MaliGenij, in assets/ je edina mapa, ki jo poddomena
   bere iz korena (glej seznam izjem v .htaccess). Prvi poskus je
   pustil slog pri glasbeni strani, glavna pa ga je vlekla iz
   ../glasba/projekt/ — kar je delovalo, a je glavno spletišče
   vezalo na mapo, ki ni njegova.

   Edina stran spletišča, ki je namenjena BRANJU in ne igranju.
   Zato ima drugačna pravila kot vse druge: širina po vrstici in
   ne po zaslonu, ozadje pod besedilom in dovolj zraka med
   odstavki.
   ============================================================ */

/* Vrstica, dolga čez ves zaslon, se bere slabo: oko na koncu
   vrstice ne najde začetka naslednje. 62 znakov je mera, ki jo
   priporočajo za daljše besedilo, in približno toliko jih gre v
   34rem pri tej pisavi. */
.proza {
  max-width: 34rem;
  margin: 0 auto;
  padding: 4px 0 12px;
}

/* Bela ploskev pod besedilom: podlaga strani nosi štiri barvne
   prelive in črnilo na njej ni enako berljivo povsod. */
.proza h2,
.proza p {
  background: rgba(255, 255, 255, .72);
}
.proza h2 {
  margin: 0;
  padding: 16px 20px 2px;
  border-radius: var(--radius) var(--radius) 0 0;
  font-size: 1.08rem;
  font-weight: 800;
  color: var(--ink);
}
.proza p {
  margin: 0 0 14px;
  padding: 6px 20px 16px;
  border-radius: 0 0 var(--radius) var(--radius);
  font-size: .98rem;
  line-height: 1.62;
  color: var(--ink-soft);
}
/* Dva odstavka pod istim naslovom bereta kot ENA ploskev.

   Prvi poskus je le potegnil drugi odstavek navzgor, a je zgornji
   obdržal zaokrožen spodnji rob in svoj notranji odmik — med
   njima je ostal viden šiv in "Stik" je bil videti kot dve
   kartici namesto ena.

   Zato zgornjemu odstavku vzamemo zaokrožitev in spodnji odmik,
   ne pa spodnjemu zgornjo. Kjer :has() ni na voljo, ostaneta dve
   ploskvi — kar je bilo stanje prej in ni napaka. */
.proza p:has(+ p) {
  border-radius: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}
.proza p:has(+ p)::after {
  content: '';
  display: block;
  height: 14px;
}

.proza .posta {
  color: var(--grape-d);
  font-weight: 700;
  word-break: break-word;
}
.proza-nazaj {
  background: none !important;
  padding: 6px 20px 0 !important;
  margin-top: 6px !important;
}
.proza-nazaj a { color: var(--grape-d); font-weight: 700; }

@media (max-width: 560px) {
  .proza h2 { padding: 13px 15px 2px; }
  .proza p { padding: 6px 15px 13px; }
  .proza-nazaj { padding: 6px 15px 0 !important; }
}