:root{
  --tp-accent:#2F6B4F;
  --tp-bg:#FAF8F3;
  --pad-x:120px;
  --pad-x-sm:80px;
  --pad-y:96px;
}
@media (max-width: 900px){
  :root{ --pad-x:24px; --pad-x-sm:20px; --pad-y:56px; }
}
@media (max-width: 450px){
  :root{ --pad-x:24px; --pad-x-sm:10px; --pad-y:56px; }
}
*{box-sizing:border-box}
.cmplz-cookiebanner, .cmplz-cookiebanner *, #cmplz-manage-consent, #cmplz-manage-consent *{box-sizing:initial}
.screen-reader-text{border:0;clip:rect(1px, 1px, 1px, 1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute !important;width:1px;word-wrap:normal !important}
@media (max-width: 600px){
  .cmplz-cookiebanner .cmplz-buttons{display:flex !important;flex-wrap:wrap;gap:8px}
  .cmplz-cookiebanner .cmplz-buttons .cmplz-btn{width:auto !important;flex:1 1 auto;min-width:0;font-size:13px !important;padding:10px 12px !important}
}
body{margin:0;overflow-x:hidden;font-family:'Work Sans',sans-serif;background:var(--tp-bg);color:#1C1C1A}
h1,h2,h3{font-family:'Space Grotesk',sans-serif;margin:0}
a{color:inherit;text-decoration:none}
.tp-btn{display:inline-flex;align-items:center;justify-content:center;padding:18px 40px;border-radius:999px;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:18px;border:none;cursor:pointer;text-align:center}
.tp-wrap{max-width:1280px;margin:0 auto}
.tp-section{padding:var(--pad-y) var(--pad-x)}
.tp-bar{padding:24px var(--pad-x-sm)}
.tp-row{display:flex;gap:24px}
h1{font-size:clamp(32px, 6vw, 52px) !important}
@media (max-width: 900px){
  .tp-row{flex-direction:column}
  .tp-bar{flex-wrap:wrap;gap:12px}
}
.tp-site-header{position:sticky;top:0;z-index:50;background:var(--tp-bg);transition:box-shadow 0.25s ease, padding 0.25s ease}
.tp-site-header-1{display:flex;width:100%;}
.tp-site-header-11{flex:1;}
.tp-site-header-2 {
  display:flex;
  font-size:11px;
  align-items:center;
  justify-items:center;
  margin:20px auto 30px;
  color:white;
}
.tp-site-header-2 .dot {
  margin-left:3px;
  margin-right:3px;
}
.tp-site-header.tp-scrolled{padding-top:13px;padding-bottom:13px;box-shadow:0 4px 20px rgba(0,0,0,0.08)}

.tp-faq-item{border:1px solid rgba(0,0,0,0.08);border-radius:14px;background:#FFFFFF;overflow:hidden;margin-bottom:12px}
.tp-faq-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;background:transparent;border:none;cursor:pointer;text-align:left;font-family:'Space Grotesk',sans-serif;font-size:17px;font-weight:600;color:#1C1C1A}
.tp-faq-chevron{flex-shrink:0;transition:transform 0.15s ease}
.tp-faq-item.tp-open .tp-faq-chevron{transform:rotate(180deg)}
.tp-faq-answer{max-height:0;overflow:hidden;transition:max-height 0.2s ease}
.tp-faq-item.tp-open .tp-faq-answer{max-height:400px}
.tp-faq-answer-inner{padding:0 24px 22px;font-size:15px;line-height:1.5;color:#4A4944}

/* ---------- Hero ---------- */
.tp-hero-band{position:relative;overflow:hidden;display:flex;justify-content:center;padding:40px 30px;gap:50px;}
.tp-hero-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:48px;}
.tp-hero-text{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:20px;max-width:500px;padding:0px 10px;}
.tp-hero-text-top{font-size:11px;}
@media (max-width: 1300px){
  .tp-hero-band{flex-direction:column;}
  .tp-hero-text{align-items:center;text-align:center;margin:0px auto;}
  .tp-hero-inner{flex-direction:column;}
  .tp-screen{margin:0px auto;}
}

/* ---------- Neon network panel ---------- */
.tp-screen{position:relative;width:400px;height:400px;flex-shrink:0;border-radius:28px;background:radial-gradient(circle at 50% 45%, #10251c 0%, #081410 70%, #061009 100%);box-shadow:inset 0 0 0 1px rgba(163,255,209,0.12), 0 20px 50px rgba(0,0,0,0.35)}
.tp-screen-svg{position:absolute;inset:0;width:100%;height:100%;border:none;pointer-events:none;overflow:visible}
.tp-rotor{position:absolute;inset:0;animation:tp-orbit-spin 30s linear infinite}

.tp-hub-wrap{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:120px;height:120px;filter:drop-shadow(0 0 18px rgba(90,230,160,0.55)) drop-shadow(0 0 46px rgba(90,230,160,0.3));z-index:2}
.tp-hub-ring{position:absolute;border-radius:50%;animation:tp-spin 9s linear infinite}
.tp-hub-ring.tp-r1{inset:-14px;border:1.5px solid rgba(120,255,180,0.12);border-top-color:rgba(163,255,209,0.9);filter:drop-shadow(0 0 5px rgba(120,255,180,0.5))}
.tp-hub-ring.tp-reverse{inset:-26px;border:1.5px solid rgba(120,255,180,0.08);border-bottom-color:rgba(163,255,209,0.6);animation-duration:13s;animation-direction:reverse;filter:drop-shadow(0 0 5px rgba(120,255,180,0.35))}
.tp-hub{position:absolute;inset:0;clip-path:polygon(25% 3%, 75% 3%, 100% 50%, 75% 97%, 25% 97%, 0% 50%);background:rgba(10,30,24,0.6);border:2px solid rgba(163,255,209,0.9);display:flex;align-items:center;justify-content:center;overflow:hidden}
.tp-hub img{width:100%;height:100%;object-fit:cover;display:block}
.tp-hub svg{width:46px;height:46px;flex-shrink:0;filter:drop-shadow(0 0 6px rgba(163,255,209,0.8))}
@keyframes tp-spin{to{transform:rotate(360deg)}}
@keyframes tp-orbit-spin{to{transform:rotate(360deg)}}
@keyframes tp-orbit-spin-reverse{to{transform:translate(-50%,-50%) rotate(-360deg)}}
@keyframes tp-pulse1{0%,100%{transform:translate(0px,0px)}50%{transform:translate(0px,-8px)}}
@keyframes tp-pulse2{0%,100%{transform:translate(0px,0px)}50%{transform:translate(6.9px,-4px)}}
@keyframes tp-pulse3{0%,100%{transform:translate(0px,0px)}50%{transform:translate(6.9px,4px)}}
@keyframes tp-pulse4{0%,100%{transform:translate(0px,0px)}50%{transform:translate(0px,8px)}}
@keyframes tp-pulse5{0%,100%{transform:translate(0px,0px)}50%{transform:translate(-6.9px,4px)}}
@keyframes tp-pulse6{0%,100%{transform:translate(0px,0px)}50%{transform:translate(-6.9px,-4px)}}

.tp-node{position:absolute;width:0;height:0}
.tp-node-pulse{position:absolute;top:0;left:0}
.tp-node-counter{position:absolute;top:0;left:0;transform:translate(-50%,-50%);animation:tp-orbit-spin-reverse 30s linear infinite;display:flex;flex-direction:column;align-items:center;gap:8px;width:118px}
.tp-node-icon{width:52px;height:52px;border-radius:50%;background:rgba(10,30,24,0.6);border:1.5px solid rgba(163,255,209,0.75);box-shadow:0 0 14px rgba(90,230,160,0.35);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.tp-node-icon svg{width:22px;height:22px;flex-shrink:0;filter:drop-shadow(0 0 4px rgba(163,255,209,0.7))}
.tp-node-icon.tp-out{border-color:rgba(255,210,120,0.85);box-shadow:0 0 16px rgba(255,190,90,0.5)}
.tp-node-label{font-size:12px;font-weight:600;color:#eafff2;text-align:center;line-height:1.3}
@media (max-width: 1050px){
  .tp-node-label{font-size:19px}
}
@media (max-width: 600px){
  .tp-hero-inner{gap:0px;}
  .tp-hero-band{padding-left:10px;padding-right:10px;}
  .tp-node-label{font-size:12px}
  .tp-screen{width:300px;height:300px;}
  .tp-hub-wrap{width:60px;height:60px;}
}

.tp-section-preise {padding:0px;}
.tp-prize-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.tp-prize-chip{padding:18px 26px;border-radius:18px;background:#FFFFFF;border:1px solid rgba(0,0,0,0.08);max-width: 200px;}
.tp-prize-chip-top{display:flex;gap:10px;align-items:center;margin-bottom:10px;}
.tp-prize-medal{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:18px;flex-shrink:0;color:#FAF8F3}
.tp-prize-chip.tp-gold{box-shadow:0 10px 26px rgba(47,107,79,0.18);border-color:rgba(47,107,79,0.3)}
.tp-prize-chip.tp-gold .tp-prize-medal{background:var(--tp-accent)}
.tp-prize-chip.tp-silver .tp-prize-medal{background:#C9C4B4;color:#1C1C1A}
.tp-prize-chip.tp-bronze .tp-prize-medal{background:#DDB892;color:#1C1C1A}
.tp-prize-amount{font-size:21px;font-weight:700;font-family:'Space Grotesk',sans-serif;line-height:1.2}
.tp-prize-label{font-size:13px;color:#6B6A64;text-align:center;}
@media (max-width: 550px){
  .tp-prize-medal {width:30px;height:30px;}
  .tp-prize-chip {padding:10px 20px;}
  .tp-prize-chip-top{display:flex;flex-direction:column;justify-content:center;margin-bottom:0px;}
  .tp-prize-row {gap:10px;}

}

.tp-betman-card{
  background:#1C1C1A;border-radius:24px;overflow:hidden;color:#FAF8F3;
  max-width: 500px;
  margin: 0px auto;
}
.tp-betman-top{display:flex;align-items:center;gap:32px;padding:32px 40px}
.tp-betman-avatar{width:88px;height:88px;border-radius:20px;background:var(--tp-accent);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.tp-betman-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.tp-betman-story{padding:0 24px 28px}
@media (max-width: 700px){ 
  .tp-section-betman {padding:0px 12px;}
  .tp-betman-top{flex-direction:column;padding:32px 16px} 
  .tp-betman-story {
    padding:0px 12px 12px 12px;
  }
}

.tp-section-spielplan {
  padding:30px 14px;
}
.tp-section-spielplan .tp-section-spielplan-1 {
  max-width: 600px;
  margin:0px auto;
}

.tp-date-row{
  display:flex;gap:16px;flex-wrap:wrap;
  justify-content: center;
}
.tp-date-chip{
  background:#FFFFFF;border:1px solid rgba(0,0,0,0.08);
  border-radius:16px;padding:16px 22px;flex:1 1 180px;max-width:240px
}
.tp-date-chip-label{font-size:11px;font-weight:600;letter-spacing:0.06em;color:#8A8880;text-transform:uppercase}
.tp-date-chip-date{font-size:19px;font-weight:700;font-family:'Space Grotesk',sans-serif;color:#1C1C1A;margin-top:2px}
.tp-date-chip-match{font-size:13px;color:#6B6A64;margin-top:4px}
.tp-notice{display:flex;align-items:flex-start;gap:16px;padding:20px 24px;background:#F1EDE3;border:1px solid rgba(0,0,0,0.08);border-radius:14px}
.tp-notice-icon{width:36px;height:36px;border-radius:10px;background:var(--tp-accent);color:#FAF8F3;display:flex;align-items:center;justify-content:center;flex-shrink:0}
@media (max-width:600px){
  .tp-section-spielplan {
    padding:30px 10px;
  }
  .tp-date-row {
    gap:8px;
  }
  .tp-date-chip {
    flex:initial;
    padding:14px 10px;
  }
  .tp-notice {
    padding:12px 16px;
  }
}


.tp-section-2 {
  padding:40px 0px;
  background:white;
}
.tp-vision-strip{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;max-width:640px;margin:0 auto}

.tp-partners{padding:30px var(--pad-x);text-align:center;background-color: white;}
.tp-partners-label{font-size:12px;font-weight:600;letter-spacing:0.08em;color:#8A8880;text-transform:uppercase;margin-bottom:20px}
.tp-partners-row{display:flex;align-items:center;justify-content:center;column-gap:48px;row-gap:20px;flex-wrap:wrap}
.tp-partners-row img{max-width:100px;height:auto;width:auto;filter:grayscale(100%);opacity:0.5;transition:filter 0.2s ease, opacity 0.2s ease}
.tp-partners-row img:hover{filter:grayscale(0%);opacity:1}
@media (max-width:600px){
  .tp-partners {
    padding:20px;
  }
}

.tp-reveal{opacity:0;transform:translateY(28px);transition:opacity 0.7s ease, transform 0.7s ease}
.tp-reveal.tp-visible{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion: reduce){
  .tp-reveal{opacity:1;transform:none;transition:none}
}

.tp-stats{display:flex;gap:0px;justify-content:center;flex-wrap:wrap;margin-top:0px}
.tp-stat{text-align:center; width:116px;}
.tp-stat-num{font-family:'Space Grotesk',sans-serif;font-size:28px;font-weight:700;color:var(--tp-accent);line-height:1.1}
.tp-stat-label{font-size:13px;color:#6B6A64;margin-top:2px}

/* ---------- So funktioniert's accordion + phone mockup ---------- */
.tp-step{border-radius:16px;background:#FFFFFF;border:1px solid rgba(0,0,0,0.08);overflow:hidden;margin-bottom:12px;transition:border-color 0.2s ease}
.tp-step.tp-open{border-color:var(--tp-accent)}
.tp-step-head{width:100%;display:flex;align-items:center;gap:16px;padding:20px 22px;background:transparent;border:none;cursor:pointer;text-align:left}
.tp-step-answer{max-height:0;overflow:hidden;transition:max-height 0.2s ease;font-size:14px;line-height:1.6;color:#6B6A64}
.tp-step.tp-open .tp-step-answer{max-height:200px;margin-top:6px}
.tp-step-toggle{width:26px;height:26px;border-radius:50%;border:1.5px solid rgba(0,0,0,0.15);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative}
.tp-step-toggle::before,.tp-step-toggle::after{content:"";position:absolute;background:#1C1C1A;transition:transform 0.2s ease}
.tp-step-toggle::before{width:10px;height:1.5px}
.tp-step-toggle::after{width:1.5px;height:10px}
.tp-step.tp-open .tp-step-toggle::after{transform:rotate(90deg);opacity:0}

.tp-steps-wrap{display:flex;gap:56px;align-items:center}
@media (max-width: 900px){ .tp-steps-wrap{flex-direction:column} }

.tp-phone-tilt{perspective:1200px;flex-shrink:0}
.tp-phone{position:relative;width:170px;height:340px;border-radius:36px;background:#1C1C1A;padding:12px;box-shadow:0 30px 50px rgba(0,0,0,0.28);transform:rotateY(16deg) rotateX(3deg) rotateZ(-4deg);transform-style:preserve-3d}
.tp-phone-screen{position:relative;width:100%;height:100%;border-radius:26px;background:linear-gradient(180deg,#132436,#0c1a28);overflow:hidden;display:flex;flex-direction:column}
.tp-ts-head{padding:20px 16px 10px;font-size:11px;font-weight:700;letter-spacing:0.1em;color:rgba(255,255,255,0.45);text-transform:uppercase;flex-shrink:0}
.tp-ts-list-mask{flex:1;overflow:hidden;padding:0 14px}
.tp-ts-list{display:flex;flex-direction:column;gap:10px;animation:tp-ts-scroll 13s ease-in-out infinite}
.tp-ts-row{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.08);border-radius:12px;padding:9px 14px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.tp-ts-row.tp-ts-active{border-color:rgba(120,255,180,0.4)}
.tp-ts-teams{display:flex;flex-direction:column;gap:2px}
.tp-ts-teams span{font-size:12px;font-weight:600;color:#eef4fa}
.tp-ts-score-wrap{position:relative;display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.tp-ts-score-label{font-size:9px;letter-spacing:0.06em;color:rgba(255,255,255,0.4);text-transform:uppercase}
.tp-ts-score{position:relative;font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:700;color:#78ffb4}
.tp-ts-placeholder{position:absolute;inset:0;font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:700;color:rgba(255,255,255,0.25);animation:tp-ts-placeholder 13s ease-in-out infinite}
.tp-ts-score span.tp-ts-value{opacity:0;animation:tp-ts-score 13s ease-in-out infinite}
.tp-ts-tap{position:absolute;top:-6px;right:-6px;width:16px;height:16px;border-radius:50%;background:rgba(120,255,180,0.7);opacity:0;animation:tp-ts-tap 13s ease-in-out infinite}
.tp-ts-btn-wrap{padding:14px 16px 18px;flex-shrink:0}
.tp-ts-btn{position:relative;width:100%;padding:12px;border-radius:12px;background:#7fb3ff;color:#0c1a28;font-size:13px;font-weight:700;text-align:center;font-family:'Space Grotesk',sans-serif;animation:tp-ts-press 13s ease-in-out infinite}
.tp-ts-confirm{position:absolute;inset:0;border-radius:26px;background:rgba(12,26,40,0.92);display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;animation:tp-ts-confirm 13s ease-in-out infinite}
.tp-ts-confirm-card{background:#1c2f42;border-radius:16px;padding:20px 8px;text-align:center;width:100%}
.tp-ts-confirm-card p{font-size:13px;color:#eef4fa;margin:0 0 14px;line-height:1.4}
.tp-ts-confirm-btn{background:#78ffb4;color:#0c1a28;font-size:12px;font-weight:700;font-family:'Space Grotesk',sans-serif;padding:9px;border-radius:10px;animation:tp-ts-confirm-press 13s ease-in-out infinite}
.tp-ts-check{position:absolute;inset:0;border-radius:26px;background:rgba(12,26,40,0.92);display:flex;align-items:center;justify-content:center;opacity:0;animation:tp-ts-check 13s ease-in-out infinite}
.tp-ts-check-circle{width:56px;height:56px;border-radius:50%;background:#4ade80;display:flex;align-items:center;justify-content:center}
 
@keyframes tp-ts-scroll{0%,4%{transform:translateY(0)}26%,30%{transform:translateY(-260px)}38%,96%{transform:translateY(0)}100%{transform:translateY(0)}}
@keyframes tp-ts-placeholder{0%,38%{opacity:1}42%,96%{opacity:0}99%,100%{opacity:1}}
@keyframes tp-ts-score{0%,38%{opacity:0}42%,96%{opacity:1}99%,100%{opacity:0}}
@keyframes tp-ts-tap{0%,35%{opacity:0;transform:scale(0.5)}38%{opacity:1;transform:scale(1)}42%{opacity:0;transform:scale(1.4)}100%{opacity:0}}
@keyframes tp-ts-press{0%,56%{transform:scale(1)}58%{transform:scale(0.94)}60%,100%{transform:scale(1)}}
@keyframes tp-ts-confirm{0%,58%{opacity:0;transform:scale(0.9)}61%{opacity:1;transform:scale(1)}76%,78%{opacity:1;transform:scale(1)}82%,100%{opacity:0;transform:scale(0.9)}}
@keyframes tp-ts-confirm-press{0%,72%{transform:scale(1)}74%{transform:scale(0.92)}76%,100%{transform:scale(1)}}
@keyframes tp-ts-check{0%,79%{opacity:0;transform:scale(0.7)}83%{opacity:1;transform:scale(1.05)}86%,94%{opacity:1;transform:scale(1)}98%,100%{opacity:0;transform:scale(0.7)}}
@media (max-width: 900px){
  /*
  .tp-phone{transform:rotateY(0deg) rotateX(0deg) rotateZ(0deg)}
  */
}
@media (prefers-reduced-motion: reduce){
  .tp-ts-list,.tp-ts-placeholder,.tp-ts-score span.tp-ts-value,.tp-ts-btn,.tp-ts-tap,.tp-ts-confirm,.tp-ts-confirm-btn,.tp-ts-check{animation:none}
}

@media (prefers-reduced-motion: reduce){
  .tp-hub-ring, .tp-rotor, .tp-node-counter, .tp-node-pulse, .tp-phone-tap{animation:none}
}

.tp-steps {
  padding-top:40px;padding-bottom:40px;
}
.tp-faq {
  padding-top:40px;padding-bottom:40px;
}
.tp-friends {
  padding-top:40px;padding-bottom:40px;
}