.marketing-demo-page { display: grid; gap: 0; padding: 24px 0 40px; } .marketing-demo-section { padding: var(--ci-space-2xl) 0; } .marketing-demo-section--tight { padding-top: var(--ci-space-xl); padding-bottom: var(--ci-space-xl); } .marketing-demo-shell { width: min(100%, var(--ci-public-shell-max, 1480px)); margin: 0 auto; padding: 0 var(--ci-public-shell-padding, 24px); } .marketing-demo-hero, .marketing-demo-section-head, .marketing-demo-final .ci-card__body { display: grid; gap: var(--ci-space-md); } .marketing-demo-hero { max-width: 68ch; } .marketing-demo-eyebrow { display: inline-flex; width: max-content; align-items: center; gap: 8px; padding: 6px 12px; border-radius: var(--ci-radius-pill); background: rgba(227, 234, 240, 0.72); color: var(--accent-dark); font-size: 0.74rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; } .marketing-demo-eyebrow::before { content: ''; width: 8px; height: 8px; border-radius: 999px; background: var(--accent-dark); opacity: 0.8; } .marketing-demo-hero h1, .marketing-demo-section-head h2 { margin: 0; line-height: 1.04; } .marketing-demo-hero h1 { font-size: clamp(2.3rem, 4.8vw, 3.9rem); max-width: 12ch; } .marketing-demo-hero p, .marketing-demo-section-head p { margin: 0; line-height: 1.7; } .marketing-demo-hero__actions { display: flex; gap: var(--ci-space-md); flex-wrap: wrap; } .marketing-demo-highlights, .marketing-demo-grid { display: grid; gap: var(--ci-space-lg); } .marketing-demo-highlights { grid-template-columns: repeat(3, minmax(0, 1fr)); } .marketing-demo-highlights .ci-card__body { min-height: 96px; display: grid; place-items: center; text-align: center; } .marketing-demo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .marketing-demo-card .ci-card__body { display: grid; gap: var(--ci-space-md); } .marketing-demo-preview { min-height: 360px; overflow: hidden; border-radius: calc(var(--ci-radius-lg) - 2px); background: linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(248,250,255,0.94) 100%); border: 1px solid rgba(207, 202, 196, 0.52); } .marketing-demo-preview .template-shell { transform: scale(0.8); transform-origin: top center; width: 125%; margin-left: -12.5%; } .marketing-demo-final { text-align: center; } .marketing-demo-final .ci-card__body { justify-items: center; padding-top: var(--ci-space-2xl); padding-bottom: var(--ci-space-2xl); } .marketing-demo-final p { max-width: 52ch; } @media (max-width: 980px) { .marketing-demo-highlights, .marketing-demo-grid { grid-template-columns: 1fr; } } @media (max-width: 720px) { .marketing-demo-page { padding-top: 12px; } .marketing-demo-section { padding: var(--ci-space-xl) 0; } .marketing-demo-shell { padding: 0 16px; } } .marketing-faq-page { display: grid; gap: 0; padding: 24px 0 40px; } .marketing-faq-section { padding: var(--ci-space-2xl) 0; } .marketing-faq-shell { width: min(100%, var(--ci-public-shell-max, 1480px)); margin: 0 auto; padding: 0 var(--ci-public-shell-padding, 24px); } .marketing-faq-hero, .marketing-faq-group, .marketing-faq-final .ci-card__body { display: grid; gap: var(--ci-space-md); } .marketing-faq-hero { max-width: 68ch; } .marketing-faq-eyebrow { display: inline-flex; width: max-content; align-items: center; gap: 8px; padding: 6px 12px; border-radius: var(--ci-radius-pill); background: rgba(227, 234, 240, 0.72); color: var(--accent-dark); font-size: 0.74rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; } .marketing-faq-eyebrow::before { content: ''; width: 8px; height: 8px; border-radius: 999px; background: var(--accent-dark); opacity: 0.8; } .marketing-faq-hero h1, .marketing-faq-group h2, .marketing-faq-item h3 { margin: 0; line-height: 1.04; } .marketing-faq-hero h1 { font-size: clamp(2.3rem, 4.7vw, 3.8rem); max-width: 10ch; } .marketing-faq-hero p, .marketing-faq-item p { margin: 0; line-height: 1.7; } .marketing-faq-groups, .marketing-faq-grid, .marketing-faq-quick-grid, .marketing-faq-next-grid { display: grid; gap: var(--ci-space-lg); } .marketing-faq-grid, .marketing-faq-quick-grid, .marketing-faq-next-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .marketing-faq-trust .ci-card__body { display: grid; place-items: center; min-height: 92px; text-align: center; } .marketing-faq-next-card .ci-card__body { display: grid; gap: var(--ci-space-md); } .marketing-faq-final { text-align: center; } .marketing-faq-final .ci-card__body { justify-items: center; padding-top: var(--ci-space-2xl); padding-bottom: var(--ci-space-2xl); } .marketing-faq-final p { max-width: 52ch; } @media (max-width: 980px) { .marketing-faq-grid, .marketing-faq-quick-grid, .marketing-faq-next-grid { grid-template-columns: 1fr; } } @media (max-width: 720px) { .marketing-faq-page { padding-top: 12px; } .marketing-faq-section { padding: var(--ci-space-xl) 0; } .marketing-faq-shell { padding: 0 16px; } } .marketing-flow-page { display: grid; gap: 0; padding: 24px 0 40px; } .marketing-flow-section { padding: var(--ci-space-2xl) 0; } .marketing-flow-section--tight { padding-top: var(--ci-space-xl); padding-bottom: var(--ci-space-xl); } .marketing-flow-shell { width: min(100%, var(--ci-public-shell-max, 1480px)); margin: 0 auto; padding: 0 var(--ci-public-shell-padding, 24px); } .marketing-flow-hero, .marketing-flow-section-head, .marketing-flow-final .ci-card__body { display: grid; gap: var(--ci-space-md); } .marketing-flow-hero { max-width: 68ch; } .marketing-flow-eyebrow { display: inline-flex; width: max-content; align-items: center; gap: 8px; padding: 6px 12px; border-radius: var(--ci-radius-pill); background: rgba(227, 234, 240, 0.72); color: var(--accent-dark); font-size: 0.74rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; } .marketing-flow-eyebrow::before { content: ''; width: 8px; height: 8px; border-radius: 999px; background: var(--accent-dark); opacity: 0.8; } .marketing-flow-hero h1, .marketing-flow-section-head h2 { margin: 0; line-height: 1.04; } .marketing-flow-hero h1 { font-size: clamp(2.3rem, 4.6vw, 3.9rem); max-width: 12ch; } .marketing-flow-hero p, .marketing-flow-section-head p { margin: 0; line-height: 1.7; } .marketing-flow-hero__actions { display: flex; gap: var(--ci-space-md); flex-wrap: wrap; } .marketing-flow-grid, .marketing-flow-conversion-grid, .marketing-flow-principles, .marketing-flow-stats, .marketing-flow-objection-grid { display: grid; gap: var(--ci-space-lg); } .marketing-flow-grid, .marketing-flow-stats, .marketing-flow-objection-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .marketing-flow-conversion-grid, .marketing-flow-principles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .marketing-flow-trust .ci-card__body { display: grid; place-items: center; min-height: 92px; text-align: center; } .marketing-flow-card .ci-card__body, .marketing-flow-principle .ci-card__body, .marketing-flow-conversion-card .ci-card__body, .marketing-flow-objection .ci-card__body { display: grid; gap: var(--ci-space-md); } .marketing-flow-card__number { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 16px; background: rgba(227, 234, 240, 0.78); color: var(--accent-dark); font-weight: 800; } .marketing-flow-card__proof { padding-top: var(--ci-space-sm); border-top: 1px solid rgba(62, 92, 115, 0.12); color: var(--text-soft); font-size: 0.95rem; line-height: 1.6; } .marketing-flow-stat .ci-card__body { display: grid; gap: 6px; place-items: center; text-align: center; min-height: 120px; } .marketing-flow-stat strong { font-family: var(--ci-font-display); font-size: clamp(2rem, 4vw, 3rem); line-height: 1; color: var(--text-ink); } .marketing-flow-final { text-align: center; } .marketing-flow-final .ci-card__body { justify-items: center; padding-top: var(--ci-space-2xl); padding-bottom: var(--ci-space-2xl); } .marketing-flow-final p { max-width: 52ch; } @media (max-width: 980px) { .marketing-flow-grid, .marketing-flow-conversion-grid, .marketing-flow-principles, .marketing-flow-stats, .marketing-flow-objection-grid { grid-template-columns: 1fr; } } @media (max-width: 720px) { .marketing-flow-page { padding-top: 12px; } .marketing-flow-section { padding: var(--ci-space-xl) 0; } .marketing-flow-shell { padding: 0 16px; } .marketing-flow-hero__actions { display: grid; } .marketing-flow-hero__actions .button { width: 100%; } } .marketing-heading-reset { margin: 0; } .marketing-faq-section--flush-top { padding-top: 0; } .marketing-faq-quick-grid--compact { grid-template-columns: repeat(2, minmax(0, 220px)); }
Click & Invite fuehrt Besucher bewusst von Vorlage ueber Inhalte bis zur Freigabe. Dadurch entsteht frueh Vertrauen, weniger Entscheidungsstress und schneller ein Ergebnis, das sich hochwertig anfuehlt.
Die Seite soll nicht nur erklaeren, sondern Sicherheit geben: Du verstehst sofort, wie du von der ersten Idee zu einer teilbaren Einladung kommst.
Du startest mit einem klaren Startscreen fuer Anlass und Stil. So entsteht sofort Orientierung statt einer ueberladenen Auswahl.
Titel, Texte, Anlass, RSVP und Logistik greifen in einem ruhigen Flow ineinander, ohne dass du jede Kleinigkeit einzeln planen musst.
Nach Paketwahl und finalem Check ist deine Einladung direkt bereit fuer Link, QR-Code und die Kommunikation mit deinen Gaesten.
Die wichtigste Aufgabe dieser Seite ist nicht nur Erklaerung, sondern die Reduktion von Unsicherheit vor dem ersten Klick.
Du siehst frueh ein fast fertiges Ergebnis und musst nicht erst Formulare ausfuellen, um den Nutzen zu verstehen.
Anlass, Vorlage und Stil kommen zuerst. Paket- und Freigabefragen folgen spaeter, wenn der Kontext schon klar ist.
Datenschutz, Freigabe und Produktlogik wirken nicht wie Nachgedanken, sondern wie ein fester Teil des Ablaufs.
Das Zielbild aus Navigation und Produktplan bleibt auch auf den neuen Marketing-Seiten konsistent.
Die Seite erklaert den Ablauf, ohne ihn technisch zu zerlegen. Damit bleibt die Orientierung klar und conversion-stark.
Die Seite erklaert den Ablauf, ohne ihn technisch zu zerlegen. Damit bleibt die Orientierung klar und conversion-stark.
Die Seite erklaert den Ablauf, ohne ihn technisch zu zerlegen. Damit bleibt die Orientierung klar und conversion-stark.
Die Seite erklaert den Ablauf, ohne ihn technisch zu zerlegen. Damit bleibt die Orientierung klar und conversion-stark.
So funktioniert die Seite auch als Conversion-Hilfe und nicht nur als Prozessbeschreibung.
Nein. Die Struktur fuehrt dich ueber Vorlage, Inhalte und Freigabe. Dadurch bleibt der Start leichter als bei offenen Baukaesten.
Nein. Der Flow ist so gedacht, dass du zuerst Wirkung und Richtung verstehst und erst spaeter verbindliche Schritte gehst.
Nein. Deine Einladung ist direkt ueber Browser, Link oder QR-Code nutzbar.
Du kannst direkt starten, erst die Demo ansehen oder vorab noch die Paketlogik verstehen. Die Seite fuehrt dich bewusst in denselben ruhigen Funnel weiter.