.nail-play{position:relative;background:#f4e2ec;overflow:hidden}.mixer-heading{max-width:750px;margin-bottom:38px}.mixer-heading p{max-width:480px}.mixer-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:8%;align-items:center}.nail-preview{border:1px solid #173e4430;border-radius:12px;background:#fffaf7;position:relative}.preview-caption,.preview-bottom{display:flex;justify-content:space-between;align-items:center;padding:22px;font-size:9px;letter-spacing:1.5px}.preview-caption>span:last-child{font-size:24px;color:#b81d63}.preview-bottom{border-top:1px solid #173e4420;letter-spacing:0;font-size:11px;gap:15px}.preview-bottom>span:last-child{font-size:9px;color:#52676d;text-align:right}.nail-display{padding:30px 10px 35px}.nail-display svg{display:block;width:100%;height:auto}.nail-base{fill:var(--nail-color);stroke:#173e4425;transition:fill .35s ease}.french-tip{stroke:#fffaf7;stroke-width:8;fill:none;opacity:0;transition:opacity .3s}.chrome-glaze{opacity:0;transition:opacity .3s}.has-french .french-tip,.has-chrome .chrome-glaze{opacity:1}.nail-group{transform-box:fill-box;transform-origin:center;transition:scale .3s}.nail-preview:hover .nail-group{scale:1.02}.small-label{display:block;font-size:10px;letter-spacing:2px;margin-bottom:18px}.swatches{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:35px}.swatch{width:38px;height:38px;border-radius:50%;background:var(--swatch);border:4px solid #fffaf7;outline:1px solid #173e4425;transition:transform .2s,outline .2s;position:relative}.swatch:hover{transform:translateY(-4px)}.swatch.active{outline:2px solid #173e44;outline-offset:3px}.swatch.active:after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:#173e44;font-size:14px;text-shadow:0 0 4px white}.finish-options{display:flex;gap:10px;flex-wrap:wrap}.finish-options button{background:#fffaf780;color:#173e44;border:1px solid #173e4440;border-radius:6px;padding:14px;font-size:12px}.finish-options button span{margin-left:15px;font-size:10px}.finish-options button.active{background:#173e44;color:#fffaf7}.mixer-price{padding:24px 0;margin-top:22px;border-top:1px solid #173e4430}.mixer-price>div{display:flex;justify-content:space-between;align-items:center;gap:15px}.mixer-price small{font-size:12px}.mixer-price strong{font-size:38px;font-weight:500;letter-spacing:-2px}.mixer-price>span{font-size:10px}.mixer-controls>.btn{width:100%}.mixer-note{font-size:11px;line-height:1.7}.mixer-booking-note{padding:13px;background:#e4f0ea;border-radius:4px;font-size:11px}.edge-doodle{position:absolute;width:65px;height:65px;pointer-events:none;color:#b81d63;opacity:.55;z-index:0;animation-play-state:paused}.doodle-heart{right:3%;top:60px;transform:rotate(14deg);animation:doodleSway 5s ease-in-out infinite;animation-play-state:paused}.doodle-spark{left:1%;bottom:30px;animation:doodleSpark 4s ease-in-out infinite;animation-play-state:paused}.motion-active>.edge-doodle{animation-play-state:running}@keyframes doodleSway{0%,100%{transform:translateY(0) rotate(14deg)}50%{transform:translateY(-9px) rotate(5deg)}}@keyframes doodleSpark{0%,100%{transform:scale(.92) rotate(-8deg);opacity:.4}50%{transform:scale(1.05) rotate(8deg);opacity:.65}}.date-story{position:relative;overflow:hidden;background:#fffaf7}.date-story h2{max-width:820px}.date-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7%;position:relative;margin:45px 0 28px}.date-steps article{position:relative;padding-top:20px}.step-number{display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;background:#fffaf7;border:1px solid #173e4440;border-radius:50%;font-size:11px;position:relative;z-index:1;transition:background .4s,color .4s}.date-steps article.visited .step-number{background:#173e44;color:#fffaf7}.date-steps h3{font-size:25px;margin-top:23px}.date-steps p{font-size:13px;max-width:270px}.date-steps svg{width:60px;height:60px;fill:none;stroke:#b81d63;stroke-width:1.6;margin:10px 0;transition:transform .5s}.date-steps article.visited svg{transform:rotate(-7deg)}.date-track{position:absolute;top:40px;left:0;right:0;height:1px;background:#173e4425}.date-track>span{display:block;width:100%;height:2px;background:#b81d63;transform:scaleX(0);transform-origin:left;transition:transform .8s ease}.date-story.finished .date-track>span{transform:scaleX(1)}.look figure{transform:perspective(850px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .35s ease;isolation:isolate}.look figure:before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(115deg,transparent 20%,#fff8 45%,transparent 70%);transform:translateX(-160%);pointer-events:none}.look figure:after{content:'Das könnte deiner sein ↗';position:absolute;left:12px;bottom:12px;padding:10px 12px;background:#fffaf7;color:#173e44;font-size:10px;border-radius:4px;opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s;z-index:2}.look:focus-visible figure:after{opacity:1;transform:translateY(0)}@media(hover:hover) and (pointer:fine){.look:hover figure:before{animation:polishSweep .85s ease both}.look:hover figure:after{opacity:1;transform:translateY(0)}.look:hover .plus{opacity:0}.btn{transform:translate(var(--mx,0px),var(--my,0px));transition:transform .25s ease,background .25s}.btn:hover{transform:translate(var(--mx,0px),var(--my,0px))}.swatch:hover:before{content:'';position:absolute;inset:-8px;border:1px solid #b81d6380;border-radius:50%}}@keyframes polishSweep{from{transform:translateX(-160%)}to{transform:translateX(160%)}}@media(max-width:800px){.mixer-layout{grid-template-columns:1fr;gap:30px}.mixer-heading{margin-bottom:25px}.nail-display{padding:5px 7px 15px}.preview-caption,.preview-bottom{padding:17px}.mixer-heading h2{font-size:40px}.swatches{gap:13px;margin-bottom:28px}.swatch{width:34px;height:34px}.date-steps{grid-template-columns:1fr;gap:15px;margin:25px 0}.date-steps article{padding:0 0 20px 60px;min-height:160px}.step-number{position:absolute;left:0;top:0}.date-steps h3{margin:0 0 10px;font-size:23px}.date-steps p{margin:0;max-width:none}.date-steps svg{position:absolute;right:0;bottom:10px;width:42px;height:42px;opacity:.6}.date-track{top:20px;bottom:40px;left:20px;right:auto;width:1px;height:auto}.date-track>span{width:2px;height:100%;transform:scaleY(0);transform-origin:top}.date-story.finished .date-track>span{transform:scaleY(1)}.edge-doodle{width:40px;height:40px}.doodle-heart{right:4%;top:22px}.doodle-spark{left:1%;bottom:18px}.nail-preview:hover .nail-group{scale:1}.look figure{transform:none!important}.nail-play>.doodle-spark{display:none}}@media(prefers-reduced-motion:reduce){.edge-doodle{animation:none!important}.nail-base,.french-tip,.chrome-glaze,.nail-group,.swatch,.step-number,.date-steps svg,.date-track>span,.look figure,.look figure:after,.btn{transition:none!important}.date-track>span{transform:scaleX(1)}.date-steps article .step-number{background:#173e44;color:#fffaf7}.look figure{transform:none!important}.look figure:before{display:none}.date-steps article.visited svg{transform:none}.nail-preview:hover .nail-group{scale:1}}@media(max-width:800px) and (prefers-reduced-motion:reduce){.date-track>span{transform:scaleY(1)}}
.hero-frame>img,.hero-mini img{min-height:0}