/*
 Theme Name:   Crypto-Fuchs Childtheme
 Theme URI:    https://generatepress.com
 Description:  Crypto Fuchs Childtheme
 Author:       Kevin Kunkel
 Author URI:   https://crypto-fuchs.de
 Template:     generatepress
 Version:      0.1
*/


/* ----------------Template CSS (Mobile First) ----------------*/
.site-logo{margin-right:-2px}
body{  background: url("img/bg.jpg") no-repeat top center #1C072F; background-size: cover; background-attachment: fixed;}
.entry-title{text-align:center}


/* ============================================================
   CRYPTO-FUCHS.DE — GLOBAL CSS
   Einmalig einfügen unter: Design → Customizer → Zusätzliches CSS
   ============================================================ */

/* ── VARIABLEN ── */
:root {
  --cf-bg:           #0a0a14;
  --cf-bg-card:      #12121f;
  --cf-bg-glass:     rgba(10,10,20,0.88);

  --cf-purple:       #7c3aed;
  --cf-purple-light: #a855f7;
  --cf-purple-glow:  rgba(124,58,237,0.35);

  --cf-gold:         #f59e0b;
  --cf-gold-light:   #fbbf24;
  --cf-gold-glow:    rgba(245,158,11,0.35);

  --cf-text:         #f1f5f9;
  --cf-text-muted:   #94a3b8;

  --cf-border:       rgba(255,255,255,0.09);
  --cf-border-gold:  rgba(245,158,11,0.45);
  --cf-border-purple:rgba(168,85,247,0.45);

  --cf-radius:       12px;
  --cf-radius-lg:    20px;

  /* Glow-Intensitäten */
  --cf-glow-gold:    0 0 0 1px rgba(245,158,11,0.3), 0 0 20px rgba(245,158,11,0.15), 0 0 60px rgba(245,158,11,0.08);
  --cf-glow-purple:  0 0 0 1px rgba(168,85,247,0.3), 0 0 20px rgba(168,85,247,0.15), 0 0 60px rgba(168,85,247,0.08);
}

/* ── BASE ── */
body {

  color: var(--cf-text);
  font-family: 'Sora', 'Inter', sans-serif;
}

/* ── STANDARD-BOX (alle Textbereiche, Info-Kästen) ──
   Jeder sichtbare Inhaltsbereich bekommt diesen Hintergrund.
   Verhindert, dass Text direkt auf dem Hintergrundbild liegt. */
.cf-box,
.cf-tool,
.cf-card,
.info-box,
.affiliate-disclaimer {
  background: var(--cf-bg-glass);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-radius: var(--cf-radius-lg);
  border: 1px solid var(--cf-border);
  position: relative;
  overflow: hidden;
}

/* Lila Shimmer-Linie oben auf jeder Box */
.cf-box::before,
.cf-tool::before,
.cf-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--cf-purple-light) 50%, transparent 100%);
  opacity: 0.6;
}

/* ── CONTENT-WRAPPER — Fließtext-Abschnitte ──
   Damit auch p-Tags und Fließtext gut lesbar sind */
.cf-prose {
  background: var(--cf-bg-glass);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--cf-border);
  border-radius: var(--cf-radius-lg);
  padding: 28px 32px;
  margin: 20px 0;
  line-height: 1.8;
  position: relative;
  overflow: hidden;
}
.cf-prose::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cf-purple-light), transparent);
  opacity: 0.5;
}

/* ── GOLD-GLOW BOX (CTA, Highlights) ── */
.cf-box-gold {
  background: rgba(10,8,4,0.92);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--cf-border-gold);
  border-radius: var(--cf-radius-lg);
  box-shadow: var(--cf-glow-gold);
  position: relative;
  overflow: hidden;
}
.cf-box-gold::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--cf-gold-light) 50%, transparent 100%);
}

/* ── PURPLE-GLOW BOX ── */
.cf-box-purple {
  background: var(--cf-bg-glass);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--cf-border-purple);
  border-radius: var(--cf-radius-lg);
  box-shadow: var(--cf-glow-purple);
  position: relative;
  overflow: hidden;
}
.cf-box-purple::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--cf-purple-light) 50%, transparent 100%);
}

/* ── INFO-BOX ── */
.info-box {
  background: rgba(10,10,20,0.88);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-left: 3px solid var(--cf-purple);
  border-radius: 0 var(--cf-radius) var(--cf-radius) 0;
  border-top: 1px solid rgba(168,85,247,0.2);
  border-bottom: 1px solid rgba(168,85,247,0.2);
  border-right: 1px solid rgba(168,85,247,0.2);
  padding: 16px 20px;
  margin: 24px 0;
  color: var(--cf-text-muted);
  font-size: 0.95em;
  line-height: 1.7;
}

/* ── AFFILIATE DISCLAIMER ── */
.affiliate-disclaimer {
  background: rgba(10,10,20,0.88);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-left: 3px solid var(--cf-purple);
  border-radius: 0 var(--cf-radius) var(--cf-radius) 0;
  border-top: 1px solid rgba(168,85,247,0.15);
  border-bottom: 1px solid rgba(168,85,247,0.15);
  border-right: 1px solid rgba(168,85,247,0.15);
  padding: 12px 16px;
  font-size: 0.85em;
  color: var(--cf-text-muted);
  margin: 28px 0;
}

/* ── KRAKEN CTA ── */
.kraken-cta {
  background: rgba(10,8,4,0.93);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--cf-border-gold);
  border-radius: var(--cf-radius-lg);
  padding: 36px 28px;
  margin: 40px 0;
  text-align: center;
  box-shadow: var(--cf-glow-gold);
  position: relative;
  overflow: hidden;
}
.kraken-cta::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--cf-gold-light) 50%, transparent 100%);
}
.kraken-cta h3 {
  color: var(--cf-gold-light) !important;
  font-size: 1.3em;
  margin-bottom: 8px;
}
.kraken-cta p {
  color: var(--cf-text-muted);
  margin-bottom: 20px;
}
.kraken-cta a.cta-button {
  display: inline-block;
  background: linear-gradient(135deg, var(--cf-gold) 0%, var(--cf-gold-light) 100%);
  color: #000 !important;
  font-weight: 800;
  padding: 15px 36px;
  border-radius: var(--cf-radius);
  text-decoration: none;
  font-size: 1.05em;
  box-shadow: 0 4px 24px var(--cf-gold-glow), 0 0 0 1px rgba(245,158,11,0.4);
  transition: transform 0.2s, box-shadow 0.2s;
}
.kraken-cta a.cta-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 36px var(--cf-gold-glow), 0 0 0 1px rgba(245,158,11,0.6);
}

/* ── H2 & H3 ── */
.entry-content h2 {
  color: var(--cf-purple-light);
  border-left: 3px solid var(--cf-purple);
  padding-left: 14px;
  margin-top: 2.2em;
}
.entry-content h3 {
  color: var(--cf-gold-light);
}

/* ── VERGLEICHS-TABELLE ── */
.cf-table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  border-radius: var(--cf-radius);
  overflow: hidden;
  box-shadow: var(--cf-glow-purple);
}
.cf-table th {
  background: linear-gradient(135deg, var(--cf-purple) 0%, var(--cf-purple-light) 100%);
  color: #fff;
  padding: 13px 16px;
  text-align: left;
  font-weight: 700;
  font-size: 0.93em;
}
.cf-table td {
  background: rgba(10,10,20,0.82);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--cf-border);
  padding: 12px 16px;
  font-size: 0.93em;
}
.cf-table tr:hover td {
  background: rgba(124,58,237,0.10);
}

/* ── TOOL CONTAINER ── */
.cf-tool {
  background: var(--cf-bg-glass);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--cf-border-purple);
  border-radius: var(--cf-radius-lg);
  padding: 32px;
  margin: 28px 0;
  box-shadow: var(--cf-glow-purple);
}
.cf-tool label {
  display: block;
  color: var(--cf-text-muted);
  font-size: 0.875em;
  margin-bottom: 6px;
  font-weight: 500;
}
.cf-tool input,
.cf-tool select {
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--cf-border);
  color: var(--cf-text);
  padding: 12px 14px;
  border-radius: var(--cf-radius);
  width: 100%;
  margin-bottom: 16px;
  font-size: 1em;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.cf-tool input:focus,
.cf-tool select:focus {
  outline: none;
  border-color: var(--cf-purple-light);
  box-shadow: 0 0 0 3px var(--cf-purple-glow), 0 0 12px rgba(168,85,247,0.2);
}
.cf-tool button {
  background: linear-gradient(135deg, var(--cf-purple) 0%, var(--cf-purple-light) 100%);
  color: #fff;
  font-weight: 800;
  border: none;
  padding: 14px 28px;
  border-radius: var(--cf-radius);
  cursor: pointer;
  font-size: 1em;
  box-shadow: 0 4px 20px var(--cf-purple-glow), 0 0 0 1px rgba(168,85,247,0.3);
  transition: transform 0.2s, box-shadow 0.2s;
  letter-spacing: 0.01em;
}
.cf-tool button:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px var(--cf-purple-glow), 0 0 0 1px rgba(168,85,247,0.5);
}

/* ── ERGEBNIS-BOX ── */
.cf-result {
  background: rgba(10,8,4,0.92);
  backdrop-filter: blur(12px);
  border: 1px solid var(--cf-border-gold);
  border-radius: var(--cf-radius);
  padding: 20px 22px;
  margin-top: 20px;
  font-size: 1.2em;
  color: var(--cf-gold-light);
  font-weight: 700;
  box-shadow: var(--cf-glow-gold);
  transition: border-color 0.3s, box-shadow 0.3s;
}

/* ============================================================
   FERTIG — Stand März 2025
   ============================================================ */


/* ---------------------------- Desktop only ---------------------------- */
@media all and (min-width:1024px){

}

/* ------- Medium Desktop -------- */
@media all and (min-width:1024px) and (max-width:1480px){

}

/* ------- Small Desktop -------- */
@media all and (min-width:1024px) and (max-width:1224px){

}


/* ---------------------------- Mobile only ----------------------------- */
@media all and (max-width:1023px){


}