@nascentdigital/funnel-ui 4.4.18

package/dist/styles/entities/Client.css

@@ -0,0 +1,5 @@
+@layer components {
+
+    .nd-Client {
+    }
+}

package/dist/styles/entities/ClientBadge.css

@@ -0,0 +1,14 @@
+@layer components {
+
+    :root {
+        --nd-clientbadge-text-font: inherit;
+        --nd-clientbadge-text-letterspacing: inherit;
+        --nd-clientbadge-text-color: inherit;
+    }
+
+    .nd-ClientBadge-text {
+        --nd-title-font: var(--nd-clientbadge-text-font);
+        --nd-title-letterspacing: var(--nd-clientbadge-text-letterspacing);
+        --nd-title-color: var(--nd-clientbadge-text-color);
+    }
+}

package/dist/styles/entities/Person.css

@@ -0,0 +1,76 @@
+@layer components {
+
+    :root {
+        --nd-person-visual-gap-x: theme('spacing.l8');
+        --nd-person-visual-gap-y: theme('spacing.l8');
+        --nd-person-copy-gap: theme('spacing.l2');
+        --nd-person-title-font: normal 500 24px/1.3 Helvetica, Arial, san-serif;
+        --nd-person-title-letterspacing: initial;
+        --nd-person-title-color: initial;
+        --nd-person-title-suffix: unset;
+        --nd-person-name-font: normal 500 24px/1.3 Helvetica, Arial, san-serif;
+        --nd-person-name-letterspacing: initial;
+        --nd-person-name-color: initial;
+        --nd-person-name-suffix: unset;
+        --nd-person-company-font: normal 500 24px/1.3 Helvetica, Arial, san-serif;
+        --nd-person-company-letterspacing: initial;
+        --nd-person-company-color: initial;
+        --nd-person-company-suffix: unset;
+        --nd-person-location-font: normal 500 24px/1.3 Helvetica, Arial, san-serif;
+        --nd-person-location-letterspacing: initial;
+        --nd-person-location-color: initial;
+        --nd-person-location-suffix: unset;
+    }
+
+    .nd-Person-copy {
+        @apply flex flex-wrap items-center gap-[var(--nd-person-copy-gap)];
+    }
+    .nd-Person-title {
+        @apply text-pretty break-normal;
+        font: var(--nd-person-title-font);
+        letter-spacing: var(--nd-person-title-letterspacing);
+        color: var(--nd-person-title-color, var(--nd-block-fg));
+        font-variant-numeric: lining-nums proportional-nums;
+
+        &:not(:last-child):after {
+            @apply inline-block;
+            content: var(--nd-person-title-suffix)
+        }
+    }
+    .nd-Person-name {
+        @apply text-pretty break-normal;
+        font: var(--nd-person-name-font);
+        letter-spacing: var(--nd-person-name-letterspacing);
+        color: var(--nd-person-name-color, var(--nd-block-fg));
+        font-variant-numeric: lining-nums proportional-nums;
+
+        &:not(:last-child):after {
+            @apply inline-block;
+            content: var(--nd-person-name-suffix)
+        }
+    }
+    .nd-Person-company {
+        @apply text-pretty break-normal;
+        font: var(--nd-person-company-font);
+        letter-spacing: var(--nd-person-company-letterspacing);
+        color: var(--nd-person-company-color, var(--nd-block-fg));
+        font-variant-numeric: lining-nums proportional-nums;
+
+        &:not(:last-child):after {
+            @apply inline-block;
+            content: var(--nd-person-company-suffix)
+        }
+    }
+    .nd-Person-location {
+        @apply text-pretty break-normal;
+        font: var(--nd-person-location-font);
+        letter-spacing: var(--nd-person-location-letterspacing);
+        color: var(--nd-person-location-color, var(--nd-block-fg));
+        font-variant-numeric: lining-nums proportional-nums;
+
+        &:not(:last-child):after {
+            @apply inline-block;
+            content: var(--nd-person-location-suffix)
+        }
+    }
+}

package/dist/styles/entities/Project.css

@@ -0,0 +1,44 @@
+@layer components {
+
+    :root {
+        --nd-project-bg: unset;
+        --nd-project-padding: theme('spacing.l9');
+        --nd-project-copy-gap: theme('spacing.l5');
+        --nd-project-client-margin: unset;
+        --nd-project-name-margin: unset;
+        --nd-project-headline-margin: unset;
+        --nd-project-link-margin: unset;
+        --nd-project-name-font: normal 500 20px/1 Helvetica, Arial, san-serif;
+        --nd-project-name-letterspacing: unset;
+        --nd-project-name-color: var(--nd-block-fg);
+        --nd-project-headline-font: normal 500 24px/1 Helvetica, Arial, san-serif;
+        --nd-project-headline-letterspacing: unset;
+        --nd-project-headline-color: var(--nd-block-fg);
+    }
+
+    .nd-Project {
+        background: var(--nd-project-bg);
+    }
+    .nd-Project-copy {
+        @apply flex flex-col gap-[var(--nd-project-copy-gap)] p-[var(--nd-project-padding)];
+    }
+    .nd-Project-client {
+        margin: var(--nd-project-client-margin);
+    }
+    .nd-Project-name {
+        @apply text-pretty break-normal;
+        margin: var(--nd-project-name-margin);
+        font: var(--nd-project-name-font);
+        letter-spacing: var(--nd-project-name-letterspacing);
+        color: var(--nd-project-name-color);
+    }
+    .nd-Project-headline {
+        margin: var(--nd-project-headline-margin);
+        --nd-headline-font: var(--nd-project-headline-font);
+        --nd-headline-letterspacing: var(--nd-project-headline-letterspacing);
+        --nd-headline-color: var(--nd-project-headline-color);
+    }
+    .nd-Project-link {
+        margin: var(--nd-project-link-margin);
+    }
+}

package/dist/styles/entities/UniqueSellingPoint.css

@@ -0,0 +1,54 @@
+@layer components {
+
+    :root {
+        --nd-usp-bg: unset;
+        --nd-usp-border: unset;
+        --nd-usp-border-radius: unset;
+        --nd-usp-content-gap: theme('spacing.l10');
+        --nd-usp-content-padding: theme('spacing.l10');
+        --nd-usp-copy-gap: unset;
+        --nd-usp-name-font: normal 500 20px/1 Helvetica, Arial, san-serif;
+        --nd-usp-name-letterspacing: unset;
+        --nd-usp-name-color: var(--nd-block-fg);
+        --nd-usp-name-mb: unset;
+        --nd-usp-headline-font: normal 500 24px/1 Helvetica, Arial, san-serif;
+        --nd-usp-headline-letterspacing: unset;
+        --nd-usp-headline-color: var(--nd-block-fg);
+        --nd-usp-headline-mb: unset;
+        --nd-usp-caption-font: normal 500 24px/1 Helvetica, Arial, san-serif;
+        --nd-usp-caption-letterspacing: unset;
+        --nd-usp-caption-color: var(--nd-block-fg);
+        --nd-usp-caption-mb: unset;
+    }
+
+    .nd-UniqueSellingPoint {
+        background: var(--nd-usp-bg);
+        border: var(--nd-usp-border);
+        border-radius: var(--nd-usp-border-radius);
+    }
+    .nd-UniqueSellingPoint-content {
+        @apply flex flex-col gap-[var(--nd-usp-content-gap)] p-[var(--nd-usp-content-padding)];
+    }
+    .nd-UniqueSellingPoint-copy {
+        @apply flex flex-col gap-[var(--nd-usp-copy-gap)] p-[var(--nd-usp-padding)];
+    }
+    .nd-UniqueSellingPoint-name {
+        @apply text-pretty break-normal;
+        font: var(--nd-usp-name-font);
+        letter-spacing: var(--nd-usp-name-letterspacing);
+        color: var(--nd-usp-name-color);
+        margin-bottom: var(--nd-usp-name-mb);
+    }
+    .nd-UniqueSellingPoint-headline {
+        --nd-headline-font: var(--nd-usp-headline-font);
+        --nd-headline-letterspacing: var(--nd-usp-headline-letterspacing);
+        --nd-headline-color: var(--nd-usp-headline-color);
+        margin-bottom: var(--nd-usp-headline-mb);
+    }
+    .nd-UniqueSellingPoint-caption {
+        --nd-caption-font: var(--nd-usp-caption-font);
+        --nd-caption-letterspacing: var(--nd-usp-caption-letterspacing);
+        --nd-caption-color: var(--nd-usp-caption-color);
+        margin-bottom: var(--nd-usp-caption-mb);
+    }
+}

package/dist/styles/entities/_index.css

@@ -0,0 +1,5 @@
+@import "./Client.css";
+@import "./ClientBadge.css";
+@import "./Person.css";
+@import "./Project.css";
+@import "./UniqueSellingPoint.css";

package/dist/styles/fields/Caption.css

@@ -0,0 +1,23 @@
+@layer components {
+
+    :root {
+        --nd-caption-font: normal 500 24px/1.3 Helvetica, Arial, san-serif;
+        --nd-caption-letterspacing: initial;
+        --nd-caption-color: initial;
+    }
+
+    .nd-Caption {
+        @apply text-pretty;
+        overflow-wrap: anywhere;
+        &.nd-RichText {
+            --nd-RichText-p-mb: 0;
+            --nd-RichText-p-font: var(--nd-caption-font);
+            --nd-RichText-p-color: var(--nd-caption-color, var(--nd-block-fg));
+            --nd-RichText-p-letterspacing: var(--nd-caption-letterspacing);
+        }
+        font: var(--nd-caption-font);
+        letter-spacing: var(--nd-caption-letterspacing);
+        color: var(--nd-caption-color, var(--nd-block-fg));
+        font-variant-numeric: lining-nums proportional-nums;
+    }
+}

package/dist/styles/fields/Description.css

@@ -0,0 +1,23 @@
+@layer components {
+
+    :root {
+        --nd-description-font: normal 500 24px/1.3 Helvetica, Arial, san-serif;
+        --nd-description-letterspacing: initial;
+        --nd-description-color: initial;
+    }
+
+    .nd-Description {
+        @apply text-pretty;
+        overflow-wrap: anywhere;
+        &.nd-RichText {
+            --nd-RichText-p-mb: 0;
+            --nd-RichText-p-font: var(--nd-description-font);
+            --nd-RichText-p-color: var(--nd-description-color, var(--nd-block-fg));
+            --nd-RichText-p-letterspacing: var(--nd-description-letterspacing);
+        }
+        font: var(--nd-description-font);
+        letter-spacing: var(--nd-description-letterspacing);
+        color: var(--nd-description-color, var(--nd-block-fg));
+        font-variant-numeric: lining-nums proportional-nums;
+    }
+}

package/dist/styles/fields/FreeFormContent.css

@@ -0,0 +1,24 @@
+@layer components {
+
+    :root {
+        /* spacing */
+        --nd-free-form-content-h2-mt: unset;
+        --nd-free-form-content-h2-mb: unset;
+
+        /* typography */
+        --nd-free-form-content-h2-font: unset;
+        --nd-free-form-content-body-font: unset;
+    }
+
+    .nd-FreeFormContent {
+        &.nd-RichText {
+            /* spacing */
+            --nd-RichText-h2-mt: var(--nd-free-form-content-h2-mt);
+            --nd-RichText-h2-mb: var(--nd-free-form-content-h2-mb);
+
+            /* typography */
+            --nd-RichText-h2-font: var(--nd-free-form-content-h2-font);
+            --nd-RichText-p-font: var(--nd-free-form-content-body-font);
+        }
+    }
+}

package/dist/styles/fields/Headline.css

@@ -0,0 +1,38 @@
+@layer components {
+
+    :root {
+        --nd-headline-font: normal 400 64px/1.1 Palatino, Garamond, "Times New Roman", serif;
+        --nd-headline-letterspacing: initial;
+        --nd-headline-color: initial;
+        --nd-headline-priority-font: inherit;
+        --nd-headline-priority-letterspacing: inherit;
+        --nd-headline-priority-color: inherit;
+        --nd-headline-accent-font: inherit;
+        --nd-headline-accent-letterspacing: inherit;
+        --nd-headline-accent-color: inherit;
+        --nd-headline-subtle-font: inherit;
+        --nd-headline-subtle-letterspacing: inherit;
+        --nd-headline-subtle-color: inherit;
+    }
+
+    .nd-Headline {
+        @apply text-pretty;
+        overflow-wrap: anywhere;
+        &.nd-RichText {
+            --nd-RichText-p-mb: 0;
+            --nd-RichText-p-font: var(--nd-headline-font);
+            --nd-RichText-p-color: var(--nd-headline-color);
+            --nd-RichText-p-letterspacing: var(--nd-headline-letterspacing);
+            --nd-RichText-priority-font: var(--nd-headline-priority-font);
+            --nd-RichText-priority-color: var(--nd-headline-priority-color);
+            --nd-RichText-accent-font:var(--nd-headline-accent-font);
+            --nd-RichText-accent-color: var(--nd-headline-accent-color);
+            --nd-RichText-subtle-font: var(--nd-headline-subtle-font);
+            --nd-RichText-subtle-color: var(--nd-headline-subtle-color);
+        }
+        font: var(--nd-headline-font);
+        letter-spacing: var(--nd-headline-letterspacing);
+        font-variant-numeric: lining-nums proportional-nums;
+        color: var(--nd-headline-color);
+    }
+}

package/dist/styles/fields/Icon.css

@@ -0,0 +1,20 @@
+@layer components {
+
+    :root {
+        --nd-icon-width: unset;
+        --nd-icon-height: unset;
+        --nd-icon-color: unset;
+    }
+    .nd-Icon {
+        @apply inline-block;
+        width: var(--nd-icon-width);
+        height: var(--nd-icon-height);
+    }
+    .nd-Icon-visual {
+        @apply inline-block w-full h-full;
+        background-color: var(--nd-icon-color, var(--nd-block-fg));
+        mask-repeat: no-repeat;
+        mask-size: contain;
+        mask-position: center;
+    }
+}

package/dist/styles/fields/LazyVideo.css

@@ -0,0 +1,12 @@
+@layer components {
+
+    .nd-LazyVideo-content {
+        @apply relative w-full h-full;
+    }
+    .nd-LazyVideo-blurHash {
+        @apply absolute inset-0 w-full h-full;
+    }
+    .nd-LazyVideo-video {
+        @apply absolute inset-0 w-full h-full;
+    }
+}

package/dist/styles/fields/Link.css

@@ -0,0 +1,16 @@
+@layer components {
+
+    :root {
+        --nd-link-font: initial;
+        --nd-link-letterspacing: initial;
+        --nd-link-color: initial;
+    }
+
+    .nd-Link {
+        @apply text-nowrap;
+        font: var(--nd-link-font);
+        letter-spacing: var(--nd-link-letterspacing);
+        color: var(--nd-link-color, var(--nd-block-fg));
+        font-variant-numeric: lining-nums proportional-nums;
+    }
+}

package/dist/styles/fields/Quote.css

@@ -0,0 +1,48 @@
+@layer components {
+
+    :root {
+        --nd-quote-font: normal 400 64px/1.1 Palatino, Garamond, "Times New Roman", serif;
+        --nd-quote-letterspacing: initial;
+        --nd-quote-color: initial;
+        --nd-quote-priority-font: inherit;
+        --nd-quote-priority-letterspacing: inherit;
+        --nd-quote-priority-color: inherit;
+        --nd-quote-accent-font: inherit;
+        --nd-quote-accent-letterspacing: inherit;
+        --nd-quote-accent-color: inherit;
+        --nd-quote-subtle-font: inherit;
+        --nd-quote-subtle-letterspacing: inherit;
+        --nd-quote-subtle-color: inherit;
+        --nd-quote-prefix: "";
+        --nd-quote-suffix: "";
+    }
+
+    .nd-Quote {
+        @apply text-pretty break-normal;
+
+        &.nd-RichText {
+            --nd-RichText-p-mb: 0;
+            --nd-RichText-p-font: var(--nd-quote-font);
+            --nd-RichText-p-color: var(--nd-quote-color, var(--nd-block-fg));
+            --nd-RichText-p-letterspacing: var(--nd-quote-letterspacing);
+            --nd-RichText-priority-font: var(--nd-quote-priority-font);
+            --nd-RichText-priority-color: var(--nd-quote-priority-color);
+            --nd-RichText-accent-font: var(--nd-quote-accent-font);
+            --nd-RichText-accent-color: var(--nd-quote-accent-color);
+            --nd-RichText-subtle-font: var(--nd-quote-subtle-font);
+            --nd-RichText-subtle-color: var(--nd-quote-subtle-color);
+        }
+
+        font: var(--nd-quote-font);
+        letter-spacing: var(--nd-quote-letterspacing);
+        color: var(--nd-quote-color, var(--nd-block-fg));
+        font-variant-numeric: lining-nums proportional-nums;
+
+        span:first-child:before {
+            content: var(--nd-quote-prefix)
+        }
+        span:last-child:after {
+            content: var(--nd-quote-suffix)
+        }
+    }
+}

package/dist/styles/fields/RichText.css

@@ -0,0 +1,243 @@
+@layer components {
+
+    /* base */
+    :root {
+
+        /* general block spacing */
+        --nd-RichText-block-mt: theme('spacing.l7');
+        --nd-RichText-block-mb: theme('spacing.l7');
+
+        /* heading spacing */
+        --nd-RichText-h1-mt: var(--nd-RichText-block-mt);
+        --nd-RichText-h1-mb: var(--nd-RichText-block-mb);
+        --nd-RichText-h2-mt: var(--nd-RichText-block-mt);
+        --nd-RichText-h2-mb: var(--nd-RichText-block-mb);
+        --nd-RichText-h3-mt: var(--nd-RichText-block-mt);
+        --nd-RichText-h3-mb: var(--nd-RichText-block-mb);
+
+        /* block spacing */
+        --nd-RichText-p-mt: var(--nd-RichText-block-mt);
+        --nd-RichText-p-mb: var(--nd-RichText-block-mb);
+        --nd-RichText-quote-mt: var(--nd-RichText-block-mt);
+        --nd-RichText-quote-mb: var(--nd-RichText-block-mb);
+        --nd-RichText-hr-mt: var(--nd-RichText-block-mt);
+        --nd-RichText-hr-mb: var(--nd-RichText-block-mb);
+
+        /* letter spacing */
+        --nd-RichText-h1-letterspacing: unset;
+        --nd-RichText-h2-letterspacing: unset;
+        --nd-RichText-h3-letterspacing: unset;
+        --nd-RichText-p-letterspacing: unset;
+
+        /* list spacing */
+        --nd-RichText-list-mt: var(--nd-RichText-block-mt);
+        --nd-RichText-list-mb: var(--nd-RichText-block-mb);
+        --nd-RichText-list-hanging-indent: theme('spacing.l6');
+        --nd-RichText-list-bullet-width: theme('spacing.l6');
+        --nd-RichText-list-number-width: theme('spacing.l9');
+
+
+        /* typography (font/color) */
+
+        /* general */
+        --nd-RichText-base-font: inital;
+        --nd-RichText-base-color: initial;
+
+        /* heading */
+        --nd-RichText-heading-color: var(--nd-RichText-base-color);
+        --nd-RichText-h1-font: var(--nd-RichText-base-font);
+        --nd-RichText-h1-color: var(--nd-RichText-heading-color);
+        --nd-RichText-h2-font: var(--nd-RichText-base-font);
+        --nd-RichText-h2-color: var(--nd-RichText-heading-color);
+        --nd-RichText-h3-font: var(--nd-RichText-base-font);
+        --nd-RichText-h3-color: var(--nd-RichText-heading-color);
+
+        /* paragraph */
+        --nd-RichText-p-font: var(--nd-RichText-base-font);
+        --nd-RichText-p-color: var(--nd-RichText-base-color);
+
+        /* styled */
+        --nd-RichText-priority-font: var(--nd-RichText-base-font);
+        --nd-RichText-priority-color: var(--nd-RichText-base-color);
+        --nd-RichText-accent-font: var(--nd-RichText-base-font);
+        --nd-RichText-accent-color: var(--nd-RichText-base-color);
+        --nd-RichText-subtle-font: var(--nd-RichText-base-font);
+        --nd-RichText-subtle-color: var(--nd-RichText-base-color);
+        --nd-RichText-bold-font: var(--nd-RichText-base-font);
+        --nd-RichText-bold-color: var(--nd-RichText-base-color);
+        --nd-RichText-italic-font: var(--nd-RichText-base-font);
+        --nd-RichText-italic-color: var(--nd-RichText-base-color);
+        --nd-RichText-underline-font: var(--nd-RichText-base-font);
+        --nd-RichText-underline-color: var(--nd-RichText-base-color);
+        --nd-RichText-strikethrough-font: var(--nd-RichText-base-font);
+        --nd-RichText-strikethrough-color: var(--nd-RichText-base-color);
+        --nd-RichText-link-font: var(--nd-RichText-base-font);
+        --nd-RichText-link-color: var(--nd-RichText-base-color);
+        --nd-RichText-quote-font: var(--nd-RichText-base-font);
+        --nd-RichText-quote-color: var(--nd-RichText-base-color);
+    }
+
+    .nd-RichText {
+
+        /* typography */
+        font: var(--nd-RichText-base-font);
+        color: var(--nd-RichText-base-color);
+
+        .nd-RichText-h1 {
+            font: var(--nd-RichText-h1-font);
+            color: var(--nd-RichText-h1-color);
+            letter-spacing: var(--nd-RichText-h1-letterspacing);
+            @apply mt-[var(--nd-RichText-h1-mt)] mb-[var(--nd-RichText-h1-mb)];
+        }
+
+        .nd-RichText-h2 {
+            font: var(--nd-RichText-h2-font);
+            color: var(--nd-RichText-h2-color);
+            letter-spacing: var(--nd-RichText-h2-letterspacing);
+            @apply mt-[var(--nd-RichText-h2-mt)] mb-[var(--nd-RichText-h2-mb)];
+        }
+
+        .nd-RichText-h3 {
+            font: var(--nd-RichText-h3-font);
+            color: var(--nd-RichText-h3-color);
+            letter-spacing: var(--nd-RichText-h3-letterspacing);
+            @apply mt-[var(--nd-RichText-h3-mt)] mb-[var(--nd-RichText-h3-mb)];
+        }
+
+        .nd-RichText-paragraph {
+            font: var(--nd-RichText-p-font);
+            color: var(--nd-RichText-p-color);
+            letter-spacing: var(--nd-RichText-p-letterspacing);
+            @apply mt-[var(--nd-RichText-p-mt)] mb-[var(--nd-RichText-p-mb)];
+        }
+
+        .nd-RichText-subtle {
+            font: var(--nd-RichText-subtle-font);
+            color: var(--nd-RichText-subtle-color);
+        }
+
+        .nd-RichText-bold {
+            font: var(--nd-RichText-bold-font);
+            color: var(--nd-RichText-bold-color);
+        }
+
+        .nd-RichText-italic {
+            font: var(--nd-RichText-italic-font);
+            color: var(--nd-RichText-italic-color);
+        }
+
+        .nd-RichText-underline {
+            font: var(--nd-RichText-underline-font);
+            color: var(--nd-RichText-underline-color);
+        }
+
+        .nd-RichText-strikethrough {
+            font: var(--nd-RichText-strikethrough-font);
+            color: var(--nd-RichText-strikethrough-color);
+        }
+
+        .nd-RichText-link {
+            font: var(--nd-RichText-link-font);
+            color: var(--nd-RichText-link-color);
+        }
+
+        /* unordered list styles */
+        .nd-RichText-unordered-list {
+            font: var(--nd-RichText-p-font);
+            color: var(--nd-RichText-p-color);
+            @apply mt-[var(--nd-RichText-list-mt)] mb-[var(--nd-RichText-list-mb)];
+
+            /* increased padding for nested levels */
+            .nd-RichText-listNesting > .nd-RichText-unordered-list {
+                @apply pl-[var(--nd-RichText-list-hanging-indent)];
+            }
+
+            /* customized level 1 unordered bullets */
+            .nd-RichText-listItem.nd-RichText-l1:not(.nd-RichText-listNesting) {
+                @apply mt-[var(--nd-RichText-list-mt)] mb-[var(--nd-RichText-list-mb)];
+
+                &::before {
+                    @apply inline-block content-['•'] w-[var(--nd-RichText-list-bullet-width)];
+                }
+            }
+
+            /* customized level 2 unordered bullets */
+            .nd-RichText-listItem.nd-RichText-l2:not(.nd-RichText-listNesting) {
+                @apply mt-[var(--nd-RichText-list-mt)] mb-[var(--nd-RichText-list-mb)];
+
+                &::before {
+                    @apply inline-block content-['◦'] w-[var(--nd-RichText-list-bullet-width)];
+                }
+            }
+
+            /* customized level 3 unordered bullets */
+            .nd-RichText-listItem.nd-RichText-l3:not(.nd-RichText-listNesting) {
+                @apply mt-[var(--nd-RichText-list-mt)] mb-[var(--nd-RichText-list-mb)];
+
+                &::before {
+                    @apply inline-block content-['-'] w-[var(--nd-RichText-list-bullet-width)];
+                }
+            }
+        }
+
+        /* ordered list styles */
+        .nd-RichText-ordered-list {
+            font: var(--nd-RichText-p-font);
+            color: var(--nd-RichText-p-color);
+            @apply mt-[var(--nd-RichText-list-mt)] mb-[var(--nd-RichText-list-mb)];
+
+            /* increased padding for nested levels */
+            .nd-RichText-listNesting > .nd-RichText-ordered-list {
+                @apply pl-[var(--nd-RichText-list-hanging-indent)];
+            }
+
+            /* customized level 1 ordered item */
+            .nd-RichText-listItem.nd-RichText-l1:not(.nd-RichText-listNesting) {
+                @apply counter-increment-l1 mt-[var(--nd-RichText-list-mt)] mb-[var(--nd-RichText-list-mb)];
+
+                &::before {
+                    @apply inline-block content-[counter(l1)_"."] w-[var(--nd-RichText-list-number-width)];
+                }
+            }
+
+            /* customized level 2 ordered item */
+            .nd-RichText-listItem.nd-RichText-l2:not(.nd-RichText-listNesting) {
+                @apply counter-increment-l2 mt-[var(--nd-RichText-list-mt)] mb-[var(--nd-RichText-list-mb)];
+
+                &::before {
+                    @apply inline-block content-[counter(l2,lower-alpha)_"."] w-[var(--nd-RichText-list-number-width)];
+                }
+            }
+
+            /* customized level 3 ordered item */
+            .nd-RichText-listItem.nd-RichText-l3:not(.nd-RichText-listNesting) {
+                @apply counter-increment-l3 mt-[var(--nd-RichText-list-mt)] mb-[var(--nd-RichText-list-mb)];
+
+                &::before {
+                    @apply inline-block content-[counter(l3,lower-roman)_"."] w-[var(--nd-RichText-list-number-width)];
+                }
+            }
+
+            }
+
+            .nd-RichText-blockquote {
+                font: var(--nd-RichText-quote-font);
+                color: var(--nd-RichText-quote-color);
+                @apply mt-[var(--nd-RichText-quote-mt)] mb-[var(--nd-RichText-quote-mb)];
+            }
+
+            .nd-RichText-hr {
+                @apply mt-[var(--nd-RichText-hr-mt)] mb-[var(--nd-RichText-hr-mb)];
+            }
+        }
+
+    .nd-RichText > :first-child {
+        @apply mt-0
+    }
+
+    .nd-RichText > :last-child {
+        @apply mb-0
+    }
+    
+}
+

package/dist/styles/fields/Title.css

@@ -0,0 +1,17 @@
+@layer components {
+
+    :root {
+        --nd-title-font: normal 500 16px/1.2 Helvetica, Arial, san-serif;
+        --nd-title-letterspacing: initial;
+        --nd-title-color: initial;
+    }
+
+    .nd-Title {
+        @apply text-pretty;
+        overflow-wrap: anywhere;
+        font: var(--nd-title-font);
+        letter-spacing: var(--nd-title-letterspacing);
+        color: var(--nd-title-color, var(--nd-block-fg));
+        font-variant-numeric: lining-nums proportional-nums;
+    }
+}