/*! Tolips Typografi 1.0.0 */
.tt{display:block;position:relative}
span.tt{display:block}

/* Dölj tills JS har satt startläget (failsafe efter 2,5 s om något går fel) */
.tt-js .tt:not(.tt-ready),
.tt-js .tt-blur:not(.tt-ready),.tt-js .tt-wave:not(.tt-ready),.tt-js .tt-highlight:not(.tt-ready),
.tt-js .tt-sliced:not(.tt-ready),.tt-js .tt-clip:not(.tt-ready),.tt-js .tt-distort:not(.tt-ready),
.tt-js .tt-flip:not(.tt-ready),.tt-js .tt-fill:not(.tt-ready),.tt-js .tt-scramble:not(.tt-ready),
.tt-js .tt-imagefill:not(.tt-ready),.tt-js .tt-imagegrow:not(.tt-ready),.tt-js .tt-ring:not(.tt-ready),
.tt-js .tt-particles:not(.tt-ready),.tt-js .tt-bulge:not(.tt-ready){visibility:hidden;animation:tt-failsafe 0s 2.5s forwards}
@keyframes tt-failsafe{to{visibility:visible}}

.tt-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
.tt-vis{display:block}
.tt-w{display:inline-block;white-space:nowrap}
.tt-c{display:inline-block}
.tt-c.tt-g{opacity:.55!important}

/* Scroll */
.tt-fx-blur .tt-w,.tt-fx-wave .tt-c,.tt-fx-flip .tt-c,.tt-fx-clip .tt-w{will-change:transform,opacity}
.tt-fx-flip .tt-w{perspective:600px}
.tt-fx-flip .tt-c{transform-origin:50% 100%;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.tt-fx-highlight .tt-w{
  --tt-hl:var(--tt-accent,rgba(196,150,110,.42));
  background-image:linear-gradient(transparent 58%,var(--tt-hl) 58%,var(--tt-hl) 92%,transparent 92%);
  background-repeat:no-repeat;background-size:0% 100%;padding:0 .06em;margin:0 -.06em}
.tt-sliced{overflow-x:clip}
.tt-slice{position:absolute;left:0;top:0;width:100%;will-change:transform}

/* Scramble och hover */
.tt-fx-scramble .tt-c,.tt-fx-shuffle .tt-c,.tt-fx-terminal .tt-c{text-align:center}
.tt-fx-shuffle,.tt-fx-terminal,.tt-fx-roll,.tt-fx-scramble{cursor:default;-webkit-tap-highlight-color:transparent}
.tt-fx-terminal .tt-vis{display:inline-block;position:relative}
.tt-fx-terminal .tt-vis::after{content:"";position:absolute;left:0;bottom:-.06em;height:max(1px,.05em);width:100%;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.7,0,.2,1)}
.tt-fx-terminal.tt-on .tt-vis::after{transform:scaleX(1)}
.tt-fx-roll .tt-c{height:1.15em;line-height:1.15em;overflow:hidden;vertical-align:top}
.tt-r{display:block;position:relative;transition:transform .7s cubic-bezier(.76,0,.24,1);transition-delay:calc(var(--i,0) * 12ms)}
.tt-r::after{content:attr(data-ch);position:absolute;left:0;top:100%}
.tt-fx-roll.tt-on .tt-r{transform:translateY(-100%)}
.tt-spot-wrap>.tt-vis:not(.tt-spot){opacity:.16}
.tt-spot{position:absolute;left:0;top:0;width:100%;pointer-events:none;
  -webkit-mask-image:radial-gradient(circle var(--tt-r,1.8em) at var(--mx,50%) var(--my,50%),#000 30%,transparent 100%);
  mask-image:radial-gradient(circle var(--tt-r,1.8em) at var(--mx,50%) var(--my,50%),#000 30%,transparent 100%)}

/* Bild i text */
.tt-fx-imagefill .tt-vis{
  background-image:var(--tt-img,linear-gradient(120deg,#d9c2a3,#7a2e3b 40%,#1d1a1f 65%,#c9a27e));
  background-size:100% auto;background-position:50% 50%;background-repeat:repeat;
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.tt-slot{display:inline-block;position:relative;width:0;height:.78em;overflow:hidden;vertical-align:-.04em;
  background:var(--tt-img,linear-gradient(120deg,#d9c2a3,#7a2e3b 45%,#1d1a1f));background-size:cover;background-position:center;border-radius:.05em}
.tt-slot img{position:absolute;left:50%;top:0;height:100%;width:var(--tt-slot-w,2.6em);max-width:none;object-fit:cover;transform:translateX(-50%)}

/* 3D / WebGL */
.tt-ring-stage{display:block;position:relative;height:1.3em;line-height:1.3em}
.tt-ringc{position:absolute;left:50%;top:0;width:0;height:100%;transform-style:preserve-3d}
.tt-rc{position:absolute;top:0;left:0;white-space:pre;will-change:opacity}
.tt-canvas-wrap{touch-action:pan-y}
.tt-cv{position:absolute;left:0;top:0;pointer-events:none}
.tt-cv-on>.tt-vis{visibility:hidden}

@media (prefers-reduced-motion:reduce){.tt-r{transition:none}}

.tt-nb{white-space:nowrap}
