/* ============================================================
   LANDING PAGE – lp-*.css
   Walther Systemtechnik Theme v1.3
   ============================================================ */

/* ── Basis ── */
.lp-wrap { font-family: 'Open Sans', sans-serif; }
.lp-overline {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #1a9ddb;
    margin-bottom: 12px;
}
.lp-overline--light { color: #7dd4f5; }

/* ── Buttons ── */
.lp-btn--primary {
    display: inline-flex;
    align-items: center;
    background: #1a9ddb;
    color: #fff !important;
    border: none;
    padding: 14px 28px;
    font-size: 0.95rem;
    font-weight: 700;
    border-radius: 2px;
    text-decoration: none;
    transition: background 0.2s;
    cursor: pointer;
}
.lp-btn--primary:hover { background: #0f7eb8; }
.lp-btn--ghost {
    display: inline-flex;
    align-items: center;
    background: transparent;
    color: #fff !important;
    border: 2px solid rgba(255,255,255,0.6);
    padding: 12px 26px;
    font-size: 0.95rem;
    font-weight: 600;
    border-radius: 2px;
    text-decoration: none;
    transition: border-color 0.2s, background 0.2s;
}
.lp-btn--ghost:hover { border-color: #fff; background: rgba(255,255,255,0.08); }
.lp-btn--full { width: 100%; justify-content: center; }

/* ══════════════════════════════
   1. HERO
══════════════════════════════ */
.lp-hero {
    position: relative;
    color: #fff;
    padding-top: 0;
    overflow: hidden;
    min-height: 480px;
}
/* Hintergrundfarbe: weiß/hell → dunkle Texte */
.lp-hero[style*="background:#ffffff"] h1,
.lp-hero[style*="background:#ffffff"] .lp-hero__h1,
.lp-hero[style*="background:#f7f7f7"] h1,
.lp-hero[style*="background:#f7f7f7"] .lp-hero__h1 {
    color: #3a3a3a !important;
}
.lp-hero[style*="background:#ffffff"] .lp-hero__text,
.lp-hero[style*="background:#f7f7f7"] .lp-hero__text {
    color: rgba(58,58,58,0.8) !important;
}
.lp-hero[style*="background:#ffffff"] .lp-hero__badge,
.lp-hero[style*="background:#f7f7f7"] .lp-hero__badge {
    background: rgba(0,145,209,0.1);
    border-color: rgba(0,145,209,0.3);
    color: #0091d1;
}
/* Vollbild-Hintergrundbild */
.lp-hero__bg {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100%; height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 0;
}
.lp-hero__bg--video { background: none; }
.lp-hero__overlay {
    position: relative;
    z-index: 1;
}
.lp-hero__stats {
    position: relative;
    z-index: 1;
}
/* Rechtes Bild im 2-Spalten-Grid */
.lp-hero__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
    padding-top: 64px;
    padding-bottom: 64px;
}
.lp-hero__img img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 4px;
}
.lp-hero__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
    padding-top: 64px;
    padding-bottom: 64px;
}
.lp-hero__badge {
    display: inline-block;
    background: rgba(26,157,219,0.25);
    border: 1px solid rgba(26,157,219,0.5);
    color: #7dd4f5;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 2px;
    margin-bottom: 20px;
}
.lp-hero__h1 {
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 20px;
    color: #fff;
}
.lp-hero__colored { color: #1a9ddb; }
.lp-hero__text {
    font-size: 0.95rem;
    line-height: 1.7;
    color: rgba(255,255,255,0.8);
    margin: 0 0 28px;
    max-width: 520px;
}
.lp-hero__ctas {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}
.lp-hero__sub {
    font-size: 0.78rem;
    color: rgba(255,255,255,0.5);
    margin: 0;
}
.lp-hero__img img {
    width: 100%;
    border-radius: 4px;
    object-fit: cover;
}
/* Stats-Leiste */
.lp-hero__stats {
    background: rgba(0,0,0,0.25);
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 20px 0;
}
.lp-hero__stats-inner {
    display: flex;
    gap: 48px;
    flex-wrap: wrap;
}
.lp-hero__stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.lp-hero__stat-value {
    font-size: 1.6rem;
    font-weight: 800;
    color: #1a9ddb;
    line-height: 1;
}
.lp-hero__stat-label {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
}

/* ══════════════════════════════
   2. PROBLEM
══════════════════════════════ */
.lp-problem {
    background: #1e2d3a;
    color: #fff;
    padding: 72px 0;
}
.lp-problem__h2 {
    font-size: clamp(1.4rem, 2.2vw, 1.9rem);
    font-weight: 700;
    color: #fff;
    margin: 0 0 12px;
}
.lp-problem__sub {
    font-size: 0.95rem;
    color: rgba(255,255,255,0.65);
    margin: 0 0 40px;
    max-width: 680px;
}
.lp-problem__cards {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 24px;
}
.lp-problem__card {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    border-top: 3px solid #1a9ddb;
    border-radius: 2px;
    padding: 24px;
}
.lp-problem__card-title {
    font-size: 1rem;
    font-weight: 700;
    color: #1a9ddb;
    margin: 0 0 12px;
}
.lp-problem__card-text {
    font-size: 0.875rem;
    line-height: 1.65;
    color: rgba(255,255,255,0.75);
    margin: 0;
}

/* ══════════════════════════════
   3. VORTEILE
══════════════════════════════ */
.lp-advantages {
    background: #f7f7f7;
    padding: 72px 0;
}
.lp-advantages__h2 {
    font-size: clamp(1.4rem, 2.2vw, 1.9rem);
    font-weight: 700;
    color: #2c3e50;
    margin: 0 0 12px;
}
.lp-advantages__sub {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #495a65;
    margin: 0 0 40px;
    max-width: 680px;
}
.lp-advantages__cards {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 24px;
}
.lp-advantages__card {
    background: #fff;
    border: 1px solid #e4e4e4;
    border-top: 3px solid #1a9ddb;
    border-radius: 2px;
    padding: 28px 24px;
}
.lp-advantages__card-value {
    font-size: 2.4rem;
    font-weight: 800;
    color: #1a9ddb;
    line-height: 1;
    margin-bottom: 4px;
}
.lp-advantages__card-label {
    font-size: 0.875rem;
    font-weight: 700;
    color: #2c3e50;
    margin-bottom: 12px;
}
.lp-advantages__card-text {
    font-size: 0.85rem;
    line-height: 1.65;
    color: #495a65;
    margin: 0;
}

/* ══════════════════════════════
   4. PROZESS
══════════════════════════════ */
.lp-process {
    background: #f1f1f1;
    padding: 72px 0;
}
.lp-process__h2 {
    font-size: clamp(1.4rem, 2.2vw, 1.9rem);
    font-weight: 700;
    color: #2c3e50;
    margin: 0 0 12px;
}
.lp-process__sub {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #495a65;
    margin: 0 0 40px;
    max-width: 680px;
}
.lp-process__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: start;
}
.lp-process__steps { display: flex; flex-direction: column; gap: 28px; }
.lp-process__step {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}
.lp-process__step-num {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #1a9ddb;
    color: #fff;
    font-weight: 800;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.lp-process__step-title {
    font-size: 1rem;
    font-weight: 700;
    color: #2c3e50;
    margin: 0 0 6px;
}
.lp-process__step-text {
    font-size: 0.875rem;
    line-height: 1.65;
    color: #495a65;
    margin: 0;
}
.lp-process__right {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid #e4e4e4;
    border-radius: 4px;
    min-height: 280px;
}
.lp-process__right-label {
    font-size: 1.4rem;
    font-weight: 700;
    color: #b3bfcc;
    text-align: center;
}

/* ══════════════════════════════
   5. TESTIMONIALS
══════════════════════════════ */
.lp-testimonials {
    background: #fff;
    padding: 72px 0;
}
.lp-testimonials__h2 {
    font-size: clamp(1.3rem, 2vw, 1.75rem);
    font-weight: 700;
    color: #2c3e50;
    margin: 0 0 28px;
    max-width: 700px;
}
.lp-testimonials__tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 36px;
    flex-wrap: wrap;
    border-bottom: 2px solid #e4e4e4;
    padding-bottom: 0;
}
.lp-test-tab {
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    padding: 8px 20px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #888;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    transition: color 0.2s, border-color 0.2s;
}
.lp-test-tab--active,
.lp-test-tab:hover {
    color: #1a9ddb;
    border-bottom-color: #1a9ddb;
}
.lp-testimonials__quotes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 36px;
}
.lp-testimonials__quote {
    background: #f7f9fb;
    border: 1px solid #e4e4e4;
    border-radius: 2px;
    padding: 28px;
}
.lp-testimonials__quote-text {
    font-size: 0.9rem;
    line-height: 1.7;
    color: #2c3e50;
    font-style: italic;
    margin: 0 0 20px;
}
.lp-testimonials__quote-author {
    display: flex;
    align-items: center;
    gap: 12px;
}
.lp-testimonials__avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #1a9ddb;
    color: #fff;
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.lp-testimonials__name {
    font-weight: 700;
    font-size: 0.875rem;
    color: #2c3e50;
}
.lp-testimonials__role {
    font-size: 0.78rem;
    color: #888;
}
.lp-testimonials__trust {
    display: flex;
    gap: 32px;
    flex-wrap: wrap;
    padding-top: 24px;
    border-top: 1px solid #e4e4e4;
}
.lp-testimonials__trust-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    color: #495a65;
    font-weight: 600;
}
.lp-check { color: #1a9ddb; font-weight: 700; }

/* ══════════════════════════════
   6. CTA + FORMULAR
══════════════════════════════ */
.lp-cta-form {
    background: #1e2d3a;
    padding: 72px 0;
    color: #fff;
}
.lp-cta-form__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: start;
}
.lp-cta-form__h2 {
    font-size: clamp(1.4rem, 2.2vw, 1.9rem);
    font-weight: 700;
    color: #fff;
    margin: 0 0 16px;
}
.lp-cta-form__text {
    font-size: 0.9rem;
    line-height: 1.7;
    color: rgba(255,255,255,0.75);
    margin: 0 0 24px;
}
.lp-cta-form__bullets {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.lp-cta-form__bullets li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.875rem;
    color: rgba(255,255,255,0.85);
}
.lp-check-blue { color: #1a9ddb; font-weight: 700; flex-shrink: 0; }
/* Formular-Box rechts */
.lp-cta-form__right {
    background: #fff;
    border-radius: 4px;
    padding: 32px;
}
.lp-form-step-indicator {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #1a9ddb;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 2px solid #e4e4e4;
}
.lp-cta-form__right h3 {
    font-size: 1.1rem;
    font-weight: 700;
    color: #2c3e50;
    margin: 0 0 20px;
}
.lp-cta-form__right p {
    font-size: 0.875rem;
    color: #495a65;
    margin: 0 0 8px;
}
.lp-cta-form__right select {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #e4e4e4;
    border-radius: 2px;
    font-size: 0.875rem;
    color: #888;
    margin-bottom: 16px;
    background: #fff;
}

/* ══════════════════════════════
   RESPONSIVE
══════════════════════════════ */
@media (max-width: 900px) {
    .lp-hero__inner         { grid-template-columns: 1fr; }
    .lp-hero__img           { display: none; }
    .lp-problem__cards      { grid-template-columns: 1fr; }
    .lp-advantages__cards   { grid-template-columns: 1fr; }
    .lp-process__inner      { grid-template-columns: 1fr; }
    .lp-process__right      { display: none; }
    .lp-testimonials__quotes{ grid-template-columns: 1fr; }
    .lp-cta-form__inner     { grid-template-columns: 1fr; }
    .lp-hero__stats-inner   { gap: 24px; }
}

/* ═══════════════════════════════════════════════
   LP: Gemeinsame Section-Elemente
═══════════════════════════════════════════════ */
.lp-section__badge {
    font-size:.72rem;font-weight:700;letter-spacing:.12em;
    text-transform:uppercase;margin-bottom:12px;
}
.lp-section__h2 {
    font-size:clamp(1.5rem,2.5vw,2.2rem);font-weight:800;
    line-height:1.25;margin:0 0 16px;
}
.lp-section__sub {
    font-size:.95rem;line-height:1.7;margin:0 0 40px;max-width:640px;
}

/* ═══════════════════════════════════════════════
   LP: Problem
═══════════════════════════════════════════════ */
.lp-problem { padding:64px 0; }
.lp-problem__grid {
    display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
    margin-top:40px;
}
.lp-problem__card {
    padding:24px;border-radius:6px;
}
.lp-problem__card-title {
    font-size:1rem;font-weight:700;margin:0 0 10px;
}
.lp-problem__card-text {
    font-size:.9rem;line-height:1.6;margin:0;
}
@media(max-width:768px) {
    .lp-problem__grid { grid-template-columns:1fr; }
}

/* ═══════════════════════════════════════════════
   LP: Advantages
═══════════════════════════════════════════════ */
.lp-advantages { padding:64px 0; }
.lp-advantages__grid {
    display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
    margin-top:40px;
}
.lp-advantages__card {
    padding:28px;border:2px solid #0091d1;border-radius:6px;
}
.lp-advantages__value {
    font-size:clamp(2rem,4vw,3rem);font-weight:900;
    color:#0091d1;line-height:1;margin-bottom:8px;
}
.lp-advantages__title {
    font-size:.95rem;font-weight:700;color:#3a3a3a;margin:0 0 10px;
}
.lp-advantages__text {
    font-size:.88rem;line-height:1.6;color:rgba(58,58,58,.75);margin:0;
}
@media(max-width:768px) {
    .lp-advantages__grid { grid-template-columns:1fr; }
}

/* ═══════════════════════════════════════════════
   LP: Process
═══════════════════════════════════════════════ */
.lp-process { padding:64px 0; }
.lp-process__inner {
    display:grid;grid-template-columns:1fr 1fr;gap:60px;
    align-items:center;margin-top:40px;
}
.lp-process__step {
    display:flex;gap:16px;align-items:flex-start;margin-bottom:32px;
}
.lp-process__step:last-child { margin-bottom:0; }
.lp-process__num {
    width:36px;height:36px;flex-shrink:0;
    background:#0091d1;color:#fff;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-weight:800;font-size:.9rem;
}
.lp-process__step-title {
    font-size:.95rem;font-weight:700;margin:0 0 6px;color:#3a3a3a;
}
.lp-process__step-text {
    font-size:.88rem;line-height:1.6;margin:0;color:rgba(58,58,58,.75);
}
.lp-process__label-box {
    display:flex;align-items:center;justify-content:center;
    background:#e8f4fb;border-radius:8px;min-height:200px;
    font-size:1.4rem;font-weight:800;color:#0091d1;text-align:center;
    padding:32px;
}
@media(max-width:768px) {
    .lp-process__inner { grid-template-columns:1fr; }
}

/* ═══════════════════════════════════════════════
   LP: Testimonials
═══════════════════════════════════════════════ */
.lp-testimonials { padding:64px 0; }
.lp-tst__tabs {
    display:flex;flex-wrap:wrap;gap:8px;margin:32px 0 24px;
    border-bottom:1px solid #e0e0e0;padding-bottom:0;
}
.lp-tst__tab {
    background:none;border:none;cursor:pointer;
    padding:10px 16px;font-size:.82rem;font-weight:600;
    color:#888;letter-spacing:.06em;text-transform:uppercase;
    border-bottom:2px solid transparent;margin-bottom:-1px;
    transition:color .2s,border-color .2s;
}
.lp-tst__tab--active { color:#0091d1;border-bottom-color:#0091d1; }
.lp-tst__panel { display:none; }
.lp-tst__panel--active { display:block; }
.lp-tst__grid {
    display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px;
}
.lp-tst__card {
    background:#f7f7f7;border-radius:6px;padding:28px;
}
.lp-tst__quote {
    font-size:.92rem;line-height:1.7;color:#3a3a3a;margin:0 0 20px;
    font-style:italic;
}
.lp-tst__author { display:flex;align-items:center;gap:12px; }
.lp-tst__avatar {
    width:40px;height:40px;border-radius:50%;
    background:#0091d1;color:#fff;display:flex;
    align-items:center;justify-content:center;
    font-weight:700;font-size:.85rem;flex-shrink:0;
}
.lp-tst__name { font-weight:700;font-size:.88rem;color:#3a3a3a; }
.lp-tst__role { font-size:.8rem;color:#888; }
.lp-tst__trust {
    display:flex;flex-wrap:wrap;gap:24px;margin-top:40px;
    padding-top:32px;border-top:1px solid #e0e0e0;
}
.lp-tst__trust-item {
    display:flex;align-items:center;gap:8px;
    font-size:.88rem;color:#3a3a3a;font-weight:600;
}
.lp-tst__trust-icon { color:#0091d1;font-weight:800; }
@media(max-width:768px) {
    .lp-tst__grid { grid-template-columns:1fr; }
}

/* ═══════════════════════════════════════════════
   LP: CTA
═══════════════════════════════════════════════ */
.lp-cta { padding:64px 0; }
.lp-cta__inner {
    display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;
}
.lp-cta__h2 {
    font-size:clamp(1.4rem,2.2vw,2rem);font-weight:800;
    line-height:1.25;margin:0 0 16px;
}
.lp-cta__sub {
    font-size:.92rem;line-height:1.7;margin:0 0 24px;
}
.lp-cta__bullets {
    list-style:none;padding:0;margin:0;
}
.lp-cta__bullets li {
    padding:6px 0 6px 24px;position:relative;
    font-size:.9rem;line-height:1.5;color:rgba(255,255,255,.85);
}
.lp-cta__bullets li::before {
    content:"✓";position:absolute;left:0;color:#0091d1;font-weight:700;
}
.lp-cta__form-box {
    background:#fff;border-radius:8px;padding:32px;color:#3a3a3a;
}
.lp-cta__form-title {
    font-size:.78rem;font-weight:700;letter-spacing:.1em;
    text-transform:uppercase;color:#0091d1;margin:0 0 20px;
}
.lp-cta__step { display:none; }
.lp-cta__step--active { display:block; }
.lp-cta__step-label {
    font-size:.72rem;color:#888;font-weight:600;
    letter-spacing:.08em;margin-bottom:8px;
}
.lp-cta__step-title {
    font-size:1.1rem;font-weight:800;margin:0 0 20px;color:#3a3a3a;
}
.lp-cta__field { margin-bottom:14px; }
.lp-cta__field label {
    display:block;font-size:.82rem;font-weight:600;
    color:#555;margin-bottom:6px;
}
.lp-cta__field input,
.lp-cta__field select,
.lp-cta__field textarea {
    width:100%;padding:10px 12px;
    border:1px solid #dde3e8;border-radius:4px;
    font-size:.92rem;font-family:inherit;
    color:#3a3a3a;background:#fff;box-sizing:border-box;
}
.lp-cta__field input:focus,
.lp-cta__field select:focus { outline:none;border-color:#0091d1; }
.lp-cta__btn {
    width:100%;padding:12px;background:#0091d1;
    color:#fff;border:none;border-radius:4px;
    font-size:1rem;font-weight:700;cursor:pointer;
    margin-top:8px;transition:background .2s;
}
.lp-cta__btn:hover { background:#007ab5; }
@media(max-width:768px) {
    .lp-cta__inner { grid-template-columns:1fr; }
}
