/*
Theme Name: Gobatin Consulting
Theme URI: https://gobatin-consulting.at
Author: Gobatin Consulting GmbH
Version: 8.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: gobatin
*/

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;1,9..144,400&display=swap');

:root {
    --orange:      #EF7D00;
    --orange-h:    #D06B00;
    --orange-pale: #FFF1DE;
    --orange-bd:   #FCD5A5;
    --cream:       #FFFDF9;
    --warm:        #F4F2EE;
    --warm2:       #FAFAF7;
    --bd:          #E8E4DC;
    --anth:        #3D3D3D;
    --anth-dark:   #2A2A2A;
    --text:        #1A1714;
    --mid:         #5C5650;
    --light:       #9A9490;
    --font-h:      'Fraunces', Georgia, serif;
    --font-b:      'Plus Jakarta Sans', system-ui, sans-serif;
    --r-sm:        6px;
    --r-md:        12px;
    --r-lg:        20px;
    --r-xl:        28px;
    --cont:        1200px;
    --t:           0.2s ease;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--font-b); background:var(--cream); color:var(--text); line-height:1.7; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; transition:color var(--t); }
ul { list-style:none; }
button, input, select, textarea { font-family:inherit; }

h1,h2,h3,h4 { font-family:var(--font-h); font-weight:400; line-height:1.15; color:var(--text); }
h1 { font-size:clamp(36px,5vw,68px); letter-spacing:-1.5px; }
h2 { font-size:clamp(26px,3.5vw,44px); letter-spacing:-0.5px; }
h3 { font-size:clamp(19px,2vw,26px); letter-spacing:-0.3px; }
h4 { font-size:18px; }
p  { color:var(--mid); line-height:1.75; }
.lead { font-size:clamp(17px,2vw,20px); color:var(--mid); max-width:600px; line-height:1.7; }

.wrap { max-width:var(--cont); margin:0 auto; padding:0 5%; }
.sec  { padding:80px 5%; }
.sec-inner { max-width:var(--cont); margin:0 auto; }

.lbl { display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:var(--orange); margin-bottom:1rem; }
.lbl::before { content:''; display:block; width:18px; height:2px; background:var(--orange); border-radius:1px; }

.btn-p { display:inline-flex; align-items:center; gap:8px; background:var(--orange); color:#fff!important; padding:14px 32px; border-radius:100px; font-size:15px; font-weight:700; border:none; cursor:pointer; transition:all var(--t); box-shadow:0 4px 18px rgba(239,125,0,.28); white-space:nowrap; }
.btn-p:hover { background:var(--orange-h); transform:translateY(-2px); box-shadow:0 8px 28px rgba(239,125,0,.32); }
.btn-s { display:inline-flex; align-items:center; gap:8px; background:transparent; color:var(--text)!important; padding:13px 31px; border-radius:100px; font-size:15px; font-weight:600; border:1.5px solid var(--bd); cursor:pointer; transition:all var(--t); }
.btn-s:hover { border-color:var(--text); background:var(--warm); }
.btn-w { display:inline-flex; align-items:center; gap:8px; background:#fff; color:var(--orange)!important; padding:14px 32px; border-radius:100px; font-size:15px; font-weight:700; border:none; cursor:pointer; box-shadow:0 4px 16px rgba(0,0,0,.12); transition:all var(--t); }
.btn-w:hover { background:var(--orange-pale); transform:translateY(-2px); }
.btn-group { display:flex; gap:1rem; flex-wrap:wrap; align-items:center; }

/* NAV – schwarz mit hellem Text */
#g-nav { position:fixed; top:0; left:0; right:0; z-index:9999; height:78px; background:rgba(16,16,16,.94); border-bottom:1px solid rgba(255,255,255,.08); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); box-shadow:0 1px 16px rgba(0,0,0,.08); }
#g-nav .inner { max-width:var(--cont); margin:0 auto; padding:0 5%; height:100%; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.logo { font-family:var(--font-h); font-size:22px; font-weight:500; color:#fff; letter-spacing:-.5px; display:flex; align-items:center; line-height:1; max-height:46px; }
.logo em { color:var(--orange); font-style:italic; }
/* Theme-Fallback-Logo: Auf schwarzem Hintergrund die helle Logo-Variante */
.logo .theme-logo-img { display:block; width:auto; height:46px; max-height:46px; object-fit:contain; }
/* WordPress Custom-Logo (via Customizer hochgeladen): Auf schwarzem Hintergrund invertieren */
.logo .custom-logo-link { display:flex; align-items:center; line-height:0; }
.logo .custom-logo { display:block; width:auto; height:46px; max-height:46px; object-fit:contain; filter:brightness(0) invert(1); }
@media (max-width:600px) {
    .logo .theme-logo-img, .logo .custom-logo { height:32px; max-height:32px; }
}
.nav-links { display:flex; gap:1.75rem; align-items:center; }
.nav-links a { font-size:17px; font-weight:500; color:rgba(255,255,255,.72); transition:color var(--t); }
.nav-links a:hover { color:#fff; }
.nav-cta { background:var(--orange); color:#fff!important; padding:11px 26px; border-radius:100px; font-weight:700!important; font-size:17px!important; box-shadow:0 3px 12px rgba(239,125,0,.35); }
.nav-cta:hover { background:var(--orange-h)!important; }
.nav-burger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:4px; }
.nav-burger span { display:block; width:22px; height:2px; background:#fff; border-radius:2px; transition:all var(--t); }
.nav-mobile { display:none; position:fixed; top:78px; left:0; right:0; background:rgba(16,16,16,.98); border-bottom:1px solid rgba(255,255,255,.08); padding:1.5rem 5%; z-index:9998; flex-direction:column; gap:.75rem; }
.nav-mobile.open { display:flex; }
.nav-mobile a { font-size:18px; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.08); color:rgba(255,255,255,.8); font-weight:500; }
.scroll-bar { position:fixed; top:78px; left:0; height:3px; background:var(--orange); z-index:9998; width:0; transition:width .1s; }

/* HERO */
.hero { min-height:100vh; padding:110px 5% 80px; display:grid; grid-template-columns:1fr 1fr; gap:5%; align-items:center; max-width:var(--cont); margin:0 auto; }
.hero-badge { display:inline-flex; align-items:center; gap:7px; background:var(--orange-pale); border:1px solid var(--orange-bd); border-radius:100px; padding:5px 14px 5px 8px; font-size:13px; color:var(--orange); font-weight:700; margin-bottom:1.5rem; }
.hero-badge-dot { width:6px; height:6px; border-radius:50%; background:var(--orange); flex-shrink:0; }
.hero-title em { color:var(--orange); font-style:italic; }
.hero-sub { margin-top:1.25rem; font-size:18px; color:var(--mid); max-width:480px; line-height:1.7; }
.hero-btns { margin-top:2rem; }
.hero-kpi { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--bd); border:1px solid var(--bd); border-radius:var(--r-lg); overflow:hidden; margin-top:2.5rem; }
.hero-kpi-item { background:#fff; padding:1.25rem 1.5rem; }
.hero-kpi-n { font-family:var(--font-h); font-size:30px; color:var(--text); letter-spacing:-1px; line-height:1; margin-bottom:3px; }
.hero-kpi-n em { color:var(--orange); font-style:normal; }
.hero-kpi-l { font-size:13px; color:var(--light); }
.hero-img { border-radius:var(--r-xl); overflow:hidden; box-shadow:0 8px 40px rgba(26,23,20,.12); }

/* SECTIONS */
.sec-gray   { background:var(--warm); }
.sec-white  { background:#fff; }
.sec-anth   { background:var(--anth); }
.sec-anth h2, .sec-anth h3, .sec-anth h4 { color:#fff; }
.sec-anth p { color:rgba(255,255,255,.65); }
.sec-anth .lbl { color:rgba(255,255,255,.45); }
.sec-anth .lbl::before { background:rgba(255,255,255,.3); }
.sec-orange { background:var(--orange); }
.sec-orange h2 { color:#fff; }
.sec-orange p { color:rgba(255,255,255,.85); }

.sec-head { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; margin-bottom:3rem; }
.sec-head.c { grid-template-columns:1fr; text-align:center; }
.sec-head.c .lbl { justify-content:center; }
.sec-head.c .lead { margin:.75rem auto 0; }

/* GRID */
.g-split { display:grid; grid-template-columns:1fr 1fr; gap:5%; align-items:center; }
.g-2 { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.g-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.g-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }

/* SEAM GRID */
.seam { display:grid; gap:1px; background:var(--bd); border:1px solid var(--bd); border-radius:var(--r-lg); overflow:hidden; }
.seam-2 { grid-template-columns:1fr 1fr; }
.seam-3 { grid-template-columns:repeat(3,1fr); }
.seam-4 { grid-template-columns:repeat(4,1fr); }
.seam-item { background:#fff; padding:1.75rem; transition:background var(--t); }
.seam-item:hover { background:var(--orange-pale); }
.seam-anth .seam-item { background:rgba(255,255,255,.05); }
.seam-anth .seam-item:hover { background:rgba(255,255,255,.1); }

.card { background:#fff; border:1px solid var(--bd); border-radius:var(--r-lg); padding:1.5rem; transition:box-shadow var(--t),border-color var(--t); }
.card:hover { box-shadow:0 4px 24px rgba(26,23,20,.08); border-color:var(--orange-bd); }

/* MODULE CARD */
.mod-icon { font-size:32px; margin-bottom:.75rem; }
.mod-badge { display:inline-block; font-size:12px; padding:3px 10px; border-radius:100px; background:var(--orange-pale); color:var(--orange); font-weight:700; letter-spacing:.5px; margin-bottom:.75rem; }
.mod-link { display:inline-flex; align-items:center; gap:5px; font-size:14px; font-weight:700; color:var(--orange); margin-top:.75rem; }
.mod-card { display:block; padding:1.5rem; background:#fff; border:1px solid var(--bd); border-radius:var(--r-lg); text-decoration:none; color:inherit; transition:all .2s ease; }
.mod-card:hover { border-color:var(--orange); box-shadow:0 8px 24px rgba(239,125,0,.08); transform:translateY(-2px); }
.mod-card h4 { color:var(--text); }
.mod-card p { color:var(--mid); }
.mod-card-badge { display:inline-block; font-size:12px; padding:3px 10px; border-radius:100px; background:var(--orange-pale); color:var(--orange); font-weight:700; letter-spacing:.5px; margin-bottom:.75rem; }

/* PAGE HERO */
.page-hero { background:var(--warm); padding:120px 5% 72px; border-bottom:1px solid var(--bd); }
.page-hero-anth { background:var(--anth); padding:120px 5% 72px; }
.page-hero-anth h1 { color:#fff; }
.page-hero-anth p { color:rgba(255,255,255,.75); }
.page-hero-anth .lbl { color:rgba(255,255,255,.5); }
.page-hero-anth .lbl::before { background:rgba(255,255,255,.3); }

/* MODUL HERO MIT BILD */
.mod-hero { position:relative; min-height:520px; display:flex; align-items:flex-end; overflow:hidden; padding:120px 5% 72px; }
.mod-hero-bg { position:absolute; inset:0; background-size:cover; background-position:center; background-repeat:no-repeat; z-index:0; filter:saturate(.85); }
.mod-hero-bg-solid { background:var(--anth); }
.mod-hero-tint { position:absolute; inset:0; background:linear-gradient(135deg, rgba(26,23,20,.72) 0%, rgba(26,23,20,.55) 45%, rgba(26,23,20,.85) 100%); z-index:1; }
.mod-hero-inner { position:relative; z-index:2; max-width:var(--cont); margin:0 auto; width:100%; }
.mod-hero-inner .bc { color:rgba(255,255,255,.6); margin-bottom:1.5rem; }
.mod-hero-inner .bc a { color:rgba(255,255,255,.65); }
.mod-hero-inner .bc a:hover { color:#fff; }
.mod-hero-inner .bc-sep { color:rgba(255,255,255,.3); }
.mod-hero-badge { display:inline-block; font-size:13px; font-weight:700; color:rgba(255,255,255,.6); letter-spacing:2px; text-transform:uppercase; margin-bottom:1rem; padding:4px 12px; border:1px solid rgba(255,255,255,.2); border-radius:100px; backdrop-filter:blur(4px); background:rgba(255,255,255,.04); }
.mod-hero-title { color:#fff; font-family:var(--fh); font-weight:400; font-size:clamp(32px, 5vw, 62px); letter-spacing:-1.5px; line-height:1.05; margin-bottom:1.25rem; max-width:820px; text-shadow:0 2px 20px rgba(0,0,0,.25); }
.mod-hero-sub { color:rgba(255,255,255,.9); font-size:clamp(15px,1.8vw,19px); line-height:1.6; max-width:680px; font-weight:400; text-shadow:0 1px 8px rgba(0,0,0,.3); }
@media (max-width:768px){ .mod-hero { min-height:420px; padding:90px 5% 48px; } }

/* DEEP-TEXT (Praxis-Erklärungen auf Modul-Seiten) */
.deep-text { font-size:18px; line-height:1.85; color:var(--mid); }
.deep-text p { margin-bottom:1.15rem; }
.deep-text p:last-child { margin-bottom:0; }
.deep-text strong { color:var(--text); font-weight:600; }

/* CTA */
.cta-sec { background:var(--orange); padding:72px 5%; text-align:center; position:relative; overflow:hidden; }
.cta-sec::before { content:''; position:absolute; top:-40%; left:-5%; width:40%; height:180%; background:rgba(255,255,255,.04); border-radius:50%; pointer-events:none; }
.cta-sec h2 { color:#fff; font-size:clamp(24px,3vw,40px); margin-bottom:1rem; }
.cta-sec p { color:rgba(255,255,255,.85); font-size:18px; max-width:480px; margin:0 auto 2rem; }
.cta-trust { display:flex; justify-content:center; gap:1.5rem; flex-wrap:wrap; margin-top:1.5rem; }
.cta-ti { display:flex; align-items:center; gap:6px; font-size:14px; color:rgba(255,255,255,.75); font-weight:500; }
.cta-check { width:18px; height:18px; border-radius:50%; border:1.5px solid rgba(255,255,255,.45); display:flex; align-items:center; justify-content:center; font-size:9px; color:#fff; flex-shrink:0; }

/* BREADCRUMB */
.bc { display:flex; align-items:center; gap:6px; font-size:14px; color:var(--light); margin-bottom:1.5rem; flex-wrap:wrap; }
.bc a { color:var(--light); }
.bc a:hover { color:var(--orange); }
.bc-sep { color:var(--bd); }

/* PROBLEM / FUNCTION ITEMS */
.prob-item { display:flex; gap:12px; align-items:flex-start; padding:16px 18px; border:1px solid var(--bd); border-radius:var(--r-md); background:#fff; margin-bottom:10px; }
.prob-arr { color:var(--orange); font-size:18px; flex-shrink:0; margin-top:2px; }
.fn-item { padding:16px 18px; border:1px solid var(--bd); border-radius:var(--r-md); background:#fff; margin-bottom:10px; }
.fn-title { font-size:16px; font-weight:700; color:var(--text); margin-bottom:4px; }
.fn-text { font-size:16px; color:var(--mid); line-height:1.6; }

/* TRUST GRID */
.trust-g { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--bd); border:1px solid var(--bd); border-radius:var(--r-lg); overflow:hidden; margin-bottom:2.5rem; }
.trust-c { background:#fff; padding:1.5rem; text-align:center; }
.trust-n { font-family:var(--font-h); font-size:32px; color:var(--text); letter-spacing:-1.5px; line-height:1; }
.trust-n em { color:var(--orange); font-style:normal; }
.trust-l { font-size:13px; color:var(--light); margin-top:4px; }
.zitat { font-family:var(--font-h); font-size:clamp(18px,2.5vw,26px); font-style:italic; color:var(--text); line-height:1.5; margin-bottom:1.25rem; }
.zitat-p { font-size:14px; font-weight:600; color:var(--mid); }

/* VORHER/NACHHER */
.vn { padding:1.5rem; border-radius:var(--r-lg); }
.vn-b { background:#FFF8F5; border:1px solid var(--orange-bd); }
.vn-a { background:#F0FAF4; border:1px solid #A8D5B5; }
.vn-h { font-size:14px; font-weight:700; margin-bottom:1rem; display:flex; align-items:center; gap:8px; }
.vn-row { display:flex; gap:8px; align-items:flex-start; padding:6px 0; font-size:14px; border-bottom:1px solid rgba(0,0,0,.05); }
.vn-row:last-child { border-bottom:none; }

/* ERGEBNIS */
.erg-check { width:44px; height:44px; border-radius:50%; background:var(--orange-pale); border:2px solid var(--orange-bd); display:flex; align-items:center; justify-content:center; margin:0 auto 1rem; color:var(--orange); font-size:16px; font-weight:700; }

/* FORM */
.frow { margin-bottom:16px; }
.frow-2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:16px; }
.flabel { display:block; font-size:14px; font-weight:700; margin-bottom:5px; color:var(--text); }
.finput, .fselect, .ftextarea { width:100%; padding:11px 14px; border:1.5px solid var(--bd); border-radius:var(--r-md); font-size:14px; color:var(--text); background:#fff; transition:border-color var(--t); appearance:none; }
.finput:focus, .fselect:focus, .ftextarea:focus { outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(239,125,0,.1); }
.ftextarea { resize:vertical; min-height:100px; }

/* FOOTER */
.gfooter { background:#1A1714; padding:64px 5% 32px; }
.footer-grid { max-width:var(--cont); margin:0 auto; display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:3rem; margin-bottom:3rem; }
.footer-logo { font-family:var(--font-h); font-size:22px; color:#fff; display:block; margin-bottom:1rem; line-height:1; }
.footer-logo em { color:var(--orange); font-style:italic; }
.footer-logo-img { display:block; width:auto; height:44px; max-height:44px; max-width:220px; object-fit:contain; }
.footer-logo .custom-logo { display:block; width:auto; height:44px; max-height:44px; max-width:220px; object-fit:contain; filter:brightness(0) invert(1); opacity:.92; }
.footer-tag { font-size:14px; color:rgba(255,255,255,.4); line-height:1.6; }
.footer-col h4 { font-size:13px; font-weight:700; color:rgba(255,255,255,.35); letter-spacing:1.5px; text-transform:uppercase; margin-bottom:1rem; font-family:var(--font-b); }
.footer-col a { display:block; font-size:14px; color:rgba(255,255,255,.55); margin-bottom:.5rem; transition:color var(--t); }
.footer-col a:hover { color:#fff; }
.footer-bot { max-width:var(--cont); margin:0 auto; border-top:1px solid rgba(255,255,255,.07); padding-top:1.5rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }
.footer-copy { font-size:14px; color:rgba(255,255,255,.3); }
.footer-contact a { color:var(--orange); }

/* CONTENT AREA */
.content { max-width:760px; margin:0 auto; padding:80px 5%; }
.content h1,.content h2,.content h3 { margin-bottom:1rem; margin-top:2rem; }
.content p { margin-bottom:1rem; }
.content ul { list-style:disc; padding-left:1.5rem; margin-bottom:1rem; }
.content li { margin-bottom:.5rem; color:var(--mid); }

/* 404 */
.num-big { font-family:var(--font-h); font-size:clamp(80px,15vw,160px); font-weight:300; color:var(--bd); letter-spacing:-8px; line-height:1; }

/* RESPONSIVE */
@media(max-width:1024px) { .footer-grid { grid-template-columns:1fr 1fr; gap:2rem; } }
@media(max-width:768px) {
    .nav-links { display:none; }
    .nav-burger { display:flex; }
    .hero { grid-template-columns:1fr; padding:100px 5% 60px; min-height:auto; gap:2rem; }
    .hero-kpi { grid-template-columns:1fr; }
    .hero-img { max-height:300px; }
    .hero-img img { height:300px; object-fit:cover; }
    .sec-head { grid-template-columns:1fr; gap:1.5rem; }
    .g-split { grid-template-columns:1fr; gap:2rem; }
    .g-2,.g-3,.g-4 { grid-template-columns:1fr; }
    .seam-3,.seam-4 { grid-template-columns:1fr; }
    .seam-2 { grid-template-columns:1fr; }
    .trust-g { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr; gap:2rem; }
    .frow-2 { grid-template-columns:1fr; }
    .sec { padding:56px 5%; }
    .btn-group { flex-direction:column; }
    .btn-group .btn-p,.btn-group .btn-s { width:100%; justify-content:center; }
    .cta-trust { flex-direction:column; align-items:center; gap:.75rem; }
}
@media(max-width:480px) { .seam-2 { grid-template-columns:1fr; } }

/* ══ 360°-TOUR IFRAME (Über-uns-Seite) ══════════════════════════════ */
.tour-wrap {
    position: relative;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    aspect-ratio: 16 / 9;
    border-radius: var(--r-lg);
    overflow: hidden;
    box-shadow: 0 20px 60px -20px rgba(26,23,20,.35), 0 8px 24px -12px rgba(26,23,20,.2);
    background: var(--anth);
}
.tour-wrap iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}
@media (max-width:768px) {
    .tour-wrap { aspect-ratio: 4 / 3; border-radius: var(--r-md); }
}

/* Label-Variante auf dunklem Hintergrund */
.lbl-w { color: rgba(255,255,255,.6); }
.lbl-w::before { background: rgba(255,255,255,.3); }

/* ══ MODULE-OVERVIEW TEMPLATE ═════════════════════════════════════════ */

/* Kennzahlen-Strip */
.overview-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}
.overview-stat {
    text-align: center;
    padding: 1.25rem .5rem;
    background: #fff;
    border: 1px solid var(--bd);
    border-radius: var(--r-md);
}
.overview-stat-n {
    font-family: var(--fh);
    font-size: clamp(32px, 4.5vw, 52px);
    font-weight: 400;
    color: var(--text);
    letter-spacing: -1.5px;
    line-height: 1;
}
.overview-stat-l {
    font-size:13px;
    color: var(--light);
    letter-spacing: .5px;
    text-transform: uppercase;
    margin-top: .5rem;
}
@media (max-width:768px) {
    .overview-stats { grid-template-columns: repeat(2, 1fr); }
}

/* Kategorien-Navigation (Sprungmarken) */
.overview-nav {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: .75rem;
    padding: 1.5rem;
    background: var(--warm);
    border: 1px solid var(--bd);
    border-radius: var(--r-lg);
}
.overview-nav-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: .85rem;
    border: 1px solid transparent;
    border-radius: var(--r-md);
    text-decoration: none;
    transition: all .2s;
    background: #fff;
}
.overview-nav-item:hover {
    border-color: var(--orange);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(239,125,0,.1);
}
.overview-nav-n {
    font-family: var(--fh);
    font-size:15px;
    color: var(--orange);
    font-weight: 500;
}
.overview-nav-t {
    font-size: 16px;
    color: var(--text);
    font-weight: 600;
    line-height: 1.3;
}
.overview-nav-c {
    font-size:14px;
    color: var(--light);
    margin-top: 3px;
}
@media (max-width:900px) {
    .overview-nav { grid-template-columns: repeat(2, 1fr); padding: 1rem; }
}

/* Kategorie-Block */
.overview-cat {
    scroll-margin-top: 80px; /* damit Ankerlinks nicht unterm Sticky-Header landen */
}
.overview-cat-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;
    padding-bottom: 1.25rem;
    border-bottom: 2px solid var(--bd);
    margin-bottom: 2rem;
}
.overview-cat-num {
    font-size:13px;
    font-weight: 700;
    color: var(--orange);
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: .25rem;
}
.overview-cat-title {
    font-size: clamp(28px, 4vw, 44px);
    margin-bottom: .4rem;
}
.overview-cat-desc {
    color: var(--mid);
    font-size: 17px;
    margin: 0;
    max-width: 580px;
    line-height: 1.6;
}
.overview-cat-meta {
    text-align: right;
    flex-shrink: 0;
}
.overview-cat-count {
    display: block;
    font-family: var(--fh);
    font-size: 52px;
    font-weight: 400;
    color: var(--orange);
    line-height: 1;
    letter-spacing: -2px;
}
.overview-cat-label {
    font-size:13px;
    color: var(--light);
    letter-spacing: .5px;
    text-transform: uppercase;
}
@media (max-width:768px) {
    .overview-cat-head { flex-direction: column; align-items: flex-start; gap: 1rem; }
    .overview-cat-meta { text-align: left; }
}

/* Modul-Karten in der Übersicht */
.overview-mods {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}
.overview-mod {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--bd);
    border-radius: var(--r-lg);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: all .25s ease;
}
.overview-mod:hover {
    border-color: var(--orange);
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(26,23,20,.1);
}
.overview-mod-img {
    position: relative;
    width: 100%;
    height: 160px;
    background-size: cover;
    background-position: center;
    background-color: var(--warm);
}
.overview-mod-img::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 0%, transparent 60%, rgba(26,23,20,.3) 100%);
}
.overview-mod-icon {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    z-index: 1;
}
.overview-mod-body {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.overview-mod-badge {
    display: inline-block;
    font-size:14px;
    font-weight: 700;
    color: var(--orange);
    background: var(--orange-pale);
    padding: 5px 13px;
    border-radius: 100px;
    letter-spacing: .5px;
    margin-bottom: .85rem;
    align-self: flex-start;
}
.overview-mod-title {
    font-size: 24px;
    color: var(--text);
    margin-bottom: .7rem;
    letter-spacing: -.5px;
    line-height: 1.25;
}
.overview-mod-text {
    font-size:17px;
    color: var(--mid);
    line-height: 1.65;
    margin-bottom: 1.1rem;
}
.overview-mod-fns {
    list-style: none;
    padding: 0;
    margin: 0 0 1.1rem 0;
    display: grid;
    gap: 8px;
}
.overview-mod-fns li {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size:16px;
    color: var(--mid);
    line-height: 1.5;
}
.overview-mod-fns li span {
    color: var(--orange);
    font-weight: 700;
    flex-shrink: 0;
}
.overview-mod-link {
    margin-top: auto;
    font-size:16px;
    font-weight: 700;
    color: var(--orange);
    letter-spacing: .3px;
    padding-top: .95rem;
    border-top: 1px solid var(--bd);
}
@media (max-width:900px) {
    .overview-mods { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:640px) {
    .overview-mods { grid-template-columns: 1fr; }
}

/* ══ LEGAL-SEITEN (Impressum, Datenschutz) ═══════════════════════════ */

.legal-hero {
    background: linear-gradient(135deg, var(--warm) 0%, var(--cream) 100%);
    padding: 110px 5% 60px;
    border-bottom: 1px solid var(--bd);
}
.legal-hero-inner {
    max-width: var(--cont);
    margin: 0 auto;
}
.legal-hero h1 {
    font-size: clamp(36px, 5vw, 56px);
    margin-top: .5rem;
    letter-spacing: -1px;
}

.legal-content {
    max-width: 820px;
    margin: 0 auto;
}
.legal-content h2 {
    font-size: 24px;
    color: var(--text);
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    padding-bottom: .5rem;
    border-bottom: 2px solid var(--bd);
    scroll-margin-top: 80px;
}
.legal-content h2:first-child {
    margin-top: 0;
}
.legal-block {
    margin-bottom: 1.25rem;
}
.legal-block p {
    font-size: 16px;
    line-height: 1.75;
    color: var(--mid);
    margin-bottom: .75rem;
}
.legal-block p strong {
    color: var(--text);
    font-weight: 600;
}
.legal-block p em {
    color: var(--light);
    font-style: italic;
}
.legal-block a {
    color: var(--orange);
    font-weight: 500;
    border-bottom: 1px solid transparent;
    transition: border-color var(--t);
}
.legal-block a:hover {
    border-bottom-color: var(--orange);
}

/* Aufzählungen in Legal-Seiten */
.legal-list {
    margin: .5rem 0 1rem 0;
    padding-left: 0;
    list-style: none;
}
.legal-list li {
    position: relative;
    padding-left: 1.5rem;
    margin-bottom: .6rem;
    font-size: 16px;
    line-height: 1.7;
    color: var(--mid);
}
.legal-list li::before {
    content: '›';
    position: absolute;
    left: 0;
    top: -1px;
    color: var(--orange);
    font-weight: 700;
    font-size: 18px;
}
.legal-list li strong {
    color: var(--text);
    font-weight: 600;
}

/* Inhaltsverzeichnis (Datenschutz) */
.legal-toc {
    background: var(--warm);
    border-left: 3px solid var(--orange);
    padding: 1.5rem 1.75rem;
    border-radius: var(--r-md);
    margin-bottom: 1rem;
}
.legal-toc h3 {
    font-family: var(--font-b);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--orange);
    margin-bottom: .85rem;
}
.legal-toc ol {
    list-style: decimal inside;
    columns: 2;
    column-gap: 2rem;
    margin: 0;
}
.legal-toc ol li {
    padding: 3px 0;
    font-size: 14px;
    break-inside: avoid;
}
.legal-toc ol li a {
    color: var(--mid);
    text-decoration: none;
    transition: color var(--t);
}
.legal-toc ol li a:hover {
    color: var(--orange);
}
@media (max-width:600px) {
    .legal-toc ol { columns: 1; }
}

/* Footnote */
.legal-footnote {
    margin-top: 2.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--bd);
    font-size: 13px;
    color: var(--light);
    line-height: 1.7;
    font-style: italic;
}


/* ══════════════════════════════════════════════════════════════════════
   DEMO-FORMULAR – ruhig, professionell, Stripe/Linear-Stil
   ══════════════════════════════════════════════════════════════════════ */

/* Container */
.demo-form-box {
    background: #fff;
    border: 1px solid var(--bd);
    border-radius: 16px;
    padding: 2.25rem 2.25rem 2rem;
}
.demo-form-box-head {
    margin-bottom: 1.75rem;
}
.demo-form-title {
    font-family: var(--font-h);
    font-size: 28px;
    font-weight: 500;
    line-height: 1.15;
    letter-spacing: -0.5px;
    color: var(--text);
    margin-bottom: 0.4rem;
}
.demo-form-sub {
    font-size: 15px;
    line-height: 1.55;
    color: var(--mid);
    margin: 0;
}

/* Grid für 2-spaltige Felder */
.form-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 14px;
}
@media (max-width: 600px) {
    .form-grid-2 { grid-template-columns: 1fr; }
}

/* Einzelnes Feld */
.form-field {
    margin-bottom: 14px;
    position: relative;
}
.form-field:last-of-type {
    margin-bottom: 18px;
}

/* Label */
.form-field label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: var(--text);
    margin-bottom: 6px;
    letter-spacing: 0.1px;
}
.form-optional-label {
    color: var(--light);
    font-weight: 400;
    font-size: 12px;
}

/* Input, Select, Textarea – einheitlich */
.demo-form input[type="text"],
.demo-form input[type="email"],
.demo-form input[type="tel"],
.demo-form select,
.demo-form textarea {
    width: 100%;
    font-family: var(--font-b);
    font-size: 15px;
    color: var(--text);
    background: #fff;
    border: 1px solid #D6D2CB;
    border-radius: 8px;
    padding: 10px 12px;
    line-height: 1.4;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
}
.demo-form input::placeholder,
.demo-form textarea::placeholder {
    color: #A8A39B;
    opacity: 1;
}
.demo-form input:hover,
.demo-form select:hover,
.demo-form textarea:hover {
    border-color: #B8B3AB;
}
.demo-form input:focus,
.demo-form select:focus,
.demo-form textarea:focus {
    border-color: var(--orange);
    box-shadow: 0 0 0 3px rgba(239,125,0, 0.12);
}

.demo-form textarea {
    min-height: 96px;
    resize: vertical;
    line-height: 1.55;
}

/* Select mit dezentem Dropdown-Pfeil */
.demo-form select {
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%235C5650' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 36px;
    cursor: pointer;
}

/* Fehler-Meldung */
.form-error-msg {
    background: #FEF2F0;
    border: 1px solid #FBCFC6;
    color: #A33012;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 14px;
}

/* Submit-Button */
.form-submit {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--text);
    color: #fff;
    font-family: var(--font-b);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.1px;
    padding: 13px 24px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.08s ease;
    margin-top: 6px;
}
.form-submit:hover {
    background: #000;
}
.form-submit:active {
    transform: scale(0.99);
}
.form-submit:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Legal-Hinweis unter dem Button */
.form-legal {
    font-size: 12.5px;
    line-height: 1.55;
    color: var(--light);
    text-align: center;
    margin: 14px 0 0 0;
}
.form-legal a {
    color: var(--mid);
    text-decoration: underline;
    text-decoration-color: #D6D2CB;
    text-underline-offset: 2px;
}
.form-legal a:hover {
    color: var(--orange);
    text-decoration-color: var(--orange);
}

/* Erfolgs-State */
.form-success-inner {
    text-align: center;
    padding: 2rem 1rem 0.5rem;
}
.form-success-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #E8F5E8;
    color: #2E7D32;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 600;
    margin: 0 auto 1.25rem;
}
.form-success-title {
    font-family: var(--font-h);
    font-size: 26px;
    font-weight: 500;
    letter-spacing: -0.3px;
    color: var(--text);
    margin-bottom: 0.5rem;
}
.form-success-text {
    font-size: 15px;
    color: var(--mid);
    line-height: 1.6;
    max-width: 360px;
    margin: 0 auto 1.25rem;
}
.form-success-phone {
    font-size: 14px;
    color: var(--light);
    margin: 0;
}
.form-success-phone a {
    color: var(--orange);
    font-weight: 500;
    text-decoration: none;
}
.form-success-phone a:hover {
    text-decoration: underline;
}

/* Mobile */
@media (max-width: 768px) {
    .demo-form-box {
        padding: 1.5rem 1.25rem 1.25rem;
    }
    .demo-form-title {
        font-size: 24px;
    }
}

/* ══════════════════════════════════════════════════════════════════════
   SUPPORT-MENÜ-LINK (Header-Nav)
   ══════════════════════════════════════════════════════════════════════ */
.nav-links .nav-support,
.nav-links a.nav-support {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 16px;
    font-size: 15px;
    font-weight: 600;
    color: rgba(255,255,255,.9);
    background: rgba(255,255,255,.06);
    border: 1.5px solid rgba(255,255,255,.15);
    border-radius: 100px;
    transition: all .18s ease;
}
.nav-links .nav-support:hover,
.nav-links a.nav-support:hover {
    border-color: var(--orange);
    background: rgba(239,125,0,.15);
    color: #fff;
}
.nav-support-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #2EC96B;
    box-shadow: 0 0 0 0 rgba(46, 201, 107, .6);
    animation: nav-support-pulse 2s ease-out infinite;
    flex-shrink: 0;
}
@keyframes nav-support-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(46, 201, 107, .6); }
    70%  { box-shadow: 0 0 0 8px rgba(46, 201, 107, 0); }
    100% { box-shadow: 0 0 0 0 rgba(46, 201, 107, 0); }
}
/* Falls Support-Link als WP-Menüpunkt mit nav-support Klasse: Dot davor */
.nav-links li.nav-support > a::before,
.nav-links li.menu-item-nav-support > a::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #2EC96B;
    margin-right: 7px;
    vertical-align: middle;
    animation: nav-support-pulse 2s ease-out infinite;
}

/* ══════════════════════════════════════════════════════════════════════
   SUPPORT-SEITE
   ══════════════════════════════════════════════════════════════════════ */

/* Download-Karte */
.support-download-card {
    background: linear-gradient(135deg, #fff 0%, var(--warm2) 100%);
    border: 2px solid var(--orange);
    border-radius: var(--r-xl);
    padding: 2.5rem;
    box-shadow: 0 20px 60px -24px rgba(239,125,0, .2), 0 8px 24px -12px rgba(26, 23, 20, .08);
}
.support-download-left {
    display: flex;
    align-items: flex-start;
    gap: 1.75rem;
}
.support-tv-logo {
    flex-shrink: 0;
    width: 72px;
    height: 72px;
    border-radius: var(--r-md);
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--bd);
    box-shadow: 0 4px 12px rgba(0, 70, 128, .08);
}
.support-tv-logo svg { width: 40px; height: 40px; }
.support-download-title {
    font-size: clamp(26px, 3vw, 36px);
    line-height: 1.15;
    margin: .5rem 0 .85rem;
    letter-spacing: -.5px;
}
.support-download-desc {
    font-size: 16px;
    color: var(--mid);
    line-height: 1.65;
    margin-bottom: 1.5rem;
    max-width: 560px;
}
.support-download-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--orange);
    color: #fff !important;
    font-size: 17px;
    font-weight: 700;
    padding: 16px 32px;
    border-radius: 100px;
    box-shadow: 0 6px 24px rgba(239,125,0, .32);
    transition: all .2s ease;
    letter-spacing: .2px;
}
.support-download-btn:hover {
    background: var(--orange-h);
    transform: translateY(-2px);
    box-shadow: 0 10px 32px rgba(239,125,0, .4);
}
.support-download-btn svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}
.support-download-hint {
    margin-top: .85rem;
    font-size: 13px;
    color: var(--light);
}
@media (max-width: 640px) {
    .support-download-card { padding: 1.75rem 1.25rem; }
    .support-download-left { flex-direction: column; gap: 1rem; }
    .support-download-btn { width: 100%; justify-content: center; }
}

/* Schritt-für-Schritt Grid */
.support-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 2rem;
}
.support-step {
    background: #fff;
    border: 1px solid var(--bd);
    border-radius: var(--r-lg);
    padding: 1.75rem;
    position: relative;
}
.support-step-num {
    font-family: var(--font-h);
    font-size: 44px;
    font-weight: 400;
    color: var(--orange);
    line-height: 1;
    letter-spacing: -1.5px;
    margin-bottom: .75rem;
}
.support-step-title {
    font-size: 21px;
    margin-bottom: .75rem;
    letter-spacing: -.3px;
}
.support-step-text {
    font-size: 16px;
    line-height: 1.65;
    color: var(--mid);
    margin: 0;
}
@media (max-width: 820px) {
    .support-steps { grid-template-columns: 1fr; gap: 1rem; }
}

/* Sicherheits-Cards im Anthrazit-Bereich */
.support-security-item {
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: var(--r-md);
    padding: 1.5rem 1.25rem;
    transition: background .2s ease;
}
.support-security-item:hover {
    background: rgba(255, 255, 255, .1);
}
.support-security-icon {
    font-size: 28px;
    margin-bottom: .85rem;
    line-height: 1;
}
.support-security-item h4 {
    color: #fff;
    font-size: 17px;
    margin-bottom: .5rem;
    letter-spacing: -.2px;
}
.support-security-item p {
    color: rgba(255, 255, 255, .7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
}