/* Snapjam · DSTRCT-Aktion und Video-Galerie (Startseite + Selbstabholung) */
.was{opacity:.5;font-weight:500;font-size:.72em;margin-right:4px;text-decoration-thickness:2px}

/* Hinweis-Chip im Hero */
[data-aktion][hidden],[data-noaktion][hidden]{display:none!important}
.ak-chip{display:flex;width:fit-content;max-width:100%;align-items:center;gap:10px;margin-bottom:18px;padding:7px 8px 7px 14px;border-radius:999px;background:var(--ink);color:#fff;font-size:13px;font-weight:600;letter-spacing:-.01em;text-decoration:none;box-shadow:0 10px 30px -10px rgba(255,74,43,.55);animation:akChip 3.2s ease-in-out infinite}
.ak-chip .dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 rgba(255,74,43,.7);animation:akPing 1.6s infinite}
.ak-chip .go{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:var(--accent)}
.ak-chip s{opacity:.55;font-weight:500}
@keyframes akChip{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-3px) rotate(-.6deg)}}
@keyframes akPing{0%{box-shadow:0 0 0 0 rgba(255,74,43,.7)}80%,100%{box-shadow:0 0 0 10px rgba(255,74,43,0)}}

/* Aktions-Block */
.ak-sec{padding-top:clamp(56px,8vw,96px)}
.ak{border-radius:var(--r-shell);padding:6px;background:linear-gradient(120deg,var(--accent),var(--sun),var(--accent));background-size:300% 100%;animation:akEdge 6s linear infinite}
@keyframes akEdge{to{background-position:300% 0}}
.ak-core{position:relative;overflow:hidden;border-radius:var(--r-core);background:radial-gradient(120% 90% at 85% 10%,#3a1710 0%,#16171D 46%,#0D0E12 100%);color:#fff;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,56px);padding:clamp(26px,4.5vw,64px);align-items:center}
.ak-core::before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent 0 70%,rgba(255,74,43,.22) 80%,transparent 90%);animation:akSpin 9s linear infinite;pointer-events:none}
@keyframes akSpin{to{transform:rotate(1turn)}}
.ak-core>*{position:relative}
.ak-tag{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#FFB7A8}
.ak-tag i{width:7px;height:7px;border-radius:50%;background:var(--accent);animation:akPing 1.6s infinite}
.ak-h{margin-top:22px;font-size:clamp(34px,5.2vw,68px);line-height:.98;letter-spacing:-.055em;font-weight:600}
.ak-h .acc{color:var(--accent)}
.ak-price{display:inline-flex;align-items:baseline;gap:.25em;white-space:nowrap}
.ak-price s{font-size:.5em;color:rgba(255,255,255,.45);text-decoration:none;position:relative}
.ak-price s::after{content:"";position:absolute;left:-6%;right:-6%;top:52%;height:.12em;border-radius:9px;background:var(--accent);transform-origin:left;transform:scaleX(0) rotate(-8deg);animation:akStrike .6s .5s cubic-bezier(.2,.8,.2,1) forwards}
.ak-price b{color:#fff;display:inline-block;animation:akPop 2.4s 1s ease-in-out infinite}
@keyframes akStrike{to{transform:scaleX(1) rotate(-8deg)}}
@keyframes akPop{0%,100%{transform:scale(1)}8%{transform:scale(1.08) rotate(-2deg)}16%{transform:scale(1)}}
.ak-lead{margin-top:18px;font-size:clamp(16px,1.5vw,19px);line-height:1.5;color:rgba(255,255,255,.72);max-width:48ch}
.ak-lead b{color:#fff}
.ak-cd{margin-top:24px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.6)}
.ak-cd .u{display:inline-flex;flex-direction:column;align-items:center;min-width:58px;padding:8px 6px;border-radius:14px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.ak-cd .u b{font-family:"Geist Mono",ui-monospace,monospace;font-size:24px;font-weight:500;color:#fff;font-variant-numeric:tabular-nums;line-height:1.1}
.ak-cd .u small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.ak-cd .lbl{width:100%;margin-bottom:2px}
.ak-ctas{margin-top:26px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.ak-ctas .btn-accent{animation:akGlow 2.2s ease-in-out infinite}
@keyframes akGlow{0%,100%{box-shadow:0 0 0 0 rgba(255,74,43,.55)}50%{box-shadow:0 0 0 12px rgba(255,74,43,0)}}
.ak-ghost{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border-radius:999px;border:0;background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:15px;font-weight:500;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.ak-ghost:hover{background:rgba(255,255,255,.14)}
.ak-fine{margin-top:22px;font-size:12px;line-height:1.55;color:rgba(255,255,255,.45);max-width:62ch}

/* rechte Seite: Handy mit Spot + fliegende Gutscheine */
.ak-vis{position:relative;display:grid;place-items:center;min-height:440px}
.ak-phone{position:relative;width:min(250px,62vw);aspect-ratio:9/16;border-radius:30px;padding:7px;background:#000;box-shadow:0 30px 70px -20px rgba(0,0,0,.8),inset 0 0 0 1.5px #2b2d35;transform:rotate(3deg);animation:akFloat 5s ease-in-out infinite;cursor:pointer;z-index:2}
.ak-phone video{width:100%;height:100%;object-fit:cover;border-radius:24px;display:block;background:#111}
.ak-phone .snd{position:absolute;right:16px;bottom:16px;width:40px;height:40px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(13,14,18,.6);backdrop-filter:blur(8px);color:#fff;cursor:pointer}
@keyframes akFloat{0%,100%{transform:rotate(3deg) translateY(0)}50%{transform:rotate(1.5deg) translateY(-10px)}}
.ak-tix{position:absolute;inset:0;pointer-events:none;z-index:3}
.ak-tk{position:absolute;width:132px;height:72px;border-radius:12px;background:#fff;color:var(--ink);display:flex;flex-direction:column;justify-content:center;padding:0 14px 0 18px;box-shadow:0 18px 40px -14px rgba(0,0,0,.6);
  -webkit-mask:radial-gradient(circle 8px at 0 50%,transparent 98%,#000) ,radial-gradient(circle 8px at 100% 50%,transparent 98%,#000);-webkit-mask-composite:source-in;mask:radial-gradient(circle 8px at 0 50%,transparent 98%,#000) ,radial-gradient(circle 8px at 100% 50%,transparent 98%,#000);mask-composite:intersect}
.ak-tk b{font-size:24px;letter-spacing:-.04em;line-height:1}
.ak-tk small{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);font-weight:600}
.ak-tk::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--accent)}
.ak-tk:nth-child(1){left:-2%;top:8%;z-index:3;--r:-12deg;animation:akTk 4.4s ease-in-out infinite}
.ak-tk:nth-child(2){right:-1%;top:34%;z-index:3;--r:10deg;animation:akTk 5s .6s ease-in-out infinite}
.ak-tk:nth-child(3){left:0;bottom:12%;z-index:3;--r:8deg;animation:akTk 4.8s 1.2s ease-in-out infinite}
.ak-tk:nth-child(4){right:2%;bottom:-2%;z-index:3;--r:-9deg;animation:akTk 5.4s .3s ease-in-out infinite}
@keyframes akTk{0%,100%{transform:translateY(0) rotate(var(--r))}50%{transform:translateY(-14px) rotate(calc(var(--r) * -.4))}}
.ak-badge{position:absolute;z-index:3;top:-6px;right:12%;width:104px;height:104px;border-radius:50%;display:grid;place-items:center;text-align:center;background:var(--sun);color:var(--ink);font-weight:700;font-size:13px;line-height:1.05;letter-spacing:-.02em;box-shadow:0 14px 30px -10px rgba(255,184,0,.7);animation:akBadge 7s linear infinite}
.ak-badge b{display:block;font-size:30px;letter-spacing:-.05em}
@keyframes akBadge{0%{transform:rotate(-10deg) scale(1)}50%{transform:rotate(8deg) scale(1.06)}100%{transform:rotate(-10deg) scale(1)}}
.ak-conf{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:inherit}
.ak-conf i{position:absolute;top:-20px;width:8px;height:14px;border-radius:2px;opacity:.85;animation:akFall linear infinite}
@keyframes akFall{to{transform:translateY(900px) rotate(720deg)}}

/* kleine Variante (Unterseiten) */
.ak-sm .ak-h{font-size:clamp(30px,4.2vw,52px)}
.ak-sm .ak-vis{min-height:380px}

@media (max-width:880px){
  .ak-core{grid-template-columns:1fr}
  .ak-vis{min-height:400px;order:-1}
  .ak-phone{width:min(210px,56vw)}
  .ak-tk{width:96px;height:54px;padding:0 10px 0 14px}.ak-tk b{font-size:18px}.ak-tk small{font-size:9px}
  .ak-tk:nth-child(1){left:-2%;top:12%}.ak-tk:nth-child(2){right:-2%;top:42%}.ak-tk:nth-child(3){left:-1%;bottom:14%}.ak-tk:nth-child(4){right:0;bottom:-9%}
  .ak-badge{width:88px;height:88px;font-size:11px}.ak-badge b{font-size:24px}
}

/* Video-Galerie */
.vg-feat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2vw,22px)}
.vg-row{margin-top:clamp(14px,2vw,22px);display:grid;grid-auto-flow:column;grid-auto-columns:clamp(150px,15vw,200px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin}
.vg-c{position:relative;display:block;width:100%;padding:0;border:0;background:#0D0E12;border-radius:22px;overflow:hidden;aspect-ratio:9/16;cursor:pointer;scroll-snap-align:start;box-shadow:0 1px 2px rgba(13,14,18,.06),inset 0 0 0 1px var(--hair);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s;font:inherit;text-align:left;color:#fff}
.vg-c video,.vg-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vg-c::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.72));pointer-events:none}
.vg-c .cap{position:absolute;left:16px;right:16px;bottom:14px;z-index:2}
.vg-c .cap small{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.7);font-weight:600}
.vg-c .cap b{display:block;margin-top:4px;font-size:clamp(16px,1.5vw,20px);letter-spacing:-.03em;line-height:1.15}
.vg-c .pl{position:absolute;z-index:2;top:12px;right:12px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.18);backdrop-filter:blur(10px);transition:transform .3s,background .3s}
.vg-c .hot{position:absolute;z-index:2;top:12px;left:12px;padding:5px 10px;border-radius:999px;background:var(--accent);font-size:11px;font-weight:700;letter-spacing:.04em}
.vg-row .vg-c{border-radius:18px}
.vg-row .vg-c .cap b{font-size:15px}
@media (hover:hover){.vg-c:hover{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 26px 50px -22px rgba(13,14,18,.55)}.vg-c:hover .pl{transform:scale(1.12);background:var(--accent)}}
@media (max-width:760px){.vg-feat{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:72%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}.vg-feat .vg-c{scroll-snap-align:center}.vg-row{grid-auto-columns:42%}}

/* Lightbox */
.vg-lb{position:fixed;inset:0;z-index:120;display:grid;place-items:center;background:rgba(8,9,12,.86);backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .3s}
.vg-lb.open{opacity:1;pointer-events:auto}
.vg-lb video{max-height:88vh;max-width:92vw;border-radius:22px;background:#000;box-shadow:0 40px 90px -30px #000;transform:scale(.94);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.vg-lb.open video{transform:scale(1)}
.vg-lb .x{position:absolute;top:max(16px,env(safe-area-inset-top));right:16px;width:46px;height:46px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:26px;line-height:1;cursor:pointer}
.vg-lb .bk{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%)}

@media (prefers-reduced-motion:reduce){
  .ak-chip,.ak,.ak-core::before,.ak-price b,.ak-ctas .btn-accent,.ak-phone,.ak-tk,.ak-badge,.ak-conf i,.ak-tag i,.ak-chip .dot{animation:none!important}
  .ak-price s::after{transform:scaleX(1) rotate(-8deg);animation:none}
}
.ak-pk{display:inline-block;align-self:flex-start;margin-top:-6px;padding:6px 12px;border-radius:999px;background:var(--accent);color:#fff;font-size:13px;font-weight:600;text-decoration:none;animation:akChip 3.2s ease-in-out infinite}
