/*
Theme Name: Willkommenswelt Heiligenhaus
Theme URI: https://www.onboarding-heiligenhaus.de
Author: Projektvorlage
Description: Mobile Willkommenswelt mit geschuetztem Zugang und benutzerbezogenen Hinweisen. Vor dem produktiven Einsatz Datenschutz und Sicherheit pruefen.
Version: 0.11.0
Requires at least: 6.3
Requires PHP: 8.1
Text Domain: willkommenswelt-heiligenhaus
*/
:root{--navy:#0d3152;--ink:#213951;--muted:#526b7e;--green:#468626;--outline:#e5eae5;--paper:#f8faf7;--primary:#37761d}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--paper);color:var(--ink);font-size:16px;line-height:1.55}
button,input,textarea{font:inherit}a{color:#154e7c}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #f2ad16;outline-offset:3px}
.skip-link{position:absolute;top:-120px;left:10px;z-index:90;padding:10px;background:white}.skip-link:focus{top:10px}
.header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:10px;height:72px;background:#fff;border-bottom:1px solid var(--outline);padding:10px clamp(16px,4vw,28px)}
.logo{display:block;width:min(210px,54vw);max-height:50px;object-fit:contain;height:auto} .menu-button{border:0;border-radius:8px;background:#f0f5ef;padding:8px 12px;color:var(--navy)}
.site-nav{background:white;border-bottom:1px solid var(--outline);display:none;padding:12px 24px;position:sticky;top:72px;z-index:45;box-shadow:0 15px 24px #0001}.site-nav.is-open{display:block}.site-nav ul{padding:0;list-style:none;margin:0 auto;max-width:920px;display:flex;gap:10px;flex-wrap:wrap}.site-nav li a{display:block;padding:7px 10px;text-decoration:none;border-radius:8px}.site-nav a:hover{background:#eaf3e5}
main{min-height:50vh}.inner{max-width:860px;padding:30px 21px 45px;margin:0 auto}.hero{min-height:calc(100svh - 72px);display:flex;flex-direction:column}.hero-photo{flex:1;min-height:200px;position:relative;background:#e0ecda}.hero-photo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:48% 42%}.tagline{position:absolute;top:20px;left:20px;background:#fffdf5e8;color:var(--navy);padding:5px 11px;border-radius:20px;font-size:.75rem;font-weight:700;letter-spacing:.05em}
.hero-panel{background:white;position:relative;z-index:2;border-radius:24px 24px 0 0;margin:-24px 12px 0;padding:24px 21px 18px;box-shadow:0 -5px 15px #0001}.hero-panel h1{font-family:"Segoe Print","Comic Sans MS",cursive;font-size:clamp(29px,5vw,41px);line-height:1.15;margin:0 0 13px;color:#153a5e}.hero-panel h1 span{display:block;color:var(--green)}.hero-panel p{max-width:44ch;font-size:.91rem;margin:0 0 20px}
.cta{display:inline-block;min-height:44px;min-width:160px;text-decoration:none;text-align:center;padding:11px 20px;background:#468b25;color:white;border:0;border-radius:11px;font-weight:700}.cta:hover{background:#317218}.hero .cta{display:block;width:100%}.topics{scroll-margin-top:90px;padding:35px 18px 50px;max-width:890px;margin:auto}.kicker{font-size:.77rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#507d39;margin:0 0 5px}h2{color:var(--navy);line-height:1.2}.topics>h2{margin:0 0 8px;font-size:1.65rem}.topics .intro{margin:0 0 22px;color:var(--muted)}
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.tile{display:block;text-decoration:none;color:var(--ink);border:1px solid var(--outline);background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 18px #192b1912}.tile:hover{box-shadow:0 9px 22px #192b1924;transform:translateY(-1px)}.tile-photo{position:relative;background:#f3f9f0;aspect-ratio:1.55;display:flex;align-items:center;justify-content:center}.tile-photo img{width:100%;height:100%;object-fit:contain}.number{background:var(--accent);color:#fff;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;font-size:.84rem;font-weight:800}.tile .number{position:absolute;top:8px;left:8px}.tile-body{padding:12px}.tile-title{display:block;font-size:.97rem;font-weight:800;line-height:1.25}.tile-sub{display:block;font-size:.77rem;color:var(--muted);margin:4px 0 11px}.tile-link{font-size:.77rem;font-weight:700;color:#3d7d22}
.crumb{display:inline-block;margin-bottom:16px;text-decoration:none;font-weight:600;font-size:.9rem}.chapter-heading{display:flex;align-items:center;gap:12px;margin-bottom:16px}.chapter-heading h1{margin:0;font-size:clamp(1.5rem,5vw,2rem);color:var(--navy)}.chapter-heading p{margin:2px 0 0;font-size:.86rem;color:var(--muted)}.topic-cover{background:white;border-radius:17px;overflow:hidden;display:flex;align-items:center;justify-content:center;height:235px;border:1px solid var(--outline)}.topic-cover img{width:100%;height:100%;object-fit:contain}.article{margin-top:24px}.article h2{font-size:1.3rem;margin-top:25px}.article p{margin:12px 0}.article ul{padding-left:22px}.article li{margin:9px 0}.personal{border-left:4px solid var(--green);background:#edf6e7;padding:14px 17px;border-radius:0 10px 10px 0;margin:24px 0}.personal h2{font-size:1.12rem;margin:0 0 8px}.personal p{margin:0}.personal small{color:var(--muted)}
.login-wrap{max-width:520px;margin:0 auto;padding:42px 20px 60px}.login-card{border:1px solid var(--outline);background:#fff;border-radius:24px;padding:25px 23px;box-shadow:0 14px 40px #11271914}.login-card .lock-icon{font-size:34px;text-align:center;margin:0}.login-card h1{text-align:center;margin:5px 0 3px;color:var(--navy);font-size:2rem}.login-card>p{text-align:center;color:var(--muted);margin:8px auto 24px}.login-card label{display:block;font-weight:700;margin:10px 0 6px}.login-card input[type=text],.login-card input[type=password]{border:1px solid #b8c5bb;background:#fff;border-radius:10px;width:100%;padding:12px;min-height:44px}.login-card input[type=checkbox]{height:17px;width:17px;vertical-align:middle}.login-card input[type=submit]{background:#498b28;color:#fff;border:0;border-radius:10px;padding:13px;width:100%;cursor:pointer;font-weight:800}.login-card .login-remember label{font-weight:400}.login-card .login-submit{margin:14px 0 5px}.login-help{text-align:center;font-size:.88rem}.login-notice{background:#fff5db;padding:10px;border-radius:9px}
.site-footer{border-top:1px solid var(--outline);background:#fff;padding:21px;line-height:1.7;text-align:center;font-size:.85rem;color:var(--muted)}.site-footer a{display:inline-block;margin:0 9px}.site-footer .small{margin:8px 0 0;font-size:.76rem}.legal-draft{border-left:4px solid #b87c16;background:#fff5e2;padding:12px 16px}.article a{overflow-wrap:anywhere}
@media(min-width:700px){.tiles{grid-template-columns:repeat(3,minmax(0,1fr))}.hero{max-width:520px;margin:20px auto;border-radius:25px;overflow:hidden;border:1px solid var(--outline);box-shadow:0 15px 42px #122c1520;min-height:min(820px,calc(100svh - 113px))}.hero-panel{margin:-24px 12px 11px;border-radius:20px}.topics{padding-top:55px}.topic-cover{height:300px}}
@media(max-width:380px){.hero-panel{padding:16px}.hero-panel h1{font-size:28px}.hero-panel p{font-size:.84rem}.hero-photo{min-height:145px}.tiles{gap:9px}.tile-body{padding:10px}.tile-title{font-size:.87rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.tile{transition:none}}

.login-card h1 .friendly-smiley{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:.9em;white-space:nowrap}

/* V11: Navigation am Ende jeder Themenwelt, auch mobil gut erreichbar. */
.topic-pagination{margin:36px 0 8px;padding:18px;border:1px solid var(--outline);background:#fff;border-radius:18px;box-shadow:0 5px 18px #1527180c}
.topic-pagination-status{margin:0 0 11px;color:var(--muted);font-size:.84rem;font-weight:700}
.topic-next{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:52px;padding:13px 17px;background:var(--green);color:#fff;text-decoration:none;border-radius:11px;font-size:.95rem;font-weight:650;line-height:1.4}
.topic-next:hover{background:var(--primary);color:#fff}.topic-next strong{font-weight:800}.topic-next span:last-child{font-size:1.25rem;flex-shrink:0}
.topic-previous{display:inline-flex;align-items:center;gap:8px;margin-top:13px;min-height:36px;color:var(--navy);font-size:.88rem;font-weight:600;text-decoration:none}
.topic-previous:hover{text-decoration:underline}