.photo.svelte-1xhdrad{padding-block:24px 16px}.photo.svelte-1xhdrad .frame{position:relative;border-radius:var(--radius-feature)}.photo.svelte-1xhdrad .frame:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(to top,#000000b8,#0000);pointer-events:none}.photo.svelte-1xhdrad figcaption{padding-inline:0}.principles.svelte-1xhdrad{display:grid;gap:12px;margin-top:28px}.principles.svelte-1xhdrad li:where(.svelte-1xhdrad){display:flex;flex-direction:column;gap:10px;padding:28px 24px;border-radius:var(--radius-feature);background:var(--surface-1);box-shadow:inset 0 0 0 1px var(--hairline)}.principles.svelte-1xhdrad h3:where(.svelte-1xhdrad){color:var(--snow);font-size:26px;line-height:1.4}.principles.svelte-1xhdrad p:where(.svelte-1xhdrad){color:var(--fg-2);line-height:1.9}@media(min-width:900px){.principles.svelte-1xhdrad{grid-template-columns:repeat(3,1fr);gap:16px}.principles.svelte-1xhdrad li:where(.svelte-1xhdrad){padding:36px 32px 40px}.principles.svelte-1xhdrad h3:where(.svelte-1xhdrad){font-size:30px}}@media(min-width:1024px){.photo.svelte-1xhdrad figcaption{inset-inline-start:48px;bottom:40px}}@media(prefers-reduced-motion:no-preference)and (min-width:900px){@supports (animation-timeline: view()){.principles.svelte-1xhdrad li:where(.svelte-1xhdrad){animation:svelte-1xhdrad-principle-rise linear both;animation-timeline:view();animation-range:entry calc(var(--i) * 10%) entry calc(55% + var(--i) * 10%)}}}@keyframes svelte-1xhdrad-principle-rise{0%{opacity:0;transform:translateY(72px)}to{opacity:1;transform:none}}