/* MEISTER federleicht – Fehlerseite (404) im Design "Papier & Bernstein" (27.10.2026)
   Wird nur von error.php geladen und wirkt ausschließlich auf html.error-page */
@import url('https://fonts.bunny.net/css?family=cormorant-garamond:500,500i,600,600i|lora:400,400i,600&display=swap');

html.error-page,
html.error-page body {
  height: auto !important;
  min-height: 100%;
  background: #FBF7F0 !important;
  background-image: none !important;
}
html.error-page body {
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  margin: 0;
  padding: 48px 20px;
  color: #2E2621;
  font-family: 'Lora', Georgia, serif;
  font-size: 18px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
html.error-page body > .container {
  position: static !important;
  transform: none !important;
  top: auto !important;
  max-width: 640px;
  width: 100%;
  margin: 0 auto;
  padding: 56px 40px 52px;
  text-align: center;
  background: #FFFDF9;
  border: 1px solid #E7DCCB;
  border-radius: 14px;
  box-shadow: 0 18px 50px -30px rgba(46, 38, 33, .35);
}
/* Logo oben */
html.error-page body > .container::before {
  content: "";
  display: block;
  width: 260px;
  max-width: 80%;
  height: 120px;
  margin: 0 auto 28px;
  background: url('/images/2023/12/07/meisterfederleicht-logo.png') center / contain no-repeat;
}
html.error-page .error-code {
  margin: 0 0 4px;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-style: italic;
  font-weight: 500 !important;
  font-size: 120px !important;
  line-height: 1 !important;
  letter-spacing: .02em;
  color: #C47A1C !important;
}
html.error-page .error-message {
  margin: 0 0 12px;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 500 !important;
  font-size: 34px !important;
  line-height: 1.2 !important;
  color: #2E2621 !important;
}
html.error-page .error-message::after {
  content: "Diese Seite gibt es leider nicht (mehr). Vielleicht hat sich die Adresse geändert – auf der Startseite findest du alle Beiträge.";
  display: block;
  max-width: 460px;
  margin: 18px auto 30px;
  padding-top: 22px;
  border-top: 1px solid #E7DCCB;
  font-family: 'Lora', Georgia, serif;
  font-size: 17px;
  line-height: 1.7;
  color: #75675B;
}
html.error-page .btn,
html.error-page .btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 13px 30px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #C47A1C !important;
  color: #fff !important;
  font-family: 'Lora', Georgia, serif;
  font-size: 15px !important;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background .2s, transform .2s;
}
html.error-page .btn:hover,
html.error-page .btn:focus-visible {
  background: #9A5512 !important;
  transform: translateY(-1px);
}
html.error-page .btn .fas { font-size: 14px; }
html.error-page .error-logo { display: none; }
@media (max-width: 575px) {
  html.error-page body > .container { padding: 40px 22px 38px; }
  html.error-page body > .container::before { height: 90px; margin-bottom: 20px; }
  html.error-page .error-code { font-size: 88px !important; }
  html.error-page .error-message { font-size: 28px !important; }
  html.error-page .error-message::after { font-size: 16px; }
}