/* ידע הסלע: still water at dawn. River stones drop one at a time into a balanced cairn; the last pebble is the blue one. Then everything is still. */
.ns-sig--cairn { --sig-bg: #e6ebf0; --sig-fg: #1e293b; min-height: clamp(36rem, 88svh, 54rem); align-items: start; padding-block-start: clamp(3rem, 12svh, 7rem); background-image: linear-gradient(#aebccb, #d8e0e7 40%, #f4ebdd 72%); }
.ns-sig--cairn .ns-sig__title { font-size: clamp(3.6rem, 9.4vw, 8.4rem); font-weight: 800; letter-spacing: -.01em; }
.ns-sig--cairn .ns-sig__tagline { max-width: 26ch; font-size: clamp(1.25rem, 2.3vw, 1.8rem); color: #1e293b; }

.cn-bg { position: absolute; inset: 0; width: 100%; height: 100%; }
.cn-far { transform: translateX(calc((var(--mx) - .5) * 14px)); }
.cn-near { transform: translateX(calc((var(--mx) - .5) * 30px)); }
.cn-rip { stroke: #fff; stroke-opacity: .4; stroke-width: 1.5; stroke-dasharray: 90 170 240 60 40 310; }

/* the stack: one svg per stone, so the lit filter is painted once and only moved */
.cn-col { position: absolute; inset-block-end: 16%; inset-inline-end: 6%; width: var(--col, clamp(24rem, 34vw, 31rem)); aspect-ratio: 600 / 780; }
.cn-s { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; animation: cn-drop 1.25s calc(var(--i) * .5s) both; }
@keyframes cn-drop {
	0% { transform: translateY(-125svh) rotate(calc(var(--i) * 1.4deg - 4deg)); animation-timing-function: cubic-bezier(.55, 0, 1, .55); }
	58% { transform: none; animation-timing-function: cubic-bezier(.2, .6, .4, 1); }
	70% { transform: translateY(-1.5%) rotate(.9deg); animation-timing-function: cubic-bezier(.6, 0, .9, .5); }
	83% { transform: none; }
	91% { transform: translateY(-.3%) rotate(-.3deg); }
	100% { transform: none; }
}
.cn-rf { position: absolute; bottom: 3%; left: 0; width: 100%; height: 100%; transform: scaleY(-.8); transform-origin: 50% 100%; filter: blur(2.5px); -webkit-mask-image: linear-gradient(to top, #000 4%, transparent 40%); mask-image: linear-gradient(to top, #000 4%, transparent 40%); }
.cn-rf use { opacity: .55; animation: cn-in .3s calc(var(--i) * .5s + .7s) both; }
@keyframes cn-in { from { opacity: 0; } }
.cn-ring { position: absolute; top: 94%; left: 2%; width: 96%; height: 9%; border: 2px solid #fff; border-radius: 50%; opacity: 0; animation: cn-ring 1.7s .7s ease-out forwards; }
.cn-ring + .cn-ring { animation-delay: 1.2s; }
@keyframes cn-ring { from { opacity: .8; transform: scale(.8); } to { opacity: 0; transform: scale(1.9); } }

@media (max-width: 767px) {
	.ns-sig--cairn { --col: min(19rem, 80vw); min-height: min(46rem, 92svh); padding-block-start: 2.2rem; }
	.ns-sig--cairn .ns-sig__inner { text-align: start; }
	.cn-col { inset-inline-end: calc(50% - var(--col) / 2); inset-block-end: 13%; }
}

/* touches: three pebbles balanced before section titles; a card that settles without fuss */
body.ns-sig-cairn .ns-cat-block__head .ns-section-title::before { content: ""; display: inline-block; width: .9em; height: .95em; margin-inline-end: .4em; vertical-align: -.1em; background: radial-gradient(ellipse 50% 50%, #0ea5e9 92%, transparent) 50% 0 / 42% 30% no-repeat, radial-gradient(ellipse 50% 50%, #94a3b8 92%, transparent) 42% 42% / 68% 36% no-repeat, radial-gradient(ellipse 50% 50%, #475569 92%, transparent) 50% 100% / 100% 42% no-repeat; }
body.ns-sig-cairn .ns-fc { transition: transform .4s cubic-bezier(.3, 1.4, .5, 1); }
body.ns-sig-cairn .ns-fc:hover { transform: translateY(2px); }
body.ns-sig-cairn .ns-footer { border-block-start: 5px solid #94a3b8; }