/* Moving day: a truck backs in, the ramp drops, cartons fall and stack up beside it. */
.ns-sig--boxes { --sig-bg: #fbf1df; --sig-fg: #3d2b1f; min-height: clamp(36rem, 84svh, 50rem); align-items: start; padding-block-start: clamp(1.5rem, 4vh, 2.5rem); }
.ns-sig--boxes .ns-sig__inner { gap: .5rem; }
.ns-sig--boxes .ns-sig__title { max-width: 7em; font-size: clamp(3.2rem, 7.4vw, 6.4rem); font-weight: 900; line-height: .92; letter-spacing: -.01em; }
.ns-sig--boxes .ns-sig__tagline { max-width: none; font-weight: 600; font-size: clamp(1.1rem, 1.8vw, 1.45rem); }
.bx-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; background: linear-gradient(transparent 20%, #f9dcae 80%); }
.bx-n { font-size: 68px; font-weight: 800; fill: #fff; text-anchor: middle; }
.bx-p { font-size: 15px; font-weight: 700; fill: #3d2b1f; text-anchor: middle; }
.bx-far { transform: translateX(calc((.5 - var(--mx)) * 36px)); transition: transform .5s ease-out; }
.bx-truck { animation: bx-in 1.5s cubic-bezier(.2, .7, .25, 1) both; }
.bx-dive { transform-origin: 460px 640px; animation: bx-dive .7s ease-out 1.25s both; }
.bx-wh { transform-box: fill-box; transform-origin: center; animation: bx-roll 1.5s cubic-bezier(.2, .7, .25, 1) both; }
.bx-ramp { animation: bx-ramp .55s cubic-bezier(.5, 0, .7, 1) 1.4s both; }
.bx { animation: bx-drop .85s linear 1.7s both; }
.bx-p > :nth-child(2) .bx { animation-delay: 2s; } .bx-p > :nth-child(3) .bx { animation-delay: 2.3s; } .bx-p > :nth-child(4) .bx { animation-delay: 2.65s; } .bx-p > :nth-child(5) .bx { animation-delay: 3.0s; } .bx-p > :nth-child(6) .bx { animation-delay: 3.3s; } .bx-p > :nth-child(7) .bx { animation-delay: 3.6s; } .bx-p > :nth-child(8) .bx { animation-delay: 3.95s; }
@keyframes bx-in { from { transform: translateX(-1100px); } }
@keyframes bx-roll { from { transform: rotate(-720deg); } }
@keyframes bx-dive { 0%, 100% { transform: none; } 35% { transform: rotate(-1deg); } 70% { transform: rotate(.35deg); } }
@keyframes bx-ramp { 0% { transform: rotate(-58deg); } 80% { transform: rotate(2deg); } 100% { transform: none; } }
@keyframes bx-drop {
	0% { transform: translateY(-860px); animation-timing-function: cubic-bezier(.5, 0, 1, .6); }
	52% { transform: scale(1.08, .86); animation-timing-function: ease-out; }
	70% { transform: translateY(-26px) rotate(2deg); animation-timing-function: ease-in; }
	86% { transform: scale(1.03, .96); }
	100% { transform: none; }
}
@media (max-width: 767px) {
	.ns-sig--boxes { min-height: 0; padding-block: 1.5rem min(62vw, 15.5rem); }
	.bx-svg { inset: auto 0 0 auto; width: min(123vw, 480px); height: auto; background: none; }
	.ns-sig--boxes .ns-sig__title { font-size: clamp(3rem, 15vw, 4rem); }
}

/* touches: a strip of parcel tape on the section titles, a card that lands */
body.ns-sig-boxes .ns-cat-block__head .ns-section-title::before { content: ""; display: inline-block; width: 1.1em; height: .85em; margin-inline-end: .45em; vertical-align: -.08em; background: linear-gradient(90deg, transparent 40%, #f4e4c0 0 60%, transparent 0), #cb8d4e; box-shadow: inset 0 -2px #94602c; }
body.ns-sig-boxes .ns-fc:hover { transform: translateY(-4px) rotate(.5deg); }
