/*
Theme Name: ImZenox - First Edition
Description: Coding/Grafikdesign mit Modus-Switch, 3D-Druck, News & Jobs. Auftragsannahme immer hell.
Version: v3d5b
Text Domain: imzenox-eu
*/

:root{ --bg:#fff; --fg:#0f172a; --muted:#64748b; --border:rgba(0,0,0,.12); }
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"; color:var(--fg); background:var(--bg); }
a{ color:inherit; text-decoration:none; }
.container{ max-width:1100px; margin:0 auto; padding:0 1rem; }
.section{ padding:3rem 0; }
.section--border{ border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.is-hidden{ display:none !important; }
.muted{ color:var(--muted); }

/* Header / Nav */
.site-header{ position:sticky; top:0; z-index:50; backdrop-filter:saturate(140%) blur(8px); background:rgba(255,255,255,.75); border-bottom:1px solid var(--border); }
.navbar{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.5rem 1rem; }
.brand a{ display:inline-flex; align-items:center; gap:.5rem; font-weight:800; }
.brand .logo{ height:40px; width:32px; border-radius:.5rem; margin-right:.4rem; }
.site-nav .menu{ display:flex; gap:.5rem; flex-wrap:wrap; margin:0; padding:0 1rem 1rem; }
.site-nav .menu li{ list-style:none; }
.site-nav .menu a{ display:inline-flex; padding:.5rem .75rem; border-radius:.6rem; border:1px solid transparent; }
.site-nav .menu .current-menu-item > a{ border-color:var(--border); }

/* Mode switch */
.mode-switch{ display:inline-grid; grid-auto-flow:column; gap:.35rem; padding:.25rem; border:1px solid var(--border); border-radius:.8rem; }
.mode-switch button{ padding:.45rem .8rem; border-radius:.6rem; border:1px solid transparent; background:transparent; cursor:pointer; }
.mode-switch button.active{ background:#000; color:#fff; border-color:transparent; }
body.theme-coding .mode-switch button{ color:#fff !important; border-color:rgba(255,255,255,.22); }
body.theme-design .mode-switch button{ color:#0f172a !important; border-color:var(--border); }
body.theme-design .mode-switch button.active{ background:transparent; border:1px solid #0f172a; font-weight:700; }
.no-mode .mode-switch{ display:none; }

/* Chips / Surfaces */
.badge,.chip{ display:inline-flex; align-items:center; padding:.25rem .6rem; border-radius:.6rem; border:1px solid var(--border); font-size:.78rem; }
.surface{ background:#fff; border:1px solid var(--border); border-radius:1rem; overflow:hidden; }

/* Grid & media */
.grid{ display:grid; gap:1rem; }
.grid.grid-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.aspect-video{ position:relative; width:100%; padding-top:56.25%; border-radius:.75rem; background:#f1f5f9; overflow:hidden; }
.aspect-video > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* Hero */
.hero{ position:relative; overflow:hidden; }
.hero h1{ margin:0; font-size:clamp(2rem,3vw + 1rem,3rem); line-height:1.12; }
.hero .lead{ margin-top:.75rem; font-size:1.1rem; color:var(--fg); opacity:.9; }
.hero .ring-overlay{ position:absolute; inset:0; pointer-events:none; }

/* Buttons */
.btn{ display:inline-flex; align-items:center; gap:.5rem; padding:.7rem 1rem; border-radius:1rem; border:1px solid var(--border); font-weight:600; }
.btn--primary{ color:#fff; background:linear-gradient(90deg,#8b5cf6,#d946ef); border-color:transparent; will-change:transform; transform:translateZ(0); backface-visibility:hidden; }
.btn--ghost{ background:#fff; }
body.theme-coding .btn.btn--ghost{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.22); color:#fff; }

/* Footer */
.site-footer{ border-top:1px solid var(--border); padding:2rem 1rem; color:var(--muted); }

/* Coding Theme (Gradient via ::before → keine Pixelkante) */
body.theme-coding{ color:#fff; overflow-x:hidden; background:#0b0b0f; }
body.theme-coding::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; transform:translateZ(0);
  background-image:
    radial-gradient(1200px 800px at 95% 20%, rgba(139,92,246,.42) 0%, rgba(139,92,246,.18) 45%, rgba(139,92,246,0) 70%),
    radial-gradient(900px 700px at 0% 0%, rgba(217,70,239,.18) 0%, rgba(217,70,239,0) 60%),
    linear-gradient(180deg,#0b0b0f 0%,#000 100%);
  background-repeat:no-repeat,no-repeat,no-repeat;
  background-position:100% 20%,0% 0%,center;
  background-size:1400px 900px,900px 700px,auto;
}
body.theme-coding .site-header{ background:rgba(10,10,14,.55); border-color:rgba(255,255,255,.12); }
body.theme-coding .brand a, body.theme-coding .site-nav .menu a, body.theme-coding .hero .lead{ color:#fff; }
body.theme-coding .surface{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.16); box-shadow:0 10px 30px rgba(0,0,0,.35); }
body.theme-coding .badge, body.theme-coding .chip{ border-color:rgba(255,255,255,.22); color:#fff; }
body.theme-coding .hero{ background:transparent !important; }
body.theme-coding .hero .ring-overlay{ background:radial-gradient(800px 400px at 65% 15%, rgba(167,139,250,.25) 0%, rgba(167,139,250,0) 60%); }

/* Design Theme (hell + CMYK-Leiste) */
body.theme-design{ background:linear-gradient(180deg,#fff,#f8fafc); color:#0f172a; }
body.theme-design .site-header{ background:rgba(255,255,255,.85); border-color:var(--border); }
body.theme-design .brand a, body.theme-design .site-nav .menu a, body.theme-design .hero .lead{ color:#0f172a; }
.cmyk-strip{ display:none; height:8px; overflow:hidden; border-radius:999px; margin-top:.75rem; }
.cmyk-strip > span{ flex:1; }
.cmyk-strip .c{ background:#00BCD4; } .cmyk-strip .m{ background:#E91E63; } .cmyk-strip .y{ background:#FFEB3B; } .cmyk-strip .k{ background:#111; }
body.theme-design .cmyk-strip{ display:flex; }

/* Auftragsannahme immer hell, egal welcher Modus */
body.imz-auftrag{ background:linear-gradient(180deg,#fff 0%, #f8fafc 100%) !important; color:#0f172a !important; }
body.imz-auftrag::before{ display:none !important; }
body.imz-auftrag .site-header{ background:rgba(255,255,255,.92) !important; border-color:rgba(0,0,0,.12) !important; }
body.imz-auftrag .brand a, body.imz-auftrag .site-nav .menu a{ color:#0f172a !important; }
body.imz-auftrag .mode-switch button{ color:#0f172a !important; border-color:rgba(0,0,0,.15) !important; }
body.imz-auftrag .surface{ background:#fff !important; border:1px solid rgba(0,0,0,.10) !important; box-shadow:0 10px 30px rgba(2,6,23,.06) !important; }
body.imz-auftrag input, body.imz-auftrag select, body.imz-auftrag textarea{ background:#fff !important; color:#0f172a !important; border:1px solid rgba(0,0,0,.15) !important; border-radius:.6rem; padding:.6rem .75rem; }
body.imz-auftrag a{ color:#0f172a !important; text-decoration:underline; }
body.imz-auftrag input[type="checkbox"]{ accent-color:#8b5cf6; }

/* 3D‑Druck neutral & gut lesbar */
.post-type-archive-prints, .single-prints{ background:linear-gradient(180deg,#fff 0%, #f8fafc 100%); color:#0f172a; }
.post-type-archive-prints .site-header, .single-prints .site-header{ background:rgba(255,255,255,.9); }
.post-type-archive-prints .surface, .single-prints .surface{ background:#fff; border:1px solid rgba(0,0,0,.1); box-shadow:0 10px 30px rgba(2,6,23,.06); }
.print-price{ font-weight:700; background:linear-gradient(90deg,#06b6d4,#22d3ee); border:0; color:#002; padding:.15rem .5rem; border-radius:.5rem; }

/* Mobile */
@media (max-width:640px){
  .container{ padding:0 .75rem; }
  .site-nav .menu{ flex-direction:column; gap:.25rem; }
  .grid.grid-3{ grid-template-columns:1fr; }
  .hero .lead{ font-size:1rem; }
}


/* v3d5c: Custom Logo */
.custom-logo{ height:40px; width:auto; border-radius:.5rem; display:inline-block; }
.custom-logo-link{ display:inline-flex; align-items:center; gap:.5rem; }
.brand .logo{ height:40px; width:32px; border-radius:.5rem; margin-right:.4rem; }