/* Bitpen Theme-Angleich fuer Unterseiten - wird NACH dem Seiten-<style> geladen und
   zieht die Seiten auf den aktuellen index-Stand: CD-only-Farben, Dark Mode,
   3-Stufen-Typo, Menue-/Nav-/Footer-Optik. Quelle der Wahrheit: index.html. */

:root{
  --ink:#222629; --cream:#F5F5F7; --neon:#C8FC60; --orange:#FB4C40;
  --green:var(--ink); --green-d:var(--ink); --peach:var(--cream); --peach-d:var(--cream);
  --taupe:var(--cream); --sand:var(--cream);
  --muted:var(--tx); --muted-l:#F5F5F7;
  --tx:#222629; --hero:var(--cream); --line:var(--tx);
  --bw:2.5px;
  --fs-1:clamp(38px,min(5.5vw,8svh),78px);
  --fs-2:clamp(22px,3vw,36px);
  --fs-3:clamp(14px,1.15vw,16.5px);
}
html.dark{ --cream:#222629; --tx:#F5F5F7; }

body{background:var(--cream);color:var(--tx)}
h1,h2,h3{letter-spacing:-.015em}

/* Nav-Insel: spitze Ecken, grosses Logo, Theme-Farben */
.navwrap nav{border-radius:0;background:color-mix(in srgb,var(--cream) 92%,transparent)}
.logo{color:var(--tx)}
.logo img{height:calc(var(--fs-1) * .72)}
html.dark .logo img{content:url(logo-bitpen-white.svg)}
.cart{color:var(--tx)}
.menu-btn{color:var(--tx)}
.menu-btn .bars span{background:var(--tx)}
.topblur{display:none}
html.dark .navwrap nav{box-shadow:0 4px 24px rgba(0,0,0,.45)}

/* Vollflaechen-Menue: aktueller Stand */
.menu{background:var(--cream)}
.menu-inner{color:var(--tx)}
.blk{background:var(--ink);color:#F5F5F7;border:0;box-shadow:none;align-items:center;justify-content:center;text-align:center}
.blk-m,.blk-s{background:var(--ink);border:0}
@media(hover:hover){.blk:hover{background:var(--neon);color:var(--ink);transform:none}}
.blk:active{background:var(--neon);color:var(--ink)}
.blk:hover{transform:none}
.blk-b{background:var(--neon);color:var(--ink);transform:skewX(-7deg) scale(.92);box-shadow:none}
html.dark .blk-b{box-shadow:none}
@keyframes blkinB{from{opacity:0;transform:translate(var(--dx,0),var(--dy,46px)) skewX(-7deg) scale(.8)}to{opacity:1;transform:skewX(-7deg) scale(.92)}}
body.menu-open .blk-b{animation-name:blkinB}
.blk-fill{background-color:var(--ink);background-image:repeating-linear-gradient(0deg,var(--cream) 0 var(--bw),transparent var(--bw) 13px),repeating-linear-gradient(90deg,var(--cream) 0 var(--bw),transparent var(--bw) 13px);border:0;box-shadow:none;opacity:1}

/* Footer */
.foot{background:var(--ink);color:#F5F5F7}
.foot .cols a{color:#F5F5F7}
.foot .cols{border-top:var(--bw) solid #F5F5F7}
.news input{border-radius:0;border:var(--bw) solid #F5F5F7;color:#F5F5F7;font-family:inherit}
.news button{border-radius:0;font-family:inherit;font-weight:900}
.foot .pays span{border:var(--bw) solid #F5F5F7;color:#F5F5F7}

/* Warenkorb-Zaehler im Icon (Stand index) */
.cart .badge{background:none;color:var(--orange);font-weight:900}

/* Formular-/Basisflaechen auf CD */
input,button,select,textarea{border-radius:0}


/* ===== AUS INDEX UEBERNOMMEN: Warenkorb-Drawer, Newsletter-Popup, Toggles, Icons ===== */
html.dark .cp-checkout{background:var(--tx);color:var(--ink);box-shadow:4px 4px 0 var(--orange)}
html.dark .cp-checkout:hover{background:var(--neon);color:var(--ink);box-shadow:2px 2px 0 var(--orange)}
html.dark .cp-qbtn{background:var(--tx);color:var(--ink);box-shadow:2px 2px 0 rgba(0,0,0,.55)}
html.dark .cp-qbtn:hover{background:var(--neon);color:var(--ink)}
html.dark .cp-qbtn:active{box-shadow:0 0 0 transparent}
html.dark .cp-upsell-add,html.dark .np-form button,html.dark .fb-btn,html.dark .mbuy,html.dark .cp-added{box-shadow:4px 4px 0 rgba(0,0,0,.55)}
html.dark .np-card{box-shadow:6px 6px 0 rgba(0,0,0,.6)}
.cart{display:flex;align-items:center;gap:6px;font-weight:500;font-size:var(--fs-3);text-decoration:none;color:var(--tx)}
.cart{position:relative}
.cart .cart-ic{width:35px;height:30px;display:block}
.cart .cart-ic.ic2{display:none;width:45px}
.cart.two .cart-ic.ic1{display:none}
.cart.two .cart-ic.ic2{display:block}
.cart .badge{position:absolute;left:47%;top:26%;transform:translate(-50%,-50%);background:none;color:var(--orange);font-size:19px;font-weight:900;line-height:1;letter-spacing:0;pointer-events:none}
.cart.filled .ci-top{display:none}
.cart .cart-x{display:none;width:21px;height:21px}
body.cart-open .cart{width:35px;justify-content:center}
body.cart-open .cart .cart-ic,body.cart-open .cart .badge{display:none!important}
body.cart-open .cart .cart-x{display:block}
body.cart-open .navwrap nav .mid .logo,body.cart-open .navwrap nav .mid .buy{opacity:0;transform:translateX(-16px);pointer-events:none}
body.cart-open .menu-btn{opacity:0;pointer-events:none}
.cart-headword{position:absolute;left:18px;top:50%;transform:translateY(-50%) translateX(-14px);opacity:0;font-weight:900;font-size:var(--fs-2);line-height:1;text-transform:uppercase;letter-spacing:-.005em;white-space:nowrap;pointer-events:none;transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1)}
body.cart-open .cart-headword{opacity:1;transform:translateY(-50%) translateX(0)}
.bsym{width:.66em;height:.82em;display:inline-block;vertical-align:-.06em}
.cart .badge.bump{animation:badgepop .55s cubic-bezier(.34,1.56,.64,1)}
@keyframes badgepop{0%{transform:translate(-50%,-50%) scale(1)}35%{transform:translate(-50%,-50%) scale(1.7) rotate(8deg)}70%{transform:translate(-50%,-50%) scale(.92)}100%{transform:translate(-50%,-50%) scale(1)}}
.cartpanel{position:fixed;inset:0;z-index:60;opacity:0;visibility:hidden;transition:opacity .45s cubic-bezier(.16,1,.3,1),visibility 0s .45s}
body.cart-open .cartpanel{opacity:1;visibility:visible;transition:opacity .45s cubic-bezier(.16,1,.3,1)}
.cartpanel-inner{position:absolute;inset:0;background:var(--cream);display:flex;justify-content:center;transform:translateX(100%);transition:transform .45s cubic-bezier(.16,1,.3,1)}
body.cart-open .cartpanel-inner{transform:translateX(0)}
.cp-col{position:relative;width:100%;max-width:min(92vw,640px);margin:0 auto;height:100%;display:flex;flex-direction:column;padding:clamp(90px,7vw,120px) clamp(16px,3vw,36px) clamp(16px,3vw,36px)}
.cp-added{display:flex;align-items:center;gap:clamp(9px,.8vw,13px);background:var(--neon);color:var(--ink);font-weight:900;font-size:var(--fs-3);text-transform:uppercase;letter-spacing:0;padding:clamp(13px,1.2vw,17px) clamp(15px,1.4vw,20px);margin:0;position:absolute;left:clamp(16px,3vw,36px);right:clamp(16px,3vw,36px);top:clamp(90px,7vw,120px);z-index:2;box-shadow:4px 4px 0 var(--ink);opacity:0;transform:translateY(-10px) scale(.96);pointer-events:none;transition:opacity .3s cubic-bezier(.16,1,.3,1),transform .3s cubic-bezier(.16,1,.3,1)}
.cp-added svg{width:clamp(18px,1.4vw,22px);height:clamp(18px,1.4vw,22px);flex:0 0 auto}
.cp-added.show{opacity:1;transform:none;animation:cpaddedpop .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes cpaddedpop{0%{transform:scale(.9)}45%{transform:scale(1.04)}100%{transform:scale(1)}}
.cp-items{flex:1 1 auto;overflow-y:auto;margin-top:clamp(18px,1.8vw,28px);display:flex;flex-direction:column;gap:clamp(18px,1.8vw,28px)}
.cp-item{display:flex;align-items:center;gap:clamp(13px,1.2vw,20px);transition:background .6s}
.cp-item.flash{animation:cpitemflash 1.1s ease}
@keyframes cpitemflash{0%{background:var(--neon)}100%{background:transparent}}
.cp-item img{width:clamp(104px,10vw,160px);height:clamp(104px,10vw,160px);object-fit:contain;background:var(--cream);border:var(--bw) solid var(--tx);flex:0 0 auto}
.cp-item-info{flex:1 1 auto;min-width:0}
.cp-item-info .nm{font-weight:900;font-size:var(--fs-3);letter-spacing:0;line-height:1.25}
.cp-qty{display:flex;align-items:center;gap:clamp(9px,.9vw,13px);margin-top:clamp(8px,.8vw,13px)}
.cp-qbtn{width:clamp(28px,2.3vw,38px);height:clamp(28px,2.3vw,38px);border:var(--bw) solid var(--tx);background:var(--cream);border-radius:0;font-size:var(--fs-3);font-weight:900;line-height:1;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;box-shadow:2px 2px 0 var(--ink);transition:background .2s,color .2s,transform .15s}
.cp-qbtn:hover{background:var(--tx);color:var(--cream)}
.cp-qbtn:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}
.cp-qnum{min-width:20px;text-align:center;font-weight:900;font-size:var(--fs-3)}
.cp-item-right{display:flex;flex-direction:column;align-items:flex-end;gap:clamp(8px,.9vw,13px);flex:0 0 auto}
.cp-item-price{font-weight:900;font-size:var(--fs-3);letter-spacing:0;white-space:nowrap}
.cp-qbtn.cp-remove{margin-left:clamp(6px,.6vw,10px)}
.cp-qbtn.cp-remove svg{width:13px;height:13px;display:block}
.cp-qbtn.cp-remove:hover{background:var(--orange);color:#fff}
.cp-empty{color:var(--muted);font-weight:700;font-size:var(--fs-3);margin-top:24px;display:none}
.cp-emptybuy{display:none}
.cartpanel.empty .cp-emptybuy{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;margin-top:clamp(20px,4svh,40px)}
.cp-emptybuy img{width:min(78%,340px);height:auto}
.cp-emptybuy .nm{margin-top:14px}
.cp-emptybuy .pr{font-weight:900;font-size:var(--fs-2);letter-spacing:-.005em;display:flex;gap:10px;align-items:center;justify-content:center;cursor:pointer}
.cp-emptybuy a{width:min(100%,340px);text-align:center;margin-top:14px;text-decoration:none;padding:15px}
.cartpanel.empty .cp-foot{display:none}
.cartpanel.empty .cp-empty{display:block}
.cartpanel.empty .cp-items{display:none}
.cp-foot{margin-top:clamp(16px,1.6vw,26px);padding-top:clamp(16px,1.6vw,26px);border-top:var(--bw) solid var(--tx)}
.cp-subtotal{display:flex;align-items:center;justify-content:space-between;font-weight:900;text-transform:uppercase;letter-spacing:0;font-size:var(--fs-2);margin-bottom:clamp(14px,1.4vw,22px)}
.cp-subtotal .cp-total-row{display:flex;align-items:center;gap:10px;cursor:pointer}
.cp-subtotal #cpTotal{color:var(--orange)}
.cp-checkout{display:flex;align-items:center;justify-content:center;width:100%;background:var(--ink);color:#F5F5F7;padding:clamp(16px,1.5vw,22px);border-radius:0;box-shadow:4px 4px 0 var(--orange);font-weight:900;font-size:var(--fs-3);text-transform:uppercase;letter-spacing:0;text-decoration:none;text-align:center;transition:background .2s,color .2s,transform .15s,box-shadow .15s}
.cp-checkout:hover{background:var(--neon);color:var(--ink);transform:translate(2px,2px);box-shadow:2px 2px 0 var(--orange)}
.cp-note{margin-top:10px;font-size:var(--fs-3);font-weight:500;color:var(--muted);text-align:center}
.cartpanel{transition:opacity .2s ease}
.cartpanel-inner{transform:none;transition:opacity .2s ease}
.cp-added,.cp-added.show{animation:none;transition:opacity .2s ease}
html[data-cur=fiat] .price .sats,html[data-cur=fiat] .fb-price .sats,html[data-cur=fiat] .cp-emptybuy .sats{display:none}
html[data-cur=btc] .price .peur,html[data-cur=btc] .fb-price .peur,html[data-cur=btc] .cp-emptybuy .peur{display:none}
html[data-cur=btc] .price .sats{font-size:1em;color:inherit}
html[data-cur=btc] .fb-price .sats{font-size:1em}
.curswap{position:relative;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center}
.curswap .cur-ring{width:30px;height:30px;display:block}
.curswap b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:900;font-style:normal;line-height:1;font-size:18px}
html[data-cur=btc] .curswap .cs-fiat{display:none}
html[data-cur=fiat] .curswap .cs-btc{display:none}
.curswap .cs-bsym{width:.6em;height:.76em;display:block}
@keyframes ringspin{from{transform:skewX(-7deg) rotate(0deg)}to{transform:skewX(-7deg) rotate(180deg)}}
.curswap.anim .cur-ring{animation:ringspin .5s cubic-bezier(.16,1,.3,1)}
@keyframes curpop{0%{transform:scale(.6)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
.curswap.anim b.on{animation:curpop .4s cubic-bezier(.34,1.56,.64,1)}
.curswap.mini{display:inline-flex;align-items:center;justify-content:center;background:none;border:var(--bw) solid var(--tx);color:var(--tx);box-sizing:border-box;height:52px;min-width:54px;padding:0 10px}
.foot-toggles{display:flex;align-items:center;gap:12px;margin-top:26px}
.thememini{display:inline-flex;align-items:center;justify-content:center;background:none;border:var(--bw) solid #F5F5F7;color:#F5F5F7;cursor:pointer;box-sizing:border-box;height:52px;min-width:54px;padding:0 11px}
.thememini svg{width:19px;height:19px;display:block}
.pswap-ic{width:.5em;height:.5em;flex:0 0 auto;transform:skewX(-7deg)}
.newspop{position:fixed;inset:0;z-index:80}
.newspop[hidden]{display:none}
.np-scrim{position:absolute;inset:0;background:color-mix(in srgb,var(--ink) 45%,transparent);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);opacity:0;transition:opacity .35s cubic-bezier(.16,1,.3,1)}
.np-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) translateY(24px);opacity:0;width:min(580px,calc(100% - 32px));max-height:calc(100svh - 32px);overflow:auto;background:var(--cream);border:var(--bw) solid var(--tx);box-shadow:6px 6px 0 var(--ink);padding:clamp(26px,5vw,46px);transition:opacity .35s cubic-bezier(.16,1,.3,1),transform .35s cubic-bezier(.16,1,.3,1)}
.newspop.open .np-scrim{opacity:1}
.newspop.open .np-card{opacity:1;transform:translate(-50%,-50%)}
.np-x{position:absolute;top:12px;right:12px;background:none;border:0;cursor:pointer;color:var(--tx);padding:8px}
.np-x svg{width:18px;height:18px;display:block;transform:skewX(-7deg)}
.np-tag{display:inline-block;background:var(--neon);color:var(--ink);font-weight:900;text-transform:uppercase;font-size:var(--fs-3);letter-spacing:0;padding:7px 12px;transform:skewX(-7deg);margin-bottom:14px}
.np-card h3{font-size:var(--fs-2);letter-spacing:0;line-height:.95;margin-bottom:10px}
.np-sub{font-size:var(--fs-3);line-height:1.5;font-weight:500;color:var(--muted);margin-bottom:18px}
.np-form{display:flex;flex-direction:column;gap:10px}
.np-form input{background:transparent;border:var(--bw) solid var(--tx);color:var(--tx);padding:14px 15px;font-size:var(--fs-3);font-family:inherit;border-radius:0}
.np-form button{background:var(--neon);color:var(--ink);border:0;font-family:inherit;font-weight:900;font-size:var(--fs-3);text-transform:uppercase;letter-spacing:0;padding:15px;cursor:pointer;box-shadow:4px 4px 0 var(--ink)}
.np-form button:hover{background:var(--orange)}
.np-done{font-weight:900;font-size:var(--fs-3);background:var(--neon);color:var(--ink);padding:13px 15px;margin-top:4px}
.np-fine{font-size:var(--fs-3);font-weight:500;color:var(--muted);margin-top:12px}
.btcline{display:flex;align-items:center;justify-content:center;gap:7px;font-weight:900;font-size:var(--fs-3);color:var(--tx);margin-top:14px}
.btcline .bolt{color:var(--orange)}
.bolt .bolt-ic{width:.62em;height:1.05em;display:block}
.cp-upsell{display:flex;align-items:center;gap:clamp(12px,1.1vw,18px);background:var(--cream);border:var(--bw) solid var(--tx);padding:clamp(12px,1.1vw,16px);margin-top:clamp(14px,1.4vw,20px)}
.cp-upsell[hidden]{display:none}
.cp-upsell img{width:clamp(56px,5vw,84px);height:clamp(56px,5vw,84px);object-fit:contain;background:var(--cream);flex:0 0 auto}
.cp-upsell-txt{flex:1 1 auto;min-width:0}
.cp-upsell-txt .nm{font-weight:900;font-size:var(--fs-3);letter-spacing:0;line-height:1.2}
.cp-upsell-txt .sv{font-weight:700;font-size:var(--fs-3);color:var(--orange);margin-top:3px}
.cp-upsell-add{background:var(--neon);color:var(--ink);border:0;cursor:pointer;font-family:inherit;font-weight:900;font-size:var(--fs-3);text-transform:uppercase;letter-spacing:0;padding:clamp(10px,1vw,14px) clamp(12px,1.2vw,18px);box-shadow:3px 3px 0 var(--ink);flex:0 0 auto;transition:background .2s,transform 100ms ease-out}
.cp-upsell-add:hover{background:var(--orange)}
.cp-bundleactive{background:var(--neon);color:var(--ink);font-weight:900;font-size:var(--fs-3);padding:clamp(10px,1vw,14px) clamp(12px,1.2vw,16px);margin-top:clamp(12px,1.2vw,16px)}
.cp-bundleactive[hidden]{display:none}
.cp-btc{display:flex;align-items:center;gap:7px;font-weight:900;font-size:var(--fs-3);color:var(--tx);margin:-6px 0 clamp(12px,1.2vw,18px)}
.cp-btc[hidden]{display:none}
.cp-btc b{color:var(--orange)}
.cp-btc .bolt{color:var(--orange);font-style:normal}
.pswap-ic{width:.5em;height:.5em;min-width:21px;min-height:21px}
.np-x svg{width:21px;height:21px}
.bolt .bolt-ic{width:13px;height:21px}

/* ===== FOOTER AUF UNTERSEITEN: statisch (ohne Zwei-Phasen-Scroll der Startseite) ===== */
.foot{height:auto}
.fstage{position:static;height:auto;padding:110px 28px 40px;display:block}
.biglogo{position:static;transform:none!important;opacity:1!important;width:min(100% - 56px,1284px);margin:0 auto 44px;display:block}
.fcontent{position:static;opacity:1!important;transform:none!important;max-width:1340px;margin:0 auto;padding:0}
.fsnap{display:none}
.mbuy{display:none!important}

/* Theme-Icon zeigt nur den Zielmodus */
html.dark .theme-toggle .th-moon,html.dark .thememini .th-moon{display:none}
html:not(.dark) .theme-toggle .th-sun,html:not(.dark) .thememini .th-sun{display:none}

/* Dark-Menue: Grundton leicht angehoben (Mempool-Kachel-Grau), Bloecke bleiben Ink */
html.dark .menu{background:color-mix(in srgb,var(--ink) 87%,#F5F5F7)}

/* ===== DARK-MODE-KONTRASTFIXES (aus Audit) ===== */
.tag{color:#F5F5F7}
.foot h2{color:#F5F5F7}
html.dark .soon .ghost span{color:rgba(245,245,247,.18)}
html.dark :is(h1,h2,h3,p,li,dt,dd,em,strong,blockquote,div.a,div.desc){color:var(--tx)}
html.dark .foot :is(h2,p,li){color:#F5F5F7}
html.dark .wrap a:not(.blk):not(.buy):not(.cta):not([class*="btn"]){color:var(--tx)}

/* Mobile: Seitenkopf zentriert */
@media(max-width:820px){
  .pagehead{text-align:center}
}
/* brand-assets: Labels auf den hellen Asset-Kacheln bleiben dunkel */
html.dark .banm{color:var(--ink)}