/* Home page welcome intro — shown only when html.intro-on is set by the inline script on a fresh arrival. */
.ss-intro{display:none}
html.intro-on .ss-intro{display:block;position:fixed;inset:0;z-index:9999;pointer-events:auto;overflow:hidden;animation:ss-intro-fallback 0s linear 4.5s forwards}
html.intro-on:not(.intro-done){overflow:hidden}
html.intro-done .ss-intro{display:none}
html.intro-on:not(.intro-done) .hero *{animation-play-state:paused!important}

.ss-cloud{position:absolute;width:95vmax;height:80vmax;border-radius:50%;background:radial-gradient(closest-side,#f6f3ec 72%,#efe9dc 92%,rgba(239,233,220,0));transition:transform 1s cubic-bezier(.6,0,.25,1),opacity .9s ease,filter 1s ease;will-change:transform,opacity}
.ss-cloud.c1{left:-40vmax;top:-45vmax}
.ss-cloud.c2{right:-40vmax;top:-42vmax;background:radial-gradient(closest-side,#f6f3ec 72%,#f1e4e0 92%,rgba(241,228,224,0))}
.ss-cloud.c3{left:-45vmax;bottom:-45vmax;background:radial-gradient(closest-side,#f6f3ec 72%,#e6ece0 92%,rgba(230,236,224,0))}
.ss-cloud.c4{right:-42vmax;bottom:-46vmax}
.ss-cloud.c5{left:50%;top:50%;width:110vmax;height:90vmax;margin:-45vmax 0 0 -55vmax}
.ss-cloud.c6{left:50%;top:-55vmax;margin-left:-45vmax;background:radial-gradient(closest-side,#f6f3ec 72%,#e8e6f0 92%,rgba(232,230,240,0))}

.ss-intro-centre{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(18px,3vh,32px);transition:opacity .45s ease,transform .6s ease}
.ss-intro-mark{display:block;width:clamp(84px,11vw,130px);aspect-ratio:1;animation:ss-mark-in .7s cubic-bezier(.2,.8,.2,1) both;will-change:transform,opacity}
.ss-intro-mark svg{display:block;width:100%;height:100%;overflow:visible}
.ss-spin{transform-box:fill-box;transform-origin:center;will-change:transform;animation:ss-mark-spin 3.2s cubic-bezier(.65,0,.35,1) .35s infinite}
.ss-intro-word{width:clamp(180px,22vw,280px);aspect-ratio:273/44;background:#ba2126;-webkit-mask:url(/site/assets/brand/library/illustrations/illustration-welcome.svg) 50% 50%/103.6% auto no-repeat;mask:url(/site/assets/brand/library/illustrations/illustration-welcome.svg) 50% 50%/103.6% auto no-repeat;clip-path:inset(0 100% 0 0);animation:ss-word-in 1.1s cubic-bezier(.5,0,.2,1) .5s forwards}

html.intro-out .ss-intro{pointer-events:none}
html.intro-out .ss-intro-centre{opacity:0;transform:scale(.94)}
html.intro-out .ss-intro-mark{animation:none;transition:transform .7s ease,opacity .6s ease;transform:scale(.85);opacity:0}
html.intro-out .ss-cloud{opacity:0;filter:blur(18px)}
html.intro-out .c1{transform:translate(-45vw,-45vh)}
html.intro-out .c2{transform:translate(45vw,-45vh)}
html.intro-out .c3{transform:translate(-45vw,45vh)}
html.intro-out .c4{transform:translate(45vw,45vh)}
html.intro-out .c5{transform:scale(1.6);transition-duration:.9s}
html.intro-out .c6{transform:translateY(-60vh)}

html.intro-reduced .ss-spin,html.intro-reduced .ss-intro-mark,html.intro-reduced .ss-intro-word{animation:none;clip-path:none}
html.intro-reduced.intro-out .ss-intro{opacity:0;transition:opacity .3s ease}
html.intro-reduced.intro-out .ss-cloud{transform:none;filter:none;transition:none}

@keyframes ss-mark-in{from{opacity:0;transform:scale(.7)}}
@keyframes ss-mark-spin{0%,10%{transform:rotate(0)}22%,35%{transform:rotate(90deg)}47%,60%{transform:rotate(180deg)}72%,85%{transform:rotate(270deg)}97%,100%{transform:rotate(360deg)}}
@keyframes ss-word-in{to{clip-path:inset(0 0 0 0)}}
@keyframes ss-intro-fallback{to{visibility:hidden;opacity:0}}