/* ===== V4-Design (15.10.2026, Farben „GeoStars Alternative 2“) – vorher V3-Design (13.10.2026) – nur Optik, Texte unverändert. Gilt, wenn <main class="v3h"> ===== */
body:has(main:is(.v3h,.v3full)){--bg:#FFFFFF;--bg-white:#FFFFFF;--bg-dark:#1F1E1D;--text:#1F1E1D;--text-2:#666262;--text-3:#666262;--text-hell:#C0BDBC;--text-4:#4A4646;--text-light:#EEEBEB;--accent:#D10000;--green:#2F7346;--red:#B8BDCC;--border:#E1DEDD;--font:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:#FFFFFF;color:#1F1E1D;font-variant-numeric:tabular-nums}
body:has(main:is(.v3h,.v3full)) .topbar{background:#141A2A;color:#B8BDCC}
body:has(main:is(.v3h,.v3full)) .nav{background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(10px);border-bottom-color:#E1DEDD}
body:has(main:is(.v3h,.v3full)) .nav-links > a,body:has(main:is(.v3h,.v3full)) .nav-drop > a{color:#4A4646}
body:has(main:is(.v3h,.v3full)) .nav a[class*="btn"],body:has(main:is(.v3h,.v3full)) .nav .nav-cta{border-radius:10px!important;background:#1F1E1D}
main.v3h a:focus-visible,main.v3h button:focus-visible,main.v3h input:focus-visible{outline:2px solid #D10000;outline-offset:2px}
/* Abschnitte */
main.v3h .section{padding:clamp(72px,9vw,120px) 0!important;background:#FFFFFF!important;border-top:0!important;border-bottom:1px solid #F4F2F1!important}
main.v3h .section-sm{background:#FFFFFF;border-bottom:1px solid #F4F2F1}
main.v3h .wrap{padding:0 24px}
main.v3h .s-head,main.v3h .s-head.center{text-align:left!important;display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:48px}
main.v3h .s-head .label,main.v3h .label{font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:#49536E;display:inline-flex;align-items:center;gap:8px;margin:0}
main.v3h .s-head .label::before,main.v3h .label::before{content:"";width:7px;height:7px;border-radius:2px;background:#49536E;flex:none}
main.v3h .sh2{font-size:clamp(28px,3.5vw,42px)!important;font-weight:600;letter-spacing:-.025em;line-height:1.14;color:#1F1E1D;max-width:26ch;margin:0;text-wrap:balance}
main.v3h .sh2 em{font-style:normal;color:#666262}
main.v3h .sh2 .br{display:inline}
main.v3h .s-sub{font-size:16px;color:#4A4646;line-height:1.65;max-width:62ch;margin:0!important}
main.v3h h3{letter-spacing:-.01em}
/* Karten */
main.v3h .card{background:#FFFFFF;border:1px solid #E1DEDD;border-radius:14px;box-shadow:none;padding:24px}
main.v3h .card:hover{box-shadow:none;border-color:#D7D4D3}
main.v3h .card h3{font-size:17px;font-weight:600;color:#1F1E1D}
main.v3h .card p{color:#4A4646;font-size:14.5px;line-height:1.6}
main.v3h .card-icon{width:32px;height:32px;border-radius:9px;background:#F4F2F1;color:#49536E;display:grid;place-items:center;font-size:16px}
main.v3h .toolcard{border-color:#E1DEDD;border-radius:16px;background:#FFFFFF}
main.v3h .toolcard h3{font-weight:600;letter-spacing:-.02em}
main.v3h .frag-frame{border-color:#E1DEDD;border-radius:12px}
/* Knöpfe */
main.v3h .btn-primary-hero,main.v3h .btn-accent{border-radius:10px!important;background:#1F1E1D!important;color:#FFFFFF!important;border:1px solid #1F1E1D!important;font-weight:500;padding:12px 20px}
main.v3h .btn-primary-hero:hover,main.v3h .btn-accent:hover{background:#4A4646!important;opacity:1}
main.v3h .btn-outline-hero{border-radius:10px;border:1px solid #E1DEDD;color:#1F1E1D;background:#FFFFFF;font-weight:500;padding:12px 20px}
main.v3h .btn-outline-hero:hover{border-color:#D7D4D3}
/* Hero */
main.v3h .hero{background:linear-gradient(180deg,#F8F6F5 0%,#FFFFFF 78%)!important;padding:clamp(64px,8vw,104px) 0 40px!important;border-bottom:0;text-align:center}
main.v3h .hero-2col{display:block}
main.v3h .hero-right{display:none}
main.v3h .hero-left{display:flex;flex-direction:column;align-items:center;max-width:none}
main.v3h .hero h1{font-size:clamp(40px,6.2vw,76px)!important;font-weight:600;letter-spacing:-.035em!important;line-height:1.02;max-width:none;margin:24px auto 22px;text-wrap:balance}
main.v3h .hero-sub{margin:0 auto 28px;color:#4A4646;max-width:640px;font-size:18px}
main.v3h .hero-sub strong{color:#1F1E1D}
main.v3h .hero-btns{justify-content:center}
main.v3h .hero-badge{background:#FFFFFF;border:1px solid #E1DEDD;border-radius:999px;color:#1F1E1D;font-weight:500;font-size:13px;padding:5px 14px 5px 5px;gap:8px;box-shadow:0 1px 2px rgba(31,30,29,.04)}
main.v3h .hero-check{margin-left:auto!important;margin-right:auto!important;justify-content:center}
main.v3h .hero-check input{border-radius:10px!important;border-color:#E1DEDD!important}
main.v3h .hero-check button{border-radius:10px!important;background:#1F1E1D!important;font-weight:500!important}
main.v3h .hero-trust{justify-content:center;color:#666262}
main.v3h .trust-pill{color:#666262}
main.v3h .hero .spot,main.v3h .cta-spots{display:none}
/* Domain-Band, Zahlen, Plattform-Leiste */
main.v3h section.section-sm[style*="bg-dark"]{background:#1F1E1D!important}
main.v3h section.section-sm[style*="bg-dark"] input{border-radius:10px!important}
main.v3h section.section-sm[style*="bg-dark"] button{border-radius:10px!important}
main.v3h .proof-bar{background:#FFFFFF!important;border-color:#F4F2F1!important}
main.v3h .proof-bar [style*="font-size"]{color:#1F1E1D}
main.v3h .logos-strip{background:#FFFFFF;border-bottom:1px solid #F4F2F1}
main.v3h .logos-label{color:#666262;letter-spacing:.08em}
main.v3h .logo-chip{border-radius:999px;border-color:#E1DEDD;color:#1F1E1D;font-weight:500;background:#FFFFFF}
/* Tabellen */
main.v3h .t-wrap{border-color:#E1DEDD;border-radius:14px}
main.v3h .cmp-table th{background:#FBF8F8;color:#666262;font-weight:600;border-bottom-color:#E1DEDD}
main.v3h .cmp-table th.hl{background:#F4F2F1;color:#1F1E1D}
main.v3h .cmp-table td{border-bottom-color:#F4F2F1;color:#4A4646}
main.v3h .cmp-table td.hl{background:#FBF8F8;color:#1F1E1D}
/* Schritte */
main.v3h .steps{gap:32px}
main.v3h .steps::before{top:13px;background:#D7D4D3}
main.v3h .step{text-align:left;padding:0}
main.v3h .step-num{width:28px;height:28px;margin:0 0 16px;border:1.5px solid #49536E;color:#49536E;font-size:12px;font-weight:600;background:#FFFFFF}
main.v3h .step h3{font-size:16px;font-weight:600}
main.v3h .step p{color:#4A4646;font-size:14.5px}
/* Listen, Vorher/Nachher */
main.v3h .feat-list{gap:0}
main.v3h .feat-list li{padding:11px 0;border-top:1px solid #F4F2F1;color:#4A4646}
main.v3h .feat-list li:first-child{border-top:0}
main.v3h .card[style*="var(--red)"]{border-left:1px solid #E1DEDD!important}
main.v3h .card[style*="var(--green)"]{border-left:1px solid #E1DEDD!important;background:#FBF8F8}
/* Blog als Listenzeilen */
main.v3h .blog-grid{display:flex;flex-direction:column;gap:0;border-bottom:1px solid #E1DEDD}
main.v3h .blog-card{display:grid;grid-template-columns:140px minmax(0,1fr) 190px;column-gap:24px;row-gap:4px;align-items:baseline;background:none;border:0;border-top:1px solid #E1DEDD;border-radius:0;padding:22px 0}
main.v3h .blog-card:hover{box-shadow:none}
main.v3h .blog-card:hover h3{text-decoration:underline;text-underline-offset:4px;text-decoration-color:#D7D4D3}
main.v3h .blog-card-cat{grid-column:1;grid-row:1 / span 2;margin:0;color:#D10000;text-transform:none;letter-spacing:0;font-size:13px;font-weight:500}
main.v3h .blog-card h3{grid-column:2;margin:0;font-size:16px;font-weight:600;color:#1F1E1D}
main.v3h .blog-card p{grid-column:2;margin:0;color:#4A4646;font-size:14.5px}
main.v3h .blog-card-meta{grid-column:3;grid-row:1 / span 2;margin:0;color:#666262;font-size:13px}
@media (max-width:900px){main.v3h .blog-card{grid-template-columns:1fr}main.v3h .blog-card-cat,main.v3h .blog-card h3,main.v3h .blog-card p,main.v3h .blog-card-meta{grid-column:1;grid-row:auto}}
/* FAQ zweispaltig */
main.v3h #faq .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:48px;align-items:start}
main.v3h #faq .s-head{position:sticky;top:96px;margin:0}
main.v3h #faq .wrap > div[style]{max-width:none!important;margin:0!important;border-top:1px solid #E1DEDD}
main.v3h .faq-item{border-bottom:1px solid #E1DEDD}
main.v3h .faq-btn{padding:20px 0;font-size:16.5px;font-weight:600;color:#1F1E1D;font-family:inherit}
main.v3h .faq-btn .ico{width:30px;height:30px;border-radius:8px;border:1px solid #E1DEDD;display:grid;place-items:center;color:#4A4646;font-size:17px}
main.v3h .faq-ans{color:#4A4646;font-size:15.5px;line-height:1.7}
@media (max-width:900px){main.v3h #faq .wrap{grid-template-columns:1fr}main.v3h #faq .s-head{position:static}}
/* Fließtext */
main.v3h .prose p{color:#4A4646}
main.v3h .prose h3{font-weight:600}
/* Abschluss-CTA hell */
main.v3h .cta-dark{background:#FFFFFF!important;border-top:1px solid #E1DEDD}
main.v3h .cta-dark h2{color:#1F1E1D!important;font-weight:600;letter-spacing:-.03em}
main.v3h .cta-dark p{color:#4A4646!important}
main.v3h .cta-dark a[style]{color:#1F1E1D!important;border-color:#E1DEDD!important;border-radius:10px!important;background:#FFFFFF}
main.v3h .cta-props span{color:#4A4646}
/* Footer */
body:has(main:is(.v3h,.v3full)) .footer{background:#FFFFFF;border-top-color:#E1DEDD}
body:has(main:is(.v3h,.v3full)) .footer-col h3{color:#666262;letter-spacing:.08em}
body:has(main:is(.v3h,.v3full)) .footer a{color:#4A4646}
body:has(main:is(.v3h,.v3full)) .footer a:hover{color:#1F1E1D}
/* Feinschliff je Abschnitt */
body:has(main:is(.v3h,.v3full)) .nav .btn-ghost{background:none!important;color:#4A4646!important;border:0!important}
body:has(main:is(.v3h,.v3full)) .nav .btn-dark{border-radius:10px!important;background:#1F1E1D!important}
main.v3h .hero svg.spot,main.v3h .hero .gs-star{display:none}
main.v3h [data-v3="kennzahlen"] .card{border:0;border-top:1px solid #E1DEDD;border-radius:0;padding:20px 0 0;background:none}
main.v3h [data-v3="kennzahlen"] .card-icon{display:inline-grid;margin:0 10px 0 0;vertical-align:middle;width:28px;height:28px}
main.v3h [data-v3="kennzahlen"] .card h3{display:inline;font-size:16px}
main.v3h [data-v3="kennzahlen"] .card p{margin-top:10px}
main.v3h [data-v3="kennzahlen"] .g3{gap:28px 40px}
main.v3h [data-v3="ergebnis"] .wrap{max-width:1200px!important}
main.v3h [data-v3="ergebnis"] .card{border:0;padding:0!important;background:none}
main.v3h [data-v3="ergebnis"] .card > div > div:not([style*="flex:1"]) > div:first-child{font-family:Manrope,Inter,ui-sans-serif,sans-serif;font-size:clamp(56px,7vw,92px)!important;font-weight:800!important;letter-spacing:-.04em;line-height:1;color:#1F1E1D}
main.v3h [data-v3="ergebnis"] .card > div > div:first-child > div:first-child{color:#D10000}
main.v3h [data-v3="ergebnis"] .card > div{gap:48px!important}
main.v3h [data-v3="ergebnis"] .card p{font-size:15.5px;color:#4A4646;line-height:1.65}
main.v3h [data-v3="vorher"] .card{border:0!important;background:none!important;padding:0}
main.v3h [data-v3="vorher"] .card h3{font-size:13px;font-weight:600;color:#666262;padding-bottom:12px;border-bottom:1px solid #E1DEDD;margin-bottom:0!important}
main.v3h [data-v3="vorher"] .feat-list li:first-child{border-top:0}
main.v3h [data-v3="vorher"] .g2{gap:48px}
main.v3h [data-v3="team"] .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:0 64px;align-items:start}
main.v3h [data-v3="team"] figure{grid-column:1;grid-row:1 / span 3;margin:0!important;position:sticky;top:96px}
main.v3h [data-v3="team"] figure img{aspect-ratio:4/3;object-fit:cover;border-radius:16px!important}
main.v3h [data-v3="team"] figcaption{text-align:left!important}
main.v3h [data-v3="team"] .s-head,main.v3h [data-v3="team"] .g2,main.v3h [data-v3="team"] .wrap > p{grid-column:2}
main.v3h [data-v3="team"] .s-head{margin-bottom:24px}
main.v3h [data-v3="team"] .g2{grid-template-columns:1fr;gap:0}
main.v3h [data-v3="team"] .g2 .card{border:0;border-top:1px solid #F4F2F1;border-radius:0;padding:18px 0;background:none}
main.v3h [data-v3="team"] .g2 .card-icon{display:none}
main.v3h [data-v3="team"] .wrap > p{text-align:left!important}
@media (max-width:900px){main.v3h [data-v3="team"] .wrap{grid-template-columns:1fr}main.v3h [data-v3="team"] figure,main.v3h [data-v3="team"] .s-head,main.v3h [data-v3="team"] .g2,main.v3h [data-v3="team"] .wrap > p{grid-column:1;grid-row:auto;position:static}}
main.v3h [data-v3="methodik"] .prose{max-width:860px;margin:0}
main.v3h [data-v3="methodik"] .prose h3{font-size:18px;color:#1F1E1D}
main.v3h [data-v3="schritte"] .wrap > div[style*="text-align:center"]{text-align:left!important}
main.v3h [data-v3="vorher"] .wrap > div[style*="text-align:center"]{text-align:left!important}
/* ===== Mobil 360–430 px (14.10.2026, Kundenfeedback) ===== */
@media (max-width:600px){
 /* Marken-Sichtbarkeit: Balken, Ø Pos. und Sent. ausblenden, Name bekommt Platz */
 main.v3full [style*="grid-template-columns: 14px minmax(0, 1fr) 96px 54px 44px 34px"]{grid-template-columns:16px minmax(0,1fr) 64px!important;gap:8px!important}
 main.v3full [style*="grid-template-columns: 14px minmax(0, 1fr) 96px 54px 44px 34px"]>:nth-child(3),
 main.v3full [style*="grid-template-columns: 14px minmax(0, 1fr) 96px 54px 44px 34px"]>:nth-child(5),
 main.v3full [style*="grid-template-columns: 14px minmax(0, 1fr) 96px 54px 44px 34px"]>:nth-child(6){display:none!important}
 /* Kennzahl-Kacheln im Beispiel: zwei Spalten statt vier */
 main.v3full .kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 /* Vergleichstabelle: auf dem Handy eine Karte je Stufe, Anbietername über jedem Wert */
 main.v3full .vg-scroll{overflow:visible!important;margin:0;padding:0}
 main.v3full .vg-scroll table{min-width:0!important;display:block;border-bottom:0!important}
 main.v3full .vg-scroll thead{display:none}
 main.v3full .vg-scroll tbody,main.v3full .vg-scroll tr{display:block}
 main.v3full .vg-scroll tr{border:1px solid #E1DEDD;border-radius:14px;margin:0 0 14px;overflow:hidden;background:#FFFFFF}
 main.v3full .vg-scroll td{display:block;padding:10px 16px!important;border:0!important;min-width:0!important;position:static!important}
 main.v3full .vg-scroll td + td{border-top:1px solid #F4F2F1!important}
 main.v3full .vg-scroll td:first-child{background:#F4F2F1!important;font-size:15px}
 main.v3full .vg-scroll td:not(:first-child)::before{content:attr(data-label);display:block;font-size:12px;font-weight:600;color:#666262;margin-bottom:2px}
 main.v3full .vg-scroll td:nth-child(2)::before{color:#1F1E1D}
}
@media (max-width:900px){
 main.v3full .st-grid{grid-template-columns:minmax(0,1fr)!important}
 main.v3full .st-list,main.v3full .st-item,main.v3full .st-inline{min-width:0}
 main.v3full .st-inline > div{max-width:100%!important;box-sizing:border-box}
}
@media (max-width:600px){
 main .steps{grid-template-columns:minmax(0,1fr)!important}
 main .steps::before{display:none}
 main h1,main .sh2{overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}
 main .hero h1,main .article-hero h1{font-size:clamp(28px,8.6vw,40px)!important}
}

/* KF-1 Runde 2 (14.10.): 360 px in allen Sprachen */
@media (max-width:600px){
  main :is(.g2,.g3,.g4) > *{min-width:0}
  main .card, main li, main p, main td, main th{overflow-wrap:break-word;hyphens:auto}
}
@media (max-width:420px){
  nav .nav-actions .nav-lang{display:none!important}
  nav .nav-actions{min-width:0;flex-shrink:1}
  nav .nav-actions .btn-dark{white-space:nowrap;padding-left:12px;padding-right:12px;font-size:13px}
}

/* V4: Markenzeichen rot wie in der Vorlage, Form unverändert */
body:has(main:is(.v3h,.v3full)) .nav .logo-mark{color:#D10000}
body:has(main:is(.v3h,.v3full)) .footer .logo-mark{color:#D10000}

/* V4 mobil: Kennzahl-Kacheln in der Scroll-Story zweispaltig */
@media (max-width:600px){
 main.v3full [style*="grid-template-columns: repeat(4, minmax(0, 1fr))"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
