:root {
    --dcb-bg: #F8F8F8;
    --dcb-surface: #fff;
    --dcb-ink: #000;
    --dcb-muted: #000;
    --dcb-line: #000;
    --dcb-primary: #DE223D;
    --dcb-primary-dark: #000;
    --dcb-navy: #000;
    --dcb-soft: #F8F8F8;
    --dcb-shadow: 0 18px 45px rgba(0, 0, 0, 0.12);
    --dcb-font: "Poppins", Arial, Helvetica, sans-serif;
}

.dcb-builder-wrap {
    max-width: 1180px;
    margin: 32px auto;
    padding: 24px;
    font-family: var(--dcb-font);
    color: var(--dcb-ink);
}

.dcb-success {
    display: grid;
    gap: 14px;
    align-items: start;
    justify-content: start;
    margin-bottom: 18px;
    padding: 14px 16px;
    border: 1px solid #99f6e4;
    border-radius: 8px;
    background: #ecfdf5;
}

.dcb-success a {
    display: inline-flex;
    width: fit-content;
    border-radius: 8px;
    padding: 10px 14px;
    background: var(--dcb-primary);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.dcb-success-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-top: 2px;
}

.dcb-builder-wrap > .dcb-success {
    position: relative;
    z-index: 20;
    display: grid !important;
    visibility: visible;
    opacity: 1;
}

.dcb-builder-form {
    padding: 24px;
    border: 1px solid var(--dcb-line);
    border-radius: 8px;
    background: var(--dcb-surface);
    box-shadow: var(--dcb-shadow);
}

.dcb-studio-form {
    padding: 0;
    overflow: visible;
    border-color: #d8def0;
    background: #f4f6fb;
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.1);
}

.dcb-studio-head {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
    align-items: end;
    padding: 20px;
    border-bottom: 1px solid #dfe5f4;
    background: #fff;
}

.dcb-page-url-field input {
    background: #f8fafc;
}

.dcb-slug-control {
    position: relative;
    display: block;
}

.dcb-slug-control input {
    width: 100%;
    padding-right: 44px;
}

.dcb-slug-icon {
    position: absolute;
    top: 50%;
    right: 13px;
    display: inline-flex;
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: #64748b;
    transform: translateY(-50%);
    pointer-events: none;
}

.dcb-slug-icon-available {
    color: #DE223D;
}

.dcb-slug-icon-taken {
    color: #dc2626;
}

.dcb-slug-icon-checking {
    color: #000;
}

.dcb-slug-status {
    display: block;
    margin-top: 7px;
    font-size: 12px;
    line-height: 1.35;
    color: #64748b;
}

.dcb-slug-status-available {
    color: #15803d;
}

.dcb-slug-status-taken {
    color: #b91c1c;
}

.dcb-slug-status-checking {
    color: #1d4ed8;
}

.dcb-product-page {
    max-width: 1120px;
    margin: 36px auto;
    padding: 24px;
    font-family: var(--dcb-font);
    color: #0f172a;
}

.dcb-product-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 24px;
    align-items: stretch;
    padding: 32px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--dcb-navy), var(--dcb-primary));
    color: #fff;
}

.dcb-product-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.dcb-product-hero h1 {
    max-width: 710px;
    margin: 0 0 14px;
    font-size: 42px;
    line-height: 1.08;
}

.dcb-product-hero p {
    max-width: 640px;
    margin: 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 17px;
    line-height: 1.55;
}

.dcb-product-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}

.dcb-product-actions a,
.dcb-pricing-card a,
.dcb-subscription-help-card a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 8px;
    padding: 12px 16px;
    text-decoration: none;
    font-weight: 800;
}

.dcb-product-primary,
.dcb-pricing-card a,
.dcb-subscription-help-card a {
    background: #fff;
    color: var(--dcb-navy);
}

.dcb-product-secondary {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.dcb-pricing-card {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 22px;
    border-radius: 12px;
    background: #fff;
    color: #0f172a;
}

.dcb-pricing-card span,
.dcb-subscription-price-card span {
    color: var(--dcb-primary);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.dcb-pricing-card h2,
.dcb-subscription-price-card h2 {
    margin: 0;
    font-size: 34px;
}

.dcb-pricing-card p,
.dcb-subscription-price-card p {
    color: #64748b;
}

.dcb-pricing-card ul,
.dcb-subscription-price-card ul {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dcb-pricing-card li,
.dcb-subscription-price-card li {
    display: flex;
    gap: 8px;
    align-items: center;
    color: #334155;
}

.dcb-pricing-card li i,
.dcb-subscription-price-card li i {
    color: #DE223D;
}

.dcb-product-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 18px;
}

.dcb-product-grid article {
    padding: 20px;
    border: 1px solid #dbe4f0;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(15, 23, 42, 0.06);
}

.dcb-product-grid i {
    color: var(--dcb-primary);
    font-size: 24px;
}

.dcb-product-grid h3 {
    margin: 12px 0 8px;
}

.dcb-product-grid p {
    margin: 0;
    color: #64748b;
    line-height: 1.5;
}

.dcb-product-grid a {
    display: inline-flex;
    margin-top: 12px;
    color: var(--dcb-primary);
    font-weight: 800;
}

.dcb-free-builder-note,
.dcb-paid-builder-note {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 14px 16px;
    border-radius: 8px;
    font-weight: 700;
}

.dcb-free-builder-note {
    background: #fff7ed;
    color: #9a3412;
}

.dcb-paid-builder-note {
    background: #ecfdf5;
    color: #15803d;
}

.dcb-premium-locked {
    position: relative;
    overflow: hidden;
}

.dcb-premium-locked .dcb-accordion-body,
.dcb-premium-locked .dcb-section-title-row + .dcb-lock-overlay + .dcb-accordion-body {
    filter: blur(1px);
    opacity: 0.42;
    pointer-events: none;
}

.dcb-lock-overlay {
    position: absolute;
    inset: 58px 14px 14px;
    z-index: 6;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 6px;
    border: 1px dashed #f59e0b;
    border-radius: 8px;
    background: rgba(255, 251, 235, 0.92);
    color: #92400e;
    text-align: center;
}

.dcb-lock-overlay i {
    font-size: 24px;
}

.dcb-head-submit {
    margin: 0;
    min-width: 110px;
}

.dcb-studio-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 18px;
    align-items: start;
    padding: 20px;
}

.dcb-studio-main {
    display: grid;
    gap: 16px;
}

.dcb-studio-panel {
    border: 1px solid #dfe5f4;
    border-radius: 8px;
    padding: 18px;
    background: #fff;
}

.dcb-studio-panel .dcb-swatch-grid {
    gap: 10px;
}

.dcb-studio-panel .dcb-choice-card {
    min-height: 78px;
    padding: 8px;
}

.dcb-studio-panel .dcb-choice-preview {
    min-height: 38px;
}

.dcb-studio-panel .dcb-banner-mini {
    height: 42px;
}

.dcb-panel-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

button.dcb-panel-header {
    width: 100%;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.dcb-accordion-toggle > div {
    flex: 1;
}

.dcb-toggle-switch {
    position: relative;
    width: 38px;
    height: 20px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: #cbd5e1;
    transition: background 0.18s ease;
}

.dcb-toggle-switch::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    transition: transform 0.18s ease;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.25);
}

.dcb-accordion-open .dcb-toggle-switch {
    background: var(--dcb-primary);
}

.dcb-accordion-open .dcb-toggle-switch::after {
    transform: translateX(18px);
}

.dcb-accordion .dcb-accordion-body {
    display: none;
}

.dcb-accordion.dcb-accordion-open .dcb-accordion-body {
    display: block;
}

.dcb-accordion-open > .dcb-accordion-toggle {
    margin-bottom: 16px;
}

.dcb-panel-header h3,
.dcb-panel-header p {
    margin: 0;
}

.dcb-panel-header h3 {
    font-size: 16px;
    font-weight: 700;
}

.dcb-panel-header p {
    margin-top: 3px;
    color: #64748b;
    font-size: 13px;
}

.dcb-panel-icon {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    border-radius: 8px;
    background: #eef2ff;
    color: #4f46e5;
}

.dcb-upload-field input {
    border-style: dashed;
    background: #f8fafc;
}

.dcb-studio-footer {
    display: flex;
    justify-content: flex-end;
    padding: 16px 20px 20px;
}

.dcb-preview-pane {
    position: sticky;
    top: 22px;
}

.dcb-preview-device {
    width: 250px;
    min-height: 440px;
    margin: 0 auto;
    overflow: hidden;
    border: 8px solid #0f172a;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.22);
    text-align: center;
}

.dcb-preview-banner {
    position: relative;
    height: 112px;
}

.dcb-preview-banner::before {
    content: "";
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 24px;
    background: #fff;
    pointer-events: none;
    display: none;
}

.dcb-preview-banner.dcb-banner-shape-wave::before,
.dcb-preview-banner.dcb-banner-shape-curve::before,
.dcb-preview-banner.dcb-banner-shape-slant::before,
.dcb-preview-banner.dcb-banner-shape-zigzag::before,
.dcb-preview-banner.dcb-banner-shape-arch::before {
    display: block;
}

.dcb-preview-banner.dcb-banner-shape-wave::before {
    border-radius: 50% 50% 0 0 / 100% 100% 0 0;
    transform: translateY(10px) scaleX(1.16);
}

.dcb-preview-banner.dcb-banner-shape-curve::before {
    height: 34px;
    border-radius: 50% 50% 0 0;
    transform: translateY(18px);
}

.dcb-preview-banner.dcb-banner-shape-slant::before {
    height: 28px;
    clip-path: polygon(0 62%, 100% 20%, 100% 100%, 0 100%);
}

.dcb-preview-banner.dcb-banner-shape-zigzag::before {
    height: 20px;
    clip-path: polygon(0 42%, 10% 78%, 20% 42%, 30% 78%, 40% 42%, 50% 78%, 60% 42%, 70% 78%, 80% 42%, 90% 78%, 100% 42%, 100% 100%, 0 100%);
}

.dcb-preview-banner.dcb-banner-shape-arch::before {
    height: 38px;
    clip-path: ellipse(58% 72% at 50% 100%);
}

.dcb-preview-avatar {
    display: grid;
    place-items: center;
    width: 82px;
    height: 82px;
    margin: -42px auto 0;
    overflow: hidden;
    border: 4px solid #fff;
    border-radius: 50%;
    background: #e2e8f0;
    color: #64748b;
    font-size: 28px;
    position: relative;
    z-index: 999;
}

.dcb-preview-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dcb-preview-device h4 {
    margin: 10px 16px 3px;
    color: #111827;
    font-size: 20px;
    font-weight: 700;
}

.dcb-preview-device p {
    margin: 0;
    color: #64748b;
    font-size: 12px;
}

.dcb-preview-actions {
    display: flex;
    justify-content: center;
    gap: 9px;
    margin: 18px 0;
}

.dcb-preview-actions span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--dcb-primary);
}

.dcb-preview-card {
    margin: 10px 14px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px;
    text-align: left;
}

.dcb-preview-card strong {
    display: block;
    margin-bottom: 5px;
    color: #111827;
    font-size: 13px;
}

.dcb-preview-device.dcb-template-engineer,
.dcb-preview-device.dcb-template-developer,
.dcb-preview-device.dcb-template-lawyer,
.dcb-preview-device.dcb-template-premium,
.dcb-preview-device.dcb-template-executive {
    background: #111827;
}

.dcb-preview-device.dcb-template-engineer h4,
.dcb-preview-device.dcb-template-developer h4,
.dcb-preview-device.dcb-template-lawyer h4,
.dcb-preview-device.dcb-template-premium h4,
.dcb-preview-device.dcb-template-executive h4 {
    color: #f8fafc;
}

.dcb-preview-device.dcb-template-engineer .dcb-preview-card,
.dcb-preview-device.dcb-template-developer .dcb-preview-card,
.dcb-preview-device.dcb-template-lawyer .dcb-preview-card,
.dcb-preview-device.dcb-template-premium .dcb-preview-card,
.dcb-preview-device.dcb-template-executive .dcb-preview-card {
    border-color: rgba(255, 255, 255, 0.16);
    background: #0f172a;
}

.dcb-preview-device.dcb-template-engineer .dcb-preview-card strong,
.dcb-preview-device.dcb-template-developer .dcb-preview-card strong,
.dcb-preview-device.dcb-template-lawyer .dcb-preview-card strong,
.dcb-preview-device.dcb-template-premium .dcb-preview-card strong,
.dcb-preview-device.dcb-template-executive .dcb-preview-card strong {
    color: #f8fafc;
}

.dcb-preview-device.dcb-template-marketing,
.dcb-preview-device.dcb-template-sales {
    background: #fff7ed;
}

.dcb-preview-device.dcb-template-fashion,
.dcb-preview-device.dcb-template-artist,
.dcb-preview-device.dcb-template-photographer {
    border-radius: 34px;
}

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

.dcb-field {
    display: grid;
    gap: 7px;
    font-size: 14px;
    font-weight: 700;
}

.dcb-field input,
.dcb-field textarea,
.dcb-field select {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 11px 12px;
    font: inherit;
    font-weight: 400;
    color: var(--dcb-ink);
    background: #fff;
}

.dcb-field input:focus,
.dcb-field textarea:focus,
.dcb-field select:focus {
    outline: 2px solid rgba(15, 118, 110, 0.18);
    border-color: var(--dcb-primary);
}

.dcb-field textarea {
    resize: vertical;
}

.dcb-span-2 {
    grid-column: 1 / -1;
}

.dcb-submit {
    margin-top: 18px;
    border: 0;
    border-radius: 8px;
    padding: 12px 20px;
    background: var(--dcb-primary);
    color: #fff;
    font-weight: 700;
    cursor: pointer;
}

.dcb-submit:hover {
    background: var(--dcb-primary-dark);
}

.dcb-form-section {
    margin-top: 6px;
    padding: 18px;
    border: 1px solid var(--dcb-line);
    border-radius: 8px;
    background: var(--dcb-soft);
}

.dcb-form-section h3 {
    margin: 0 0 14px;
    font-size: 18px;
}

.dcb-inner-grid {
    gap: 14px;
}

.dcb-swatch-group {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.dcb-swatch-group:first-of-type {
    margin-top: 0;
}

.dcb-swatch-heading {
    font-size: 14px;
    font-weight: 700;
    color: var(--dcb-ink);
}

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

.dcb-banner-swatches {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.dcb-shape-swatches {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.dcb-color-swatches {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.dcb-choice {
    display: block;
    cursor: pointer;
}

.dcb-choice input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.dcb-choice-card {
    display: grid;
    gap: 9px;
    min-height: 88px;
    box-sizing: border-box;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 10px;
    background: #fff;
    color: var(--dcb-ink);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.dcb-choice input:checked + .dcb-choice-card {
    border-color: var(--dcb-primary);
    box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.16);
}

.dcb-choice:hover .dcb-choice-card {
    transform: translateY(-1px);
}

.dcb-choice-preview {
    display: block;
    min-height: 44px;
    overflow: hidden;
    border-radius: 8px;
    background: #f8fafc;
}

.dcb-choice-label {
    font-size: 13px;
    font-weight: 600;
}

.dcb-template-swatches .dcb-choice-preview {
    display: grid;
    gap: 5px;
    padding: 8px;
    border: 1px solid #e2e8f0;
}

.dcb-template-swatches .dcb-choice-preview span,
.dcb-template-swatches .dcb-choice-preview strong,
.dcb-template-swatches .dcb-choice-preview em {
    display: block;
    border-radius: 999px;
}

.dcb-template-swatches .dcb-choice-preview span {
    width: 34px;
    height: 14px;
    background: var(--dcb-primary);
}

.dcb-template-swatches .dcb-choice-preview strong {
    width: 70%;
    height: 8px;
    background: var(--dcb-navy);
}

.dcb-template-swatches .dcb-choice-preview em {
    width: 48%;
    height: 7px;
    background: #cbd5e1;
}

.dcb-choice-executive .dcb-choice-preview {
    background: #111827;
}

.dcb-choice-executive .dcb-choice-preview strong {
    background: #f8fafc;
}

.dcb-choice-minimal .dcb-choice-preview span {
    background: #e2e8f0;
}

.dcb-choice-corporate .dcb-choice-preview {
    background: linear-gradient(90deg, #e2e8f0 0 28%, #fff 28% 100%);
}

.dcb-choice-creative .dcb-choice-preview {
    background:
        radial-gradient(circle at 78% 24%, rgba(249, 115, 22, 0.28), transparent 24%),
        #fff7ed;
}

.dcb-choice-compact .dcb-choice-preview {
    padding: 6px;
    gap: 3px;
}

.dcb-choice-compact .dcb-choice-preview span {
    width: 58px;
    height: 10px;
}

.dcb-choice-premium .dcb-choice-preview {
    background: #111827;
    border-color: #d4af37;
}

.dcb-choice-premium .dcb-choice-preview span {
    background: #d4af37;
}

.dcb-choice-premium .dcb-choice-preview strong {
    background: #fff;
}

.dcb-choice-business .dcb-choice-preview,
.dcb-choice-professional .dcb-choice-preview {
    background: linear-gradient(135deg, #f8fafc, #dbeafe);
}

.dcb-choice-business .dcb-choice-preview {
    grid-template-columns: 22px 1fr;
}

.dcb-choice-business .dcb-choice-preview span {
    grid-row: span 3;
    width: 18px;
    height: 100%;
    border-radius: 8px;
}

.dcb-choice-marketing .dcb-choice-preview,
.dcb-choice-sales .dcb-choice-preview {
    background: linear-gradient(135deg, #fff7ed, #fed7aa);
}

.dcb-choice-marketing .dcb-choice-preview span,
.dcb-choice-sales .dcb-choice-preview span {
    width: 56px;
}

.dcb-choice-realestate .dcb-choice-preview,
.dcb-choice-finance .dcb-choice-preview {
    background: linear-gradient(135deg, #ecfdf5, #bbf7d0);
}

.dcb-choice-fashion .dcb-choice-preview,
.dcb-choice-artist .dcb-choice-preview,
.dcb-choice-photographer .dcb-choice-preview {
    background: linear-gradient(135deg, #fdf2f8, #ddd6fe);
}

.dcb-choice-fashion .dcb-choice-preview span,
.dcb-choice-artist .dcb-choice-preview span,
.dcb-choice-photographer .dcb-choice-preview span {
    width: 28px;
    height: 28px;
}

.dcb-choice-doctor .dcb-choice-preview,
.dcb-choice-teacher .dcb-choice-preview {
    background: linear-gradient(135deg, #eff6ff, #ccfbf1);
}

.dcb-choice-engineer .dcb-choice-preview,
.dcb-choice-developer .dcb-choice-preview {
    background: linear-gradient(135deg, #111827, #334155);
}

.dcb-choice-engineer .dcb-choice-preview strong,
.dcb-choice-developer .dcb-choice-preview strong {
    background: #f8fafc;
}

.dcb-choice-lawyer .dcb-choice-preview {
    background: linear-gradient(135deg, #111827, #713f12);
}

.dcb-choice-lawyer .dcb-choice-preview span {
    background: #d4af37;
}

.dcb-choice-blogger .dcb-choice-preview,
.dcb-choice-freelancer .dcb-choice-preview {
    background: linear-gradient(135deg, #f0f9ff, #fae8ff);
}

.dcb-choice-blogger .dcb-choice-preview {
    gap: 8px;
}

.dcb-choice-blogger .dcb-choice-preview strong {
    width: 92%;
}

.dcb-banner-mini {
    display: block;
    width: 100%;
    height: 48px;
}

.dcb-banner-none {
    background: linear-gradient(135deg, #e2e8f0, #f8fafc);
}

.dcb-shape-mini {
    display: block;
    position: relative;
    width: 100%;
    height: 42px;
    overflow: hidden;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--dcb-navy), var(--dcb-primary));
}

.dcb-shape-mini::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 18px;
    background: #fff;
}

.dcb-shape-mini-none::after {
    display: none;
}

.dcb-shape-mini-wave::after {
    border-radius: 50% 50% 0 0 / 100% 100% 0 0;
    transform: translateY(8px) scaleX(1.2);
}

.dcb-shape-mini-curve::after {
    height: 24px;
    border-radius: 50% 50% 0 0;
    transform: translateY(13px);
}

.dcb-shape-mini-slant::after {
    height: 24px;
    clip-path: polygon(0 58%, 100% 18%, 100% 100%, 0 100%);
}

.dcb-shape-mini-zigzag::after {
    clip-path: polygon(0 45%, 10% 75%, 20% 45%, 30% 75%, 40% 45%, 50% 75%, 60% 45%, 70% 75%, 80% 45%, 90% 75%, 100% 45%, 100% 100%, 0 100%);
}

.dcb-shape-mini-arch::after {
    height: 26px;
    clip-path: ellipse(58% 70% at 50% 100%);
}

.dcb-color-swatches .dcb-choice-preview {
    min-height: 42px;
    background: #f8fafc;
}

.dcb-color-swatches .dcb-choice-preview span {
    display: block;
    width: 100%;
    height: 42px;
    border-radius: 8px;
    background: linear-gradient(90deg, var(--c1) 0 50%, var(--c2) 50% 100%);
}

.dcb-custom-colors {
    display: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

.dcb-custom-colors.dcb-custom-visible {
    display: grid;
}

.dcb-color-swatch-field {
    display: grid;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
}

.dcb-color-swatch-field input {
    width: 100%;
    height: 46px;
    box-sizing: border-box;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 6px;
    background: #fff;
}

.dcb-section-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.dcb-section-title-row .dcb-panel-header {
    margin-bottom: 0;
}

.dcb-section-title-row h3 {
    margin: 0;
}

.dcb-add-field,
.dcb-remove-field {
    border: 0;
    border-radius: 8px;
    padding: 10px 14px;
    background: var(--dcb-primary);
    color: #fff;
    font-weight: 800;
    cursor: pointer;
}

.dcb-extra-fields {
    display: grid;
    gap: 12px;
}

.dcb-extra-row {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 12px;
    align-items: end;
}

.dcb-remove-field {
    background: #334155;
}

.dcb-public-body {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(20, 184, 166, 0.18), transparent 34%),
        linear-gradient(180deg, #f8fafc 0%, var(--dcb-bg) 100%);
    font-family: var(--dcb-font);
    color: var(--dcb-ink);
}

.dcb-page-shell {
    position: relative;
    min-height: 100vh;
    padding: 32px 16px 96px;
    box-sizing: border-box;
}

.dcb-phone-card {
    width: min(560px, 100%);
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.3);
    border-radius: 8px;
    background: var(--dcb-surface);
    box-shadow: var(--dcb-shadow);
}

.dcb-template-executive .dcb-public-body,
.dcb-template-executive {
    --dcb-bg: #111827;
    --dcb-surface: #0f172a;
    --dcb-ink: #f8fafc;
    --dcb-muted: #cbd5e1;
    --dcb-line: rgba(226, 232, 240, 0.18);
    --dcb-soft: #111827;
}

.dcb-template-executive.dcb-public-body {
    background: linear-gradient(180deg, #020617 0%, #111827 100%);
}

.dcb-template-executive .dcb-phone-card {
    border-color: rgba(255, 255, 255, 0.12);
    background: #0f172a;
}

.dcb-template-executive .dcb-panel,
.dcb-template-executive .dcb-actions a,
.dcb-template-executive .dcb-socials a,
.dcb-template-executive .dcb-wallet-row a {
    background: #111827;
}

.dcb-template-executive .dcb-qr-panel {
    background: linear-gradient(180deg, #111827, #0f172a);
}

.dcb-template-minimal.dcb-public-body {
    background: #fff;
}

.dcb-template-minimal .dcb-phone-card {
    box-shadow: none;
}

.dcb-template-minimal .dcb-cover-pattern {
    height: 110px;
    border-bottom: 1px solid var(--dcb-line);
}

.dcb-template-minimal .dcb-profile-light {
    margin-top: -56px;
}

.dcb-template-minimal .dcb-panel,
.dcb-template-minimal .dcb-actions a,
.dcb-template-minimal .dcb-socials a {
    background: #fff;
}

.dcb-template-corporate.dcb-public-body {
    background: #f1f5f9;
}

.dcb-template-corporate .dcb-phone-card {
    width: min(640px, 100%);
}

.dcb-template-corporate .dcb-cover-pattern {
    height: 150px;
}

.dcb-template-corporate .dcb-panel {
    border-left: 4px solid var(--dcb-primary);
}

.dcb-template-creative.dcb-public-body {
    background:
        radial-gradient(circle at 8% 8%, rgba(249, 115, 22, 0.12), transparent 28%),
        radial-gradient(circle at 90% 18%, rgba(124, 58, 237, 0.12), transparent 24%),
        #fff;
}

.dcb-template-creative .dcb-phone-card {
    border-radius: 18px;
}

.dcb-template-creative .dcb-panel,
.dcb-template-creative .dcb-actions a,
.dcb-template-creative .dcb-socials a,
.dcb-template-creative .dcb-cta a {
    border-radius: 16px;
}

.dcb-template-compact .dcb-page-shell {
    padding-top: 18px;
}

.dcb-template-compact .dcb-cover-pattern {
    height: 120px;
}

.dcb-template-compact .dcb-profile-light {
    margin-top: -52px;
    padding-bottom: 14px;
}

.dcb-template-compact .dcb-profile img,
.dcb-template-compact .dcb-avatar-fallback {
    width: 104px;
    height: 104px;
}

.dcb-template-compact .dcb-panel {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 16px;
}

.dcb-template-premium.dcb-public-body {
    background: #0b1120;
}

.dcb-template-premium .dcb-phone-card {
    border-color: rgba(212, 175, 55, 0.38);
    background: #111827;
}

.dcb-template-premium .dcb-panel,
.dcb-template-premium .dcb-actions a,
.dcb-template-premium .dcb-socials a,
.dcb-template-premium .dcb-wallet-row a {
    border-color: rgba(212, 175, 55, 0.28);
    background: #0f172a;
}

.dcb-template-premium .dcb-qr-panel {
    background: linear-gradient(180deg, #0f172a, #111827);
}

.dcb-template-premium .dcb-profile h1,
.dcb-template-premium .dcb-panel h2,
.dcb-template-premium .dcb-panel h3,
.dcb-template-premium .dcb-extra-panel dt,
.dcb-template-premium .dcb-actions a,
.dcb-template-premium .dcb-socials a,
.dcb-template-premium .dcb-wallet-row a {
    color: #f8fafc;
}

.dcb-template-premium .dcb-profile p,
.dcb-template-premium .dcb-panel p,
.dcb-template-premium .dcb-extra-panel dd {
    color: #cbd5e1;
}

.dcb-template-business .dcb-panel,
.dcb-template-professional .dcb-panel {
    border-top: 3px solid var(--dcb-primary);
}

.dcb-template-marketing.dcb-public-body,
.dcb-template-sales.dcb-public-body {
    background: linear-gradient(180deg, #fff7ed 0%, #f8fafc 100%);
}

.dcb-template-marketing .dcb-phone-card,
.dcb-template-sales .dcb-phone-card {
    border-radius: 18px;
}

.dcb-template-realestate .dcb-panel,
.dcb-template-finance .dcb-panel {
    border-left: 4px solid var(--dcb-primary);
    background: #fbfffb;
}

.dcb-template-fashion .dcb-phone-card,
.dcb-template-artist .dcb-phone-card,
.dcb-template-photographer .dcb-phone-card {
    border-radius: 22px;
}

.dcb-template-fashion .dcb-panel,
.dcb-template-artist .dcb-panel,
.dcb-template-photographer .dcb-panel {
    border-radius: 18px;
}

.dcb-template-doctor .dcb-actions a,
.dcb-template-teacher .dcb-actions a {
    border-radius: 999px;
}

.dcb-template-engineer.dcb-public-body,
.dcb-template-developer.dcb-public-body,
.dcb-template-lawyer.dcb-public-body {
    background: #0f172a;
}

.dcb-template-engineer .dcb-phone-card,
.dcb-template-developer .dcb-phone-card,
.dcb-template-lawyer .dcb-phone-card {
    background: #111827;
    border-color: rgba(255, 255, 255, 0.12);
}

.dcb-template-engineer .dcb-panel,
.dcb-template-developer .dcb-panel,
.dcb-template-lawyer .dcb-panel {
    background: #0f172a;
    border-color: rgba(255, 255, 255, 0.12);
}

.dcb-template-engineer .dcb-panel h2,
.dcb-template-engineer .dcb-panel h3,
.dcb-template-developer .dcb-panel h2,
.dcb-template-developer .dcb-panel h3,
.dcb-template-lawyer .dcb-panel h2,
.dcb-template-lawyer .dcb-panel h3,
.dcb-template-engineer .dcb-profile h1,
.dcb-template-developer .dcb-profile h1,
.dcb-template-lawyer .dcb-profile h1 {
    color: #f8fafc;
}

.dcb-template-engineer .dcb-panel p,
.dcb-template-developer .dcb-panel p,
.dcb-template-lawyer .dcb-panel p {
    color: #cbd5e1;
}

.dcb-template-blogger .dcb-panel,
.dcb-template-freelancer .dcb-panel {
    background: linear-gradient(180deg, #fff, #f8fafc);
}

/* Profession layout families */
.dcb-template-business .dcb-profile-light,
.dcb-template-corporate .dcb-profile-light,
.dcb-template-professional .dcb-profile-light {
    grid-template-columns: 118px 1fr;
    justify-items: start;
    align-items: center;
    column-gap: 18px;
    text-align: left;
}

.dcb-template-business .dcb-profile-light img,
.dcb-template-business .dcb-profile-light .dcb-avatar-fallback,
.dcb-template-corporate .dcb-profile-light img,
.dcb-template-corporate .dcb-profile-light .dcb-avatar-fallback,
.dcb-template-professional .dcb-profile-light img,
.dcb-template-professional .dcb-profile-light .dcb-avatar-fallback {
    grid-row: span 3;
    width: 108px;
    height: 108px;
}

.dcb-template-business .dcb-profile-light h1,
.dcb-template-corporate .dcb-profile-light h1,
.dcb-template-professional .dcb-profile-light h1 {
    margin-top: 0;
}

.dcb-template-realestate .dcb-phone-card,
.dcb-template-finance .dcb-phone-card,
.dcb-template-lawyer .dcb-phone-card {
    width: min(620px, 100%);
}

.dcb-template-realestate .dcb-actions,
.dcb-template-finance .dcb-actions,
.dcb-template-lawyer .dcb-actions {
    grid-template-columns: 1fr;
}

.dcb-template-realestate .dcb-actions a,
.dcb-template-finance .dcb-actions a,
.dcb-template-lawyer .dcb-actions a {
    justify-content: flex-start;
    padding-inline: 18px;
}

.dcb-template-fashion .dcb-cover-pattern,
.dcb-template-artist .dcb-cover-pattern,
.dcb-template-photographer .dcb-cover-pattern {
    height: 250px;
}

.dcb-template-fashion .dcb-profile-light,
.dcb-template-artist .dcb-profile-light,
.dcb-template-photographer .dcb-profile-light {
    margin-top: -98px;
}

.dcb-template-fashion .dcb-profile-light img,
.dcb-template-fashion .dcb-profile-light .dcb-avatar-fallback,
.dcb-template-artist .dcb-profile-light img,
.dcb-template-artist .dcb-profile-light .dcb-avatar-fallback,
.dcb-template-photographer .dcb-profile-light img,
.dcb-template-photographer .dcb-profile-light .dcb-avatar-fallback {
    width: 156px;
    height: 156px;
    border-radius: 22px;
}

.dcb-template-doctor .dcb-panel,
.dcb-template-teacher .dcb-panel {
    border-radius: 18px;
    background: #f8fbff;
}

.dcb-template-doctor .dcb-panel-title span,
.dcb-template-teacher .dcb-panel-title span {
    border-radius: 50%;
    background: var(--dcb-primary);
}

.dcb-template-engineer .dcb-cover-pattern,
.dcb-template-developer .dcb-cover-pattern {
    height: 132px;
    background:
        linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px) 0 0 / 18px 18px,
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px) 0 0 / 18px 18px,
        #0f172a;
}

.dcb-template-engineer .dcb-profile-light,
.dcb-template-developer .dcb-profile-light {
    margin-top: -44px;
    border-bottom-color: rgba(255, 255, 255, 0.14);
}

.dcb-template-engineer .dcb-profile-light img,
.dcb-template-engineer .dcb-profile-light .dcb-avatar-fallback,
.dcb-template-developer .dcb-profile-light img,
.dcb-template-developer .dcb-profile-light .dcb-avatar-fallback {
    width: 92px;
    height: 92px;
    border-radius: 8px;
}

.dcb-template-marketing .dcb-qr-panel,
.dcb-template-sales .dcb-qr-panel,
.dcb-template-freelancer .dcb-qr-panel {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
}

.dcb-template-marketing .dcb-main-qr,
.dcb-template-sales .dcb-main-qr,
.dcb-template-freelancer .dcb-main-qr {
    width: 180px;
    height: 180px;
}

.dcb-template-blogger .dcb-about,
.dcb-template-freelancer .dcb-about {
    text-align: left;
    border-left: 5px solid var(--dcb-primary);
}

.dcb-template-compact .dcb-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-top: 12px;
}

.dcb-cover-pattern {
    position: relative;
    overflow: hidden;
    height: 180px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.12) 25%, transparent 25%) 0 0 / 34px 34px,
        linear-gradient(135deg, var(--dcb-navy), #164e63 52%, var(--dcb-primary));
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.dcb-cover-pattern::before {
    content: "";
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 38px;
    background: var(--dcb-surface);
    pointer-events: none;
    display: none;
}

.dcb-banner-shape-wave::before,
.dcb-banner-shape-curve::before,
.dcb-banner-shape-slant::before,
.dcb-banner-shape-zigzag::before,
.dcb-banner-shape-arch::before {
    display: block;
}

.dcb-banner-shape-wave::before {
    height: 36px;
    border-radius: 50% 50% 0 0 / 100% 100% 0 0;
    transform: translateY(14px) scaleX(1.18);
}

.dcb-banner-shape-curve::before {
    height: 46px;
    border-radius: 50% 50% 0 0;
    transform: translateY(25px);
}

.dcb-banner-shape-slant::before {
    height: 48px;
    clip-path: polygon(0 62%, 100% 20%, 100% 100%, 0 100%);
}

.dcb-banner-shape-zigzag::before {
    height: 34px;
    clip-path: polygon(0 42%, 8% 78%, 16% 42%, 24% 78%, 32% 42%, 40% 78%, 48% 42%, 56% 78%, 64% 42%, 72% 78%, 80% 42%, 88% 78%, 96% 42%, 100% 60%, 100% 100%, 0 100%);
}

.dcb-banner-shape-arch::before {
    height: 52px;
    clip-path: ellipse(58% 72% at 50% 100%);
}

.dcb-banner-gradient {
    background:
        radial-gradient(circle at 18% 22%, rgba(255, 255, 255, 0.28), transparent 24%),
        linear-gradient(135deg, var(--dcb-navy), var(--dcb-primary));
}

.dcb-banner-waves {
    background:
        radial-gradient(120px 70px at 12% 72%, rgba(255, 255, 255, 0.2), transparent 72%),
        radial-gradient(180px 90px at 88% 20%, rgba(255, 255, 255, 0.24), transparent 72%),
        linear-gradient(145deg, var(--dcb-primary), var(--dcb-navy));
}

.dcb-banner-grid {
    background:
        linear-gradient(rgba(255, 255, 255, 0.16) 1px, transparent 1px) 0 0 / 26px 26px,
        linear-gradient(90deg, rgba(255, 255, 255, 0.16) 1px, transparent 1px) 0 0 / 26px 26px,
        linear-gradient(135deg, var(--dcb-navy), var(--dcb-primary));
}

.dcb-banner-diagonal {
    background:
        radial-gradient(circle at 84% 18%, rgba(255, 255, 255, 0.24), transparent 0 34px, transparent 35px),
        linear-gradient(45deg, transparent 0 62%, rgba(255, 255, 255, 0.18) 62% 66%, transparent 66%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.14) 0 12%, transparent 12% 100%),
        linear-gradient(125deg, var(--dcb-navy) 0 48%, var(--dcb-primary) 48% 100%);
}

.dcb-banner-upload {
    margin-top: 14px;
}

.dcb-banner-image,
.dcb-cover-pattern[style*="background-image"] {
    position: relative;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

.dcb-banner-image::after,
.dcb-cover-pattern[style*="background-image"]::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0.2));
    pointer-events: none;
}

.dcb-banner-soft {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.26)),
        linear-gradient(135deg, var(--dcb-primary), var(--dcb-navy));
}

.dcb-banner-solid {
    background: var(--dcb-navy);
}

.dcb-banner-mesh {
    background:
        radial-gradient(circle at 12% 28%, rgba(255, 255, 255, 0.24), transparent 22%),
        radial-gradient(circle at 78% 20%, rgba(255, 255, 255, 0.18), transparent 20%),
        radial-gradient(circle at 54% 84%, rgba(255, 255, 255, 0.2), transparent 24%),
        linear-gradient(135deg, var(--dcb-primary), var(--dcb-navy));
}

.dcb-banner-orbit {
    background:
        radial-gradient(circle at center, transparent 0 32px, rgba(255, 255, 255, 0.22) 33px 35px, transparent 36px),
        radial-gradient(circle at center, transparent 0 62px, rgba(255, 255, 255, 0.14) 63px 65px, transparent 66px),
        linear-gradient(135deg, var(--dcb-navy), var(--dcb-primary));
}

.dcb-banner-stripes {
    background:
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.16) 0 9px, transparent 9px 18px),
        linear-gradient(135deg, var(--dcb-navy), var(--dcb-primary));
}

.dcb-banner-dots {
    background:
        radial-gradient(rgba(255, 255, 255, 0.24) 1.5px, transparent 1.5px) 0 0 / 18px 18px,
        linear-gradient(135deg, var(--dcb-primary), var(--dcb-navy));
}

.dcb-banner-glass {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.38), rgba(255, 255, 255, 0.08)),
        linear-gradient(135deg, var(--dcb-navy), var(--dcb-primary));
}

.dcb-banner-corner {
    background:
        radial-gradient(circle at 100% 0%, rgba(255, 255, 255, 0.28), transparent 34%),
        linear-gradient(135deg, var(--dcb-navy) 0 58%, var(--dcb-primary) 58% 100%);
}

.dcb-profile {
    display: grid;
    justify-items: center;
    text-align: center;
}

.dcb-profile-light {
    position: relative;
    z-index: 4;
    margin: -74px 24px 0;
    padding: 0 20px 22px;
    border-bottom: 1px solid var(--dcb-line);
}

.dcb-profile img,
.dcb-avatar-fallback {
    width: 132px;
    height: 132px;
    border: 5px solid #fff;
    border-radius: 50%;
    object-fit: cover;
    background: #e0f2fe;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.18);
}

.dcb-avatar-fallback {
    display: grid;
    place-items: center;
    font-size: 56px;
    font-weight: 600;
    color: var(--dcb-primary);
}

.dcb-profile h1 {
    margin: 16px 0 5px;
    font-size: 32px;
    font-weight: 600;
    line-height: 1.1;
    color: var(--dcb-ink);
}

.dcb-profile p,
.dcb-profile strong {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    color: var(--dcb-muted);
}

.dcb-profile strong {
    margin-top: 4px;
    font-weight: 600;
    color: var(--dcb-primary-dark);
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.dcb-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
    gap: 10px;
    padding: 22px 24px 4px;
}

.dcb-actions a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    place-items: center;
    min-height: 48px;
    border: 1px solid var(--dcb-line);
    border-radius: 8px;
    background: var(--dcb-soft);
    color: var(--dcb-primary-dark);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
}

.dcb-actions i {
    font-size: 15px;
}

.dcb-actions a:hover,
.dcb-wallet-row a:hover,
.dcb-socials a:hover {
    border-color: var(--dcb-primary);
    background: #ecfdf5;
}

.dcb-panel {
    margin: 16px 24px;
    padding: 22px;
    border: 1px solid var(--dcb-line);
    border-radius: 8px;
    background: var(--dcb-surface);
}

.dcb-panel h2,
.dcb-panel h3,
.dcb-panel p,
.dcb-extra-panel dl,
.dcb-extra-panel dd {
    margin: 0;
}

.dcb-qr-panel {
    display: grid;
    grid-template-columns: 1fr 138px;
    align-items: center;
    gap: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fafc);
}

.dcb-qr-panel h2,
.dcb-about h2,
.dcb-cta h2 {
    margin-bottom: 8px;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.15;
    color: var(--dcb-ink);
}

.dcb-panel h2 i,
.dcb-panel h3 i,
.dcb-wallet-row i,
.dcb-small-button i,
.dcb-socials i,
.dcb-add-contact i,
.dcb-floating-left i {
    margin-right: 7px;
}

.dcb-qr-panel p,
.dcb-about p,
.dcb-panel p {
    color: var(--dcb-muted);
    font-size: 15px;
    line-height: 1.45;
}

.dcb-main-qr {
    width: 132px;
    height: 132px;
    border: 1px solid var(--dcb-line);
    border-radius: 8px;
    padding: 8px;
    background: #fff;
}

.dcb-wallet-row {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    margin-top: 15px;
}

.dcb-wallet-row a {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid var(--dcb-line);
    border-radius: 8px;
    background: #fff;
    color: var(--dcb-primary-dark);
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
}

.dcb-about {
    background: #fbfdff;
}

.dcb-panel-title {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--dcb-line);
    margin-bottom: 18px;
}

.dcb-panel-title span {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    overflow: hidden;
    border-radius: 8px;
    background: var(--dcb-navy);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
}

.dcb-panel-title span i {
    font-size: 17px;
}

.dcb-panel-title h2 {
    font-size: 20px;
    font-weight: 600;
}

.dcb-panel h3 {
    margin-top: 14px;
    font-size: 15px;
    font-weight: 600;
    color: var(--dcb-ink);
}

.dcb-extra-panel h2 {
    margin: 0 0 16px;
    font-size: 22px;
    font-weight: 600;
}

.dcb-extra-panel dl {
    display: grid;
    gap: 12px;
}

.dcb-extra-panel dl div {
    display: grid;
    gap: 4px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--dcb-line);
}

.dcb-extra-panel dl div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.dcb-extra-panel dt {
    font-size: 13px;
    font-weight: 600;
    color: var(--dcb-ink);
}

.dcb-extra-panel dd {
    color: var(--dcb-muted);
    font-size: 15px;
    line-height: 1.45;
}

.dcb-small-button {
    display: inline-flex;
    margin-top: 14px;
    border-radius: 8px;
    padding: 10px 16px;
    background: var(--dcb-primary);
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
}

.dcb-socials {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    margin: 16px 24px;
}

.dcb-socials a {
    border: 1px solid var(--dcb-line);
    border-radius: 8px;
    padding: 9px 13px;
    background: var(--dcb-surface);
    color: var(--dcb-primary-dark);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
}

.dcb-cta {
    margin-bottom: 24px;
    text-align: center;
    background: var(--dcb-navy);
}

.dcb-cta h2 {
    color: #fff;
}

.dcb-cta a {
    display: block;
    margin-top: 20px;
    border-radius: 8px;
    padding: 13px 18px;
    background: var(--dcb-primary);
    color: #fff;
    text-decoration: none;
    font-size: 18px;
    font-weight: 600;
}

.dcb-free-page-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: fit-content;
    max-width: calc(100% - 48px);
    margin: 22px auto 26px;
    border: 1px solid var(--dcb-line);
    border-radius: 999px;
    padding: 12px 18px;
    background: #fff;
    color: var(--dcb-primary-dark);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.dcb-free-page-button:hover {
    border-color: var(--dcb-primary);
    background: var(--dcb-primary);
    color: #fff;
}

.dcb-close,
.dcb-menu,
.dcb-floating-left a,
.dcb-floating-left button,
.dcb-add-contact {
    position: fixed;
    z-index: 30;
}

.dcb-close {
    top: 14px;
    left: 14px;
    width: 40px;
    height: 40px;
    border: 1px solid var(--dcb-line);
    border-radius: 8px;
    background: #fff;
    color: var(--dcb-ink);
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
}

.dcb-close i {
    pointer-events: none;
}

.dcb-menu {
    top: 14px;
    right: 14px;
    display: grid;
    gap: 4px;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 8px;
    place-content: center;
    background: var(--dcb-navy);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
}

.dcb-menu span {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 4px;
    background: #fff;
}

.dcb-floating-left {
    position: fixed;
    bottom: 16px;
    left: 16px;
    z-index: 30;
    display: flex;
    gap: 10px;
}

.dcb-floating-left a,
.dcb-floating-left button {
    position: static;
    display: grid;
    place-items: center;
    min-width: 52px;
    height: 44px;
    border: 1px solid var(--dcb-line);
    border-radius: 8px;
    padding: 0 12px;
    background: #fff;
    color: var(--dcb-primary-dark);
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
}

.dcb-add-contact {
    right: 16px;
    bottom: 16px;
    border-radius: 8px;
    padding: 14px 18px;
    background: var(--dcb-primary);
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.14);
}

.dcb-is-copied {
    background: #ecfdf5 !important;
    color: var(--dcb-primary-dark) !important;
}

.dcb-qr-body {
    background: #fff;
}

.dcb-share-body {
    background: #fff;
}

.dcb-qr-page {
    min-height: 100vh;
    padding: 44px 16px 80px;
    box-sizing: border-box;
}

.dcb-qr-stage {
    display: grid;
    justify-items: center;
    gap: 18px;
    width: min(520px, 100%);
    margin: 0 auto;
    text-align: center;
}

.dcb-qr-stage .dcb-profile img,
.dcb-qr-stage .dcb-avatar-fallback {
    width: 128px;
    height: 128px;
}

.dcb-qr-large {
    width: min(260px, 74vw);
    height: auto;
    margin-top: 22px;
    border: 5px solid #2f3542;
    border-radius: 50%;
    padding: 7px;
    background: #fff;
}

.dcb-qr-copy {
    margin: 12px 0 0;
    color: #111827;
    font-size: 15px;
    line-height: 1.4;
}

.dcb-qr-wallets {
    justify-content: center;
    margin-top: 4px;
}

.dcb-qr-wallets a {
    min-height: 40px;
    border-color: #000;
    border-radius: 999px;
    background: #000;
    color: #fff;
}

.dcb-qr-tools {
    display: grid;
    gap: 10px;
    width: min(100%, 460px);
    margin-top: 8px;
}

.dcb-qr-tools a,
.dcb-qr-tools button {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 56px;
    box-sizing: border-box;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0 16px;
    background: #fff;
    color: #0f172a;
    text-decoration: none;
    font: inherit;
    font-weight: 500;
    cursor: pointer;
}

.dcb-qr-tools a:first-child {
    border-color: var(--dcb-navy);
    background: var(--dcb-navy);
    color: #fff;
}

.dcb-qr-tools i {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(15, 118, 110, 0.1);
    color: var(--dcb-primary);
}

.dcb-qr-tools a:first-child i {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

.dcb-qr-list {
    display: grid;
    width: min(100%, 460px);
    margin-top: 2px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
}

.dcb-qr-list div,
.dcb-qr-list a,
.dcb-qr-list button {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    min-height: 60px;
    box-sizing: border-box;
    border: 0;
    padding: 0 18px;
    border-bottom: 1px solid #e2e8f0;
    background: #fff;
    color: #0f172a;
    text-decoration: none;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.dcb-qr-list div:last-child,
.dcb-qr-list a:last-child,
.dcb-qr-list button:last-child {
    border-bottom: 0;
}

.dcb-qr-list i {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #f8fafc;
    color: var(--dcb-primary);
}

.dcb-qr-list a:hover,
.dcb-qr-list button:hover {
    background: #f8fafc;
}

.dcb-home-help {
    width: min(100%, 460px);
    box-sizing: border-box;
    border: 1px solid #dbeafe;
    border-radius: 8px;
    padding: 14px 16px;
    background: #eff6ff;
    text-align: left;
}

.dcb-home-help strong,
.dcb-home-help p {
    margin: 0;
}

.dcb-home-help strong {
    display: block;
    color: #0f172a;
    font-size: 14px;
}

.dcb-home-help p {
    margin-top: 6px;
    color: #475569;
    font-size: 13px;
    line-height: 1.45;
}

.dcb-share-stage {
    gap: 16px;
}

.dcb-share-card {
    display: grid;
    justify-items: center;
    gap: 10px;
    width: min(100%, 460px);
    margin-top: 18px;
    box-sizing: border-box;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 24px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
}

.dcb-share-card > i {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: var(--dcb-navy);
    color: #fff;
    font-size: 22px;
}

.dcb-share-card h1 {
    margin: 4px 0 0;
    font-size: 24px;
    font-weight: 600;
    color: #0f172a;
}

.dcb-share-card p {
    margin: 0;
    color: #64748b;
    font-size: 15px;
}

.dcb-share-url {
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px;
    background: #f8fafc;
    color: #334155;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}

.dcb-share-tools button:first-child {
    border-color: var(--dcb-navy);
    background: var(--dcb-navy);
    color: #fff;
}

.dcb-share-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: min(100%, 460px);
}

.dcb-share-grid a {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    box-sizing: border-box;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0 16px;
    background: #fff;
    color: #0f172a;
    text-decoration: none;
    font-weight: 500;
}

.dcb-share-grid i {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(15, 118, 110, 0.1);
    color: var(--dcb-primary);
}

/* Contrast-safe interaction layer */
.dcb-submit,
.dcb-success a,
.dcb-small-button,
.dcb-cta a,
.dcb-add-contact,
.dcb-share-tools button:first-child,
.dcb-qr-tools a:first-child {
    border-color: var(--dcb-primary);
    background: var(--dcb-primary);
    color: #fff;
}

.dcb-submit:hover,
.dcb-success a:hover,
.dcb-small-button:hover,
.dcb-cta a:hover,
.dcb-add-contact:hover,
.dcb-share-tools button:first-child:hover,
.dcb-qr-tools a:first-child:hover {
    border-color: var(--dcb-navy);
    background: var(--dcb-navy);
    color: #fff;
}

.dcb-actions a,
.dcb-wallet-row a,
.dcb-socials a,
.dcb-floating-left a,
.dcb-floating-left button,
.dcb-qr-tools a,
.dcb-qr-tools button,
.dcb-qr-list a,
.dcb-qr-list button,
.dcb-share-grid a,
.dcb-share-tools button {
    background: #fff;
    color: #0f172a;
}

.dcb-actions a i,
.dcb-wallet-row a i,
.dcb-socials a i,
.dcb-floating-left a i,
.dcb-floating-left button i,
.dcb-qr-tools a i,
.dcb-qr-tools button i,
.dcb-qr-list a i,
.dcb-qr-list button i,
.dcb-share-grid a i,
.dcb-share-tools button i {
    color: var(--dcb-primary);
}

.dcb-actions a:hover,
.dcb-wallet-row a:hover,
.dcb-socials a:hover,
.dcb-floating-left a:hover,
.dcb-floating-left button:hover,
.dcb-qr-tools a:hover,
.dcb-qr-tools button:hover,
.dcb-qr-list a:hover,
.dcb-qr-list button:hover,
.dcb-share-grid a:hover,
.dcb-share-tools button:hover {
    border-color: var(--dcb-primary);
    background: var(--dcb-primary);
    color: #fff;
}

.dcb-actions a:hover i,
.dcb-wallet-row a:hover i,
.dcb-socials a:hover i,
.dcb-floating-left a:hover i,
.dcb-floating-left button:hover i,
.dcb-qr-tools a:hover i,
.dcb-qr-tools button:hover i,
.dcb-qr-list a:hover i,
.dcb-qr-list button:hover i,
.dcb-share-grid a:hover i,
.dcb-share-tools button:hover i {
    color: #fff;
}

.dcb-template-executive .dcb-actions a,
.dcb-template-executive .dcb-wallet-row a,
.dcb-template-executive .dcb-socials a,
.dcb-template-premium .dcb-actions a,
.dcb-template-premium .dcb-wallet-row a,
.dcb-template-premium .dcb-socials a {
    background: #111827;
    color: #f8fafc;
}

.dcb-template-executive .dcb-actions a:hover,
.dcb-template-executive .dcb-wallet-row a:hover,
.dcb-template-executive .dcb-socials a:hover,
.dcb-template-premium .dcb-actions a:hover,
.dcb-template-premium .dcb-wallet-row a:hover,
.dcb-template-premium .dcb-socials a:hover {
    background: var(--dcb-primary);
    color: #fff;
}

.dcb-subscription-notice {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0;
    padding: 10px 14px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}

.dcb-subscription-notice a {
    display: inline-flex;
    border-radius: 999px;
    padding: 5px 10px;
    background: #fff;
    color: #1d4ed8;
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
}

.dcb-subscription-notice a:hover {
    background: #dbeafe;
    color: #1e3a8a;
}

.dcb-subscription-paid {
    background: #ecfdf5;
    color: #15803d;
}

.dcb-payment-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 28px;
    background: linear-gradient(135deg, var(--dcb-navy), var(--dcb-primary));
}

.dcb-payment-card {
    width: min(440px, 100%);
    padding: 30px;
    border-radius: 12px;
    background: #fff;
    color: #0f172a;
    text-align: center;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.24);
}

.dcb-payment-card .dcb-profile {
    margin-bottom: 18px;
}

.dcb-payment-lock {
    display: inline-flex;
    width: 58px;
    height: 58px;
    align-items: center;
    justify-content: center;
    margin: 4px auto 14px;
    border-radius: 999px;
    background: #ecfdf5;
    color: var(--dcb-primary);
    font-size: 24px;
}

.dcb-payment-card h1 {
    margin: 0 0 10px;
    font-size: 28px;
    line-height: 1.1;
}

.dcb-payment-card p {
    margin: 0;
    color: #64748b;
    line-height: 1.5;
}

.dcb-payment-plan {
    display: grid;
    gap: 5px;
    margin: 22px 0;
    padding: 16px;
    border: 1px solid #dbe4f0;
    border-radius: 10px;
    background: #f8fafc;
}

.dcb-payment-plan strong {
    color: #0f172a;
    font-size: 16px;
}

.dcb-payment-plan span {
    color: #64748b;
    font-size: 13px;
}

.dcb-payment-button,
.dcb-payment-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    border-radius: 8px;
    padding: 13px 16px;
    text-decoration: none;
    font-weight: 800;
}

.dcb-payment-button {
    background: var(--dcb-primary);
    color: #fff;
}

.dcb-payment-button:hover {
    background: var(--dcb-navy);
    color: #fff;
}

.dcb-payment-back {
    margin-top: 10px;
    background: #f1f5f9;
    color: #0f172a;
}

.dcb-payment-back:hover {
    background: #e2e8f0;
    color: #0f172a;
}

.dcb-payment-warning {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-top: 18px;
    padding: 12px;
    border-radius: 8px;
    background: #fff7ed;
    color: #9a3412;
    font-size: 13px;
    font-weight: 700;
    text-align: left;
}

.dcb-subscription-wrap {
    max-width: 860px;
    margin: 36px auto;
    padding: 24px;
    font-family: var(--dcb-font);
    color: #0f172a;
}

.dcb-subscription-hero,
.dcb-subscription-lookup,
.dcb-subscription-card,
.dcb-subscription-message {
    border: 1px solid #dbe4f0;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
}

.dcb-subscription-hero {
    padding: 28px;
    background: linear-gradient(135deg, var(--dcb-navy), var(--dcb-primary));
    color: #fff;
}

.dcb-subscription-hero span {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 12px;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.dcb-subscription-hero h1 {
    margin: 0 0 10px;
    font-size: 34px;
    line-height: 1.1;
}

.dcb-subscription-hero p {
    max-width: 560px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.5;
}

.dcb-subscription-lookup {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
    align-items: end;
    margin-top: 18px;
    padding: 18px;
}

.dcb-subscription-pricing {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 16px;
    margin-top: 18px;
}

.dcb-subscription-price-card,
.dcb-subscription-help-card {
    display: grid;
    gap: 12px;
    align-content: start;
    padding: 22px;
    border: 1px solid #dbe4f0;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
}

.dcb-subscription-help-card {
    background: #f8fafc;
}

.dcb-subscription-help-card h3 {
    margin: 0;
    font-size: 22px;
}

.dcb-subscription-help-card p {
    margin: 0;
    color: #64748b;
    line-height: 1.5;
}

.dcb-subscription-card {
    display: grid;
    gap: 18px;
    margin-top: 18px;
    padding: 24px;
}

.dcb-subscription-card .dcb-profile {
    padding: 0;
}

.dcb-subscription-card dl {
    display: grid;
    gap: 10px;
    margin: 0;
}

.dcb-subscription-card dl div {
    display: grid;
    gap: 4px;
    padding: 12px;
    border-radius: 8px;
    background: #f8fafc;
}

.dcb-subscription-card dt {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.dcb-subscription-card dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.dcb-subscription-card dd a {
    color: var(--dcb-primary);
}

.dcb-subscription-badge {
    justify-self: center;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    border-radius: 999px;
    padding: 8px 12px;
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 800;
}

.dcb-subscription-badge-active,
.dcb-subscription-ok {
    background: #ecfdf5;
    color: #15803d;
}

.dcb-subscription-badge-expired,
.dcb-subscription-error {
    background: #fef2f2;
    color: #b91c1c;
}

.dcb-subscription-message {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 18px;
    padding: 14px 16px;
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 700;
}

@media (max-width: 680px) {
    .dcb-form-grid {
        grid-template-columns: 1fr;
    }

    .dcb-studio-head,
    .dcb-studio-layout,
    .dcb-subscription-lookup,
    .dcb-product-hero,
    .dcb-product-grid,
    .dcb-subscription-pricing {
        grid-template-columns: 1fr;
    }

    .dcb-product-page,
    .dcb-subscription-wrap {
        padding: 14px;
    }

    .dcb-product-hero {
        padding: 22px;
    }

    .dcb-product-hero h1,
    .dcb-subscription-hero h1 {
        font-size: 30px;
    }

    .dcb-preview-pane {
        position: static;
        order: -1;
    }

    .dcb-preview-device {
        width: min(250px, 100%);
    }

    .dcb-swatch-grid,
    .dcb-banner-swatches,
    .dcb-color-swatches,
    .dcb-custom-colors {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dcb-extra-row {
        grid-template-columns: 1fr;
    }

    .dcb-span-2 {
        grid-column: auto;
    }

    .dcb-page-shell {
        padding: 0 0 92px;
    }

    .dcb-phone-card {
        width: 100%;
        border-width: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .dcb-profile h1 {
        font-size: 28px;
    }

    .dcb-actions {
        padding-inline: 16px;
    }

    .dcb-panel,
    .dcb-socials {
        margin-inline: 16px;
    }

    .dcb-qr-panel {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .dcb-wallet-row {
        justify-content: center;
    }

    .dcb-add-contact {
        max-width: 150px;
        text-align: center;
    }

    .dcb-template-business .dcb-profile-light,
    .dcb-template-corporate .dcb-profile-light,
    .dcb-template-professional .dcb-profile-light {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .dcb-template-business .dcb-profile-light img,
    .dcb-template-business .dcb-profile-light .dcb-avatar-fallback,
    .dcb-template-corporate .dcb-profile-light img,
    .dcb-template-corporate .dcb-profile-light .dcb-avatar-fallback,
    .dcb-template-professional .dcb-profile-light img,
    .dcb-template-professional .dcb-profile-light .dcb-avatar-fallback {
        grid-row: auto;
    }
}

/* Brand palette override: Poppins + #000 / #fff / #F8F8F8 / #DE223D */
.dcb-builder-wrap,
.dcb-product-page,
.dcb-subscription-wrap,
.dcb-public-body,
.dcb-page-shell,
.dcb-qr-page,
.dcb-payment-page,
.dcb-builder-form,
.dcb-builder-wrap *,
.dcb-product-page *,
.dcb-subscription-wrap *,
.dcb-public-body * {
    font-family: var(--dcb-font);
}

.dcb-builder-wrap,
.dcb-product-page,
.dcb-subscription-wrap,
.dcb-public-body,
.dcb-page-shell,
.dcb-qr-page {
    background: #F8F8F8;
    color: #000;
}

.dcb-builder-form,
.dcb-studio-form,
.dcb-studio-head,
.dcb-studio-panel,
.dcb-preview-device,
.dcb-preview-card,
.dcb-pricing-card,
.dcb-product-grid article,
.dcb-subscription-hero,
.dcb-subscription-lookup,
.dcb-subscription-card,
.dcb-subscription-price-card,
.dcb-subscription-help-card,
.dcb-payment-card,
.dcb-phone-card,
.dcb-panel,
.dcb-qr-stage,
.dcb-share-card,
.dcb-share-grid a,
.dcb-qr-list a,
.dcb-qr-list button,
.dcb-qr-tools a,
.dcb-qr-tools button,
.dcb-wallet-row a,
.dcb-socials,
.dcb-socials a,
.dcb-actions a {
    border-color: rgba(0, 0, 0, 0.14);
    background-color: #fff;
    color: #000;
}
.dcb-page-btn{margin-top: 0px; margin-bottom: 38px;}
.dcb-product-hero,
.dcb-subscription-hero,
.dcb-payment-page {
    background: #000;
    color: #fff;
}

.dcb-product-hero p,
.dcb-subscription-hero p,
.dcb-template-premium .dcb-panel p,
.dcb-template-executive .dcb-panel p {
    color: rgba(255, 255, 255, 0.78);
}

.dcb-submit,
.dcb-success a,
.dcb-product-primary,
.dcb-pricing-card a,
.dcb-subscription-help-card a,
.dcb-payment-button,
.dcb-small-button,
.dcb-cta a,
.dcb-add-contact,
.dcb-share-tools button:first-child,
.dcb-qr-tools a:first-child,
.dcb-free-page-button {
    border-color: #DE223D;
    background: #DE223D;
    color: #fff;
}

.dcb-submit:hover,
.dcb-success a:hover,
.dcb-product-primary:hover,
.dcb-pricing-card a:hover,
.dcb-subscription-help-card a:hover,
.dcb-payment-button:hover,
.dcb-small-button:hover,
.dcb-cta a:hover,
.dcb-add-contact:hover,
.dcb-share-tools button:first-child:hover,
.dcb-qr-tools a:first-child:hover,
.dcb-free-page-button:hover {
    border-color: #000;
    background: #000;
    color: #fff;
}

.dcb-product-secondary,
.dcb-payment-back,
.dcb-floating-left a,
.dcb-floating-left button,
.dcb-share-tools button,
.dcb-qr-tools button,
.dcb-qr-tools a,
.dcb-wallet-row a,
.dcb-actions a,
.dcb-socials a {
    border-color: rgba(0, 0, 0, 0.18);
    background: #fff;
    color: #000;
}

.dcb-product-secondary {
    background: transparent;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.7);
}

.dcb-product-secondary:hover,
.dcb-floating-left a:hover,
.dcb-floating-left button:hover,
.dcb-share-tools button:hover,
.dcb-qr-tools button:hover,
.dcb-qr-tools a:hover,
.dcb-wallet-row a:hover,
.dcb-actions a:hover,
.dcb-socials a:hover {
    border-color: #DE223D;
    background: #DE223D;
    color: #fff;
}

.dcb-actions a i,
.dcb-wallet-row a i,
.dcb-socials a i,
.dcb-floating-left a i,
.dcb-floating-left button i,
.dcb-qr-tools a i,
.dcb-qr-tools button i,
.dcb-qr-list a i,
.dcb-qr-list button i,
.dcb-share-grid a i,
.dcb-share-tools button i,
.dcb-product-grid i,
.dcb-pricing-card span,
.dcb-subscription-price-card span,
.dcb-payment-lock,
.dcb-panel h2 i,
.dcb-panel h3 i,
.dcb-panel-title span i {
    color: #DE223D;
}

.dcb-product-secondary:hover i,
.dcb-floating-left a:hover i,
.dcb-floating-left button:hover i,
.dcb-share-tools button:hover i,
.dcb-qr-tools button:hover i,
.dcb-qr-tools a:hover i,
.dcb-wallet-row a:hover i,
.dcb-actions a:hover i,
.dcb-socials a:hover i {
    color: #fff;
}

.dcb-field input,
.dcb-field textarea,
.dcb-field select,
.dcb-slug-control input,
.dcb-extra-row input,
.dcb-custom-colors input,
.dcb-color-swatch-field input {
    border-color: rgba(0, 0, 0, 0.18);
    background: #F8F8F8;
    color: #000;
}

.dcb-field input:focus,
.dcb-field textarea:focus,
.dcb-field select:focus,
.dcb-slug-control input:focus {
    border-color: #DE223D;
    box-shadow: 0 0 0 3px rgba(222, 34, 61, 0.16);
}

.dcb-choice input:checked + .dcb-choice-card,
.dcb-choice-card:hover {
    border-color: #DE223D;
    box-shadow: 0 0 0 2px rgba(222, 34, 61, 0.16);
}

.dcb-choice-label,
.dcb-panel-header h3,
.dcb-profile h1,
.dcb-profile strong,
.dcb-panel h2,
.dcb-panel h3,
.dcb-subscription-card dt,
.dcb-payment-card h1,
.dcb-product-grid h3 {
    color: #000;
}

.dcb-panel-header p,
.dcb-profile p,
.dcb-panel p,
.dcb-subscription-card dd,
.dcb-payment-card p,
.dcb-product-grid p,
.dcb-pricing-card p,
.dcb-subscription-price-card p,
.dcb-subscription-help-card p {
    color: rgba(0, 0, 0, 0.66);
}

.dcb-success,
.dcb-free-builder-note,
.dcb-paid-builder-note,
.dcb-subscription-message,
.dcb-subscription-notice,
.dcb-payment-plan,
.dcb-payment-warning,
.dcb-lock-overlay {
    border-color: rgba(222, 34, 61, 0.24);
    background: #F8F8F8;
    color: #000;
}

.dcb-subscription-paid,
.dcb-subscription-ok {
    background: #fff;
    color: #000;
}

.dcb-subscription-badge,
.dcb-subscription-badge-active,
.dcb-subscription-badge-expired {
    background: #000;
    color: #fff;
}

.dcb-banner-swatches .dcb-choice-preview,
.dcb-shape-swatches .dcb-choice-preview,
.dcb-color-swatches .dcb-choice-preview {
    padding: 0;
    overflow: hidden;
}

.dcb-banner-swatches .dcb-choice-card,
.dcb-shape-swatches .dcb-choice-card,
.dcb-color-swatches .dcb-choice-card {
    background: #fff;
}

.dcb-banner-swatches .dcb-choice-preview,
.dcb-shape-swatches .dcb-choice-preview,
.dcb-color-swatches .dcb-choice-preview {
    background: initial;
}

.dcb-builder-wrap i[class^="fa-"],
.dcb-builder-wrap i[class*=" fa-"],
.dcb-product-page i[class^="fa-"],
.dcb-product-page i[class*=" fa-"],
.dcb-subscription-wrap i[class^="fa-"],
.dcb-subscription-wrap i[class*=" fa-"],
.dcb-public-body i[class^="fa-"],
.dcb-public-body i[class*=" fa-"],
.dcb-payment-page i[class^="fa-"],
.dcb-payment-page i[class*=" fa-"],
.dcb-qr-page i[class^="fa-"],
.dcb-qr-page i[class*=" fa-"] {
    font-family: "Font Awesome 6 Free";
    font-style: normal;
    font-weight: 900;
}

.dcb-builder-wrap i[class^="fa-brands"],
.dcb-builder-wrap i[class*=" fa-brands"],
.dcb-product-page i[class^="fa-brands"],
.dcb-product-page i[class*=" fa-brands"],
.dcb-subscription-wrap i[class^="fa-brands"],
.dcb-subscription-wrap i[class*=" fa-brands"],
.dcb-public-body i[class^="fa-brands"],
.dcb-public-body i[class*=" fa-brands"],
.dcb-payment-page i[class^="fa-brands"],
.dcb-payment-page i[class*=" fa-brands"],
.dcb-qr-page i[class^="fa-brands"],
.dcb-qr-page i[class*=" fa-brands"] {
    font-family: "Font Awesome 6 Brands";
    font-weight: 400;
}

/* Typography polish: reduce unnecessary heavy text */
.dcb-builder-wrap,
.dcb-product-page,
.dcb-subscription-wrap,
.dcb-public-body {
    font-weight: 400;
}

.dcb-builder-wrap strong,
.dcb-product-page strong,
.dcb-subscription-wrap strong,
.dcb-public-body strong,
.dcb-panel h2,
.dcb-panel h3,
.dcb-panel-header h3,
.dcb-profile h1,
.dcb-product-hero h1,
.dcb-subscription-hero h1,
.dcb-payment-card h1,
.dcb-pricing-card h2,
.dcb-subscription-price-card h2 {
    font-weight: 600;
}

.dcb-submit,
.dcb-success a,
.dcb-product-actions a,
.dcb-pricing-card a,
.dcb-payment-button,
.dcb-payment-back,
.dcb-small-button,
.dcb-add-contact,
.dcb-actions a,
.dcb-socials a,
.dcb-wallet-row a,
.dcb-qr-tools a,
.dcb-qr-tools button,
.dcb-share-tools button,
.dcb-free-page-button,
.dcb-field span,
.dcb-choice-label,
.dcb-swatch-heading,
.dcb-subscription-badge,
.dcb-admin-badge {
    font-weight: 500;
}

.dcb-product-kicker,
.dcb-pricing-card span,
.dcb-subscription-price-card span,
.dcb-subscription-card dt {
    font-weight: 600;
}


/* Version 1.1.0: DOCX landing page. Scope all additions to the plugin. */
.dcb-landing-v110 { color: #232323; line-height: 1.7; }
.dcb-landing-v110 *, .dcb-landing-v110 *::before, .dcb-landing-v110 *::after { box-sizing: border-box; }
.dcb-landing-v110 .dcb-product-hero { padding: clamp(24px, 4vw, 48px); gap: 32px; }
.dcb-landing-v110 .dcb-product-hero h1 { font-size: clamp(28px, 3.6vw, 44px); line-height: 1.17; letter-spacing: -.025em; }
.dcb-landing-v110 .dcb-product-hero > div > p { font-size: 16px; line-height: 1.75; }
.dcb-landing-v110 .dcb-pricing-card p { color: #555; }
.dcb-landing-v110 .dcb-pricing-card h2 { font-size: 30px; }
.dcb-landing-v110 .dcb-product-grid h2 { margin: 10px 0 7px; font-size: 20px; line-height: 1.3; }
.dcb-landing-v110 .dcb-product-grid article { min-width: 0; }
.dcb-landing-v110 .dcb-landing-section { margin: 0; padding: 44px 0; border-bottom: 1px solid #e7e7e7; }
.dcb-landing-v110 .dcb-landing-section > h2 { max-width: 890px; margin: 0 0 20px; color: #111; font-size: clamp(25px, 2.7vw, 32px); line-height: 1.28; letter-spacing: -.018em; }
.dcb-landing-v110 .dcb-landing-section > p { max-width: 960px; margin: 0 0 16px; font-size: 16px; color: #454545; line-height: 1.85; }
.dcb-landing-v110 .dcb-landing-section > :last-child { margin-bottom: 0; }
.dcb-landing-v110 .dcb-landing-tint { margin: 18px 0; padding: 36px; background: #f8f8f8; border: 1px solid #e8e8e8; border-radius: 12px; }
.dcb-landing-v110 .dcb-copy-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin: 22px 0 0; padding: 0; list-style: none; }
.dcb-landing-v110 .dcb-copy-grid li { margin: 0; padding: 22px; border: 1px solid #e5e5e5; border-radius: 10px; background: #fff; color: #454545; line-height: 1.75; }
.dcb-landing-v110 .dcb-copy-grid strong { display: block; margin-bottom: 6px; color: #111; font-size: 17px; }
.dcb-landing-v110 .dcb-copy-grid-three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.dcb-landing-v110 .dcb-section-note { margin-top: 20px; font-weight: 600; }
.dcb-landing-v110 .dcb-audience-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.dcb-landing-v110 .dcb-audience-list li { margin: 0; padding: 16px 22px; border-left: 3px solid #de223d; background: #fafafa; }
.dcb-landing-v110 .dcb-steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.dcb-landing-v110 .dcb-steps li { margin: 0; border-top: 3px solid #de223d; padding: 20px 0 0; }
.dcb-landing-v110 .dcb-steps h3 { font-size: 18px; color: #111; margin: 0 0 12px; line-height: 1.5; }
.dcb-landing-v110 .dcb-steps p { font-size: 15px; line-height: 1.8; margin: 0; }
.dcb-landing-v110 .dcb-paper-checklist { margin: 0; padding: 0; list-style: none; display: grid; gap: 16px; }
.dcb-landing-v110 .dcb-paper-checklist li { position: relative; margin: 0; padding-left: 34px; }
.dcb-landing-v110 .dcb-paper-checklist li::before { content: "\2713"; position: absolute; left: 0; top: 2px; width: 23px; height: 23px; border-radius: 50%; background: #fcebed; color: #ac1429; text-align: center; font-size: 15px; line-height: 23px; }
.dcb-landing-v110 .dcb-template-gallery { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); align-items: start; gap: 18px; margin: 30px 0 24px; }
.dcb-landing-v110 .dcb-template-demo { margin: 0; min-width: 0; }
.dcb-landing-v110 .dcb-template-demo .dcb-phone-card { width: 100%; margin: 0; padding: 0 0 18px; overflow: hidden; box-shadow: 0 12px 28px rgba(0,0,0,.08); }
.dcb-landing-v110 .dcb-template-demo .dcb-cover-pattern { height: 114px; }
.dcb-landing-v110 .dcb-template-demo .dcb-profile-light { margin: -40px 12px 0; padding: 0 0 15px; }
.dcb-landing-v110 .dcb-template-demo .dcb-avatar-fallback { width: 74px; height: 74px; font-size: 23px; border-width: 4px; }
.dcb-landing-v110 .dcb-template-demo .dcb-demo-name { color: var(--dcb-ink); margin: 12px 0 3px; font-size: 20px; line-height: 1.2; font-weight: 600; }
.dcb-landing-v110 .dcb-template-demo .dcb-profile p, .dcb-landing-v110 .dcb-template-demo .dcb-profile strong { font-size: 12px; }
.dcb-landing-v110 .dcb-demo-actions { display: flex; justify-content: center; gap: 6px; padding: 12px 10px 0; }
.dcb-landing-v110 .dcb-demo-actions span { padding: 5px 8px; font-size: 10px; border: 1px solid var(--dcb-line); border-radius: 5px; color: var(--dcb-ink); }
.dcb-landing-v110 .dcb-template-demo .dcb-demo-panel { margin: 12px; padding: 12px; min-width: 0; }
.dcb-landing-v110 .dcb-template-demo .dcb-demo-panel p { margin: 3px 0 0; font-size: 10px; color: var(--dcb-muted); overflow-wrap: anywhere; }
.dcb-landing-v110 .dcb-demo-eyebrow { font-size: 9px; font-weight: 600; letter-spacing: .1em; color: var(--dcb-muted); }
.dcb-landing-v110 .dcb-demo-save { margin: 0 12px; padding: 8px; text-align: center; background: var(--dcb-primary); border-radius: 5px; color: #fff; font-size: 11px; font-weight: 600; }
.dcb-landing-v110 .dcb-template-premium .dcb-demo-save { color: #111827; }
.dcb-landing-v110 .dcb-template-demo figcaption { margin-top: 14px; color: #111; font-size: 15px; font-weight: 600; text-align: center; }
.dcb-landing-v110 .dcb-template-demo figcaption span { display: block; font-size: 11px; font-weight: 400; color: #666; }
.dcb-landing-v110 .dcb-pricing-scroll { overflow-x: auto; border: 1px solid #e0e0e0; border-radius: 10px; }
.dcb-landing-v110 .dcb-comparison-table { width: 100%; margin: 0; border: 0; border-collapse: collapse; table-layout: fixed; }
.dcb-landing-v110 .dcb-comparison-table th, .dcb-landing-v110 .dcb-comparison-table td { padding: 15px 20px; font-size: 14px; line-height: 1.65; border: 0; border-bottom: 1px solid #e7e7e7; vertical-align: middle; overflow-wrap: anywhere; }
.dcb-landing-v110 .dcb-comparison-table thead th { background: #111; color: #fff; font-size: 15px; font-weight: 600; }
.dcb-landing-v110 .dcb-comparison-table thead th:first-child { width: 44%; text-align: left; }
.dcb-landing-v110 .dcb-comparison-table tbody th { text-align: left; font-weight: 400; background: #fff; color: #282828; }
.dcb-landing-v110 .dcb-comparison-table td { text-align: center; background: #fff; color: #222; }
.dcb-landing-v110 .dcb-comparison-table td:last-child { background: #fff8f9; }
.dcb-landing-v110 .dcb-comparison-table tr:last-child > * { border-bottom: 0; }
.dcb-landing-v110 .dcb-comparison-table td > span[aria-hidden] { font-size: 19px; }
.dcb-landing-v110 .dcb-pricing-actions { margin-top: 24px; text-align: center; }
.dcb-landing-v110 .dcb-pricing-actions a { display: inline-flex; padding: 14px 24px; border-radius: 6px; text-decoration: none; font-size: 14px; font-weight: 600; }
.dcb-landing-v110 .dcb-faq-section { border: 0; }
.dcb-landing-v110 .dcb-faq { padding: 0; margin: 0; border-bottom: 1px solid #e4e4e4; }
.dcb-landing-v110 .dcb-faq summary { position: relative; padding: 20px 42px 20px 0; cursor: pointer; font-size: 16px; line-height: 1.6; font-weight: 600; color: #171717; list-style: none; }
.dcb-landing-v110 .dcb-faq summary::-webkit-details-marker { display: none; }
.dcb-landing-v110 .dcb-faq summary::after { content: "+"; position: absolute; right: 8px; top: 16px; font-size: 26px; color: #b51b31; font-weight: 400; }
.dcb-landing-v110 .dcb-faq[open] summary::after { content: "\2212"; }
.dcb-landing-v110 .dcb-faq > div { padding: 0 36px 22px 0; }
.dcb-landing-v110 .dcb-faq p { margin: 0; font-size: 15px; line-height: 1.85; color: #444; }
.dcb-landing-v110 :where(a, summary, [tabindex]):focus-visible { outline: 3px solid #bb1730; outline-offset: 4px; }
.dcb-visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
/* Preserve selected Premium colors rather than overriding every banner with black. */
.dcb-template-executive .dcb-profile strong, .dcb-template-premium .dcb-profile strong { color: var(--dcb-primary); }
.dcb-profile h2 { margin: 16px 0 5px; font-size: 30px; line-height: 1.15; color: var(--dcb-ink); }
.dcb-public-body .dcb-cta a, .dcb-public-body .dcb-add-contact { background: var(--dcb-primary); border-color: var(--dcb-primary); }
.dcb-public-body .dcb-socials a i, .dcb-public-body .dcb-actions a i { color: var(--dcb-primary); }
/* Keep the QR quiet zone square and visible instead of clipping corners in a circle. */
.dcb-qr-large { border-radius: 8px; padding: 12px; background: #fff; box-sizing: content-box; max-width: calc(100% - 34px); }
@media (max-width: 1000px) {
    .dcb-landing-v110 .dcb-product-hero { grid-template-columns: minmax(0,1fr) 290px; padding: 28px; gap: 24px; }
    .dcb-landing-v110 .dcb-template-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
    .dcb-landing-v110 .dcb-template-demo .dcb-cover-pattern { height: 130px; }
    .dcb-landing-v110 .dcb-steps { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; }
}
@media (max-width: 760px) {
    .dcb-landing-v110 .dcb-product-hero { grid-template-columns: 1fr; }
    .dcb-landing-v110 .dcb-product-grid { grid-template-columns: 1fr; }
    .dcb-landing-v110 .dcb-copy-grid-three { grid-template-columns: 1fr; }
    .dcb-landing-v110 .dcb-landing-section { padding: 32px 0; }
    .dcb-landing-v110 .dcb-landing-tint { padding: 24px; }
    .dcb-landing-v110 .dcb-comparison-table th, .dcb-landing-v110 .dcb-comparison-table td { padding: 12px 10px; font-size: 12px; }
    .dcb-landing-v110 .dcb-comparison-table thead th { font-size: 12px; }
}
@media (max-width: 480px) {
    .dcb-landing-v110 .dcb-product-hero { padding: 24px 20px; }
    .dcb-landing-v110 .dcb-copy-grid, .dcb-landing-v110 .dcb-steps { grid-template-columns: 1fr; }
    .dcb-landing-v110 .dcb-template-gallery { grid-template-columns: 1fr; max-width: 320px; margin-left: auto; margin-right: auto; }
    .dcb-landing-v110 .dcb-template-demo .dcb-cover-pattern { height: 135px; }
    .dcb-landing-v110 .dcb-product-actions > a { width: 100%; justify-content: center; }
    .dcb-landing-v110 .dcb-landing-tint { padding: 22px 18px; }
    .dcb-landing-v110 .dcb-comparison-table thead th:first-child { width: 40%; }
}

.dcb-landing-v110 .dcb-template-premium .dcb-demo-name, .dcb-landing-v110 .dcb-template-premium .dcb-demo-actions span { color: #f8fafc; }
.dcb-landing-v110 .dcb-template-premium .dcb-demo-panel p, .dcb-landing-v110 .dcb-template-premium .dcb-demo-eyebrow { color: #cbd5e1; }

.dcb-template-executive .dcb-profile p, .dcb-template-premium .dcb-profile p { color: #cbd5e1; }