:root{color-scheme:light dark;--bg:light-dark(#f6f6f8,#16171d);--surface:light-dark(#fff,#24252d);--text:light-dark(#18191f,#ececf1);--muted:light-dark(#4b4d58,#b7b8c3);--line:light-dark(#c8c9d0,#50515c);--focus:light-dark(#0a66c2,#56b9ff);--button:light-dark(#18191f,#ececf1);--button-text:light-dark(#fff,#18191f);--danger:light-dark(#b8321f,#ff8f80)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.6}a{color:inherit}a,button,input{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--focus);outline-offset:4px}button,input{font:inherit}img{display:block;max-width:100%;height:auto}button,a,input{min-width:0}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.12;letter-spacing:-.035em}h1{font-size:clamp(42px,6vw,76px);margin-bottom:24px;font-weight:720}h2{font-size:clamp(26px,3vw,36px);margin-bottom:24px}h3{font-size:20px;margin-bottom:12px}p{color:var(--muted)}
.site-header,main,footer{width:min(100% - 48px,1080px);margin-inline:auto}.site-header{min-height:96px;display:flex;align-items:center;justify-content:space-between;gap:16px}.wordmark{display:flex;align-items:center;gap:12px;min-height:44px;text-decoration:none;font-size:20px;font-weight:700;letter-spacing:-.035em}.wordmark img{width:40px;height:40px;border-radius:8px}.studio{font-size:14px;color:var(--muted)}.hero{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:64px;padding:48px 0 80px}.eyebrow{font-size:14px;font-weight:650;letter-spacing:.02em;margin-bottom:16px}.intro{font-size:18px;max-width:38ch;margin-bottom:24px}.hero-puffin{width:100%;border-radius:12px}.primary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;border:1px solid transparent;border-radius:8px;background:var(--button);color:var(--button-text);font-weight:650;text-decoration:none;cursor:pointer;transition:opacity .16s}.primary:hover{opacity:.85}.caption{font-size:14px;margin:8px 0;color:var(--muted)}.text-link{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:4px;font-size:14px}.steps,.pairing,.requirements{padding:48px 0;border-top:1px solid var(--line)}.steps ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;list-style:none;padding:0;margin:32px 0 0}.steps li{min-width:0}.step-number{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--line);border-radius:8px;margin-bottom:24px;font-weight:650}.steps p{margin-bottom:0}.pairing{display:grid;grid-template-columns:1fr 1fr;gap:64px}.pairing p{max-width:42ch}.pairing form{min-width:0}label{display:block;margin-bottom:8px;font-weight:600}input{width:100%;min-height:48px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);padding:12px;font-size:16px}input::placeholder{color:var(--muted);opacity:1}.pairing button{margin-top:16px}.error{color:var(--danger);margin-top:16px}.requirements ul{padding-left:24px;max-width:76ch}.requirements li{margin-bottom:12px;color:var(--muted)}.requirements strong{color:var(--text)}.requirements .caption{max-width:76ch}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;padding:24px 0 40px;font-size:14px;color:var(--muted)}
@media(max-width:700px){.site-header,main,footer{width:calc(100% - 32px)}.site-header{min-height:80px}.wordmark{font-size:18px;gap:8px}.studio{font-size:12px}.hero{grid-template-columns:1fr;gap:32px;padding:24px 0 40px}.hero-puffin{grid-row:1;width:min(68vw,300px);justify-self:center}.hero-copy{max-width:480px}.hero h1 br{display:none}.intro{font-size:16px}.steps,.pairing,.requirements{padding:32px 0}.steps ol{grid-template-columns:1fr;gap:24px}.steps li{display:flex;gap:16px}.step-number{flex:0 0 40px;margin:0}.pairing{grid-template-columns:1fr;gap:16px}.pairing h2{margin-bottom:16px}.pairing p{margin-bottom:12px}footer{flex-direction:column;gap:4px}.primary{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
