/* ===== VORQO X-Design – gemeinsame Komponenten (nach style.css laden) ===== */
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');

.big{font-family:'Anton',sans-serif;text-transform:uppercase;line-height:.96;letter-spacing:.01em;font-weight:400}
.xwrap{max-width:1280px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}
.xbtn{display:inline-flex;align-items:center;gap:8px;padding:15px 28px;border-radius:10px;font-weight:700;font-size:.95rem;transition:.3s cubic-bezier(.22,.8,.24,1);cursor:pointer;border:none;text-decoration:none}
.xbtn--gold{background:linear-gradient(180deg,#f6c453,#e2a63a);color:#141a2e;box-shadow:0 12px 30px -12px rgba(226,166,58,.65)}
.xbtn--gold:hover{transform:translateY(-2px);box-shadow:0 18px 40px -12px rgba(226,166,58,.8)}
.xbtn--navy{background:#0a1230;color:#fff}
.xbtn--navy:hover{transform:translateY(-2px)}

/* Nav: zentriert, Logo mittig */
.xnav{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:200;display:flex;align-items:center;gap:6px;padding:10px 18px;border-radius:12px;background:rgba(10,18,48,.72);-webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%);border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 50px -20px rgba(0,0,0,.6)}
.xnav a{font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(230,238,255,.85);padding:8px 14px;border-radius:8px;transition:.25s;text-decoration:none}
.xnav a:hover{color:#fff;background:rgba(255,255,255,.1)}
.xnav .xlogo{padding:0 16px}
.xnav .xlogo img{height:40px;width:auto;display:block}
.xcta-float{position:fixed;top:18px;right:clamp(16px,3vw,40px);z-index:200}
.xburger{display:none;position:fixed;top:18px;right:16px;z-index:300;width:52px;height:52px;border-radius:12px;background:rgba(10,18,48,.85);border:1px solid rgba(255,255,255,.15);cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.xburger span{width:22px;height:2px;background:#fff;border-radius:2px;transition:.3s}
.xburger.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.xburger.open span:nth-child(2){opacity:0}
.xburger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.xmenu{position:fixed;inset:0;z-index:250;background:linear-gradient(170deg,#0d1736,#060b1e);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;opacity:0;pointer-events:none;transition:.4s}
.xmenu.open{opacity:1;pointer-events:auto}
.xmenu a{font-family:'Anton',sans-serif;font-size:2rem;text-transform:uppercase;color:#fff;padding:8px 20px;text-decoration:none}
.xmenu a:hover{color:#f6c453}
@media(max-width:980px){.xnav{display:none}.xcta-float{right:82px}.xburger{display:flex}}
@media(max-width:480px){.xcta-float .xbtn{padding:12px 16px;font-size:.82rem}}

/* Seiten-Hero im neuen Stil */
.page-hero h1,.k-hero h1{font-family:'Anton',sans-serif!important;text-transform:uppercase;font-weight:400!important;letter-spacing:.01em;line-height:.98!important;font-size:clamp(2.5rem,6.6vw,4.8rem)!important}
.page-hero{padding-top:clamp(140px,20vh,190px)!important}

/* Footer (hell) mit Marquee */
.xfooter{background:#f5f6fa;color:#0f1730;padding:0 0 40px;overflow:hidden}
.xmarquee{background:#0a1230;padding:20px 0;white-space:nowrap;overflow:hidden}
.xmarquee>div{display:inline-block;animation:xmarq 22s linear infinite}
.xmarquee span{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:1.6rem;color:#f6c453;margin-right:48px}
@keyframes xmarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.xfooter-cta{text-align:center;padding:90px 20px 60px}
.xfooter-cta h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-weight:400;font-size:clamp(1.9rem,4.6vw,3.4rem);max-width:900px;margin:0 auto;line-height:1.02;color:#0f1730}
.xfooter-cta .acts{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.xfooter-mid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:30px;padding:40px 0;border-top:1px solid rgba(15,23,48,.12)}
.xfooter-mid .brandcol img{height:52px;margin-bottom:14px}
.xfooter-mid p{max-width:320px;color:rgba(15,23,48,.65);font-size:.92rem}
.xfooter-mid h5{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:14px;color:rgba(15,23,48,.5)}
.xfooter-mid ul{list-style:none;margin:0;padding:0}
.xfooter-mid li{margin-bottom:9px}
.xfooter-mid li a{color:rgba(15,23,48,.8);font-size:.94rem;font-weight:500;text-decoration:none}
.xfooter-mid li a:hover{color:#2563eb}
.xfooter-mid .mail{font-family:'Anton',sans-serif;font-size:clamp(1.3rem,2.6vw,1.9rem);text-transform:uppercase;color:#0f1730;text-decoration:none}
.xfooter-mid .mail:hover{color:#2563eb}
.xfooter-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:26px;border-top:1px solid rgba(15,23,48,.12);font-size:.85rem;color:rgba(15,23,48,.6)}
.xsocials{display:flex;gap:10px}
.xsocials a{width:38px;height:38px;border-radius:50%;border:1px solid rgba(15,23,48,.12);display:flex;align-items:center;justify-content:center;color:#0f1730;transition:.25s}
.xsocials a:hover{background:#0a1230;color:#fff}
