/* wow.css - Entwurfs-Varianten A-D der Startseite (D = Startseite seit 06.11.2026, A-C nur Vorschau). site.css bleibt unberuehrt. */
.wow{--w-navy:var(--navy,#0B3E6C);--w-deep:#061B30;--w-pet:#5A9BA3;--w-peth:#408189;--w-mint:#7BB39A;--w-ice:var(--ice,#EDF2F4);--w-link:#156082}
/* eckig, redaktionell: keine Rundungen in den Varianten (auch nicht aus site.css) */
.wow *,.wow *:before,.wow *:after{border-radius:0!important}
.wow h1{font-weight:700}
/* feine Links und Buttons */
.wow .wctas{display:flex;flex-wrap:wrap;align-items:center;gap:6px 24px}
.wow .wbtn{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid currentColor;font-size:15px;font-weight:400;line-height:1.3;transition:background-color .2s,color .2s,border-color .2s}
.wow .wlink{display:inline-flex;align-items:center;min-height:44px;font-size:15px;line-height:1.3;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;transition:color .2s}
.wow .wlink:hover{text-decoration-thickness:2px}
.wow .dk .wbtn:hover{background:#fff;color:var(--w-navy);border-color:#fff}
.wow .dk .wlink:hover{color:var(--w-mint)}
.wow .wlink span[aria-hidden],.wow .wbtn span[aria-hidden]{margin-left:2px}
.wcred{position:absolute;right:16px;bottom:10px;font-size:12px;color:#fff;background:rgba(6,27,48,.72);padding:2px 8px;z-index:3}
/* Seitenfluss: nummerierte Abschnitte (Bonnell) */
.wow #main{counter-reset:wsec}
.wow .intro,.wow .reelfull,.wow .sec,.wow .presse1,.wow .schluss{counter-increment:wsec}
.wow .intro>.wrap:before,.wow .reelfull>.wrap:before,.wow .sec>.wrap:before,.wow .presse1>.wrap:before,.wow .schluss>.wrap:before{content:"(" counter(wsec,decimal-leading-zero) ")";display:block;font-size:13px;letter-spacing:.06em;color:var(--w-peth);margin-bottom:14px}
.wow .schluss>.wrap:before{color:var(--w-mint)}

/* ---------- A Buehne */
.wow-a .ahead{position:absolute;left:0;right:0;top:0;background:linear-gradient(180deg,rgba(6,27,48,.85) 0%,rgba(6,27,48,0) 100%);z-index:5}
.wa-hero{position:relative;height:calc(min(100vh,940px) - 44px);min-height:700px;color:#fff;background:var(--w-deep);overflow:hidden}
.wa-bg{position:absolute;left:0;right:0;top:-6%;height:112%;background:url(../img/ruecken_wi.jpg) 22% 42%/cover;will-change:transform}
.wa-hero:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(6,27,48,.1) 30%,rgba(6,27,48,.55) 58%,rgba(6,27,48,.96) 100%),linear-gradient(90deg,rgba(6,27,48,0) 40%,rgba(6,27,48,.35) 100%)}
.wa-grid{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,transparent calc(25% - .5px),rgba(255,255,255,.14) calc(25% - .5px),rgba(255,255,255,.14) calc(25% + .5px),transparent calc(25% + .5px),transparent calc(50% - .5px),rgba(255,255,255,.14) calc(50% - .5px),rgba(255,255,255,.14) calc(50% + .5px),transparent calc(50% + .5px),transparent calc(75% - .5px),rgba(255,255,255,.14) calc(75% - .5px),rgba(255,255,255,.14) calc(75% + .5px),transparent calc(75% + .5px))}
.wa-in{position:absolute!important;left:0;right:0;bottom:0;z-index:2;padding-bottom:48px!important;animation:wup 1s .15s ease-out both}
.wa-in>*{margin-left:34%}
.wa-in .kicker{color:var(--w-mint)}
.wa-in h1{font-size:76px;line-height:1;letter-spacing:-.025em;margin-top:14px;margin-bottom:28px}
.wa-row{display:block;border-top:1px solid rgba(255,255,255,.3);padding-top:20px}
.wa-row p{font-size:18px;opacity:.95;max-width:620px;margin-bottom:14px}
.wa-reel{position:absolute;right:40px;top:-120px;display:flex;align-items:center;gap:14px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;min-height:44px}
.wa-th{display:block;width:150px;height:84px;background:center/cover;border:1px solid rgba(255,255,255,.6);position:relative}
.wa-th:after{content:"▶";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:20px;background:rgba(6,27,48,.35)}
.wa-reel:hover .wa-rl{text-decoration:underline;text-underline-offset:4px}
.wa-rl b{color:var(--w-mint);font-weight:400}
@keyframes wup{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ---------- B Zahlen */
.wow-b .ahead{background:var(--w-deep);border-bottom:1px solid rgba(255,255,255,.14)}
.wb-hero{position:relative;color:#fff;background:var(--w-deep);overflow:hidden;padding:56px 0 72px}
.wb-bg{position:absolute;inset:0;background:url(../img/2026-10-08_WP-Infotag_Bremerhaven_credits_Heiko-Sandelmann_0003.jpg) center 60%/cover;opacity:.18}
.wb-hero:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(6,27,48,.4) 0%,rgba(6,27,48,.92) 100%)}
.wb-hero .wrap{position:relative;z-index:2}
.wb-in .kicker{color:var(--w-mint)}
.wb-nums{display:grid;grid-template-columns:1.7fr 1fr 1fr;margin:28px 0 32px;border-top:1px solid rgba(255,255,255,.3);border-bottom:1px solid rgba(255,255,255,.3)}
.wb-nums .wn{display:flex;flex-direction:column;padding:26px 28px 30px;border-left:1px solid rgba(255,255,255,.3)}
.wb-nums .wn:first-child{border-left:0;padding-left:0}
.wb-nums small{font-size:16px;color:var(--w-mint);letter-spacing:.04em;min-height:1.4em}
.wb-nums b{display:block;font-size:136px;line-height:.95;color:var(--w-mint);font-variant-numeric:tabular-nums;letter-spacing:-.04em;white-space:nowrap}
.wb-nums .wn>span{font-size:17px;margin-top:14px;opacity:.92;max-width:300px}
.wb-seal{display:inline-flex;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.45);padding:8px 14px;font-size:15px;line-height:1.4}
.wb-dot{flex:none;width:10px;height:10px;background:var(--w-mint)}
.wb-in h1{font-size:30px;line-height:1.2;margin:28px 0 10px;max-width:820px}
.wb-p{font-size:18px;opacity:.92;max-width:760px;margin-bottom:22px}

/* ---------- C Stimme */
.wow-c .ahead{background:var(--w-navy)}
.wc-hero{background:#fff;padding:88px 0 104px;overflow:hidden}
.wc-grid{display:grid;grid-template-columns:1.45fr .75fr;gap:80px;align-items:center}
.wc-text .kicker{color:var(--w-peth)}
.wc-text h1{position:relative;font-size:80px;line-height:1.02;color:var(--w-navy);margin:24px 0 22px;letter-spacing:-.03em}
.wc-q{display:block;font-size:1.5em;line-height:1;height:.5em;overflow:hidden;color:var(--w-pet)}
.wc-by{font-size:15px;color:var(--w-peth);margin-bottom:48px}
.wc-by:before{content:"";display:inline-block;width:40px;height:1px;background:currentColor;vertical-align:middle;margin-right:12px}
.wc-h1{font-size:22px;line-height:1.35;color:var(--w-navy);font-weight:700;margin-bottom:10px;max-width:620px;border-top:1px solid var(--line,#E2E8EB);padding-top:22px}
.wc-p{font-size:17px;max-width:620px;margin-bottom:18px}
.wc-hero .wbtn{color:var(--w-navy)}
.wc-hero .wbtn:hover{background:var(--w-navy);color:#fff;border-color:var(--w-navy)}
.wc-hero .wlink{color:var(--w-link)}
.wc-hero .wlink:hover{color:var(--w-peth)}
.wc-pic{margin:0}
.wc-pic img{display:block;width:100%;max-height:640px;aspect-ratio:4/5;object-fit:cover;object-position:34% 30%}
.wc-pic figcaption{font-size:12px;color:#56656E;margin-top:8px}
.wrv .rv{opacity:0;transform:translateY(16px);transition:opacity .8s ease,transform .8s ease}
.wrv .rv.in{opacity:1;transform:none}

/* ---------- D Bild-Slider */
.wow-d .ahead{position:absolute;left:0;right:0;top:0;background:linear-gradient(180deg,rgba(6,27,48,.85) 0%,rgba(6,27,48,0) 100%);z-index:5}
.wd-hero{position:relative;height:calc(min(100vh,900px) - 44px);min-height:660px;color:#fff;background:var(--w-deep);overflow:hidden}
.wd-s{position:absolute;inset:0;background-size:cover;opacity:0;transform:scale(1.06);transition:opacity .7s ease,transform 3.6s ease-out;will-change:opacity,transform}
.wd-s.on{opacity:1;transform:scale(1)}
.wd-hero:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(6,27,48,0) 35%,rgba(6,27,48,.6) 62%,rgba(6,27,48,.95) 100%)}
.wd-in{position:absolute!important;left:0;right:0;bottom:0;z-index:2;padding-bottom:96px!important}
.wd-in .kicker{color:var(--w-mint)}
.wd-in h1{font-size:76px;line-height:1.02;letter-spacing:-.025em;margin:14px 0 26px;max-width:1100px}
.wd-row{display:grid;grid-template-columns:minmax(0,560px) 1fr;gap:16px 48px;align-items:end}
.wd-row p{font-size:18px;opacity:.95}
.wd-row .wctas{justify-content:flex-end}
.wd-ctl{position:absolute;z-index:4;left:max(40px,calc((100% - 1200px) / 2 + 40px));bottom:28px;display:flex;align-items:center;gap:8px}
.wd-ctl button{appearance:none;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.7);min-width:44px;min-height:44px;font:inherit;font-size:16px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.wd-ctl button:hover{background:#fff;color:var(--w-navy)}
.wd-dots{display:inline-flex;gap:0}
.wd-ctl .wd-dot{border:0;min-width:28px;position:relative}
.wd-ctl .wd-dot:after{content:"";width:12px;height:12px;border:1px solid #fff;background:transparent}
.wd-ctl .wd-dot[aria-current]:after{background:var(--w-mint);border-color:var(--w-mint)}
.wd-ctl .wd-dot:hover{background:transparent}.wd-ctl .wd-dot:hover:after{background:#fff}
.wd-ctl .wd-pause{font-size:12px;margin-left:6px}
.wow button:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* ---------- Varianten-Umschalter mit Vorbild-Zeile */
.wsw{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;gap:8px 24px;min-height:44px;padding:0 16px 0 10px;background:rgba(6,27,48,.97);color:#fff;font-size:14px;border-top:1px solid rgba(255,255,255,.18)}
.wvb{order:2;flex:1;min-width:0;font-size:12px;line-height:1.4;opacity:.85;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wvb2{display:none}
.wsl{display:flex;flex-wrap:nowrap;align-items:center;gap:0 2px;flex:none}
.wsl span{opacity:.8;margin-right:6px}
.wsl i{font-style:normal;opacity:.5}
.wsl a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:40px;padding:0 8px;color:#fff;text-underline-offset:4px}
.wsl a:hover{text-decoration:underline;color:var(--w-mint)}
.wsl a[aria-current]{color:var(--w-mint);font-weight:700;text-decoration:underline}
.wsl a:focus-visible{outline:2px solid #fff;outline-offset:-2px}
.wow .foot{padding-bottom:84px}
.wow .wlink span[aria-hidden]:first-child:not(:last-child){margin:0 6px 0 0}

/* ---------- Tablet / Handy */
@media(max-width:1100px){
.wcred{right:8px;font-size:11px}
.wa-hero{height:auto;min-height:0;padding-top:min(100vw,440px)}
.wa-bg{top:0;height:min(110vw,480px);background-position:8% 40%}
.wa-hero:before{background:linear-gradient(180deg,rgba(6,27,48,.4) 0,rgba(6,27,48,0) 100px,rgba(6,27,48,0) 200px,var(--w-deep) calc(min(100vw,440px) - 16px))}
.wa-grid{display:none}
.wa-in{position:relative!important;display:flex;flex-direction:column;padding-bottom:48px!important;margin-top:-24px}
.wa-in>*{margin-left:0}
.wa-in h1{font-size:40px;line-height:1.05;margin:12px 0 20px}
.wa-row{padding-top:18px}
.wa-row p{font-size:16px}
.wa-reel{position:static;order:5;margin-top:22px}
.wa-th{width:112px;height:63px}
.wa-hero .wcred{top:auto;bottom:10px}
.wb-hero{padding:48px 0 56px}
.wb-nums{grid-template-columns:1fr 1fr;margin:22px 0 28px}
.wb-nums .wn{border-left:1px solid rgba(255,255,255,.3);border-top:1px solid rgba(255,255,255,.3);padding:14px 0 16px 16px}
.wb-nums .wn:first-child{grid-column:1/-1;border-top:0;padding-left:0}
.wb-nums .wn:nth-child(2){border-left:0;padding-left:0}
.wb-nums b{font-size:58px}
.wb-nums .wn:first-child b{font-size:76px}
.wb-nums small{min-height:0}
.wb-nums .wn>span{font-size:16px;margin-top:6px}
.wb-in h1{font-size:25px;margin-top:28px}
.wb-p{font-size:16px}
.wb-seal{font-size:14px;align-items:flex-start}
.wb-dot{margin-top:5px}
.wc-hero{padding:56px 0 64px}
.wc-grid{grid-template-columns:1fr;gap:40px}
.wc-text h1{font-size:46px;margin-top:20px}
.wc-by{margin-bottom:36px}
.wc-h1{font-size:19px}
.wc-pic img{aspect-ratio:4/3;object-position:34% 28%}
.wd-hero{height:auto;min-height:0;padding-top:min(100vw,440px)}
.wd-slides{position:absolute;left:0;right:0;top:0;height:min(110vw,480px);overflow:hidden}
.wd-hero:before{background:linear-gradient(180deg,rgba(6,27,48,.4) 0,rgba(6,27,48,0) 100px,rgba(6,27,48,0) 200px,var(--w-deep) calc(min(100vw,440px) - 16px))}
.wd-in{position:relative!important;padding-bottom:110px!important;margin-top:-24px}
.wd-in h1{font-size:38px;line-height:1.05;margin:12px 0 20px}
.wd-row{grid-template-columns:1fr}
.wd-row p{font-size:16px}
.wd-row .wctas{justify-content:flex-start}
.wd-ctl{left:20px;right:20px;bottom:36px;flex-wrap:wrap}
.wd-hero .wcred{bottom:auto;top:calc(min(100vw,440px) - 56px)}
.wsw{bottom:66px;flex-direction:column;gap:0;padding:5px 8px 0;border-top:0}
.wvb{order:0;width:100%;text-align:center;font-size:11px}
.wvb2{display:block;background:var(--w-ice);color:#2C3A44;font-size:13px;line-height:1.45;padding:14px 20px}
.wow .foot{padding-bottom:130px}
}
@media(min-width:701px) and (max-width:1100px){.wc-pic{max-width:560px}}

