@layer theme,base;@layer components{.contact{--danger:light-dark(#c62828,#ff8a80);--edge:light-dark(#8a8a8a,#6b6b6b);padding-top:80px;padding-bottom:120px}.wrap.contact{max-width:1000px}.contact header{text-align:center;margin-bottom:56px}.contact h1{letter-spacing:-.03em;font-size:clamp(44px,6.4vw,84px);font-weight:500;line-height:1.05}.contact .lead{color:var(--mute);margin-top:18px;font-size:20px;line-height:1.6}.contact .direct{text-align:center;color:var(--mute);margin-top:-4px;font-size:15px;line-height:1.7}.contact :is(.direct,.failed) a{color:var(--ink);text-underline-offset:3px;text-decoration:underline}.contact form{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;display:grid}.contact :is(.topics,.field:has(textarea,#amount),.direct,.failed){grid-column:1/-1}.contact label,.contact legend{font-size:16px;font-weight:500}.contact legend{margin-bottom:14px}.contact .opt{color:var(--mute);margin-left:8px;font-size:14px;font-weight:400}.contact .field:has(:required) .opt{display:none}.contact .field{flex-direction:column;display:flex}.contact .hint{color:var(--mute);order:1;margin-top:8px;font-size:14px}.contact .field :is(input,textarea){border:1px solid var(--edge);background:var(--bg);border-radius:99px;width:100%;min-height:56px;margin-top:10px;padding:14px 24px;scroll-margin-top:120px;font-size:17px;line-height:1.5;display:block}.contact .field textarea{resize:vertical;border-radius:28px}.contact input[type=number]{appearance:textfield}.contact input[type=number]::-webkit-inner-spin-button{appearance:none}.contact .field :is(input,textarea):user-invalid{border-color:var(--danger)}.contact .error{color:var(--danger);margin-top:8px;font-size:14px}.contact .error:empty{display:none}.contact .topics{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px;display:grid}.contact .topics label{background:var(--card);letter-spacing:-.02em;cursor:pointer;border-radius:32px;flex-direction:column;justify-content:flex-end;min-height:270px;padding:26px;font-size:22px;line-height:1.2;transition:transform .15s;display:flex;position:relative}.contact .topics label:hover{transform:translateY(-2px)}.contact .topics label:has(:checked){box-shadow:inset 0 0 0 2px var(--ink)}.contact .topics label:has(:focus-visible){outline:2px solid var(--accent-ink);outline-offset:3px}.contact .topics input{width:22px;height:22px;accent-color:var(--ink);outline:none;position:absolute;top:26px;left:26px}.contact .topics small{letter-spacing:0;color:var(--mute);margin-top:8px;font-size:15px;font-weight:400;line-height:1.5}.contact .topics img{width:auto;height:96px;filter:var(--prop-filter);opacity:.4;transition:opacity .15s;position:absolute;top:22px;right:22px}.contact .topics label:has(:checked) img{opacity:1}.contact .pills{flex-wrap:wrap;align-content:flex-start;gap:8px;display:flex}.contact .pills label{border:1px solid var(--edge);cursor:pointer;border-radius:99px;align-items:center;min-height:44px;padding:0 16px;font-size:15px;display:flex}.contact .pills label:hover{border-color:var(--ink)}.contact .pills label:has(:checked){border-color:var(--ink);background:var(--ink);color:var(--bg)}.contact .pills label:has(:focus-visible){outline:2px solid var(--accent-ink);outline-offset:3px}.contact .pills input{opacity:0;position:absolute}.contact .trap{position:absolute;left:-9999px}.contact .failed{text-align:center;color:var(--danger);font-size:15px;line-height:1.7}.contact form>.btn{cursor:pointer;grid-column:1/-1;justify-self:center;min-height:60px;padding:0 44px;font-size:18px}.contact form>.btn[aria-disabled]{opacity:.6;cursor:progress}.contact .sent{text-align:center;outline:none}.contact .sent h2{letter-spacing:-.02em;font-size:32px;font-weight:500}.contact .sent img{width:auto;height:120px;filter:var(--prop-filter);margin:0 auto 28px}@media (prefers-reduced-motion:reduce){.contact .topics :is(label,img){transition:none}}@media (width<=760px){.contact{padding-top:48px;padding-bottom:80px}.contact header{margin-bottom:40px}.contact form,.contact .topics{grid-template-columns:minmax(0,1fr)}.contact .field,.contact .topics{grid-column:1}.contact .topics label{border-radius:24px;min-height:0;padding:22px 96px 22px 62px;font-size:19px}.contact .topics img{height:60px;top:50%;right:20px;translate:0 -50%}}}@layer utilities;