
    :root{
      --green:#17a34a;
      --green-dark:#12873d;
      --green-deep:#0d662e;
      --mint:#dff2e4;
      --mint-2:#eaf8ef;
      --cream:#f6faf7;
      --paper:#ffffff;
      --ink:#142118;
      --muted:#647067;
      --line:#dce8df;
      --shadow:0 24px 70px rgba(12,76,35,.13);
      --shadow-soft:0 12px 34px rgba(12,76,35,.08);
      --radius:24px;
      --max:1120px;
    }

    *{
      box-sizing:border-box;
      margin:0;
      padding:0;
    }

    html{
      scroll-behavior:smooth;
    }

    body{
      font-family:"Poppins",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
      color:var(--ink);
      background:
        radial-gradient(circle at 88% 8%,rgba(40,167,69,.13),transparent 25rem),
        radial-gradient(circle at 4% 34%,rgba(23,163,74,.07),transparent 22rem),
        var(--cream);
      line-height:1.65;
      -webkit-font-smoothing:antialiased;
      overflow-x:hidden;
    }

    img{
      display:block;
      max-width:100%;
      height:auto;
    }

    a{
      color:inherit;
    }

    .wrap{
      width:min(var(--max),calc(100% - 34px));
      margin:auto;
    }

    .skip-link{
      position:absolute;
      left:-9999px;
      top:10px;
      background:#fff;
      padding:10px 14px;
      border-radius:8px;
      z-index:999;
    }

    .skip-link:focus{
      left:10px;
    }

    .topbar{
      padding:8px 20px;
      color:#fff;
      background:linear-gradient(90deg,#28a745,#1f7a31);
      text-align:center;
      font-size:.82rem;
      font-weight:700;
      letter-spacing:.02em;
    }

    header{
      padding:14px 0 4px;
    }

    .header-inner{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:22px;
    }

    .brand{
      display:inline-flex;
      align-items:center;
      gap:10px;
      color:var(--ink);
      text-decoration:none;
      font-size:1.18rem;
      font-weight:900;
      letter-spacing:-.035em;
    }

    .brand-mark{
      width:13px;
      height:13px;
      border-radius:50%;
      background:var(--green);
      box-shadow:0 0 0 5px rgba(23,163,74,.13);
    }

    .site-nav{
      display:flex;
      align-items:center;
      justify-content:flex-end;
      gap:4px;
      margin-left:auto;
      white-space:nowrap;
    }

    .site-nav a{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:38px;
      padding:8px 12px;
      border-radius:999px;
      color:#526158;
      text-decoration:none;
      font-size:.75rem;
      font-weight:800;
      transition:background .16s ease,color .16s ease,transform .16s ease;
    }

    .site-nav a:hover,
    .site-nav a:focus-visible{
      color:var(--green-dark);
      background:var(--mint-2);
      transform:translateY(-1px);
      outline:none;
    }

    .site-nav a.active{
      color:var(--green-dark);
      background:var(--mint-2);
    }

    .hero-wrap{
      padding:6px 0 34px;
    }

    .sticker-promo{
      position:relative;
      display:grid;
      grid-template-columns:112px minmax(0,1fr) auto;
      gap:22px;
      align-items:center;
      margin-top:16px;
      padding:18px 20px;
      overflow:hidden;
      border:1px solid #cfe2d4;
      border-radius:21px;
      background:
        radial-gradient(circle at 92% 15%,rgba(40,167,69,.13),transparent 15rem),
        rgba(255,255,255,.96);
      box-shadow:var(--shadow-soft);
    }

    .sticker-promo:after{
      content:"";
      position:absolute;
      right:-48px;
      bottom:-75px;
      width:150px;
      height:150px;
      border-radius:50%;
      background:rgba(23,163,74,.08);
      pointer-events:none;
    }

    .sticker-promo-image{
      position:relative;
      z-index:1;
      width:104px;
      aspect-ratio:1;
      filter:drop-shadow(0 10px 14px rgba(14,78,34,.18));
      transform:rotate(-4deg);
    }

    .sticker-promo-image img{
      width:100%;
      height:100%;
      object-fit:cover;
      clip-path:circle(46% at 50% 50%);
      transform:scale(1.07);
    }

    .sticker-promo-copy{
      position:relative;
      z-index:1;
      min-width:0;
    }

    .sticker-promo-kicker{
      margin-bottom:3px;
      color:var(--green-dark);
      font-size:.72rem;
      font-weight:800;
      letter-spacing:.07em;
      text-transform:uppercase;
    }

    .sticker-promo h2{
      font-size:clamp(1.3rem,2.3vw,1.8rem);
      line-height:1.15;
      letter-spacing:-.035em;
    }

    .sticker-promo-text{
      margin-top:5px;
      color:var(--muted);
      font-size:.84rem;
      line-height:1.5;
    }

    .sticker-promo-timing{
      display:block;
      margin-top:4px;
      color:#46604e;
      font-size:.75rem;
      font-weight:600;
    }

    .sticker-promo .btn{
      position:relative;
      z-index:1;
      min-width:170px;
      white-space:nowrap;
    }

    .hero{
      position:relative;
      display:grid;
      grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr);
      gap:34px;
      align-items:center;
      overflow:hidden;
      padding:34px 42px 36px;
      border:1px solid #dce9df;
      border-radius:28px;
      background:
        radial-gradient(circle at 86% 14%,rgba(40,167,69,.13),transparent 19rem),
        linear-gradient(165deg,rgba(255,255,255,.98),rgba(240,250,243,.97));
      box-shadow:var(--shadow);
    }

    .hero:after{
      content:"";
      position:absolute;
      width:210px;
      height:210px;
      border-radius:42% 58% 62% 38% / 47% 42% 58% 53%;
      right:-70px;
      bottom:-90px;
      background:rgba(22,138,67,.10);
      transform:rotate(18deg);
    }

    .hero-copy{
      position:relative;
      z-index:2;
    }

    .mini-note{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:7px 12px;
      border:1px solid #cfe2d4;
      border-radius:999px;
      background:rgba(255,255,255,.72);
      color:var(--green-dark);
      font-size:.78rem;
      font-weight:700;
      margin-bottom:13px;
    }

    .mini-note:before{
      content:"";
      width:7px;
      height:7px;
      border-radius:50%;
      background:var(--green);
    }

    h1{
      font-size:clamp(2.05rem,3.35vw,3.05rem);
      line-height:1.07;
      letter-spacing:-.05em;
      max-width:660px;
    }

    .hero-copy > p{
      max-width:690px;
      margin-top:16px;
      color:#4f5e54;
      font-size:clamp(.96rem,1.35vw,1.05rem);
    }

    .hero-actions{
      display:flex;
      gap:12px;
      flex-wrap:wrap;
      margin-top:22px;
    }

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:48px;
      padding:11px 18px;
      border-radius:14px;
      font-weight:800;
      text-decoration:none;
      border:1px solid transparent;
      transition:.18s ease;
    }

    .btn:hover{
      transform:translateY(-2px);
    }

    .btn-green{
      background:linear-gradient(90deg,#28a745,#1f7a31);
      color:#fff;
      box-shadow:0 10px 24px rgba(22,138,67,.20);
    }

    .btn-green:hover{
      background:var(--green-dark);
    }

    .btn-paper{
      background:rgba(255,255,255,.86);
      color:var(--green-dark);
      border-color:#cfe2d4;
    }

    .hero-visual{
      position:relative;
      z-index:2;
      padding:10px 4px 8px 18px;
    }

    .photo-frame{
      position:relative;
      padding:10px;
      border-radius:24px;
      background:#fff;
      transform:rotate(1.4deg);
      box-shadow:0 24px 50px rgba(42,83,54,.16);
    }

    .photo-frame img{
      width:100%;
      max-height:340px;
      object-fit:cover;
      object-position:top;
      border-radius:18px;
    }

    .photo-label{
      position:absolute;
      left:-16px;
      bottom:26px;
      max-width:250px;
      padding:12px 15px;
      border-radius:14px;
      background:#fff;
      border:1px solid var(--line);
      box-shadow:var(--shadow-soft);
      transform:rotate(-2.3deg);
      font-size:.82rem;
      font-weight:600;
      line-height:1.45;
    }

    .photo-label strong{
      display:block;
      color:var(--green-dark);
      margin-bottom:2px;
    }

    section{
      padding:72px 0;
    }

    h2{
      font-size:clamp(1.85rem,3.2vw,2.8rem);
      line-height:1.12;
      letter-spacing:-.045em;
    }

    h3{
      line-height:1.3;
    }

    .eyebrow{
      font-size:.76rem;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:var(--green);
      margin-bottom:8px;
    }

    .section-head{
      max-width:760px;
      margin-bottom:30px;
    }

    .section-head.center{
      text-align:center;
      margin-left:auto;
      margin-right:auto;
    }

    .section-head p{
      margin-top:10px;
      color:var(--muted);
    }

    .blog-all-link{
      display:inline-flex;
      align-items:center;
      gap:7px;
      margin-top:14px;
      padding:9px 13px;
      border:1px solid #cfe2d4;
      border-radius:999px;
      background:#fff;
      color:var(--green-dark);
      font-size:.8rem;
      font-weight:800;
      text-decoration:none;
      transition:.18s ease;
    }

    .blog-all-link:hover{
      transform:translateY(-1px);
      border-color:#b9d9c1;
      background:var(--mint-2);
    }

    .paper{
      background:rgba(255,255,255,.76);
      border-top:1px solid rgba(18,111,49,.08);
      border-bottom:1px solid rgba(18,111,49,.08);
    }

    .social-strip{
      padding:0 0 34px;
    }

    .social-shell{
      padding:28px;
      border:1px solid var(--line);
      border-radius:28px;
      background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(245,251,247,.98));
      box-shadow:var(--shadow-soft);
    }

    .social-head{
      max-width:760px;
      margin-bottom:20px;
    }

    .social-kicker{
      display:inline-block;
      margin-bottom:8px;
      font-size:.78rem;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:var(--green);
    }

    .social-head h2{
      margin:0 0 8px;
      font-size:clamp(1.5rem,2.8vw,2.15rem);
      line-height:1.05;
    }

    .social-head p{
      margin:0;
      color:var(--muted);
      max-width:680px;
    }

    .social-grid{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:14px;
    }

    .social-option{
      position:relative;
      display:flex;
      flex-direction:column;
      gap:14px;
      min-height:100%;
      padding:18px;
      border-radius:22px;
      border:1px solid var(--line);
      background:#fff;
      text-decoration:none;
      color:var(--ink);
      transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
      box-shadow:0 10px 28px rgba(12,76,35,.05);
    }

    .social-option:hover{
      transform:translateY(-2px);
      border-color:rgba(18,135,61,.22);
      box-shadow:0 18px 36px rgba(12,76,35,.10);
    }

    .social-option.featured{
      border-color:rgba(23,163,74,.24);
      background:linear-gradient(180deg,#fff 0%,#f3fbf6 100%);
      box-shadow:0 14px 34px rgba(23,163,74,.10);
    }

    .social-badge{
      position:absolute;
      top:14px;
      right:14px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:5px 9px;
      border-radius:999px;
      background:var(--mint);
      color:var(--green-dark);
      font-size:.68rem;
      font-weight:800;
      letter-spacing:.04em;
      text-transform:uppercase;
    }

    .social-platform-icon{
      width:52px;
      height:52px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border-radius:16px;
      background:var(--mint-2);
      color:var(--green-dark);
      flex-shrink:0;
    }

    .social-platform-icon svg{
      width:24px;
      height:24px;
      display:block;
      fill:currentColor;
    }

    .social-option-copy{
      display:flex;
      flex-direction:column;
      gap:6px;
      flex:1;
    }

    .social-option-top{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
    }

    .social-option-top strong{
      font-size:1.08rem;
      line-height:1.15;
    }

    .social-arrow{
      color:var(--green);
      font-size:1rem;
      font-weight:800;
      flex-shrink:0;
    }

    .social-option p{
      margin:0;
      color:var(--muted);
      font-size:.93rem;
      line-height:1.5;
    }

    .social-cta{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:44px;
      padding:11px 14px;
      border-radius:999px;
      background:var(--mint-2);
      color:var(--green-dark);
      font-size:.88rem;
      font-weight:800;
      line-height:1.2;
      text-align:center;
    }

    .social-option.featured .social-cta{
      background:linear-gradient(135deg,var(--green) 0%,var(--green-dark) 100%);
      color:#fff;
    }

    .start-grid{
      display:grid;
      grid-template-columns:1.1fr .9fr .9fr;
      gap:18px;
    }

    .start-card{
      position:relative;
      min-height:260px;
      padding:28px;
      border-radius:24px;
      border:1px solid var(--line);
      background:#fff;
      text-decoration:none;
      overflow:hidden;
      transition:.18s ease;
    }

    .start-card:hover{
      transform:translateY(-4px);
      box-shadow:var(--shadow);
    }

    .start-card.primary{
      background:linear-gradient(145deg,#28a745,#147d38);
      color:#fff;
      border-color:transparent;
    }

    .start-card.primary:after{
      content:"";
      position:absolute;
      width:180px;
      height:180px;
      border-radius:50%;
      right:-70px;
      bottom:-90px;
      background:rgba(255,255,255,.10);
    }

    .start-icon{
      font-size:1.65rem;
      margin-bottom:30px;
    }

    .start-card h3{
      font-size:1.28rem;
      max-width:280px;
    }

    .start-card p{
      margin-top:9px;
      font-size:.88rem;
      color:var(--muted);
      max-width:320px;
    }

    .start-card.primary p{
      color:rgba(255,255,255,.82);
    }

    .start-link{
      display:inline-block;
      margin-top:18px;
      font-weight:800;
      font-size:.86rem;
      color:var(--green-dark);
    }

    .start-card.primary .start-link{
      color:#fff;
    }

    .feature-post{
      display:grid;
      grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
      gap:0;
      overflow:hidden;
      border:1px solid var(--line);
      border-radius:26px;
      background:#fff;
      box-shadow:var(--shadow-soft);
    }

    .feature-post img{
      width:100%;
      height:100%;
      min-height:360px;
      object-fit:cover;
    }

    .feature-copy{
      padding:34px 36px;
      display:flex;
      flex-direction:column;
      justify-content:center;
    }

    .post-meta{
      font-size:.75rem;
      color:#7b877f;
      margin-bottom:9px;
    }

    .ad-label{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      margin-right:7px;
      padding:4px 8px;
      border-radius:7px;
      background:#111;
      color:#fff;
      font-size:.68rem;
      font-weight:900;
      line-height:1.2;
      letter-spacing:.045em;
      text-transform:uppercase;
      vertical-align:middle;
      white-space:nowrap;
    }

    .feature-copy h3{
      font-size:clamp(1.5rem,2.6vw,2.2rem);
      letter-spacing:-.035em;
    }

    .feature-copy p{
      color:var(--muted);
      margin-top:12px;
    }

    .text-link{
      display:inline-block;
      margin-top:20px;
      color:var(--green-dark);
      font-weight:800;
      text-decoration:none;
    }

    .text-link:hover{
      text-decoration:underline;
    }

    .mini-posts{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:18px;
      margin-top:18px;
    }

    .mini-post{
      display:grid;
      grid-template-columns:150px 1fr;
      gap:0;
      overflow:hidden;
      border:1px solid var(--line);
      border-radius:20px;
      background:#fff;
      min-height:180px;
    }

    .mini-post img{
      width:100%;
      height:100%;
      object-fit:cover;
    }

    .mini-post-body{
      padding:20px;
    }

    .mini-post h3{
      font-size:1.02rem;
    }

    .mini-post p{
      font-size:.83rem;
      color:var(--muted);
      margin-top:7px;
    }

    .mini-post a{
      display:inline-block;
      margin-top:13px;
      color:var(--green-dark);
      font-weight:800;
      text-decoration:none;
      font-size:.83rem;
    }

    /* SCHUFA-Ratgeber */
    .ratgeber-callout{
      display:grid;
      grid-template-columns:auto minmax(0,1fr) auto;
      gap:20px;
      align-items:center;
      margin-top:18px;
      padding:23px 25px;
      border:1px solid #cfe2d4;
      border-radius:20px;
      background:linear-gradient(135deg,#f6fbf7 0%,#eaf6ed 100%);
      text-decoration:none;
      transition:.18s ease;
    }

    .ratgeber-callout:hover{
      transform:translateY(-3px);
      box-shadow:var(--shadow-soft);
      border-color:#b9d9c1;
    }

    .ratgeber-badge{
      display:grid;
      place-items:center;
      width:68px;
      height:68px;
      border-radius:17px;
      background:var(--green);
      color:#fff;
      font-size:.73rem;
      font-weight:800;
      letter-spacing:.04em;
    }

    .ratgeber-content{
      min-width:0;
    }

    .ratgeber-content .post-meta{
      margin-bottom:4px;
      color:var(--green-dark);
      font-weight:600;
    }

    .ratgeber-content h3{
      font-size:1.08rem;
      line-height:1.35;
    }

    .ratgeber-content p{
      margin-top:6px;
      max-width:720px;
      color:var(--muted);
      font-size:.84rem;
    }

    .ratgeber-arrow{
      color:var(--green-dark);
      font-size:.84rem;
      font-weight:800;
      white-space:nowrap;
    }

    .reset{
      position:relative;
      overflow:hidden;
      display:grid;
      grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);
      gap:42px;
      align-items:center;
      padding:40px;
      border-radius:28px;
      background:#18221c;
      color:#fff;
    }

    .reset:after{
      content:"";
      position:absolute;
      right:-90px;
      top:-110px;
      width:260px;
      height:260px;
      border-radius:50%;
      background:rgba(73,190,112,.12);
    }

    .reset-copy{
      position:relative;
      z-index:1;
    }

    .reset-copy p{
      margin-top:11px;
      color:#c7d2ca;
      max-width:650px;
    }

    .reset-copy .btn{
      margin-top:21px;
    }

    .reset-preview{
      position:relative;
      z-index:1;
      padding:20px;
      border-radius:18px;
      background:#fff;
      color:var(--ink);
      box-shadow:0 18px 40px rgba(0,0,0,.22);
      transform:rotate(1deg);
    }

    .preview-head{
      display:flex;
      justify-content:space-between;
      gap:10px;
      align-items:center;
      font-weight:800;
      padding-bottom:12px;
    }

    .preview-head span{
      font-size:.67rem;
      color:var(--green);
      background:var(--mint-2);
      padding:5px 8px;
      border-radius:999px;
      text-transform:uppercase;
      letter-spacing:.06em;
    }

    .preview-row{
      display:grid;
      grid-template-columns:10px 1fr auto;
      gap:10px;
      align-items:center;
      padding:11px 0;
      border-top:1px solid #edf2ee;
      font-size:.85rem;
    }

    .dot{
      width:8px;
      height:8px;
      border-radius:50%;
      background:#d6a229;
    }

    .dot.red{
      background:#d95d50;
    }

    .dot.green{
      background:#2f9d5a;
    }

    .status{
      color:var(--muted);
      font-size:.75rem;
      white-space:nowrap;
    }

    .topics{
      display:grid;
      grid-template-columns:repeat(4,minmax(0,1fr));
      gap:14px;
    }

    .topic{
      padding:22px 20px;
      border:1px solid var(--line);
      border-radius:18px;
      background:#fff;
      text-decoration:none;
      transition:.18s ease;
    }

    .topic:hover{
      transform:translateY(-3px);
      box-shadow:var(--shadow-soft);
    }

    .topic .icon{
      font-size:1.35rem;
      margin-bottom:12px;
    }

    .topic h3{
      font-size:.98rem;
    }

    .topic p{
      font-size:.79rem;
      color:var(--muted);
      margin-top:6px;
    }

    .explain-grid{
      display:grid;
      grid-template-columns:repeat(4,minmax(0,1fr));
      gap:16px;
    }

    .explain-card{
      padding:24px;
      border:1px solid var(--line);
      border-radius:20px;
      background:#fff;
      box-shadow:0 7px 22px rgba(28,68,42,.045);
    }

    .explain-card .icon{
      font-size:1.45rem;
      margin-bottom:13px;
    }

    .explain-card h3{
      font-size:1.03rem;
    }

    .explain-card p{
      margin-top:8px;
      color:var(--muted);
      font-size:.86rem;
    }

    .explain-card a{
      display:inline-block;
      margin-top:15px;
      color:var(--green-dark);
      font-weight:800;
      text-decoration:none;
      font-size:.84rem;
    }

    .explain-card a:hover{
      text-decoration:underline;
    }

    .saving-guide{
      display:grid;
      grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
      gap:42px;
      align-items:start;
    }

    .saving-guide-copy{
      position:sticky;
      top:24px;
    }

    .saving-guide-copy p{
      margin-top:12px;
      color:var(--muted);
    }

    .saving-guide-copy .note{
      margin-top:20px;
      padding:16px 18px;
      border-left:4px solid var(--green);
      border-radius:0 14px 14px 0;
      background:var(--mint-2);
      color:#3e4e43;
      font-size:.9rem;
      font-weight:600;
    }

    .saving-list{
      display:grid;
      gap:12px;
    }

    .saving-row{
      display:grid;
      grid-template-columns:46px minmax(0,1fr) auto;
      gap:15px;
      align-items:center;
      padding:19px 20px;
      border:1px solid var(--line);
      border-radius:18px;
      background:#fff;
    }

    .saving-row .num{
      width:38px;
      height:38px;
      border-radius:12px;
      display:grid;
      place-items:center;
      background:var(--mint-2);
      color:var(--green-dark);
      font-weight:800;
      font-size:.83rem;
    }

    .saving-row h3{
      font-size:.98rem;
    }

    .saving-row p{
      margin-top:4px;
      color:var(--muted);
      font-size:.82rem;
    }

    .saving-row a{
      color:var(--green-dark);
      font-weight:800;
      text-decoration:none;
      font-size:.8rem;
      white-space:nowrap;
    }

    .saving-row a:hover{
      text-decoration:underline;
    }

    .simple-system{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:16px;
    }

    .system-step{
      padding:25px 24px;
      border-radius:20px;
      background:linear-gradient(145deg,#fff,#f6fbf7);
      border:1px solid var(--line);
    }

    .system-step strong{
      display:block;
      color:var(--green);
      font-size:.75rem;
      text-transform:uppercase;
      letter-spacing:.08em;
      margin-bottom:8px;
    }

    .system-step h3{
      font-size:1.08rem;
    }

    .system-step p{
      margin-top:8px;
      color:var(--muted);
      font-size:.86rem;
    }

    .story{
      display:grid;
      grid-template-columns:1fr 330px;
      gap:44px;
      align-items:center;
      padding:36px;
      border:1px solid var(--line);
      border-radius:28px;
      background:linear-gradient(135deg,#fff 0%,#f3faf5 100%);
    }

    .story-copy p{
      color:var(--muted);
      margin-top:12px;
    }

    .story-copy .quote{
      margin-top:21px;
      padding-left:16px;
      border-left:4px solid var(--green);
      color:#39473e;
      font-weight:600;
    }

    .story img{
      width:100%;
      aspect-ratio:1/1.12;
      object-fit:cover;
      object-position:top;
      border-radius:20px;
      box-shadow:var(--shadow-soft);
    }

    .workbook{
      display:grid;
      grid-template-columns:240px 1fr;
      gap:36px;
      align-items:center;
      padding:32px 38px;
      border:1px solid var(--line);
      border-radius:26px;
      background:#fff;
    }

    .workbook img{
      width:195px;
      justify-self:center;
      filter:drop-shadow(0 12px 18px rgba(0,0,0,.16));
    }

    .workbook p{
      color:var(--muted);
      margin-top:10px;
      max-width:650px;
    }

    .workbook .btn{
      margin-top:20px;
    }

    .faq{
      display:grid;
      gap:10px;
      max-width:860px;
      margin:auto;
    }

    .faq details{
      border:1px solid var(--line);
      border-radius:15px;
      background:#fff;
      padding:0 18px;
    }

    .faq summary{
      position:relative;
      cursor:pointer;
      list-style:none;
      padding:16px 38px 16px 0;
      font-weight:700;
    }

    .faq summary::after{
      content:"+";
      position:absolute;
      top:50%;
      right:2px;
      width:28px;
      height:28px;
      display:grid;
      place-items:center;
      transform:translateY(-50%);
      border-radius:50%;
      background:var(--mint-2);
      color:var(--green-dark);
      font-size:1.05rem;
      font-weight:800;
      line-height:1;
    }

    .faq details[open] summary::after{
      content:"−";
    }

    .faq summary::-webkit-details-marker{
      display:none;
    }

    .faq p{
      padding:0 0 17px;
      color:var(--muted);
      font-size:.9rem;
    }

    footer{
      background:#101813;
      color:#fff;
      padding:42px 0 24px;
      margin-top:18px;
    }

    .footer-inner{
      display:flex;
      justify-content:space-between;
      align-items:flex-end;
      gap:30px;
      flex-wrap:wrap;
    }

    .footer-brand{
      font-size:1.15rem;
      font-weight:900;
      letter-spacing:-.03em;
    }

    .footer-brand span{
      color:#48c764;
    }

    .footer-copy{
      margin-top:5px;
      color:#9fb0a5;
      font-size:.82rem;
      max-width:520px;
    }

    .footer-links{
      display:flex;
      gap:15px;
      flex-wrap:wrap;
    }

    .footer-links a{
      font-size:.82rem;
      color:#b7c4bb;
      text-decoration:none;
    }

    .footer-links a:hover{
      color:#fff;
    }

    .footer-bottom{
      margin-top:23px;
      padding-top:16px;
      border-top:1px solid rgba(255,255,255,.10);
      font-size:.72rem;
      color:#819188;
    }

    .hero > *,
    .start-grid > *,
    .feature-post > *,
    .mini-post > *,
    .reset > *,
    .story > *,
    .workbook > *{
      min-width:0;
    }

    h1,
    h2,
    h3,
    p,
    a,
    span,
    strong,
    summary{
      overflow-wrap:break-word;
    }


    /* Conversion-Optimierungen */
    .mobile-social-quick{
      display:none;
    }

    .mobile-social-link svg{
      display:block;
      width:16px;
      height:16px;
      fill:currentColor;
    }

    .hero-trustline{
      margin-top:11px;
      color:#6b786f;
      font-size:.76rem;
      font-weight:600;
    }

    .deal-facts{
      display:flex;
      flex-wrap:wrap;
      gap:7px;
      margin:0 0 12px;
    }

    .deal-facts span{
      display:inline-flex;
      align-items:center;
      min-height:28px;
      padding:5px 9px;
      border:1px solid #d6eadb;
      border-radius:999px;
      background:var(--mint-2);
      color:var(--green-dark);
      font-size:.71rem;
      font-weight:800;
      line-height:1.1;
    }

    .deal-facts.compact{
      gap:5px;
      margin:0 0 9px;
    }

    .deal-facts.compact span{
      min-height:24px;
      padding:4px 7px;
      font-size:.65rem;
    }

    .reset-proof,
    .workbook-proof{
      margin-top:10px;
      font-size:.74rem;
      font-weight:600;
    }

    .reset-proof{
      color:#aebbb2;
    }

    .workbook-proof{
      color:#5c6860;
      font-size:.78rem;
    }

    .saving-diagnosis{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:18px;
      margin-top:2px;
      padding:18px 20px;
      border:1px solid #d5e8da;
      border-radius:18px;
      background:linear-gradient(135deg,#eef9f1,#fff);
    }

    .saving-diagnosis strong{
      display:block;
      font-size:.95rem;
    }

    .saving-diagnosis span{
      display:block;
      margin-top:3px;
      color:var(--muted);
      font-size:.8rem;
    }

    .saving-diagnosis .btn{
      flex:0 0 auto;
      min-height:42px;
      padding:9px 14px;
      font-size:.8rem;
      white-space:nowrap;
    }

    .brand-principle{
      max-width:850px;
      margin:22px auto 0;
      text-align:center;
      color:#526158;
      font-size:.91rem;
      font-weight:600;
    }

    .story-social-cta{
      margin-top:22px;
      padding:15px 17px;
      border:1px solid #d5e8da;
      border-radius:16px;
      background:#fff;
    }

    .story-social-cta strong{
      display:block;
      margin-bottom:8px;
      font-size:.87rem;
    }

    .story-social-cta > div{
      display:flex;
      flex-wrap:wrap;
      gap:8px 15px;
    }

    .story-social-cta a{
      color:var(--green-dark);
      font-size:.82rem;
      font-weight:800;
      text-decoration:none;
    }

    .story-social-cta a:hover{
      text-decoration:underline;
    }

    .footer-cta{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:26px;
      margin-bottom:34px;
      padding:22px 24px;
      border:1px solid rgba(255,255,255,.12);
      border-radius:18px;
      background:rgba(255,255,255,.055);
    }

    .footer-cta strong{
      display:block;
      font-size:1rem;
    }

    .footer-cta span{
      display:block;
      max-width:660px;
      margin-top:4px;
      color:#9fb0a5;
      font-size:.8rem;
    }

    .footer-cta-actions{
      display:flex;
      flex-wrap:wrap;
      justify-content:flex-end;
      gap:10px 16px;
      flex:0 0 auto;
    }

    .footer-cta-actions a{
      color:#9ce6b4;
      font-size:.8rem;
      font-weight:800;
      text-decoration:none;
      white-space:nowrap;
    }

    .footer-cta-actions a:hover{
      color:#fff;
    }

    .deal-card{
      position:relative;
    }

    .deal-ended-badge{
      position:absolute;
      top:14px;
      right:14px;
      z-index:5;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:30px;
      padding:6px 11px;
      border-radius:999px;
      background:#b9382e;
      color:#fff;
      box-shadow:0 7px 18px rgba(105,25,20,.22);
      font-size:.7rem;
      font-weight:900;
      letter-spacing:.045em;
      text-transform:uppercase;
      pointer-events:none;
    }

    @media(max-width:1100px){
      .wrap{
        width:min(var(--max),calc(100% - 40px));
      }

      .hero{
        grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
        gap:30px;
        padding:32px 36px 34px;
      }

      .hero-visual{
        padding-left:10px;
      }

      .sticker-promo{
        grid-template-columns:100px minmax(0,1fr) auto;
        gap:18px;
      }

      .sticker-promo-image{
        width:94px;
      }

      .photo-label{
        left:-8px;
      }

      .start-grid{
        grid-template-columns:1fr 1fr 1fr;
      }

      .start-card{
        padding:24px;
        min-height:245px;
      }

      .feature-copy{
        padding:30px;
      }

      .mini-post{
        grid-template-columns:135px 1fr;
      }

      .reset{
        gap:30px;
        padding:34px;
      }

      .story{
        grid-template-columns:minmax(0,1fr) 290px;
        gap:32px;
      }

      .workbook{
        grid-template-columns:210px 1fr;
        gap:28px;
        padding:30px;
      }

      .workbook img{
        width:175px;
      }
    }

    @media(max-width:900px){
      header{
        padding-top:14px;
      }

      .hero-wrap{
        padding-bottom:56px;
      }

      .hero{
        grid-template-columns:1fr;
        gap:30px;
        padding:40px;
        border-radius:26px;
      }

      .hero-copy{
        max-width:760px;
      }

      .hero-visual{
        width:min(100%,520px);
        padding:0;
        margin:0 auto;
      }

      .sticker-promo{
        grid-template-columns:92px minmax(0,1fr);
      }

      .sticker-promo-image{
        width:86px;
      }

      .sticker-promo .btn{
        grid-column:2;
        justify-self:start;
      }

      .photo-frame{
        transform:none;
      }

      .photo-frame img{
        max-height:none;
        aspect-ratio:4/3.6;
      }

      .photo-label{
        left:16px;
        bottom:20px;
        transform:rotate(-1deg);
      }

      .social-grid{
        grid-template-columns:1fr 1fr;
      }

      .social-option.featured{
        grid-column:1 / -1;
      }

      .start-grid{
        grid-template-columns:1fr 1fr;
      }

      .start-card{
        min-height:230px;
      }

      .start-card.primary{
        grid-column:1 / -1;
        min-height:220px;
      }

      .feature-post{
        grid-template-columns:1fr;
      }

      .feature-post img{
        min-height:0;
        aspect-ratio:16/9;
        object-fit:cover;
      }

      .mini-posts{
        grid-template-columns:1fr;
      }

      .mini-post{
        grid-template-columns:170px minmax(0,1fr);
      }

      .ratgeber-callout{
        grid-template-columns:auto minmax(0,1fr);
      }

      .ratgeber-arrow{
        grid-column:2;
      }

      .reset{
        grid-template-columns:1fr;
        gap:28px;
      }

      .reset-preview{
        width:min(100%,620px);
        transform:none;
      }

      .topics{
        grid-template-columns:repeat(2,minmax(0,1fr));
      }

      .explain-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
      }

      .saving-guide{
        grid-template-columns:1fr;
        gap:26px;
      }

      .saving-guide-copy{
        position:static;
      }

      .simple-system{
        grid-template-columns:1fr;
      }

      .story{
        grid-template-columns:1fr;
        gap:26px;
      }

      .story img{
        width:min(100%,560px);
        max-height:520px;
        order:-1;
        justify-self:center;
        aspect-ratio:16/10;
      }

      .workbook{
        grid-template-columns:190px minmax(0,1fr);
      }
    }


    @media(max-width:700px){
      .header-inner{
        justify-content:space-between;
        align-items:center;
        flex-wrap:wrap;
        gap:9px 12px;
      }

      .site-nav{
        order:3;
        width:100%;
        justify-content:flex-start;
        gap:2px;
        overflow-x:auto;
        padding-top:7px;
        padding-bottom:2px;
        border-top:1px solid rgba(18,111,49,.08);
        scrollbar-width:none;
      }

      .site-nav::-webkit-scrollbar{
        display:none;
      }

      .site-nav a{
        flex:0 0 auto;
        min-height:34px;
        padding:7px 10px;
        font-size:.69rem;
      }

      .brand{
        flex:0 1 auto;
        min-width:0;
        order:1;
      }

      .mobile-social-quick{
        display:inline-flex;
        align-items:center;
        flex:0 0 auto;
        order:2;
        gap:2px;
        min-height:36px;
        padding:3px 4px 3px 10px;
        border:1px solid #cfe2d4;
        border-radius:999px;
        background:rgba(255,255,255,.94);
        box-shadow:0 6px 18px rgba(12,76,35,.08);
        white-space:nowrap;
      }

      .mobile-social-label{
        display:inline-flex;
        align-items:center;
        margin-right:2px;
        color:var(--green-dark);
        font-size:.69rem;
        font-weight:800;
        line-height:1;
        letter-spacing:-.01em;
      }

      .mobile-social-link{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:34px;
        height:34px;
        border-radius:50%;
        color:var(--ink);
        text-decoration:none;
        transition:transform .16s ease,background .16s ease,color .16s ease;
        -webkit-tap-highlight-color:transparent;
      }

      .mobile-social-link:hover,
      .mobile-social-link:focus-visible{
        background:var(--mint-2);
        color:var(--green-dark);
        transform:translateY(-1px);
        outline:none;
      }

      .mobile-social-link.whatsapp{
        background:linear-gradient(135deg,var(--green) 0%,var(--green-dark) 100%);
        color:#fff;
        box-shadow:0 5px 12px rgba(23,163,74,.18);
      }

      .mobile-social-link.whatsapp:hover,
      .mobile-social-link.whatsapp:focus-visible{
        background:var(--green-dark);
        color:#fff;
      }

      .hero-trustline{
        text-align:center;
        font-size:.7rem;
      }

      .saving-diagnosis{
        align-items:flex-start;
        flex-direction:column;
        gap:12px;
        padding:17px;
      }

      .saving-diagnosis .btn{
        width:100%;
      }

      .footer-cta{
        align-items:flex-start;
        flex-direction:column;
        gap:15px;
        padding:19px;
      }

      .footer-cta-actions{
        justify-content:flex-start;
      }


      .wrap{
        width:calc(100% - 28px);
      }

      header{
        padding:8px 0 4px;
      }

      .hero-wrap{
        padding:6px 0 46px;
      }

      .sticker-promo{
        grid-template-columns:76px minmax(0,1fr);
        gap:14px;
        margin-top:12px;
        padding:16px;
        border-radius:18px;
      }

      .sticker-promo-image{
        width:72px;
      }

      .sticker-promo h2{
        font-size:1.24rem;
      }

      .sticker-promo-text{
        font-size:.8rem;
      }

      .sticker-promo .btn{
        grid-column:1 / -1;
        width:100%;
      }

      .hero{
        padding:28px 24px 26px;
        border-radius:21px;
        gap:24px;
      }

      .mini-note{
        font-size:.72rem;
        padding:6px 10px;
        margin-bottom:14px;
      }

      h1{
        font-size:clamp(2rem,9vw,2.65rem);
        line-height:1.04;
        letter-spacing:-.05em;
      }

      h2{
        font-size:clamp(1.65rem,7vw,2.1rem);
        letter-spacing:-.04em;
      }

      .hero-copy > p{
        font-size:.98rem;
        margin-top:17px;
      }

      .hero-actions{
        display:grid;
        grid-template-columns:1fr;
        gap:10px;
        margin-top:23px;
      }

      .hero-actions .btn{
        width:100%;
      }

      .photo-frame{
        padding:8px;
        border-radius:20px;
      }

      .photo-frame img{
        border-radius:14px;
        aspect-ratio:4/3.6;
      }

      .photo-label{
        position:relative;
        left:auto;
        bottom:auto;
        margin:-10px 8px 0;
        max-width:none;
        transform:none;
        font-size:.79rem;
      }

      section{
        padding:50px 0;
      }

      .social-strip{
        padding-bottom:18px;
      }

      .social-shell{
        padding:22px 18px;
        border-radius:20px;
      }

      .social-head{
        margin-bottom:16px;
      }

      .social-grid{
        grid-template-columns:1fr;
        gap:10px;
      }

      .social-option,
      .social-option.featured{
        grid-column:auto;
        padding:16px;
        border-radius:18px;
      }

      .social-platform-icon{
        width:46px;
        height:46px;
        border-radius:14px;
      }

      .social-option-top strong{
        font-size:1rem;
      }

      .social-option p{
        font-size:.88rem;
      }

      .social-cta{
        min-height:42px;
        font-size:.84rem;
      }

      .social-badge{
        top:12px;
        right:12px;
      }

      .section-head{
        margin-bottom:24px;
      }

      .start-grid{
        grid-template-columns:1fr;
        gap:13px;
      }

      .start-card,
      .start-card.primary{
        grid-column:auto;
        min-height:0;
        padding:22px;
        border-radius:19px;
      }

      .start-icon{
        margin-bottom:18px;
      }

      .start-card h3{
        font-size:1.16rem;
        max-width:none;
      }

      .feature-post{
        border-radius:20px;
      }

      .feature-copy{
        padding:22px;
      }

      .feature-copy h3{
        font-size:1.4rem;
      }

      .mini-post{
        grid-template-columns:135px minmax(0,1fr);
        min-height:160px;
        border-radius:17px;
      }

      .mini-post-body{
        padding:16px;
      }

      .ratgeber-callout{
        grid-template-columns:56px minmax(0,1fr);
        gap:15px;
        padding:19px;
        border-radius:17px;
      }

      .ratgeber-badge{
        width:56px;
        height:56px;
        border-radius:14px;
        font-size:.65rem;
      }

      .ratgeber-arrow{
        grid-column:2;
        margin-top:-5px;
        white-space:normal;
      }

      .reset{
        padding:25px 22px;
        border-radius:20px;
      }

      .reset-copy .btn{
        width:100%;
      }

      .reset-preview{
        padding:17px;
        border-radius:15px;
      }

      .preview-row{
        grid-template-columns:9px minmax(0,1fr) auto;
        gap:8px;
      }

      .topics{
        gap:11px;
      }

      .topic{
        padding:19px 17px;
      }

      .explain-grid{
        gap:11px;
      }

      .explain-card{
        padding:20px;
      }

      .saving-row{
        grid-template-columns:42px minmax(0,1fr);
        padding:17px;
        gap:12px;
      }

      .saving-row a{
        grid-column:2;
        white-space:normal;
        margin-top:2px;
      }

      .system-step{
        padding:21px;
      }

      .story{
        padding:22px;
        border-radius:21px;
      }

      .story img{
        max-height:420px;
        border-radius:16px;
      }

      .workbook{
        grid-template-columns:1fr;
        gap:20px;
        padding:24px;
        border-radius:21px;
      }

      .workbook img{
        width:160px;
        justify-self:start;
      }

      .workbook .btn{
        width:100%;
      }

      .footer-inner{
        align-items:flex-start;
        flex-direction:column;
        gap:20px;
      }

      .footer-links{
        gap:10px 14px;
      }
    }

    @media(max-width:520px){
      .wrap{
        width:calc(100% - 22px);
      }

      .hero{
        padding:24px 18px 20px;
      }

      h1{
        font-size:clamp(1.85rem,9.5vw,2.25rem);
      }

      .social-shell{
        padding:20px 16px;
      }

      .social-head h2{
        font-size:clamp(1.4rem,8vw,1.9rem);
      }

      .social-option{
        gap:12px;
      }

      .feature-post img{
        aspect-ratio:16/10;
      }

      .mini-post{
        grid-template-columns:1fr;
      }

      .mini-post img{
        width:100%;
        height:auto;
        aspect-ratio:16/9;
      }

      .ratgeber-callout{
        grid-template-columns:1fr;
      }

      .ratgeber-badge{
        width:auto;
        height:auto;
        display:inline-flex;
        justify-self:start;
        padding:7px 10px;
        border-radius:999px;
      }

      .ratgeber-arrow{
        grid-column:1;
        margin-top:0;
      }

      .topics{
        grid-template-columns:1fr;
      }

      .explain-grid{
        grid-template-columns:1fr;
      }

      .preview-head{
        align-items:flex-start;
        flex-direction:column;
        gap:7px;
      }

      .preview-row{
        grid-template-columns:9px minmax(0,1fr);
      }

      .preview-row .status{
        grid-column:2;
        white-space:normal;
        margin-top:-4px;
      }

      .story img{
        aspect-ratio:4/3.2;
      }

      .workbook img{
        display:none;
      }

      .faq details{
        padding:0 15px;
      }

      footer{
        padding-top:34px;
      }

      .footer-links{
        display:grid;
        grid-template-columns:1fr 1fr;
        width:100%;
      }
    }



    @media(max-width:430px){
      .mobile-social-quick{
        padding-left:3px;
      }

      .mobile-social-label{
        display:none;
      }

      .mobile-social-link{
        width:32px;
        height:32px;
      }

      .site-nav a{
        padding-left:8px;
        padding-right:8px;
      }
    }

    @media(max-width:360px){
      .header-inner{
        gap:7px;
      }

      .site-nav{
        gap:0;
      }

      .site-nav a{
        min-height:31px;
        padding:6px 7px;
        font-size:.62rem;
      }

      .brand{
        gap:8px;
        font-size:1.03rem;
      }

      .brand-mark{
        width:11px;
        height:11px;
        box-shadow:0 0 0 4px rgba(23,163,74,.13);
      }

      .mobile-social-quick{
        min-height:34px;
        padding:3px 3px 3px 8px;
      }

      .mobile-social-label{
        font-size:.64rem;
      }

      .mobile-social-link{
        width:31px;
        height:31px;
      }

      .mobile-social-link svg{
        width:15px;
        height:15px;
      }


      .wrap{
        width:calc(100% - 16px);
      }

      .hero{
        padding:21px 15px 18px;
        border-radius:18px;
      }

      h1{
        font-size:1.78rem;
      }

      h2{
        font-size:1.55rem;
      }

      .btn{
        padding:11px 14px;
        min-height:48px;
        font-size:.9rem;
      }

      .start-card{
        padding:19px;
      }

      .feature-copy{
        padding:18px;
      }

      .reset{
        padding:21px 17px;
      }

      .reset-preview{
        padding:14px;
      }

      .story{
        padding:18px;
      }

      .topic{
        padding:17px 15px;
      }

      .footer-links{
        grid-template-columns:1fr;
      }
    }

    @media(prefers-reduced-motion:reduce){
      html{
        scroll-behavior:auto;
      }

      *,
      *::before,
      *::after{
        transition:none !important;
      }
    }
  
    /* === Social-Media-Block auf Desktop kompakter === */
    @media(min-width:901px){
      .social-strip{
        padding:0 0 24px;
      }

      .social-shell{
        padding:20px 22px;
        border-radius:22px;
      }

      .social-head{
        display:grid;
        grid-template-columns:minmax(0,.78fr) minmax(340px,1.22fr);
        grid-template-areas:
          "kicker copy"
          "title copy";
        column-gap:34px;
        row-gap:2px;
        max-width:none;
        margin-bottom:15px;
        align-items:end;
      }

      .social-kicker{
        grid-area:kicker;
        margin-bottom:1px;
        font-size:.68rem;
      }

      .social-head h2{
        grid-area:title;
        margin:0;
        font-size:clamp(1.3rem,2vw,1.72rem);
        line-height:1.1;
      }

      .social-head p{
        grid-area:copy;
        max-width:620px;
        justify-self:end;
        font-size:.82rem;
        line-height:1.5;
      }

      .social-grid{
        gap:10px;
      }

      .social-option{
        display:grid;
        grid-template-columns:42px minmax(0,1fr);
        grid-template-areas:
          "icon copy"
          "icon cta";
        column-gap:12px;
        row-gap:7px;
        padding:14px 15px;
        border-radius:17px;
        box-shadow:0 6px 18px rgba(12,76,35,.045);
      }

      .social-option:hover{
        transform:translateY(-1px);
        box-shadow:0 11px 24px rgba(12,76,35,.075);
      }

      .social-platform-icon{
        grid-area:icon;
        width:42px;
        height:42px;
        border-radius:13px;
      }

      .social-platform-icon svg{
        width:20px;
        height:20px;
      }

      .social-option-copy{
        grid-area:copy;
        gap:3px;
      }

      .social-option-top strong{
        font-size:.93rem;
      }

      .social-arrow{
        font-size:.86rem;
      }

      .social-option p{
        font-size:.75rem;
        line-height:1.4;
      }

      .social-cta{
        grid-area:cta;
        justify-self:start;
        min-height:30px;
        padding:6px 10px;
        font-size:.72rem;
      }

      .social-badge{
        top:10px;
        right:10px;
        padding:4px 7px;
        font-size:.59rem;
      }

      .social-option.featured .social-option-top{
        padding-right:58px;
      }
    }

  