.contact-flow{--flow-line:#f1efe938;--grid-x:0px;--grid-y:0px;--pointer-x:50vw;--pointer-y:50vh;background:var(--ink);height:100dvh;min-height:100svh;color:var(--paper);position:relative;overflow:hidden}.contact-flow:before{z-index:1;background:radial-gradient(circle 4.25rem at var(--pointer-x) var(--pointer-y), #8b85ff80 0%, #8b85ff38 42%, transparent 76%);content:"";pointer-events:none;position:fixed;inset:0}.contact-flow:after{color:#f1efe906;letter-spacing:-.09em;content:"asiakkaita.com";pointer-events:none;font-size:clamp(6rem,17vw,18rem);font-weight:650;line-height:.8;position:fixed;bottom:-.18em;right:-.04em}.contact-flow-grid{z-index:0;pointer-events:none;transform:translate3d(var(--grid-x), var(--grid-y), 0);will-change:transform;background-color:#0000;background-image:linear-gradient(#f1efe90d 1px,#0000 1px),linear-gradient(90deg,#f1efe90d 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:clamp(4rem,8vw,8rem) clamp(4rem,8vw,8rem);background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:fixed;inset:-2rem}.contact-flow-nav{z-index:10;letter-spacing:.07em;text-transform:uppercase;justify-content:space-between;width:100%;padding:1.65rem clamp(1.25rem,3vw,3.5rem);font-size:.72rem;display:flex;position:fixed;top:0;left:0}.contact-flow-nav>a:first-child{color:#f1efe9c7;font-family:var(--font-sans), Arial, sans-serif;letter-spacing:.09em;font-size:clamp(.57rem,.64vw,.73rem);font-weight:500;line-height:1.45}.contact-flow-nav>a:first-child span{color:#f1efe961;letter-spacing:.09em;vertical-align:baseline;margin-left:.12rem;font-size:1em}.contact-flow-close{align-items:center;gap:.7rem;display:flex}.contact-flow-close span{font-size:1.25rem;line-height:0}.contact-flow-progress{z-index:10;background:#f1efe91f;width:100%;height:2px;position:fixed;top:0;left:0}.contact-flow-progress span{background:var(--acid);transform-origin:0;width:100%;height:100%;transition:transform .5s cubic-bezier(.22,1,.36,1);display:block}.contact-flow-index{color:#f1efe97a;letter-spacing:.12em;text-transform:uppercase;gap:.4rem;font-size:.62rem;display:grid;position:fixed;top:50%;left:clamp(1.25rem,3vw,3.5rem);transform:translateY(-50%)}.contact-flow-stage{z-index:2;place-items:center start;height:100dvh;min-height:0;padding:clamp(4rem,8vh,7rem) clamp(1.25rem,5vw,6rem) clamp(2rem,4vh,6rem) clamp(8rem,16vw,18rem);display:grid;position:relative}.contact-flow-panel{width:min(100%,78rem);animation:.56s cubic-bezier(.22,1,.36,1) both contact-panel-in}.contact-flow-kicker{color:var(--acid);letter-spacing:.13em;text-transform:uppercase;margin:0 0 clamp(1.5rem,4vh,3rem);font-size:.68rem;font-weight:600}.contact-flow h1{max-width:72rem;font-family:var(--font-sans), Arial, sans-serif;letter-spacing:-.065em;margin:0 0 clamp(3rem,8vh,6rem);font-size:clamp(3.6rem,7.8vw,8rem);font-weight:500;line-height:.9}.contact-flow-options{border-top:1px solid var(--flow-line);max-width:70rem;display:grid}.contact-flow-options button{border:0;border-bottom:1px solid var(--flow-line);width:100%;color:var(--paper);font:inherit;text-align:left;cursor:pointer;background:0 0;grid-template-columns:3rem 1fr auto;align-items:center;gap:1rem;padding:1.35rem 0;font-size:clamp(1.15rem,2vw,2rem);transition:color .22s,padding .3s;display:grid}.contact-flow-options button span{color:#f1efe966;letter-spacing:.12em;font-size:.62rem}.contact-flow-options button:hover,.contact-flow-options button:focus-visible{color:var(--ink);background:var(--acid);padding-left:1rem;padding-right:1rem}.contact-flow-options button:hover span,.contact-flow-options button:focus-visible span,.contact-flow-options button.is-selected span{color:#1212128c}.contact-flow-options button.is-selected{background:var(--acid);color:var(--ink);padding-left:1rem;padding-right:1rem}.contact-flow-fields{gap:2rem;max-width:70rem;display:grid}.contact-flow-fields-split{grid-template-columns:1fr 1fr}.contact-flow-fields label{gap:.8rem;display:grid}.contact-flow-fields label>span{color:#f1efe97a;letter-spacing:.12em;text-transform:uppercase;font-size:.62rem;font-weight:600}.contact-flow input,.contact-flow textarea{width:100%;color:var(--paper);font:inherit;resize:none;background:0 0;border:0;border-bottom:1px solid #f1efe96b;border-radius:0;outline:0;padding:.35rem 0 .8rem;font-size:clamp(1.4rem,2.4vw,2.6rem);line-height:1.3;transition:border-color .2s}.contact-flow input::placeholder,.contact-flow textarea::placeholder{color:#f1efe93d}.contact-flow input:focus,.contact-flow textarea:focus{border-color:var(--acid)}.contact-flow-field-note{color:#f1efe97a;letter-spacing:.06em;text-transform:uppercase;font-size:.68rem;font-weight:500;line-height:1.5}@media (min-width:801px){.contact-flow-field-note{white-space:nowrap}}.contact-flow-controls{justify-content:space-between;max-width:70rem;margin-top:clamp(2.5rem,6vh,4.5rem);display:flex}.contact-flow-controls button,.contact-flow-back{color:#f1efe994;font:inherit;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;padding:.85rem 0;font-size:.7rem;font-weight:600}.contact-flow-controls .contact-flow-next{color:var(--paper);border:1px solid #f1efe994;border-radius:999px;padding:.85rem 1.1rem;transition:background .22s,color .22s}.contact-flow-controls .contact-flow-next:hover,.contact-flow-controls .contact-flow-next:focus-visible{background:var(--acid);color:var(--ink)}.contact-flow-back{margin-top:2rem}.contact-flow-summary{flex-wrap:wrap;gap:.6rem;max-width:70rem;margin-top:2.5rem;display:flex}.contact-flow-summary span{color:#f1efe99e;letter-spacing:.06em;text-transform:uppercase;border:1px solid #f1efe933;border-radius:999px;padding:.45rem .75rem;font-size:.65rem}.contact-flow-response-time{max-width:70rem;color:var(--acid);letter-spacing:.11em;text-transform:uppercase;margin:1.25rem 0 -1.1rem;font-size:.62rem;font-weight:600}.contact-flow-privacy-note{color:#f1efe970;max-width:46rem;margin:1.55rem 0 -1.35rem;font-size:.65rem;line-height:1.5}.contact-flow-privacy-note a{color:var(--paper);text-underline-offset:.18em;-webkit-text-decoration:underline #f1efe96b;text-decoration:underline #f1efe96b}.contact-flow-error{color:#ff9d82;max-width:46rem;margin:1.65rem 0 -1.35rem;font-size:.72rem;line-height:1.5}.contact-flow-honeypot{width:1px;height:1px;position:fixed;left:-9999px;overflow:hidden}.contact-flow-next:disabled{cursor:wait;opacity:.55}.contact-flow-success>p:not(.contact-flow-kicker){color:#f1efe99e;margin:-1.5rem 0 3rem;font-size:clamp(1rem,1.5vw,1.35rem)}.contact-flow-home-link{letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid #f1efe973;align-items:center;gap:.75rem;padding-bottom:.35rem;font-size:.72rem;font-weight:600;display:inline-flex}.contact-flow-footer{z-index:3;color:#f1efe96b;letter-spacing:.1em;text-transform:uppercase;justify-content:space-between;font-size:.6rem;display:flex;position:fixed;bottom:1.5rem;left:clamp(1.25rem,3vw,3.5rem);right:clamp(1.25rem,3vw,3.5rem)}@keyframes contact-panel-in{0%{opacity:0;transform:translateY(1.5rem)}to{opacity:1;transform:translateY(0)}}@media (min-width:801px) and (max-height:760px){.contact-flow h1{margin-bottom:clamp(2rem,5vh,3.5rem);font-size:clamp(3.2rem,6.3vw,6.5rem)}.contact-flow-kicker{margin-bottom:1.25rem}.contact-flow-options button{padding-top:1rem;padding-bottom:1rem}.contact-flow-controls{margin-top:2rem}.contact-flow-summary{margin-top:1.5rem}.contact-flow-response-time,.contact-flow-privacy-note,.contact-flow-error{margin-top:.8rem;margin-bottom:-.7rem}}@media (max-width:800px){.contact-flow{height:auto;min-height:100svh;overflow:hidden visible}.contact-flow:before{display:none}.contact-flow-grid{transform:none}.contact-flow-index{display:none}.contact-flow-stage{height:auto;min-height:100svh;padding:7rem 1.25rem 6.5rem}.contact-flow h1{margin-bottom:3rem;font-size:clamp(3rem,13vw,5.5rem)}.contact-flow-fields-split{grid-template-columns:1fr}.contact-flow-options button{grid-template-columns:2.4rem 1fr auto;font-size:1.05rem}.contact-flow-footer{align-items:flex-end}.contact-flow-footer span{text-align:right;max-width:9rem}}@media (max-width:520px){.contact-flow:after{text-align:center;font-size:clamp(2.7rem,14.5vw,5rem);bottom:-.08em;left:0;right:0}.contact-flow-nav{padding-top:1.2rem}.contact-flow h1{font-size:clamp(2.65rem,12vw,4.5rem)}.contact-flow-kicker{margin-bottom:1.5rem}.contact-flow-footer span{display:none}}@media (prefers-reduced-motion:reduce){.contact-flow-panel{animation:none}.contact-flow-progress span,.contact-flow-grid,.contact-flow-options button,.contact-flow-controls .contact-flow-next{transition:none}}
