/* Neue Dimension – zweite Startseiten-Vorabansicht, 18.10.2026. */
* { box-sizing:border-box; }
html { min-height:100%; background:#221640; }
body { margin:0; min-height:100vh; color:#fff; background:#221640; background-image:none; font-family:'Roboto Condensed',Arial,sans-serif; }
body::before { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; background:url('startseite-assets/images/kosmische-vision-v2.png') center top / cover no-repeat; }
#container { width:min(1097px,100%); position:relative; margin:0 auto; min-height:0; background:linear-gradient(90deg,transparent,rgba(28,20,62,.08) 30%,rgba(28,23,63,.24) 50%,rgba(28,20,62,.08) 70%,transparent); }
.header { position:relative; display:block; height:240px; }
.content-area { width:calc(100% - 68px); margin:0 auto; }
#wb_MenuBar1 { background:rgba(5,64,72,.94); border:1px solid #c3d0d3; box-shadow:0 2px 10px rgba(191,214,220,.2); z-index:100!important; }
#MenuBar1 .MenuBar1MainItem,#MenuBar1 .MenuBar1MainItemHover,#MenuBar1 .MenuBar1MainItemActive { background-color:transparent; background-image:none; color:white; }
.MenuBar1SubMenu { background:#103a48!important; border:1px solid #b7c9ce!important; }
#MenuBar1 td { color:#fff; }
#wb_MenuBar2 { width:122px!important; left:78px!important; }
#MenuBar2 .MenuBar2MainItem,#MenuBar2 .MenuBar2MainItemHover,#MenuBar2 .MenuBar2MainItemActive { background:rgba(5,64,72,.96); border:1px solid #c3d0d3; color:#fff; }
.mobile-navigation { display:none; }
.quote-video-row { display:grid; grid-template-columns:279px minmax(0,417px) minmax(0,279px); gap:14px 25px; margin:13px 0 65px; align-items:stretch; }
.golden-frame { border:1px solid #e4c57c; box-shadow:inset 0 0 0 3px rgba(224,189,105,.08),0 0 15px rgba(212,169,75,.16); outline:1px solid rgba(226,194,124,.2); outline-offset:4px; background:rgba(18,25,58,.88); }
.featured-film { grid-column:1; grid-row:1/3; padding:13px 12px 11px; align-self:stretch; }
.video-intro { margin:0 0 12px; color:#fff; font-size:17px; line-height:1.35; }
.video-intro a { color:#fff; font-weight:bold; text-decoration:underline; text-underline-offset:3px; }
#featured-video { display:block; width:100%; aspect-ratio:910/512; height:auto; background:#172044; object-fit:contain; }
.video-buttons { display:flex; flex-wrap:wrap; gap:7px; margin-top:12px; }
button { font:inherit; cursor:pointer; }
.video-buttons button { border:1px solid #c4d5de; padding:8px 9px; color:white; background:#164b5c; font-size:14px; }
.video-buttons button[aria-pressed='true'] { background:#5e427c; }
button:hover { filter:brightness(1.2); }
a:focus-visible,button:focus-visible,[tabindex]:focus-visible { outline:2px solid #fff; outline-offset:4px; }
.media-feedback { margin:6px 0 0; font-size:14px; }
.media-feedback:empty { display:none; }
.quotes-heading { grid-column:2/4; grid-row:1; margin:0; padding:5px 15px; text-align:center; font-size:19px; line-height:1.3; font-weight:400; color:#fff; background:rgba(14,26,51,.88); }
.quote-video-row blockquote { margin:0; padding:19px 20px; color:#fff; font-size:19px; line-height:1.3; height:282px; overflow-y:auto; scrollbar-color:#c9b16d #172448; scrollbar-width:thin; }
.quote-one { grid-column:2; grid-row:2; }
.quote-two { grid-column:3; grid-row:2; }
.welcome-row { display:grid; grid-template-columns:minmax(0,430px) minmax(0,578px); gap:20px; margin-bottom:25px; }
.portrait { width:100%; height:auto; display:block; border:1px solid rgba(209,211,230,.45); }
.welcome-copy { color:#fff; background:rgba(19,29,60,.86); align-self:stretch; }
.welcome-copy h1 { margin:0; padding:18px 18px; background:rgba(9,29,47,.88); color:#fff; font-family:Arial,sans-serif; font-size:19px; line-height:1.45; text-align:center; font-weight:600; }
.welcome-copy p { padding:24px 22px; margin:0; font-size:21px; line-height:1.48; }
#lim-lebenswerk { display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:28px; padding:30px 34px; margin:0 0 25px; color:#fff; background:linear-gradient(120deg,rgba(17,33,76,.97),rgba(17,27,65,.96)); border:1px solid rgba(186,184,225,.62); box-shadow:0 12px 36px rgba(7,9,32,.2); }
#lim-heading { margin:0 0 22px; color:white; font-size:24px; line-height:1.4; text-align:left; font-weight:400; }
#lim-heading span { font-weight:700; letter-spacing:.035em; }
#lim-lebenswerk ol { margin:0; padding:0; counter-reset:werk; list-style:none; }
#lim-lebenswerk li { counter-increment:werk; margin:0; }
#lim-lebenswerk a { display:flex; align-items:center; gap:12px; padding:9px 7px; min-height:40px; color:white; font-size:21px; line-height:1.2; text-decoration:none; border-bottom:1px solid rgba(194,196,237,.17); }
#lim-lebenswerk a::before { content:counter(werk) "."; color:#d0d3ee; flex:0 0 22px; text-align:right; }
#lim-lebenswerk a::after { content:'↗'; margin-left:auto; color:#c8ccec; font-size:18px; }
#lim-lebenswerk a:hover { background:rgba(150,140,225,.18); text-decoration:underline; text-underline-offset:4px; }
.parzzival-logo { display:block; width:100%; height:auto; max-height:390px; object-fit:contain; align-self:center; border:1px solid rgba(184,191,232,.5); }
.nature-row { display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:20px; padding:16px; color:#fff; background:rgba(19,29,60,.85); }
.gallery { min-width:0; }
.gallery-track { display:flex; gap:18px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-color:#9dabc9 #18274e; scrollbar-width:auto; padding-bottom:9px; }
.gallery-track figure { flex:0 0 calc((100% - 18px)/2); margin:0; scroll-snap-align:start; }
.gallery-track img { width:100%; height:auto; aspect-ratio:4/3; display:block; object-fit:contain; background:rgba(17,25,56,.8); }
.gallery-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:9px; font-size:16px; color:#dce2f1; }
.gallery-controls button { width:40px; height:32px; color:#fff; border:1px solid #c4cddf; background:#164b5c; font-size:23px; line-height:1; }
.nature-copy p { margin:0 0 26px; font-size:20px; line-height:1.35; }
.nature-copy a { display:block; margin-top:24px; color:#fff; font-size:20px; line-height:1.35; text-decoration:none; text-align:center; }
.nature-copy a:hover { text-decoration:underline; }
.home-footer { margin:25px 0 50px; padding:17px 20px; color:white; background:rgba(19,29,60,.84); text-align:center; font-size:19px; line-height:1.4; }
.home-footer p { margin:0; }
.shop-page { display:grid; place-items:center; padding:40px 20px; }
.shop-shell { width:min(720px,100%); padding:45px; color:#fff; background:rgba(17,30,65,.95); border:1px solid #c4d1da; text-align:center; }
.construction-sign { font-size:90px; line-height:1; margin-bottom:35px; }
.shop-shell p { font-size:23px; line-height:1.5; margin:0 0 35px; }
.shop-shell a { color:#fff; text-underline-offset:5px; font-size:19px; }
@media (max-width:1080px) and (min-width:801px) {
 .quote-video-row { grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr) minmax(0,.95fr); gap:14px 18px; }
 #wb_MenuBar1 { transform:scale(.88); transform-origin:left center; }
 #lim-lebenswerk { grid-template-columns:minmax(0,1fr) 180px; }
 .welcome-copy p { font-size:19px; }
}
@media (max-width:800px) {
 .content-area { width:auto; margin:0 18px; }
 #container { padding:0; }
 .header { height:auto; display:grid; grid-template-columns:82px minmax(0,1fr); gap:18px; padding:24px 18px; align-items:center; }
 .header > div { position:relative!important; left:auto!important; top:auto!important; width:auto!important; height:auto!important; }
 #wb_Image2,#wb_Image11,#wb_MenuBar1,#wb_MenuBar2 { display:none!important; }
 #wb_Image1 { grid-column:1; }
 #wb_Image3 { grid-column:2; }
 #Image3 { width:100%; height:auto; }
 #wb_CssMenu1 { grid-column:1/-1; opacity:1!important; }
 #wb_CssMenu1 p { line-height:1.5; }
 .mobile-navigation { display:block; grid-column:1/-1; background:#10434d; border:1px solid #c3d0d3; padding:12px 16px; color:white; font:18px/1.4 Arial,sans-serif; }
 .mobile-navigation summary { cursor:pointer; }
 .mobile-navigation ul { padding-left:18px; }
 .mobile-navigation li { margin:9px 0; }
 .mobile-navigation a { color:white; }
 .quote-video-row { grid-template-columns:1fr 1fr; gap:20px; margin:10px 0 35px; }
 .featured-film { grid-column:1/-1; grid-row:1; width:min(520px,100%); justify-self:center; padding:18px; }
 .video-intro { font-size:19px; }
 .video-buttons button { font-size:17px; }
 .quotes-heading { grid-column:1/-1; grid-row:2; }
 .quote-one { grid-column:1; grid-row:3; }
 .quote-two { grid-column:2; grid-row:3; }
 .quote-video-row blockquote { height:310px; font-size:18px; padding:17px; }
 .welcome-row { grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:16px; }
 .welcome-copy h1 { font-size:17px; padding:15px; }
 .welcome-copy p { font-size:18px; padding:17px; line-height:1.4; }
 #lim-lebenswerk { grid-template-columns:minmax(0,1fr) 155px; gap:18px; padding:24px; }
 #lim-heading { font-size:22px; }
 #lim-lebenswerk a { font-size:20px; }
 .nature-row { grid-template-columns:1fr; }
 .nature-copy { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
 .nature-copy p { grid-column:1/-1; margin:0; }
 .nature-copy a { margin:0; }
}
@media (max-width:560px) {
 .quote-video-row { grid-template-columns:1fr; }
 .quote-one { grid-column:1; grid-row:3; }
 .quote-two { grid-column:1; grid-row:4; }
 .quote-video-row blockquote { height:255px; }
 .welcome-row { grid-template-columns:1fr; }
 .portrait { max-height:610px; object-fit:contain; background:rgba(19,29,60,.65); }
 #lim-lebenswerk { grid-template-columns:1fr; padding:23px 18px; }
 .parzzival-logo { max-width:220px; justify-self:center; max-height:330px; margin-top:10px; }
 #lim-lebenswerk a { gap:8px; padding:12px 0; }
 .gallery-track figure { flex-basis:100%; }
 .nature-copy { grid-template-columns:1fr; }
 .shop-shell { padding:30px 23px; }
 .shop-shell p { font-size:21px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; } }

/* Dritte Vorabansicht: sichtbare Hintergrundebene und Sonnenuntergangs-Banner. */
body { position:relative; isolation:isolate; }
body::before { z-index:0; }
#container { z-index:1; }
.shop-shell { position:relative; z-index:1; }
@font-face { font-family:'CosmicScript'; src:url('startseite-assets/fonts/Z003-MediumItalic.otf') format('opentype'); font-display:swap; }
.brand-banner { position:absolute; left:34px; top:22px; width:680px; height:140px; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:18px 24px 8px; overflow:hidden; text-decoration:none; background:linear-gradient(180deg,rgba(20,7,17,.06),rgba(20,7,17,.18)),url('startseite-assets/images/sonnenuntergang.png') center 40% / cover no-repeat; border:1px solid rgba(244,211,136,.68); box-shadow:0 8px 22px rgba(16,9,33,.38),0 0 18px rgba(222,182,96,.12); }
.brand-frame { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.brand-person { position:relative; color:#fff1cf; font-family:Georgia,serif; font-size:22px; line-height:1.1; letter-spacing:.04em; -webkit-text-stroke:1px #100809; paint-order:stroke fill; text-shadow:1px 1px 2px #000,-1px -1px 1px #000; }
.brand-company { position:relative; margin-top:3px; color:#ffe4a5; font-family:'CosmicScript',Georgia,serif; font-size:75px; line-height:.95; font-weight:400; white-space:nowrap; -webkit-text-stroke:1.8px #160b09; paint-order:stroke fill; text-shadow:2px 2px 2px #000,-1px -1px 1px #000,0 0 9px rgba(255,213,146,.4); }
.portrait { align-self:start; }
.welcome-copy h1 { padding:22px 15px 15px; font-family:'CosmicScript',Georgia,serif; font-size:56px; line-height:1.02; font-weight:400; color:#fff3d6; text-shadow:0 2px 3px #080d26; }
.welcome-prose { padding:20px 23px 24px; }
.welcome-copy .welcome-prose p { padding:0; margin:0 0 16px; font-size:20px; line-height:1.38; }
.welcome-copy .welcome-prose .welcome-signature { margin:18px 0 0; text-align:right; font-size:18px; }
.welcome-signature span { font-family:'CosmicScript',Georgia,serif; font-size:37px; line-height:1.2; }
@media (max-width:1080px) and (min-width:801px) {
 .brand-banner { width:630px; }
 .brand-company { font-size:68px; }
 .welcome-copy h1 { font-size:48px; }
 .welcome-copy .welcome-prose p { font-size:19px; }
}
@media (max-width:800px) {
 .header { grid-template-columns:1fr; }
 .brand-banner { position:relative; left:auto; top:auto; width:100%; height:140px; grid-column:1/-1; }
 .brand-company { font-size:clamp(42px,10vw,75px); }
 .brand-person { font-size:clamp(18px,3.5vw,22px); }
 .welcome-copy h1 { font-size:42px; }
 .welcome-prose { padding:17px; }
 .welcome-copy .welcome-prose p { font-size:18px; }
}
@media (max-width:560px) {
 .brand-banner { height:118px; padding-inline:12px; }
 .brand-company { font-size:clamp(36px,10vw,54px); }
 .welcome-copy h1 { font-size:48px; }
 .welcome-copy .welcome-prose p { font-size:20px; }
}

/* Weicher Übergang über ca. 3 cm: außen Kosmos, innen ruhiges Nachtblau. */
body::after {
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  --page-half:min(548.5px,50vw);
  background:linear-gradient(90deg,
    transparent calc(50% - var(--page-half) - 36px),
    rgba(13,22,54,.32) calc(50% - var(--page-half)),
    rgba(13,22,54,.82) calc(50% - var(--page-half) + 44px),
    rgba(13,22,54,.97) calc(50% - var(--page-half) + 78px),
    rgba(13,22,54,.97) calc(50% + var(--page-half) - 78px),
    rgba(13,22,54,.82) calc(50% + var(--page-half) - 44px),
    rgba(13,22,54,.32) calc(50% + var(--page-half)),
    transparent calc(50% + var(--page-half) + 36px));
}