.hero-mark{--hm-size:clamp(250px, 24vw, 360px);width:var(--hm-size);aspect-ratio:1;pointer-events:none;-webkit-user-select:none;user-select:none;isolation:isolate;margin:34px 0 0 auto;position:relative}@media (width>=1100px){:is(.pe-stage:has(>.hero-mark),.cp-header:has(>.hero-mark),.p2-work-header:has(>.hero-mark),.page-head:has(>.hero-mark)){position:relative}.hero-mark{margin:0;position:absolute;top:clamp(150px,13vw,200px);right:clamp(24px,4vw,64px)}:is(.cp-header,.p2-work-header,.page-head):has(>.hero-mark)>:not(.hero-mark){max-width:min(100%,100% - clamp(250px,24vw,360px) - clamp(24px,4vw,64px) - 32px)}}[data-page-energy] .pe-stage:has(>.hero-mark):before{display:none}.hero-mark-panel{border-radius:var(--radius-sm);position:absolute}.hero-mark-panel--back{background:color-mix(in srgb, var(--frost) 82%, var(--carbon));inset:14% 6% 20% 22%;rotate:7deg;box-shadow:0 18px 40px -18px #0009}.hero-mark-panel--front{background:var(--cream);color:var(--cream-ink);font:400 clamp(26px, 2.6vw, 38px)/1 var(--font-stamp);letter-spacing:.01em;text-transform:uppercase;box-shadow:8px 8px 0 var(--ember);padding:14px 18px;bottom:10%;left:4%;right:18%;rotate:-5deg}.hero-mark-burst{fill:none;width:34%;stroke:var(--ember);stroke-width:10px;stroke-linecap:square;position:absolute;top:-4%;right:-2%;overflow:visible}.hero-mark-num{z-index:1;font:400 calc(var(--hm-size) * .62)/1 var(--font-stamp);letter-spacing:-.02em;color:#0000;-webkit-text-stroke:2px var(--ember);position:absolute;top:-6%;left:0}.hero-mark-num:before{content:attr(data-n);z-index:-1;-webkit-text-stroke:2px color-mix(in srgb, var(--frost-hi) 70%, transparent);position:absolute;inset:0;translate:9px 9px}.hero-mark--work .hero-mark-panel--back{background:color-mix(in srgb, var(--ember) 30%, var(--carbon));inset:18% 14% 22%;rotate:-6deg}.hero-mark--company .hero-mark-panel--front{text-align:center;right:30%}.hero-mark--islands .hero-mark-panel--back{border-radius:50%;inset:10% 4% 18% 24%}.hero-mark--notes .hero-mark-panel--back{background:repeating-linear-gradient(0deg, color-mix(in srgb, var(--frost) 82%, var(--carbon)) 0 22px, color-mix(in srgb, var(--frost) 62%, var(--carbon)) 22px 24px);rotate:11deg}.hero-mark--contact .hero-mark-panel--back{background:color-mix(in srgb, var(--ember) 42%, var(--carbon));rotate:-9deg}.hero-mark--contact .hero-mark-burst{stroke:var(--frost-hi)}.hero-mark-burst{animation:14s linear infinite hm-burst}.hero-mark-panel--back{animation:hm-sway-back 9s var(--ease) infinite}.hero-mark-panel--front{animation:hm-sway-front 7s var(--ease) infinite}.hero-mark-num{animation:hm-drift 8s var(--ease) infinite}.hero-mark *{animation-play-state:paused}[data-page-energy] .pe-stage[data-energy-live=true] .hero-mark *{animation-play-state:running}[data-page-energy][data-energy-on=false] .hero-mark *,html[data-motion=off] .hero-mark *{animation-play-state:paused}[data-page-energy] .pe-stage[data-energy-entered=true] .hero-mark{animation:hm-land .9s var(--ease) both .15s}html[data-motion=off] .hero-mark{animation:none}@keyframes hm-burst{to{rotate:360deg}}@keyframes hm-sway-back{0%,to{translate:0}50%{translate:-8px 10px}}@keyframes hm-sway-front{0%,to{translate:0}50%{translate:10px -6px}}@keyframes hm-drift{0%,to{translate:0}50%{translate:6px -8px}}@keyframes hm-land{0%{opacity:0;transform:translateY(36px)rotate(4deg)scale(.92)}to{opacity:1;transform:none}}@media (width<=1099px){.hero-mark{--hm-size:clamp(170px, 34vw, 240px)}.hero-mark-panel--front{box-shadow:6px 6px 0 var(--ember);padding:10px 14px;font-size:clamp(20px,3.4vw,28px)}}
