/* Royal mobile brand refinement: upright artwork, continuous cloth, drawn UI icons. */
.official-mark,.footer .foot-brand,.brand-ident img{mix-blend-mode:normal!important;-webkit-mask:none!important;mask:none!important;object-fit:contain}
.royal-ui-icon{display:inline-block;width:1.1em;height:1.1em;flex:none;vertical-align:middle;overflow:visible;pointer-events:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.royal-brand-intro{background:transparent;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);place-items:center;width:100%;height:100vh;height:100dvh;min-height:0;padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px);box-sizing:border-box;touch-action:none}
.royal-brand-intro .brand-curtain{inset:0 auto 0 0;width:50%;height:100%;background-image:linear-gradient(90deg,#020c2e33,transparent 65%),url('https://www.royalspvf.co.za/wp-content/uploads/2026/10/Royal-Blue-Silk-%E2%80%94-Website-Artwork.png');background-size:200% 100%;background-position:left center;box-shadow:none;transform:none;transform-origin:left center;will-change:transform}
.royal-brand-intro .brand-curtain.right{left:auto;right:0;inset-block:0;background-position:right center;transform:none;transform-origin:right center}
.royal-brand-intro .brand-curtain:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,#0002 0,transparent 9%,#94b5ea12 15%,#0003 25%,transparent 33%);pointer-events:none}
.royal-brand-intro .brand-curtain:after{content:"";position:absolute;inset:0 0 0 auto;width:8%;background:linear-gradient(90deg,transparent,#0003);pointer-events:none}
.royal-brand-intro .brand-curtain.right:after{inset:0 auto 0 0;background:linear-gradient(90deg,#0003,transparent)}
.royal-brand-intro .brand-ident{grid-area:1/1;justify-self:center;align-self:center;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:min(82vw,380px);max-width:100%;padding:0;margin:0;text-align:center;transform:none;z-index:3;pointer-events:none}
.royal-brand-intro .brand-ident:before,.royal-brand-intro .brand-ident:after{content:none;animation:none}
.royal-brand-intro .brand-ident img{display:block;width:clamp(185px,55vw,280px);max-width:100%;max-height:55svh;height:auto;margin-inline:auto;object-position:center;transform:none;filter:drop-shadow(0 12px 20px #0003)}
.royal-brand-intro .brand-ident-name{display:block;margin:20px 0 0;padding:0;width:100%;font:normal 10px/1.85 var(--sans);letter-spacing:.21em;text-align:center;color:#edcf96}
.royal-brand-intro.is-playing .brand-curtain{animation:royal-cloth-left 1.65s .85s cubic-bezier(.76,0,.24,1) both}
.royal-brand-intro.is-playing .brand-curtain.right{animation-name:royal-cloth-right}
.royal-brand-intro.is-playing .brand-ident{animation:royal-centred-ident 1.75s both}
@keyframes royal-cloth-left{0%{transform:translate3d(0,0,0) scaleX(1)}100%{transform:translate3d(-101%,0,0) scaleX(.82)}}
@keyframes royal-cloth-right{0%{transform:translate3d(0,0,0) scaleX(1)}100%{transform:translate3d(101%,0,0) scaleX(.82)}}
@keyframes royal-centred-ident{0%{opacity:0;transform:translateY(8px) scale(.97)}24%,56%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-8px) scale(1.015)}}
.royal-brand-intro .brand-skip{position:absolute;display:inline-flex;align-items:center;justify-content:center;gap:18px;right:max(24px,env(safe-area-inset-right,0px));bottom:max(24px,calc(env(safe-area-inset-bottom,0px) + 14px));padding:12px 17px;min-height:44px;font:11px/1.4 var(--sans);letter-spacing:.02em;background:#03143b80;border:1px solid #d9bd8266;color:#f0d9ae;z-index:4;white-space:nowrap}
.royal-brand-intro.is-exiting{opacity:0;transition:opacity .18s ease;pointer-events:none}
.royal-brand-intro:not(.is-playing) .brand-ident{opacity:0}
@media(max-width:600px){.royal-brand-intro .brand-ident{width:82vw}.royal-brand-intro .brand-ident-name{font-size:9px;margin-top:18px;letter-spacing:.2em}.royal-brand-intro .brand-skip{left:50%;right:auto;transform:translateX(-50%);bottom:max(24px,calc(env(safe-area-inset-bottom,0px) + 16px))}.audience-arrow .royal-ui-icon{width:23px;height:23px}.btn .arrow{display:inline-flex;align-items:center;justify-content:center}.btn .arrow .royal-ui-icon{width:18px;height:18px}}
.wpvibe-preview-active .royal-brand-intro .brand-skip{bottom:max(74px,calc(env(safe-area-inset-bottom,0px) + 66px))}
@media(prefers-reduced-motion:reduce){.royal-brand-intro{display:none!important}.royal-ui-icon{animation:none!important;transition:none!important}}
