/*
Theme Name: Sticky Aside Starter
Theme URI: https://example.com/sticky-aside-starter
Author: ChatGPT
Author URI: https://example.com
Description: Helles Layout mit sticky Aside, mobilem Hamburger-Overlay, zentriertem Container (Aside+Main als Einheit), anpassbaren Farben, Header-Hintergrundbild. Paragraph-Gruppierung nach Überschriften (Pages). Noto Serif (Titel), Noto Sans (Text).
Version: 1.2.2
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: sticky-aside
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

:root{
  --aside-w: 280px;
  --radius: 14px;
  --header-h: 64px;
  --footer-h: 56px;
  --sticky-offset: 0px;
  --container-w: 1200px;

  --bg: #f7f8fb;
  --panel: #ffffff;
  --panel-2: #f3f5f9;
  --text: #1a1f36;
  --muted: #5b6477;
  --border: #dce3ef;
  --link: #2563eb;
  --shadow: 0 10px 25px rgba(18,42,80,.08);

  --header-bg: var(--panel);
  --header-text: var(--text);
  --main-bg: transparent;
  --main-text: var(--text);
  --aside-bg: var(--panel);
  --aside-text: var(--text);
  --footer-bg: var(--panel);
  --footer-text: var(--muted);
}

*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:'Noto Sans',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";
  line-height:1.6;
  color:var(--text);
}

h1,h2,h3,h4,h5,h6,.brand{font-family:'Noto Serif',Georgia,'Times New Roman',serif}
a{
  /* color:var(--link); */
  color: rgb(58, 58, 150);
  text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid #5d9aff;outline-offset:2px}

/* Header */
.site-header{
  position:relative;top:0;z-index:60;height:var(--header-h);
  display:flex;align-items:center;gap:.75rem;padding:0 1rem;
  background:#ffffffaa; color:var(--header-text);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px); 
  border-bottom:1px solid var(--border);
  background-size:cover;background-position:center;background-repeat:no-repeat;
  box-shadow: 1px 5px 8px 0px rgba(0,0,0,0.15);
  margin-bottom: 5px; 
}
.site-header a{color:inherit}
.brand{font-weight:700;letter-spacing:.2px}
.spacer{flex:1}
.hamburger{display:none;border:1px solid var(--border);background:var(--panel-2);border-radius:12px;padding:.5rem .625rem;cursor:pointer}
.hamburger svg{display:block;width:24px;height:24px}

/* Sprachmenü */
.lang-nav{display:flex;gap:.5rem;align-items:center}
.lang-nav ul{display:flex;gap:.5rem;list-style:none;margin:0;padding:0}
.lang-nav a{padding:.35rem .55rem;border-radius:8px;border:1px solid transparent}
.lang-nav .current-menu-item>a{background:#eef2ff;border-color:#c7d2fe}
.current-lang a { border-radius: 25%; background-color: rgba(30, 30, 100, 0.946); color: white; }
.lang-item a:hover { border-radius: 25%; background-color: rgba(50, 50, 120, 0.946); color: white; }

/* Footer */
.site-footer{
  background:var(--footer-bg);color:var(--footer-text);
  border-top:1px solid var(--border);min-height:var(--footer-h);
  display:grid;place-items:center;padding:.75rem 1rem;
}

/* Layout: Aside + Main zentriert als Einheit */
.layout{
  display:grid !important;
  grid-template-columns: var(--aside-w) minmax(0,1fr);
  min-height:calc(100dvh - var(--header-h) - var(--footer-h));
  width:min(100% - 2rem, var(--container-w));
  margin-inline:auto;
}
.layout>aside,.layout>main{min-width:0}

/* Aside */
aside#seitenmenue{
  position:sticky;
  margin-top:4.3rem;
  /* top:var(--sticky-offset); */
  align-self:start;
  height:calc(100dvh - var(--sticky-offset));
  overflow-y:auto;
  background
  /* background:var(--aside-bg); */
  color:var(--aside-text);
  padding:0 15px;
}


aside#seitenmenue a{color:inherit}
nav.aside-nav h2{margin:0 0 .75rem;font-size:.95rem;font-weight:700;letter-spacing:.3px;color:var(--muted);text-transform:uppercase}
nav.aside-nav ul{list-style:none;padding:0;margin:0;display:grid;gap:.25rem}
nav.aside-nav ul { background: rgba(255, 255, 255, 0.65);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px); 
box-shadow: 10px 10px 15px -7px rgba(123, 123, 123, 0.2);
border-radius: 10px ;
border: 1px solid #00000055;
}
nav.aside-nav li a{display:block;padding:.4rem .75rem;border-radius:10px;color:inherit;border:1px solid transparent}
nav.aside-nav li a:hover{ background:#25223e22; }
nav.aside-nav li.current-menu-item>a,nav.aside-nav li.current_page_item>a{
  /* background:#eef2ff;border-color:#c7d2fe */
  font-weight:700;
}

/* Main */
main#content{
  min-width:0;padding:1rem;display:grid;gap:1.25rem;
  background:var(--main-bg);color:var(--main-text);
}
/* Cards */
.card{
  background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);
  padding:0rem 1.5rem 1rem 1.5rem;box-shadow:var(--shadow);
	background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px); 
  margin-bottom: 2rem;
  max-width:750px;width:100%;margin-inline:auto;
}
.entry .card p{margin:0 0 .9rem}
.entry .card p:last-child{margin-bottom:0}
.card strong { color: rgb(96, 100, 150); }
.card:last-child { margin-bottom: 3rem; }


/* Mobile Overlay-Menü */
.menu-close{display:none}
@media (max-width:768px){
  .layout{grid-template-columns:1fr}
  .hamburger{display:inline-flex}
  :root{--sticky-offset:0px}
  main#content{
  min-width:0;padding:0rem;display:grid;gap:1.25rem;
  }
  aside#seitenmenue{
    margin-top: 2rem;
    position:fixed;inset:0;width:100vw;height:100dvh;transform:translateX(-100%);
    transition:transform .25s ease;z-index:1500;padding:1.25rem;
  }
nav.aside-nav ul { background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px); 
}
  body.menu-open aside#seitenmenue{transform:translateX(0)}
  .backdrop{position:fixed;inset:0;background:rgba(255, 255, 255, 0.35);z-index:1400;display:none}
  body.menu-open .backdrop{display:block}
  .menu-close{
    display:inline-flex;position:absolute;top:28px;right:30px;border:1px solid var(--border);
    background:var(--panel-2);border-radius:12px;padding:.5rem;cursor:pointer;
    z-index: 200;
  }
  .menu-close svg{width:22px;height:22px;display:block}
  nav.aside-nav li a{padding:.875rem 1rem;font-size:1.05rem}
  body.menu-open .site-header{visibility:hidden;pointer-events:none}
}

.wp-block-table td {
	border: none;
	padding: 3px 10px 3px 0;
} 

.rightcardimg figure {
	max-width: 200px;
	width: 40%;
	padding-top: 10px;
}
.rightcardimg img { 
	filter: contrast(50%) brightness(200%) sepia(100%) hue-rotate(180deg); }

/* Desktop: sticky Offset */
@media (min-width:769px){
  :root{--sticky-offset:var(--header-h)}
  .hamburger{display:none!important}
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){*{transition:none!important}}


/* Unframed page title, aligned to card width */
.page-title{
  max-width:750px;width:100%;
  margin-inline:auto;
  padding:0 1.5rem;
}
.page-title h1{margin:0; text-shadow: 0 0 15px rgb(255, 255, 255), 0 0 8px rgb(255, 255, 255),
	0 0 18px rgb(255, 255, 255), 0 0 10px rgb(255, 255, 255); }