/* Fixed shared word footprint keeps the headline and copy stationary. */
.tear-word{display:inline-grid;position:relative;isolation:isolate;vertical-align:baseline;white-space:nowrap}
.tear-semantic,.tear-better,.tear-paper{grid-area:1/1}
.tear-semantic{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.tear-better{visibility:hidden}
.tear-word.is-ready .tear-better{visibility:visible}
.tear-paper{position:relative;z-index:1;color:var(--orange);padding:0;transform-origin:7% 15%}
.tear-word.is-ready .tear-paper{cursor:grab;touch-action:pan-y;user-select:none;filter:drop-shadow(0 .035em .018em #392d2338);transition:transform 160ms ease}
.tear-word.is-ready .tear-paper::before{content:"";position:absolute;z-index:-1;inset:-.065em -.025em -.035em -.025em;background:repeating-linear-gradient(13deg,#ffffff00 0 3px,#65503b0b 3px 4px),linear-gradient(100deg,#e7d2b8,#f7e9d5 38%,#ead8be 85%,#d6bfa0);clip-path:polygon(0 5%,5% 2%,11% 6%,18% 0,24% 4%,32% 1%,40% 5%,49% 0,58% 4%,66% 1%,74% 5%,84% 0,93% 4%,100% 1%,99% 24%,100% 43%,99% 65%,100% 85%,97% 100%,91% 95%,84% 100%,77% 95%,69% 99%,60% 94%,51% 100%,44% 96%,35% 100%,27% 95%,18% 100%,10% 95%,1% 99%,2% 74%,0 51%,1% 29%)}
.tear-word.is-ready .tear-paper::after{content:"";position:absolute;right:-.02em;bottom:-.035em;width:.17em;height:.18em;background:linear-gradient(135deg,#f8eddd 45%,#b69b7770 49%,#ead6b9 55%);clip-path:polygon(100% 0,100% 100%,0 100%);transform-origin:right bottom;transition:transform 160ms}
@media(hover:hover){.tear-paper:hover{transform:rotate(-1.2deg) translateY(-.018em)}.tear-paper:hover::after{transform:scale(1.2)}}
.tear-paper:focus-visible{outline:2px dashed var(--ink);outline-offset:.07em;transform:rotate(-1deg)}
.tear-paper.is-grabbed{cursor:grabbing!important;transform:translate(var(--peel-x,0px),-.045em) rotate(-3deg) skewY(-2deg)}
.tear-word.is-torn .tear-paper{pointer-events:none;animation:paper-tear-away 640ms cubic-bezier(.4,0,.65,1) forwards}
@keyframes paper-tear-away{0%{transform:translate(0,0)}25%{transform:translate(.06em,-.13em) rotate(-8deg) skewY(-5deg)}48%{transform:translate(.15em,.12em) rotate(9deg)}100%{transform:translate(.25em,1.25em) rotate(24deg);opacity:0}}
.tear-word.is-settled .tear-paper{visibility:hidden;animation:none}
@media(prefers-reduced-motion:reduce){.tear-word .tear-paper,.tear-word .tear-paper::after{transition:none!important;transform:none!important}.tear-word.is-torn .tear-paper{animation:none;visibility:hidden}}
