.v-i .sw-hero{padding-block:clamp(72px,10vw,120px)}.v-i .sw-hero h1{max-width:14ch}.v-i .sw-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0;padding:0;list-style:none;display:grid}.v-i .sw-card{border:1px solid var(--fg-on-light-5);background:var(--white);height:100%;transition:border-color var(--dur-1) var(--easing-standard), transform var(--dur-1) var(--easing-standard);border-radius:6px;flex-direction:column;gap:8px;padding:28px;display:flex}.v-i .sw-card:hover{border-color:var(--teal-on-light);transform:translateY(-2px)}.v-i .sw-card-kicker{font:600 11px/1 var(--font-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-on-light-3)}.v-i .sw-card-title{font:700 clamp(20px, 2.2vw, 26px)/1.15 var(--font-sans);color:var(--fg-on-light-1);margin:4px 0 0}.v-i .sw-card-desc{font:400 14px/1.55 var(--font-sans);color:var(--fg-on-light-2);text-wrap:pretty;margin:4px 0 0}.v-i .sw-card-foot{font:600 13px/1.4 var(--font-sans);color:var(--teal-on-light);align-items:center;gap:6px;margin-top:auto;padding-top:16px;display:inline-flex}.v-i .sw-detail{padding-top:clamp(48px,8vw,88px)}.v-i .sw-breadcrumb{font:500 13px/1.4 var(--font-sans);color:var(--fg-on-light-3);margin:0 0 24px}.v-i .sw-breadcrumb a{color:var(--fg-on-light-2)}.v-i .sw-breadcrumb a:hover{color:var(--teal-on-light)}.v-i .sw-breadcrumb [aria-current=page]{color:var(--fg-on-light-1)}.v-i .sw-layout{grid-template-columns:minmax(0,1fr) 240px;align-items:start;gap:clamp(40px,6vw,88px);display:grid}.v-i .sw-article{min-width:0;max-width:68ch}.v-i .sw-kicker{font:600 11px/1 var(--font-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-on-light-3);margin:0 0 14px}.v-i .sw-article h1{font:800 clamp(30px, 4vw, 44px)/1.08 var(--font-sans);letter-spacing:var(--ls-title);color:var(--fg-on-light-1);text-wrap:balance;margin:0 0 18px}.v-i .sw-lede{font:500 18px/1.55 var(--font-sans);color:var(--fg-on-light-2);text-wrap:pretty;margin:0 0 32px}.v-i .sw-body p{font:400 16px/1.65 var(--font-sans);color:var(--fg-on-light-2);text-wrap:pretty;margin:0 0 1.25em}.v-i .sw-phases,.v-i .sw-pitfalls{border-top:1px solid var(--fg-on-light-5);margin-top:clamp(40px,5vw,56px);padding-top:clamp(32px,4vw,48px)}.v-i .sw-phases h2,.v-i .sw-pitfalls h2{font:700 clamp(20px, 2.2vw, 24px)/1.2 var(--font-sans);color:var(--fg-on-light-1);margin:0 0 20px}.v-i .sw-phases ol{counter-reset:sw-phase;flex-direction:column;gap:24px;margin:0;padding:0;list-style:none;display:flex}.v-i .sw-phases li{counter-increment:sw-phase;padding-left:40px;position:relative}.v-i .sw-phases li:before{content:counter(sw-phase, decimal-leading-zero);font:600 12px/1 var(--font-mono);color:var(--teal-on-light);position:absolute;top:2px;left:0}.v-i .sw-phases h3{font:600 16px/1.35 var(--font-sans);color:var(--fg-on-light-1);margin:0 0 8px}.v-i .sw-phases p{font:400 15px/1.6 var(--font-sans);color:var(--fg-on-light-2);margin:0}.v-i .sw-pitfalls ul{font:400 15px/1.6 var(--font-sans);color:var(--fg-on-light-2);margin:0;padding:0 0 0 1.2em}.v-i .sw-pitfalls li+li{margin-top:10px}.v-i .sw-rail{align-self:start;position:sticky;top:88px}.v-i .sw-meta{border-bottom:1px solid var(--fg-on-light-5);margin:0 0 24px;padding:0 0 24px}.v-i .sw-meta div+div{margin-top:16px}.v-i .sw-meta dt{font:600 11px/1 var(--font-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-on-light-3);margin:0 0 4px}.v-i .sw-meta dd{font:500 14px/1.45 var(--font-sans);color:var(--fg-on-light-1);margin:0}.v-i .sw-links{font:500 14px/1.45 var(--font-sans);margin-bottom:24px}.v-i .sw-links a{color:var(--teal-on-light)}.v-i .sw-links a:hover{text-decoration:underline}.v-i .sw-related h2,.v-i .sw-glossary h2{font:600 11px/1 var(--font-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-on-light-3);margin:0 0 12px}.v-i .sw-related ul,.v-i .sw-glossary ul{flex-wrap:wrap;gap:8px;margin:0 0 24px;padding:0;list-style:none;display:flex}.v-i .sw-related a,.v-i .sw-glossary a{border:1px solid var(--fg-on-light-5);font:500 13px/1.4 var(--font-sans);color:var(--fg-on-light-2);transition:border-color var(--dur-1) var(--easing-standard), color var(--dur-1) var(--easing-standard);border-radius:4px;padding:8px 14px;display:inline-flex}.v-i .sw-related a:hover,.v-i .sw-glossary a:hover{border-color:var(--teal-on-light);color:var(--teal-on-light)}@media (max-width:900px){.v-i .sw-list,.v-i .sw-layout{grid-template-columns:1fr}.v-i .sw-rail{position:static}}@media (prefers-reduced-motion:reduce){.v-i .sw-card{transition:none}}
