/* Why/Process V1. All selectors are confined to these new sections. */
.why-sparrow,
.our-process { position: relative; isolation: isolate; overflow: clip; }
.why-process__inner.container { position: relative; z-index: 1; width: min(83rem, calc(100% - 13.5vw)); }
/* Reclaim empty space from this following sibling only. The preceding sticky
   list, its travel and all seven cards retain their original geometry.
   A 1.5rem safety allowance remains within its reserved tail. */
.why-sparrow { --why-exit-space: 0px; margin-block-start: calc(-1 * (clamp(2rem, 4vw, 4rem) + var(--why-exit-space))); padding-block: clamp(3rem, 4vw, 4rem) 2.5rem; background: linear-gradient(170deg, #fff 50%, #eef3ff); color: var(--sparrow-midnight); }
.why-process__label { margin: 0 0 1.25rem; color: #526193; font-size: 0.875rem; line-height: 1.4; letter-spacing: 0.13em; text-transform: uppercase; }
.why-sparrow__header { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); gap: 3rem; align-items: center; }
.why-sparrow__title,
.our-process__title { margin: 0; font-size: clamp(2.25rem, 5.4vw, 5.25rem); font-weight: 850; letter-spacing: -0.045em; line-height: 0.93; text-transform: uppercase; }
.why-sparrow__title > span,
.our-process__title > span { display: block; }
.why-process__gradient { width: fit-content; color: var(--sparrow-blue); background: linear-gradient(105deg, #008ce2, var(--sparrow-blue) 42%, var(--sparrow-violet) 95%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.why-sparrow__statement { max-width: 42ch; margin: 2.5rem 0 0; color: #526193; font-size: clamp(1rem, 1.45vw, 1.25rem); line-height: 1.5; }
.why-sparrow__features { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 2.5rem 0 0; padding: 0; list-style: none; }
.why-sparrow__features > li { position: relative; min-width: 0; padding-inline: clamp(1.25rem, 3.5vw, 3.5rem) 1rem; }
.why-sparrow__features > li:first-child { padding-left: 0; }
.why-sparrow__features > li + li::before { position: absolute; top: 1rem; bottom: 0; left: 0; width: 1px; background: #c8d1ef; content: ""; }
.why-sparrow__icon { display: block; width: 4rem; height: 4rem; margin-bottom: 1rem; }
.why-sparrow__features h3 { margin: 0 0 0.65rem; font-size: clamp(1.125rem, 1.6vw, 1.5rem); font-weight: 750; line-height: 1.18; letter-spacing: -0.04em; }
.why-sparrow__features p { max-width: 23ch; margin: 0; color: #526193; font-size: clamp(1rem, 1.3vw, 1.125rem); line-height: 1.45; }
.our-process { padding-block: 3rem; background: radial-gradient(ellipse at 90% 100%, #17265c 0, transparent 46%), #050f24; color: var(--sparrow-white); }
.our-process .why-process__label { color: #75dfff; }
.our-process .why-process__gradient { background-image: linear-gradient(100deg, var(--sparrow-cyan), var(--sparrow-blue) 40%, #ac46f8); }
.our-process__header { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr) auto; align-items: center; gap: 2rem; }
.our-process__title { font-size: clamp(2.5rem, 5.2vw, 4.75rem); }
.our-process__statement { max-width: 30ch; margin: 0; padding: 1.5rem 0 1.5rem 2.5rem; border-left: 1px solid #2a3c64; color: #d1d7ee; font-size: clamp(1rem, 1.3vw, 1.25rem); line-height: 1.5; }
.why-process__cta { display: inline-flex; min-height: 3.5rem; align-items: center; justify-content: center; gap: 1.5rem; padding: 0.5rem 0.75rem 0.5rem 1.75rem; border: 2px solid transparent; border-radius: 4rem; background: linear-gradient(#050f24, #050f24) padding-box, linear-gradient(110deg, #b74af2, #02cfe9) border-box; color: var(--sparrow-white); font-size: 1rem; font-weight: 650; line-height: 1.3; text-decoration: none; cursor: pointer; }
.why-process__cta .action-arrow { display: inline-grid; place-items: center; width: 2.25rem; height: 2.25rem; border: 1px solid #5366dc; border-radius: 50%; background: transparent; color: var(--sparrow-white); }
.why-process__cta:focus-visible { outline: 3px solid var(--sparrow-cyan); outline-offset: 5px; }
.why-process__cta:disabled { cursor: not-allowed; opacity: 0.75; }
.our-process__action noscript p { max-width: 25ch; font-size: 0.875rem; }
.our-process__steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 1rem 0 0; padding: 0; list-style: none; }
.our-process__steps > li { position: relative; min-width: 0; padding-inline: 3rem 0.5rem; }
.our-process__steps > li:not(:last-child)::after { position: absolute; top: 3.5rem; left: calc(3rem + 10rem + 1rem); width: calc(100% - 10rem - 2rem); height: 1px; background: #b9c5de; content: ""; }
.our-process__number { display: block; width: 10rem; height: auto; overflow: visible; font-family: inherit; }
.our-process__steps h3 { margin: 0 0 0.25rem; font-size: 1.5rem; font-weight: 750; letter-spacing: -0.035em; line-height: 1.2; }
.our-process__steps p { max-width: 21ch; margin: 0; color: #d1d7ee; font-size: 1.0625rem; line-height: 1.45; }
/* Approved alpha artwork: no backgrounds, masks, opacity washes or filters.
   Only these independent absolute layers move; document geometry is stable. */
.why-process__decoration { position: absolute; z-index: 0; pointer-events: none; }
.why-process__decoration img { display: block; width: 100%; height: auto; max-width: none; }
.why-process__decoration--top { top: -15rem; right: -12rem; width: 46rem; animation: why-glass-top 9s ease-in-out -2s infinite; }
.why-process__decoration--left { left: -24rem; bottom: -16rem; width: 64rem; animation: why-glass-left 11s ease-in-out -5s infinite; }
.why-process__decoration--right { right: -23rem; bottom: -16rem; width: 56rem; animation: why-glass-right 8s ease-in-out -3s infinite; }
@keyframes why-glass-top { 0%, 100% { transform: translate3d(0, 0, 0) rotate(-0.6deg); } 50% { transform: translate3d(8px, -18px, 0) rotate(0.6deg); } }
@keyframes why-glass-left { 0%, 100% { transform: translate3d(0, 0, 0) rotate(-0.8deg); } 50% { transform: translate3d(4px, -14px, 0) rotate(0.8deg); } }
@keyframes why-glass-right { 0%, 100% { transform: translate3d(0, -16px, 0) rotate(0.7deg); } 50% { transform: translate3d(-5px, 0, 0) rotate(-0.7deg); } }
/* Match the existing Services sticky eligibility and dimensions without
   altering that section. Viewport units slightly overestimate its content
   width when a scrollbar is present, conservatively reclaiming less space. */
@media (min-width: 48rem) and (min-height: 50rem) and (prefers-reduced-motion: no-preference),
       (min-width: 75rem) and (min-height: 42rem) and (prefers-reduced-motion: no-preference) {
	.why-sparrow { --why-preceding-card-height: calc(min(80rem, calc(100vw - 5rem)) * 5 / 12); --why-exit-space: max(0px, calc(100svh - var(--why-preceding-card-height) - 1.5rem - clamp(4rem, 7vw, 7rem) - 4rem - 1.5rem)); }
}
@media (min-width: 48rem) and (max-width: 74.99rem) and (min-height: 50rem) and (prefers-reduced-motion: no-preference) {
	.why-sparrow { --why-preceding-card-height: calc((100vw - 5rem) * 5 / 12 + 15rem); }
}
@media (min-width: 48rem) and (max-width: 63.99rem) and (min-height: 50rem) and (prefers-reduced-motion: no-preference) {
	.why-sparrow { --why-preceding-card-height: calc((100vw - 3rem) * 5 / 12 + 15rem); }
}
@media (max-width: 79.99rem) and (min-width: 64rem) {
	.our-process__header { gap: 1.5rem; }
	.our-process__statement { padding-left: 1.5rem; }
	.why-process__cta { gap: 0.75rem; padding-left: 1rem; font-size: 0.875rem; }
	.our-process__steps > li { padding-left: 2rem; }
	.our-process__steps > li:not(:last-child)::after { left: 12.5rem; width: calc(100% - 11rem); }
}
@media (max-width: 63.99rem) {
	.why-process__inner.container { width: calc(100% - 3rem); }
	.why-sparrow__header { grid-template-columns: 1fr; gap: 1.5rem; }
	.why-sparrow__statement { max-width: 48ch; margin: 0; }
	.why-sparrow__features { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; }
	.why-sparrow__features > li { padding-inline: 0 1rem; }
	.why-sparrow__features > li:nth-child(odd)::before { display: none; }
	.why-sparrow__features > li:nth-child(even) { padding-left: 2rem; }
	.our-process__header { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
	.our-process__statement { padding-left: 1.5rem; }
	.our-process__action { grid-column: 1 / -1; }
	.our-process__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 0; margin-top: 2rem; }
	.our-process__steps > li { padding-left: 2rem; }
	.our-process__steps > li::after { display: none; }
	.our-process__steps > li:nth-child(odd)::after { display: block; left: 13rem; width: calc(100% - 12rem); }
	.why-process__decoration--top { right: -12rem; top: -15rem; width: 38rem; }
	.why-process__decoration--left { width: 48rem; left: -21rem; bottom: -14rem; }
	.why-process__decoration--right { width: 40rem; right: -18rem; bottom: -12rem; }
}
@media (max-width: 39.99rem) {
	.why-process__inner.container { width: calc(100% - 2.5rem); }
	.why-sparrow { padding-block: 2.5rem; }
	.why-sparrow__title { font-size: clamp(1.9rem, 9.3vw, 3.5rem); letter-spacing: -0.06em; }
	.why-process__label { font-size: 0.75rem; }
	.why-sparrow__features { grid-template-columns: 1fr; margin-top: 2.5rem; gap: 1.5rem; }
	.why-sparrow__features > li { padding: 0 0 1.5rem; border-bottom: 1px solid #c8d1ef; }
	.why-sparrow__features > li:nth-child(even) { padding-left: 0; }
	.why-sparrow__features > li::before { display: none; }
	.why-sparrow__features > li:last-child { border-bottom: 0; padding-bottom: 0; }
	.why-sparrow__icon { width: 3.5rem; height: 3.5rem; }
	.our-process { padding-block: 2.5rem 3rem; }
	.our-process__header { grid-template-columns: 1fr; }
	.our-process__title { font-size: clamp(2.25rem, 10vw, 3.5rem); }
	.our-process__statement { max-width: 30ch; border: 0; padding: 0; }
	.our-process__steps { grid-template-columns: 1fr; gap: 1.75rem; }
	.our-process__steps > li { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); align-items: center; gap: 1rem; padding: 0; }
	.our-process__steps > li:nth-child(odd)::after { display: none; }
	.our-process__number { width: 6.5rem; }
	.our-process__steps h3 { font-size: 1.25rem; }
	.our-process__steps p { font-size: 1rem; }
	.why-process__decoration--top { top: -14rem; right: -10rem; width: 28rem; }
	.why-process__decoration--left { width: 32rem; left: -14.75rem; bottom: -10rem; }
	.why-process__decoration--right { width: 36rem; right: -19.5rem; bottom: -11rem; }
}
@media (prefers-reduced-motion: reduce) {
	.why-process__decoration { animation: none; transform: none; }
}
@media (forced-colors: active) {
	.why-process__gradient { background: none; -webkit-text-fill-color: currentColor; }
	.why-process__decoration { display: none; }
	.our-process__number text { stroke: currentColor; }
}
