/* WordPress integration; existing prototype design stays authoritative. */
body{margin:0}main{display:block}.wp-block-shortcode{margin:0}.heide-breadcrumbs a{color:inherit}.heide-sitemap li{margin:.5rem 0}.heide-sitemap ul{margin-left:1.5rem}.heide-sitemap{padding-bottom:4rem}.pagehead .search-form{display:flex;gap:1rem}.pagehead input[type=search]{max-width:100%}.content a{overflow-wrap:anywhere}
/* 0.2: reference-style topic disclosures and spacious subpage introductions. */
header .topic-toggle{display:flex;align-items:center;gap:8px;min-height:48px;padding:10px 0;background:none;color:#111;border:0;border-radius:0;font-size:.875rem;font-weight:700;line-height:1.4;text-align:left}
header .topic-toggle:hover,header .topic-toggle[aria-expanded=true],header .current-topic{text-decoration:underline;text-underline-offset:7px}
.topic-chevron{font-size:1.2rem;transition:transform .2s}.topic-toggle[aria-expanded=true] .topic-chevron{transform:rotate(180deg)}
header .topic-panel{grid-column:1/-1;padding:32px 0 48px;background:#fff;color:#111}
.topic-panel-heading{display:flex;justify-content:space-between;align-items:start;gap:24px}.topic-panel h2{font-size:clamp(1.4rem,2.4vw,2rem);margin:0 0 28px;line-height:1.5}.topic-panel h2 a{background:linear-gradient(transparent 65%,#cce9f3 65%);text-decoration:none}
.topic-close{border:0;border-radius:50%;background:#f0f8fa;color:#111;width:44px;min-width:44px;height:44px;font-size:1.8rem;line-height:1}
.topic-links{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 64px;max-width:1050px}.topic-links a{display:block;padding:10px 0;min-height:44px;font-size:1.125rem;text-decoration:none;line-height:1.5}.topic-links a:hover,.topic-links a[aria-current]{text-decoration:underline;text-underline-offset:5px}.topic-overview{display:inline-block;margin-top:28px;padding:10px 0;font-weight:700;text-underline-offset:5px}
body.topic-open header.is-scrolled .primary-topics{height:auto!important;visibility:visible;margin:0 0 20px!important}
body:not([data-route=start]) .pagehead{position:relative;padding:64px max(5%,calc((100% - 1296px)/2)) 72px;margin-bottom:90px;background:var(--section-color)}
body:not([data-route=start]) .pagehead:after{content:"";position:absolute;top:calc(100% - 1px);left:0;width:100%;height:64px;background:var(--section-color);mask:url('assets/shape_01A.svg') center/100% 100% no-repeat;pointer-events:none}
body:not([data-route=start]) .pagehead h1{max-width:1050px;text-wrap:balance}body:not([data-route=start]) .pagehead .lead{max-width:780px;font-size:1.25rem;line-height:1.6}.pagehead .crumb{margin-bottom:32px}.pagehead .subnav{gap:12px;margin-bottom:0}.pagehead .subnav a{font-size:.9375rem;background:transparent}
body.contrast .topic-panel,body.contrast .topic-toggle{background:#fff;color:#000}body.contrast .pagehead:after{background:#fff}
@media(max-width:700px){header .topic-toggle{width:100%;font-size:1rem;justify-content:flex-start}.topic-chevron{margin-left:auto}header .topic-panel{padding:20px 0 28px}.topic-panel h2{margin-bottom:16px}.topic-links{grid-template-columns:1fr;gap:2px}.topic-links a{font-size:1rem}.topic-overview{margin-top:16px}body.topic-open header.is-scrolled{background:white;pointer-events:auto}body.topic-open header.is-scrolled .primary-topics{display:flex!important}body:not([data-route=start]) .pagehead{padding:36px 5% 40px;margin-bottom:64px}body:not([data-route=start]) .pagehead:after{height:40px;mask-image:url('assets/shape_01-mobile-A.svg')}body:not([data-route=start]) .pagehead .lead{font-size:1.125rem}}
@media(prefers-reduced-motion:reduce){.topic-chevron{transition:none}}
header .topic-chevron{font-size:0;display:inline-block;width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-left:8px;flex:none}header .topic-toggle[aria-expanded=true] .topic-chevron{transform:rotate(225deg)}
/* Keep the introduction in reading order, with optional shortcuts last. */
body:not([data-route=start]) .pagehead{display:flex;flex-direction:column;align-items:flex-start}.pagehead .subnav{order:5}
/* Compact first-screen hero. Content may grow at zoom or on short viewports. */
@media(min-width:768px){
 body[data-route=start] header:not(.is-scrolled) .head{grid-template-rows:110px auto}
 body[data-route=start] header:not(.is-scrolled) .header-contour{height:60px}
 .hero{--hero-wave-height:48px;min-height:var(--hero-available,560px);padding:0 0 64px;overflow:visible}
 .hero .scene{height:calc(100% - 48px)}
 .hero-copy{width:min(760px,60%);margin:64px 5% 0 0;padding:24px 32px;align-self:center}
 .hero-copy:before{inset:-56px 0 0}
 .hero-copy h1{font-size:clamp(2rem,3.2vw,3.25rem);line-height:1.15;margin-bottom:12px}
 .hero-copy .eyebrow{margin-bottom:8px;font-size:.75rem}
 .hero-copy .lead{font-size:1rem;line-height:1.5}
 .hero-copy .actions{flex-direction:row;gap:12px;margin-top:18px}
 .hero-copy .btn{font-size:.875rem;padding:10px 16px;min-height:46px}
 .hero .scene-label{bottom:64px;max-width:30%}
}
@media(max-width:767px){.hero{padding-top:230px;padding-bottom:64px}.hero .scene{height:260px}.hero-copy{margin-top:0}.hero .scene-label{top:160px}}

@media(min-width:768px){.hero-copy:before{mask-image:url('assets/hero-bubble-wide.svg');-webkit-mask-image:url('assets/hero-bubble-wide.svg')}}

.result h3{display:flex;align-items:center;gap:12px}.route-waymark{width:50px;height:50px;object-fit:contain;flex:none;background:white}

/* Dismissible visit notice; hidden removes all reserved space. */
.warningbar[hidden]{display:none!important}
.warningbar>.wrap{display:flex;align-items:center;gap:16px}
.notice-text{flex:1;min-width:0}
.notice-dismiss{flex:0 0 44px;width:44px;min-height:44px;padding:0;border:1px solid currentColor;border-radius:50%;background:transparent;color:#111;font-size:1.7rem;line-height:1;cursor:pointer}
.notice-dismiss[hidden]{display:none}
.notice-dismiss:focus-visible{outline:3px solid #111;outline-offset:3px}

/* Startseite: Himmelblau passend zum Video, andere Bereiche unverändert. */
body[data-route=start]{--section-color:var(--nnl-blue)}
body[data-route=start] .hero-copy,body[data-route=start] .hero-copy::before{background:var(--nnl-blue)}

/* Shared page/area color for header contour, pagehead and footer. */
body[data-color-area=gebiete]{--section-color:var(--nnl-green)}
body[data-color-area=start],body[data-color-area=besuch]{--section-color:var(--nnl-blue)}
body[data-color-area=lernen]{--section-color:var(--nnl-yellow)}
body[data-color-area=mitmachen]{--section-color:var(--nnl-sage)}
body[data-color-area=buchen]{--section-color:var(--nnl-purple)}
body footer{background:var(--section-color)}
body.contrast footer{background:#000!important;color:#fff!important}

/* Feather the video into the page colour, without changing text or wave masks. */
body[data-route=start] .hero .scene::after{content:"";position:absolute;inset:auto 0 0;height:clamp(100px,18vh,190px);background:linear-gradient(to bottom,rgba(204,233,243,0) 0%,rgba(204,233,243,.12) 24%,rgba(204,233,243,.48) 55%,rgba(204,233,243,.86) 80%,var(--section-color) 100%);pointer-events:none;z-index:1}
@media(max-width:767px){body[data-route=start] .hero .scene::after{height:110px}}
body.contrast[data-route=start] .hero .scene::after{display:none}
@media(forced-colors:active){body[data-route=start] .hero .scene::after{display:none}}
