/*
Theme Name: ZW Solutions
Theme URI: https://zwsolutions.at
Description: Schlankes Child-Theme für ZW Solutions GmbH (Lohnhonen & Präzisionsbohrungen). Design-Tokens aus dem Firmenlogo, Schrift Archivo lokal gehostet (DSGVO). Baut auf Astra auf.
Author: ZW Solutions / Sebastian
Template: astra
Version: 1.0.4
Text Domain: zw-solutions
*/

/* ============================================================
   Schrift: Archivo — LOKAL gehostet (DSGVO, keine Google-Server)
   Variable Font: ein File deckt 400–800 ab.
   ============================================================ */
@font-face{
  font-family:'Archivo';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('assets/fonts/archivo-var.woff2') format('woff2-variations'),
      url('assets/fonts/archivo-var.woff2') format('woff2');
}

/* ============================================================
   ZW SOLUTIONS — Design Tokens & Styles
   Farben aus dem Logo: Blau #1e4d8b · Orange #f08a2a
   ============================================================ */
:root{--blue:#1e4d8b;--blue-d:#163d6f;--blue-x:#0f2a4a;--orange:#f08a2a;--orange-d:#d9771b;--ink:#16222f;--mut:#54657a;--line:#dee5ee;--soft:#f3f6fa;--r:12px;--shadow:0 12px 32px rgba(20,55,95,.10)}

/* Reset scoped auf unsere Seite, damit Astra-Basis nicht durchschlägt */
.zw *{box-sizing:border-box;margin:0;padding:0}
.zw{font:400 17px/1.65 Archivo,system-ui,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
.zw img{max-width:100%;display:block}
.zw a{color:var(--blue);text-decoration:none;transition:color .15s}
.zw a:hover{color:var(--orange-d)}
.zw h1,.zw h2,.zw h3,.zw h4{line-height:1.14;font-weight:700;letter-spacing:-.012em;text-wrap:pretty}
.zw p{text-wrap:pretty}
.zw .container{max-width:1140px;margin:0 auto;padding:0 24px}
.zw .eyebrow{display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.14em;font-size:12.5px;font-weight:600;color:var(--blue)}
.zw .eyebrow::before{content:"";width:26px;height:2px;background:var(--orange);flex:none}
.zw .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 26px;border-radius:8px;font:600 16px/1 Archivo,sans-serif;border:0;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.zw .btn-primary{background:var(--blue);color:#fff}
.zw .btn-primary:hover{background:var(--blue-d);color:#fff}
.zw .btn-cta{background:var(--orange);color:#1c1206}
.zw .btn-cta:hover{background:var(--orange-d);color:#1c1206}
.zw .btn-ghost{background:#fff;color:var(--blue);border:1.5px solid var(--line)}
.zw .btn-ghost:hover{border-color:var(--blue);color:var(--blue)}
.zw .todo{border-bottom:2px dotted var(--orange);cursor:help;font-style:normal}
/* ---------- Header ---------- */
.zw .site-head{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.zw .head-in{display:flex;align-items:center;gap:32px;height:72px}
.zw .brand{display:flex;align-items:center;gap:11px;font-size:19px;letter-spacing:.01em;color:var(--ink);font-weight:500}
.zw .brand b{font-weight:800;color:var(--blue)}
.zw .brand img{width:40px;height:40px}
.zw .main-nav{display:flex;gap:6px;margin-left:auto}
.zw .main-nav a{padding:9px 14px;border-radius:7px;color:var(--ink);font-weight:500;font-size:16px}
.zw .main-nav a:hover{color:var(--blue);background:var(--soft)}
.zw .main-nav a.active{color:var(--blue);font-weight:700;box-shadow:inset 0 -2px 0 var(--orange)}
.zw .nav-toggle{display:none;background:none;border:1.5px solid var(--line);border-radius:8px;width:42px;height:42px;font-size:19px;color:var(--blue);cursor:pointer}
/* ---------- Hero ---------- */
.zw .hero{padding:84px 0 64px;background:linear-gradient(180deg,#fff 0%,var(--soft) 100%)}
.zw .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.zw .hero h1{font-size:clamp(36px,4.6vw,56px);margin:18px 0 20px}
.zw .hero h1 .acc{color:var(--blue)}
.zw .hero-sub{font-size:19px;color:var(--mut);max-width:54ch}
.zw .hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.zw .hero-badges{display:flex;gap:22px;flex-wrap:wrap;margin-top:34px;color:var(--mut);font-size:15px}
.zw .hero-badges span{display:flex;align-items:center;gap:8px}
.zw .hero-badges svg{flex:none}
.zw .hero-visual{position:relative}
.zw .hero-meta{position:absolute;left:-28px;bottom:26px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:18px 22px;display:grid;gap:8px;min-width:250px}
.zw .hero-meta div{display:flex;justify-content:space-between;gap:24px;font-size:14.5px;color:var(--mut)}
.zw .hero-meta b{color:var(--ink)}
/* ---------- Bild-Platzhalter ---------- */
.zw .ph{background:repeating-linear-gradient(45deg,#eef2f7 0 14px,#e5ebf3 14px 28px);border:1.5px dashed #b6c4d6;border-radius:var(--r);display:grid;place-items:center;text-align:center;color:var(--mut);font-size:14.5px;padding:20px;min-height:200px}
.zw .ph small{display:block;margin-top:6px;opacity:.75}
.zw .ph-hero{aspect-ratio:4/3.4}
/* ---------- Sektionen ---------- */
.zw .sec{padding:84px 0}
.zw .sec-soft{background:var(--soft)}
.zw .sec-head{max-width:660px;margin-bottom:46px}
.zw .sec-head h2{font-size:clamp(28px,3.4vw,40px);margin:14px 0 12px}
.zw .sec-head p{color:var(--mut);font-size:18px}
/* ---------- Stats ---------- */
.zw .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:-116px;position:relative;z-index:2}
.zw .stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;box-shadow:var(--shadow)}
.zw .stat b{display:block;font-size:26px;font-weight:800;color:var(--blue);letter-spacing:-.01em}
.zw .stat span{font-size:14.5px;color:var(--mut)}
/* ---------- Leistungen ---------- */
.zw .svc-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:20px}
.zw .svc-col{display:grid;gap:20px;grid-auto-rows:1fr}
.zw .svc{border:1px solid var(--line);border-radius:var(--r);padding:34px;background:#fff;display:flex;flex-direction:column;gap:14px}
.zw .svc-featured{background:var(--blue-x);color:#dce6f2;border:0}
.zw .svc-featured h3{color:#fff}
.zw .svc h3{font-size:24px}
.zw .svc-tag{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;background:var(--soft);color:var(--blue);padding:5px 11px;border-radius:99px}
.zw .svc-featured .svc-tag{background:rgba(240,138,42,.22);color:#ffc48a}
.zw .svc p{font-size:16.5px}
.zw .svc ul{list-style:none;display:grid;gap:9px;margin-top:2px}
.zw .svc li{display:flex;gap:10px;font-size:15.5px;align-items:baseline}
.zw .svc li::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--orange);flex:none;transform:translateY(-1px)}
.zw .svc-link{margin-top:auto;font-weight:600;font-size:15.5px}
.zw .svc-featured a{color:#ffc48a}
.zw .svc-featured a:hover{color:#fff}
/* ---------- Prozess ---------- */
.zw .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:s}
.zw .step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px}
.zw .step em{display:block;font-style:normal;font:800 15px/1 Archivo;color:var(--orange);letter-spacing:.08em;margin-bottom:14px}
.zw .step h3{font-size:19px;margin-bottom:8px}
.zw .step p{font-size:15px;color:var(--mut)}
/* ---------- Branchen ---------- */
.zw .chips{display:flex;flex-wrap:wrap;gap:12px}
.zw .chips span{border:1px solid var(--line);background:#fff;border-radius:99px;padding:11px 20px;font-size:15.5px;font-weight:500;color:var(--ink)}
/* ---------- Standort ---------- */
.zw .loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.zw .loc-list{list-style:none;display:grid;gap:12px;margin-top:20px}
.zw .loc-list li{display:flex;gap:12px;align-items:baseline;color:var(--mut)}
.zw .loc-list b{color:var(--ink)}
.zw .map-card{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);display:block}
.zw .map-card .ph{border:0;border-radius:0;min-height:300px}
/* ---------- CTA-Band ---------- */
.zw .cta-band{background:var(--blue-x);color:#c9d6e6;padding:74px 0}
.zw .cta-in{display:flex;align-items:center;justify-content:space-between;gap:36px;flex-wrap:wrap}
.zw .cta-band h2{color:#fff;font-size:clamp(26px,3vw,36px);margin-bottom:10px}
.zw .cta-band p{max-width:52ch}
.zw .cta-band a.mail{color:#ffc48a;font-weight:600}
/* ---------- Unterseiten ---------- */
.zw .page-hero{background:linear-gradient(180deg,#fff,var(--soft));padding:70px 0 54px;border-bottom:1px solid var(--line)}
.zw .page-hero h1{font-size:clamp(32px,4vw,48px);margin:14px 0 12px}
.zw .page-hero p{color:var(--mut);font-size:18.5px;max-width:62ch}
.zw .detail{display:grid;grid-template-columns:1.1fr .9fr;gap:52px;align-items:start}
.zw .detail.rev{grid-template-columns:.9fr 1.1fr}
.zw .detail h2{font-size:clamp(26px,3vw,36px);margin:12px 0 14px}
.zw .detail>div>p{color:var(--mut);font-size:17px}
.zw .spec{width:100%;border-collapse:collapse;margin-top:22px;font-size:15.5px}
.zw .spec th,.zw .spec td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line)}
.zw .spec th{color:var(--mut);font-weight:500;width:44%}
.zw .spec td{font-weight:600}
.zw .check-list{list-style:none;display:grid;gap:11px;margin-top:18px}
.zw .check-list li{display:flex;gap:11px;align-items:baseline;font-size:16px}
.zw .check-list li::before{content:"✓";color:var(--orange-d);font-weight:800;flex:none}
/* ---------- Werte / Kacheln ---------- */
.zw .tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.zw .tile{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px}
.zw .tile h3{font-size:19px;margin-bottom:9px}
.zw .tile p{font-size:15.5px;color:var(--mut)}
/* ---------- Kontakt ---------- */
.zw .contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:start}
.zw .c-cards{display:grid;gap:16px}
.zw .c-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px 24px}
.zw .c-card h3{margin-bottom:8px;color:var(--mut);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:12.5px}
.zw .c-card p{font-size:17px;font-weight:600}
.zw .c-card p a{font-weight:600}
.zw .c-card small{color:var(--mut);font-weight:400;display:block;margin-top:4px}
.zw .form{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px;box-shadow:var(--shadow)}
.zw .form h2{font-size:24px;margin-bottom:6px}
.zw .form>p{color:var(--mut);font-size:15.5px;margin-bottom:22px}
.zw .f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.zw .f-field{display:grid;gap:7px;margin-bottom:16px}
.zw .f-field label{font-size:14px;font-weight:600}
.zw .f-field input,.zw .f-field textarea{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:8px;font:400 16px/1.5 Archivo,sans-serif;color:var(--ink);background:#fff}
.zw .f-field input:focus,.zw .f-field textarea:focus{outline:none;border-color:var(--blue)}
.zw .f-note{font-size:13.5px;color:var(--mut);margin:6px 0 18px}
/* ---------- Legal ---------- */
.zw .legal{max-width:760px}
.zw .legal h1{font-size:clamp(30px,3.6vw,42px);margin-bottom:34px}
.zw .legal h2{font-size:21px;margin:34px 0 10px}
.zw .legal p,.zw .legal li{color:var(--mut);font-size:16px}
.zw .legal ul{padding-left:22px;display:grid;gap:6px}
/* ---------- Footer ---------- */
.zw .site-foot{background:var(--blue-x);color:#b9c8db;margin-top:0}
.zw .site-foot a{color:#dce6f2}
.zw .site-foot a:hover{color:#ffc48a}
.zw .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px;padding:58px 24px 40px;max-width:1140px;margin:0 auto}
.zw .foot-brand{font-size:20px;color:#fff;font-weight:500;margin-bottom:12px}
.zw .foot-brand b{font-weight:800}
.zw .foot-grid p{font-size:15px}
.zw .foot-grid h4{color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:.11em;margin-bottom:14px}
.zw .foot-grid nav{display:grid;gap:9px;font-size:15.5px}
.zw .foot-copy{border-top:1px solid rgba(255,255,255,.12);padding:22px 24px;font-size:14px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;max-width:1140px;margin:0 auto}
/* ---------- Responsive ---------- */
@media (max-width:960px){
.zw .hero-grid,.zw .loc-grid,.zw .detail,.zw .detail.rev,.zw .contact-grid{grid-template-columns:1fr}
.zw .svc-grid{grid-template-columns:1fr}
.zw .stats,.zw .steps{grid-template-columns:1fr 1fr;margin-top:0}
.zw .stats{margin-top:-40px}
.zw .tiles{grid-template-columns:1fr}
.zw .foot-grid{grid-template-columns:1fr 1fr}
.zw .hero-meta{position:static;margin-top:16px}
}
@media (max-width:860px){
.zw .main-nav{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);padding:12px 20px 18px;flex-direction:column;gap:4px}
.zw .main-nav.open{display:flex}
.zw .nav-toggle{display:block;margin-left:auto}
.zw .head-cta{display:none}
}
@media (max-width:620px){
.zw .stats,.zw .steps,.zw .f-row{grid-template-columns:1fr}
.zw .hero{padding:56px 0 48px}
.zw .sec{padding:60px 0}
.zw h1{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;word-break:break-word}
.zw .eyebrow{white-space:normal;font-size:11px;letter-spacing:.06em}
.zw .container{padding:0 18px}
}
/* Sicherheitsnetz: kein horizontales Scrollen durch überbreite Inhalte */
.zw main{overflow-x:hidden}
