/* =========================================================
   WeinBerg Lead-Generator · Landingpage-Layer v5 (Meta-Ads → bewertung.weinbergimmobilien.de)
   Lädt nach nk-light.css. Rückbau = diese Datei + landing.js entfernen.
   1) Skyline-Grafik nur auf der Startseite (Schritt 1), danach komplett weg
   2) Größere Kacheln (Objektart + neue Stadt-Kacheln in Schritt 2)
   3) Größere Touch-Flächen in Schritt 3–5
   ========================================================= */

/* ---------- 1) Skyline nur auf Schritt 1 ---------- */
.nk-sky{transition:height .55s var(--ease),margin .55s var(--ease),opacity .35s}
.wbi-shell:not([data-cur="1"]) .nk-sky,
html.wbi-embedded .wbi-shell:not([data-cur="1"]) .nk-sky{height:0!important;margin-top:0!important;margin-bottom:0!important;opacity:0;pointer-events:none}
/* Ohne Grafik etwas Luft zwischen Fortschritt und Frage */
.wbi-shell:not([data-cur="1"]) .wbi-progress-wrap{margin-bottom:22px}

/* ---------- 0) Logo + Wortmarke im Kopf ---------- */
.wbi-header .wbi-logo{display:flex;align-items:center;gap:12px}
.wbi-header .wbi-logo-img{height:50px!important;width:auto}
.lp-brand{display:flex;flex-direction:column;line-height:1;padding-left:12px;border-left:1.5px solid var(--line)}
.lp-brand b{font-size:25px;font-weight:900;letter-spacing:.045em;color:var(--wbi-white)}
.lp-brand i{font-style:normal;font-size:10.5px;font-weight:600;letter-spacing:.5em;margin-top:6px;color:var(--wbi-text-dim-dark);margin-right:-.5em}
@media (max-width:559px){.wbi-header .wbi-logo-img{height:42px!important}.wbi-header .wbi-logo{gap:10px}.lp-brand{padding-left:10px}.lp-brand b{font-size:22.5px}.lp-brand i{font-size:9.4px;letter-spacing:.43em;margin-top:5px}}
@media (max-width:559px){.wbi-header .fx-chip{display:none}}
html.wbi-embedded .wbi-header .wbi-logo-img{height:40px!important}
html.wbi-embedded .lp-brand b{font-size:19px}
html.wbi-embedded .lp-brand i{font-size:8px;letter-spacing:.42em}

/* ---------- 0b) Startseite: Schriftzug über die volle Breite + Schild als Wasserzeichen ---------- */
html .wbi-shell[data-cur="1"] .wbi-header{display:none}
.lp-mast{display:none}
html .lp-mast{display:block;width:100%;overflow:hidden;padding:2px 0 14px;margin:0 0 18px;border-bottom:1.5px solid var(--line)}
.lp-mast-t{display:inline-block;white-space:nowrap;line-height:.9;font-size:min(8.2vw,64px);letter-spacing:-.01em;color:var(--wbi-white)}
.lp-mast-t b{font-weight:900;letter-spacing:.02em}
.lp-mast-t i{font-style:normal;font-weight:300;letter-spacing:.06em;margin-right:-.06em;color:var(--wbi-red)}
.lp-water{display:none}
html .lp-water{display:block;position:absolute;z-index:0;pointer-events:none;fill:var(--wbi-red);opacity:.12;
 height:calc(var(--tfs) * 6.4);width:auto;top:calc(var(--tfs) * -.35);left:calc(var(--tfs) * 2.1);animation:lpWater 1.2s var(--ease) .1s backwards}
@keyframes lpWater{from{opacity:0;transform:translateY(16px) scale(.97)}}
.lp-hero>*:not(.lp-water){position:relative;z-index:1}
.lp-hero>.lp-tag{position:relative}
html:not(.nk-light) .lp-water{opacity:.12}

/* ---------- 2a) Startseite als One-Pager (nur Schritt 1, nicht eingebettet) ---------- */
@media (min-width:768px){html .wbi-shell{max-width:860px}}
html .wbi-shell[data-cur="1"] .wbi-progress-wrap{display:none!important}
html .wbi-shell[data-cur="1"] .wbi-header{margin-bottom:18px}
.lp-page{--tfs:clamp(38px,10.6vw,66px)}
/* Hero */
.lp-hero{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;margin:6px 0 0}
.lp-eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--wbi-red);margin-bottom:14px}
.lp-dot{width:8px;height:8px;border-radius:50%;background:var(--wbi-red);animation:nkPing 2s infinite}
html .lp-title.hero-title,html.wbi-embedded .lp-title.hero-title{font-size:var(--tfs);font-weight:900;letter-spacing:-.045em;line-height:.98;text-align:left;margin:0;max-width:none}
.lp-title .ln{padding-bottom:.06em}
.lp-title .red{background:linear-gradient(90deg,#ff7a5c,var(--wbi-red) 60%);-webkit-background-clip:text;background-clip:text;color:transparent}
/* Preisschild – sitzt rechts neben „wert?" */
.lp-tag{align-self:flex-start;position:relative;margin-top:calc(var(--tfs) * -1.02);margin-left:calc(var(--tfs) * 3.05);display:flex;flex-direction:column;align-items:flex-start;gap:1px;
 min-width:184px;padding:9px 16px 9px 30px;border-radius:12px 16px 16px 12px;color:#fff;
 background:linear-gradient(135deg,#ff6a4a,var(--wbi-red) 45%,#c92a12);box-shadow:0 18px 40px rgba(230,52,26,.35),inset 0 1px 0 rgba(255,255,255,.3);
 transform:rotate(-4deg);transform-origin:0 50%;animation:lpTagIn .8s var(--ease) .55s backwards,lpSwing 4.5s ease-in-out 1.6s infinite}
.lp-tag-hole{position:absolute;left:11px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--ink,#fff);box-shadow:inset 0 1px 2px rgba(0,0,0,.35)}
.lp-tag-k{font-size:9.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;opacity:.85}
.lp-tag-v{font-size:23px;font-weight:900;letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums;filter:blur(3.5px);user-select:none}
.lp-tag-lock{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;opacity:.95}
.lp-tag-lock svg{width:12px;height:12px}
.lp-tag-lock em{font-style:normal}
@keyframes lpTagIn{from{opacity:0;transform:rotate(-14deg) translateY(-10px) scale(.9)}}
@keyframes lpSwing{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(-1.5deg)}}
.lp-sub{font-size:16.5px;line-height:1.5;color:var(--wbi-text-dim-dark);max-width:540px;margin:22px 0 22px}
/* Kacheln: Desktop 4 nebeneinander, Handy großes 2×2 */
html .lp-grid.hero-grid{grid-template-columns:repeat(4,1fr);gap:14px;perspective:1000px}
html .lp-grid .wbi-card{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:14px;min-height:238px;padding:22px 18px 18px;border-radius:22px;border-width:1.5px}
html .lp-grid .wbi-card-icon.nk-iso{width:88px;height:88px;border-radius:22px}
html .lp-grid .wbi-card-icon.nk-iso svg{width:76px;height:76px}
html .lp-grid .wbi-card-text{display:flex;flex-direction:column;flex:1;width:100%}
html .lp-grid .wbi-card-text .t{font-size:19px;font-weight:900;letter-spacing:-.02em}
html .lp-grid .wbi-card-text .d{font-size:13px;margin-top:5px}
html .lp-grid .wbi-card-arrow{display:none}
.lp-go{display:none}
html .lp-go{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:14px;font-size:13px;font-weight:800;color:var(--wbi-red);border-top:1px solid var(--line)}
html .lp-go b{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:rgba(230,52,26,.1);transition:transform .25s var(--ease),background .2s,color .2s}
@media (hover:hover){html .lp-grid .wbi-card:hover .lp-go b{background:var(--wbi-red);color:#fff;transform:translateX(3px)}}
html .lp-grid .fx-card-first{border-color:rgba(230,52,26,.55)}
html .lp-grid .fx-card-first .lp-go b{background:var(--wbi-red);color:#fff}
.lp-ping{animation:lpPing .9s var(--ease)}
@keyframes lpPing{0%{box-shadow:0 0 0 0 rgba(230,52,26,.55)}100%{box-shadow:0 0 0 18px rgba(230,52,26,0)}}
@media (max-width:767px){
 html .lp-grid.hero-grid{grid-template-columns:1fr 1fr;gap:12px}
 html .lp-grid .wbi-card{min-height:212px}
}
@media (max-width:559px){
 .lp-page{--tfs:clamp(36px,11vw,46px)}
 .lp-tag{min-width:164px;padding:8px 13px 8px 26px}
 .lp-tag-hole{left:9px}
 .lp-tag-v{font-size:19px}
 .lp-sub{font-size:15px;margin:18px 0 18px}
 html .lp-grid.hero-grid{gap:10px}
 html .lp-grid .wbi-card{min-height:196px;padding:16px 14px 14px;gap:11px;border-radius:20px}
 html .lp-grid .wbi-card-icon.nk-iso{width:70px;height:70px;border-radius:18px}
 html .lp-grid .wbi-card-icon.nk-iso svg{width:60px;height:60px}
 html .lp-grid .wbi-card-text .t{font-size:17px}
 html .lp-grid .wbi-card-text .d{font-size:12px}
 html .lp-go{font-size:12px;padding-top:11px}
 html .lp-go b{width:26px;height:26px}
}
.lp-proof{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;margin-top:18px;font-size:12.5px;font-weight:600;color:var(--wbi-text-dim-dark)}
.lp-proof span{display:inline-flex;align-items:center;gap:6px}
.lp-proof svg{width:15px;height:15px;color:var(--wbi-positive)}
/* Sektionen unter den Kacheln */
.lp-sec{margin-top:52px;padding-top:40px;border-top:1px solid var(--line)}
.lp-sec-k{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--wbi-red);margin-bottom:10px}
.lp-sec-t{font-size:clamp(25px,6vw,36px);font-weight:900;letter-spacing:-.035em;line-height:1.06;margin:0 0 12px;max-width:640px}
.lp-sec-t .red{background:linear-gradient(90deg,#ff7a5c,var(--wbi-red) 60%);-webkit-background-clip:text;background-clip:text;color:transparent}
.lp-sec-p{font-size:15px;line-height:1.55;color:var(--wbi-text-dim-dark);max-width:560px}
.lp-steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px;counter-reset:none}
.lp-steps li{display:flex;flex-direction:column;gap:14px;padding:20px 18px;border-radius:20px;background:var(--glass);border:1px solid var(--line);box-shadow:var(--shadow-deep)}
.lp-steps b{width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:900;color:#fff;background:linear-gradient(135deg,#ff6a4a,var(--wbi-red));box-shadow:0 10px 22px rgba(230,52,26,.3)}
.lp-steps span{font-size:13.5px;line-height:1.45;color:var(--wbi-text-dim-dark)}
.lp-steps strong{display:block;font-size:17px;font-weight:900;letter-spacing:-.01em;color:var(--wbi-white);margin-bottom:4px}
.lp-market .nk-sky{height:310px;margin-top:18px;margin-bottom:-10px}
.lp-me{display:flex;align-items:center;gap:22px}
.lp-me img{width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:50% 18%;flex-shrink:0;border:3px solid var(--wbi-red);box-shadow:0 0 0 6px rgba(230,52,26,.12)}
.lp-me-q{font-size:clamp(17px,4.4vw,21px);font-weight:800;letter-spacing:-.015em;line-height:1.35;color:var(--wbi-white)}
.lp-me-n{font-size:13px;color:var(--wbi-text-dim-dark);margin-top:10px}
.lp-me-n b{color:var(--wbi-white)}
.lp-final{text-align:center;border-top:0;padding:38px 22px 26px;border-radius:26px;
 background:radial-gradient(80% 90% at 50% 0,rgba(230,52,26,.14),rgba(230,52,26,0) 70%),var(--glass);border:1px solid rgba(230,52,26,.25)}
.lp-final .lp-sec-t,.lp-final .lp-sec-p{margin-left:auto;margin-right:auto}
.lp-cta{width:100%;max-width:380px;margin:22px auto 0}
.lp-foot{margin-top:26px;font-size:11.5px;line-height:1.7;color:var(--wbi-text-dim-dark)}
.lp-foot a{color:inherit}
@media (max-width:767px){.lp-steps{grid-template-columns:1fr}.lp-steps li{flex-direction:row;align-items:center;padding:16px}}
@media (max-width:559px){.lp-sec{margin-top:40px;padding-top:32px}.lp-market .nk-sky{height:230px}.lp-me{flex-direction:column;align-items:flex-start;gap:16px}.lp-me img{width:80px;height:80px}}
/* Eingebettet auf weinbergimmobilien.de (iframe, feste 800 px Höhe): neues Design, aber ohne Scroll-Sektionen und kompakter */
html.wbi-embedded .lp-sec{display:none}
html.wbi-embedded .lp-page{--tfs:clamp(34px,7.6vw,56px)}
@media (min-width:900px){html.wbi-embedded .wbi-shell{max-width:860px}}
html.wbi-embedded .lp-mast{padding:0 0 10px;margin:0 0 12px}
html.wbi-embedded .lp-eyebrow{margin-bottom:10px}
html.wbi-embedded .lp-sub{margin:14px 0 14px}
html.wbi-embedded .lp-grid .wbi-card{min-height:200px;padding:18px 16px 14px}
html.wbi-embedded .lp-proof{margin-top:12px}
@media (max-width:559px){
 html.wbi-embedded .lp-page{--tfs:clamp(32px,10vw,40px)}
 html.wbi-embedded .lp-tag{min-width:150px;padding:7px 12px 7px 24px}
 html.wbi-embedded .lp-tag-v{font-size:17px}
 html.wbi-embedded .lp-sub{font-size:14px;margin:12px 0 12px}
 html.wbi-embedded .lp-grid .wbi-card{min-height:150px;padding:13px 12px 12px;gap:8px}
 html.wbi-embedded .lp-grid .wbi-card-icon.nk-iso{width:52px;height:52px;border-radius:15px}
 html.wbi-embedded .lp-grid .wbi-card-icon.nk-iso svg{width:44px;height:44px}
 html.wbi-embedded .lp-grid .wbi-card-text .t{font-size:15.5px}
 html.wbi-embedded .lp-grid .wbi-card-text .d{display:none}
 html.wbi-embedded .lp-go{padding-top:9px}
 html.wbi-embedded .lp-proof{display:none}
}
@media (prefers-reduced-motion:reduce){.lp-tag,.lp-dot{animation:none}}

/* ---------- 2b) Stadt-Kacheln (Schritt 2) ---------- */
.wbi-options.lp-cities{grid-template-columns:repeat(3,1fr);gap:12px}
.lp-cities .wbi-card,.lp-other{flex-direction:column;align-items:flex-start;justify-content:center;gap:10px;min-height:112px;padding:18px 16px;border-radius:18px;
 animation:cardIn .5s var(--ease-out,cubic-bezier(.2,.7,.2,1)) backwards;animation-delay:calc(.05s + var(--i) * .04s)}
.lp-pin{width:36px;height:36px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
 color:var(--wbi-red);background:rgba(230,52,26,.10);border:1px solid rgba(230,52,26,.28)}
.lp-pin svg{width:20px;height:20px}
.lp-cities .wbi-card-text .t{font-size:clamp(16px,4.2vw,19px)}
.lp-cities .wbi-card-text .d{font-size:12.5px;font-weight:600;margin-top:3px;font-variant-numeric:tabular-nums}
.lp-cities .wbi-card.selected .lp-pin,.lp-other.selected .lp-pin{background:var(--wbi-red);color:#fff;border-color:var(--wbi-red)}
/* „Anderer Ort" – gleicher Look, aber gestrichelt */
.lp-other{position:relative;display:flex;cursor:pointer;font-family:inherit;text-align:left;color:var(--wbi-white);
 background:transparent;border:1.5px dashed rgba(255,255,255,.22);transition:border-color .18s,background .18s}
.lp-other .lp-pin{background:transparent;border-style:dashed;color:var(--wbi-text-dim-dark)}
@media (hover:hover){.lp-other:hover{border-color:rgba(230,52,26,.6)}}
.lp-other.selected{border-color:var(--wbi-red);border-style:solid;background:rgba(230,52,26,.08)}
.lp-ort-field{margin-top:16px;animation:nkFade .4s var(--ease) backwards}
html.nk-light .lp-other{color:#201E27;border-color:#D6D2CC}
html.nk-light .lp-other.selected{background:#FFF4F1;border-color:var(--wbi-red)}
html.nk-light .lp-pin{background:#FFF1EE}
html.nk-light .lp-other .lp-pin{background:transparent}
html.nk-light .lp-other.selected .lp-pin,.lp-other.selected .lp-pin{background:var(--wbi-red);color:#fff;border-style:solid;border-color:var(--wbi-red)}
@media (max-width:559px){
 .wbi-options.lp-cities{grid-template-columns:1fr 1fr;gap:10px}
 .lp-cities .wbi-card,.lp-other{min-height:96px;padding:14px 13px;gap:8px}
 .lp-other{grid-column:1 / -1;flex-direction:row;align-items:center;min-height:68px}
}
html.wbi-embedded .lp-cities .wbi-card,html.wbi-embedded .lp-other{min-height:84px;padding:12px 12px;gap:7px}
html.wbi-embedded .lp-pin{width:30px;height:30px}
@media (max-width:559px){
 html.wbi-embedded .wbi-options.lp-cities{gap:8px}
 html.wbi-embedded .lp-cities .wbi-card,html.wbi-embedded .lp-other{flex-direction:row;align-items:center;min-height:60px;padding:9px 10px;gap:9px;border-radius:14px}
 html.wbi-embedded .lp-pin{width:28px;height:28px;border-radius:9px}
 html.wbi-embedded .lp-pin svg{width:16px;height:16px}
 html.wbi-embedded .lp-cities .wbi-card-text .t{font-size:15px}
 html.wbi-embedded .lp-cities .wbi-card-text .d{font-size:11px;margin-top:1px}
 html.wbi-embedded .lp-other{min-height:52px}
 html.wbi-embedded .lp-other .wbi-card-text .d{display:none}
 html.wbi-embedded .wbi-header .fx-chip{display:none}
 html.wbi-embedded .wbi-shell[data-cur="2"] .wbi-q-sub{display:none}
}
/* Schritt 2 braucht keinen „Weiter"-Knopf – Kachel-Klick geht direkt weiter */
.wbi-shell[data-cur="2"] #nextBtn{display:none!important}

/* ---------- 2c) Kontakt-Schritt (Schritt 5) ---------- */
/* Button-Leiste bleibt unten im Bild – Formular muss nicht bis zum Ende gescrollt werden */
.wbi-shell[data-cur="5"]{padding-bottom:118px}
.wbi-shell[data-cur="5"] .wbi-nav{position:fixed;left:0;right:0;bottom:0;z-index:60;margin:0;
 padding:12px max(16px,calc(50vw - 396px)) calc(12px + env(safe-area-inset-bottom));
 background:var(--ink,#fff);border-top:1px solid var(--line);box-shadow:0 -14px 34px rgba(32,30,39,.12);animation:nkFade .35s var(--ease) backwards}
.wbi-shell[data-cur="5"] #formError{display:none}
.lp-ferr{font-size:12.5px;font-weight:700;color:var(--wbi-red);margin-top:7px}
.lp-ferr:empty{display:none}
.lp-bad .wbi-input{border-color:var(--wbi-red)!important;box-shadow:0 0 0 4px rgba(230,52,26,.13)!important}
.lp-typo{display:inline-flex;align-items:center;gap:4px;margin-top:8px;font:inherit;font-size:13px;font-weight:600;color:var(--wbi-white);
 background:rgba(230,52,26,.07);border:1.5px dashed rgba(230,52,26,.5);border-radius:10px;padding:8px 12px;cursor:pointer}
.lp-typo[hidden]{display:none}
.lp-typo b{color:var(--wbi-red);font-weight:800}
.lp-more{margin:2px 0 4px;border:1px solid var(--line);border-radius:14px;padding:0 14px;background:var(--glass-flat,transparent)}
.lp-more summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:6px;min-height:50px;font-size:14px;font-weight:700;color:var(--wbi-white)}
.lp-more summary .opt{font-weight:500;color:var(--wbi-text-dim-dark);font-size:12px;margin-right:auto}
.lp-more summary::-webkit-details-marker{display:none}
.lp-more summary::after{content:"+";font-size:22px;line-height:1;font-weight:800;color:var(--wbi-red)}
.lp-more[open] summary::after{content:"\2013"}
.lp-more[open]{padding-bottom:4px}
.lp-more .wbi-field:last-child{margin-bottom:10px}
.lp-assure{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--wbi-white);margin:16px 2px 0;line-height:1.4}
.lp-assure svg{width:15px;height:15px;flex-shrink:0;color:var(--wbi-positive)}
/* Teaser-Karte im Kontakt-Schritt etwas flacher */
.wbi-shell[data-cur="5"] .fx-teaser{margin-bottom:18px}
@media (max-width:559px){.wbi-shell[data-cur="5"] .wbi-q-title{font-size:25px}}

/* ---------- 3) Größere Touch-Flächen Schritt 3–5 ---------- */
html:not(.wbi-embedded) .wbi-pill{min-height:54px;font-size:15px;padding:13px 18px}
html:not(.wbi-embedded) #zimmerPills{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
html:not(.wbi-embedded) #zimmerPills .wbi-pill{min-height:60px;font-size:19px;justify-content:center}
html:not(.wbi-embedded) .wbi-seg .wbi-pill{min-height:76px;padding:16px 10px;font-size:15.5px}
html:not(.wbi-embedded) .wbi-seg .wbi-pill .sub{font-size:12px}
html:not(.wbi-embedded) .wbi-input,html:not(.wbi-embedded) .wbi-select{min-height:58px;font-size:17px;padding:16px 17px}
html:not(.wbi-embedded) .wbi-btn{min-height:58px;font-size:17px}
@media (max-width:480px){html:not(.wbi-embedded) .wbi-seg .wbi-pill{min-height:60px}}
