/* Lines, underlined names, three horizontal phrases, then their shared underline. */
#canva-entrance #brand-intro{
 --intro-duration:2200ms;
 --intro-fade-duration:150ms;
 --intro-lines-duration:250ms;
 --intro-first-delay:300ms;
 --intro-first-duration:250ms;
 --intro-last-delay:600ms;
 --intro-last-duration:300ms;
 --intro-motto-delay:950ms;
 --intro-motto-duration:200ms;
 --intro-motto-step:250ms;
 --intro-final-line-delay:1700ms;
 --intro-final-line-duration:250ms;
 position:fixed;inset:0;z-index:25;
 display:grid;place-items:center;
 width:100%;height:100vh;height:100dvh;min-height:0!important;
 padding:clamp(16px,3vw,32px);
 overflow:hidden;background:#080808;color:#e7e1d5;text-align:center;
}
#canva-entrance #brand-intro .brand-intro-inner{
 position:relative;display:grid;
 grid-template-rows:minmax(16px,1fr) auto minmax(16px,1fr);
 justify-items:center;align-items:stretch;
 row-gap:clamp(24px,5vh,44px);
 width:min(100%,640px);height:100%;max-height:860px;min-height:0;
 margin:0;padding:0 clamp(16px,4vw,32px);
 border:1px solid #c1a26b38;
}
#canva-entrance #brand-intro .brand-intro-line{
 display:block;justify-self:center;width:1px;height:100%;min-height:0;
 background:#c1a26b70;transform:scaleY(0);
}
#canva-entrance #brand-intro .brand-intro-line--top{transform-origin:center top}
#canva-entrance #brand-intro .brand-intro-line--bottom{transform-origin:center bottom}
#canva-entrance #brand-intro .brand-intro-copy{
 display:flex;flex-direction:column;align-items:center;
 gap:clamp(14px,2vh,22px);width:100%;min-width:0;
}
#canva-entrance #brand-intro .brand-intro-name{
 display:flex;flex-direction:column;align-items:center;gap:4px;
 margin:0!important;padding:0;font-style:normal!important;
 font-weight:400!important;line-height:1!important;opacity:1;
 animation:none!important;text-transform:none;
}
#canva-entrance #brand-intro .brand-intro-name>span{
 position:relative;display:block;margin:0!important;padding:0;opacity:0;
 white-space:nowrap;transform:translateY(8px);
}
#canva-entrance #brand-intro .brand-intro-first{
 font-family:'DM Sans',Arial,sans-serif!important;
 font-size:clamp(18px,5vw,24px);font-weight:500;line-height:1.2;
 letter-spacing:.22em!important;text-indent:.22em;color:#c1a26b!important;
}
#canva-entrance #brand-intro .brand-intro-last{
 font-family:'EB Garamond',Georgia,serif!important;
 font-size:clamp(84px,24vw,140px);font-weight:400;line-height:.9;
 letter-spacing:normal!important;color:#e7e1d5!important;margin-top:-.1em!important;
}
#canva-entrance #brand-intro .brand-intro-motto{
 position:relative;display:flex;align-items:baseline;justify-content:center;
 gap:clamp(6px,1.5vw,12px);width:max-content;max-width:100%;
 margin:0!important;padding:0 0 12px;
 font-family:'DM Sans',Arial,sans-serif!important;
 font-size:clamp(13px,3.6vw,18px)!important;font-weight:400;line-height:1.55!important;
 letter-spacing:normal!important;color:#bab4a7!important;
 opacity:1;transform:none;animation:none!important;
}
#canva-entrance #brand-intro .brand-intro-motto>span{
 display:block;white-space:nowrap;opacity:0;transform:translateY(8px);
 font-family:'DM Sans',Arial,sans-serif!important;
 font-size:inherit;line-height:inherit;font-weight:inherit;
}
#canva-entrance #brand-intro.playing .brand-intro-line{
 animation:db-intro-line-in var(--intro-lines-duration) cubic-bezier(.22,.61,.36,1) forwards;
}
#canva-entrance #brand-intro.playing .brand-intro-first{
 animation:db-intro-text-in var(--intro-first-duration) ease-out var(--intro-first-delay) forwards;
}
#canva-entrance #brand-intro.playing .brand-intro-last{
 animation:db-intro-text-in var(--intro-last-duration) ease-out var(--intro-last-delay) forwards;
}
#canva-entrance #brand-intro.playing .brand-intro-motto>span{
 animation:db-intro-text-in var(--intro-motto-duration) ease-out var(--intro-motto-delay) forwards;
}
#canva-entrance #brand-intro.playing .brand-intro-motto>span:nth-child(2){animation-delay:calc(var(--intro-motto-delay) + var(--intro-motto-step))}
#canva-entrance #brand-intro.playing .brand-intro-motto>span:nth-child(3){animation-delay:calc(var(--intro-motto-delay) + var(--intro-motto-step) * 2)}
#canva-entrance #brand-intro .brand-intro-name>span::after,
#canva-entrance #brand-intro .brand-intro-motto::after{
 content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;
 background:#c1a26b99;transform:scaleX(0);transform-origin:left center;
}
#canva-entrance #brand-intro .brand-intro-motto::after{bottom:0}
#canva-entrance #brand-intro.playing .brand-intro-first::after{animation:db-intro-underline-in 300ms ease calc(var(--intro-first-delay) + var(--intro-first-duration)) forwards}
#canva-entrance #brand-intro.playing .brand-intro-last::after{animation:db-intro-underline-in 300ms ease calc(var(--intro-last-delay) + var(--intro-last-duration)) forwards}
#canva-entrance #brand-intro.playing .brand-intro-motto::after{animation:db-intro-underline-in var(--intro-final-line-duration) ease var(--intro-final-line-delay) forwards}
#canva-entrance #brand-intro.fading{
 animation:db-intro-screen-out var(--intro-fade-duration) ease forwards;
 pointer-events:none;
}
@keyframes db-intro-line-in{to{transform:scaleY(1)}}
@keyframes db-intro-text-in{to{opacity:1;transform:translateY(0)}}
@keyframes db-intro-underline-in{to{transform:scaleX(1)}}
@keyframes db-intro-screen-out{to{opacity:0}}
@media(max-height:500px){
 #canva-entrance #brand-intro{padding:12px}
 #canva-entrance #brand-intro .brand-intro-inner{row-gap:16px}
 #canva-entrance #brand-intro .brand-intro-copy{gap:16px}
 #canva-entrance #brand-intro .brand-intro-first{font-size:14px}
 #canva-entrance #brand-intro .brand-intro-last{font-size:72px}
 #canva-entrance #brand-intro .brand-intro-motto{font-size:15px!important;line-height:1.4!important}
}
@media(prefers-reduced-motion:reduce){
 #canva-entrance #brand-intro .brand-intro-line,
 #canva-entrance #brand-intro .brand-intro-name>span,
 #canva-entrance #brand-intro .brand-intro-motto,
 #canva-entrance #brand-intro .brand-intro-motto>span,
 #canva-entrance #brand-intro .brand-intro-name>span::after,
 #canva-entrance #brand-intro .brand-intro-motto::after{
  animation:none!important;transform:none;opacity:1;
 }
 #canva-entrance #brand-intro.fading{animation:none}
}

/* Skip remains available throughout the short introduction. */
#canva-entrance #brand-intro #intro-skip-button{position:absolute;z-index:2;left:50%;bottom:max(20px,env(safe-area-inset-bottom,0px));transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);background:#080808;color:#e7e1d5}
