/*
Theme Name: Techpanther Child
Theme URI: https://techpanther.de
Description: Modernes Dark Tech-Mag Child-Theme für GeneratePress - Space Grotesk + Inter, Neon Akzente, Card Grid, Hero Layout
Author: Techpanther
Template: generatepress
Version: 1.0.0
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Space+Grotesk:wght@600;700&family=JetBrains+Mono:wght@500&display=swap');

:root{
  --tp-bg: #0A0E14;
  --tp-card: #11161F;
  --tp-card-border: rgba(255,255,255,0.08);
  --tp-text: #E6E8EB;
  --tp-muted: #9AA0A8;
  --tp-lime: #C6FF00;
  --tp-cyan: #00E5FF;
  --tp-radius: 16px;
}

body{ background: var(--tp-bg) !important; color: var(--tp-text); font-family: 'Inter', sans-serif; line-height:1.7; }
h1,h2,h3,h4{ font-family:'Space Grotesk', sans-serif; letter-spacing:-0.02em; }
a{ color: var(--tp-text); }
a:hover{ color: var(--tp-lime); }

/* Header */
.inside-header{ background: rgba(10,14,20,0.9) !important; backdrop-filter: blur(12px); border-bottom:1px solid var(--tp-card-border); }
.main-navigation .main-nav ul li a{ font-family:'JetBrains Mono', monospace; font-size:13px; text-transform:uppercase; letter-spacing:0.05em; }

/* Cards */
.tp-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:24px; }
@media(max-width: 1024px){ .tp-grid{ grid-template-columns: repeat(2,1fr);} }
@media(max-width: 640px){ .tp-grid{ grid-template-columns: 1fr;} }

.tp-card{ background: var(--tp-card); border:1px solid var(--tp-card-border); border-radius: var(--tp-radius); overflow:hidden; transition: all .25s ease; }
.tp-card:hover{ transform: translateY(-4px); border-color: var(--tp-lime); box-shadow: 0 12px 32px rgba(0,0,0,0.4), 0 0 0 1px rgba(198,255,0,0.2); }
.tp-card img{ transition: transform .4s ease; }
.tp-card:hover img{ transform: scale(1.05); }
.tp-tag{ font-family:'JetBrains Mono', monospace; font-size:11px; padding:4px 8px; border-radius:999px; font-weight:600; display:inline-block; margin-bottom:12px; }
.tp-tag-ki{ background: var(--tp-cyan); color:#000; }
.tp-tag-guide{ background: var(--tp-lime); color:#000; }
.tp-tag-hardware{ background:#fff; color:#000; }

/* Hero */
.tp-hero{ display:grid; grid-template-columns: 1.6fr 1fr; gap:24px; margin-bottom:48px; }
@media(max-width: 900px){ .tp-hero{ grid-template-columns:1fr; } }
.tp-hero-main{ min-height:480px; position:relative; border-radius:20px; overflow:hidden; background: var(--tp-card); }
.tp-hero-side{ display:flex; flex-direction:column; gap:24px; }

/* Buttons */
.tp-btn{ background: var(--tp-lime); color:#000; border-radius:999px; padding:10px 18px; font-family:'JetBrains Mono'; font-size:13px; font-weight:600; display:inline-flex; }
.tp-btn:hover{ background:#d4ff33; color:#000; }
