/* Hero och pennscen. Samma mått och klasser som pennsektionen i webb-4. Slutläget ligger i CSS. */
.dragavs{position:relative;overflow:clip;container-type:inline-size;padding:calc(72px + max(0px,(var(--wh) - 576px)*.3)) var(--mar) 72px;--wh:clamp(500px,40vw,800px);--T:16px;--sg:3px;--rx:calc(var(--mar) + max(0px,(100cqw - var(--bredd))/2));min-height:max(480px,calc(.3667*var(--wh) + 280px + max(0px,(var(--wh) - 576px)*.5)))}
.dragavs .rut{align-items:center}
.drag-tx{grid-column:1/7}.drag-tx .t1h{max-width:11em;margin-top:20px}.drag-tx .ing{margin-top:24px;max-width:36ch}
.drag-tx .tag{color:var(--ink)}
.scene{grid-column:7/-1;justify-self:end;width:max-content;max-width:none;margin-right:max(0px,calc(.6*var(--wh) + 16px - var(--rx)));display:flex;flex-direction:column;align-items:flex-start;padding-bottom:var(--T)}
.fynd-mark{display:inline-block;font:400 12px/1.3 var(--mono);border:1px solid var(--ink);padding:1px 6px;color:var(--ink)}
.fynd{margin:16px 0 0;font:600 clamp(40px,3vw,72px)/1.05 var(--ui);letter-spacing:-.025em;color:var(--ink)}
.fynd .rad{display:block;white-space:nowrap}
.ord{position:relative;display:inline-block}
.streck{position:absolute;left:0;width:100%;top:calc(100% + var(--sg));height:var(--T);background:#131417;transform-origin:0 50%;z-index:0}
.hand{position:absolute;display:block;width:calc(var(--wh)*2.7);height:calc(var(--wh)*.3667);max-width:none;left:calc(100% - .01006*var(--wh));bottom:calc(-1*(var(--sg) + var(--T)/2) - .0101*var(--wh));transform:translate3d(calc(.3em + 14px),-16px,0);will-change:transform;pointer-events:none;z-index:2}
.fynd-gor{margin:calc(var(--T) + 20px) 0 0;font:400 clamp(20px,1.5vw,28px)/1.3 var(--las);color:var(--ink)}
.dragavs.anim:not(.klar) .fynd-mark,.dragavs.anim:not(.klar) .fynd,.dragavs.anim:not(.klar) .fynd-gor{opacity:0}
.dragavs.anim:not(.klar) .streck{transform:scaleX(0)}
@media(max-width:1200px){
 .dragavs{padding:40px var(--mar) 56px;--wh:clamp(300px,96vw,440px);--T:10px;--sg:2px;min-height:0}
 .drag-tx,.scene{grid-column:1/-1}.drag-tx .t1h{max-width:none}.drag-tx .ing{max-width:none}
 .scene{justify-self:start;margin:32px 0 0}
 .fynd{font-size:min(calc((100vw - 2*var(--mar))/8.1),56px)}
 .fynd-gor{font-size:clamp(18px,4.6vw,24px)}
 .dragavs:not(.anim) .hand,.dragavs.klar .hand{display:none}
}