/* Buildflock · Website · responsive Fassung (Desktop-Design aus dem Agenten-Build) */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:#07080D}
body{background:#07080D;color:#ECEFF7;font-family:"Segoe UI Variable Display","Segoe UI","Inter",system-ui,-apple-system,Roboto,sans-serif;font-size:clamp(17px,1.15vw,21px);line-height:1.5;overflow-x:hidden}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:3px solid #5CF2C2;outline-offset:3px;border-radius:10px}
em{font-style:normal;color:#5CF2C2}
.wrap{width:min(1500px,100% - 48px);margin:0 auto;position:relative}
.mono{font-family:Consolas,"Cascadia Mono",ui-monospace,monospace}
.art{display:block;border-radius:16px;max-width:100%;height:auto}

/* Header */
.header{border-bottom:1px solid #161A26;background:rgba(7,8,13,.92);backdrop-filter:blur(10px);position:sticky;top:0;z-index:20}
.header .wrap{min-height:84px;display:flex;align-items:center;gap:24px}
.logo{display:flex;align-items:center;gap:14px}
.logo-name{font-size:26px;font-weight:800;letter-spacing:-.03em}
.nav{display:flex;gap:clamp(18px,2.2vw,40px);margin-left:clamp(20px,5vw,120px)}
.nav a{font-size:17px;color:#A6ACC0}.nav a:hover{color:#ECEFF7}
.btn{display:inline-block;padding:15px 28px;border-radius:14px;font-size:17px;font-weight:700;background:#5CF2C2;color:#05110C;border:1px solid #5CF2C2;cursor:pointer;font-family:inherit}
.btn:hover{filter:brightness(1.08)}
.btn-ghost{background:#0E1019;color:#ECEFF7;border:1px solid #2A2F42}
.btn-violet{background:#9A7CFF;color:#0B0718;border:1px solid #9A7CFF}
.header .btn{margin-left:auto;padding:12px 22px}

/* Hero */
.hero{position:relative;overflow:hidden;padding:clamp(56px,8vw,150px) 0 clamp(80px,10vw,180px)}
.bigword{position:absolute;right:-4vw;bottom:-.12em;font-size:clamp(110px,16vw,300px);font-weight:800;letter-spacing:-.05em;line-height:1;white-space:nowrap;background:linear-gradient(90deg,rgba(92,242,194,.24) 0%,rgba(154,124,255,.2) 45%,rgba(154,124,255,.03) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;pointer-events:none;user-select:none}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) 650px;gap:40px;align-items:center}
.label{display:inline-block;padding:9px 18px;border-radius:999px;border:1px solid #2A2F42;background:#0E1019;color:#5CF2C2;font-size:15px;letter-spacing:.04em}
h1{margin-top:32px;font-size:clamp(58px,7.6vw,146px);font-weight:800;line-height:.92;letter-spacing:-.055em}
.lead{margin-top:34px;max-width:660px;font-size:clamp(19px,1.3vw,24px);color:#B4BACC}
.actions{margin-top:44px;display:flex;flex-wrap:wrap;gap:16px}
.comp{position:relative;width:650px;height:740px}
.pos{position:absolute}
.card-img{padding:10px;border-radius:26px;background:#10131D;border:1px solid #262B3D;box-shadow:0 40px 80px rgba(0,0,0,.55)}
.tilt-a{left:0;top:30px;transform:rotate(-3deg)}
.tilt-b{left:455px;top:150px;transform:rotate(5deg)}
.tilt-c{left:210px;top:400px;transform:rotate(3deg)}
.tilt-d{left:-40px;top:520px;transform:rotate(-4deg)}

/* Abschnitte */
.section{padding-top:clamp(80px,9vw,150px)}
h2{font-size:clamp(40px,5vw,80px);font-weight:800;line-height:.98;letter-spacing:-.045em;max-width:1400px;text-wrap:balance}
.sub{margin-top:24px;max-width:860px;font-size:clamp(18px,1.25vw,23px);color:#A6ACC0}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:30px}
.benefit{padding:clamp(28px,3vw,44px);border-radius:28px;background:#0D0F18;border:1px solid #1E2232}
.icon-box{width:84px;height:84px;border-radius:22px;background:#131726;border:1px solid #2A2F42;display:flex;align-items:center;justify-content:center}
.benefit h3{margin-top:30px;font-size:clamp(26px,2vw,34px);font-weight:750;letter-spacing:-.02em;line-height:1.1}
.benefit p{margin-top:12px;color:#A6ACC0}
.grid4{margin-top:clamp(40px,4.5vw,70px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:24px}
.offer{padding:20px 20px 28px;border-radius:28px;background:#0D0F18;border:1px solid #1E2232;display:flex;flex-direction:column}
.offer .art{border-radius:18px;width:100%}
.tag{align-self:flex-start;margin-top:22px;padding:6px 14px;border-radius:999px;font-size:14px;font-weight:700;letter-spacing:.03em}
.tag-free{background:#0F2A22;color:#5CF2C2;border:1px solid #1F5C4A}
.tag-wip{background:#1C1530;color:#B9A6FF;border:1px solid #3D3166}
.offer h3{margin-top:16px;font-size:clamp(25px,1.8vw,31px);font-weight:750;letter-spacing:-.02em;line-height:1.1}
.offer p{margin-top:10px;color:#A6ACC0}
.note{margin-top:16px;font-size:15px;color:#7C8399}
.offer .btn{margin-top:auto;align-self:flex-start;padding:13px 22px;font-size:16px}
.offer .note{margin-bottom:22px}
.gallery{margin-top:clamp(40px,4.5vw,70px);display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:40px 24px}
.shot .art{border-radius:20px;border:1px solid #1E2232;width:100%}
.shot p{margin-top:14px;font-size:17px;color:#A6ACC0}
.step{padding:36px 32px;border-radius:28px;background:#0D0F18;border:1px solid #1E2232}
.step-no{font-size:46px;font-weight:700;color:#5CF2C2;line-height:1}
.step h3{margin-top:28px;font-size:clamp(24px,1.8vw,30px);font-weight:750;letter-spacing:-.02em;line-height:1.12}
.step p{margin-top:12px;color:#A6ACC0}

/* Gratis-Prompt */
.prompt-box{margin-top:clamp(40px,4.5vw,70px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:30px;align-items:stretch}
.prompt-card{padding:clamp(28px,3vw,48px);border-radius:28px;background:linear-gradient(140deg,#0F2A22,#0D0F18 60%);border:1px solid #1F5C4A;display:flex;flex-direction:column;gap:22px}
.prompt-card h3{font-size:clamp(28px,2.2vw,38px);font-weight:800;letter-spacing:-.02em;line-height:1.08}
.prompt-card ol{display:grid;gap:12px;padding-left:22px;color:#B4BACC}
.prompt-card .actions{margin-top:6px}
.prompt-preview{padding:24px;border-radius:28px;background:#0A0C14;border:1px solid #1E2232;font-size:14px;line-height:1.6;color:#8F96AC;max-height:420px;overflow:auto;white-space:pre-wrap;word-break:break-word}
.copied{color:#5CF2C2;font-size:15px;min-height:22px}
.req{font-size:15px;color:#7C8399}

/* Abschluss */
.closing{margin-top:clamp(80px,9vw,150px);padding:clamp(40px,6vw,100px) clamp(24px,6.5vw,110px);border-radius:40px;background:linear-gradient(120deg,#0F2A22 0%,#121428 55%,#1E1440 100%);border:1px solid #2E3550}
.closing h2{font-size:clamp(38px,4.6vw,76px)}
.closing .sub{color:#C3C8D8}
.closing .btn{margin-top:40px}
.closing .note{margin-top:22px;font-size:16px;color:#8F96AC}

/* Fuß */
.footer{margin-top:clamp(80px,9vw,150px);border-top:1px solid #161A26;padding:70px 0 90px}
.footer .wrap{display:flex;flex-wrap:wrap;gap:50px}
.foot-brand{flex:1 1 320px}
.foot-brand p{margin-top:20px;max-width:380px;font-size:17px;color:#8F96AC}
.cols{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:30px;flex:2 1 640px}
.col{display:flex;flex-direction:column;gap:12px}
.col h4{font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:#5CF2C2;margin-bottom:6px}
.col a{font-size:17px;color:#A6ACC0}.col a:hover{color:#ECEFF7}

/* Rechtstexte */
.legal{padding:clamp(56px,7vw,110px) 0}
.legal h1{font-size:clamp(44px,5vw,80px);margin:0 0 36px}
.legal h2{font-size:clamp(24px,2vw,32px);margin:40px 0 12px;letter-spacing:-.02em}
.legal p,.legal li{max-width:820px;color:#B4BACC;margin-top:10px}
.legal ul{padding-left:22px}
.hinweis{max-width:820px;margin-top:20px;padding:16px 20px;border-radius:14px;background:#1C1530;border:1px solid #3D3166;color:#D8CCFF;font-size:16px}

/* Tablet und Handy */
@media (max-width:1180px){
  .hero .wrap{grid-template-columns:minmax(0,1fr)}
  .label{white-space:normal;line-height:1.35}
  .comp{width:650px;height:740px;justify-self:start;margin-left:calc((100% - 650px) / 2);transform:scale(.8);transform-origin:top center;margin-bottom:-150px}
  .prompt-box{grid-template-columns:1fr}
}
@media (max-width:900px){
  .nav{display:none}
  .comp{transform:scale(.55);margin-bottom:-330px}
  .cols{grid-template-columns:repeat(2,minmax(140px,1fr))}
}
@media (max-width:560px){
  .comp{transform:scale(.48);margin-top:-20px;margin-bottom:-380px}
  .header .btn{padding:10px 16px;font-size:15px}
  .logo-name{font-size:22px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Preise */
.preise{margin-top:clamp(40px,4.5vw,70px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:20px}
.preis{padding:26px 24px 28px;border-radius:24px;background:#0D0F18;border:1px solid #1E2232;display:flex;flex-direction:column;gap:12px;min-width:0}
.preis-top{border-color:#5CF2C2;box-shadow:0 0 0 1px #5CF2C2 inset}
.preis .tag{margin-top:0}
.preis h3{font-size:clamp(22px,1.6vw,27px);font-weight:750;letter-spacing:-.02em;line-height:1.1}
.preis .betrag{font-size:40px;font-weight:800;line-height:1;color:#ECEFF7}
.preis .betrag s{font-size:20px;color:#7C8399;font-weight:600}
.betrag s.alt{color:#7C8399;font-weight:600;font-size:.5em;text-decoration-thickness:2px;margin-right:.15em}
.betrag .rabatt{font-style:normal;font-size:13px;font-weight:700;letter-spacing:0;background:#5CF2C2;color:#05110C;padding:4px 9px;border-radius:999px;vertical-align:middle;white-space:nowrap}
.tag-rabatt{background:#0F2A22;color:#5CF2C2;border:1px solid #1F5A49}
.offer .note s{color:#7C8399}
.preis .fb{font-size:13px;color:#5CF2C2}
.preis p{color:#A6ACC0}
.preis ul{margin:0;padding:0 0 0 18px;color:#C9CEDC;display:flex;flex-direction:column;gap:6px}
.preis .btn{margin-top:auto;align-self:flex-start;padding:13px 22px;font-size:16px}
#preise .note{margin-top:28px}

/* ── Ausbau: Navigation, Seiten, Bausteine ───────────────────────────── */
.skip{position:absolute;left:12px;top:-60px;z-index:50;padding:10px 16px;border-radius:10px;background:#5CF2C2;color:#05110C;font-weight:700}
.skip:focus{top:12px}
summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,video:focus-visible,pre:focus-visible{outline:3px solid #5CF2C2;outline-offset:3px}
.nav{align-items:center}
.dd{position:relative}
.dd>a::after{content:" ▾";font-size:.75em;opacity:.7}
.dd-menu{display:none;position:absolute;left:-16px;top:100%;padding:10px;min-width:260px;border-radius:16px;background:#0D0F18;border:1px solid #2A2F42;box-shadow:0 24px 50px rgba(0,0,0,.5);z-index:30}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{display:grid;gap:2px}
.dd-menu a{padding:9px 12px;border-radius:10px;font-size:16px}
.dd-menu a:hover{background:#151929}
.dd::before{content:"";position:absolute;left:0;right:0;top:100%;height:12px}
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;padding:10px 14px;border-radius:12px;border:1px solid #2A2F42;background:#0E1019;font-weight:700;font-size:15px}
.mnav summary::-webkit-details-marker{display:none}
.mnav-list{position:absolute;right:0;top:calc(100% + 10px);width:min(320px,calc(100vw - 32px));max-height:75vh;overflow:auto;padding:14px;border-radius:18px;background:#0D0F18;border:1px solid #2A2F42;box-shadow:0 24px 50px rgba(0,0,0,.6);display:grid;gap:2px;z-index:40}
.mnav-list a{padding:11px 10px;border-radius:10px;color:#ECEFF7}
.mnav-list a:hover{background:#151929}
.mnav-list p{margin:10px 10px 4px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#5CF2C2}
@media (max-width:1180px){.nav{display:none}.mnav{display:block}.header .wrap{gap:12px}.header .btn{margin-left:auto}}

/* Bewegung: dezent, nur mit JS, nie bei reduzierter Bewegung */
.reveal{transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.rv-wait{opacity:0;transform:translateY(22px)}
.btn{transition:transform .2s,filter .2s,background .2s,border-color .2s}
.btn:hover{transform:translateY(-2px)}
.btn-ghost:hover{border-color:#5CF2C2}
.offer,.preis,.benefit,.step,.leistung,.artikel-karte,.vorlage{transition:border-color .25s,transform .25s,opacity .7s cubic-bezier(.2,.7,.2,1)}
.offer:hover,.preis:hover,.benefit:hover,.leistung:hover,.artikel-karte:hover{border-color:#3A4466;transform:translateY(-4px)}
.rv-wait.offer,.rv-wait.preis,.rv-wait.benefit,.rv-wait.step,.rv-wait.leistung,.rv-wait.artikel-karte,.rv-wait.vorlage{transform:translateY(22px)}
@media (prefers-reduced-motion:reduce){.reveal,.btn,.offer,.preis,.benefit,.leistung,.artikel-karte{transition:none}.btn:hover,.offer:hover,.preis:hover,.benefit:hover,.leistung:hover,.artikel-karte:hover{transform:none}.rv-wait{opacity:1;transform:none}}

/* Hero */
.trust{margin-top:22px;font-size:14px;color:#8F96AC;letter-spacing:.02em}
.offer h3 a:hover{color:#5CF2C2}
.offer .note{margin-bottom:22px}
.gratis{margin-top:clamp(40px,4.5vw,70px);display:grid;grid-template-columns:auto 1fr auto;gap:24px 32px;align-items:center;padding:clamp(22px,2.6vw,36px);border-radius:28px;background:linear-gradient(120deg,#0F2A22,#0D0F18 70%);border:1px solid #1F5C4A}
.gratis .tag{margin-top:0;align-self:start}
.gratis h3{font-size:clamp(22px,1.8vw,30px);font-weight:750;letter-spacing:-.02em;line-height:1.15}
.gratis p{margin-top:8px;color:#B4BACC}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chips li{padding:5px 12px;border-radius:999px;border:1px solid #1F5C4A;font-size:14px;color:#9FE9D0}
.gratis+.grid4{margin-top:24px}
.mehr-produkte a,.note a,.prosa a,.legal a,.preisbox a:not(.btn),.anfrage a,.fig figcaption a{color:#5CF2C2;text-decoration:underline;text-underline-offset:3px}
@media (max-width:760px){.gratis{grid-template-columns:1fr}}

/* Showcase */
.showcase{margin-top:clamp(40px,4.5vw,70px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:28px;align-items:start}
.clip{margin:0}
.vid{border-radius:24px;overflow:hidden;border:1px solid #262B3D;background:#0A0C14;box-shadow:0 30px 70px rgba(0,0,0,.5)}
.vid video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;background:#0A0C14}
.clip figcaption{margin-top:14px;font-size:16px;color:#A6ACC0}
.clip figcaption strong{display:block;color:#ECEFF7;font-size:18px}
.showcase-text{padding:clamp(26px,3vw,40px);border-radius:28px;background:#0D0F18;border:1px solid #1E2232;align-self:center}
.showcase-text h3{font-size:clamp(24px,2vw,32px);letter-spacing:-.02em}
.showcase-text .actions{margin-top:28px}
.check{list-style:none;display:grid;gap:12px;margin-top:20px}
.check li{position:relative;padding-left:32px;color:#B4BACC}
.check li::before{content:"";position:absolute;left:0;top:.35em;width:18px;height:18px;border-radius:6px;background:#0F2A22;border:1px solid #1F5C4A;box-shadow:inset 0 0 0 4px #0F2A22,inset 0 0 0 9px #5CF2C2}

/* Cinema */
.cinema{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:40px;align-items:center;padding:clamp(28px,4vw,64px);border-radius:36px;background:radial-gradient(120% 120% at 100% 0%,#2A1A10 0%,#120E16 45%,#0A0B10 100%);border:1px solid #3A2A22}
.cinema .label{color:#FFB37A;border-color:#4A3328;background:#1A120E}
.cinema h2{margin-top:22px}.cinema h2 em{color:#FFB37A}
.cinema .btn{margin-top:32px;background:#FFB37A;border-color:#FFB37A;color:#1A0E06}
.cinema-clips{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px}
.cinema-clips figcaption,.cinema-galerie figcaption{font-size:14px}
.cinema-leer{padding:40px 28px;border-radius:24px;border:1px dashed #4A3328;color:#D8C2B0;display:grid;gap:12px}
.cinema-galerie{margin-top:40px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:24px}
@media (max-width:900px){.cinema{grid-template-columns:1fr}}

/* Leistungen, Ratgeber-Karten */
.leistungen{margin-top:clamp(40px,4.5vw,70px)}
.leistung,.artikel-karte{display:flex;flex-direction:column;gap:10px;padding:clamp(26px,3vw,40px);border-radius:28px;background:#0D0F18;border:1px solid #1E2232;position:relative}
.leistung .ab{color:#5CF2C2;font-size:15px}
.leistung h3,.artikel-karte h3,.artikel-karte h2{font-size:clamp(22px,1.8vw,30px);font-weight:750;letter-spacing:-.02em;line-height:1.15;max-width:none}
.leistung p,.artikel-karte p{color:#A6ACC0}
.leistung .pfeil{margin-top:auto;font-size:26px;color:#5CF2C2}
.artikel-karte .mono{font-size:14px;color:#5CF2C2}
#machen-lassen .actions{margin-top:36px}
#ratgeber .grid3{margin-top:clamp(40px,4.5vw,70px)}

/* Preise */
.preis .mehr{font-size:15px;color:#5CF2C2;text-decoration:underline;text-underline-offset:3px}
.preis .spar{font-size:13px;color:#FFD166}

/* FAQ */
.faq{margin-top:clamp(36px,4vw,60px);display:grid;gap:12px;max-width:1000px}
.faq-item{border-radius:20px;background:#0D0F18;border:1px solid #1E2232}
.faq-item summary{cursor:pointer;list-style:none;padding:22px 60px 22px 26px;position:relative;border-radius:20px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:26px;top:50%;transform:translateY(-50%);font-size:28px;color:#5CF2C2;line-height:1}
.faq-item[open] summary::after{content:"–"}
.faq-item h3{font-size:clamp(18px,1.3vw,22px);font-weight:700;letter-spacing:-.01em}
.faq-item p{padding:0 26px 24px;color:#B4BACC;max-width:820px}

/* Unterseiten */
.crumbs{padding-top:24px;font-size:15px;color:#7C8399}
.crumbs a{color:#A6ACC0;text-decoration:underline;text-underline-offset:3px}
.p-hero{padding:clamp(36px,5vw,90px) 0 0}
.p-hero h1{margin-top:24px;font-size:clamp(40px,5.2vw,88px);line-height:.98;letter-spacing:-.045em;text-wrap:balance}
.p-hero-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(30px,4vw,70px);align-items:start}
.fakten{padding:clamp(24px,2.6vw,36px);border-radius:26px;background:#0D0F18;border:1px solid #1F5C4A}
.fakten h2{font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:#5CF2C2;font-weight:700}
.fakten ul{margin-top:16px;padding-left:20px;display:grid;gap:10px;color:#C9CEDC;font-size:.95em}
.nutzen{margin-top:clamp(36px,4vw,60px)}
.nutzen .benefit h3{margin-top:0}
.zwei{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(30px,4vw,70px)}
.zwei h2{font-size:clamp(32px,3.4vw,54px)}
.ablauf{list-style:none;counter-reset:s;margin-top:clamp(36px,4vw,60px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:20px}
.ablauf li{counter-increment:s;padding:28px 26px;border-radius:24px;background:#0D0F18;border:1px solid #1E2232}
.ablauf li::before{content:counter(s,decimal-leading-zero);font-family:Consolas,"Cascadia Mono",ui-monospace,monospace;font-size:36px;font-weight:700;color:#5CF2C2;line-height:1}
.ablauf h3{margin-top:18px;font-size:clamp(20px,1.5vw,25px);letter-spacing:-.02em;line-height:1.15}
.ablauf p{margin-top:8px;color:#A6ACC0}
.figs{margin-top:clamp(30px,3.5vw,50px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:26px;align-items:start}
.fig{margin:0}
.fig img{display:block;width:100%;height:auto;border-radius:18px;border:1px solid #262B3D;background:#10131D}
.fig.hoch{max-width:300px}
.fig figcaption{margin-top:10px;font-size:15px;color:#A6ACC0}
.preisbox{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:30px 50px;align-items:center;padding:clamp(28px,4vw,60px);border-radius:36px;background:linear-gradient(120deg,#0F2A22 0%,#121428 55%,#1E1440 100%);border:1px solid #2E3550}
.preisbox .betrag{margin-top:18px;font-size:clamp(48px,5vw,76px);font-weight:800;line-height:1;letter-spacing:-.03em}
.preisbox .fb{margin-top:12px;font-size:14px;color:#5CF2C2}
.preisbox p{color:#C3C8D8;margin-top:12px}
.preisbox-cta .note{margin-top:18px;font-size:15px}
@media (max-width:900px){.p-hero-grid,.preisbox{grid-template-columns:1fr}}

/* Vorlagen */
.vorlagen{margin-top:clamp(36px,4vw,60px);display:grid;gap:30px}
.vorlage{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:30px;padding:clamp(20px,2.4vw,32px);border-radius:30px;background:#0D0F18;border:1px solid #1E2232;align-items:center}
.vorlage .figs{margin-top:0;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.vorlage .tag{margin-top:0}
.vorlage h3{margin-top:14px;font-size:clamp(24px,2vw,32px);letter-spacing:-.02em;line-height:1.1}
.vorlage p{margin-top:10px;color:#A6ACC0}
.vorlage .betrag{font-size:34px;font-weight:800;color:#ECEFF7}
.vorlage .btn{margin-top:18px}
@media (max-width:900px){.vorlage{grid-template-columns:1fr}}

/* Formular */
.anfrage-box{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(30px,4vw,60px);padding:clamp(26px,4vw,56px);border-radius:36px;background:#0D0F18;border:1px solid #1E2232}
.anfrage{display:grid;gap:16px}
.anfrage label{display:grid;gap:6px;font-weight:600;font-size:16px}
.anfrage input,.anfrage select,.anfrage textarea{width:100%;padding:13px 14px;border-radius:12px;border:1px solid #2A2F42;background:#0A0C14;color:#ECEFF7;font:inherit;font-weight:400}
.anfrage input:focus,.anfrage select:focus,.anfrage textarea:focus{border-color:#5CF2C2}
.anfrage .einwilligung{grid-template-columns:auto 1fr;align-items:start;gap:12px;font-weight:400;color:#B4BACC;font-size:15px}
.anfrage .einwilligung input{width:22px;height:22px;margin-top:2px;accent-color:#5CF2C2}
.anfrage .btn{justify-self:start}
.form-info{color:#5CF2C2;min-height:1.2em}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.lead-form{margin-top:18px}
.lead-form .btn:disabled{opacity:.6;cursor:wait}
.form-fallback{display:grid;gap:12px;padding:16px;border-radius:16px;border:1px dashed #2A2F42}
.form-fallback[hidden]{display:none}
.fb-feld{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end}
.fb-feld .btn{padding:10px 16px;font-size:14px}
.b2b{margin-top:18px;max-width:660px;font-size:14px;color:#8F96AC;border-left:2px solid #5CF2C2;padding-left:12px}
@media (max-width:900px){.anfrage-box{grid-template-columns:1fr}}

/* Ratgeber-Artikel */
.artikel{padding-top:clamp(30px,4vw,60px);max-width:900px}
.artikel-kopf h1{font-size:clamp(36px,4.6vw,72px);line-height:1;letter-spacing:-.04em;text-wrap:balance}
.stand{margin-top:16px;font-size:14px;color:#7C8399}
.artikel .fakten{margin-top:36px}
.prosa{margin-top:20px}
.prosa h2{margin-top:52px;font-size:clamp(28px,2.6vw,40px);line-height:1.08}
.prosa p,.prosa li{margin-top:14px;color:#C3C8D8;max-width:780px}
.prosa ul,.prosa ol{padding-left:24px}
.prosa code{font-family:Consolas,"Cascadia Mono",ui-monospace,monospace;font-size:.9em;padding:2px 6px;border-radius:6px;background:#151929;color:#9FE9D0;word-break:break-word}
.prosa strong{color:#ECEFF7}
.hinweis-text{margin-top:30px!important;padding:18px 22px;border-radius:16px;background:#1C1530;border:1px solid #3D3166;color:#D8CCFF!important}
.artikel-cta{margin-top:60px;padding:clamp(26px,3.5vw,48px);border-radius:30px;background:linear-gradient(120deg,#0F2A22,#121428);border:1px solid #2E3550}
.artikel-cta h2{font-size:clamp(28px,2.6vw,40px)}
.artikel-cta p{margin-top:10px;color:#C3C8D8}
.artikel-cta .actions{margin-top:24px}

/* Fuß */
.foot-mail{margin-top:14px!important;font-size:15px!important}
.foot-mail a{color:#5CF2C2}

/* Link-in-Bio */
.links-seite{width:min(560px,100% - 32px);margin:0 auto;padding:40px 0 60px}
.links-kopf{text-align:center;display:grid;justify-items:center;gap:10px}
.links-kopf p:first-of-type{margin-top:10px;font-size:24px;font-weight:800;letter-spacing:-.02em}
.links-kopf .mono{font-size:13px;color:#8F96AC}
.links-liste{margin-top:30px;display:grid;gap:12px}
.lk{display:grid;gap:3px;min-height:60px;align-content:center;padding:16px 20px;border-radius:18px;background:#0D0F18;border:1px solid #2A2F42;text-align:center;transition:border-color .2s,transform .2s}
.lk:hover{border-color:#5CF2C2;transform:translateY(-2px)}
.lk strong{font-size:18px}
.lk span{font-size:14px;color:#A6ACC0}
.lk-haupt{background:#5CF2C2;border-color:#5CF2C2;color:#05110C}
.lk-haupt span{color:#0F3A2C}
.lk-reihe{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.lk-reihe .lk{padding:12px 8px}
.lk-reihe .lk strong{font-size:15px;line-height:1.25}
.links-fuss{margin-top:30px;text-align:center;font-size:15px;color:#8F96AC}
.links-fuss a{text-decoration:underline;text-underline-offset:3px}
@media (max-width:420px){.lk-reihe{grid-template-columns:1fr}}

/* Rechtstexte: Listen */
.legal ol{padding-left:22px}
.legal li{margin-top:8px}
.legal,.prosa,.faq-item,.fakten,.preis,.check{overflow-wrap:break-word;hyphens:auto}
.legal p,.legal li{overflow-wrap:anywhere}
@media (min-width:1100px){.preise{grid-template-columns:repeat(4,minmax(0,1fr))}}
.header .btn{white-space:nowrap}.logo svg{flex-shrink:0}
@media (max-width:480px){.header .btn{display:none}.mnav{margin-left:auto}}
.clip .vid{max-width:420px}