https://cdn.ui.porsche.com/porsche-design-system/components/porsch…esign-system.canvas.7243b54ff70f0e3ab052.js

1"use strict";(self.webpackChunkPorscheDesignSystem_4_5_0=self.webpackChunkPorscheDesignSystem_4_5_0||[]).push([["canvas"],{2975(e,a,r){r.d(a,["c",0,"--p-color-canvas"])},4151(e,a,r){r.d(a,["c",0,"--p-color-contrast-lower"])},1039(e,a,r){r.d(a,["c",0,"--p-color-primary"])},6295(e,a,r){r.d(a,["c",0,"--p-color-surface"])},7957(e,a,r){r.d(a,["f",0,"--p-font-weight-normal"])},6236(e,a,r){r.d(a,{g:()=>i});var t=r(6410);function i(e){return`@media(max-width:${t.j[e]-1}px)`}},1714(e,a,r){var t=r(6410);r.d(a,["g",0,(e,a)=>(0,t.d)(e,`:scope>[slot="${a}"]`)])},8044(e,a,r){r.d(a,["g",0,"clamp(16px, 1.25vw + 12px, 36px)"])},2732(e,a,r){var t=r(1714);r.d(a,["h",0,(e,a)=>!!(0,t.g)(e,a)])},4247(e,a,r){const t="--p-duration-md",i="--p-duration-sm",d="--p-duration-xl",s="--p-ease-in-out",o=(e,a)=>`var(${e}${void 0===a?"":`,${a}`})`,n=e=>({"@media(forced-colors:active)":e}),b={short:o(i),moderate:o(t),long:o("--p-duration-lg"),veryLong:o(d)},c={base:o(s),in:o("--p-ease-in"),out:o("--p-ease-out"),linear:"linear"},l="--p-transition-duration",p="--p-animation-duration",g=e=>`${e} !important`,h=e=>Object.entries(e).reduce((e,[a,r])=>(null===r||(e[a]="object"==typeof r?h(r):g(r)),e),{});r.d(a,["a",0,h,"b",0,(e=2)=>({outline:`2px solid ${o("--p-color-focus")}`,outlineOffset:`${e}px`,...n({outlineColor:"Highlight"})}),"c",0,(e,a="short",r="base",t)=>`${e} ${o(l,b[a])} ${c[r]}`,"d",0,(e=!0,a)=>e?{position:"absolute",width:"1px",height:"1px",padding:0,margin:"-1px",overflow:"hidden",clip:"rect(0,0,0,0)",whiteSpace:"nowrap"}:{position:"static",width:"auto",height:"auto",padding:0,margin:0,overflow:"visible",clip:"auto",whiteSpace:"normal",...a},"e",0,g,"f",0,n,"g",0,e=>({opacity:.4,...n({opacity:1,color:"GrayText",...e})}),"h",0,{"&([hidden])":{display:"none"}},"i",0,l,"j",0,d,"k",0,p,"l",0,i,"m",0,b,"n",0,t,"o",0,s,"p",0,(e,a="short",r="base")=>`${e} ${o(p,b[a])} ${c[r]}`,"r",0,o])},6809(e,a,r){r.d(a,["f",0,"--p-font-porsche-next","l",0,"--p-leading-normal"])},6330(e,a,r){r.r(a);var t=r(6410),i=r(2732),d=r(4247),s=r(1068),o=r(8044),n=r(751),b=r(4151),c=r(1736),l=r(3827),p=r(1039),g=r(7957),h=r(2762),f=r(6809),m=r(6295),u=r(2975),k=r(6236),x=r(1861);r(1714);const y="--p-canvas-sidebar-start-width",v="--p-canvas-sidebar-end-width",$="320px",S=`min(100vw,${(0,d.r)(y,$)})`,w=`min(100vw,${(0,d.r)(v,$)})`,I=`min(calc(100vw - ${$}),${(0,d.r)(y,$)})`,_=`min(calc(100vw - ${$}),${(0,d.r)(v,$)})`,O=(0,t.D)("m"),E=(0,k.g)("m"),F=o.g.replace("36px","24px"),C=(e,a,r)=>{const i="surface"===r,o=i?(0,d.r)(m.c):(0,d.r)(u.c),k=i?(0,d.r)(u.c):(0,d.r)(m.c);return(0,t.i)({"@global":{":host":{display:"block",...(0,d.a)({overflowX:"clip",...d.h})},...s.p,slot:{'&:not([name]),&[name="footer"]':{"&::slotted(.-p-canvas-grid)":(0,d.a)({display:"grid",gridTemplateColumns:"repeat(12,minmax(0,1fr))",columnGap:F,marginInline:"auto",containerType:"inline-size"})},'&[name="sidebar-end-header"]':{display:"block"},'&[name="background"]':{zIndex:1,display:"block",gridArea:"1/2/-1/3",position:"sticky",top:0,height:"100lvh",pointerEvents:"none",overflow:"hidden",transform:"translate3d(0,0,0)","&::slotted(video),&::slotted(img)":(0,d.a)({width:"100%",height:"100%",objectFit:"cover"})},'&[name="title"]::slotted':(0,d.a)({"&(a)":{all:"unset",cursor:"pointer",color:"inherit",borderRadius:(0,d.r)(x.r)},"&(a:focus-visible)":(0,d.b)()})},h2:{all:"unset",padding:"4px",font:`${(0,d.r)(g.f)} ${(0,d.r)(h.t)} / ${(0,d.r)(f.l)} ${(0,d.r)(f.f)}`,color:(0,d.r)(p.c),textOverflow:"ellipsis",overflow:"hidden",whiteSpace:"nowrap",textTransform:"uppercase",letterSpacing:"2px"}},root:{display:"grid",gridTemplate:`auto minmax(0,1fr) auto / ${S} 100vw ${w}`,gridTemplateAreas:'"sidebar-start header sidebar-end" "sidebar-start main sidebar-end" "sidebar-start footer sidebar-end"',minHeight:"100lvh",[E]:{transition:(0,d.c)("transform"),transform:`translate3d(${a?`calc(-1 * ${S} - ${w})`:e?"0":`calc(-1 * ${S})`},0,0)`,"&:dir(rtl)":{transform:`translate3d(${a?`calc(${S} + ${w})`:e?"0":w},0,0)`}},[O]:{transition:(0,d.c)("grid-template-columns"),gridTemplateColumns:`${e?I:"0px"} minmax(${$},1fr) ${a?_:"0px"}`},"&::before":{content:'""',zIndex:0,gridArea:"1/2/-1/3",background:o,pointerEvents:"none",borderEndStartRadius:e?(0,d.r)(c.r):0,transition:(0,d.c)("border-radius")}},header:{zIndex:4,gridArea:"header",containerType:"inline-size",position:"sticky",top:0,minHeight:"56px",boxSizing:"border-box",display:"grid",gridTemplateColumns:"minmax(0,1fr) auto minmax(0,1fr)",gap:F,alignItems:"center",padding:`${(0,d.r)(n.s)} ${F}`,"&:focus-visible":{outline:"none"},"&__area":{display:"flex",gap:(0,d.r)(n.s),alignItems:"center","&--start":{justifyContent:"flex-start"},"&--end":{justifyContent:"flex-end"}},"&__crest":{"@container(min-width:760px)":{display:"none"}},"&__wordmark":{height:"10px","@container(max-width:759px)":{display:"none"}}},blur:{zIndex:-1,position:"absolute",inset:0,pointerEvents:"none","& > div":{position:"absolute",inset:0},"& > div:nth-of-type(1)":{WebkitBackdropFilter:"blur(64px)",backdropFilter:"blur(64px)",WebkitMaskImage:"linear-gradient(to bottom,rgba(0,0,0,100%) 0%,rgba(0,0,0,1) 12.5%,rgba(0,0,0,1) 25%,rgba(0,0,0,0) 37.5%)",maskImage:"linear-gradient(to bottom,rgba(0,0,0,100%) 0%,rgba(0,0,0,1) 12.5%,rgba(0,0,0,1) 25%,rgba(0,0,0,0) 37.5%)"},"& > div:nth-of-type(2)":{WebkitBackdropFilter:"blur(32px)",backdropFilter:"blur(32px)",WebkitMaskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 12.5%,rgba(0,0,0,1) 25%,rgba(0,0,0,1) 37.5%,rgba(0,0,0,0) 50%)",maskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 12.5%,rgba(0,0,0,1) 25%,rgba(0,0,0,1) 37.5%,rgba(0,0,0,0) 50%)"},"& > div:nth-of-type(3)":{WebkitBackdropFilter:"blur(16px)",backdropFilter:"blur(16px)",WebkitMaskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 25%,rgba(0,0,0,1) 37.5%,rgba(0,0,0,1) 50%,rgba(0,0,0,0) 62.5%)",maskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 25%,rgba(0,0,0,1) 37.5%,rgba(0,0,0,1) 50%,rgba(0,0,0,0) 62.5%)"},"& > div:nth-of-type(4)":{WebkitBackdropFilter:"blur(8px)",backdropFilter:"blur(8px)",WebkitMaskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 37.5%,rgba(0,0,0,1) 50%,rgba(0,0,0,1) 62.5%,rgba(0,0,0,0) 75%)",maskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 37.5%,rgba(0,0,0,1) 50%,rgba(0,0,0,1) 62.5%,rgba(0,0,0,0) 75%)"},"& > div:nth-of-type(5)":{WebkitBackdropFilter:"blur(4px)",backdropFilter:"blur(4px)",WebkitMaskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,1) 62.5%,rgba(0,0,0,1) 75%,rgba(0,0,0,0) 87.5%)",maskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,1) 62.5%,rgba(0,0,0,1) 75%,rgba(0,0,0,0) 87.5%)"},"& > div:nth-of-type(6)":{WebkitBackdropFilter:"blur(2px)",backdropFilter:"blur(2px)",WebkitMaskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 62.5%,rgba(0,0,0,1) 75%,rgba(0,0,0,1) 87.5%,rgba(0,0,0,0) 100%)",maskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 62.5%,rgba(0,0,0,1) 75%,rgba(0,0,0,1) 87.5%,rgba(0,0,0,0) 100%)"},"& > div:nth-of-type(7)":{WebkitBackdropFilter:"blur(1px)",backdropFilter:"blur(1px)",WebkitMaskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 75%,rgba(0,0,0,1) 87.5%,rgba(0,0,0,1) 100%)",maskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 75%,rgba(0,0,0,1) 87.5%,rgba(0,0,0,1) 100%)"},"& > div:nth-of-type(8)":{WebkitBackdropFilter:"blur(.5px)",backdropFilter:"blur(.5px)",WebkitMaskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 87.5%,rgba(0,0,0,1) 100%)",maskImage:"linear-gradient(to bottom,rgba(0,0,0,0) 87.5%,rgba(0,0,0,1) 100%)"},"&::after":{content:'""',position:"absolute",top:0,insetInlineStart:0,width:(0,d.r)(c.r),height:`calc(2 * ${(0,d.r)(c.r)})`,borderStartStartRadius:e?(0,d.r)(c.r):0,boxShadow:`0 calc(-1 * ${(0,d.r)(c.r)}) 0 0 ${k}`,transition:(0,d.c)("border-radius")}},main:{zIndex:2,gridArea:"main",padding:F},footer:{zIndex:5,gridArea:"footer",padding:`${F} ${F} ${(0,d.r)(l.s)}`,position:"sticky",bottom:0,"&::before":{content:'""',zIndex:-1,position:"absolute",inset:"-140px 0 0",pointerEvents:"none",background:`linear-gradient(to bottom,hsl(from ${o} h s l / 0) 0%,hsl(from ${o} h s l / 0.013) 8.1%,hsl(from ${o} h s l / 0.049) 15.5%,hsl(from ${o} h s l / 0.104) 22.5%,hsl(from ${o} h s l / 0.175) 29%,hsl(from ${o} h s l / 0.259) 35.3%,hsl(from ${o} h s l / 0.352) 41.2%,hsl(from ${o} h s l / 0.45) 47.1%,hsl(from ${o} h s l / 0.55) 52.9%,hsl(from ${o} h s l / 0.648) 58.8%,hsl(from ${o} h s l / 0.741) 64.7%,hsl(from ${o} h s l / 0.825) 71%,hsl(from ${o} h s l / 0.896) 77.5%,hsl(from ${o} h s l / 0.951) 84.5%,hsl(from ${o} h s l / 0.987) 91.9%,${o} 100%)`,borderEndStartRadius:e?(0,d.r)(c.r):0,transition:(0,d.c)("border-radius")}},sidebar:{zIndex:3,position:"sticky",top:0,height:"100dvh",padding:F,boxSizing:"border-box",overflow:"hidden auto",overscrollBehaviorY:"contain","&:focus-visible":{outline:"none"},"&--start":{gridArea:"sidebar-start",justifySelf:"flex-end",background:k,width:S,[O]:{width:I}},"&--end":{gridArea:"sidebar-end",justifySelf:"flex-start",borderInlineStart:`1px solid ${(0,d.r)(b.c)}`,background:o,width:w,[O]:{width:_}},"&__header":{zIndex:9999999,display:"flex",gap:(0,d.r)(n.s),alignItems:"center",position:"sticky",top:`calc(-1 * ${F})`,margin:`calc(-1 * ${F}) calc(-1 * ${F}) ${F}`,padding:`${(0,d.r)(n.s)} ${F}`,minHeight:"56px",boxSizing:"border-box","&--start":{justifyContent:"flex-start","&::before":{background:`linear-gradient(180deg,${k} 0%,${k} 65%,transparent 100%)`}},"&--end":{justifyContent:"space-between","&::before":{background:`linear-gradient(180deg,${o} 0%,${o} 65%,transparent 100%)`}},"&::before":{content:'""',zIndex:-1,position:"absolute",inset:"0 0 -8px",pointerEvents:"none"}}}})},W={sidebarStartOpen:t.A.boolean,sidebarEndOpen:t.A.boolean,background:t.A.oneOf(["canvas","surface"])};r.d(a,["p_canvas",0,class{constructor(e){(0,t.r)(this,e),this.sidebarStartUpd

1ate=(0,t.x)(this,"sidebarStartUpdate",3),this.sidebarEndDismiss=(0,t.x)(this,"sidebarEndDismiss",3),this.sidebarStartOpen=!1,this.sidebarEndOpen=!1,this.background="canvas",this.toggleSidebarStart=()=>{this.sidebarStartUpdate.emit({open:!this.sidebarStartOpen})},this.onDismissSidebarEnd=()=>{this.sidebarEndDismiss.emit()}}render(){(0,t.v)(this,W),this.hasTitle=(0,i.h)(this.host,"title"),this.hasSidebarEnd=(0,i.h)(this.host,"sidebar-end"),this.hasFooter=(0,i.h)(this.host,"footer"),this.hasBackground=(0,i.h)(this.host,"background"),(0,t.q)(this.host,C,this.sidebarStartOpen,this.sidebarEndOpen,this.background);const e=(0,t.g)(this.host);return(0,t.u)("div",{key:"b4de915477cc9f0b29647182d01f41d9d7ba1720",class:"root"},(0,t.u)("header",{key:"6276d5961ca36808274ca284674b4fbc7f783a8e",class:"header",tabIndex:-1},(0,t.u)("div",{key:"4b6e1490b667c988da81b1d2665598d64b265b2d",class:"blur"},(0,t.u)("div",{key:"77e2cb90ce2970fa0eda123b03c1361c41f3ed63"}),(0,t.u)("div",{key:"24d48e0cbc04ca96ec46038e106ae97bf6d37e52"}),(0,t.u)("div",{key:"397b0c7bb5e9dae7f1b27f7d8493fbf019706082"}),(0,t.u)("div",{key:"6756f15bde6cbe0206c12e1c9b5a982187c13623"}),(0,t.u)("div",{key:"af1f31e9736e9770721efe4e8e7d06f2501f6586"}),(0,t.u)("div",{key:"dcfdf5dceac0c2819da6c96599cc7c04b7ae11e6"}),(0,t.u)("div",{key:"d5e0d608cc5b3865e7298da9d40ea25f8c4f6d60"}),(0,t.u)("div",{key:"161fc7165b9550c9ce9ad215f2342a7b9152ea45"})),(0,t.u)("div",{key:"ba9fd9b56392970df861ab38802e7ef2d998906c",class:"header__area header__area--start"},!this.sidebarStartOpen&&(0,t.u)(e.pButton,{key:"36ba4489313eed9a10355c6e5f78392feb4f7196",icon:"sidebar",variant:"secondary",compact:!0,"hide-label":"true",aria:{"aria-expanded":this.sidebarStartOpen},onClick:this.toggleSidebarStart},this.sidebarStartOpen?"Close":"Open"," navigation sidebar"),(0,t.u)("slot",{key:"ee573b14d30b2d1b87977966462a9d35f0be064a",name:"header-start"})),(0,t.u)(e.pCrest,{key:"d473de8c938d2f5c6b0096116ff2a873459f96fd",class:"header__crest"}),(0,t.u)(e.pWordmark,{key:"b0a48f90b78c3faf93898953148c1a07dd0dfbea",class:"header__wordmark",size:"inherit"}),(0,t.u)("div",{key:"917d029b55e447a3415d908f83690285fff36128",class:"header__area header__area--end"},(0,t.u)("slot",{key:"c89c79d262df6cf42668879345b445ddb851e9fa",name:"header-end"}))),(0,t.u)("aside",{key:"35c414ab095163149c9e988ae3f67d7fd20a65c5",class:"sidebar sidebar--start",inert:!this.sidebarStartOpen,"aria-label":"Navigation sidebar "+(this.sidebarStartOpen?"open":"closed"),tabIndex:-1},(0,t.u)("div",{key:"2a672e4d02fc00594924527d377a9e009696c0a6",class:"sidebar__header sidebar__header--start"},(0,t.u)(e.pButton,{key:"787ff8dc206e09c762a0caf997afbcf704525301",icon:"sidebar",variant:"secondary",compact:!0,"hide-label":"true",aria:{"aria-expanded":this.sidebarStartOpen},onClick:this.toggleSidebarStart},this.sidebarStartOpen?"Close":"Open"," navigation sidebar"),this.hasTitle&&(0,t.u)("h2",{key:"ccc01b87a376e57f39e766e732888309d6876e8f"},(0,t.u)("slot",{key:"ceb3ade41c761757bd79223c01978b011dbb8088",name:"title"}))),(0,t.u)("slot",{key:"f0e02a496ab27f1d23270f423a19aaae45080183",name:"sidebar-start"})),(0,t.u)("main",{key:"c8649b0d5d1b068ba96444bb48a030ae839db531",class:"main"},(0,t.u)("slot",{key:"363b6b8ccb237378af1565db828ca55b09817194"})),this.hasSidebarEnd&&(0,t.u)("aside",{key:"f2ea636561fe5ca8fffcbf3e61b107af73777fa6",class:"sidebar sidebar--end",inert:!this.sidebarEndOpen,"aria-label":"Settings sidebar "+(this.sidebarEndOpen?"open":"closed"),tabIndex:-1},(0,t.u)("div",{key:"704580259c5c323a116c55e852e94a69df3d6ff2",class:"sidebar__header sidebar__header--end"},(0,t.u)("slot",{key:"c4a3b05a0e331d0e6e08d442cc0a50107f037aad",name:"sidebar-end-header"}),(0,t.u)(e.pButton,{key:"55a4a65f37e8061615df7ec0d534b44a9104c9ea",icon:"close",variant:"secondary",compact:!0,"hide-label":"true",aria:{"aria-expanded":this.sidebarEndOpen},onClick:this.onDismissSidebarEnd},this.sidebarEndOpen?"Close":"Open"," settings sidebar")),(0,t.u)("slot",{key:"aa0b4719f4f4d43e56166407cc707bc324ad759f",name:"sidebar-end"})),this.hasFooter&&(0,t.u)("footer",{key:"55c36a820c3e9cca4cf7abb49a6ae49d29bd5a4b",class:"footer"},(0,t.u)("slot",{key:"acf864d85406baf13d6ba6371ef0c98184763080",name:"footer"}

1)),this.hasBackground&&(0,t.u)("slot",{key:"f7043eae8a9e9884c1ffe63f0976820118d887d0",name:"background"}))}get host(){return(0,t.w)(this)}}])},1068(e,a,r){r.d(a,["p",0,{":not(:defined,[data-ssr])":{visibility:"hidden"}}])},1736(e,a,r){r.d(a,["r",0,"--p-radius-3xl"])},1861(e,a,r){r.d(a,["r",0,"--p-radius-sm"])},3827(e,a,r){r.d(a,["s",0,"--p-spacing-fluid-sm"])},751(e,a,r){r.d(a,["s",0,"--p-spacing-static-sm"])},2762(e,a,r){r.d(a,["t",0,"--p-typescale-xs"])}}]);