/* Bestellseite */
.order-page{background:#F4F1EA;color:var(--black)}
.order-page::before{background:radial-gradient(60% 40% at 30% -5%,rgba(58,91,255,.14),transparent 70%)}
.order-page::after{display:none}
.ohead{position:sticky;top:0;z-index:40;background:rgba(244,241,234,.86);backdrop-filter:blur(14px);border-bottom:1px solid rgba(11,12,15,.07)}
.ohead__in{max-width:1240px;margin:0 auto;padding:12px clamp(16px,3vw,32px);display:flex;align-items:center;gap:20px}
.ohead .brand__word{color:var(--black)}
.ohead .snd{color:var(--black);border-color:rgba(11,12,15,.2)}
.osteps{display:flex;gap:6px;margin:0 auto;padding:0;list-style:none}
.osteps li{display:flex;align-items:center;gap:8px;font-size:.86rem;font-weight:650;color:var(--grey-dark);padding:7px 12px 7px 7px;border-radius:999px;transition:background .4s,color .4s}
.osteps span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgba(11,12,15,.08);font-size:.78rem;transition:background .4s,color .4s}
.osteps li.on{color:var(--black);background:#fff;box-shadow:0 6px 18px -10px rgba(11,12,15,.3)}
.osteps li.on span,.osteps li.done span{background:var(--blue);color:#fff}
.osteps li.done span{font-size:0}.osteps li.done span::after{content:"✓";font-size:.78rem}

.owrap{max-width:1240px;margin:0 auto;padding:clamp(28px,4vw,56px) clamp(16px,3vw,32px) 120px;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:clamp(24px,4vw,56px);align-items:start}
.ointro .lead{color:#3A3D44;margin-top:14px}
.ointro .h2 .serif{color:var(--blue)}
.ostep{margin-top:44px;padding-top:32px;border-top:1px solid rgba(11,12,15,.1)}
.ostep h2{display:flex;align-items:center;gap:14px;font-size:clamp(1.4rem,2.2vw,1.9rem);letter-spacing:-.04em}
.ostep h2>span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--black);color:#fff;font-size:.9rem;letter-spacing:0;flex:none}
.ostep h2 em{color:var(--blue);font-weight:400}
.osub{color:#4A4D54;margin-top:8px}
.ochoice{display:grid;gap:12px;margin-top:20px}
.ochoice--3{grid-template-columns:repeat(3,1fr)}
.ochoice--4{grid-template-columns:repeat(4,1fr)}
.ochoice--2{grid-template-columns:1fr 1fr}
.ocard{position:relative;display:flex;flex-direction:column;gap:8px;padding:20px;border-radius:18px;background:#fff;border:2px solid transparent;box-shadow:0 1px 0 rgba(11,12,15,.04),0 18px 40px -28px rgba(11,12,15,.35);cursor:pointer;transition:border-color .3s,transform .35s var(--ease),box-shadow .35s}
.ocard:hover{transform:translateY(-3px)}
.ocard input,.oadd input{position:absolute;opacity:0;pointer-events:none}
.ocard__top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.ocard__top b{font-size:1.15rem;letter-spacing:-.02em}.ocard__top i{font-style:normal;font-size:.8rem;color:var(--grey-dark)}
.ocard__price{font-size:2rem;font-weight:780;letter-spacing:-.05em;line-height:1}
.ocard__price small{font-size:.8rem;font-weight:500;letter-spacing:0;color:var(--grey-dark);margin-left:4px}
.ocard__txt{font-size:.88rem;color:#4A4D54}
.ocard__chk{position:absolute;top:16px;right:16px;width:22px;height:22px;border-radius:50%;border:2px solid rgba(11,12,15,.2);transition:all .3s var(--ease)}
.ocard:has(input:checked){border-color:var(--blue);box-shadow:0 0 0 4px rgba(58,91,255,.12),0 24px 50px -28px rgba(58,91,255,.6)}
.ocard:has(input:checked) .ocard__chk{background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") center/13px no-repeat;border-color:var(--blue);transform:scale(1.1)}
.ocard:has(input:focus-visible),.oadd:has(input:focus-visible){outline:3px solid var(--blue);outline-offset:3px}
.ocard--hot{background:linear-gradient(160deg,#fff,#EEF1FF)}
.ocard--hot .ocard__top i{display:none}
.obadge{position:absolute;top:-10px;left:18px;background:var(--orange);color:#fff;font-size:.6rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:5px 8px;border-radius:999px}
.ocard--sm .ocard__price{font-size:1.6rem}
.oadd{position:relative;display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;padding:14px 16px;border-radius:16px;background:#fff;border:2px solid transparent;cursor:pointer;transition:border-color .3s,transform .3s var(--ease),background .3s}
.oadd:hover{transform:translateY(-2px)}
.oadd__ico{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--paper);font-size:1.1rem;transition:background .3s,transform .4s cubic-bezier(.3,1.6,.5,1)}
.oadd b{display:block;font-size:.98rem}.oadd i{font-style:normal;font-size:.82rem;color:#4A4D54}
.oadd__p{font-weight:750;font-size:.95rem;white-space:nowrap}
.oadd:has(input:checked){border-color:var(--blue);background:#F5F7FF}
.oadd:has(input:checked) .oadd__ico{background:var(--blue);color:#fff;transform:rotate(-8deg) scale(1.08)}
.oadd--qty{grid-template-columns:40px 1fr auto auto;cursor:default}
.qty{display:flex;align-items:center;gap:4px;background:var(--paper);border-radius:999px;padding:3px}
.qty button{width:30px;height:30px;border-radius:50%;border:0;background:#fff;font:700 1rem var(--sans);cursor:pointer}
.qty output{min-width:22px;text-align:center;font-weight:750}
.ohint{margin-top:14px;font-size:.88rem}.ohint a{color:var(--blue);font-weight:650}
.ofields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.ofields .field label{color:#33363C}
.ofields .field input,.ofields .field textarea{background:#fff;color:var(--black);border-color:rgba(11,12,15,.14)}
.ofields .field input::placeholder{color:#9A9DA3}
.ofields .field--check label{color:#4A4D54}

/* Zusammenfassung */
.osum{position:sticky;top:88px}
.osum__card{background:var(--black);color:#fff;border-radius:24px;padding:24px;box-shadow:0 40px 80px -40px rgba(11,12,15,.6);position:relative;overflow:hidden;isolation:isolate}
.osum__card::before{content:"";position:absolute;inset:-40% -20% auto auto;width:300px;height:300px;z-index:-1;background:radial-gradient(circle,rgba(58,91,255,.45),transparent 70%)}
.osum__head{display:flex;justify-content:space-between;align-items:center}
.osum__head h2{font-size:1.25rem;letter-spacing:-.03em}
.osum__count{display:grid;place-items:center;min-width:28px;height:28px;padding:0 8px;border-radius:999px;background:var(--blue);font-weight:750;font-size:.85rem}
.osum__count.bump{animation:bump .5s cubic-bezier(.3,1.8,.5,1)}
@keyframes bump{40%{transform:scale(1.35)}}
.osum__list{margin:16px 0;display:grid;gap:2px}
.osum__list li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:.92rem;animation:linein .45s var(--ease)}
.osum__list li span:last-child{white-space:nowrap;font-weight:650}
.osum__list li.m span:last-child{color:var(--lime-text)}
@keyframes linein{from{opacity:0;transform:translateX(16px)}}
.osum__tot{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:6px 0 18px}
.osum__tot div{background:rgba(255,255,255,.06);border-radius:14px;padding:12px 14px}
.osum__tot span{display:block;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.osum__tot b{font-size:1.6rem;letter-spacing:-.05em;font-variant-numeric:tabular-nums;display:inline-block}
.osum__tot b.tick{animation:tick .4s var(--ease)}
@keyframes tick{0%{transform:translateY(-6px);opacity:.3}100%{transform:none;opacity:1}}
.osum__go{width:100%;--h:58px;font-size:1.02rem;position:relative}
.osum__trust{display:grid;gap:6px;margin-top:16px;font-size:.84rem;color:#C9CBCF}
.osum__trust li{display:flex;gap:8px;align-items:center}.osum__trust li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime-text)}
.osum__fine{font-size:.74rem;color:var(--grey);margin-top:14px}
/* Bestell-Animation */
.osum__go.loading{pointer-events:none}
.osum__go.loading .go__txt{opacity:0}
.go__ico{position:absolute;inset:0;display:grid;place-items:center;opacity:0}
.osum__go.loading .go__ico{opacity:1}
.osum__go.loading .go__ico::before{content:"";width:22px;height:22px;border-radius:50%;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.osum__card.fly{animation:fly .8s cubic-bezier(.6,-.2,.4,1) forwards}
@keyframes fly{40%{transform:scale(.96) rotate(-1deg)}100%{transform:translateY(-40px) scale(.6) rotate(-6deg);opacity:0}}
.odone{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:rgba(7,8,10,.72);backdrop-filter:blur(10px);animation:fadein .4s}
@keyframes fadein{from{opacity:0}}
.odone[hidden]{display:none}
.odone__card{max-width:520px;width:100%;background:#fff;color:var(--black);border-radius:28px;padding:clamp(26px,4vw,40px);text-align:center;animation:pop2 .7s cubic-bezier(.3,1.5,.5,1)}
@keyframes pop2{from{transform:translateY(40px) scale(.9);opacity:0}}
.odone__check svg{width:84px;height:84px;margin:0 auto;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.odone__check circle{stroke:var(--blue);stroke-dasharray:151;stroke-dashoffset:151;animation:draw2 .7s .2s var(--ease) forwards}
.odone__check path{stroke:var(--blue);stroke-dasharray:40;stroke-dashoffset:40;animation:draw2 .5s .75s var(--ease) forwards}
@keyframes draw2{to{stroke-dashoffset:0}}
.odone h2{font-size:clamp(1.8rem,3.4vw,2.4rem);letter-spacing:-.045em;margin-top:16px}.odone h2 .serif{color:var(--blue)}
.odone p{color:#4A4D54;margin-top:10px}
.odone__next{text-align:left;display:grid;gap:10px;margin:22px 0 26px;padding:0;list-style:none;counter-reset:n}
.odone__next li{display:grid;grid-template-columns:30px 1fr;gap:10px;font-size:.92rem;color:#4A4D54}
.odone__next li::before{counter-increment:n;content:counter(n);display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--paper);font-weight:750;color:var(--black)}
.odone__next b{color:var(--black)}
.confetti{position:fixed;top:-10px;width:9px;height:14px;z-index:101;pointer-events:none;animation:fall linear forwards}
@keyframes fall{to{transform:translate3d(var(--dx),110vh,0) rotate(var(--r))}}
.obar{display:none}
@media (max-width:1000px){
  .owrap{grid-template-columns:1fr}
  .osum{position:static}
  .ochoice--4{grid-template-columns:1fr 1fr}
  .obar{display:flex;position:fixed;left:12px;right:12px;bottom:12px;z-index:50;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 18px;border-radius:20px;background:rgba(11,12,15,.94);color:#fff;backdrop-filter:blur(12px);box-shadow:0 20px 40px -10px rgba(0,0,0,.5)}
  .obar small{display:block;font-size:.7rem;color:var(--grey)}.obar b{font-size:1.3rem;letter-spacing:-.04em}
  .obar .btn{--h:46px}
}
@media (max-width:760px){
  .osteps li{font-size:0;padding:4px;gap:0}.osteps li span{font-size:.78rem}
  .ochoice--3,.ochoice--2,.ofields{grid-template-columns:1fr}
  .oadd--qty{grid-template-columns:40px 1fr auto}.oadd--qty .oadd__p{grid-column:2}
}
@media (prefers-reduced-motion:reduce){.confetti{display:none}}
.oadd--qty{grid-column:1/-1}
.odone__next li{display:block;position:relative;padding:4px 0 4px 40px;min-height:28px}
.odone__next li::before{position:absolute;left:0;top:0}
.odone__card{max-height:calc(100vh - 40px);overflow:auto}

/* ===== Erfolgs-Bildschirm v2: blaue Welle aus dem Button ===== */
.odone{background:none;backdrop-filter:none;animation:none;padding:0;place-items:stretch;overflow:auto}
.odone__wipe{position:fixed;inset:0;background:radial-gradient(60% 50% at 50% 0%,#5B78FF,transparent 70%),linear-gradient(160deg,#3A5BFF,#1A2BB8 70%,#101A7A);clip-path:circle(0 at var(--wx,50%) var(--wy,50%));animation:wipe .9s cubic-bezier(.7,0,.2,1) forwards}
@keyframes wipe{to{clip-path:circle(300vmax at var(--wx,50%) var(--wy,50%))}}
.odone__in{position:relative;max-width:980px;margin:0 auto;padding:clamp(48px,9vh,96px) 20px 60px;color:#fff;text-align:center}
.odone__badge{position:relative;width:96px;height:96px;margin:0 auto;opacity:0;animation:badgeIn .7s .55s cubic-bezier(.3,1.6,.5,1) forwards}
@keyframes badgeIn{from{opacity:0;transform:scale(.3) rotate(-30deg)}to{opacity:1;transform:none}}
.odone__badge svg{width:100%;height:100%;fill:rgba(255,255,255,.12);stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.odone__badge circle{stroke-dasharray:151;stroke-dashoffset:151;animation:draw2 .7s .7s var(--ease) forwards}
.odone__badge path{stroke-dasharray:40;stroke-dashoffset:40;animation:draw2 .45s 1.2s var(--ease) forwards}
.odone__orbit{position:absolute;inset:-14px;border-radius:50%;border:1.5px dashed rgba(255,255,255,.35);animation:orbit 12s linear infinite}
.odone__orbit::after{content:"";position:absolute;top:-5px;left:50%;width:10px;height:10px;border-radius:50%;background:#FF6A2B;box-shadow:0 0 14px #FF6A2B}
@keyframes orbit{to{transform:rotate(360deg)}}
.odone__h{margin-top:28px;display:grid;gap:6px}
.odone__big{font-size:clamp(3.4rem,12vw,9rem);font-weight:800;letter-spacing:-.065em;line-height:.9}
.odone__big i{display:inline-block;font-style:normal;opacity:0;transform:translateY(60%) rotate(8deg);animation:letter .7s calc(.75s + var(--i) * 45ms) cubic-bezier(.3,1.5,.5,1) forwards}
@keyframes letter{to{opacity:1;transform:none}}
.odone__h .serif{font-size:clamp(1.6rem,3.6vw,2.6rem);color:#DCE2FF;opacity:0;animation:up2 .7s 1.35s var(--ease) forwards}
.odone__h b{color:#fff;font-weight:400}
@keyframes up2{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.odone__grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:40px;text-align:left}
.odone__ticket,.odone__next li{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(12px);border-radius:20px}
.odone__ticket{padding:22px;opacity:0;animation:up2 .7s 1.55s var(--ease) forwards;position:relative}
.odone__lbl{font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#C9D2FF}
.odone__ticket ul{margin:12px 0;display:grid;gap:2px}
.odone__ticket li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed rgba(255,255,255,.2);font-size:.9rem;animation:none}
.odone__ticket li.m span:last-child{color:#fff}
.odone__tot{display:flex;justify-content:space-between;gap:10px;margin-top:14px;font-size:.82rem;color:#C9D2FF}
.odone__tot b{display:block;font-size:1.5rem;color:#fff;letter-spacing:-.04em}
.odone__ph{margin-top:12px;font-size:.75rem}
.odone__next{display:grid;gap:12px;margin:0;padding:0;list-style:none;counter-reset:n}
.odone__next li{display:grid!important;grid-template-columns:40px 1fr;gap:2px 14px;padding:16px 18px!important;color:#DCE2FF;opacity:0;animation:up2 .6s forwards;min-height:0}
.odone__next li:nth-child(1){animation-delay:1.7s}.odone__next li:nth-child(2){animation-delay:1.85s}.odone__next li:nth-child(3){animation-delay:2s}
.odone__next li::before{position:static!important;grid-row:1/3;counter-increment:n;content:counter(n);display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#fff;color:#2440E0;font-weight:800}
.odone__next b{color:#fff;font-size:1.02rem}.odone__next span{font-size:.88rem}
.odone__home{margin-top:34px;background:#fff;color:#1A2BB8;opacity:0;animation:up2 .6s 2.2s var(--ease) forwards}
.odone .ph{font-size:.8em}
@media (max-width:760px){.odone__grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.odone__wipe{animation:none;clip-path:none}.odone *{animation-duration:.01s!important;animation-delay:0s!important}}

/* Paketkarten: kein Überlappen mit dem Haken, einheitliche Abstände */
.ocard{padding:20px 20px 18px}
.ocard__top{flex-direction:column;align-items:flex-start;gap:2px;padding-right:34px}
.ocard__top i{display:block!important;font-size:.8rem;font-weight:650;color:var(--blue)}
.ocard__price{white-space:nowrap}
.ocard--sm .ocard__top{padding-right:30px}
@media (max-width:1240px){.ochoice--3{grid-template-columns:1fr}.ochoice--3 .ocard{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 16px}.ochoice--3 .ocard__txt{grid-column:1/-1}.ochoice--3 .ocard__price{grid-row:1;grid-column:2;padding-right:30px}}
@media (max-width:1240px) and (min-width:761px){.ochoice--4{grid-template-columns:1fr 1fr}}
/* Einheitlich mit der Startseite */
.order-page .h2{font-weight:750}
.ocard,.oadd,.osum__card,.ofields .field input,.ofields .field textarea{border-radius:18px}
.ofields .field input,.ofields .field textarea{border-radius:12px}
.ohead .snd:hover{background:rgba(11,12,15,.06)}
/* Danke-Seite: Text auf Blau gut lesbar (vorher dunkelgrau auf Blau) */
.odone__in p,.odone__in .fb-done-p,.odone__in .fb-export__hint{color:rgba(255,255,255,.94)}
.odone__in .fb-done-p{font-size:1.05rem;max-width:560px;margin-left:auto;margin-right:auto}
.odone__in .fb-done-p b{color:#fff}
.odone__in h2 .serif{color:#DDE4FF}