/* SG Investment Advisory – Royale Navy Design System (Medienmaster 2026) */
* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --navy:#060B1C; --navy2:#0B1430; --brand:#152354;
  --blue:#2E6BFF; --ice:#2DB4FF; --ice2:#8FD4FF;
  --gold:#E0BE7E; --gold2:#C9A45C; --goldhell:#F0D9A8;
  --text:#EDF1FF; --muted:#A9B4D8; --line:rgba(46,107,255,0.3);
}
html { scroll-behavior:smooth; }
body { background:var(--navy); color:var(--text); font-family:'Inter',sans-serif; overflow-x:hidden; position:relative; }
h1,h2,h3,.sora { font-family:'Sora',sans-serif; }
a { color:inherit; text-decoration:none; }
section { position:relative; z-index:2; }
img { max-width:100%; }
@media (prefers-reduced-motion: reduce){ *,*::before,*::after{ animation-duration:0.001s !important; animation-iteration-count:1 !important; transition:none !important; } }

/* Aurora */
.aurora { position:fixed; inset:-40%; filter:blur(52px); opacity:0.9; z-index:0; animation:swirl 17s ease-in-out infinite alternate; pointer-events:none;
    background:
      radial-gradient(40% 32% at 28% 36%, rgba(46,107,255,0.45), transparent 70%),
      radial-gradient(32% 26% at 72% 26%, rgba(45,180,255,0.3), transparent 70%),
      radial-gradient(22% 18% at 78% 62%, rgba(224,190,126,0.15), transparent 70%),
      radial-gradient(36% 30% at 55% 82%, rgba(21,35,84,1), transparent 70%); }
@keyframes swirl { 0%{ transform:rotate(0deg) scale(1);} 100%{ transform:rotate(13deg) scale(1.13);} }

/* Seiten-Hintergründe: jede Seite hat ihr eigenes Immobilien-Motiv,
   mit langsamer Drift-Bewegung (Ken-Burns), damit nichts statisch wirkt */
/* Absolut positioniert am Seitenanfang: scrollt sichtbar mit dem Inhalt mit,
   das JS bremst ihn dabei ab (klassischer Parallax-Effekt) */
.pagebg { position:absolute; top:0; left:0; right:0; height:125vh; z-index:0; pointer-events:none; opacity:0.42; overflow:hidden; will-change:transform; }
.pagebg::before { content:""; position:absolute; inset:0;
    background-position:center top; background-size:cover; background-repeat:no-repeat;
    animation:bgdrift 36s ease-in-out infinite alternate;
    -webkit-mask:linear-gradient(180deg, #000 10%, rgba(0,0,0,0.6) 60%, transparent 95%);
    mask:linear-gradient(180deg, #000 10%, rgba(0,0,0,0.6) 60%, transparent 95%); }
@keyframes bgdrift { 0%{ transform:scale(1);} 100%{ transform:scale(1.09);} }
.bg-start { opacity:0.5; }
.bg-start::before { background-image:url('skyline-nacht.jpg'); background-position:center bottom;
    -webkit-mask:linear-gradient(180deg, transparent 5%, rgba(0,0,0,0.6) 40%, #000 75%, transparent 98%);
    mask:linear-gradient(180deg, transparent 5%, rgba(0,0,0,0.6) 40%, #000 75%, transparent 98%); }
/* Zweites Motiv am Seitenende: die Skyline taucht auf, wenn man Richtung
   Fußbereich scrollt – so ist auch unten nie "leerer" Hintergrund */
.pagebg-unten { position:absolute; bottom:0; left:0; right:0; height:110vh; z-index:0; pointer-events:none; opacity:0.42; overflow:hidden; }
.pagebg-unten::before { content:""; position:absolute; inset:0;
    background:url('skyline-nacht.jpg') center bottom / cover no-repeat;
    animation:bgdrift 40s ease-in-out infinite alternate;
    -webkit-mask:linear-gradient(0deg, #000 18%, rgba(0,0,0,0.55) 55%, transparent 92%);
    mask:linear-gradient(0deg, #000 18%, rgba(0,0,0,0.55) 55%, transparent 92%); }
@media (max-width:640px){ .pagebg-unten { height:70vh; opacity:0.34; } }

/* Mittel-Motiv für LANGE Seiten (Start, Immobilien): füllt die Lücke
   zwischen oberem Motiv und Skyline unten */
.pagebg-mitte { position:absolute; top:50%; left:0; right:0; height:110vh; transform:translateY(-50%); z-index:0; pointer-events:none; opacity:0.32; overflow:hidden; }
.pagebg-mitte::before { content:""; position:absolute; inset:0;
    background-position:center; background-size:cover; background-repeat:no-repeat;
    animation:bgdrift 44s ease-in-out infinite alternate;
    -webkit-mask:linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.6) 28%, rgba(0,0,0,0.6) 72%, transparent 100%);
    mask:linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.6) 28%, rgba(0,0,0,0.6) 72%, transparent 100%); }
.mitte-investment::before { background-image:url('bg-investment.jpg'); }
.mitte-verkaufen::before { background-image:url('bg-verkaufen.jpg'); }
@media (max-width:640px){ .pagebg-mitte { opacity:0.26; } }

.bg-verkaufen::before { background-image:url('bg-verkaufen.jpg'); }
.bg-investment::before { background-image:url('bg-investment.jpg'); }
.bg-immobilien::before { background-image:url('bg-immobilien.jpg'); }
.bg-ueberuns::before { background-image:url('bg-ueberuns.jpg'); }
@media (max-width:640px){ .pagebg { opacity:0.3; } .bg-start { opacity:0.38; } }

/* Navigation */
header { position:fixed; top:0; left:0; right:0; z-index:50; display:flex; align-items:center; justify-content:space-between; padding:20px clamp(20px,5vw,60px); transition:background 0.3s, box-shadow 0.3s, padding 0.3s; }
header.scrolled { background:rgba(6,11,28,0.85); backdrop-filter:blur(12px); box-shadow:0 8px 30px rgba(0,0,0,0.35); padding:13px clamp(20px,5vw,60px); }
.logo img { height:34px; display:block; }
.brand { display:flex; align-items:center; gap:22px; }
.hdbadge { height:132px; width:auto; margin:-20px 0 -96px; filter:drop-shadow(0 10px 26px rgba(0,0,0,0.5)); transition:height 0.3s, margin 0.3s; }
header.scrolled .hdbadge { height:96px; margin:-13px 0 -66px; }
@media (max-width:640px){ .hdbadge { height:88px; margin:-14px 0 -60px; } }
nav { display:flex; gap:26px; font-size:13.5px; color:var(--muted); font-weight:500; align-items:center; }
nav a { transition:color 0.25s; }
nav a:hover, nav a.active { color:var(--ice2); }
.navcta { border:1px solid rgba(224,190,126,0.55); color:var(--gold); font-size:12.5px; font-weight:600; padding:10px 20px; border-radius:99px; background:rgba(224,190,126,0.07); transition:background 0.25s; }
.navcta:hover { background:rgba(224,190,126,0.16); color:var(--gold); }
.burger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:6px; background:none; border:none; }
.burger span { width:24px; height:2px; background:var(--text); transition:0.3s; }
@media (max-width:900px){
  nav { position:fixed; top:0; right:-290px; width:280px; height:100vh; background:rgba(6,11,28,0.97); backdrop-filter:blur(14px); flex-direction:column; justify-content:center; gap:30px; font-size:16px; transition:right 0.35s; }
  nav.open { right:0; box-shadow:-20px 0 60px rgba(0,0,0,0.6); }
  .burger { display:flex; z-index:60; }
}

/* Hero (Startseite) */
.hero { position:relative; z-index:2; text-align:center; padding:clamp(140px,22vh,210px) 22px 40px; }
.orb { font-size:11px; font-weight:600; letter-spacing:2.5px; text-transform:uppercase; color:var(--ice2); border:1px solid rgba(45,180,255,0.4); border-radius:99px; padding:8px 20px; display:inline-block; margin-bottom:26px; background:rgba(45,180,255,0.07); backdrop-filter:blur(4px); opacity:0; animation:rise 1s 0.1s forwards; }
h1 { font-size:clamp(34px,6.2vw,68px); font-weight:800; letter-spacing:-2px; line-height:1.04; opacity:0; animation:rise 1s 0.35s forwards; }
h1 .grad { background:linear-gradient(90deg,var(--blue),var(--ice),var(--ice2)); background-size:200% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:gradslide 5s linear infinite; }
h1 .gold { background:linear-gradient(90deg,var(--goldhell),var(--gold),var(--gold2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.sub { color:var(--muted); font-size:clamp(14px,1.6vw,17px); margin:22px auto 0; max-width:580px; line-height:1.75; opacity:0; animation:rise 1s 0.6s forwards; }
@keyframes rise { from{opacity:0; transform:translateY(20px);} to{opacity:1; transform:translateY(0);} }
@keyframes gradslide { to { background-position:200% 0; } }
.ctarow { margin-top:34px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap; opacity:0; animation:rise 1s 0.85s forwards; }
.cta { position:relative; overflow:hidden; display:inline-block; background:linear-gradient(120deg,var(--goldhell),var(--gold),var(--gold2)); color:#131C3A; font-family:'Sora',sans-serif; font-weight:800; font-size:14px; padding:17px 38px; border-radius:99px; cursor:pointer; animation:goldpulse 3s ease-in-out infinite; border:none; }
@keyframes goldpulse { 0%,100%{ box-shadow:0 0 26px rgba(224,190,126,0.3);} 50%{ box-shadow:0 0 54px rgba(224,190,126,0.6);} }
.cta::after { content:""; position:absolute; top:0; bottom:0; width:40%; left:-60%; transform:skewX(-20deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,0.7),transparent); animation:shine 3.6s 1.6s infinite; }
@keyframes shine { 0%{left:-60%;} 45%{left:130%;} 100%{left:130%;} }
.cta2 { display:inline-block; border:1px solid rgba(45,180,255,0.5); color:var(--text); background:rgba(45,180,255,0.08); backdrop-filter:blur(6px); font-family:'Sora',sans-serif; font-weight:600; font-size:14px; padding:17px 34px; border-radius:99px; transition:background 0.25s; }
.cta2:hover { background:rgba(45,180,255,0.16); }

/* Unterseiten-Hero */
.page-hero { text-align:center; padding:clamp(130px,18vh,180px) 22px 30px; position:relative; z-index:2; }
.page-hero h1 { font-size:clamp(30px,4.8vw,52px); }
.page-hero .sub { animation-delay:0.5s; }
.crumb { font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:18px; opacity:0; animation:rise 1s 0.05s forwards; }

/* Trustpilot-Zeile */
.tp { margin-top:30px; display:inline-flex; align-items:center; gap:10px; font-size:13px; color:var(--muted); opacity:0; animation:rise 1s 1.1s forwards; flex-wrap:wrap; justify-content:center; }
.tp .stars { display:inline-flex; gap:2.5px; }
.tp .star { width:18px; height:18px; background:#00B67A; display:inline-flex; align-items:center; justify-content:center; }
.tp .star svg { width:12px; height:12px; fill:#fff; }
.tp b { color:var(--text); }

/* Partner-Badges */
.badgerow { display:flex; justify-content:center; align-items:center; gap:20px; flex-wrap:wrap; padding:26px 20px 0; position:relative; z-index:2; }
.pbadge { display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:600; color:var(--muted); border:1px solid var(--line); border-radius:99px; padding:10px 20px; background:rgba(13,22,48,0.55); backdrop-filter:blur(8px); }
.pbadge.goldp { border-color:rgba(224,190,126,0.55); color:var(--gold); }
.pbadge .dot2 { width:8px; height:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 10px rgba(224,190,126,0.8); }
.pbadge .dot3 { width:8px; height:8px; border-radius:50%; background:#00B67A; box-shadow:0 0 10px rgba(0,182,122,0.8); }

/* Kennzahlen */
.stats { position:relative; z-index:2; display:flex; justify-content:center; gap:clamp(26px,6vw,80px); padding:40px 20px 10px; flex-wrap:wrap; }
.stat { text-align:center; }
.stat b { display:block; font-family:'Sora',sans-serif; font-size:clamp(26px,3vw,36px); font-weight:800; background:linear-gradient(90deg,var(--ice),var(--ice2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.stat.gold b { background:linear-gradient(90deg,var(--goldhell),var(--gold)); -webkit-background-clip:text; background-clip:text; }
.stat span { font-size:11px; color:var(--muted); letter-spacing:1.5px; text-transform:uppercase; }

/* Sektionen */
.wrap { max-width:1150px; margin:0 auto; padding:0 clamp(20px,5vw,60px); }
.slabel { text-align:center; margin:90px 0 8px; font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:4px; color:var(--gold); text-transform:uppercase; position:relative; z-index:2; }
.stitle { text-align:center; font-size:clamp(24px,3.6vw,36px); font-weight:800; letter-spacing:-0.5px; margin-bottom:14px; position:relative; z-index:2; }
.sintro { text-align:center; color:var(--muted); font-size:14.5px; line-height:1.7; max-width:560px; margin:0 auto 40px; position:relative; z-index:2; }

/* Reveal */
.reveal { opacity:0; transform:translateY(26px); transition:opacity 0.8s ease, transform 0.8s ease; }
.reveal.in { opacity:1; transform:none; }

/* Objektkarten */
.objgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.fcard { background:rgba(13,22,48,0.62); border:1px solid var(--line); border-radius:18px; overflow:hidden; backdrop-filter:blur(12px); transition:border-color 0.3s, transform 0.3s, box-shadow 0.3s; }
.fcard:hover { border-color:rgba(224,190,126,0.65); transform:translateY(-8px); box-shadow:0 24px 50px rgba(0,0,0,0.4); }
.fimg { height:170px; position:relative; background:linear-gradient(140deg,#1E3572,#0D1734); }
.fimg::after { content:""; position:absolute; inset:0; background:linear-gradient(120deg,transparent 30%, rgba(143,212,255,0.14) 50%, transparent 70%); background-size:250% 100%; animation:gradslide 4.5s linear infinite; }
.fimg .ph { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:11px; color:rgba(237,241,255,0.35); letter-spacing:1px; }
.fimg img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; }
.fcard:hover .fimg img { transform:scale(1.06); }
.fimg .tag { position:absolute; top:12px; left:12px; background:rgba(224,190,126,0.92); color:#131C3A; font-size:10px; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:5px 11px; border-radius:99px; z-index:1; }
.fbody { padding:17px 19px 19px; }
.fbody b { display:block; font-family:'Sora',sans-serif; font-size:15px; font-weight:700; margin-bottom:6px; }
.fmeta { display:flex; gap:12px; font-size:11.5px; color:var(--muted); flex-wrap:wrap; }
.fprice { margin-top:12px; font-family:'Sora',sans-serif; font-size:17px; font-weight:800; background:linear-gradient(90deg,var(--goldhell),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.objnote { text-align:center; margin-top:26px; font-size:12px; color:var(--muted); position:relative; z-index:2; }
.objnote b { color:var(--ice2); font-weight:600; }
@media (max-width:860px){ .objgrid{grid-template-columns:1fr;} }

/* Leistungen */
.lgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.lcard { background:rgba(13,22,48,0.55); border:1px solid var(--line); border-radius:18px; padding:26px 24px; backdrop-filter:blur(10px); transition:border-color 0.3s, transform 0.3s; }
.lcard:hover { border-color:rgba(224,190,126,0.55); transform:translateY(-6px); }
.lic { width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; margin-bottom:16px; background:rgba(224,190,126,0.1); border:1px solid rgba(224,190,126,0.35); }
.lic svg { width:22px; height:22px; stroke:var(--gold); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.lcard h3 { font-size:16px; font-weight:700; margin-bottom:8px; }
.lcard p { font-size:13px; color:var(--muted); line-height:1.65; }
@media (max-width:860px){ .lgrid{grid-template-columns:1fr;} }

/* Prozess */
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.steps.two { grid-template-columns:repeat(2,1fr); max-width:760px; margin:0 auto; }
.step { position:relative; padding:26px 20px 22px; border:1px solid var(--line); border-radius:18px; background:rgba(13,22,48,0.45); backdrop-filter:blur(8px); }
.step .no { font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--ice2); letter-spacing:2px; }
.step h3 { font-size:15px; font-weight:700; margin:10px 0 8px; }
.step p { font-size:12.5px; color:var(--muted); line-height:1.6; }
.step::after { content:""; position:absolute; top:50%; right:-14px; width:14px; height:1px; background:linear-gradient(90deg,var(--ice),transparent); }
.step:last-child::after { display:none; }
@media (max-width:860px){ .steps{grid-template-columns:1fr 1fr;} .step::after{display:none;} }
@media (max-width:540px){ .steps{grid-template-columns:1fr;} .steps.two{grid-template-columns:1fr;} }

/* Region */
.region { text-align:center; position:relative; z-index:2; }
.citychips { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:22px; }
.city { font-family:'Sora',sans-serif; font-size:13px; font-weight:600; padding:11px 22px; border-radius:99px; border:1px solid var(--line); background:rgba(13,22,48,0.5); backdrop-filter:blur(6px); transition:border-color 0.3s; }
.city:hover { border-color:rgba(224,190,126,0.6); }
.city.home { border-color:rgba(224,190,126,0.7); color:var(--gold); background:rgba(224,190,126,0.08); }
.regiontext { color:var(--muted); font-size:14px; line-height:1.75; max-width:620px; margin:0 auto; }
.regiontext b { color:var(--text); font-weight:600; }

/* Team */
.team { display:grid; grid-template-columns:1fr 1fr; gap:22px; max-width:760px; margin:0 auto; }
.tcard { text-align:center; background:rgba(13,22,48,0.55); border:1px solid var(--line); border-radius:18px; padding:30px 24px; backdrop-filter:blur(10px); }
.tfoto { width:190px; height:190px; border-radius:50%; margin:0 auto 18px; background:linear-gradient(140deg,#1E3572,#0D1734); border:3px solid rgba(224,190,126,0.55); box-shadow:0 12px 34px rgba(0,0,0,0.35); display:flex; align-items:center; justify-content:center; font-size:10px; color:rgba(237,241,255,0.35); overflow:hidden; }
.tfoto img { width:100%; height:100%; object-fit:cover; object-position:50% 14%; }
@media (max-width:640px){ .tfoto { width:160px; height:160px; } }
.tcard h3 { font-size:17px; font-weight:700; }
.tcard .role { font-size:12px; color:var(--gold); letter-spacing:1px; text-transform:uppercase; margin-top:5px; }
.tcard p { font-size:13px; color:var(--muted); line-height:1.65; margin-top:12px; }
.tlink { display:block; color:inherit; }
.tlink:hover .tfoto { border-color:var(--gold); box-shadow:0 0 24px rgba(224,190,126,0.35); }
.tlink:hover h3 { color:var(--ice2); }
.tfoto, .tcard h3 { transition:border-color 0.25s, box-shadow 0.25s, color 0.25s; }
.tkontakt { margin-top:16px; display:flex; flex-direction:column; gap:8px; align-items:center; font-size:12.5px; }
.tkontakt a { display:inline-flex; align-items:center; gap:8px; color:var(--ice2); transition:color 0.25s; }
.tkontakt a:hover { color:var(--gold); }
.tkontakt svg { width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.6; flex:none; }
.tkontakt .inlogo { width:15px; height:15px; fill:currentColor; stroke:none; }
@media (max-width:640px){ .team{grid-template-columns:1fr;} }

/* Trustpilot-Band */
.trustgrid { display:grid; grid-template-columns:0.9fr 1.1fr; gap:22px; align-items:stretch; }
.tscore { background:rgba(13,22,48,0.6); border:1px solid rgba(0,182,122,0.4); border-radius:18px; padding:34px 26px; text-align:center; display:flex; flex-direction:column; justify-content:center; backdrop-filter:blur(10px); }
.tscore .big { font-family:'Sora',sans-serif; font-size:52px; font-weight:800; line-height:1; background:linear-gradient(90deg,#00B67A,#7EE8C6); -webkit-background-clip:text; background-clip:text; color:transparent; }
.tscore .stars { justify-content:center; display:flex; gap:4px; margin:14px 0 10px; }
.tscore .star { width:26px; height:26px; background:#00B67A; display:inline-flex; align-items:center; justify-content:center; }
.tscore .star svg { width:17px; height:17px; fill:#fff; }
.tscore span { font-size:12.5px; color:var(--muted); }
.quotes { display:flex; flex-direction:column; gap:16px; }
.quote { background:rgba(13,22,48,0.55); border:1px solid var(--line); border-radius:16px; padding:20px 24px; backdrop-filter:blur(10px); }
.quote p { font-size:13.5px; line-height:1.7; font-style:italic; }
.quote .who { margin-top:9px; font-size:11.5px; color:var(--muted); }
.quote .who b { color:var(--gold); font-weight:600; }
@media (max-width:820px){ .trustgrid{grid-template-columns:1fr;} }

/* FAQ */
.faq { max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:12px; }
.faq details { background:rgba(13,22,48,0.55); border:1px solid var(--line); border-radius:14px; backdrop-filter:blur(8px); overflow:hidden; }
.faq summary { cursor:pointer; padding:18px 22px; font-family:'Sora',sans-serif; font-weight:600; font-size:14px; list-style:none; position:relative; padding-right:44px; }
.faq summary::after { content:"+"; position:absolute; right:20px; top:50%; transform:translateY(-50%); color:var(--gold); font-size:19px; transition:transform 0.25s; }
.faq details[open] summary::after { transform:translateY(-50%) rotate(45deg); }
.faq details p { padding:0 22px 18px; font-size:13px; color:var(--muted); line-height:1.7; }

/* Text-Blöcke */
.prose { max-width:720px; margin:0 auto; color:var(--muted); font-size:14.5px; line-height:1.85; position:relative; z-index:2; }
.prose b, .prose strong { color:var(--text); }
.prose p + p { margin-top:16px; }

/* CTA-Band */
.ctaband { position:relative; z-index:2; margin:100px auto 0; max-width:900px; text-align:center; border:1px solid rgba(224,190,126,0.4); border-radius:24px; padding:52px clamp(22px,5vw,60px); background:
    radial-gradient(60% 80% at 50% 0%, rgba(224,190,126,0.12), transparent 70%), rgba(13,22,48,0.6); backdrop-filter:blur(10px); }
.ctaband h2 { font-size:clamp(22px,3.4vw,32px); font-weight:800; letter-spacing:-0.5px; }
.ctaband h2 span { background:linear-gradient(90deg,var(--goldhell),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.ctaband p { color:var(--muted); font-size:14px; margin:14px auto 26px; max-width:480px; line-height:1.7; }

/* Kontakt */
.contact { display:grid; grid-template-columns:1fr 1.1fr; gap:26px; }
.cinfo { display:flex; flex-direction:column; gap:14px; }
.cline { display:flex; gap:14px; align-items:flex-start; background:rgba(13,22,48,0.5); border:1px solid var(--line); border-radius:14px; padding:16px 18px; backdrop-filter:blur(8px); font-size:13.5px; }
.cline svg { width:19px; height:19px; stroke:var(--gold); fill:none; stroke-width:1.6; flex:none; margin-top:1px; }
.cline b { display:block; font-family:'Sora',sans-serif; font-size:12px; letter-spacing:1px; text-transform:uppercase; color:var(--muted); margin-bottom:3px; font-weight:600; }
.cform { background:rgba(13,22,48,0.55); border:1px solid var(--line); border-radius:18px; padding:26px; backdrop-filter:blur(10px); display:flex; flex-direction:column; gap:13px; }
.cform input, .cform textarea { background:rgba(6,11,28,0.7); border:1px solid var(--line); border-radius:10px; padding:13px 15px; color:var(--text); font-family:'Inter',sans-serif; font-size:13.5px; outline:none; transition:border-color 0.25s; width:100%; }
.cform input:focus, .cform textarea:focus { border-color:var(--ice); box-shadow:0 0 0 3px rgba(45,180,255,0.3); }
.cform textarea { min-height:110px; resize:vertical; }
.cform .cta { align-self:flex-start; font-size:13px; padding:14px 30px; }
.formnote { font-size:11px; color:var(--muted); }
@media (max-width:820px){ .contact{grid-template-columns:1fr;} }

/* Bewertungs-Funnel (verkaufen.html): Endkunde klickt sich durch Boxen */
.funnel { max-width:760px; margin:36px auto 0; background:rgba(13,22,48,0.65); border:1px solid var(--line); border-radius:22px; padding:clamp(22px,4vw,40px); backdrop-filter:blur(12px); position:relative; z-index:2; }
.f-kopf { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; font-size:12px; color:var(--muted); }
.f-kopf b { color:var(--gold); font-family:'Sora',sans-serif; letter-spacing:1px; }
.f-balken { height:4px; border-radius:99px; background:rgba(46,107,255,0.18); margin-bottom:26px; overflow:hidden; }
.f-balken span { display:block; height:100%; width:25%; border-radius:99px; background:linear-gradient(90deg,var(--goldhell),var(--gold)); transition:width 0.4s ease; }
.f-schritt { display:none; }
.f-schritt.aktiv { display:block; animation:rise 0.45s ease; }
.f-frage { font-family:'Sora',sans-serif; font-size:clamp(18px,2.4vw,23px); font-weight:700; margin-bottom:6px; }
.f-hinweis { font-size:12.5px; color:var(--muted); margin-bottom:20px; }
.f-boxen { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:12px; }
.f-box { display:flex; flex-direction:column; align-items:center; gap:10px; padding:20px 12px 16px; border:1px solid var(--line); border-radius:14px; background:rgba(6,11,28,0.55); cursor:pointer; text-align:center; font-family:'Sora',sans-serif; font-size:13px; font-weight:600; color:var(--text); transition:border-color 0.25s, transform 0.2s, background 0.25s; }
.f-box svg { width:30px; height:30px; stroke:var(--gold); fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.f-box:hover { border-color:rgba(224,190,126,0.6); transform:translateY(-3px); }
.f-box.gewaehlt { border-color:var(--gold); background:rgba(224,190,126,0.12); box-shadow:0 0 22px rgba(224,190,126,0.25); }
.f-eingaben { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.f-eingaben .voll { grid-column:1 / -1; }
.f-eingaben label { display:block; font-size:11.5px; letter-spacing:0.5px; color:var(--muted); margin-bottom:5px; font-weight:600; }
.f-eingaben input, .f-eingaben select { width:100%; background:rgba(6,11,28,0.7); border:1px solid var(--line); border-radius:10px; padding:13px 15px; color:var(--text); font-family:'Inter',sans-serif; font-size:13.5px; outline:none; transition:border-color 0.25s; }
.f-eingaben input:focus, .f-eingaben select:focus { border-color:var(--ice); }
.f-eingaben select option { background:#0B1430; }
.f-nav { display:flex; justify-content:space-between; align-items:center; margin-top:26px; gap:12px; }
.f-zurueck { background:none; border:none; color:var(--muted); font-family:'Inter',sans-serif; font-size:13px; cursor:pointer; padding:10px 6px; }
.f-zurueck:hover { color:var(--ice2); }
.f-weiter { border:none; }
.f-fehler { color:#FF8A8A; font-size:12.5px; margin-top:12px; display:none; }
.f-erfolg { text-align:center; padding:26px 10px; }
.f-erfolg .haken { width:64px; height:64px; margin:0 auto 18px; border-radius:50%; background:rgba(0,182,122,0.15); border:1px solid rgba(0,182,122,0.5); display:flex; align-items:center; justify-content:center; }
.f-erfolg .haken svg { width:30px; height:30px; stroke:#00B67A; fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.f-erfolg h3 { font-size:20px; font-weight:700; margin-bottom:10px; }
.f-erfolg p { color:var(--muted); font-size:13.5px; line-height:1.7; max-width:420px; margin:0 auto; }
@media (max-width:560px){ .f-eingaben { grid-template-columns:1fr; } }

/* Großer Bewertungs-Wizard (bewertung.html): offenes Layout, große Icon-Kacheln */
.wizard-gross { background:none; border:none; backdrop-filter:none; padding:0; box-shadow:none; max-width:1240px; }
.wizard-gross .f-kopf { justify-content:center; gap:16px; font-size:13px; letter-spacing:1px; }
.wizard-gross .f-balken { max-width:420px; margin:16px auto 46px; height:6px; }
.wizard-gross .f-frage { text-align:center; font-size:clamp(26px,3.8vw,38px); letter-spacing:-0.5px; margin-bottom:10px; }
.wizard-gross .f-hinweis { text-align:center; font-size:15px; margin-bottom:38px; }
.wizard-gross .f-boxen { display:flex; flex-wrap:wrap; justify-content:center; gap:16px; }
.wizard-gross .f-box { flex:1 1 185px; max-width:230px; padding:34px 12px 26px; font-size:14px; line-height:1.3; gap:16px; border-radius:20px; background:rgba(13,22,48,0.6); backdrop-filter:blur(8px); min-height:185px; justify-content:center; overflow-wrap:break-word; hyphens:auto; }
.wizard-gross .f-box svg { width:60px; height:60px; stroke-width:1.3; flex:none; }
.wizard-gross .f-box:hover { transform:translateY(-5px); box-shadow:0 16px 40px rgba(0,0,0,0.35); }
.wizard-gross .f-box.gewaehlt { box-shadow:0 0 34px rgba(224,190,126,0.35); }
.wizard-gross .f-eingaben { max-width:660px; margin:0 auto; gap:16px; }
.wizard-gross .f-eingaben input, .wizard-gross .f-eingaben select { padding:17px 19px; font-size:15px; border-radius:12px; }
.wizard-gross .f-eingaben label { font-size:12.5px; margin-bottom:7px; }
.wizard-gross .f-nav { max-width:660px; margin:36px auto 0; }
.wizard-gross .f-nav .cta { font-size:15px; padding:17px 40px; }
.wizard-gross .f-zurueck { font-size:14px; }
.wizard-gross .f-fehler { text-align:center; font-size:13.5px; }
.wizard-gross .f-erfolg { padding:40px 10px; }
.wizard-gross .f-erfolg .haken { width:84px; height:84px; }
.wizard-gross .f-erfolg .haken svg { width:40px; height:40px; }
.wizard-gross .f-erfolg h3 { font-size:26px; }
.wizard-gross .f-erfolg p { font-size:15px; max-width:520px; }
@media (max-width:560px){ .wizard-gross .f-box { flex:1 1 42%; max-width:none; min-height:140px; padding:24px 10px 20px; font-size:12.5px; } .wizard-gross .f-box svg { width:44px; height:44px; } }

/* Footer */
footer { position:relative; z-index:2; border-top:1px solid var(--line); margin-top:90px; padding:30px clamp(20px,5vw,60px) 34px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; font-size:12px; color:#8A93B0; background:var(--navy2); box-shadow:0 -18px 40px rgba(6,11,28,0.65); }
footer .cols { display:flex; gap:20px; flex-wrap:wrap; align-items:center; }
footer a:hover { color:var(--ice2); }
footer .soc svg { width:17px; height:17px; display:block; fill:currentColor; }
footer .soc:hover { color:var(--gold); }

/* Objektkarten als Links */
a.fcard { display:block; color:inherit; }

/* Kategorie-Tabs (Kaufen / Gewerbe / Mieten) */
.kattabs { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-bottom:28px; }
.kattab { font-family:'Sora',sans-serif; font-size:13px; font-weight:600; color:var(--muted); background:rgba(13,22,48,0.5); border:1px solid var(--line); border-radius:99px; padding:11px 24px; cursor:pointer; transition:color 0.25s, border-color 0.25s, background 0.25s; }
.kattab:hover { color:var(--ice2); border-color:rgba(45,180,255,0.5); }
.kattab.aktiv { color:#131C3A; background:linear-gradient(120deg,var(--goldhell),var(--gold)); border-color:transparent; }
.kat-leer { text-align:center; color:var(--muted); font-size:13.5px; padding:34px 20px; border:1px dashed var(--line); border-radius:14px; }

/* Verkaufte Referenz-Objekte */
.fcard.verkauft { cursor:default; }
.fcard.verkauft:hover { transform:none; border-color:var(--line); box-shadow:none; }
.fcard.verkauft .fimg img { filter:grayscale(0.55) brightness(0.85); }
.fcard.verkauft:hover .fimg img { transform:none; }
.tag.sold { background:rgba(6,11,28,0.85); color:var(--gold); border:1px solid rgba(224,190,126,0.6); }
.fprice.sold { background:none; -webkit-text-fill-color:var(--gold); color:var(--gold); font-size:14px; }

/* Exposé-Seite (objekt.html) */
.expo { max-width:1100px; margin:0 auto; padding:0 clamp(20px,5vw,60px); position:relative; z-index:2; }
.expo-grid { display:grid; grid-template-columns:1.55fr 1fr; gap:26px; align-items:start; margin-top:30px; }
.expo-gallery .main { border-radius:18px; overflow:hidden; border:1px solid var(--line); aspect-ratio:16/10; background:#0D1734; }
.expo-gallery .main img { width:100%; height:100%; object-fit:cover; }
.expo-thumbs { display:grid; grid-template-columns:repeat(6,1fr); gap:8px; margin-top:10px; }
.expo-thumbs img { width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:8px; cursor:pointer; border:1px solid var(--line); opacity:0.65; transition:opacity 0.2s, border-color 0.2s; }
.expo-thumbs img.akt, .expo-thumbs img:hover { opacity:1; border-color:var(--gold); }
.expo-facts { background:rgba(13,22,48,0.6); border:1px solid var(--line); border-radius:18px; padding:24px; backdrop-filter:blur(10px); position:sticky; top:110px; }
.expo-price { font-family:'Sora',sans-serif; font-size:30px; font-weight:800; background:linear-gradient(90deg,var(--goldhell),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; margin-bottom:14px; }
.expo-fact { display:flex; justify-content:space-between; gap:14px; border-bottom:1px solid rgba(46,107,255,0.18); padding:10px 0; font-size:13.5px; color:var(--muted); }
.expo-fact:last-of-type { border-bottom:none; }
.expo-fact b { color:var(--text); font-weight:600; text-align:right; }
.expo-facts .cta { display:block; text-align:center; margin-top:18px; }
.expo-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; }
.expo-chips span { font-size:11px; padding:5px 11px; border:1px solid rgba(224,190,126,0.35); border-radius:99px; color:var(--muted); background:rgba(224,190,126,0.06); }
.expo-texts { margin-top:44px; display:flex; flex-direction:column; gap:30px; max-width:820px; }
.expo-texts h2 { font-size:19px; font-weight:700; margin-bottom:10px; }
.expo-texts h2::after { content:""; display:block; width:44px; height:2px; margin-top:8px; background:linear-gradient(90deg,var(--gold),transparent); }
.expo-texts p { color:var(--muted); line-height:1.85; font-size:14px; white-space:pre-line; }
.expo-back { display:inline-block; margin-bottom:18px; color:var(--ice2); font-size:13px; font-weight:600; }
.expo-lade { text-align:center; color:var(--muted); padding:80px 20px; position:relative; z-index:2; }
@media (max-width:860px){ .expo-grid{grid-template-columns:1fr;} .expo-facts{position:static;} .expo-thumbs{grid-template-columns:repeat(4,1fr);} }

/* Kompakte Seite (bewertung.html): alles enger, Fußzeile fest unten */
body.seite-kompakt { display:flex; flex-direction:column; min-height:100vh; }
.seite-kompakt .page-hero { padding:clamp(84px,10vh,104px) 22px 0; margin-top:auto; }
.seite-kompakt .page-hero h1 { font-size:clamp(26px,3.6vw,40px); }
.seite-kompakt .page-hero .sub { margin-top:10px; font-size:14px; max-width:520px; }
.seite-kompakt .funnel { margin-top:22px; }
.seite-kompakt .wizard-gross .f-balken { margin:14px auto 30px; }
.seite-kompakt .wizard-gross .f-frage { font-size:clamp(22px,3vw,30px); }
.seite-kompakt .wizard-gross .f-hinweis { margin-bottom:26px; }
.seite-kompakt .wizard-gross .f-box { min-height:165px; padding:28px 12px 22px; }
.seite-kompakt .badgerow { margin:30px 0 auto; padding-bottom:30px; }
.seite-kompakt footer { margin-top:0; }
/* Hintergrund auf der Kompakt-Seite fest ans Fenster geheftet (statt 125vh
   absolut) – sonst erzeugt er künstlich scrollbaren Leerraum */
.seite-kompakt .pagebg { position:fixed; inset:0; height:100vh; }

/* Entwurfs-Badge */
.note { position:fixed; right:14px; bottom:14px; z-index:60; background:rgba(224,190,126,0.95); color:#131C3A; font-size:11px; font-weight:700; padding:8px 14px; border-radius:99px; font-family:'Inter',sans-serif; }