:root{--navy:#071a33;--navy2:#0d2c54;--gold:#d4a547;--gold2:#f0cb7c;--cream:#f6f0e5;--paper:#fffdf8;--ink:#10233f;--muted:#5f6873;--line:#d8d1c4;--white:#fff;--shadow:0 15px 40px rgba(2,16,36,.18)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Segoe UI,Arial,sans-serif;color:var(--ink);background:var(--paper);line-height:1.55}a{color:inherit}.wrap{width:min(1180px,calc(100% - 40px));margin:auto}.site-header{position:sticky;top:0;z-index:30;background:rgba(5,21,43,.96);color:#fff;border-bottom:1px solid rgba(255,255,255,.12)}.nav-wrap{min-height:78px;display:flex;align-items:center;gap:22px}.brand{font-family:Georgia,serif;font-size:28px;color:var(--gold2);text-decoration:none;line-height:1}.brand span{display:block;margin-top:7px;font:11px Segoe UI,Arial,sans-serif;color:#c8d4e0;letter-spacing:.08em}.main-nav{display:flex;gap:18px;margin-left:auto}.main-nav a{text-decoration:none;font-size:14px;color:#edf4fb}.main-nav a:hover{color:var(--gold2)}.nav-toggle{display:none;margin-left:auto;background:none;border:0;color:#fff;font-size:26px}.btn{display:inline-flex;justify-content:center;align-items:center;padding:13px 20px;border-radius:6px;text-decoration:none;font-weight:700;border:1px solid transparent;cursor:pointer}.btn-gold{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#10233f;box-shadow:0 8px 20px rgba(0,0,0,.12)}.btn-outline{border-color:var(--gold2);color:var(--gold2);background:transparent}.nav-cta{padding:10px 16px;font-size:13px}.hero{position:relative;overflow:hidden;color:#fff;background:radial-gradient(circle at 76% 48%,rgba(228,177,72,.3),transparent 25%),linear-gradient(135deg,#071a33 0%,#0b2f5a 55%,#08192f 100%)}.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#fff 1px,transparent 1px);background-size:42px 42px;opacity:.08}.hero-grid{position:relative;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:38px;padding:44px 0}.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:12px;font-weight:700;color:#b27f2d}.hero .eyebrow,.stars .eyebrow,.dark .eyebrow{color:var(--gold2)}h1,h2,h3{font-family:Georgia,serif;line-height:1.15}h1{font-size:clamp(48px,7vw,76px);color:var(--gold2);margin:.1em 0 .2em}.hero h2{font-family:Segoe UI,Arial,sans-serif;font-size:22px;max-width:720px;color:#fff}.hero p{max-width:720px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}.hero-symbol{text-align:center}.numerology-wheel{width:360px;height:360px;margin:auto;border:1px solid rgba(240,203,124,.65);border-radius:50%;position:relative;box-shadow:0 0 50px rgba(240,203,124,.14),inset 0 0 45px rgba(240,203,124,.08)}.numerology-wheel:before,.numerology-wheel:after{content:"";position:absolute;inset:55px;border:1px solid rgba(240,203,124,.35);border-radius:50%}.numerology-wheel:after{inset:110px}.numerology-wheel span{position:absolute;left:50%;top:50%;font:32px Georgia,serif;color:var(--gold2);transform-origin:0 0}.numerology-wheel span:nth-child(1){transform:rotate(0deg) translate(0,-150px) rotate(0deg)}.numerology-wheel span:nth-child(2){transform:rotate(40deg) translate(0,-150px) rotate(-40deg)}.numerology-wheel span:nth-child(3){transform:rotate(80deg) translate(0,-150px) rotate(-80deg)}.numerology-wheel span:nth-child(4){transform:rotate(120deg) translate(0,-150px) rotate(-120deg)}.numerology-wheel span:nth-child(5){transform:rotate(160deg) translate(0,-150px) rotate(-160deg)}.numerology-wheel span:nth-child(6){transform:rotate(200deg) translate(0,-150px) rotate(-200deg)}.numerology-wheel span:nth-child(7){transform:rotate(240deg) translate(0,-150px) rotate(-240deg)}.numerology-wheel span:nth-child(8){transform:rotate(280deg) translate(0,-150px) rotate(-280deg)}.numerology-wheel span:nth-child(9){transform:rotate(320deg) translate(0,-150px) rotate(-320deg)}.numerology-wheel strong{position:absolute;inset:0;display:grid;place-items:center;font:64px Georgia,serif;color:#f6d995}.hero-symbol p{font:italic 26px Georgia,serif;color:#f2d7a1}.offer-strip{background:#0b2547;color:#fff;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.08)}.offer-grid{display:grid;grid-template-columns:1.2fr .75fr repeat(4,1fr);align-items:stretch}.offer-box,.price-box,.mini-benefit{padding:18px;border-right:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;justify-content:center}.offer-box strong{color:var(--gold2)}.price-box{background:linear-gradient(135deg,#841f2b,#a72f3b);text-align:center}.price-box strong{font-size:30px}.mini-benefit{font-size:13px}.section{padding:40px 0}.light{background:var(--cream)}.dark,.stars{background:linear-gradient(145deg,#07182f,#0b2a50);color:#fff}.two-col,.screenshot-grid,.upgrade-grid,.request-grid,.person-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}.card{background:rgba(255,255,255,.78);border:1px solid #e5ded1;border-radius:12px;padding:30px;box-shadow:0 10px 28px rgba(30,37,48,.06)}.card h3{font-size:28px;margin-top:0}.card li,.upgrade-copy li{margin:.4em 0}.screenshot-section img,.upgrade-visual img,.preview-grid img{width:100%;display:block;border-radius:10px;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.16)}.center{text-align:center}.feature-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:22px}.feature-grid article{text-align:center;padding:20px 14px;border-right:1px solid var(--line)}.feature-grid article:last-child{border-right:0}.icon{font-size:33px;color:#a87525}.stars{position:relative}.stars:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#fff 1px,transparent 1px);background-size:50px 50px;opacity:.06}.stars .wrap{position:relative}.upgrade-badge{display:inline-flex;gap:12px;align-items:center;padding:14px 18px;border-radius:8px;background:linear-gradient(135deg,#f2d18a,#d4a547);color:#10233f;margin:8px 0 15px}.upgrade-badge strong{font-size:24px}.upgrade-badge span{max-width:220px}.small{font-size:13px;color:#6c7480}.dark .small,.stars .small{color:#c6d3df}.preview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:22px}.preview-grid figure{margin:0;background:#fff;border:1px solid #dfd7c9;border-radius:10px;overflow:hidden}.preview-grid figcaption{padding:18px;text-align:center}.preview-grid figcaption strong,.preview-grid figcaption span{display:block}.preview-grid figcaption span{font-size:14px;color:#65707a;margin-top:5px}.development-note{max-width:1000px;margin:22px auto 0;font-size:13px;text-align:center;color:#69717a}.testimonials{background:#0a2241;color:#fff}.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:20px}.testimonial-grid blockquote{margin:0;padding:24px;border:1px solid rgba(240,203,124,.35);border-radius:10px;background:rgba(255,255,255,.03)}.testimonial-grid cite{display:block;margin-top:15px;color:var(--gold2);font-style:normal}.request-form{background:#fff;border:1px solid #ddd3c2;border-radius:12px;padding:26px;box-shadow:0 12px 28px rgba(20,31,46,.08)}.request-form label{display:block;font-weight:600;margin-bottom:14px}.request-form input,.request-form select{width:100%;padding:12px;margin-top:6px;border:1px solid #c7c0b7;border-radius:6px;font:inherit}.request-form .checkbox{display:flex;gap:10px;font-weight:400;align-items:flex-start}.request-form .checkbox input{width:auto;margin-top:5px}.person{background:#f8f2e7}.person-grid{grid-template-columns:220px 1fr}.portrait-placeholder{height:260px;border-radius:12px;background:linear-gradient(145deg,#d1c2a6,#8da0b3);display:grid;place-items:center;font:28px Georgia,serif;color:#fff}.narrow{max-width:780px}.site-footer{background:#06182f;color:#d5e1ec;padding:22px 0}.footer-grid{display:flex;justify-content:space-between;gap:30px}.footer-grid strong,.footer-grid span{display:block}.footer-grid strong{font:26px Georgia,serif;color:var(--gold2)}.footer-grid nav{display:flex;gap:20px;align-items:center}.footer-grid a{text-decoration:none}.success-page{min-height:100vh;background:linear-gradient(145deg,#07182f,#0b2a50);display:grid;place-items:center;padding:30px}.success-card{max-width:650px;background:#fff;border-radius:16px;padding:40px;box-shadow:var(--shadow)}
@media(max-width:1050px){.main-nav{display:none;position:absolute;top:78px;left:0;right:0;background:#071a33;padding:20px;flex-direction:column}.main-nav.open{display:flex}.nav-toggle{display:block}.nav-cta{display:none}.feature-grid{grid-template-columns:repeat(2,1fr)}.offer-grid{grid-template-columns:1fr 1fr 1fr}.hero-grid{grid-template-columns:1fr}.hero-symbol{display:none}.hero{min-height:auto}.hero-grid{min-height:auto;padding:80px 0}.preview-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.wrap{width:min(100% - 24px,1180px)}.section{padding:54px 0}.brand{font-size:22px}.two-col,.screenshot-grid,.upgrade-grid,.request-grid,.person-grid{grid-template-columns:1fr}.offer-grid{grid-template-columns:1fr 1fr}.mini-benefit{display:none}.feature-grid,.preview-grid,.testimonial-grid{grid-template-columns:1fr}.feature-grid article{border-right:0;border-bottom:1px solid var(--line)}.footer-grid{flex-direction:column}.footer-grid nav{flex-wrap:wrap}.person-grid{grid-template-columns:1fr}.portrait-placeholder{height:220px}.hero h2{font-size:18px}.btn{width:100%}.hero-actions{flex-direction:column}}

/* Anklickbare Screenshots / Großansicht */
.screenshot-link{position:relative;display:block;text-decoration:none;cursor:zoom-in;border-radius:10px;overflow:hidden}
.screenshot-link img{transition:transform .2s ease,filter .2s ease}
.screenshot-link:hover img{transform:scale(1.01);filter:brightness(.92)}
.zoom-hint{position:absolute;right:10px;bottom:10px;padding:7px 10px;border-radius:5px;background:rgba(5,21,43,.88);color:#fff;font-size:12px;line-height:1.2;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.lightbox{position:fixed;inset:0;z-index:1000;display:none;background:rgba(0,8,20,.94);color:#fff}
.lightbox.open{display:block}
.lightbox-scroll{position:absolute;inset:0;overflow:auto;padding:64px 30px 30px}
.lightbox-figure{width:max-content;min-width:100%;margin:0;display:flex;flex-direction:column;align-items:center}
.lightbox-image{display:block;max-width:none;max-height:none;width:auto;height:auto;cursor:zoom-out;box-shadow:0 18px 60px rgba(0,0,0,.55);background:#fff}
.lightbox-caption{position:sticky;left:0;right:0;margin:14px auto 0;padding:7px 12px;border-radius:5px;background:rgba(5,21,43,.9);color:#fff;font-size:14px;width:max-content;max-width:calc(100vw - 60px)}
.lightbox-close{position:fixed;top:14px;right:20px;z-index:1002;width:42px;height:42px;border:1px solid rgba(255,255,255,.45);border-radius:50%;background:rgba(5,21,43,.92);color:#fff;font-size:30px;line-height:36px;cursor:pointer}
body.lightbox-open{overflow:hidden}
@media(max-width:760px){.lightbox-scroll{padding:58px 14px 20px}.zoom-hint{font-size:11px}.lightbox-caption{max-width:calc(100vw - 28px)}}

/* Unsichtbares Anti-Spam-Feld fuer das Anfrageformular */
.hp-field {
  position: absolute !important;
  left: -10000px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* Mobile-Optimierungen V10 */
@media (max-width:1050px){
  .site-header{backdrop-filter:blur(8px)}
  .nav-wrap{min-height:70px;position:relative}
  .brand{max-width:70%}
  .main-nav{top:70px;max-height:calc(100vh - 70px);overflow-y:auto;box-shadow:0 18px 35px rgba(0,0,0,.28);border-top:1px solid rgba(255,255,255,.08)}
  .main-nav a{padding:11px 6px;border-bottom:1px solid rgba(255,255,255,.08);font-size:16px}
  .main-nav a:last-child{border-bottom:0}
  .nav-toggle{min-width:44px;min-height:44px;padding:6px;border-radius:6px;cursor:pointer}
  .nav-toggle:focus-visible,.main-nav a:focus-visible,.btn:focus-visible,.screenshot-link:focus-visible{outline:3px solid var(--gold2);outline-offset:3px}
  .offer-grid{grid-template-columns:1.2fr .8fr 1fr 1fr}
  .mini-benefit:nth-of-type(n+3){display:none}
}

@media (max-width:760px){
  html{scroll-padding-top:70px}
  body{font-size:16px;line-height:1.6}
  .wrap{width:calc(100% - 28px)}
  .site-header{position:sticky}
  .nav-wrap{min-height:66px;gap:12px}
  .brand{font-size:20px;max-width:calc(100% - 58px)}
  .brand span{font-size:9px;letter-spacing:.045em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .main-nav{top:66px;padding:12px 18px 20px}
  .nav-toggle{font-size:24px}

  .hero-grid{padding:34px 0 30px}
  .hero .eyebrow{font-size:11px;letter-spacing:.12em}
  h1{font-size:clamp(36px,11vw,48px);line-height:1.08;margin:.14em 0 .28em;overflow-wrap:anywhere}
  .hero h2{font-size:19px;line-height:1.35;margin-bottom:16px}
  .hero p{font-size:16px}
  .hero-actions{gap:10px;margin-top:22px}
  .btn{min-height:48px;padding:13px 16px}

  .offer-grid{grid-template-columns:1fr 1fr}
  .offer-box,.price-box,.mini-benefit{padding:14px 12px;min-height:86px;border-bottom:1px solid rgba(255,255,255,.12)}
  .offer-box{font-size:14px}
  .price-box strong{font-size:27px}
  .mini-benefit{display:flex!important;font-size:12px;text-align:center;align-items:center}
  .mini-benefit:nth-of-type(n+5){display:none!important}

  .section{padding:30px 0}
  h2{font-size:clamp(29px,8.5vw,38px);margin-top:.25em}
  h3{font-size:25px}
  .eyebrow{letter-spacing:.12em;line-height:1.4}
  .card{padding:22px 20px}
  .two-col,.screenshot-grid,.upgrade-grid,.request-grid,.person-grid{gap:24px}

  .feature-grid{gap:0;margin-top:25px}
  .feature-grid article{padding:17px 10px}
  .icon{font-size:28px}

  .upgrade-badge{display:flex;width:100%;padding:13px 14px;gap:9px;align-items:flex-start}
  .upgrade-badge strong{font-size:21px;white-space:nowrap}
  .upgrade-badge span{font-size:13px;max-width:none}
  .upgrade-copy ul{padding-left:22px}
  .upgrade-copy .hero-actions{margin-top:20px}

  .preview-grid{gap:18px;margin-top:26px}
  .preview-grid figcaption{padding:15px 14px}
  .development-note{font-size:12px;line-height:1.55}
  .zoom-hint{padding:6px 8px;right:8px;bottom:8px;background:rgba(5,21,43,.92)}

  .testimonial-grid{gap:14px}
  .testimonial-grid blockquote{padding:20px 18px}

  .request-grid{align-items:start}
  .request-form{padding:20px 18px}
  .request-form input,.request-form select{min-height:46px;font-size:16px}
  .request-form .checkbox{line-height:1.45}
  .request-form button{margin-top:4px}

  .person-grid{grid-template-columns:1fr}
  .portrait-placeholder{height:190px;max-width:280px;width:100%;margin:auto}

  .footer-grid{gap:20px;text-align:center}
  .footer-grid nav{justify-content:center;gap:12px 18px}
  .footer-grid nav a{padding:4px 0}

  .lightbox-scroll{padding:58px 10px 18px}
  .lightbox-close{top:10px;right:10px;width:44px;height:44px;font-size:30px}
  .lightbox-caption{font-size:12px;max-width:calc(100vw - 20px)}
}

@media (max-width:420px){
  .wrap{width:calc(100% - 22px)}
  .brand{font-size:18px}
  .brand span{display:none}
  h1{font-size:34px}
  .hero h2{font-size:18px}
  .offer-grid{grid-template-columns:1fr 1fr}
  .offer-box,.price-box,.mini-benefit{min-height:78px;padding:11px 9px}
  .mini-benefit{font-size:11px}
  .card{padding:20px 16px}
  .upgrade-badge{flex-direction:column;gap:3px}
  .upgrade-badge strong{white-space:normal}
  .request-form{padding:18px 14px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ============================================================
   SOFTWARE-DROPDOWN
   ============================================================ */
.nav-dropdown{
  position:relative;
  display:flex;
  align-items:center;
}

.nav-dropdown-toggle{
  appearance:none;
  border:0;
  background:transparent;
  color:#edf4fb;
  font:inherit;
  font-size:14px;
  cursor:pointer;
  padding:0;
  display:flex;
  align-items:center;
  gap:.28rem;
}

.nav-dropdown-toggle:hover,
.nav-dropdown-toggle:focus-visible{
  color:var(--gold2);
}

.nav-dropdown-toggle .nav-arrow{
  font-size:.72em;
  line-height:1;
  transition:transform .18s ease;
}

.nav-dropdown-menu{
  position:absolute;
  top:calc(100% + 14px);
  left:50%;
  transform:translateX(-50%);
  min-width:285px;
  padding:10px;
  background:#fff;
  border:1px solid #e3dccd;
  border-radius:14px;
  box-shadow:0 16px 38px rgba(10,20,40,.18);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:1000;
}

.nav-dropdown-menu:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-15px;
  height:15px;
}

.nav-dropdown-menu a,
.nav-dropdown-menu .nav-pending{
  display:block;
  padding:10px 12px;
  border-radius:9px;
  color:#17233a;
  text-decoration:none;
  white-space:nowrap;
  font-size:14px;
}

.nav-dropdown-menu a:hover,
.nav-dropdown-menu a:focus{
  background:#f4efe5;
  color:#8a6724;
}

.nav-dropdown-menu .nav-pending{
  color:#7c8492;
}

.nav-dropdown-menu .nav-separator{
  height:1px;
  background:#ebe5d8;
  margin:6px 5px;
}

.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.nav-dropdown.open .nav-arrow{
  transform:rotate(180deg);
}

@media (max-width:1050px){
  .nav-dropdown{
    display:block;
    width:100%;
  }

  .nav-dropdown-toggle{
    width:100%;
    justify-content:space-between;
    padding:11px 6px;
    border-bottom:1px solid rgba(255,255,255,.08);
    font-size:16px;
  }

  .nav-dropdown-menu{
    position:static;
    transform:none;
    min-width:0;
    width:100%;
    margin-top:7px;
    padding:6px 0 4px 12px;
    border:0;
    border-left:2px solid var(--gold);
    border-radius:0;
    box-shadow:none;
    background:transparent;
    display:none;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }

  .nav-dropdown.open .nav-dropdown-menu{
    display:block;
  }

  .nav-dropdown-menu a,
  .nav-dropdown-menu .nav-pending{
    color:#edf4fb;
    padding:8px 10px;
    white-space:normal;
    border-bottom:0;
  }

  .nav-dropdown-menu a:hover,
  .nav-dropdown-menu a:focus{
    background:rgba(255,255,255,.08);
    color:var(--gold2);
  }

  .nav-dropdown-menu .nav-pending{
    opacity:.65;
  }

  .nav-dropdown-menu .nav-separator{
    background:rgba(255,255,255,.15);
  }
}



/* Startseite V4: kompakter und Screenshot-Hinweise unterhalb der Beschreibungen */
.price-box-link{
  color:#fff;
  text-decoration:none;
  cursor:pointer;
}
.price-box-link:hover,
.price-box-link:focus-visible{
  filter:brightness(1.06);
}

.home-screenshot{
  margin:0;
  width:100%;
  text-align:center;
}
.home-screenshot > .screenshot-link:first-child{
  display:block;
  overflow:hidden;
  border-radius:10px;
}
.home-screenshot .screenshot-description{
  width:100%;
  margin:8px 0 0;
  padding:7px 10px;
  text-align:center;
  font-size:13px;
  line-height:1.35;
  color:inherit;
  background:rgba(255,255,255,.07);
  border-radius:6px;
}
.version5-preview .home-screenshot .screenshot-description{
  color:#59636d;
  background:#f4efe5;
}
.home-screenshot .screenshot-hint{
  position:static !important;
  display:inline-block !important;
  width:auto;
  margin:6px auto 0;
  padding:0;
  border-radius:0;
  background:transparent !important;
  color:inherit !important;
  font-size:11px;
  line-height:1.25;
  box-shadow:none !important;
  text-decoration:underline;
  cursor:zoom-in;
  opacity:.72;
  overflow:visible;
}
.dark .home-screenshot .screenshot-hint,
.stars .home-screenshot .screenshot-hint{
  color:#dce7f3 !important;
}
.home-screenshot .screenshot-hint:hover,
.home-screenshot .screenshot-hint:focus-visible{
  opacity:1;
}
.preview-grid figure{
  overflow:visible;
}
.preview-grid figcaption{
  padding:12px 14px 8px;
}
.two-col,.screenshot-grid,.upgrade-grid,.person-grid{
  gap:24px;
}
.card{
  padding:24px;
}
.hero-actions{
  margin-top:18px;
}
.development-note{
  margin-top:14px;
}
.testimonial-grid blockquote{
  padding:20px;
}

@media(max-width:760px){
  .two-col,.screenshot-grid,.upgrade-grid,.person-grid{gap:18px}
  .card{padding:18px}
  .preview-grid{gap:14px;margin-top:18px}
  .home-screenshot .screenshot-description{font-size:12px}
  .home-screenshot .screenshot-hint{font-size:10px}
}


/* Menüleiste wie in der bisherigen Startseite */
.nav-wrap{
  flex-wrap:nowrap;
}
.brand{
  flex:0 0 auto;
  white-space:nowrap;
}
.brand span{
  white-space:nowrap;
}
.main-nav{
  flex:0 0 auto;
  align-items:center;
  white-space:nowrap;
}
.main-nav a{
  white-space:nowrap;
}
.nav-cta{
  flex:0 0 auto;
  white-space:nowrap;
}
