/*
Theme Name: TeutoTech Base
Theme URI: https://teutotech-bi.de
Author: TeutoTech
Description: Schlankes WordPress-Theme fuer TeutoTech. Header mit Menue, WooCommerce-ready, Customizer-Optionen.
Version: 0.19
Text Domain: teutotech
License: GPLv2 or later
*/

:root{
  --color-primary:#0078d4;
  --color-primary-hover:#005bb5;
  --color-primary-light:#e9f2fb;
  --color-head:#003b73;
  --color-text:#333;
  --color-text-light:#666;
  --color-gray:#f5f7fa;
  --container-width:1100px;
  --font-base:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --radius:10px;
}

html{font-family:var(--font-base);scroll-behavior:smooth;overflow-x:hidden;}
body{margin:0;color:var(--color-text);background:#fff;line-height:1.6;overflow-x:hidden;}
img{max-width:100%;height:auto;display:block;}
.container{max-width:var(--container-width);margin:0 auto;padding:0 20px;}
#content{overflow-x:hidden;}
.section-heading{font-size:32px;margin-bottom:30px;text-align:center;color:var(--color-head);}

.cta-button{
  background:var(--color-primary);color:#fff;padding:10px 18px;border-radius:6px;
  text-decoration:none;display:inline-block;font-weight:500;
  transition:background .25s,transform .15s,box-shadow .25s;
}
.cta-button:hover{
  background:var(--color-primary-hover);transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(0,0,0,.1);
}

.card{
  border:1px solid #ddd;border-radius:var(--radius);background:#fff;padding:20px;
  transition:transform .3s ease,box-shadow .3s ease;
}
.card:hover{transform:translateY(-5px);box-shadow:0 8px 16px rgba(0,0,0,.08);}

/* ===== Header ===== */
.site-header{padding:20px 0 14px;position:relative;}
.header-bar{display:flex;align-items:center;gap:16px;justify-content:flex-start;}
.site-branding{display:flex;align-items:center;gap:10px;}
.site-logo-text{font-weight:700;font-size:22px;text-decoration:none;color:var(--color-primary);}
.main-nav{margin-left:32px;}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:18px;flex-wrap:wrap;}
.main-nav a{text-decoration:none;color:var(--color-text);font-weight:500;transition:color .2s;}
.main-nav a:hover,.main-nav .current-menu-item>a{color:var(--color-primary);}
.header-icons{margin-left:auto;display:flex;gap:16px;align-items:center;}
.header-icons a{color:var(--color-text);text-decoration:none;position:relative;font-size:20px;line-height:1;}
.header-icons .cart-count{
  position:absolute;top:-6px;right:-10px;background:var(--color-primary);color:#fff;
  font-size:11px;line-height:1;padding:2px 5px;border-radius:10px;
}
.menu-toggle{display:none;font-size:28px;background:none;border:0;cursor:pointer;line-height:1;}

/* ===== Hero ===== */
.hero,.hero-tt{
  position:relative;color:#fff;text-align:center;
  display:flex;align-items:center;justify-content:center;
  min-height:clamp(300px,45vh,520px);
  background-size:cover;background-position:center;
  width:100vw;margin-left:calc(-50vw + 50%);
}
.hero::before,.hero-tt::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.35);z-index:1;pointer-events:none;}
.hero__content,.hero-tt .inner{
  position:relative;z-index:2;max-width:900px;padding:clamp(12px,2.5vw,24px);
  text-shadow:0 1px 4px rgba(0,0,0,.6);
  opacity:0;transform:translateY(20px);transition:opacity .9s ease,transform .9s ease;
}
.hero__content.visible,.hero-tt .inner.visible{opacity:1;transform:translateY(0);}
.hero__content img,.hero-tt .inner img{display:block;margin:0 auto 20px !important;}

/* ===== PC-Beispiele ===== */
#pc-beispiele{background-color:var(--color-gray);padding:40px 20px 70px;margin:0;}
#pc-beispiele .container{max-width:1100px;margin:0 auto;display:block !important;}
#pc-beispiele h2{display:block;width:100%;text-align:center;margin:0 auto 30px;font-size:32px;color:var(--color-head);}
.pc-grid{display:grid;gap:24px;align-items:stretch;}
@media(min-width:1100px){.pc-grid{grid-template-columns:repeat(3,minmax(300px,1fr));}}
@media(min-width:768px) and (max-width:1099px){.pc-grid{grid-template-columns:repeat(2,minmax(300px,1fr));}}
@media(max-width:767px){.pc-grid{grid-template-columns:1fr;gap:18px;}}
.pc-box{
  border:1px solid #ddd;border-radius:var(--radius);background:#fff;padding:20px;
  display:grid;grid-template-rows:auto 32px 56px 1fr auto;height:100%;
  transition:transform .25s cubic-bezier(.25,.8,.25,1),box-shadow .25s;cursor:pointer;
}
.pc-box:hover{transform:translateY(-6px);box-shadow:0 12px 24px rgba(0,0,0,.08);}
.pc-box img{border-radius:6px;margin-bottom:15px;}
#pc-beispiele .pc-box .meta,#pc-beispiele .pc-box h3{text-align:center !important;}
.pc-box .meta{font-size:14px;color:var(--color-text-light);margin:0;line-height:1.3;min-height:32px;}
.pc-box h3{font-size:20px;margin:6px 0 0;font-weight:700;min-height:56px;}
.pc-box .desc{margin-top:12px;text-align:left;}
.pc-box .btn{
  background:var(--color-primary);color:#fff;padding:10px 18px;border-radius:6px;
  display:inline-block;margin-top:auto;margin-left:auto;margin-right:auto;text-decoration:none;
}

/* ===== Leistungen Tabelle (Startseite) ===== */
#leistungen-v5{padding:40px 20px 40px;text-align:center;scroll-margin-top:80px;}
#leistungen-v5 h2{font-size:32px;margin:0 auto 30px;color:var(--color-head);}
.v5-table-wrap{max-width:1000px;margin:0 auto;overflow-x:auto;}
table.v5-table{width:100%;border-collapse:collapse;background:#fff;font-size:16px;color:var(--color-text);}
table.v5-table thead{background:var(--color-primary-light);color:var(--color-head);}
table.v5-table th,table.v5-table td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid #e2e2e2;}
table.v5-table tr:last-child td{border-bottom:none;}
.v5-icon{margin-right:8px;font-size:18px;line-height:1;vertical-align:middle;color:var(--color-primary);}

/* ===== CTA Bottom ===== */
#cta-bottom{padding:34px 0 54px;text-align:center;}
#cta-bottom .wrap{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;max-width:1100px;margin:0 auto;}
#cta-bottom .tt-cta{
  background:var(--color-primary);color:#fff;padding:12px 26px;border-radius:8px;
  text-decoration:none;font-size:16px;line-height:1;
  display:inline-flex;align-items:center;gap:8px;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
  transition:background .25s,transform .15s,box-shadow .25s;
}
#cta-bottom .tt-cta:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.12);}

/* ===== Footer ===== */
.tt-footer{
  margin-top:60px;padding:36px 0;
  background:var(--color-gray);border-top:1px solid #e2e2e2;
  font-size:14px;color:#555;
}
.tt-footer-inner{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center;}
.tt-footer-copy{margin:0 0 6px;}
.tt-footer-links{display:flex;flex-wrap:wrap;gap:8px 20px;}
.tt-footer-links a{color:#555;text-decoration:none;transition:color .2s;}
.tt-footer-links a:hover{color:var(--color-primary);}
.tt-socials{list-style:none;margin:0;padding:0;display:flex;gap:14px;}
.tt-socials img{width:26px;height:26px;display:block;filter:brightness(0);opacity:.85;transition:opacity .2s;}
.tt-socials a:hover img{opacity:1;}

/* ===== WooCommerce Single Product ===== */
.tt-prod-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;}
.tt-prod-title{margin:0 0 12px;font-size:28px;}
.tt-prod-summary .price{font-size:24px;color:var(--color-primary);margin:12px 0;}
.tt-prod-badges{margin-top:24px;}
@media(max-width:900px){.tt-prod-grid{grid-template-columns:1fr;}}

/* ===== Responsive ===== */
@media(max-width:991px){
  .header-bar{display:flex;align-items:center;gap:12px;}
  .custom-logo,.site-branding img{max-width:120px;height:auto;}
  .menu-toggle{display:block;margin-left:auto;}
  .main-nav{
    position:absolute;top:100%;left:0;right:0;
    background:#fff;border-top:1px solid #eee;
    display:none;padding:12px 20px;z-index:50;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
  }
  body.menu-open .main-nav{display:block;}
  .main-nav ul{display:flex;flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;}
}
@media(max-width:768px){
  .section-heading{font-size:28px;}
  .hero,.hero-tt{min-height:340px;}
}
@media(min-width:992px){
  table.v5-table th:first-child,table.v5-table td:first-child{width:220px;white-space:nowrap;}
}
@media(max-width:991px){
  table.v5-table{font-size:15px;}
  table.v5-table th:first-child,table.v5-table td:first-child{width:50%;}
  table.v5-table th:nth-child(2),table.v5-table td:nth-child(2){width:50%;}
}
@media(max-width:680px){
  .tt-footer-inner{flex-direction:column;align-items:flex-start;gap:16px;}
}