/* Approved CI, 19 October 2026. Only the existing panorama header is adapted. */
.ci-approved-header .header-inner{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,34%) minmax(0,1fr);gap:24px;align-items:center;padding:18px 32px 16px;max-width:1600px}
.ci-approved-header .stationery-nav-logo{grid-column:2;grid-row:1;width:100%;height:auto;min-height:0;display:flex;flex-direction:column;align-items:center;padding:10px 0 0;background:none;border:0;box-shadow:none}
.ci-approved-header .stationery-nav-logo .brand-vector{width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 3px 3px #173c3040)}
.ci-approved-header .stationery-nav-logo .ci-city-vector{position:static;display:block;width:27%;height:auto;max-width:none;margin:-5px auto 0;filter:none;object-fit:contain}
.ci-header-processes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start;align-self:end;width:100%;max-width:290px;grid-row:1}
.ci-processes-left{grid-column:1;justify-self:start}
.ci-processes-right{grid-column:3;justify-self:end}
.ci-header-process{min-width:0;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.ci-process-art{display:flex;align-items:center;justify-content:center;width:100%;max-width:112px;height:50px;opacity:.60}
.ci-process-art>svg,.ci-process-art>img{display:block;width:100%;height:100%;max-width:100%;object-fit:contain;overflow:hidden}
.ci-process-caption{font-family:Georgia,'Times New Roman',serif;font-size:11px;font-weight:400;line-height:1.35;letter-spacing:0;color:#173c30;opacity:.86;white-space:nowrap}
.ci-approved-header .mobile-actions{grid-column:3;grid-row:1;position:absolute;right:0;top:0}
@media(min-width:701px){.ci-approved-header .mobile-actions{display:none}}
@media(min-width:701px) and (max-width:1050px){
 .ci-approved-header .header-inner{gap:18px;padding-inline:20px;grid-template-columns:minmax(0,1fr) minmax(240px,34%) minmax(0,1fr)}
 .ci-header-processes{gap:10px}.ci-process-art{height:42px;max-width:90px}.ci-process-caption{font-size:10px}
}
@media(max-width:700px){
 .ci-approved-header .header-inner{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 12px;padding:10px 16px 16px}
 .ci-approved-header .stationery-nav-logo{grid-column:1/-1;grid-row:1;width:min(260px,calc(100% - 72px));padding-top:4px}
 .ci-approved-header .stationery-nav-logo .ci-city-vector{margin-top:-4px;width:27%}
 .ci-header-processes{grid-row:2;max-width:none;gap:12px}
 .ci-processes-left{grid-column:1/3}.ci-processes-right{grid-column:3/5}
 .ci-process-art{height:43px;max-width:82px}.ci-header-process{gap:5px}.ci-process-caption{font-size:9px;line-height:1.4}
 .ci-approved-header .mobile-actions{display:flex;grid-column:4;grid-row:1;right:0;top:10px;align-self:start;z-index:3}
 .ci-approved-header .mobile-menu nav{top:48px;right:0;width:min(270px,calc(100vw - 32px))}
}
@media(max-width:360px){.ci-approved-header .header-inner{gap:10px 8px;padding-inline:12px}.ci-header-processes{gap:8px}.ci-process-caption{font-size:8px}.ci-process-art{height:38px}}

/* Full page panorama width, 20 October 2026: keep the existing foreground layout. */
.ci-approved-header::before{inset:0 44% 0 0;width:auto;max-width:none;background-position:center;background-size:100% auto;mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 82%,transparent 100%);mask-composite:add}
.ci-approved-header .header-panorama-right{inset:0 0 0 56%;width:auto;max-width:none;background-position:center;background-size:100% auto;mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 82%,transparent 100%);mask-composite:add}

/* Separate panorama and refinement band, requested 25 October 2026. */
.site-header.ci-approved-header{padding-bottom:0}
.site-header.ci-approved-header::before{display:none}
.ci-panorama{position:relative;isolation:isolate}
.ci-panorama::before{content:'';position:absolute;inset:0 44% 0 0;z-index:-1;pointer-events:none;background:url('assets/header-augsburg-fluesse-perlach-v2-web.webp') center/100% auto no-repeat;mix-blend-mode:multiply;filter:sepia(.32) saturate(.55);opacity:.29;mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 82%,transparent 100%)}
.ci-approved-header .ci-panorama .header-inner{grid-template-columns:1fr;gap:0;padding:18px 32px 20px}
.ci-approved-header .ci-panorama .stationery-nav-logo{grid-column:1;grid-row:1;justify-self:center;width:min(540px,44vw)}
.ci-refinement-band{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:16px max(24px,calc((100% - 900px)/2));border-top:3px solid #173c30;background:#f4f0e6}
.ci-refinement-band .ci-header-processes{grid-column:auto;grid-row:auto;max-width:none;align-self:center;justify-self:stretch}
.ci-approved-header .ci-panorama .mobile-actions{grid-column:1;grid-row:1}
@media(max-width:700px){
 .ci-approved-header .ci-panorama .header-inner{padding:10px 16px 16px}
 .ci-approved-header .ci-panorama .stationery-nav-logo{width:min(260px,calc(100% - 72px))}
 .ci-panorama::before{opacity:.22}
 .ci-refinement-band{gap:12px;padding:14px 16px}
}