.approach{--wwd-bg:#fff;--wwd-border:#00000014;--wwd-media-size:clamp(11rem, 48vw, 15rem);--wwd-overflow:clamp(-4.5rem, -16vw, -3rem);--ease-spring:cubic-bezier(.22, 1, .36, 1);background:var(--wwd-bg);padding:4.5rem 1.25rem 5rem;overflow-x:hidden}.approach-inner{width:100%}.approach-intro{flex-direction:column;gap:1.75rem;margin-bottom:3rem;display:flex}.eyebrow span{-webkit-text-fill-color:initial;background:#a855f7;border-radius:50%;flex-shrink:0;width:5px;height:5px;box-shadow:0 0 8px #a855f7}.section-intro h2{color:#000000e0;margin:0;font-family:Syne,sans-serif;font-size:clamp(1.8rem,5.5vw,2.25rem);font-weight:700;line-height:1.1}.section-intro h2 em{font-style:normal}.approach-copy p{font-family:var(--font-primary,"DM Sans", sans-serif);color:#0009;max-width:40ch;margin:0 0 1.1rem;font-size:.9rem;line-height:1.65}.inline-link{font-family:var(--font-primary,"DM Sans", sans-serif);color:#111;transition:border-color .3s var(--ease-spring), opacity .3s var(--ease-spring);border-bottom:1px solid #00000040;align-items:center;gap:.4rem;padding-bottom:.15rem;font-size:.85rem;font-weight:600;text-decoration:none;display:inline-flex}.inline-link span{transition:transform .3s var(--ease-spring)}.inline-link:hover{border-color:#000000b3}.inline-link:hover span{transform:translate(2px,-2px)}.principles{flex-direction:column;display:flex}.principle{border-top:1px solid var(--wwd-border);align-items:center;gap:1rem;padding:2rem 0;display:flex;position:relative}.principle:first-child{border-top:none;padding-top:0}.principle--right{flex-direction:row}.principle--right .principle-media{margin-right:var(--wwd-overflow);order:2}.principle--left{flex-direction:row}.principle--left .principle-media{margin-left:var(--wwd-overflow);order:-1}.principle--left .principle-text{order:2}.principle--tight{--wwd-overflow:clamp(-2.5rem, -8vw, -1.75rem)}.principle-text{flex:54%;min-width:0}.principle-number{font-family:var(--font-primary,"DM Sans", sans-serif);letter-spacing:.08em;color:#0006;margin-bottom:.5rem;font-size:.7rem;font-weight:600;display:block}.principle-text h3{color:#000000e0;margin:0 0 .6rem;font-family:Syne,sans-serif;font-weight:700;line-height:1.15;font-size:clamp(1.2rem,4.5vw,1.35rem)!important}.principle-text p{font-family:var(--font-primary,"DM Sans", sans-serif);color:#00000080;max-width:28ch;margin:0;line-height:1.55;font-size:.8rem!important}.principle-media{width:var(--wwd-media-size);aspect-ratio:1;background:#f0f0f2;border-radius:45%;flex:none;position:relative;overflow:hidden}.principle-media img{object-fit:cover;filter:saturate(.95);width:100%;height:100%;transition:transform .9s cubic-bezier(.25,1,.5,1),filter .5s;display:block}.principle:hover .principle-media img{filter:saturate(1.05);transform:scale(1.06)}.principle-media:after{content:"";background:radial-gradient(circle at 30% 30%, transparent 55%, color-mix(in srgb, var(--gradient-end,#a855f7) 20%, transparent) 100%);pointer-events:none;border-radius:50%;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #0000000f}.approach .principles{flex-direction:column;width:100%;display:flex}.approach .principle{width:100%}@media (min-width:768px){.approach{padding:5.5rem 2.5rem 6.5rem}.approach-intro{max-width:32rem}.eyebrow{font-size:.75rem}.principle{padding:2.5rem 0}.principle-text p{max-width:34ch;font-size:.9rem}}@media (min-width:1024px){.approach{padding:7rem 4rem 8rem}.approach-inner{grid-template-columns:.85fr 1.15fr;align-items:start;gap:4rem;max-width:1280px;margin:0 auto;display:grid}.approach-intro{max-width:none;margin-bottom:0;position:sticky;top:6rem}.principles{border-top:1px solid var(--wwd-border)}.principle,.principle--left,.principle--right{border-top:none;border-bottom:1px solid var(--wwd-border);flex-direction:row;padding:2.25rem 0}.principles .principle:first-child{padding-top:2.25rem}.principle--left .principle-media,.principle--right .principle-media{order:2;margin-left:0;margin-right:clamp(-6rem,-6vw,-3.5rem)}.principle--left .principle-text,.principle--right .principle-text{order:1}.principle--tight .principle-media{margin-right:clamp(-6rem,-6vw,-3.5rem)}.principle-text{flex:60%}.principle-media{--wwd-media-size:clamp(11rem, 13vw, 15rem)}.principle-text h3{font-size:1.4rem}.principle-text p{max-width:36ch;font-size:.9rem}.approach .principles{flex-direction:column}}@media (min-width:1440px){.approach{padding:8rem 5rem 9rem}}
