@charset "UTF-8";

/* silesianfolkbelief.com — shared stylesheet
   Deckt Startseite, Clusterseiten und Eintragsseiten ab.
   Überarbeitet nach dem Grenzland-Leseprobenlayout: großzügigerer
   Zeilenabstand und Blocksatz für ruhigeren Lesefluss bei den
   längeren Quellentexten und Übersetzungen. */

/* ---------- Schriften ---------- */

@font-face{
  font-family:'Grenze Gotisch';
  src:url('/fonts/grenzegotisch-regular.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:'Noto Serif';
  src:url('/fonts/notoserif-regular.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

/* ---------- Grundlagen ---------- */

:root{
  --bg:#F5F1E8;
  --txt:#1a1a1a;
  --link:#5a3a1a;
  --visited:#6d6440;
  --line:#1a1a1a;
  --muted:#5a5a5a;
}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  -webkit-text-size-adjust:none;
}

body{
  background:var(--bg);
  color:var(--txt);
  font-family:'Times New Roman', Times, Georgia, serif;
  font-size:1.05rem;
  font-weight:400;
  line-height:1.75rem;
  letter-spacing:0.01rem;
  text-align:left;
}

/* Volle Breite auf schmalen Geraeten, ab ca. 640px feste Textspalte. */
#site{
  width:100%;
  max-width:38rem;
  margin:1rem auto;
  padding:0 1.25rem;
}
.head{
  padding:1rem 0 2rem;
}
.head-nav{
  padding-top:0.6rem;
  font-size:0.75rem;
  letter-spacing:0.02rem;
}

/* ---------- Textebene ---------- */

h1{
  font-family:'Grenze Gotisch', 'Times New Roman', serif;
  font-size:2.6rem;
  line-height:2.8rem;
  letter-spacing:0.06rem;
  font-weight:400;
  margin:0 auto 0.2em auto;
  overflow-wrap:anywhere;
  text-align:center;
}

h2{
  font-size:1.1rem;
  line-height:1.9rem;
  letter-spacing:0.08rem;
  font-weight:600;
  text-transform:uppercase;
}

h3{
  display:inline-block;
  padding:0.75rem 0 0.25rem;
  font-size:1rem;
  line-height:1.5rem;
  letter-spacing:0.08rem;
  font-weight:400;
  text-transform:uppercase;
}

p{
  padding-bottom:1rem;
  text-align:justify;
  hyphens:auto;
}

em{
  font-style:italic;
}

/* ---------- Bausteine ---------- */

.subpages{
  display:block;
  text-align:center;
}

/* Untertitel unter h1. */
.caption{
  padding-top:0.4rem;
  padding-bottom:0;
  font-size:0.9rem;
  font-style:italic;
  letter-spacing:0.01rem;
  text-align:center;
  color:var(--muted);
}

.masthead-info{
  margin-top:1.5rem;
  padding:0.4rem 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:0.5rem;
  font-size:0.7rem;
  letter-spacing:0.03rem;
  text-transform:uppercase;
}
.masthead-info .center{
  text-align:center;
  flex:1;
}

/* Rahmen links: Quellenangabe, Selbstbeschreibung, Lizenzhinweis. */
.meta{
  border-left:3px solid var(--txt);
  padding-left:0.75rem;
  margin:0.5rem 0 1rem 0;
}

.meta p{
  text-align:left;
}

.sector{
  padding:1rem 0;
}

/* Linkzeile, durch Bullet getrennt. \2022 = U+2022, encodingsicher. */
.links a:not(:last-child)::after{
  content:" \2022 ";
  color:var(--txt);
}

/* Neueste Eintraege: Datum links, Titel rechts. */
.latest{
  list-style:none;
  margin:0;
}

.latest li{
  padding-bottom:0.5rem;
}

.latest time{
  display:inline-block;
  min-width:6rem;
  color:var(--muted);
}

/* ---------- Quellentexte ---------- */

/* Deutsche Quellen: gebrochene Schrift.
   Keine .caption in diesen Abschnitt setzen - die Regel greift auf alle p. */
.fraktur p{
  font-family:'Grenze Gotisch', serif;
  font-size:1.2rem;
  line-height:2rem;
  letter-spacing:0.02rem;
  font-weight:400;
  text-align:justify;
  hyphens:manual;
  padding-bottom:0.9rem;
}

/* Polnische und schlesische Quellen: Antiqua.
   Noto Serif wegen der phonetischen Diakritika. */
.antiqua p{
  font-family:'Noto Serif', Georgia, serif;
  font-size:1.05rem;
  line-height:1.9rem;
  font-weight:400;
  text-align:justify;
  hyphens:auto;
  padding-bottom:0.9rem;
}

/* ---------- Abbildungen ---------- */

/* Rapid Sketches. Immer mit width/height im HTML, sonst springt das Layout. */
figure{
  margin:1.25rem 0;
}

img{
  display:block;
  width:100%;
  height:auto;
}

figcaption{
  padding-top:0.4rem;
  font-size:0.75rem;
  line-height:1.2rem;
  text-transform:uppercase;
  color:var(--muted);
}

/* ---------- Links und Fuss ---------- */

a{
  color:var(--link);
  text-decoration:none;
  font-weight:inherit;
}

a:hover,
a:focus{
  text-decoration:underline;
}

a:visited{
  color:var(--visited);
}

.foot{
  text-align:center;
  padding:1.25rem 0 0.5rem 0;
  font-size:0.75rem;
  color:var(--muted);
}

ul{
  margin:0.3rem 0 0.9rem 1rem;
  list-style:"\00BB  ";
  list-style-position:outside;
}

li{
  padding-bottom:0.3rem;
}

.latest{
  list-style:none;
  margin:0;
}