/* =====================================================================
   assets/css/v3.css  ·  Design v3 (Vorlage 13.11.2026)
   Seitenweit: Tokens, Kopf, Mega-Menues, Such-Overlay, Fuss, Handy-Tab-Leiste.
   Startseite: gekapselt unter .v3-home.
   Masse: Vorlage 1040 px Desktop / 390 px Handy (siehe _ref/AUFTRAG-A.md).
   ===================================================================== */

:root {
    --v3-navy: #002755;
    --v3-navy-2: #00224e;
    --v3-navy-band: #10305a;
    --v3-ink: #0a0f1f;
    --v3-text: #2d3b55;
    --v3-muted: #55627a;
    --v3-green: #6af58f;
    --v3-green-h1: #74e39f;
    --v3-green-dark: #12972c;
    --v3-star: #16a92b;
    --v3-pill: #79f2a2;
    --v3-row1: #f0f9f2;
    --v3-row1-line: #9ddfa9;
    --v3-blue: #0a5cc4;
    --v3-blue-m: #1569e6;
    --v3-link: #1546c0;
    --v3-link-2: #2563c9;
    --v3-red: #e3142b;
    --v3-card: #f6f8fb;
    --v3-line: #e6eaf0;
    --v3-font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --primary-color: #1546c0;
    --primary-dark: #0f3a9e;
}

body.v3 { font-family: var(--v3-font); }
body.v3.v3-is-home { background: #fff; color: var(--v3-ink); }
body.v3 .site-main { padding-bottom: 3rem; }
body.v3.v3-is-home .site-main { padding-bottom: 0; }

/* ---------- Logo ---------- */
.v3-logo { display: flex; align-items: flex-start; text-decoration: none; color: #0b3d91; flex: none; }
.v3-logo:hover { color: #0b3d91; }
.v3-logo-icon { width: 44px; height: 37px; flex: none; margin-top: 21.4px; color: #0b3d91; }
.v3-logo-icon .v3-li-dot { fill: #001a5c; }
.v3-logo-icon .v3-li-bar { fill: #dfe5f0; }
.v3-logo-text { display: flex; flex-direction: column; margin: 11.5px 0 0 16.5px; }
.v3-logo-name { font-size: 22px; line-height: 26px; font-weight: 800; color: #05070f; white-space: nowrap; letter-spacing: -0.003em; }
.v3-dot { margin: 0 -0.06em; } /* Punkt vor «ch» optisch an die Nachbarn heranziehen */
.v3-cross { width: 18.5px; height: 18.5px; margin-left: 10px; vertical-align: -3.6px; display: inline-block; }
.v3-logo-tag { font-size: 11.8px; line-height: 16px; margin-top: 7.2px; color: #3f4f6b; font-weight: 500; letter-spacing: -0.012em; white-space: nowrap; }

/* ---------- Kopf ---------- */
.v3-header {
    position: sticky; top: 0; z-index: 200;
    background: linear-gradient(180deg, #fff 0, #fff 89%, #f6f8fa 100%);
    border-bottom: 1px solid #edf0f4;
}
.v3-header-in {
    max-width: 1040px; margin: 0 auto; height: 80px;
    display: flex; align-items: flex-start;
    padding: 0 15px 0 58.5px;
}
/* Kopf-Logo Desktop (mit Unterzeile): Wortmarke hoeher und enger wie Vorlage */
@media (min-width: 1000px) {
    .v3-header .v3-logo-text { margin-top: 12.6px; }
    .v3-header .v3-logo-name { font-size: 23.5px; line-height: 27px; letter-spacing: -0.03em; }
    .v3-header .v3-cross { margin-left: 9px; vertical-align: -3.2px; }
}
.v3-nav.nav-links { margin-left: auto; display: flex; align-items: stretch; height: 80px; gap: 0; }
.v3-nav .mega-nav-item { position: static; display: flex; align-items: stretch; }
.v3-nav .mega-nav-item > .nav-link {
    display: flex; align-items: center; gap: 11.25px;
    height: 80px; padding: 0 18.9px; margin: 0;
    font-size: 13.4px; font-weight: 700; color: var(--v3-ink); letter-spacing: -0.008em;
    background: none; border-radius: 0; white-space: nowrap;
}
.v3-nav .mega-nav-item > .nav-link .chevron-icon { width: 10px; height: 6px; transition: transform .2s; }
.v3-nav .mega-nav-item:hover > .nav-link,
.v3-nav .mega-nav-item.mega-open > .nav-link,
.v3-nav .mega-nav-item > .nav-link.active { color: var(--v3-link); background: none; }
.v3-nav .mega-nav-item:hover > .nav-link .chevron-icon,
.v3-nav .mega-nav-item.mega-open > .nav-link .chevron-icon { transform: rotate(180deg); }
.v3-nav-search {
    width: 40px; height: 40px; margin: 20px 0 0 18.3px; padding: 0;
    display: flex; align-items: center; justify-content: center;
    background: none; border: 0; border-radius: 10px; color: var(--v3-ink); cursor: pointer;
}
.v3-nav-search:hover { background: #f1f4f9; color: var(--v3-link); }
.v3-nav-search svg { width: 23px; height: 23px; stroke-width: 2.7; }
.v3-burger { display: none; }

/* Mega-Menues (Funktion wie bisher, Farben v3) */
.mega-panel { position: absolute; top: 100%; left: 0; right: 0; background: #fff; box-shadow: 0 18px 40px rgba(4, 28, 64, .14); opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .2s ease, visibility .2s ease, transform .2s ease; z-index: 199; border-top: 1px solid #e8edf5; pointer-events: none; }
.mega-nav-item:hover > .mega-panel, .mega-nav-item.mega-open > .mega-panel, .mega-nav-item:focus-within > .mega-panel { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; }
.mega-panel-body { max-width: 1040px; margin: 0 auto; padding: 2rem 2.5rem; display: grid; gap: 2.5rem; }
.mega-panel-body.mega-layout-compare { grid-template-columns: 1fr 1fr 1fr 250px; }
.mega-panel-body.mega-layout-providers { grid-template-columns: 1fr 200px; }
.mega-panel-body.mega-layout-guides { grid-template-columns: 1fr 1fr; }
.mega-section-title { font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--v3-link); margin: 0 0 .75rem; padding: 0; }
.mega-item, .mega-guide { display: flex; gap: .75rem; padding: .65rem .75rem; border-radius: 10px; text-decoration: none; color: inherit; transition: background .15s, border-color .15s; border: 1px solid transparent; }
.mega-item:hover, .mega-guide:hover { background: #f3f6fb; border-color: #e3e9f3; }
.mega-item-icon, .mega-guide-icon { width: 38px; height: 38px; min-width: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: #eaf0fb; color: var(--v3-link); }
.mega-item-title, .mega-guide-title { font-size: .88rem; font-weight: 700; color: var(--v3-ink); margin: 0; line-height: 1.3; }
.mega-item:hover .mega-item-title, .mega-guide:hover .mega-guide-title { color: var(--v3-link); }
.mega-item-meta { font-size: .7rem; color: var(--v3-green-dark); font-weight: 700; margin: .15rem 0 0; }
.mega-item-desc, .mega-guide-desc { font-size: .76rem; color: var(--v3-muted); margin: .15rem 0 0; line-height: 1.4; }
.mega-featured { background: linear-gradient(160deg, #002755, #10325c); border-radius: 14px; padding: 1.4rem; color: #fff; display: flex; flex-direction: column; justify-content: space-between; min-height: 210px; }
.mega-featured-badge { font-size: .6rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; background: var(--v3-green); color: #08240f; padding: .25rem .65rem; border-radius: 100px; width: fit-content; margin-bottom: .75rem; }
.mega-featured h3 { font-size: 1.02rem; font-weight: 800; margin: 0 0 .5rem; line-height: 1.25; color: #fff; }
.mega-featured p { font-size: .8rem; color: rgba(255, 255, 255, .82); line-height: 1.5; margin: 0 0 1rem; }
.mega-featured-cta { display: inline-flex; align-items: center; gap: .35rem; padding: .55rem 1.05rem; background: var(--v3-green); border-radius: 8px; color: #08240f !important; text-decoration: none; font-size: .8rem; font-weight: 800; width: fit-content; }
.mega-featured-cta:hover { background: #8cf8aa; }
.mega-providers { display: grid; grid-template-columns: repeat(5, 1fr); gap: .5rem; }
.mega-provider { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: .85rem .5rem; border-radius: 10px; text-decoration: none; color: var(--v3-ink); border: 1px solid #edf1f7; background: #fff; transition: border-color .2s, background .2s; }
.mega-provider:hover { border-color: var(--v3-link); background: #f3f6fb; color: var(--v3-link); }
.mega-provider-logo { width: 44px; height: 44px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: #fff; border: 1px solid #edf1f7; padding: 6px; }
.mega-provider-logo img { width: 100%; height: 100%; object-fit: contain; }
.mega-provider-name { font-size: .75rem; font-weight: 700; text-align: center; }
.mega-sidebar { background: var(--v3-card); border-radius: 12px; padding: 1.25rem; border: 1px solid #edf1f7; }
.mega-sidebar-title { font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--v3-link); margin: 0 0 .75rem; }
.mega-sidebar-link { display: block; padding: .45rem 0; font-size: .85rem; font-weight: 600; color: var(--v3-ink); text-decoration: none; }
.mega-sidebar-link:hover { color: var(--v3-link); }
.mega-resources { padding: 1.1rem 2.5rem; border-top: 1px solid #edf1f7; background: var(--v3-card); }
.mega-resources-inner { max-width: 1040px; margin: 0 auto; display: flex; gap: .75rem; width: 100%; }
.mega-resource { flex: 1; display: flex; align-items: center; justify-content: center; gap: .5rem; padding: .65rem; border: 1px solid #dfe6f1; border-radius: 8px; text-decoration: none; color: var(--v3-ink); font-size: .8rem; font-weight: 700; background: #fff; }
.mega-resource:hover { border-color: var(--v3-link); color: var(--v3-link); }
.mega-panel-ft { padding: .85rem 2.5rem; background: var(--v3-card); border-top: 1px solid #edf1f7; text-align: center; font-size: .78rem; color: var(--v3-muted); }
.mega-panel-ft a { color: var(--v3-link); font-weight: 700; text-decoration: none; }
.mega-panel-ft a:hover { text-decoration: underline; }
.mega-backdrop { position: fixed; inset: 0; background: rgba(4, 28, 64, .12); opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; z-index: 150; pointer-events: none; }
.mega-backdrop.active { opacity: 1; visibility: visible; pointer-events: auto; }
/* Tools: kleines Dropdown unter dem Menuepunkt */
.v3-nav .v3-tools { position: relative; }
.v3-tools > .mega-panel.v3-tools-panel { left: auto; right: -40px; width: 320px; padding: .6rem; border-radius: 0 0 14px 14px; border: 1px solid #e8edf5; border-top: 0; }

/* ---------- Such-Overlay ---------- */
.v3-search[hidden] { display: none !important; }
.v3-search { position: fixed; inset: 0; z-index: 1200; background: rgba(2, 20, 48, .55); display: flex; align-items: flex-start; justify-content: center; padding: 96px 16px 16px; }
.v3-search-dialog { width: 100%; max-width: 640px; background: #fff; border-radius: 16px; box-shadow: 0 24px 60px rgba(2, 20, 48, .35); padding: 18px 18px 20px; }
.v3-search-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.v3-search-title { font-size: 15px; font-weight: 800; color: var(--v3-ink); }
.v3-search-close { width: 36px; height: 36px; border: 0; background: #f1f4f9; border-radius: 10px; color: var(--v3-ink); display: flex; align-items: center; justify-content: center; cursor: pointer; }
.v3-search-form { position: relative; display: flex; align-items: center; gap: 10px; border: 1.5px solid #d5dce6; border-radius: 12px; padding: 6px 6px 6px 14px; }
.v3-search-form:focus-within { border-color: var(--v3-link); }
.v3-search-ico { color: var(--v3-muted); flex: none; }
.v3-search-input { flex: 1; min-width: 0; border: 0; outline: 0; font: 500 16px/1.4 var(--v3-font); color: var(--v3-ink); background: transparent; padding: 8px 0; }
.v3-search-btn { border: 0; border-radius: 9px; background: var(--v3-green); color: #08240f; font: 800 14px/1 var(--v3-font); padding: 12px 18px; cursor: pointer; }
.v3-search-results[hidden] { display: none !important; }
.v3-search-results { position: absolute; left: -1.5px; right: -1.5px; top: calc(100% + 6px); background: #fff; border: 1px solid #dfe5ee; border-radius: 12px; box-shadow: 0 14px 34px rgba(4, 28, 64, .16); max-height: 340px; overflow-y: auto; z-index: 60; text-align: left; }
.v3-sr-item { display: flex; align-items: center; gap: .75rem; padding: .7rem 1rem; border-bottom: 1px solid #f0f3f7; text-decoration: none; color: var(--v3-ink); }
.v3-sr-item:last-child { border-bottom: 0; }
.v3-sr-item:hover, .v3-sr-item.active { background: #f3f6fb; color: var(--v3-link); }
.v3-sr-type { font-size: .64rem; text-transform: uppercase; font-weight: 800; letter-spacing: .04em; color: var(--v3-link); background: #eaf0fb; padding: .18rem .5rem; border-radius: 5px; white-space: nowrap; }
.v3-sr-title { font-size: .9rem; font-weight: 600; }
.v3-sr-empty { padding: 1rem; color: var(--v3-muted); font-size: .9rem; }
body.v3-search-open { overflow: hidden; }

/* ---------- Mobile-Menue (Slide-In) ---------- */
/* Geschlossen liegt das Panel rechts ausserhalb, sein Schatten fiel als grauer Streifen ins Bild */
.mobile-nav-panel:not(.open) { box-shadow: none; }
.mobile-nav-header .v3-logo--sm { align-items: center; gap: 9px; }
.v3-logo--sm .v3-logo-icon { width: 30px; height: 25px; margin: 0; }
.v3-logo--sm .v3-logo-name { font-size: 14px; line-height: 18px; }
.mobile-nav-item.active { background: #eaf0fb; border-left: 3px solid var(--v3-link); }
.mobile-nav-item.active .mobile-nav-item-text, .mobile-nav-item.active .mobile-nav-chevron { color: var(--v3-link); }
.mobile-nav-item-text { color: var(--v3-ink); }

/* ---------- Fuss ---------- */
.site-footer.v3-footer { background: linear-gradient(180deg, #041c40 0, #0b2a55 100%); color: rgba(255, 255, 255, .78); border-top: 0; padding: 48px 0 28px; margin: 0; }
.v3-footer-in { max-width: 1040px; margin: 0 auto; padding: 0 38.5px; }
.v3-footer-top { display: grid; grid-template-columns: 1.6fr 1fr; gap: 48px; }
.v3-logo--light, .v3-logo--light:hover { color: #fff; }
.v3-logo--light .v3-logo-icon { color: #fff; margin-top: 0; }
.v3-logo--light .v3-logo-icon g[fill="#fff"] { fill: transparent; }
.v3-logo--light .v3-logo-icon .v3-li-dot { fill: #fff; }
.v3-logo--light .v3-logo-icon .v3-li-bar { fill: rgba(255, 255, 255, .45); }
.v3-logo--light .v3-logo-text { margin-top: 5px; }
.v3-logo--light .v3-logo-name { color: #fff; }
.v3-footer-brand p { font-size: 14px; line-height: 1.6; margin: 18px 0 18px; max-width: 420px; color: rgba(255, 255, 255, .8); }
.v3-footer-badges { display: flex; gap: 8px; flex-wrap: wrap; }
.v3-footer-badge { padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 700; color: #fff; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .18); }
.v3-footer-col h4 { color: #fff; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; margin: 6px 0 14px; }
.v3-footer-col .footer-links { list-style: none; margin: 0; padding: 0; }
.v3-footer-col .footer-links a { display: block; padding: 5px 0; font-size: 14px; color: rgba(255, 255, 255, .85); text-decoration: none; }
.v3-footer-col .footer-links a:hover { color: var(--v3-green); }
.v3-footer-bottom { margin-top: 36px; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, .14); display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; font-size: 12.5px; color: rgba(255, 255, 255, .62); }
.v3-footer-legal { display: flex; gap: 20px; flex-wrap: wrap; }
.v3-footer-legal a { color: rgba(255, 255, 255, .85); text-decoration: none; font-size: 12.5px; }
.v3-footer-legal a:hover { color: var(--v3-green); }

/* ---------- Handy-Tab-Leiste ---------- */
.v3-tabbar { display: none; }

/* =====================================================================
   STARTSEITE
   ===================================================================== */
.v3-home { display: flex; flex-direction: column; background: #fff; color: var(--v3-ink); overflow-x: clip; }
.v3-home :where(h1, h2, h3, h4, p) { margin: 0; }
.v3-home :where(ul) { list-style: none; margin: 0; padding: 0; }
.v3-home a { text-decoration: none; }
.v3-home em { font-style: normal; }
.v3-c { width: 100%; max-width: 1040px; margin: 0 auto; position: relative; }
.v3-h2-m { display: none; }
.v3-arr { width: 14px; height: 14px; flex: none; }
.v3-ck { width: 12px; height: 12px; flex: none; }

/* ---------- Hero ---------- */
.v3-hero { position: relative; height: 449px; overflow: hidden; background: var(--v3-navy-2); color: #fff; isolation: isolate; }
.v3-hero-img {
    position: absolute; top: 0; bottom: 0; z-index: -2;
    left: calc(50% - 359.4px); right: 0; min-width: 1246px;
    /* Foto 2553 x 920, Gipfel bei x 1220: auf 130 % der Hero-Hoehe, Gipfel bleibt bei 74 % der Containerbreite */
    background:
        linear-gradient(180deg, rgba(6, 24, 54, 0) 0, rgba(6, 24, 54, 0) 55%, rgba(4, 20, 46, .35) 100%) 0 0 / 100% 100%,
        url('../img/hero-matterhorn-v2.webp') -178.5px -12.3px / auto 130% no-repeat;
    filter: contrast(1.08) saturate(1.05);
    -webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .55) 120px, #000 300px);
    mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .55) 120px, #000 300px);
}
.v3-hero::before {
    content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background:
        linear-gradient(0deg, rgba(0, 30, 70, .62) 0, rgba(0, 30, 70, .25) 30%, rgba(0, 30, 70, 0) 55%),
        /* k3: unten rechts dunkler Bergschatten wie in der Vorlage, dort sitzt die Glas-Box (Befund R3-1) */
        radial-gradient(560px 300px at 100% 80%, rgba(4, 28, 34, .85), rgba(4, 28, 34, 0) 72%),
        linear-gradient(90deg,
            rgba(0, 34, 78, .97) 0,
            rgba(0, 34, 78, .95) calc(50% - 520px + 240px),
            rgba(0, 34, 78, .72) calc(50% - 520px + 420px),
            rgba(0, 34, 78, .16) calc(50% - 520px + 620px),
            rgba(0, 34, 78, .08) 100%);
}
/* Pille/H1 oben und Buttons unten auf Vorlagenposition; der Platz der fehlenden H1- und Absatzzeile
   geht in die Abstaende H1-Absatz und Absatz-Buttons */
.v3-hero-in { position: relative; max-width: 1040px; height: 100%; margin: 0 auto; padding: 45px 0 50.4px 63.5px; display: flex; }
.v3-hero-text { display: flex; flex-direction: column; align-items: flex-start; }
.v3-pill { display: inline-flex; align-items: center; height: 29px; padding: 1.5px 14px 1.5px 1.5px; border-radius: 8px; background: rgba(100, 160, 225, .28); font-size: 13px; font-weight: 600; color: #fff; white-space: nowrap; }
.v3-pill-x { width: 26px; height: 26px; border-radius: 6.5px; background: var(--v3-red); display: flex; align-items: center; justify-content: center; margin-right: 10px; }
.v3-pill-x svg { width: 15px; height: 15px; }
.v3-hero h1 { margin-top: 14.7px; font-size: 40px; line-height: 47px; font-weight: 800; color: #fff; letter-spacing: 0; }
.v3-grad { background: linear-gradient(90deg, #fff 0, #fff 9%, #8fe8b0 24%, var(--v3-green-h1) 36%, #6ee69b 100%); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.v3-hero-lead { margin-top: 40px; font-size: 17.5px; line-height: 25.6px; font-weight: 500; color: #fff; max-width: 500px; }
.v3-hero-cta { display: flex; gap: 18.5px; margin-top: auto; }
.v3-btn { display: inline-flex; align-items: center; height: 48.5px; border-radius: 8px; font-weight: 800; white-space: nowrap; }
.v3-btn-hero { width: 285.3px; padding-left: 21.4px; font-size: 15px; color: #06200f; background: linear-gradient(180deg, #6ff792 0, #66f28c 100%); box-shadow: 0 6px 18px rgba(64, 230, 120, .28); }
.v3-btn-hero:hover { color: #06200f; background: #85fba5; }
.v3-btn-hero .v3-ico-search { width: 20px; height: 20px; margin-right: 12.8px; }
.v3-btn-hero .v3-arr { width: 14px; height: 14px; margin-left: 9.5px; }
.v3-btn-ghost { width: 202.6px; padding-left: 26px; font-size: 14px; color: #fff; border: 1.5px solid rgba(255, 255, 255, .82); background: rgba(2, 24, 58, .35); }
.v3-btn-ghost:hover { color: #fff; background: rgba(255, 255, 255, .12); }
.v3-ico-book { width: 22px; height: 22px; margin-right: 13.5px; }
.v3-glass {
    position: absolute; left: 708px; top: 222.3px; width: 307px; height: 156px;
    padding: 11.8px 0 0 22px; border-radius: 14px;
    background: rgba(22, 40, 58, .52); border: 1px solid rgba(255, 255, 255, .34);
    -webkit-backdrop-filter: blur(8px) saturate(.9); backdrop-filter: blur(8px) saturate(.9);
    box-shadow: 0 10px 30px rgba(0, 12, 34, .25), inset 0 1px 0 rgba(255, 255, 255, .08);
}
.v3-home .v3-glass li { display: flex; align-items: center; height: 32.3px; font-size: 13.8px; font-weight: 500; color: #fff; white-space: nowrap; }
.v3-glass .v3-ck { width: 15.7px; height: 15.7px; margin-right: 14.2px; color: #5ef08a; }
.v3-glass .v3-ck path { stroke-width: 2.6; }

/* ---------- Vertrauensleiste ---------- */
.v3-trust { background: #fbfcfd; border-bottom: 1px solid #e9edf2; box-shadow: inset 0 6px 6px -6px rgba(10, 30, 60, .10); }
/* Festes Spaltenraster wie Vorlage: Trenner bei 295 / 545 / 814 px, Texte bei 109 / 362 / 612 / 891 px */
.v3-trust-in { max-width: 1040px; height: 84px; margin: 0 auto; padding: 0 0 4.4px 55px; display: grid; grid-template-columns: 239.7px 1px 248.8px 1px 268.5px 1px 1fr; align-items: center; }
.v3-trust-item { position: relative; display: flex; align-items: center; height: 79.6px; flex: none; color: var(--v3-ink); }
.v3-t2 { padding-left: 23.3px; }
.v3-t3 { padding-left: 19.5px; }
.v3-t4 { padding-left: 18px; }
.v3-trust-div { flex: none; width: 1px; height: 43px; margin-top: 4.4px; background: #e2e7ee; }
.v3-trust-item:hover strong { color: var(--v3-link); }
.v3-ti { flex: none; color: #0d2a6b; }
.v3-t1 .v3-ti { width: 37.1px; height: 33.4px; margin-right: 18.5px; }
.v3-t2 .v3-ti { width: 29px; height: 33px; margin-right: 14px; }
.v3-t3 .v3-ti { width: 30px; height: 30px; margin-right: 17.1px; }
.v3-t4 .v3-ti { width: 41.4px; height: 37.5px; margin-right: 15.7px; }
.v3-tt { display: flex; flex-direction: column; min-width: 0; }
.v3-tt strong { font-size: 14.5px; line-height: 18px; font-weight: 800; color: var(--v3-ink); white-space: nowrap; }
.v3-tt small { font-size: 10.8px; line-height: 15px; margin-top: 5.1px; font-weight: 500; color: var(--v3-text); white-space: nowrap; }
.v3-trust-m { display: none; }

/* ---------- Top Anbieter ---------- */
.v3-top { padding-top: 40.2px; background: #fff; }
.v3-top .v3-c { padding: 0 31px 0 38.5px; }
.v3-eyebrow { margin-left: 24.3px; font-size: 15px; line-height: 18px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #0b2fa6; }
.v3-h2 { margin: 6.1px 0 0 23.8px; font-size: 36.5px; line-height: 44px; font-weight: 800; letter-spacing: -.005em; color: var(--v3-ink); }
.v3-h2 em, .v3-h2s em { color: var(--v3-green-dark); }
.v3-sub { font-size: 16px; line-height: 24px; font-weight: 500; color: #141e36; }
.v3-top-sub { margin: 9px 0 0 24.3px; max-width: 520px; }
.v3-tabs { display: flex; gap: 12px; margin: 28.5px 0 0 20px; }
.v3-tab-btn {
    display: inline-flex; align-items: center; gap: 13px; height: 44.3px; padding: 0 21px;
    border-radius: 9px; border: 1px solid #e3e8ef; background: linear-gradient(180deg, #fbfcfd, #f5f7fa);
    box-shadow: 0 2px 5px rgba(16, 32, 64, .06); cursor: pointer;
    font: 600 13px/1 var(--v3-font); color: var(--v3-ink); white-space: nowrap; word-spacing: 1.5px;
}
.v3-tab-btn svg { width: 20px; height: 20px; flex: none; }
/* Server- und Wolken-Symbol in Vorlagengroesse; Tab 4 enger, weil «Homepage-Baukasten» laenger ist */
.v3-tab-btn:nth-child(1) { padding-right: 25px; }
.v3-tab-btn:nth-child(1) svg { width: 29px; height: 29px; margin: 0 -2px 0 -3px; }
.v3-tab-btn:nth-child(3) svg { width: 27px; height: 27px; margin: 0 -1px 0 -2px; }
.v3-tab-btn:nth-child(4) { padding: 0 17px; }
.v3-tab-btn .v3-ic-wp { color: #3a4152; }
.v3-tab-btn.is-active .v3-ic-wp { color: #fff; }
.v3-tab-btn:hover { border-color: #c9d3e2; color: var(--v3-ink); }
.v3-tab-btn.is-active { background: linear-gradient(180deg, #0a60c4 0, #064cb3 100%); border-color: #0750b6; color: #fff; font-weight: 700; box-shadow: 0 4px 12px rgba(8, 80, 180, .28); }
.v3-tab-btn:focus-visible { outline: 2px solid var(--v3-link); outline-offset: 2px; }

.v3-tbl { margin-top: 24.2px; background: #fff; border: 1px solid #e7ebf1; border-radius: 14px; box-shadow: 0 4px 16px rgba(16, 32, 64, .05); }
.v3-panel[hidden] { display: none; }
.v3-tr { display: grid; grid-template-columns: 75.6px 199.5px 151px 244px 125px 1fr; align-items: center; position: relative; }
.v3-th { height: 43px; background: #fafbfc; border-radius: 14px 14px 0 0; font-size: 12.5px; font-weight: 600; color: var(--v3-ink); }
.v3-home .v3-th { font-weight: 700; }
.v3-th > span { padding-top: 1px; }
.v3-th .v3-c-rate { display: block; }
.v3-th .v3-info { width: 13px; height: 13px; vertical-align: -2px; margin-left: 3px; color: var(--v3-muted); }
.v3-panel .v3-tr { min-height: 0; padding: 10.5px 0; border-top: 1px solid #e9edf2; }
.v3-panel .v3-tr.is-first { min-height: 0; padding: 14px 0; margin: 0 -1.5px; border: 2px solid #86cf9b; border-radius: 12px; background: radial-gradient(120% 140% at 30% 0, #f5fef7 0, #ecfbef 60%, #e6f9ea 100%); box-shadow: 0 2px 10px rgba(30, 160, 70, .08); }
.v3-panel .v3-tr.is-first + .v3-tr { border-top: 0; }
.v3-panel .v3-tr:last-child:not(.is-first) { border-radius: 0 0 14px 14px; }
.v3-c-rank { padding-left: 27px; font-size: 16px; font-weight: 700; color: var(--v3-ink); }
.v3-th .v3-c-rank { font-size: 12.5px; font-weight: 600; }
.v3-c-prov { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; }
.v3-logo-box { display: block; overflow: hidden; flex: none; }
.v3-logo-box img, .v3-logo-img { display: block; max-width: none; }
.v3-logo-img { width: auto; height: auto; object-fit: contain; }
/* Logos mit weissem Bildhintergrund: auf der gruen getoenten ersten Zeile kein weisses Kaestchen */
.v3-panel .is-first :is(.v3-logo-box img, .v3-logo-img), .v3-mcard.is-first :is(.v3-logo-box img, .v3-logo-img) { mix-blend-mode: multiply; }
.v3-prov-name { font-size: 19px; font-weight: 800; color: var(--v3-ink); }
.v3-badge { display: inline-flex; align-items: center; height: 19.5px; padding: 0 10px; border-radius: 6px; background: var(--v3-pill); color: #063b1b; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.v3-c-rate { display: flex; flex-direction: column; align-items: flex-start; }
.v3-score { font-size: 12.5px; font-weight: 500; color: var(--v3-text); line-height: 20px; }
.v3-panel .v3-score { word-spacing: 2px; }
.v3-score b { font-size: 17px; font-weight: 800; color: var(--v3-ink); }
.v3-score-none { font-size: 12.5px; font-weight: 600; color: var(--v3-muted); }
.v3-stars { position: relative; display: inline-block; height: 15px; margin: 3px 0 4px; line-height: 0; white-space: nowrap; }
.v3-stars svg { width: 15.5px; height: 15px; margin-right: 2.1px; }
.v3-stars-bg svg { fill: #d9dee6; }
.v3-stars-fg { position: absolute; left: 0; top: 0; overflow: hidden; white-space: nowrap; }
.v3-stars-fg svg { fill: var(--v3-star); }
.v3-panel .v3-stars { height: 16px; }
.v3-panel .v3-stars svg { width: 16.5px; height: 16px; margin-right: 2px; }
.v3-c-rate small { font-size: 11.5px; line-height: 15px; color: var(--v3-text); white-space: nowrap; }
.v3-panel .v3-c-rate small { font-weight: 500; color: #4f5d6e; }
.v3-c-feat { display: flex; flex-direction: column; gap: 0; }
.v3-panel .v3-c-feat { padding-left: 4.4px; }
.v3-panel .v3-c-price { padding-left: 19.4px; }
.v3-c-feat > span { display: flex; align-items: center; height: 20px; font-size: 12px; font-weight: 600; color: var(--v3-ink); white-space: nowrap; }
.v3-c-feat .v3-ck { width: 11px; height: 11px; margin-right: 12px; color: var(--v3-green-dark); }
.v3-c-price { display: flex; flex-direction: column; }
.v3-c-price b { font-size: 17px; font-weight: 800; color: var(--v3-ink); white-space: nowrap; letter-spacing: -.005em; }
.v3-c-price small { font-size: 11.5px; color: var(--v3-muted); }
.v3-panel .v3-c-price b { word-spacing: 3px; }
.v3-c-cta { display: flex; flex-direction: column; align-items: center; padding-right: 8px; }
.v3-th .v3-c-cta { padding: 0; }
.v3-panel .v3-c-cta { padding: 0 0 0 2.6px; }
.v3-go { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 140px; height: 33.5px; border-radius: 7px; font-size: 12.5px; font-weight: 700; color: var(--v3-ink); border: 1.5px solid #4cc865; background: linear-gradient(180deg, #fbfffb, #effbf0); white-space: nowrap; }
.v3-go:hover { color: var(--v3-ink); background: #e2f8e6; }
.v3-go-fill { color: #fff; border-color: var(--v3-green-dark); background: linear-gradient(180deg, #14a02e 0, #10921f 100%); box-shadow: 0 3px 8px rgba(18, 151, 44, .25); }
.v3-go-fill:hover { color: #fff; background: #0e861d; }
.v3-go .v3-arr { width: 13px; height: 13px; }
.v3-details { margin-top: 7px; font-size: 12px; line-height: 16px; font-weight: 500; color: var(--v3-link-2); white-space: nowrap; }
.v3-details:hover { text-decoration: underline; color: var(--v3-link); }
.v3-panel .v3-details { font-weight: 600; color: #1f5bc4; }
.v3-more-wrap { display: flex; justify-content: center; padding: 21px 0 0 1px; }
.v3-more { display: inline-flex; align-items: center; justify-content: center; gap: 15px; width: 371.5px; height: 45.5px; border-radius: 9px; border: 1.5px solid #d6dde7; background: linear-gradient(180deg, #fff, #f7f9fc); box-shadow: 0 3px 8px rgba(16, 32, 64, .07); font-size: 15px; font-weight: 700; color: var(--v3-ink); }
.v3-more:hover { color: var(--v3-link); border-color: #b9c6da; }
.v3-more .v3-arr { width: 16px; height: 16px; }
.v3-mob { display: none; }

/* ---------- Kategorien ---------- */
.v3-cats { padding-top: 43.8px; background: #fff; }
.v3-cats .v3-c { padding: 0 17.5px 0 36px; }
.v3-h2s { font-size: 28px; line-height: 34px; font-weight: 800; color: var(--v3-ink); letter-spacing: -.005em; }
.v3-cats .v3-h2s { margin-left: 13.6px; }
.v3-cats .v3-sub { margin: 5px 0 0 14.6px; }
.v3-cat-grid { display: grid; grid-template-columns: 190fr 180fr 178fr 207fr 172fr; gap: 15px; margin-top: 23px; }
.v3-cat { position: relative; display: flex; flex-direction: column; align-items: flex-start; min-height: 189.5px; padding: 20px 10px 11px 16.5px; border-radius: 13px; border: 1px solid #e2e8f1; background: linear-gradient(180deg, #fdfeff 0, #f3f7fd 45%, #f5f8fc 100%); box-shadow: 0 3px 10px rgba(16, 32, 64, .05); color: var(--v3-ink); transition: transform .15s, box-shadow .15s; }
.v3-cat:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(16, 32, 64, .10); color: var(--v3-ink); }
.v3-cat:nth-child(4) { padding-right: 6px; }
.v3-cat-green { background: linear-gradient(165deg, #f9fefd 0, #eefbf7 45%, #e6f8f1 100%); border-color: #cfeedc; }
.v3-cat-ico { width: 41.5px; height: 36px; margin-left: 7.5px; }
.v3-cat-wp { width: 38px; height: 38px; margin: -1px 0 -1px 9px; color: #1f6fd8; }
.v3-home .v3-cat h3 { margin-top: 14px; font-size: 16px; line-height: 22px; font-weight: 800; color: var(--v3-ink); }
.v3-home .v3-cat p { margin-top: 8.5px; font-size: 12px; line-height: 17px; font-weight: 500; color: #141e36; }
.v3-cat-go { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin-top: auto; border-radius: 50%; background: #e9eef6; color: var(--v3-ink); }
.v3-cat-green .v3-cat-go { background: #d0f3dd; }
.v3-cat-go .v3-arr { width: 15px; height: 15px; }

/* ---------- Ratgeber ---------- */
.v3-rat { padding-top: 39.6px; background: #fff; }
.v3-rat .v3-c { padding: 0 30px 0 49px; }
.v3-rat-head { display: flex; align-items: flex-start; justify-content: space-between; }
.v3-rat .v3-h2s { margin-left: 1.6px; }
.v3-rat .v3-sub { margin-top: 2px; font-size: 15.5px; line-height: 22px; max-width: 610px; }
.v3-link-all { display: inline-flex; align-items: center; gap: 10px; margin: 35px 11px 0 0; font-size: 13.6px; font-weight: 700; color: #0d36b2; white-space: nowrap; }
.v3-link-all:hover { color: #0f3a9e; }
.v3-link-all .v3-arr { width: 15px; height: 15px; }
.v3-rat-grid { display: grid; grid-template-columns: 312.5fr 303.5fr 305fr; gap: 20px; margin-top: 17px; }
.v3-art { position: relative; display: flex; flex-direction: column; min-height: 237.5px; border-radius: 13px; background: #fff; border: 1px solid #edf0f4; box-shadow: 0 5px 16px rgba(16, 32, 64, .07); color: var(--v3-ink); overflow: hidden; }
.v3-art:hover { box-shadow: 0 10px 26px rgba(16, 32, 64, .12); color: var(--v3-ink); }
.v3-art-img { position: relative; height: 111.5px; background: #dfe6f1; flex: none; }
.v3-art-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.v3-art-cat { position: absolute; left: 17.5px; top: 12.5px; height: 25px; display: inline-flex; align-items: center; padding: 0 12.5px; border-radius: 7px; background: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, .12); font-size: 11.5px; font-weight: 600; color: var(--v3-ink); }
.v3-art-body { display: flex; flex-direction: column; flex: 1; padding: 4.4px 18px 12px 19px; }
.v3-home .v3-art h3 { font-size: 16px; line-height: 20.5px; font-weight: 800; color: var(--v3-ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.v3-home .v3-art p { margin-top: 6.9px; font-size: 12px; line-height: 17.5px; font-weight: 500; color: #18223a; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.v3-art-meta { display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding-top: 10px; font-size: 10.5px; line-height: 16px; font-weight: 600; color: var(--v3-ink); }
.v3-art-meta > span { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.v3-art-meta svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.v3-art-meta > .v3-art-mtime, .v3-art-chev { display: none; }

/* ---------- Such-Band ---------- */
.v3-band-wrap { padding: 15px 17.5px 40px 30px; max-width: 1040px; width: 100%; margin: 0 auto; background: #fff; }
.v3-band { position: relative; display: flex; align-items: flex-start; min-height: 77px; padding: 0 21.5px 0 31px; border-radius: 13px; background: linear-gradient(90deg, #0b2c55 0, #103159 55%, #123057 100%); color: #fff; box-shadow: 0 8px 22px rgba(4, 28, 64, .18); }
.v3-band-ico { width: 39px; height: 39px; margin: 11px 0 0 -3px; flex: none; color: #fff; }
.v3-band-text { margin: 8.5px 0 0 25.5px; flex: 1; min-width: 0; }
.v3-home .v3-band h2 { font-size: 16.5px; line-height: 24px; font-weight: 800; color: #fff; white-space: nowrap; }
.v3-home .v3-band p { margin-top: -1px; font-size: 11.5px; line-height: 18px; font-weight: 500; color: #fff; }
.v3-band-form { width: 367.5px; margin-top: 5.2px; flex: none; }
.v3-band-search { position: relative; display: flex; gap: 13px; }
.v3-band-search .v3-search-input { width: 224.5px; height: 30px; flex: none; padding: 0 12px; border-radius: 6px; border: 1px solid #e8ebf0; background: #fafafb; font-size: 12.5px; color: var(--v3-ink); }
.v3-band-search .v3-search-input::placeholder { color: #8b93a3; }
.v3-band-search .v3-search-input:focus { outline: 2px solid var(--v3-green); outline-offset: 1px; }
.v3-band-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 130px; height: 31.5px; border: 0; border-radius: 6px; background: linear-gradient(180deg, #78fb98, #6af08c); color: #06200f; font: 800 12.5px/1 var(--v3-font); cursor: pointer; }
.v3-band-btn:hover { background: #8dfcab; }
.v3-band-btn .v3-arr { width: 13px; height: 13px; }
.v3-band-search .v3-search-results { left: 0; right: 0; top: calc(100% + 6px); }
.v3-home .v3-band-checks { display: flex; gap: 30px; margin-top: 5px; padding-left: 1.5px; }
.v3-band-checks li { display: inline-flex; align-items: center; gap: 6px; font-size: 9.6px; line-height: 13px; font-weight: 500; color: #fff; white-space: nowrap; }
.v3-band-checks .v3-ck { width: 10px; height: 10px; color: #fff; }

/* =====================================================================
   Breiter als die Vorlage: Inhalt bleibt zentriert, Baender volle Breite
   ===================================================================== */
@media (min-width: 2164px) {
    .v3-hero-img {
        right: auto; width: 1441.3px;
        -webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .55) 120px, #000 300px, #000 calc(100% - 260px), transparent 100%);
        mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .55) 120px, #000 300px, #000 calc(100% - 260px), transparent 100%);
    }
}

/* =====================================================================
   Tablet: 769 bis 1039 px
   ===================================================================== */
@media (max-width: 1039px) {
    .v3-header-in { padding-left: 24px; }
    .v3-top .v3-c, .v3-rat .v3-c, .v3-cats .v3-c { padding-left: 20px; padding-right: 20px; }
    .v3-band-wrap { padding-left: 20px; padding-right: 20px; }
    .v3-tr { grid-template-columns: 56px minmax(120px, 1.3fr) minmax(120px, 1fr) minmax(170px, 1.5fr) 100px 158px; }
    .v3-c-rank { padding-left: 20px; }
    /* Tablet 769 bis 1039 px: fünf Tabs passen nicht in eine Zeile (bei 1000 px zwei Zeilen,
       Seite wuchs um 330 px). Darum eine wischbare Zeile statt Umbruch (k2, 13.11.2026). */
    .v3-tabs { flex-wrap: nowrap; margin-left: 0; overflow-x: auto; scrollbar-width: none; padding-bottom: 8px; margin-bottom: -8px; }
    .v3-tabs::-webkit-scrollbar { display: none; }
    .v3-tab-btn { flex: none; }
    .v3-glass { left: auto; right: 24px; }
    .v3-trust-in { display: flex; justify-content: space-between; padding-left: 24px; padding-right: 12px; }
    .v3-trust-item { padding-left: 12px; }
    .v3-t1 { padding-left: 0; }
    .v3-tt small { white-space: normal; }
    .v3-cat-grid { grid-template-columns: repeat(3, 1fr); }
    .v3-band { flex-wrap: wrap; padding: 16px 20px; }
    .v3-band-text { flex-basis: calc(100% - 70px); margin-top: 0; }
    .v3-home .v3-band h2 { white-space: normal; }
    .v3-band-form { width: 100%; margin: 12px 0 0 61px; }
    .v3-band-search .v3-search-input { flex: 1; width: auto; }
}
@media (max-width: 999px) {
    .v3-nav.nav-links { display: none; }
    .v3-logo-tag { display: none; }
    .v3-logo-text { margin-top: 27px; }
    .v3-burger { display: flex; flex-direction: column; justify-content: center; gap: 6.5px; width: 44px; height: 44px; margin: 18px 0 0 auto; padding: 0 10px; background: none; border: 0; cursor: pointer; }
    .v3-burger span { display: block; height: 2.6px; border-radius: 2px; background: var(--v3-ink); }
    .v3-hero-in { padding: 0 0 6px 63.5px; align-items: center; }
    .v3-hero-text { max-width: 52%; }
    .v3-hero-lead { margin-top: 16.2px; }
    .v3-hero h1 { font-size: 36px; line-height: 43px; }
    .v3-hero-cta { flex-wrap: wrap; margin-top: 27.1px; }
    .v3-c-feat { display: none; }
    .v3-tr { grid-template-columns: 52px minmax(120px, 1.2fr) minmax(130px, 1fr) 110px 158px; }
    .v3-trust-in { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px; height: auto; padding: 14px 20px; }
    .v3-trust-div { display: none; }
    .v3-trust-item { height: auto; padding-left: 0; }
    .v3-trust-item > .v3-ti { width: 40px; margin-right: 14px; }
    .v3-rat-head { flex-direction: column; }
    .v3-link-all { margin: 12px 0 0; }
}
@media (min-width: 769px) and (max-width: 999px) {
    .v3-glass { display: none; }
}

/* =====================================================================
   Handy: bis 768 px (Vorlage 390 px)
   ===================================================================== */
@media (max-width: 768px) {

    /* Kopf */
    .v3-header { background: linear-gradient(180deg, #fff 0, #fff 86%, #f6f8fa 100%); border-bottom: 0; box-shadow: 0 1px 0 #eef1f5, 0 5px 10px -6px rgba(10, 30, 60, .12); }
    .v3-header-in { height: 67.5px; padding: 0 12.3px 0 21.5px; }
    .v3-logo-icon { width: 34.5px; height: 29px; margin-top: 19px; }
    .v3-logo-text { margin: 20.9px 0 0 12.4px; }
    .v3-logo-name { font-size: 16px; line-height: 20px; }
    .v3-cross { width: 16px; height: 16px; margin-left: 8px; vertical-align: -2.6px; }
    /* Logo-Symbol klein wie Vorlage Handy: je Einschub links ein Punkt, rechts zwei, heller; ohne Schlitze */
    .v3-li-fine { display: none; }
    .v3-logo-icon .v3-li-dot { fill: #1d4a8f; }
    /* k3: Trefferfläche 44 x 44, Strichlage unverändert (Befund M3 r3-handy) */
    .v3-burger { width: 44px; height: 44px; margin: 11px -1.65px 0 auto; padding: 0 11.65px; gap: 4.35px; }
    .v3-burger span { height: 2.8px; }

    /* Tab-Leiste */
    .v3-tabbar {
        display: grid; grid-template-columns: repeat(4, 1fr);
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 150;
        height: calc(79.5px + env(safe-area-inset-bottom));
        padding: 0 0 env(safe-area-inset-bottom) 17.5px;
        background: #fff; border-top: 1px solid #e3e8ef;
        box-shadow: 0 -4px 14px rgba(10, 30, 60, .06);
    }
    .v3-tab { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding-top: 11px; gap: 3.5px; border: 0; background: none; font: 600 12.5px/16px var(--v3-font); color: #3b4a66; text-decoration: none; cursor: pointer; }
    .v3-tab svg { width: 27px; height: 27px; }
    .v3-tab:first-child svg { width: 28.5px; height: 28.5px; margin-top: -1.5px; }
    .v3-tab .v3-tab-fill { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
    .v3-tab .v3-tab-cut { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
    .v3-tab .v3-tab-line { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
    .v3-tab.is-active { color: var(--v3-blue-m); font-weight: 700; }
    .v3-tab.is-active .v3-tab-fill { fill: currentColor; }
    .v3-tab.is-active .v3-tab-cut { stroke: #fff; }

    /* Startseite: Reihenfolge Hero, Leiste, Top-Anbieter, Ratgeber, Kategorien, Such-Band */
    .v3-hero { order: 1; }
    .v3-trust { order: 2; }
    .v3-top { order: 3; }
    .v3-rat { order: 4; }
    .v3-cats { order: 5; }
    .v3-band-wrap { order: 6; }
    .v3-h2-d { display: none; }
    .v3-h2-m { display: inline; }
    .v3-home, .v3-top, .v3-rat, .v3-cats, .v3-band-wrap { background: #fbfcfd; }

    /* Hero */
    .v3-hero { height: 457.5px; }
    .v3-hero-img {
        left: calc(89% - 606.4px); right: auto; min-width: 0; width: 1269.6px;
        background:
            linear-gradient(180deg, rgba(6, 24, 54, 0) 0, rgba(6, 24, 54, 0) 55%, rgba(4, 20, 46, .35) 100%),
            url('../img/hero-matterhorn-v2.webp') 0 0 / cover no-repeat;
        filter: none;
        -webkit-mask-image: linear-gradient(90deg, transparent 0, transparent 300px, rgba(0, 0, 0, .7) 420px, #000 520px);
        mask-image: linear-gradient(90deg, transparent 0, transparent 300px, rgba(0, 0, 0, .7) 420px, #000 520px);
    }
    .v3-hero::before {
        background:
            linear-gradient(0deg, rgba(0, 30, 70, .85) 0, rgba(0, 30, 70, .6) 25%, rgba(0, 30, 70, .25) 45%, rgba(0, 30, 70, 0) 62%),
            linear-gradient(90deg, rgba(0, 34, 78, .97) 0, rgba(0, 34, 78, .95) 15%, rgba(0, 34, 78, .85) 38%, rgba(0, 34, 78, .72) 51%, rgba(0, 34, 78, .58) 64%, rgba(0, 34, 78, .48) 77%, rgba(0, 34, 78, .25) 100%);
    }
    .v3-hero-in { padding: 27.6px 22px 26.8px 25px; align-items: stretch; }
    .v3-hero-text { max-width: none; width: 100%; }
    .v3-pill { height: 25px; padding: 1px 12px 1px 1px; border-radius: 7px; background: rgba(255, 255, 255, .14); font-size: 12px; font-weight: 700; }
    .v3-pill-x { width: 23px; height: 23px; border-radius: 6px; margin-right: 9px; }
    .v3-pill-x svg { width: 13px; height: 13px; }
    .v3-hero h1 { margin-top: 14.2px; max-width: 330px; font-size: 30px; line-height: 36.6px; }
    .v3-hero .v3-grad { background: linear-gradient(90deg, #aaf0bf 0, #a0ecb6 40%, #84e8a6 56%, #74e39f 100%); -webkit-background-clip: text; background-clip: text; }
    .v3-hero-lead { margin-top: 26px; max-width: 345px; font-size: 16px; line-height: 22.2px; font-weight: 400; color: rgba(255, 255, 255, .95); }
    .v3-br-d { display: none; }
    .v3-hero-cta { flex-direction: column; gap: 12.7px; margin-top: auto; width: 100%; }
    .v3-btn { justify-content: center; }
    .v3-btn-hero { width: 340.6px; max-width: 100%; height: 48px; padding: 0; border-radius: 9px; font-size: 16px; }
    .v3-btn-hero .v3-ico-search { width: 23px; height: 23px; margin-right: 12.5px; }
    .v3-btn-hero .v3-arr { width: 17px; height: 17px; margin-left: 7px; }
    .v3-btn-ghost { width: 343.8px; max-width: calc(100% + 3.2px); height: 52.5px; padding: 0; margin-left: -1.6px; border-radius: 10px; border: 2px solid rgba(255, 255, 255, .95); font-size: 15px; background: rgba(2, 24, 58, .25); }
    .v3-ico-book { width: 26px; height: 26px; margin-right: 11.5px; }
    .v3-glass { display: none; }
    @media (min-width: 481px) { .v3-hero-text { max-width: 480px; } }

    /* Vertrauensleiste */
    .v3-trust { box-shadow: none; border-bottom: 1px solid #eceff4; background: #fcfdfe; }
    .v3-trust-in { display: none; }
    .v3-trust-m { display: grid; grid-template-columns: 128.5fr 123fr 138.5fr; height: 124px; }
    .v3-tm { position: relative; display: flex; flex-direction: column; align-items: center; padding-top: 19px; text-align: center; color: var(--v3-ink); }
    .v3-tm + .v3-tm::before { content: ''; position: absolute; left: 0; top: 23px; height: 77px; width: 1px; background: #e2e7ee; }
    .v3-tm .v3-ti { height: 33px; width: auto; margin: 0 0 8px; }
    .v3-tm .v3-ti-ch { height: 31px; margin-bottom: 10px; }
    .v3-tm strong { font-size: 13.5px; line-height: 17.5px; font-weight: 700; }
    .v3-tm span { font-size: 13px; line-height: 17px; color: var(--v3-text); }

    /* Top Anbieter */
    .v3-top { padding-top: 26px; }
    .v3-top .v3-c { padding: 0 15px; }
    .v3-eyebrow, .v3-top-sub, .v3-tbl-wrap { display: none; }
    .v3-h2 { margin: 0 0 0 0.5px; font-size: 24px; line-height: 30px; }
    .v3-mob { display: block; }
    .v3-mtabs { display: grid; grid-template-columns: 175.1fr 170.5fr; gap: 15px; margin-top: 18.3px; }
    .v3-mtab { display: flex; align-items: center; justify-content: center; gap: 14.5px; height: 49.3px; border-radius: 10px; border: 1px solid #e3e8ef; background: linear-gradient(180deg, #fbfcfd, #f4f6fa); box-shadow: 0 2px 6px rgba(16, 32, 64, .06); font: 700 15px/1 var(--v3-font); color: var(--v3-ink); cursor: pointer; }
    .v3-mtab svg { width: 24px; height: 24px; flex: none; }
    .v3-mtab .v3-ic-wp { color: #1f6fd8; width: 23px; height: 23px; }
    .v3-mtab.is-active .v3-ic-wp { color: #fff; }
    .v3-mtab.is-active { background: linear-gradient(180deg, #1874ee 0, #0866e4 100%); border-color: #0b66e0; color: #fff; box-shadow: 0 5px 14px rgba(21, 105, 230, .28); }
    .v3-carousel { display: flex; gap: 30px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 -15px; padding: 20px 15px 6px; scroll-padding: 0 15px; scrollbar-width: none; }
    .v3-carousel::-webkit-scrollbar { display: none; }
    .v3-carousel[hidden] { display: none; }
    .v3-mcard { position: relative; flex: 0 0 100%; scroll-snap-align: start; min-height: 208px; margin-top: 8px; padding: 32.5px 16.5px 0 20px; border-radius: 14px; border: 1.5px solid #b9e6c3; background: linear-gradient(180deg, #fff 0, #f8fbf9 100%); }
    .v3-mcard.is-first { border-color: #5fc874; background: radial-gradient(130% 120% at 50% 0, #f6fef8 0, #eafbee 70%, #e2f9e8 100%); }
    .v3-mcard .v3-badge { position: absolute; left: 17.5px; top: -9.5px; height: 28.5px; padding: 0 13px; border-radius: 8px; font-size: 13px; background: #74f991; }
    .v3-mcard-top { display: flex; justify-content: space-between; align-items: flex-start; min-height: 66px; }
    .v3-mcard-id .v3-logo-wrap { display: flex; align-items: center; height: 32px; margin: 0 0 0 2px; }
    .v3-mcard-id .v3-prov-name { font-size: 21px; }
    .v3-mrate { display: flex; align-items: center; gap: 6px; margin-top: 9px; line-height: 22px; white-space: nowrap; }
    .v3-mstar { width: 18.5px; height: 18.5px; fill: var(--v3-star); }
    .v3-mrate b { font-size: 18px; font-weight: 800; color: var(--v3-ink); }
    .v3-mrate small { font-size: 15px; color: var(--v3-text); }
    .v3-mprice { display: flex; flex-direction: column; align-items: flex-start; margin: -9px -1px 0 0; }
    .v3-mprice small { font-size: 13px; line-height: 21px; color: var(--v3-text); }
    .v3-mprice small:first-child { font-size: 14px; }
    .v3-mprice b { font-size: 18.5px; line-height: 22px; font-weight: 800; color: var(--v3-ink); white-space: nowrap; }
    .v3-mcard .v3-go { display: flex; width: auto; height: 46px; margin: 14.5px -3px 0 -2.5px; border-radius: 8px; font-size: 16px; }
    /* k3: Vorlage (24,146,47), vorher (18,154,39), Befund m6 r3-handy */
    .v3-mcard .v3-go.v3-go-fill { background: linear-gradient(180deg, #179a35 0, #0e8f2c 100%); }
    .v3-mcard .v3-go .v3-arr { width: 16px; height: 16px; }
    .v3-mcard .v3-details { display: block; margin: 11.5px 0 0; text-align: center; font-size: 13.5px; line-height: 18px; color: #1f2b4d; position: relative; }
    /* k3: Trefferfläche auf 53 px (Befund M3 r3-handy), Lage im Bild unverändert */
    .v3-mcard .v3-details::after { content: ''; position: absolute; left: 0; right: 0; top: -11px; bottom: -24px; }
    .v3-mmore { display: flex; align-items: center; justify-content: center; gap: 9px; height: 24px; margin-top: 15px; font-size: 15.5px; font-weight: 700; color: var(--v3-link); position: relative; }
    .v3-mmore::after { content: ''; position: absolute; left: 0; right: 0; top: -10px; bottom: -10px; }
    .v3-mmore .v3-arr { width: 17px; height: 17px; }
    .v3-mob::after { content: ''; display: block; height: 1px; margin-top: 25.5px; background: #e6eaf0; }

    /* Ratgeber-Liste */
    .v3-rat { padding-top: 27.4px; }
    .v3-rat .v3-c { padding: 0 13.5px 0 15px; }
    .v3-rat .v3-h2s { margin-left: 2px; font-size: 24px; line-height: 30px; }
    .v3-rat .v3-sub, .v3-link-all { display: none; }
    .v3-rat-grid { grid-template-columns: 1fr; gap: 16.5px; margin-top: 16px; }
    .v3-art { flex-direction: row; align-items: stretch; min-height: 92.5px; padding: 9px 14px 4px 1.5px; border-radius: 12px; box-shadow: 0 3px 10px rgba(16, 32, 64, .07); }
    .v3-art-img { width: 106.5px; height: 77.5px; border-radius: 9px; overflow: hidden; }
    .v3-art-cat, .v3-home .v3-art p, .v3-art-meta > .v3-art-date, .v3-art-meta > .v3-art-time { display: none; }
    .v3-art-body { padding: 0 24px 0 16px; justify-content: flex-start; }
    .v3-home .v3-art h3 { font-size: 15px; line-height: 22.5px; font-weight: 700; margin-top: -0.25px; }
    .v3-art-meta { margin-top: 7.5px; padding-top: 0; font-size: 12.5px; color: #1f2a44; }
    .v3-art-meta > .v3-art-mtime { display: inline-flex; gap: 6px; }
    .v3-art-mtime svg { width: 18px; height: 18px; }
    .v3-art-chev { display: block; position: absolute; right: 9px; top: 50%; width: 9px; height: 15px; margin-top: -7.5px; color: var(--v3-ink); }

    /* Kategorien */
    .v3-cats { padding-top: 34px; }
    .v3-cats .v3-c { padding: 0 15px; }
    .v3-cats .v3-h2s { margin: 0; font-size: 24px; line-height: 30px; }
    .v3-cats .v3-sub { margin: 6px 0 0; font-size: 14.5px; line-height: 21px; font-weight: 400; color: var(--v3-text); }
    .v3-cat-grid { grid-template-columns: 1fr; gap: 10px; margin-top: 16px; }
    .v3-cat { min-height: 0; display: grid; grid-template-columns: 44px minmax(0, 1fr) 34px; column-gap: 14px; align-items: center; padding: 14px 14px 14px 12px; background: linear-gradient(180deg, #fdfeff 0, #f6f8fc 100%); }
    .v3-cat:nth-child(4) { padding-right: 14px; }
    .v3-cat-green { background: linear-gradient(170deg, #eefbf3 0, #e6f8ee 100%); }
    .v3-cat-ico { grid-row: span 2; margin: 0; width: 40px; height: 36px; }
    .v3-home .v3-cat h3 { margin: 0; font-size: 15.5px; line-height: 20px; }
    .v3-home .v3-cat p { margin: 2px 0 0; grid-column: 2; font-size: 13px; font-weight: 400; color: #1f2a44; }
    .v3-cat-go { grid-column: 3; grid-row: 1 / span 2; margin: 0; }

    /* Such-Band */
    .v3-band-wrap { padding: 28px 15px 32px; }
    .v3-band { display: block; padding: 20px 18px; border-radius: 14px; }
    /* k3: Symbol links vor dem Titel wie im Desktop-Band der Vorlage (Befund m3 r3-handy) */
    .v3-band-ico { position: absolute; left: 18px; top: 18px; width: 28px; height: 28px; margin: 0; opacity: .9; }
    .v3-band-text { padding-left: 44px; }
    .v3-band-text { margin: 0; padding-right: 40px; }
    .v3-home .v3-band h2 { font-size: 18px; line-height: 23px; white-space: normal; }
    .v3-home .v3-band p { margin-top: 3px; font-size: 13px; font-weight: 400; color: rgba(255, 255, 255, .9); }
    .v3-band-form { width: 100%; margin: 14px 0 0; }
    .v3-band-search { gap: 8px; }
    .v3-band-search .v3-search-input { flex: 1; min-width: 0; width: auto; height: 44px; padding: 0 10px; font-size: 16px; }
    .v3-band-btn { width: auto; height: 44px; padding: 0 13px; font-size: 14px; }
    .v3-home .v3-band-checks { flex-wrap: wrap; gap: 6px 10px; margin-top: 12px; }
    .v3-band-checks li { font-size: 11px; line-height: 16px; font-weight: 400; color: rgba(255, 255, 255, .95); }
    .v3-band-checks .v3-ck { width: 11px; height: 11px; }
    /* k3: bei 360 brachen die drei Haken um («Täglich aktualisiert» allein in Zeile 2), Befund m2 r3-handy */
    @media (max-width: 380px) {
        .v3-home .v3-band-checks { flex-wrap: nowrap; gap: 8px; }
        .v3-band-checks li { font-size: 10px; gap: 4px; }
        .v3-band-checks .v3-ck { width: 9px; height: 9px; }
    }

    /* Fuss */
    .site-footer.v3-footer { padding: 34px 0 calc(24px + 79.5px + env(safe-area-inset-bottom)); }
    .v3-footer-in { padding: 0 20px; }
    .v3-footer-top { grid-template-columns: 1fr; gap: 26px; }
    .v3-logo--light .v3-logo-icon { width: 34.5px; height: 29px; }
    .v3-logo--light .v3-logo-text { margin-top: 4px; }
    .v3-footer-bottom { flex-direction: column; align-items: flex-start; }

    /* Such-Overlay */
    .v3-search { padding-top: 70px; }

    /* Unterseiten: breite Inhaltstabellen scrollen in sich statt die Seite zu verbreitern */
    .site-main table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .site-main :where(p, li, dd, blockquote) { overflow-wrap: break-word; }

    /* Unterseiten: fixierte Leisten ueber der Tab-Leiste */
    .compare-bar { bottom: calc(79.5px + env(safe-area-inset-bottom)); }
}
@media (max-width: 380px) {
    .v3-logo-name { font-size: 14.5px; }
    .v3-logo-text { margin-left: 9px; }
    .v3-logo-icon { width: 31px; height: 26px; }
    .v3-mrate small { display: none; }
}
@media (max-width: 340px) {
    .v3-logo-name { font-size: 13px; }
    .v3-hero h1 { font-size: 27px; line-height: 33px; }
}


/* =====================================================================
   Ab hier: Korrekturen aus den unabhängigen Prüfungen (R2, S1, S2)
   jeweils mit Quelle und Befund-Nummern. Nicht wegoptimieren, ohne
   die Prüfberichte in _ref/pruefung/ zu lesen.
   ===================================================================== */
/* =====================================================================
   Korrektur R2 Desktop (Prüfer r2, 13.11.2026), eingearbeitet 13.11.2026 k2
   Nur Desktop (ab 1040 px), damit Handy und Tablet unberührt bleiben.
   Nummern = Befund-Nummern im Bericht _ref/pruefung/r2-desktop.md
   D1 (rosa Streifen ab 1280 px) und D2 (flaues Foto) sind im Bild selbst
   behoben (hero/grade_k2.py), darum hier nicht als CSS-Notlösung.
   ===================================================================== */
@media (min-width: 1040px) {

/* ---------- D3 H1-Verlauf: helleres Neon-Mint, Ende heller wie «entscheiden.» */
.v3-hero .v3-grad {
    background: linear-gradient(90deg, #fff 0, #fff 8%, #b2f6cb 17%, #7cf7a6 30%, #7af6a4 58%, #a6f4c3 80%, #c9f6da 100%);
    -webkit-background-clip: text; background-clip: text;
}

/* ---------- D4 Pille */
.v3-pill { border-radius: 11px; background: rgba(67, 159, 225, .36); font-weight: 700; padding-right: 11px; letter-spacing: -.005em; }
.v3-pill-x svg { width: 23px; height: 23px; }

/* ---------- D5 Glas-Box: Haken grösser, Text 600 */
.v3-glass .v3-ck { width: 17.6px; height: 17.6px; margin-left: -1.4px; margin-right: 13.7px; }
.v3-home .v3-glass li { font-weight: 600; letter-spacing: -.012em; }

/* ---------- D6 Wortabstände (Plus Jakarta: Leerzeichen 0,16 bis 0,19 em, Vorlage breiter) */
.v3-header .v3-logo-tag { font-weight: 600; word-spacing: .14em; letter-spacing: -.028em; }
.v3-home :is(.v3-hero-lead, .v3-sub, .v3-tt small, .v3-cat p, .v3-art p, .v3-band p, .v3-c-rate small, .v3-c-feat > span, .v3-art-meta, .v3-band-checks li) { word-spacing: .09em; letter-spacing: -.008em; }
.v3-home .v3-glass li { word-spacing: .09em; }

/* ---------- D7 Vertrauensleiste: Titel 6 bis 8 % zu breit, Lorbeer zu hoch */
.v3-tt strong { letter-spacing: -.035em; word-spacing: .08em; }
.v3-t4 .v3-ti { clip-path: inset(16% 0 0 0); }

/* ---------- D8 Top-Abschnitt: Eyebrow-Blau, grüner H2-Teil weiter gesperrt */
.v3-eyebrow { color: #0b3db5; }
.v3-h2 em { letter-spacing: .035em; }

/* ---------- D9 Tabs: Reihe endet innerhalb der Tabelle (Vorlage 991 px, Tabelle 1009 px) */
.v3-tabs { gap: 10px; }
.v3-tab-btn:nth-child(1) svg { width: 26px; height: 26px; margin: 0 -1px 0 -1.5px; }
.v3-tab-btn:nth-child(3) svg { width: 29.5px; height: 29.5px; margin: 0 -2px 0 -2.5px; }
.v3-tab-btn:nth-child(4) { padding: 0 12px; gap: 10px; letter-spacing: -.01em; }
.v3-tab-btn:nth-child(5) { padding: 0 17px 0 19px; }
.v3-tab-btn:nth-child(5) svg { width: 24px; height: 24px; margin: 0 -1px 0 -2px; }

/* ---------- D10 Tabelle: Sterne runder (Grösse fast wie bisher), Haken grösser, Zeile 1 Inhalt höher, Kopf */
.v3-panel .v3-stars { height: 17px; margin: 2.5px 0 3.5px; }
.v3-panel .v3-stars svg { width: 17px; height: 17px; margin-right: 1.2px; stroke-width: 1px; stroke-linejoin: round; }
.v3-panel .v3-stars-fg svg { stroke: var(--v3-star); }
.v3-panel .v3-stars-bg svg { stroke: #d9dee6; }
.v3-c-feat .v3-ck { width: 13.5px; height: 13.5px; margin-left: -1px; margin-right: 10.5px; }
.v3-panel .v3-tr.is-first { padding: 11px 0 17px; }
.v3-th .v3-info { width: 15px; height: 15px; vertical-align: -3px; }
.v3-th .v3-c-rank { padding-left: 24.6px; }

/* ---------- D11 Kategorien: Symbole Grösse/Lage, Abschnitt höher (Ratgeber-Abstand gleicht aus) */
.v3-cats .v3-sub { margin-top: 3.5px; }
.v3-cat-grid { margin-top: 22.3px; }
.v3-rat { padding-top: 41px; }
.v3-cat:nth-child(2) .v3-cat-wp { margin: -2.7px 0 .7px 5.3px; }
.v3-cat:nth-child(3) .v3-cat-ico { width: 45px; height: 33.3px; margin: -1.2px 0 3.9px 4.5px; }
.v3-cat:nth-child(4) .v3-cat-ico { width: 43.3px; height: 41.2px; margin: -4.6px 0 -.6px 6.1px; }
.v3-cat:nth-child(5) .v3-cat-ico { width: 41.6px; height: 41.6px; margin: -4.75px 0 -.85px 3.75px; }

/* ---------- D12 Ratgeber: Unterzeile bündig mit H2, Meta-Symbole */
.v3-rat .v3-sub { margin-left: 1.8px; }
.v3-art-meta svg { width: 18px; height: 18px; margin: -1px 0; }
.v3-art-meta > span { gap: 6px; }

/* ---------- D13 Such-Band: Radien und Glimmen wie Vorlage */
.v3-band-wrap { padding-top: 12.5px; }
.v3-band { padding-top: 1.5px; }
.v3-band-search .v3-search-input, .v3-band-btn { border-radius: 8.5px; }
.v3-band-btn { box-shadow: 0 4px 14px rgba(106, 240, 140, .32); }

/* ---------- D14 Schriftfarbe: Vorlage fast schwarz */
.v3-home, .v3-header { --v3-ink: #05070d; }

}

/* =====================================================================
   Korrektur R2 Handy (Prüfer r2, 13.11.2026), eingearbeitet 13.11.2026 k2
   Nur Handy (bis 768 px). Nummern = Befunde im Bericht r2-handy.md.
   ===================================================================== */
@media (max-width: 768px) {

    /* H1 Kopf: Wortmarke 1 px tiefer (Grundlinie Vorlage 38.5), dunkles Navy statt Fast-Schwarz */
    .v3-header .v3-logo-text { margin-top: 21.9px; }
    .v3-header .v3-logo-name { color: #0c1329; }

    /* H2 Rot wie Vorlage: #d5152b statt #e3142b (Kopf-Kreuz, Pille, Vertrauensleiste) */
    :root { --v3-red: #d5152b; }
    .v3-cross rect, .v3-ti-ch rect { fill: #d5152b; }

    /* H3 Pille: 26.5 hoch, rotes Feld 24 bündig links (x 25), Kreuz 13 px (Balken 4 px), hellerer blauer Glas-Grund mit Lichtkante (Vorlage 33,83,130 statt 36,65,103) */
    .v3-pill { height: 26.5px; padding: 1.25px 12px 1.25px 0; background: rgba(110, 175, 235, .33); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12); font-size: 12.5px; }
    .v3-pill-x { width: 24px; height: 24px; }
    .v3-pill-x svg { width: 19.3px; height: 19.3px; }
    .v3-hero h1 { margin-top: 12.9px; }

    /* H4 Hero-Foto: unterer Teil (Gletscher, Seeufer) dunkel wie Vorlage, Schattenseite und Himmel rechts dunkler */
    .v3-hero::before {
        background:
            linear-gradient(0deg, rgba(0, 30, 70, .93) 0, rgba(0, 30, 70, .9) 38%, rgba(0, 30, 70, .72) 48%, rgba(0, 30, 70, .4) 56%, rgba(0, 30, 70, .12) 63%, rgba(0, 30, 70, 0) 68%),
            /* k3: rechts weniger Navy, damit die Ostwand so hell bleibt wie in der Handy-Vorlage (Befund M2) */
            linear-gradient(90deg, rgba(0, 34, 78, .97) 0, rgba(0, 34, 78, .95) 15%, rgba(0, 34, 78, .82) 38%, rgba(0, 34, 78, .66) 51%, rgba(0, 34, 78, .48) 64%, rgba(0, 34, 78, .36) 77%, rgba(0, 34, 78, .22) 100%);
    }
    /* H5 Alpenglühen auf der Ostwand: warmes Licht entlang des linken Grats (Grat-Linie 118.6deg / 323 px), oben und unten ausgeblendet.
       Box 390 px breit und am Gipfel verankert (Gipfel sitzt bei 89 %), damit das Licht auf 360/430 mitwandert. */
    .v3-hero::after {
        content: ''; position: absolute; top: 0; bottom: 0; left: calc(89% - 347.1px); width: 390px; z-index: -1; pointer-events: none;
        /* k3: Bild ist seit k2 selbst warm, darum rosé statt orange und tiefer dosiert (Befund M2, r3-handy) */
        background: linear-gradient(118.6deg, rgba(240, 210, 220, 0) 317px, rgba(240, 210, 220, .55) 326px, rgba(240, 210, 220, .48) 352px, rgba(240, 210, 220, 0) 378px);
        mix-blend-mode: overlay;
        -webkit-mask-image: linear-gradient(180deg, transparent 28px, #000 50px, #000 140px, transparent 200px);
        mask-image: linear-gradient(180deg, transparent 28px, #000 50px, #000 140px, transparent 200px);
    }

    /* H6 Absatz: Gewicht 500 und reines Weiss wie Vorlage */
    .v3-hero-lead { font-weight: 500; color: #fff; }

    /* H7 Buttons: Breite relativ statt fix (390: unverändert 340.6 / 343.8; 430: kein 64-px-Loch rechts) */
    .v3-btn-hero { width: calc(100% - 2.4px); }
    .v3-btn-ghost { width: calc(100% + .8px); max-width: none; }

    /* V1 Vertrauensleiste: Trennlinien 544 bis 630 wie Vorlage */
    .v3-tm + .v3-tm::before { top: 19px; height: 86px; }
    /* V2 Icons dunkles Navy statt Royalblau */
    .v3-tm .v3-ti { color: #10244a; }
    /* V3 Texte: 13 px fett, dritte Zeile dunkel (#121d36), 600, 12.5 px, 2 px höher */
    .v3-tm strong { font-size: 13px; }
    .v3-tm span { font-size: 12.5px; font-weight: 600; color: #121d36; margin-top: -2px; }
    /* V4 Abschlusslinie kräftiger */
    .v3-trust { border-bottom: 1px solid #e1e5eb; }

    /* T1 H2 ohne negative Laufweite, Kante wie Vorlage */
    .v3-h2 { letter-spacing: 0; margin-left: -0.5px; }
    /* T2 aktiver Tab ohne blauen Schein darunter */
    .v3-mtab.is-active { box-shadow: 0 2px 5px rgba(16, 32, 64, .10); }
    /* T3 WordPress-Symbol als gefüllte blaue Scheibe mit weissem W (Vorlage), Gruppe 3 px nach rechts */
    .v3-mtab .v3-ic-wp { width: 24px; height: 24px; color: #fff; border-radius: 50%; background: radial-gradient(circle closest-side, #2a6fdb 0, #2a6fdb 89.5%, transparent 90.5%); }
    .v3-mtab.is-active .v3-ic-wp { color: #2a6fdb; background: radial-gradient(circle closest-side, #fff 0, #fff 89.5%, transparent 90.5%); }
    .v3-mtab + .v3-mtab { padding-left: 5px; gap: 15px; }
    /* k3: Vorlage zeigt im Kategorien-Icon den Ring (R2 T3 hatte es zur Scheibe gekippt), Befund m1 r3-handy */
    .v3-cat .v3-cat-wp { color: #1f6fd8; background: none; }

    /* K1 Karte: Rahmen 2 px, kräftigeres Grün; unten grüner */
    .v3-mcard.is-first { border: 2px solid #4fb363; background: radial-gradient(130% 120% at 50% 0, #f6fef8 0, #e7faec 60%, #dcf8e4 100%); }
    /* Rahmen 2 px wirkt real +1 px (1.5 px wurde als 1 px gerastert): Innenabstand und Badge zurückholen */
    .v3-mcard.is-first { padding: 31.5px 15.5px 0 19px; }
    .v3-mcard.is-first .v3-badge { top: -10.5px; left: 16.5px; }
    /* K2 Badge-Innenabstand 11 statt 13 */
    .v3-mcard .v3-badge { padding: 0 11px; }
    /* K3 Preisblock: «ab» 15 px, «/ Monat» 1 px tiefer */
    .v3-mprice small:first-child { font-size: 15px; position: relative; top: -1.5px; }
    .v3-mprice small:last-child { margin-top: 1px; }
    /* K4 Details: 600 statt 500, dunkles Navy statt #1f2b4d (Grösse 13.5 bleibt, Breite dann 131 wie Vorlage) */
    .v3-mcard .v3-details { font-weight: 600; color: #102049; }

    /* L1 Link: Pfeil näher, Gruppe 2.5 px nach rechts, dunkleres Blau */
    .v3-mmore { gap: 7px; padding-left: 3px; color: #0b3cbc; }
    /* L2 Trennlinie 1.5 px, etwas dunkler, 0.5 px tiefer */
    .v3-mob::after { height: 1.5px; margin-top: 26px; background: #e1e5ec; }

    /* R1 Ratgeber-Titel 2.75 px zu tief, Karten 1 px zu tief */
    .v3-rat { padding-top: 23.6px; }
    .v3-rat-grid { margin-top: 17.6px; }
    /* R2 Artikeltitel 16 px wie Vorlage (Breiten 151/153.5/179.5/181 = Jakarta 16/700)
       k3: drei Zeilen statt zwei, sonst schneidet die Klemme die Titel ab (Befund M1 r3-handy) */
    .v3-home .v3-art h3 { font-size: 16px; line-height: 22.5px; color: #05070f; -webkit-line-clamp: 3; line-clamp: 3; }
    .v3-art-img { height: auto; align-self: stretch; }
    @media (max-width: 380px) { .v3-home .v3-art h3 { font-size: 15px; line-height: 21px; } }
    /* R3 Uhr 1.5 px nach links, Abstand Uhr zu Text 4.5 */
    .v3-art-meta > .v3-art-mtime { gap: 4.5px; }
    .v3-art-mtime svg { margin-left: -1.5px; }

    /* B1 Tab-Leiste: Oberkante 1.5 px höher (1371), Inhalt bleibt; Grau ohne Blaustich, Aktiv-Blau heller */
    .v3-tabbar { height: calc(81px + env(safe-area-inset-bottom)); }
    .v3-tab { padding-top: 12.5px; color: #39445a; }
    .v3-tab.is-active { color: #1773f1; }

    /* U1 Kategorien-Titel ohne Einzelwort in Zeile 2 (360 px: «dir?») */
    .v3-cats .v3-h2s { text-wrap: balance; }
}

/* =====================================================================
   Korrektur R3 Handy (Prüfer r3, 13.11.2026): Trefferflächen im Such-Overlay
   und im Handy-Menü, Befunde M3. Bericht: _ref/pruefung/r3-handy.md
   ===================================================================== */
@media (max-width: 768px) {
    .v3-search .v3-search-input { padding-top: 11px; padding-bottom: 11px; }
    .v3-search-close { position: relative; }
    .v3-search-close::after { content: ''; position: absolute; inset: -4px; }
    .mobile-nav-item { min-height: 44px; }
    .v3-footer-legal a { display: inline-flex; align-items: center; min-height: 32px; }
}

/* =====================================================================
   Korrektur R3 Desktop (Prüfer r3, 13.11.2026), Befunde R3-2, R3-4, R3-5.
   R3-1 (Hero-Foto) ist im Bild selbst behoben: _ref/hero/grade_k3.py.
   ===================================================================== */
@media (min-width: 1040px) {
    .v3-cat-grid { gap: 8px; }
    .v3-badge { border-radius: 999px; height: 21.2px; padding: 0 11px; }
    .v3-tr.is-first .v3-c-prov { gap: 4.5px; }
    .v3-cat-go .v3-arr { width: 18.5px; height: 18.5px; }
}
