/* IT-Gladiator AI — site-wide styles (header, footer, generic pages).
   Homepage-specific sections are in homepage.css. */

:root{
  --bg:#0A0D11;
  --bg-panel:#10151B;
  --bg-panel-alt:#141A21;
  --line:rgba(255,255,255,0.09);
  --line-strong:rgba(255,255,255,0.18);
  --text:#E7ECEF;
  --text-dim:#8D98A3;
  --text-faint:#5B6570;
  --amber:#F0A030;
  --teal:#49B8AA;
  --red:#D9634A;
  --sans:'IBM Plex Sans', -apple-system, sans-serif;
  --mono:'IBM Plex Mono', monospace;
  --maxw:1180px;

  /* Fallback values for CSS variables used by content carried over from
     the previous theme (e.g. text/background on the Legal Info and
     Datenschutzerklärung pages, saved as var(--ast-global-color-N) in
     the block editor). These are safe neutral guesses so old content
     doesn't render invisible or broken; nudge the hex values here if
     the real brand colors differ. */
  --ast-global-color-0: var(--amber);
  --ast-global-color-4: var(--bg-panel);
  --ast-global-color-5: var(--bg-panel-alt);
  --ast-global-color-7: var(--text);
  --wp--preset--color--white: #ffffff;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  margin:0;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%; height:auto;}
a{color:inherit;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:100;
  background:var(--amber); color:#12100B; padding:12px 18px;
  font-family:var(--mono); font-size:13px; text-decoration:none;
}
.skip-link:focus{left:12px; top:12px;}

/* focus visibility */
a:focus-visible, button:focus-visible{
  outline:2px solid var(--amber); outline-offset:2px;
}

/* HEADER */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(10,13,17,0.88); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.site-header-inner{display:flex; align-items:center; justify-content:space-between; padding:16px 28px; gap:20px;}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none;}
.brand-mark{
  width:34px; height:34px; border:1px solid var(--amber);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-weight:600; color:var(--amber); font-size:15px; flex:none;
}
.brand-name{font-family:var(--mono); font-size:14px; letter-spacing:.05em; white-space:nowrap;}
.brand-name span{color:var(--text-dim);}
.site-nav{flex:1; display:flex; justify-content:center;}
.links{list-style:none; display:flex; gap:28px; margin:0; padding:0; font-family:var(--mono); font-size:12.5px; letter-spacing:.04em; color:var(--text-dim);}
.links a{text-decoration:none; transition:color .18s ease;}
.links a:hover{color:var(--amber);}
@media (max-width:860px){ .site-nav{display:none;} }

.btn{
  display:inline-flex; align-items:center; gap:10px; font-family:var(--mono); font-size:13px;
  letter-spacing:.03em; padding:13px 22px; border:1px solid var(--line-strong);
  text-decoration:none; color:var(--text); transition:border-color .18s ease, background .18s ease, color .18s ease;
  background:transparent; white-space:nowrap;
}
.btn:hover{border-color:var(--amber); color:var(--amber);}
.btn.primary{background:var(--amber); color:#12100B; border-color:var(--amber); font-weight:600;}
.btn.primary:hover{background:#ffb85c; color:#12100B;}

/* FOOTER */
.site-footer{padding:36px 0; font-family:var(--mono); font-size:12px; color:var(--text-faint); border-top:1px solid var(--line);}
.foot-inner{max-width:var(--maxw); margin:0 auto; padding:0 28px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px;}
.foot-links{display:flex; gap:18px;}
.foot-links a, .foot-inner .menu a{text-decoration:none; transition:color .18s ease;}
.foot-links a:hover, .foot-inner .menu a:hover{color:var(--amber);}

/* GENERIC PAGE CONTENT (Legal Info, Datenschutzerklärung, any new page) */
.page-content{padding:72px 0 96px;}
.page-content .wrap{max-width:760px;}
.page-title{
  font-family:var(--sans); font-weight:600; font-size:clamp(28px,4vw,40px);
  letter-spacing:-0.01em; margin:0 0 32px; padding-bottom:20px; border-bottom:1px solid var(--line);
}
.page-body{font-size:16px; color:var(--text-dim); line-height:1.75;}
.page-body h2{color:var(--text); font-size:22px; margin:40px 0 14px;}
.page-body h3{color:var(--text); font-size:18px; margin:32px 0 12px;}
.page-body p{margin:0 0 18px;}
.page-body ul, .page-body ol{margin:0 0 18px; padding-left:22px;}
.page-body li{margin-bottom:6px;}
.page-body a{color:var(--amber); text-decoration:underline; text-underline-offset:3px;}
.page-body strong{color:var(--text);}
.page-body table{width:100%; border-collapse:collapse; margin:0 0 24px; font-size:14.5px;}
.page-body table th, .page-body table td{border:1px solid var(--line); padding:10px 12px; text-align:left;}