/* kenmedia.tr — Online Mağaza: eigene Visuals (lädt nur auf online-magaza.html) */

/* ---------- Hero: Shop-Simulation (reine CSS-Animation, 8 s Schleife) ---------- */
.shopsim-wrap{position:relative}
@media (max-width:1079px){.shopsim-wrap{max-width:560px}}
.shopsim{position:relative;border-radius:var(--r3);overflow:hidden;padding:16px;background:linear-gradient(165deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.12);box-shadow:0 40px 100px -30px rgba(0,0,0,.7)}
.sh-top{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.05)}
.sh-logo{flex:1;font-weight:800;color:#fff;font-size:.9375rem}
.sh-search,.sh-cart{position:relative;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.08)}
.sh-search svg,.sh-cart svg{width:16px;height:16px;color:#fff}
.sh-cart b{position:absolute;right:-4px;top:-4px;min-width:18px;height:18px;border-radius:9px;background:var(--blue-lt);color:#0B0C10;font-size:.6875rem;display:grid;place-items:center;transform:scale(0);animation:sh-badge 8s var(--ease) infinite}
@keyframes sh-badge{0%,34%{transform:scale(0)}38%{transform:scale(1.3)}42%,92%{transform:scale(1)}100%{transform:scale(0)}}
.sh-cats{display:flex;gap:6px;margin:14px 0}
.sh-cats i{font-style:normal;font-size:.75rem;font-weight:700;color:#C4C9D1;padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.14)}
.sh-cats i.on{background:#fff;color:var(--ink);border-color:#fff}
.sh-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.sh-p{position:relative;display:grid;gap:7px;padding:8px 8px 12px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.sh-img{aspect-ratio:.9;border-radius:10px;background:linear-gradient(150deg,rgba(90,176,240,.45),rgba(0,102,178,.18))}
.sh-p:nth-child(1) .sh-img{background:linear-gradient(150deg,#2B3440,#1A1F27)}
.sh-p:nth-child(3) .sh-img{background:linear-gradient(150deg,#3A4452,#1F2630)}
.sh-l{height:7px;width:80%;border-radius:4px;background:rgba(255,255,255,.22)}.sh-l--s{width:45%;background:rgba(90,176,240,.55)}
.sh-p--pick{animation:sh-pick 8s var(--ease) infinite}
@keyframes sh-pick{0%,12%{border-color:rgba(255,255,255,.08);transform:none}18%,40%{border-color:#5AB0F0;transform:translateY(-4px);box-shadow:0 14px 30px -14px rgba(0,102,178,.8)}48%,100%{border-color:rgba(255,255,255,.08);transform:none;box-shadow:none}}
.sh-add{font-size:.6875rem;font-weight:800;text-align:center;color:#fff;padding:6px 0;border-radius:8px;background:var(--blue);animation:sh-add 8s infinite}
@keyframes sh-add{0%,26%{background:var(--blue)}28%,32%{background:#5AB0F0;transform:scale(.95)}34%,100%{background:var(--blue);transform:none}}
.sh-fly{position:absolute;left:50%;top:30%;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:#5AB0F0;opacity:0;animation:sh-fly 8s var(--ease) infinite}
@keyframes sh-fly{0%,29%{opacity:0;transform:none}31%{opacity:1;transform:none}37%{opacity:1;transform:translate(70px,-130px) scale(.5)}39%,100%{opacity:0;transform:translate(70px,-130px) scale(.3)}}
.sh-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:16px;counter-reset:st}
.sh-steps li{position:relative;padding:22px 0 0;text-align:center;font-size:.6875rem;font-weight:700;color:var(--muted-d)}
.sh-steps li::before{content:"";position:absolute;left:0;right:0;top:6px;height:5px;border-radius:3px;background:rgba(255,255,255,.1)}
.sh-steps li::after{content:"";position:absolute;left:0;top:6px;height:5px;width:0;border-radius:3px;background:linear-gradient(90deg,#5AB0F0,#0066B2);animation:sh-step 8s linear infinite}
.sh-steps li:nth-child(2)::after{animation-name:sh-step2}.sh-steps li:nth-child(3)::after{animation-name:sh-step3}.sh-steps li:nth-child(4)::after{animation-name:sh-step4}
@keyframes sh-step{0%,40%{width:0}50%,94%{width:100%}100%{width:0}}
@keyframes sh-step2{0%,50%{width:0}60%,94%{width:100%}100%{width:0}}
@keyframes sh-step3{0%,60%{width:0}70%,94%{width:100%}100%{width:0}}
@keyframes sh-step4{0%,70%{width:0}78%,94%{width:100%}100%{width:0}}
.sh-toast{position:absolute;left:50%;bottom:62px;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#fff;color:var(--ink);font-weight:800;font-size:.8125rem;white-space:nowrap;box-shadow:0 20px 40px -12px rgba(0,0,0,.6);
  transform:translate(-50%,20px);opacity:0;animation:sh-toast 8s var(--ease) infinite}
.sh-toast svg{width:16px;height:16px;color:var(--blue)}
@keyframes sh-toast{0%,78%{opacity:0;transform:translate(-50%,20px)}82%,94%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,10px)}}
@media (prefers-reduced-motion:reduce){.shopsim *{animation:none!important}.sh-cart b{transform:scale(1)}.sh-steps li::after{width:100%}}

/* ---------- Fragen + Kaufablauf ---------- */
.doubts{display:flex;flex-wrap:wrap;gap:8px}
.doubts li{padding:10px 16px;border-radius:18px 18px 18px 6px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:#fff;font-weight:600;font-size:.9375rem}
.buyflow{position:relative;display:grid;gap:16px}
@media (min-width:760px){.buyflow{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1180px){.buyflow{grid-template-columns:repeat(4,1fr)}}
.buyflow li{position:relative;display:grid;gap:12px;align-content:start;padding:28px 24px;border-radius:var(--r3);background:var(--dark-2);border:1px solid var(--line-d)}
.bf-n{position:absolute;right:20px;top:18px;font-size:2.25rem;font-weight:800;letter-spacing:-.04em;color:rgba(255,255,255,.07)}
.bf-ico{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:rgba(0,102,178,.25);border:1.5px solid rgba(90,176,240,.5);color:var(--blue-lt)}
.bf-ico svg{width:24px;height:24px}
.buyflow h3{font-size:1.1875rem;letter-spacing:-.02em;color:#fff}
.buyflow p{color:#B9BEC7;font-size:.9688rem}
.buyflow li:last-child{background:var(--blue);border-color:#5AB0F0}
.buyflow li:last-child p{color:#E6F1FA}.buyflow li:last-child .bf-ico{background:rgba(255,255,255,.15);border-color:#fff;color:#fff}
@media (min-width:1180px){
  .buyflow::before{content:"";position:absolute;left:24px;right:24px;top:-18px;height:4px;border-radius:2px;background:rgba(255,255,255,.08)}
  .buyflow::after{content:"";position:absolute;left:24px;top:-18px;height:4px;width:0;border-radius:2px;background:linear-gradient(90deg,#5AB0F0,#0066B2);box-shadow:0 0 12px rgba(90,176,240,.6)}
  .buyflow.in::after{animation:bf-run 2.4s var(--ease) .3s forwards}
}
@keyframes bf-run{to{width:calc(100% - 48px)}}
@media (prefers-reduced-motion:reduce){.buyflow::after{width:calc(100% - 48px);animation:none}}


/* ---------- International ---------- */
.intl-head{display:grid;gap:32px;align-items:center;margin-bottom:40px}
@media (min-width:1024px){.intl-head{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:56px}}
.intl-head .h2{font-size:clamp(1.875rem,1.2rem + 2.4vw,3rem);margin-top:16px}
.intl-head .lead{margin-top:20px}
.route{position:relative;max-width:420px;justify-self:center;width:100%}
.route svg{width:100%;height:auto;overflow:visible}
.rt-arc{fill:none;stroke:rgba(255,255,255,.28);stroke-width:2;stroke-dasharray:6 8}
.rt-run{fill:none;stroke:#5AB0F0;stroke-width:3;stroke-linecap:round;stroke-dasharray:40 400;stroke-dashoffset:440;filter:drop-shadow(0 0 6px #5AB0F0);animation:rt-run 3.6s ease-in-out infinite}
@keyframes rt-run{0%{stroke-dashoffset:440;opacity:0}10%{opacity:1}85%{opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.rt-dot{fill:var(--dark);stroke:#5AB0F0;stroke-width:3}
.rt-dot--to{fill:var(--blue);animation:rt-ping 3.6s ease-out infinite}
@keyframes rt-ping{0%,80%{stroke-width:3}90%{stroke-width:10;stroke-opacity:.4}100%{stroke-width:3}}
.rt-lbl{position:absolute;font-size:.8125rem;font-weight:800;color:#fff;padding:5px 10px;border-radius:999px;background:var(--dark-2);border:1px solid var(--line-d2)}
.rt-lbl--from{left:calc(17.5% - 18px);top:calc(77% + 16px)}.rt-lbl--to{left:calc(82.5% - 42px);top:calc(36% - 46px);background:var(--blue);border-color:#5AB0F0}
@media (prefers-reduced-motion:reduce){.rt-run,.rt-dot--to{animation:none}.rt-run{stroke-dasharray:none;stroke-dashoffset:0}}
.intl-grid{display:grid;gap:16px}
@media (min-width:760px){.intl-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1180px){.intl-grid{grid-template-columns:repeat(4,1fr)}}
.intl-ex{display:flex;gap:20px;align-items:flex-start;margin-top:24px;padding:24px 28px;border-radius:var(--r3);background:rgba(0,102,178,.14);border:1px solid rgba(90,176,240,.35)}
.intl-ex p{color:#D2D6DC}.intl-ex strong{color:#fff}
.intl-flag{flex:none;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:var(--blue);color:#fff;font-weight:800;font-size:.875rem}
.intl-flag svg{width:16px;height:16px}
@media (max-width:640px){.intl-ex{flex-direction:column}}