.c-contact-form{--c-contact-form-frame-bg: linear-gradient(135deg, var(--flowd-navy-deep) 0%, var(--flowd-slate) 60%, var(--flowd-red-700) 160%);--c-contact-form-frame-inset: var(--s-32);--c-contact-form-inner-bg: var(--flowd-beige-a-72);--c-contact-form-inner-radius: var(--r-md);--c-contact-form-inner-blur: 16px;--c-contact-form-inner-saturate: 160%;--c-contact-form-inner-border: 1px solid var(--flowd-white-a-10);position:relative;padding:var(--c-contact-form-frame-inset);background:var(--c-contact-form-frame-bg);border-radius:var(--r-lg);box-shadow:var(--shadow-md)}.c-contact-form__inner{position:relative;z-index:1;display:flex;flex-direction:column;gap:var(--s-24);padding:var(--s-32);background:radial-gradient(ellipse 60% 50% at 18% 22%,rgba(20,20,20,.08),transparent 60%),radial-gradient(ellipse 70% 55% at 82% 30%,rgba(255,255,255,.4),transparent 60%),radial-gradient(ellipse 55% 60% at 30% 78%,rgba(255,255,255,.32),transparent 60%),radial-gradient(ellipse 65% 50% at 78% 82%,rgba(20,20,20,.07),transparent 60%),radial-gradient(ellipse at center,transparent 55%,rgba(20,20,20,.1) 100%),var(--c-contact-form-inner-bg);backdrop-filter:blur(var(--c-contact-form-inner-blur)) saturate(var(--c-contact-form-inner-saturate));-webkit-backdrop-filter:blur(var(--c-contact-form-inner-blur)) saturate(var(--c-contact-form-inner-saturate));border:var(--c-contact-form-inner-border);border-radius:var(--c-contact-form-inner-radius);overflow:hidden;box-shadow:inset 0 1px #ffffff73,inset 0 -1px 2px #1414140d;--fg-1: var(--flowd-ink);--fg-2: var(--flowd-n-600);--fg-3: var(--flowd-n-500);--fg-muted: var(--flowd-n-400);color:var(--fg-1);font-family:var(--font-handwriting);font-weight:500}.c-contact-form__sentence{margin:0;font-size:clamp(var(--fs-2xl),3vw,var(--fs-4xl));line-height:var(--lh-tight);color:var(--fg-1)}.c-contact-form__header{display:flex;justify-content:space-between;align-items:center;gap:var(--s-24);margin-bottom:calc(var(--s-16) - var(--s-24))}.c-contact-form__greeting{margin:0;font-family:var(--font-handwriting);font-weight:500;font-size:clamp(var(--fs-2xl),3vw,var(--fs-4xl));line-height:var(--lh-tight)}.c-contact-form__stamp-slot{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:100px;height:116px;border:2px dashed color-mix(in srgb,var(--fg-1) 35%,transparent);border-radius:var(--r-xs);pointer-events:none}.c-contact-form__stamp{--notch: 4px;--pitch: 12px;--m-top: radial-gradient(circle var(--notch) at top, transparent 99%, #000 100%) 0 0 / var(--pitch) calc(var(--notch) * 2) repeat-x;--m-bottom: radial-gradient(circle var(--notch) at bottom, transparent 99%, #000 100%) 0 100% / var(--pitch) calc(var(--notch) * 2) repeat-x;--m-left: radial-gradient(circle var(--notch) at left, transparent 99%, #000 100%) 0 0 / calc(var(--notch) * 2) var(--pitch) repeat-y;--m-right: radial-gradient(circle var(--notch) at right, transparent 99%, #000 100%) 100% 0 / calc(var(--notch) * 2) var(--pitch) repeat-y;--m-fill: linear-gradient(#000, #000) center / calc(100% - var(--notch) * 2) calc(100% - var(--notch) * 2) no-repeat;display:flex;align-items:center;justify-content:center;width:80px;height:96px;background:var(--flowd-red);transform:rotate(5deg);filter:drop-shadow(0 4px 8px color-mix(in srgb,var(--flowd-ink) 22%,transparent));-webkit-mask:var(--m-top),var(--m-bottom),var(--m-left),var(--m-right),var(--m-fill);mask:var(--m-top),var(--m-bottom),var(--m-left),var(--m-right),var(--m-fill)}.c-contact-form__stamp-mark{display:block;width:64%;aspect-ratio:160 / 110;background-color:var(--flowd-n-0);-webkit-mask:url(/assets/flowd-w-mark-red.svg) center / contain no-repeat;mask:url(/assets/flowd-w-mark-red.svg) center / contain no-repeat}.c-contact-form__field{--field-color: var(--accent);position:relative;display:inline-block;margin:0 .15em;vertical-align:baseline}.c-contact-form__field:has(input[name=name]){--field-color: var(--flowd-red);--field-type-anim: c-contact-form-type-1}.c-contact-form__field:has(input[name=firma]){--field-color: var(--flowd-deep-blue);--field-type-anim: c-contact-form-type-2}.c-contact-form__field:has(input[name=thema]){--field-color: var(--flowd-blue);--field-type-anim: c-contact-form-type-3}.c-contact-form__field:has(textarea[name=text]){--field-color: var(--flowd-slate);--field-type-anim: c-contact-form-type-4}.c-contact-form__field:has(input[name=telefon]){--field-color: var(--flowd-red-700);--field-type-anim: c-contact-form-type-5}.c-contact-form__field:has(input[name=email]){--field-color: var(--flowd-red-600);--field-type-anim: c-contact-form-type-6}.c-contact-form__field[data-text]:before{content:attr(data-text);visibility:hidden;white-space:pre;padding-inline-end:.05em}.c-contact-form__field--block[data-text]:before{display:none}.c-contact-form__field input,.c-contact-form__field textarea{font:inherit;color:var(--field-color);background:transparent;border:0;margin:0;padding:0;outline:0;vertical-align:baseline}.c-contact-form__field input{position:absolute;inset:0;width:100%;height:100%;border:0;border-bottom:2.5px dashed var(--field-color)}.c-contact-form__field input::placeholder,.c-contact-form__field textarea::placeholder{color:color-mix(in srgb,var(--field-color) 60%,transparent)}@property --c-contact-form-type-progress{syntax: "<percentage>"; initial-value: 0%; inherits: false;}.c-contact-form__field[data-text]:after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;font:inherit;color:var(--field-color);white-space:pre;--c-contact-form-type-progress: 0%;-webkit-mask-image:linear-gradient(90deg,#000 var(--c-contact-form-type-progress),transparent var(--c-contact-form-type-progress));mask-image:linear-gradient(90deg,#000 var(--c-contact-form-type-progress),transparent var(--c-contact-form-type-progress));opacity:0}.c-contact-form__field--block[data-text]:after{white-space:pre-wrap;-webkit-mask-image:linear-gradient(90deg,#000 calc(var(--c-contact-form-type-progress) * 3),transparent calc(var(--c-contact-form-type-progress) * 3)),linear-gradient(90deg,#000 calc((var(--c-contact-form-type-progress) - 33.33%) * 3),transparent calc((var(--c-contact-form-type-progress) - 33.33%) * 3)),linear-gradient(90deg,#000 calc((var(--c-contact-form-type-progress) - 66.66%) * 3),transparent calc((var(--c-contact-form-type-progress) - 66.66%) * 3));mask-image:linear-gradient(90deg,#000 calc(var(--c-contact-form-type-progress) * 3),transparent calc(var(--c-contact-form-type-progress) * 3)),linear-gradient(90deg,#000 calc((var(--c-contact-form-type-progress) - 33.33%) * 3),transparent calc((var(--c-contact-form-type-progress) - 33.33%) * 3)),linear-gradient(90deg,#000 calc((var(--c-contact-form-type-progress) - 66.66%) * 3),transparent calc((var(--c-contact-form-type-progress) - 66.66%) * 3));-webkit-mask-size:100% 1lh,100% 1lh,100% 1lh;mask-size:100% 1lh,100% 1lh,100% 1lh;-webkit-mask-position:0 0,0 1lh,0 2lh;mask-position:0 0,0 1lh,0 2lh;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.c-contact-form:not(:focus-within) .c-contact-form__field[data-text]:has(input:placeholder-shown:not(:focus),textarea:placeholder-shown:not(:focus)):after{opacity:1;animation:var(--field-type-anim) 14s ease-in-out infinite}.c-contact-form:not(:focus-within) .c-contact-form__field[data-text] input:placeholder-shown:not(:focus)::placeholder,.c-contact-form:not(:focus-within) .c-contact-form__field[data-text] textarea:placeholder-shown:not(:focus)::placeholder{color:transparent}@keyframes c-contact-form-type-1{0%{--c-contact-form-type-progress: 0%}11%{--c-contact-form-type-progress: 100%}90%{--c-contact-form-type-progress: 100%}to{--c-contact-form-type-progress: 0%}}@keyframes c-contact-form-type-2{0%,11%{--c-contact-form-type-progress: 0%}17%{--c-contact-form-type-progress: 100%}90%{--c-contact-form-type-progress: 100%}to{--c-contact-form-type-progress: 0%}}@keyframes c-contact-form-type-3{0%,17%{--c-contact-form-type-progress: 0%}24%{--c-contact-form-type-progress: 100%}90%{--c-contact-form-type-progress: 100%}to{--c-contact-form-type-progress: 0%}}@keyframes c-contact-form-type-4{0%,24%{--c-contact-form-type-progress: 0%}61%{--c-contact-form-type-progress: 100%}90%{--c-contact-form-type-progress: 100%}to{--c-contact-form-type-progress: 0%}}@keyframes c-contact-form-type-5{0%,61%{--c-contact-form-type-progress: 0%}70%{--c-contact-form-type-progress: 100%}90%{--c-contact-form-type-progress: 100%}to{--c-contact-form-type-progress: 0%}}@keyframes c-contact-form-type-6{0%,70%{--c-contact-form-type-progress: 0%}78%{--c-contact-form-type-progress: 100%}90%{--c-contact-form-type-progress: 100%}to{--c-contact-form-type-progress: 0%}}.c-contact-form__field--block{display:block;margin:0;font-size:clamp(var(--fs-2xl),3vw,var(--fs-4xl));line-height:var(--lh-tight)}.c-contact-form__field--block textarea{display:block;width:100%;min-height:1lh;resize:none;overflow:hidden;text-decoration:none;border-bottom:2.5px dashed var(--field-color);field-sizing:content}@keyframes c-contact-form-pulse-border{0%,to{border-bottom-color:var(--field-color)}50%{border-bottom-color:color-mix(in srgb,var(--field-color) 35%,transparent)}}.c-contact-form__field input:placeholder-shown:not(:focus),.c-contact-form__field--block textarea:placeholder-shown:not(:focus){animation:c-contact-form-pulse-border 1.8s ease-in-out infinite}.c-contact-form__field input:focus,.c-contact-form__field--block textarea:focus{border-bottom-style:solid}@media(prefers-reduced-motion:reduce){.c-contact-form__field input,.c-contact-form__field textarea,.c-contact-form__field[data-text]:after{animation:none!important}.c-contact-form__field[data-text]:after{opacity:0}.c-contact-form__field[data-text] input:placeholder-shown:not(:focus)::placeholder,.c-contact-form__field[data-text] textarea:placeholder-shown:not(:focus)::placeholder{color:color-mix(in srgb,var(--field-color) 60%,transparent)}}.c-contact-form__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-24);margin-top:var(--s-16)}.c-contact-form__hint{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--fg-3)}