/* EasyAgency Landing – One-Page, offline (keine CDNs), mobile-first */
:root{--p:#7c3aed;--a:#ec4899;--d:#140d2b;--tx:#1f1b2e;--mu:#6b6880;--bd:#ebe8f3;--hh:68px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hh) + 8px);-webkit-text-size-adjust:100%}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--tx);line-height:1.6;font-size:16px;overflow-x:hidden}
img{max-width:100%}a{color:var(--p);text-decoration:none}h1,h2,h3{letter-spacing:-.02em;line-height:1.15}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}.narrow{max-width:820px}.mu{color:var(--mu)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 22px;border-radius:12px;font:inherit;font-weight:700;transition:.15s;border:0;cursor:pointer;white-space:nowrap;text-align:center}
.btn.lg{padding:14px 26px;font-size:17px}.btn.g{background:linear-gradient(135deg,var(--p),var(--a));color:#fff;box-shadow:0 10px 30px rgba(124,58,237,.35)}.btn.g:hover{transform:translateY(-1px)}
.btn.o{border:2px solid rgba(255,255,255,.45);color:#fff}.btn.o:hover{border-color:#fff}.btn.o2{border:2px solid var(--p);color:var(--p);background:#fff}
.eyebrow{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#f5d0fe;margin-bottom:12px}.eyebrow.d{color:var(--p)}
/* Header */
header{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .2s,box-shadow .2s}header.s,header.open{background:rgba(20,13,43,.94);backdrop-filter:blur(10px);box-shadow:0 4px 20px rgba(0,0,0,.2)}
header .wrap{display:flex;align-items:center;height:var(--hh);gap:20px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;font-size:21px}.logo i{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--p),var(--a));display:grid;place-items:center;font-style:normal}
nav{margin-left:auto;display:flex;align-items:center;gap:22px}nav a{color:#e3defa;font-weight:500;font-size:15px}nav a:hover{color:#fff}.nav-cta{display:none}
.burger{display:none;margin-left:auto;width:44px;height:44px;border:0;background:transparent;cursor:pointer;padding:10px;flex-direction:column;justify-content:space-between}
.burger span{display:block;height:2px;background:#fff;border-radius:2px;transition:.2s}header.open .burger span:nth-child(1){transform:translateY(10px) rotate(45deg)}header.open .burger span:nth-child(2){opacity:0}header.open .burger span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}
.ref{background:#fef3c7;color:#78350f;text-align:center;padding:8px 12px;font-weight:600;position:relative;z-index:60}
/* Hero */
.hero{background:radial-gradient(1100px 600px at 85% -10%,rgba(236,72,153,.45),transparent),linear-gradient(135deg,#140d2b,#2b1660 55%,#5b21b6);color:#fff;padding:140px 0 90px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center}
.hero h1{font-size:clamp(34px,5vw,56px);margin:0 0 18px;hyphens:manual}.hero p{font-size:clamp(17px,1.6vw,20px);color:#ddd6fe;margin:0 0 28px;max-width:600px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}.hero-pts{list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;padding:0;margin:26px 0 0;color:#e9e3ff;font-weight:600}.hero-pts li::before{content:"✓ ";color:#f0abfc}
.mock{background:#fff;border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.45);padding:14px;transform:perspective(1200px) rotateY(-8deg) rotateX(4deg);color:var(--tx);min-width:0}
.mock .bar{display:flex;gap:6px;align-items:center;margin-bottom:10px}.mock .bar i{width:10px;height:10px;border-radius:50%;background:#e5e1ee}.mock .bar b{margin-left:8px;font-size:12px;color:var(--mu)}
.mscroll{overflow:hidden}.mgrid{display:grid;grid-template-columns:44px repeat(7,minmax(0,1fr));gap:4px;font-size:10px}
.mgrid div{height:24px;border-radius:5px;background:#f3fbf5;display:flex;align-items:center;justify-content:center;color:#3b2a7a;font-weight:700;overflow:hidden}
.mgrid .h{background:none;color:#8b86a3}.mgrid .b{background:#efeafd}.mgrid .m{background:var(--p);color:#fff}.mgrid .f{background:#fdf2f2}.mgrid .c{background:#fde7c7}
/* Sections */
section{padding:90px 0}.alt{background:#f7f5fc}.t{text-align:center;max-width:720px;margin:0 auto 46px}.t h2,section h2{font-size:clamp(28px,3.6vw,40px);margin:0 0 12px}.t p{color:var(--mu);font-size:18px;margin:0}
.box{background:#fff;border:1px solid var(--bd);border-radius:18px;padding:24px;box-shadow:0 8px 30px rgba(30,10,70,.05)}
.box .ic{width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(236,72,153,.12));display:grid;place-items:center;font-size:24px;margin-bottom:12px}.box h3{margin:0 0 6px;font-size:18px}.box p{margin:0;color:var(--mu);font-size:15px}
.feat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.show{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.show>div{border-radius:18px;background:linear-gradient(135deg,#f3efff,#fdf0f7);padding:26px}.show h3{margin:0 0 8px;font-size:20px}
ul.chk,ul.x{list-style:none;padding:0;margin:0}ul.chk li,ul.x li{padding:5px 0 5px 28px;position:relative}ul.chk li::before{content:"✓";position:absolute;left:0;top:5px;width:20px;height:20px;border-radius:50%;background:rgba(124,58,237,.12);color:var(--p);font-weight:900;font-size:12px;display:grid;place-items:center}
ul.x li{color:var(--mu)}ul.x li::before{content:"✕";position:absolute;left:0;top:5px;width:20px;height:20px;border-radius:50%;background:#fde4e4;color:#dc2626;font-weight:900;font-size:11px;display:grid;place-items:center}
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;counter-reset:s}.steps li{background:#fff;border:1px solid var(--bd);border-radius:18px;padding:24px}.steps b{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--p),var(--a));margin-bottom:10px}.steps h3{margin:0 0 4px}.steps p{margin:0;color:var(--mu)}
/* Preise */
.prices{display:grid;grid-template-columns:1.25fr 1fr;gap:22px;max-width:920px;margin:0 auto}
.price{position:relative;background:#fff;border:1px solid var(--bd);border-radius:22px;padding:30px;box-shadow:0 8px 30px rgba(30,10,70,.06);display:flex;flex-direction:column;align-items:flex-start}
.price.main{border:2px solid var(--p);box-shadow:0 20px 50px rgba(124,58,237,.18)}.price h3{margin:0;font-size:22px}.price .pr{font-size:52px;font-weight:800;line-height:1.1;margin:10px 0 4px;letter-spacing:-.03em}.price .pr small{font-size:16px;color:var(--mu);font-weight:500;letter-spacing:0}
.price .big{font-weight:800;font-size:18px;margin:6px 0;background:linear-gradient(135deg,var(--p),var(--a));-webkit-background-clip:text;background-clip:text;color:transparent}.price .mu{margin:0 0 22px;flex:1}
.price .tag{position:absolute;top:-12px;left:30px;background:linear-gradient(135deg,var(--p),var(--a));color:#fff;font-size:12px;font-weight:700;padding:3px 12px;border-radius:999px}.price .tag.alt2{background:#1f1b2e}
.cmp{display:grid;grid-template-columns:1.25fr 1fr;gap:22px;margin:34px auto 0;max-width:1080px;align-items:start}.cmp h3{margin:0 0 14px;font-size:20px}
ul.two{columns:2;column-gap:20px}ul.two li{break-inside:avoid}
.vs-row{border-radius:14px;padding:16px;margin-top:10px}.vs-row>div:first-child{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.vs-row span{color:var(--mu);font-size:13px}
.vs-row.other{background:#faf9fc;border:1px solid var(--bd)}.vs-row.ours{background:linear-gradient(135deg,#f3efff,#fdf0f7);border:1px solid #ddd0fb}
.vs-p{font-size:24px;font-weight:800;margin:4px 0 8px}.other .vs-p s{color:#a19cb3;text-decoration-thickness:2px}.ours .vs-p{color:var(--p)}
/* Affiliate */
.aff{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}.aff h2{margin:0 0 12px}
.aff-k{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.aff-k div{background:#fff;border:1px solid var(--bd);border-radius:18px;padding:20px 12px;text-align:center}.aff-k b{display:block;font-size:30px;background:linear-gradient(135deg,var(--p),var(--a));-webkit-background-clip:text;background-clip:text;color:transparent}.aff-k span{color:var(--mu);font-size:13px}
/* FAQ, Kontakt, Footer */
details{background:#fff;border:1px solid var(--bd);border-radius:14px;padding:16px 20px;margin-bottom:10px}summary{font-weight:700;cursor:pointer}details p{color:var(--mu);margin:10px 0 0}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.g2.tight{gap:12px}
form.c{display:grid;gap:12px;min-width:0}form.c input,form.c textarea{font:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--bd);border-radius:12px;width:100%;min-width:0;background:#fff}
footer{background:var(--d);color:#bdb6d8;padding:46px 0 26px}.fg{display:flex;flex-wrap:wrap;gap:24px 40px;align-items:flex-start;justify-content:space-between}.fg p{margin:12px 0 0;font-size:14px}.fl{display:flex;gap:18px;flex-wrap:wrap}footer a{color:#bdb6d8}footer a:hover{color:#fff}.copy{width:100%;opacity:.6;font-size:13px}
/* Tablet */
@media(max-width:1020px){
  nav{gap:16px}nav a{font-size:14px}
  .feat{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cmp,.prices{grid-template-columns:1fr 1fr}ul.two{columns:1}
}
@media(max-width:900px){
  .burger{display:flex}.hide-m{display:none}
  nav{position:fixed;top:var(--hh);left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:rgba(20,13,43,.98);padding:8px 20px 20px;transform:translateY(-120%);transition:transform .25s;box-shadow:0 20px 40px rgba(0,0,0,.3);margin:0}
  header.open nav{transform:none}nav a{padding:13px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:17px}
  .nav-cta{display:flex;gap:10px;margin-top:14px}.nav-cta .btn{flex:1;border-bottom:0;padding:12px}
  .hero{padding:120px 0 70px}.hero .wrap,.g2,.aff{grid-template-columns:1fr;gap:36px}
  .mock{transform:none}
  .show,.steps{grid-template-columns:1fr}
  .cmp{grid-template-columns:1fr}
}
/* Smartphone */
@media(max-width:600px){
  .wrap{padding:0 16px}section{padding:64px 0}.t{margin-bottom:32px}
  .hero{padding:104px 0 56px}.cta-row .btn{flex:1 1 100%}
  .feat,.prices{grid-template-columns:1fr}
  .box,.price{padding:20px}.price .pr{font-size:44px}.price .btn{width:100%}
  .mgrid{grid-template-columns:34px repeat(7,minmax(0,1fr));gap:3px;font-size:9px}.mgrid div{height:20px}
  .aff-k b{font-size:24px}.aff-k div{padding:16px 6px}
  .vs-p{font-size:21px}
}
/* Demo-Buttons, Zusatzleistungen, CTA */
.demo-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;max-width:1000px;margin:0 auto}
.demo-b{font:inherit;cursor:pointer;background:#fff;border:1px solid var(--bd);border-radius:18px;padding:22px 16px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;transition:.15s;box-shadow:0 8px 30px rgba(30,10,70,.05);color:var(--tx)}
.demo-b:hover,.demo-b:focus-visible{border-color:var(--p);transform:translateY(-2px);box-shadow:0 14px 34px rgba(124,58,237,.18)}.demo-b span{font-size:30px}.demo-b b{font-size:17px}.demo-b small{color:var(--mu)}.demo-b.busy{opacity:.6;pointer-events:none}
.center{text-align:center}.small{font-size:14px}#demo-msg{margin-top:18px}
.svc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cta{text-align:center;background:linear-gradient(135deg,var(--p),var(--a));color:#fff;padding:70px 0}.cta h2{font-size:clamp(24px,3vw,34px);margin:0 auto 10px;max-width:860px}.cta p{margin:0 0 24px;font-size:18px;opacity:.92}.cta-row.c{justify-content:center}.btn.l{background:#fff;color:var(--p)}
@media(max-width:1020px){.demo-g{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.svc{grid-template-columns:1fr}}
@media(max-width:600px){.demo-g{gap:10px}.demo-b{padding:16px 10px}.demo-b span{font-size:26px}.cta{padding:54px 0}}
