:root {
--nd-black:         #09070f;
--nd-white:         #fafaf8;
--nd-off-white:     #f2effe;
--nd-ink:           #1a1530;
--nd-muted:         #5a4f85;
--nd-accent:        #1a0f3d;
--nd-accent-mid:    #3d1f8c;
--nd-accent-bright: #6d28d9;
--nd-accent-glow:   #8b5cf6;
--nd-gold:          #c8a951;
--nd-gold-light:    #e8c878;
--nd-border:        rgba(26,21,48,0.12);
--nd-border-strong: rgba(26,21,48,0.22);
--nd-radius:        12px;
--nd-radius-lg:     20px;
}
.nd-hero, .nd-section, .nd-how-it-works,
.nd-tools-section, .nd-packages-section,
.nd-competitive-section, .nd-dashboard-section,
.nd-compliance-section, .nd-cta-section,
.nd-use-cases-section, .nd-call-demo-section,
.nd-onboarding-section, .nd-roi-section,
.nd-faq-section, .nd-footer, .nd-voice-demo-section, .nd-hero * {
box-sizing: border-box;
}
.nd-hero, .nd-section, .nd-how-it-works,
.nd-tools-section, .nd-packages-section,
.nd-competitive-section, .nd-dashboard-section,
.nd-compliance-section, .nd-cta-section,
.nd-use-cases-section, .nd-call-demo-section,
.nd-onboarding-section, .nd-roi-section,
.nd-faq-section, .nd-footer, .nd-voice-demo-section {
overflow-x: hidden;
}
.nd-hero h1, .nd-hero h2, .nd-hero h3,
.nd-section-title, .nd-section-subtitle, .nd-section-label,
.nd-hero-desc, .nd-hero-version,
.nd-step-title, .nd-step-desc,
.nd-dash-feature h3, .nd-dash-feature p,
.nd-compliance-card h3, .nd-compliance-card p,
.nd-llm-card h3, .nd-llm-card p,
.nd-what-is-copy p,
.nd-cta-section h2, .nd-cta-section p {
margin: 0;
}
.nd-hero, .nd-hero *,
[class^="nd-"] {
font-family: 'DM Sans', system-ui, sans-serif;
color: var(--nd-ink);
line-height: 1.6;
}
.nd-hero {
min-height: 72vh;
padding-top: 72px;
background: var(--nd-accent);
display: grid;
grid-template-rows: 1fr auto;
position: relative;
overflow: hidden;
}
.nd-hero::before {
content: '';
position: absolute;
inset: 0;
background:
radial-gradient(ellipse 80% 60% at 60% 40%, rgba(109,40,217,0.20) 0%, transparent 70%),
radial-gradient(ellipse 40% 40% at 20% 80%, rgba(200,169,81,0.10) 0%, transparent 60%);
pointer-events: none;
}
.nd-hero-grid {
position: absolute;
inset: 0;
background-image:
linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
background-size: 60px 60px;
pointer-events: none;
}
.nd-nav {
position: fixed;
top: 0; left: 0; right: 0;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 56px;
height: 72px;
z-index: 1000;
background: rgba(36,22,80,0.82);
backdrop-filter: blur(18px);
-webkit-backdrop-filter: blur(18px);
box-shadow: 0 1px 0 rgba(255,255,255,0.10), 0 4px 28px rgba(0,0,0,0.20);
transition: background 0.35s, backdrop-filter 0.35s, box-shadow 0.35s;
}
.nd-nav--scrolled {
background: rgba(36,22,80,0.95);
}
.nd-nav-brand {
font-family: 'DM Serif Display', serif;
font-size: 20px;
color: var(--nd-white);
letter-spacing: 0.02em;
text-decoration: none;
display: flex;
align-items: center;
gap: 10px;
flex-shrink: 0;
}
.nd-nav-live {
font-family: 'DM Sans', sans-serif;
font-size: 10px;
font-weight: 500;
letter-spacing: 0.10em;
text-transform: uppercase;
color: var(--nd-accent-glow);
background: rgba(139,92,246,0.12);
border: 1px solid rgba(139,92,246,0.28);
padding: 3px 9px;
border-radius: 20px;
}
.nd-nav-links {
display: flex;
align-items: center;
gap: 36px;
list-style: none;
margin: 0;
padding: 0;
}
.nd-nav-links li { margin: 0; padding: 0; }
.nd-nav-links a {
font-family: 'DM Sans', sans-serif;
font-size: 14px;
font-weight: 400;
color: rgba(255,255,255,0.82);
text-decoration: none;
transition: color 0.18s;
letter-spacing: 0.01em;
}
.nd-nav-links a:hover { color: rgba(255,255,255,1); }
.nd-nav-right {
display: flex;
align-items: center;
gap: 16px;
flex-shrink: 0;
}
.nd-nav-cta {
background: var(--nd-gold);
color: var(--nd-accent);
font-family: 'DM Sans', sans-serif;
font-size: 13px;
font-weight: 600;
padding: 9px 22px;
border-radius: 7px;
border: none;
cursor: pointer;
text-decoration: none;
display: inline-block;
transition: background 0.2s, transform 0.15s;
white-space: nowrap;
}
.nd-nav-cta:hover { background: var(--nd-gold-light); transform: translateY(-1px); }
.nd-nav-burger {
display: none;
flex-direction: column;
justify-content: center;
gap: 6px;
cursor: pointer;
padding: 4px;
background: none;
border: none;
width: 32px;
height: 32px;
}
.nd-nav-burger span {
display: block;
width: 22px;
height: 1.5px;
background: rgba(255,255,255,0.80);
border-radius: 2px;
transition: transform 0.25s, opacity 0.2s, width 0.2s;
}
.nd-nav--open .nd-nav-burger span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.nd-nav--open .nd-nav-burger span:nth-child(2) { opacity: 0; width: 0; }
.nd-nav--open .nd-nav-burger span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }
.nd-nav-mobile {
position: fixed;
top: 72px; left: 0; right: 0;
background: rgba(12,8,30,0.97);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
z-index: 999;
padding: 8px 24px 28px;
border-bottom: 1px solid rgba(255,255,255,0.08);
flex-direction: column;
display: none;
}
.nd-nav-mobile a {
font-family: 'DM Sans', sans-serif;
font-size: 17px;
font-weight: 400;
color: rgba(255,255,255,0.72);
text-decoration: none;
padding: 14px 0;
border-bottom: 1px solid rgba(255,255,255,0.06);
display: block;
transition: color 0.15s;
}
.nd-nav-mobile a:last-of-type { border-bottom: none; }
.nd-nav-mobile a:hover { color: white; }
.nd-nav-mobile-cta {
margin-top: 20px;
background: var(--nd-gold);
color: var(--nd-accent);
font-family: 'DM Sans', sans-serif;
font-size: 15px;
font-weight: 600;
padding: 14px;
border-radius: 8px;
text-align: center;
cursor: pointer;
border: none;
width: 100%;
display: block;
transition: background 0.18s;
}
.nd-nav-mobile-cta:hover { background: var(--nd-gold-light); }
.nd-hero-content {
display: grid;
grid-template-columns: 55fr 45fr;
gap: 40px;
align-items: center;
padding: 60px 56px 60px;
position: relative;
z-index: 10;
}
.nd-hero-left {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.nd-hero-right {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 16px;
animation: nd-fade-up 0.8s ease 0.35s both;
}
.nd-hero-demo-card {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
padding: 40px 48px;
gap: 0;
}
.nd-hero-demo-label {
display: inline-block;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--nd-gold-light);
background: rgba(200,169,81,0.12);
border: 1px solid rgba(200,169,81,0.25);
border-radius: 20px;
padding: 4px 14px;
margin-bottom: 14px;
}
.nd-hero-demo-subtitle {
font-size: 18px;
font-weight: 500;
color: rgba(255,255,255,0.85);
margin: 0 0 28px;
line-height: 1.4;
}
.nd-hero-right .nd-vd-btn-wrap {
width: 140px;
height: 140px;
}
.nd-hero-right .nd-vd-btn {
width: 140px;
height: 140px;
}
.nd-hero-right .nd-vd-icon-mic {
width: 46px;
height: 46px;
}
.nd-hero-right .nd-vd-icon-stop {
width: 38px;
height: 38px;
}
.nd-hero-right .nd-vd-status {
font-size: 18px;
min-width: 0;
}
.nd-hero-right .nd-vd-hint {
font-size: 15px;
color: rgba(255,255,255,0.45);
}
@keyframes nd-fade-up {
from { opacity: 0; transform: translateY(20px); }
to   { opacity: 1; transform: translateY(0); }
}
.nd-hr-card {
background: rgba(255,255,255,0.07);
border: 1px solid rgba(255,255,255,0.14);
border-radius: 16px;
padding: 22px;
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
}
.nd-hr-top {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 18px;
}
.nd-hr-dot {
width: 8px; height: 8px;
border-radius: 50%;
background: #22c55e;
flex-shrink: 0;
animation: nd-pulse 1.5s ease-in-out infinite;
}
.nd-hr-label {
font-size: 12px;
font-weight: 500;
color: rgba(255,255,255,0.72);
flex: 1;
}
.nd-hr-timer {
font-size: 12px;
font-family: 'DM Sans', monospace;
color: rgba(255,255,255,0.38);
}
.nd-hr-wave {
display: flex;
align-items: center;
gap: 4px;
height: 52px;
margin-bottom: 18px;
}
.nd-hr-msgs {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 14px;
}
.nd-hr-msg {
font-size: 12px;
line-height: 1.5;
padding: 8px 12px;
border-radius: 10px;
max-width: 88%;
}
.nd-hr-msg--caller {
background: rgba(255,255,255,0.08);
color: rgba(255,255,255,0.70);
align-self: flex-start;
}
.nd-hr-msg--agent {
background: rgba(109,40,217,0.28);
border: 1px solid rgba(139,92,246,0.32);
color: rgba(255,255,255,0.88);
align-self: flex-end;
}
.nd-hr-booked {
display: flex;
align-items: center;
gap: 7px;
font-size: 11px;
font-weight: 500;
color: #22c55e;
padding: 7px 12px;
background: rgba(34,197,94,0.09);
border: 1px solid rgba(34,197,94,0.22);
border-radius: 8px;
}
.nd-hr-booked svg { stroke: #22c55e; flex-shrink: 0; }
.nd-hr-trust {
display: flex;
align-items: center;
justify-content: space-around;
padding: 14px 20px;
background: rgba(255,255,255,0.04);
border: 1px solid rgba(255,255,255,0.09);
border-radius: 12px;
}
.nd-hr-trust-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
}
.nd-hr-trust-item strong {
font-family: 'DM Serif Display', serif;
font-size: 17px;
color: var(--nd-white);
line-height: 1;
font-weight: 400;
}
.nd-hr-trust-item span {
font-size: 10px;
color: rgba(255,255,255,0.62);
letter-spacing: 0.06em;
text-transform: uppercase;
}
.nd-hr-trust-sep {
width: 1px;
height: 30px;
background: rgba(255,255,255,0.10);
}
.nd-hero-version-tag {
display: inline-flex;
align-items: center;
background: rgba(139,92,246,0.14);
border: 1px solid rgba(139,92,246,0.28);
color: var(--nd-accent-glow);
font-size: 12px;
font-weight: 600;
letter-spacing: 0.06em;
padding: 5px 14px;
border-radius: 999px;
margin-bottom: 28px;
}
.nd-hero-label {
display: inline-flex;
align-items: center;
gap: 8px;
background: rgba(139,92,246,0.15);
border: 1px solid rgba(139,92,246,0.30);
color: var(--nd-accent-glow);
font-size: 12px;
font-weight: 500;
letter-spacing: 0.14em;
text-transform: uppercase;
padding: 8px 18px;
border-radius: 999px;
margin-bottom: 32px;
}
.nd-hero-label::before {
content: '';
width: 7px;
height: 7px;
background: var(--nd-accent-glow);
border-radius: 50%;
animation: nd-pulse 2s ease-in-out infinite;
}
@keyframes nd-pulse {
0%, 100% { opacity: 1; transform: scale(1); }
50%       { opacity: 0.5; transform: scale(0.7); }
}
.nd-hero h1 {
font-family: 'DM Serif Display', serif;
font-size: clamp(52px, 7vw, 96px);
line-height: 1.0;
color: var(--nd-white);
margin-bottom: 8px;
letter-spacing: -0.02em;
}
.nd-hero h1 em {
font-style: italic;
color: var(--nd-gold-light);
}
.nd-hero-desc {
font-size: 20px;
font-weight: 300;
color: rgba(255,255,255,0.75);
max-width: 600px;
line-height: 1.65;
margin-bottom: 32px;
}
.nd-hero-desc-sub {
display: block;
margin-top: 10px;
font-size: 16px;
font-weight: 300;
color: rgba(255,255,255,0.45);
line-height: 1.5;
}
.nd-hero-cta-row {
display: flex;
gap: 16px;
flex-wrap: wrap;
}
.nd-hero-cta-note {
margin-top: 14px;
font-size: 13px;
color: rgba(255,255,255,0.38);
font-weight: 400;
letter-spacing: 0.01em;
}
.nd-btn-primary {
background: var(--nd-gold);
color: var(--nd-accent);
font-family: 'DM Sans', sans-serif;
font-size: 15px;
font-weight: 600;
padding: 14px 32px;
border-radius: 8px;
border: none;
cursor: pointer;
text-decoration: none;
display: inline-block;
transition: background 0.2s, transform 0.15s;
}
.nd-btn-primary:hover { background: var(--nd-gold-light); transform: translateY(-1px); }
.nd-btn-outline {
background: transparent;
color: rgba(255,255,255,0.80);
font-family: 'DM Sans', sans-serif;
font-size: 15px;
font-weight: 400;
padding: 14px 32px;
border-radius: 8px;
border: 1px solid rgba(255,255,255,0.25);
cursor: pointer;
text-decoration: none;
display: inline-block;
transition: border-color 0.2s, color 0.2s;
}
.nd-btn-outline:hover { border-color: rgba(255,255,255,0.5); color: white; }
.nd-hero-stats {
display: flex;
gap: 0;
border-top: 1px solid rgba(255,255,255,0.12);
padding: 32px 56px;
position: relative;
z-index: 10;
}
.nd-hero-stat {
flex: 1;
padding: 0 32px;
border-right: 1px solid rgba(255,255,255,0.10);
}
.nd-hero-stat:first-child { padding-left: 0; }
.nd-hero-stat:last-child  { border-right: none; padding-right: 0; }
.nd-hero-stat-num {
font-family: 'DM Serif Display', serif;
font-size: 32px;
color: var(--nd-white);
line-height: 1;
margin-bottom: 4px;
}
.nd-hero-stat-label {
font-size: 12px;
font-weight: 400;
color: rgba(255,255,255,0.45);
letter-spacing: 0.04em;
text-transform: uppercase;
}
.nd-section, .nd-how-it-works, .nd-tools-section,
.nd-packages-section, .nd-competitive-section,
.nd-dashboard-section, .nd-compliance-section {
padding: 80px 56px;
}
.nd-cta-section { padding: 100px 56px; text-align: center; }
.nd-section-label {
font-size: 11px;
font-weight: 500;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--nd-accent-bright);
margin-bottom: 16px;
display: block;
}
.nd-section-title {
font-family: 'DM Serif Display', serif;
font-size: clamp(36px, 4vw, 56px);
line-height: 1.08;
color: var(--nd-ink);
letter-spacing: -0.02em;
margin-bottom: 20px;
}
.nd-section-subtitle {
font-size: 18px;
font-weight: 300;
color: var(--nd-muted);
max-width: 560px;
line-height: 1.7;
margin-bottom: 64px;
}
.nd-section { background: var(--nd-white); }
.nd-what-is {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 80px;
align-items: center;
}
.nd-what-is-visual {
background: var(--nd-accent);
border-radius: var(--nd-radius-lg);
padding: 40px;
position: relative;
overflow: hidden;
}
.nd-what-is-visual::after {
content: '';
position: absolute;
bottom: -40px; right: -40px;
width: 200px; height: 200px;
background: radial-gradient(circle, rgba(139,92,246,0.20) 0%, transparent 70%);
}
.nd-voice-wave {
display: flex;
align-items: center;
gap: 5px;
height: 80px;
margin-bottom: 32px;
}
.nd-wave-bar {
width: 4px;
background: var(--nd-accent-glow);
border-radius: 2px;
animation: nd-wave var(--d, 1s) ease-in-out infinite;
animation-delay: var(--delay, 0s);
}
@keyframes nd-wave {
0%, 100% { height: 12px; opacity: 0.4; }
50%       { height: var(--h, 48px); opacity: 1; }
}
.nd-llm-pills { display: flex; gap: 8px; flex-wrap: wrap; }
.nd-llm-pill {
background: rgba(255,255,255,0.10);
border: 1px solid rgba(255,255,255,0.18);
color: rgba(255,255,255,0.85);
font-size: 13px;
font-weight: 500;
padding: 8px 16px;
border-radius: 999px;
display: flex;
align-items: center;
gap: 6px;
}
.nd-llm-pill-dot {
width: 6px; height: 6px;
border-radius: 50%;
}
.nd-what-is-copy .nd-section-title { margin-bottom: 24px; }
.nd-what-is-copy p {
font-size: 17px;
color: var(--nd-muted);
line-height: 1.75;
margin-bottom: 20px;
}
.nd-what-is-copy p strong { color: var(--nd-ink); font-weight: 500; }
.nd-wiv-live {
display: flex;
align-items: center;
gap: 6px;
font-size: 10px;
font-weight: 600;
color: rgba(255,255,255,0.50);
letter-spacing: 0.10em;
text-transform: uppercase;
margin-bottom: 14px;
}
.nd-wiv-live-dot {
width: 6px; height: 6px;
border-radius: 50%;
background: #22c55e;
animation: nd-pulse 1.5s ease-in-out infinite;
}
.nd-wiv-chat {
display: flex;
flex-direction: column;
gap: 8px;
margin-top: 6px;
margin-bottom: 24px;
}
.nd-wiv-bubble {
font-size: 12px;
line-height: 1.55;
padding: 8px 12px;
border-radius: 10px;
max-width: 88%;
}
.nd-wiv-bubble--caller {
background: rgba(255,255,255,0.08);
color: rgba(255,255,255,0.68);
align-self: flex-start;
}
.nd-wiv-bubble--agent {
background: rgba(109,40,217,0.28);
border: 1px solid rgba(139,92,246,0.32);
color: rgba(255,255,255,0.88);
align-self: flex-end;
}
.nd-wiv-booked {
display: flex;
align-items: center;
gap: 6px;
font-size: 11px;
font-weight: 500;
color: #22c55e;
padding: 6px 12px;
background: rgba(34,197,94,0.09);
border: 1px solid rgba(34,197,94,0.20);
border-radius: 8px;
align-self: center;
}
.nd-wiv-booked svg { stroke: #22c55e; }
.nd-wiv-stats {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin-bottom: 28px;
}
.nd-wiv-stat {
background: rgba(255,255,255,0.06);
border: 1px solid rgba(255,255,255,0.1);
border-radius: 14px;
padding: 20px 18px;
text-align: center;
}
.nd-wiv-stat-num {
font-family: 'DM Serif Display', serif;
font-size: 28px;
color: var(--nd-accent-glow);
margin-bottom: 4px;
}
.nd-wiv-stat-label {
font-size: 12px;
color: rgba(255,255,255,0.55);
letter-spacing: 0.02em;
}
.nd-wiv-powered {
font-size: 11px;
color: rgba(255,255,255,0.35);
letter-spacing: 0.08em;
text-transform: uppercase;
margin-bottom: 12px;
margin-top: 0;
}
.nd-call-demo-section {
background: var(--nd-ink);
padding: 80px 56px;
}
.nd-call-demo-section .nd-section-label { color: var(--nd-accent-glow); }
.nd-call-demo-section .nd-section-title { color: white; }
.nd-call-demo-section .nd-section-title em { color: var(--nd-gold-light); }
.nd-call-demo-section .nd-section-subtitle { color: rgba(255,255,255,0.50); }
.nd-call-demo-wrap {
display: grid;
grid-template-columns: 200px 1fr;
gap: 32px;
align-items: start;
margin-top: 44px;
max-width: 800px;
margin-left: auto;
margin-right: auto;
}
.nd-voice-widget {
display: flex;
flex-direction: column;
align-items: center;
gap: 18px;
padding: 24px 20px;
background: rgba(109,40,217,0.08);
border: 1px solid rgba(139,92,246,0.18);
border-radius: 20px;
position: sticky;
top: 100px;
}
.nd-vw-status-row {
display: flex;
align-items: center;
gap: 7px;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.10em;
text-transform: uppercase;
color: #22c55e;
}
.nd-vw-live-dot {
width: 7px; height: 7px;
border-radius: 50%;
background: #22c55e;
animation: nd-pulse 1.5s ease-in-out infinite;
}
.nd-vw-orb-wrap {
position: relative;
width: 148px; height: 148px;
display: flex;
align-items: center;
justify-content: center;
}
.nd-vw-ring {
position: absolute;
width: 100%; height: 100%;
border-radius: 50%;
border: 1.5px solid rgba(139,92,246,0.18);
opacity: 0.20;
transform: scale(0.65);
}
.nd-agent-speaking .nd-vw-ring { animation: nd-vw-ripple 2.4s ease-out infinite; opacity: 1; transform: none; border-color: rgba(139,92,246,0.45); }
.nd-agent-speaking .nd-vw-ring--2 { animation-delay: 0.8s; }
.nd-agent-speaking .nd-vw-ring--3 { animation-delay: 1.6s; }
@keyframes nd-vw-ripple {
0%   { transform: scale(0.65); opacity: 0.9; }
100% { transform: scale(1.65); opacity: 0; }
}
.nd-vw-orb {
width: 82px; height: 82px;
border-radius: 50%;
background: linear-gradient(135deg, var(--nd-accent-mid), var(--nd-accent-glow));
display: flex;
align-items: center;
justify-content: center;
color: white;
box-shadow: 0 0 14px rgba(139,92,246,0.22);
transition: box-shadow 0.4s ease;
z-index: 1;
position: relative;
}
.nd-agent-speaking .nd-vw-orb {
animation: nd-vw-glow 2s ease-in-out infinite;
box-shadow: 0 0 36px rgba(139,92,246,0.50), 0 0 72px rgba(109,40,217,0.28);
}
@keyframes nd-vw-glow {
0%,100% { box-shadow: 0 0 28px rgba(139,92,246,0.40), 0 0 56px rgba(109,40,217,0.20); }
50%      { box-shadow: 0 0 52px rgba(139,92,246,0.72), 0 0 96px rgba(109,40,217,0.42); }
}
.nd-vw-bars {
display: flex;
align-items: flex-end;
gap: 4px;
height: 44px;
}
.nd-vw-bar {
width: 5px;
border-radius: 3px;
background: var(--nd-accent-glow);
opacity: 0.18;
height: var(--bh);
transform: scaleY(0.1);
transition: transform 0.35s ease, opacity 0.35s ease;
}
.nd-agent-speaking .nd-vw-bar {
animation: nd-vw-bounce var(--bd) ease-in-out var(--bdelay) infinite alternate;
opacity: 0.75;
transform: none;
}
@keyframes nd-vw-bounce {
from { transform: scaleY(0.15); opacity: 0.35; }
to   { transform: scaleY(1.00); opacity: 0.90; }
}
.nd-vw-speaking {
font-size: 12px;
color: rgba(255,255,255,0.42);
margin: 0;
letter-spacing: 0.02em;
opacity: 0;
transition: opacity 0.3s ease;
}
.nd-agent-speaking .nd-vw-speaking { opacity: 1; }
.nd-vw-stats {
display: flex;
gap: 8px;
width: 100%;
}
.nd-vw-stat {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
gap: 3px;
padding: 10px 6px;
background: rgba(255,255,255,0.04);
border: 1px solid rgba(255,255,255,0.07);
border-radius: 10px;
}
.nd-vw-stat-val {
font-size: 15px;
font-weight: 700;
color: white;
}
.nd-vw-stat-label {
font-size: 9px;
color: rgba(255,255,255,0.36);
text-transform: uppercase;
letter-spacing: 0.07em;
text-align: center;
}
.nd-vw-cta {
display: block;
width: 100%;
text-align: center;
padding: 13px 20px;
background: var(--nd-accent-bright);
color: white;
font-size: 14px;
font-weight: 600;
border-radius: 10px;
text-decoration: none;
transition: background 0.2s, transform 0.15s;
}
.nd-vw-cta:hover { background: var(--nd-accent-glow); transform: translateY(-1px); }
.nd-vw-note {
font-size: 11px;
color: rgba(255,255,255,0.25);
margin: 0;
text-align: center;
}
.nd-call-demo-phone { position: sticky; top: 100px; }
.nd-cdp-screen {
background: var(--nd-accent);
border-radius: 20px;
padding: 24px 22px 28px;
box-shadow: 0 28px 72px rgba(0,0,0,0.38), inset 0 1px 0 rgba(255,255,255,0.08);
border: 1px solid rgba(255,255,255,0.08);
}
.nd-cdp-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 28px;
}
.nd-cdp-signal {
display: flex;
align-items: center;
gap: 6px;
font-size: 11px;
color: rgba(255,255,255,0.45);
}
.nd-cdp-dot {
width: 7px; height: 7px;
border-radius: 50%;
background: #22c55e;
animation: nd-pulse 1.5s ease-in-out infinite;
}
.nd-cdp-duration {
font-size: 12px;
font-family: 'DM Sans', monospace;
color: rgba(255,255,255,0.35);
}
.nd-cdp-caller { text-align: center; margin-bottom: 24px; }
.nd-cdp-avatar {
width: 64px; height: 64px;
border-radius: 50%;
background: linear-gradient(135deg, var(--nd-accent-mid), var(--nd-accent-glow));
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
font-weight: 600;
color: white;
margin: 0 auto 10px;
}
.nd-cdp-caller-name {
font-size: 16px;
font-weight: 600;
color: white;
margin-bottom: 3px;
}
.nd-cdp-caller-sub {
font-size: 11px;
color: rgba(255,255,255,0.30);
letter-spacing: 0.06em;
}
.nd-cdp-wave {
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
height: 52px;
margin-bottom: 18px;
}
.nd-cdp-agent-label {
text-align: center;
font-size: 10px;
font-weight: 600;
color: var(--nd-accent-glow);
letter-spacing: 0.10em;
text-transform: uppercase;
}
.nd-call-demo-transcript {
display: flex;
flex-direction: column;
background: rgba(255,255,255,0.025);
border: 1px solid rgba(255,255,255,0.07);
border-radius: 16px;
overflow: hidden;
position: sticky;
top: 100px;
}
.nd-cdt-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 14px 20px;
border-bottom: 1px solid rgba(255,255,255,0.06);
background: rgba(255,255,255,0.02);
}
.nd-cdt-msgs { padding: 18px 20px 18px; }
.nd-cdt-result-outer {
border-top: 1px solid rgba(255,255,255,0.06);
padding: 16px 20px 20px;
}
.nd-cdt-live {
font-size: 10px;
font-weight: 600;
letter-spacing: 0.10em;
text-transform: uppercase;
color: #22c55e;
}
.nd-cdt-lang {
font-size: 10px;
font-weight: 600;
color: rgba(255,255,255,0.38);
background: rgba(255,255,255,0.06);
padding: 3px 10px;
border-radius: 999px;
letter-spacing: 0.08em;
}
.nd-cdt-msgs {
display: flex;
flex-direction: column;
gap: 10px;
margin-bottom: 0;
}
.nd-cdt-row { display: flex; flex-direction: column; gap: 5px; }
.nd-cdt-row--human { align-items: flex-end; }
.nd-cdt-meta {
display: flex;
align-items: center;
gap: 6px;
padding: 0 4px;
}
.nd-cdt-row--human .nd-cdt-meta { flex-direction: row-reverse; }
.nd-cdt-dot {
width: 6px; height: 6px;
border-radius: 50%;
flex-shrink: 0;
}
.nd-cdt-row--agent .nd-cdt-dot { background: var(--nd-accent-glow); }
.nd-cdt-row--human .nd-cdt-dot { background: rgba(255,255,255,0.30); }
.nd-cdt-who {
font-size: 10px;
font-weight: 600;
letter-spacing: 0.07em;
text-transform: uppercase;
color: rgba(255,255,255,0.38);
}
.nd-cdt-time {
font-size: 10px;
color: rgba(255,255,255,0.20);
letter-spacing: 0.03em;
font-variant-numeric: tabular-nums;
}
.nd-cdt-bubble {
font-size: 13px;
line-height: 1.6;
padding: 11px 15px;
max-width: min(90%, 520px);
}
.nd-cdt-row--agent .nd-cdt-bubble {
background: rgba(109,40,217,0.18);
border: 1px solid rgba(139,92,246,0.22);
color: rgba(255,255,255,0.80);
border-radius: 4px 14px 14px 14px;
}
.nd-cdt-row--human .nd-cdt-bubble {
background: rgba(255,255,255,0.07);
border: 1px solid rgba(255,255,255,0.10);
color: rgba(255,255,255,0.70);
border-radius: 14px 14px 4px 14px;
}
.nd-cdt-results {
display: flex;
flex-direction: column;
gap: 8px;
}
.nd-cdt-result-row {
display: flex;
align-items: flex-start;
gap: 10px;
font-size: 12px;
font-weight: 500;
color: #4ade80;
line-height: 1.5;
}
.nd-cdt-result-row svg { flex-shrink: 0; margin-top: 2px; stroke: #22c55e; }
@keyframes nd-msg-appear {
from { opacity: 0; transform: translateY(6px); }
to   { opacity: 1; transform: translateY(0); }
}
.nd-cdt-anim-1, .nd-cdt-anim-2, .nd-cdt-anim-3, .nd-cdt-anim-4,
.nd-cdt-anim-5, .nd-cdt-anim-6, .nd-cdt-anim-7, .nd-cdt-anim-8 { opacity: 0; }
.nd-demo-playing .nd-cdt-anim-1 { animation: nd-msg-appear 0.45s ease 0.4s both; }
.nd-demo-playing .nd-cdt-anim-2 { animation: nd-msg-appear 0.45s ease 1.4s both; }
.nd-demo-playing .nd-cdt-anim-3 { animation: nd-msg-appear 0.45s ease 2.6s both; }
.nd-demo-playing .nd-cdt-anim-4 { animation: nd-msg-appear 0.45s ease 3.8s both; }
.nd-demo-playing .nd-cdt-anim-5 { animation: nd-msg-appear 0.45s ease 4.8s both; }
.nd-demo-playing .nd-cdt-anim-6 { animation: nd-msg-appear 0.45s ease 5.8s both; }
.nd-demo-playing .nd-cdt-anim-7 { animation: nd-msg-appear 0.45s ease 6.6s both; }
.nd-demo-playing .nd-cdt-anim-8 { animation: nd-msg-appear 0.45s ease 7.6s both; }
.nd-call-demo-cta {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
margin-top: 52px;
padding-top: 36px;
border-top: 1px solid rgba(255,255,255,0.08);
}
.nd-call-demo-cta p {
color: rgba(255,255,255,0.45);
font-size: 14px;
margin: 0;
}
.nd-btn--outline-light {
flex-shrink: 0;
border: 1px solid rgba(255,255,255,0.20);
color: white;
padding: 10px 24px;
border-radius: 8px;
font-size: 14px;
font-weight: 600;
text-decoration: none;
transition: background 0.2s, border-color 0.2s;
white-space: nowrap;
}
.nd-btn--outline-light:hover { background: rgba(255,255,255,0.07); border-color: rgba(255,255,255,0.40); }
.nd-how-it-works { background: var(--nd-off-white); }
.nd-flow-steps {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 2px;
background: var(--nd-border);
border-radius: var(--nd-radius-lg);
overflow: hidden;
}
.nd-flow-step {
background: var(--nd-white);
padding: 40px 32px;
}
.nd-step-num {
font-family: 'DM Serif Display', serif;
font-size: 48px;
color: rgba(109,40,217,0.55);
line-height: 1;
margin-bottom: 20px;
display: block;
}
.nd-step-icon {
width: 44px; height: 44px;
background: var(--nd-accent);
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
}
.nd-step-icon svg {
width: 22px; height: 22px;
fill: none;
stroke: var(--nd-accent-glow);
stroke-width: 1.8;
stroke-linecap: round;
stroke-linejoin: round;
}
.nd-step-title { font-size: 17px; font-weight: 600; color: var(--nd-ink); margin-bottom: 10px; }
.nd-step-desc  { font-size: 14px; color: var(--nd-muted); line-height: 1.65; }
.nd-tools-section { background: var(--nd-accent); }
.nd-tools-section .nd-section-label { color: var(--nd-accent-glow); }
.nd-tools-section .nd-section-title { color: white; }
.nd-tools-section .nd-section-subtitle { color: rgba(255,255,255,0.55); }
.nd-tools-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
}
.nd-tool-category {
background: rgba(255,255,255,0.05);
border: 1px solid rgba(255,255,255,0.10);
border-radius: var(--nd-radius-lg);
padding: 28px;
transition: background 0.2s, border-color 0.2s;
}
.nd-tool-category:hover {
background: rgba(255,255,255,0.08);
border-color: rgba(139,92,246,0.35);
}
.nd-tool-cat-header { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.nd-tool-cat-icon {
width: 40px; height: 40px;
background: rgba(139,92,246,0.15);
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
color: var(--nd-accent-glow);
}
.nd-tool-cat-title { font-size: 16px; font-weight: 600; color: white; }
.nd-tool-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 10px;
}
.nd-tool-list li {
display: flex;
align-items: center;
gap: 10px;
font-size: 14px;
color: rgba(255,255,255,0.65);
}
.nd-tool-list li::before {
content: '';
width: 5px; height: 5px;
background: var(--nd-accent-glow);
border-radius: 50%;
flex-shrink: 0;
}
.nd-tool-badge {
margin-left: auto;
font-size: 10px;
font-weight: 500;
letter-spacing: 0.08em;
text-transform: uppercase;
padding: 3px 8px;
border-radius: 4px;
}
.nd-badge-pro {
background: rgba(200,169,81,0.20);
color: var(--nd-gold-light);
border: 1px solid rgba(200,169,81,0.25);
}
.nd-badge-all,
.nd-badge-starter {
background: rgba(139,92,246,0.15);
color: var(--nd-accent-glow);
border: 1px solid rgba(139,92,246,0.20);
}
.nd-badge-2 {
background: rgba(34,211,238,0.12);
color: #67e8f9;
border: 1px solid rgba(34,211,238,0.25);
}
.nd-packages-section { background: var(--nd-off-white); }
.nd-dsgvo-strip { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; padding:20px 24px; background:var(--nd-off-white); border-bottom:1px solid rgba(109,40,217,0.12); }
.nd-dsgvo-badge { font-size:13px; font-weight:600; color:#2d7a4f; background:rgba(45,122,79,0.1); border:1px solid rgba(45,122,79,0.25); border-radius:20px; padding:5px 14px; white-space:nowrap; }
.nd-packages-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
align-items: start;
}
.nd-package-card {
background: var(--nd-white);
border: 1px solid var(--nd-border);
border-radius: var(--nd-radius-lg);
overflow: hidden;
transition: box-shadow 0.25s, transform 0.25s, border-color 0.25s;
}
.nd-package-card.nd-featured {
border: 2px solid var(--nd-accent-bright);
box-shadow: 0 8px 40px rgba(109,40,217,0.15);
}
.nd-package-card:hover {
transform: translateY(-5px);
box-shadow: 0 16px 40px rgba(109,40,217,0.12);
border-color: var(--nd-accent-bright);
}
.nd-package-card.nd-featured:hover {
box-shadow: 0 16px 48px rgba(109,40,217,0.25);
}
.nd-package-header {
padding: 28px 28px 24px;
border-bottom: 1px solid var(--nd-border);
}
.nd-package-tag {
font-size: 11px;
font-weight: 500;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--nd-accent-bright);
margin-bottom: 12px;
display: block;
}
.nd-featured .nd-package-tag { color: var(--nd-gold); }
.nd-package-name {
font-family: 'DM Serif Display', serif;
font-size: 26px;
color: var(--nd-ink);
margin-bottom: 4px;
}
.nd-package-price { display: flex; align-items: baseline; gap: 4px; margin-top: 16px; }
.nd-price-main {
font-family: 'DM Serif Display', serif;
font-size: 40px;
color: var(--nd-ink);
}
.nd-price-suffix { font-size: 14px; color: var(--nd-muted); }
.nd-setup-block {
margin-top: 12px;
border-top: 1px solid var(--nd-border);
padding-top: 12px;
}
.nd-setup-top {
display: flex;
flex-direction: column;
gap: 3px;
}
.nd-setup-label-group {
display: flex;
align-items: baseline;
gap: 8px;
}
.nd-setup-label {
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--nd-muted);
}
.nd-setup-price {
font-size: 15px;
font-weight: 700;
color: var(--nd-text);
}
.nd-setup-amortized {
font-size: 11px;
color: var(--nd-gold);
font-weight: 500;
}
.nd-setup-toggle {
display: flex;
align-items: center;
gap: 4px;
background: none;
border: none;
padding: 6px 0 2px;
font-size: 11px;
font-family: 'DM Sans', sans-serif;
color: var(--nd-purple-light, #a78bfa);
cursor: pointer;
font-weight: 500;
}
.nd-setup-toggle:hover { opacity: 0.8; }
.nd-setup-chevron { font-size: 10px; }
.nd-setup-deliverables {
list-style: none;
padding: 0;
margin: 4px 0 6px;
display: flex;
flex-direction: column;
gap: 3px;
}
.nd-setup-deliverables li {
font-size: 11px;
color: var(--nd-muted);
padding-left: 14px;
position: relative;
}
.nd-setup-deliverables li::before {
content: '✓';
position: absolute;
left: 0;
color: #10b981;
font-size: 10px;
}
.nd-setup-annual {
font-size: 11px;
color: var(--nd-gold);
font-weight: 600;
margin-top: 4px;
}
.nd-setup-term {
font-size: 11px;
color: var(--nd-muted);
margin-top: 2px;
}
.nd-featured .nd-setup-block { border-top-color: rgba(255,255,255,0.15); }
.nd-package-body { padding: 28px; }
.nd-package-features {
list-style: none;
padding: 0; margin: 0;
display: flex;
flex-direction: column;
gap: 12px;
}
.nd-package-features li {
display: flex;
align-items: flex-start;
gap: 10px;
font-size: 14px;
color: var(--nd-muted);
line-height: 1.5;
}
.nd-feat-check {
width: 18px; height: 18px;
border-radius: 50%;
background: var(--nd-accent-bright);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
margin-top: 1px;
}
.nd-feat-check-off {
width: 18px; height: 18px;
border-radius: 50%;
background: var(--nd-off-white);
border: 1px solid var(--nd-border);
flex-shrink: 0;
margin-top: 1px;
}
.nd-feat-check svg { width: 10px; height: 10px; stroke: white; stroke-width: 2.5; fill: none; }
.nd-competitive-section { background: var(--nd-white); }
.nd-comp-table-wrap {
overflow-x: auto;
border: 1px solid var(--nd-border);
border-radius: var(--nd-radius-lg);
}
.nd-comp-table-wrap table { width: 100%; min-width: 700px; border-collapse: collapse; font-size: 14px; }
.nd-comp-table-wrap thead th {
background: var(--nd-ink);
color: white;
padding: 16px 20px;
text-align: left;
font-weight: 500;
font-size: 13px;
white-space: nowrap;
}
.nd-comp-table-wrap thead th.nd-highlight { background: var(--nd-accent-bright); box-shadow: 0 0 0 2px var(--nd-accent-bright); }
.nd-comp-table-wrap tbody td:nth-child(2) { background: rgba(109,40,217,0.08); font-weight: 500; }
.nd-comp-table-wrap thead th.nd-highlight-gold { background: var(--nd-gold); color: var(--nd-ink); }
.nd-comp-table-wrap thead th.nd-highlight-gold .nd-col-badge {
display: inline-block;
margin-left: 6px;
font-size: 9px;
font-weight: 700;
letter-spacing: 0.05em;
text-transform: uppercase;
background: rgba(9,7,15,0.18);
color: var(--nd-ink);
padding: 2px 6px;
border-radius: 20px;
vertical-align: middle;
position: relative;
top: -1px;
}
.nd-comp-table-wrap tbody tr { border-bottom: 1px solid var(--nd-border); }
.nd-comp-table-wrap tbody tr:last-child { border-bottom: none; }
.nd-comp-table-wrap tbody td {
padding: 14px 20px;
color: var(--nd-muted);
vertical-align: middle;
}
.nd-comp-table-wrap tbody td:first-child { font-weight: 500; color: var(--nd-ink); font-size: 13px; }
.nd-comp-table-wrap tbody tr:hover td { background: var(--nd-off-white); }
.nd-comp-yes     { color: var(--nd-accent-bright); font-weight: 600; }
.nd-comp-no      { color: #e53935; font-weight: 600; }
.nd-comp-partial { color: var(--nd-gold); font-weight: 500; }
.nd-comp-legend {
text-align: center;
font-size: 12px;
color: var(--nd-muted);
margin: 16px 0 0;
letter-spacing: 0.02em;
}
.nd-comp-cta-wrap {
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
margin-top: 40px;
padding-top: 32px;
border-top: 1px solid var(--nd-border);
}
.nd-comp-cta-text {
font-size: 16px;
color: var(--nd-ink);
text-align: center;
margin: 0;
}
.nd-dashboard-section { background: var(--nd-off-white); }
.nd-dash-mockup-wrap {
margin-bottom: 60px;
display: flex;
flex-direction: column;
align-items: center;
gap: 14px;
}
.nd-dash-mockup-browser {
width: 100%;
max-width: 820px;
border-radius: 14px;
overflow: hidden;
box-shadow: 0 24px 64px rgba(26,21,48,0.18), 0 4px 16px rgba(26,21,48,0.10);
border: 1px solid var(--nd-border-strong);
}
.nd-dash-mockup-chrome {
background: #1e1b2e;
padding: 10px 16px;
display: flex;
align-items: center;
gap: 8px;
}
.nd-dmb-dot {
width: 11px; height: 11px;
border-radius: 50%;
display: inline-block;
}
.nd-dmb-red    { background: #ff5f57; }
.nd-dmb-yellow { background: #febc2e; }
.nd-dmb-green  { background: #28c840; }
.nd-dmb-urlbar {
flex: 1;
margin-left: 10px;
background: rgba(255,255,255,0.07);
border-radius: 6px;
padding: 4px 12px;
font-size: 11px;
color: rgba(255,255,255,0.45);
font-family: 'DM Sans', monospace;
letter-spacing: 0.02em;
}
.nd-dash-mockup-screen {
background: #1a0f3d;
padding: 20px;
position: relative;
overflow: hidden;
}
.nd-dms-topbar {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
}
.nd-dms-brand { display: flex; align-items: center; gap: 10px; }
.nd-dms-logo {
width: 34px; height: 34px;
background: var(--nd-accent-bright);
border-radius: 8px;
}
.nd-dms-agent-name { font-size: 14px; font-weight: 600; color: #fff; }
.nd-dms-agent-sub  { font-size: 11px; color: rgba(255,255,255,0.45); }
.nd-dms-topbar-actions { display: flex; gap: 6px; }
.nd-dms-time-pill {
font-size: 11px;
padding: 4px 10px;
border-radius: 20px;
color: rgba(255,255,255,0.5);
border: 1px solid rgba(255,255,255,0.1);
cursor: default;
}
.nd-dms-pill-active {
background: var(--nd-accent-bright);
color: #fff;
border-color: var(--nd-accent-bright);
}
.nd-dms-kpi-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 12px;
margin-bottom: 16px;
}
.nd-dms-kpi-card {
background: rgba(255,255,255,0.06);
border: 1px solid rgba(255,255,255,0.08);
border-radius: 10px;
padding: 14px 16px;
}
.nd-dms-kpi-label { font-size: 11px; color: rgba(255,255,255,0.45); margin-bottom: 6px; }
.nd-dms-kpi-value { font-size: 22px; font-weight: 700; color: #fff; line-height: 1.1; }
.nd-dms-kpi-gold  { color: var(--nd-gold-light); }
.nd-dms-kpi-delta { font-size: 10px; margin-top: 4px; color: rgba(255,255,255,0.35); }
.nd-dms-delta-up  { color: #4ade80; }
.nd-dms-chart-card {
background: rgba(255,255,255,0.05);
border: 1px solid rgba(255,255,255,0.07);
border-radius: 10px;
padding: 16px;
}
.nd-dms-chart-label { font-size: 11px; color: rgba(255,255,255,0.45); margin-bottom: 10px; }
.nd-dms-chart-area  { position: relative; }
.nd-dms-chart-svg   { width: 100%; height: 80px; display: block; }
.nd-dms-chart-x-labels {
display: flex;
justify-content: space-between;
margin-top: 6px;
font-size: 10px;
color: rgba(255,255,255,0.3);
}
.nd-dms-blur-overlay {
position: absolute;
left: 0; right: 0; bottom: 0;
height: 80px;
background: linear-gradient(to bottom, transparent, rgba(26,15,61,0.92));
pointer-events: none;
}
.nd-dash-mockup-caption {
font-size: 13px;
color: var(--nd-muted);
text-align: center;
}
@media (max-width: 640px) {
.nd-dms-kpi-grid { grid-template-columns: repeat(2, 1fr); }
.nd-dms-topbar-actions { display: none; }
}
.nd-dashboard-features {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px;
}
.nd-dash-feature {
background: var(--nd-white);
border: 1px solid var(--nd-border);
border-radius: var(--nd-radius-lg);
padding: 28px;
transition: border-color 0.2s;
}
.nd-dash-feature:hover { border-color: var(--nd-accent-bright); }
.nd-dash-feature-icon {
width: 44px; height: 44px;
background: rgba(109,40,217,0.06);
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 16px;
color: var(--nd-accent-bright);
}
.nd-dash-feature h3 { font-size: 17px; font-weight: 600; color: var(--nd-ink); margin-bottom: 8px; }
.nd-dash-feature p  { font-size: 14px; color: var(--nd-muted); line-height: 1.65; }
.nd-compliance-section { background: var(--nd-ink); color: white; }
.nd-compliance-section .nd-section-label { color: var(--nd-accent-glow); }
.nd-compliance-section .nd-section-title { color: white; }
.nd-compliance-section .nd-section-subtitle { color: rgba(255,255,255,0.5); }
.nd-compliance-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
}
.nd-compliance-card {
background: rgba(255,255,255,0.04);
border: 1px solid rgba(255,255,255,0.08);
border-radius: var(--nd-radius-lg);
padding: 28px;
}
.nd-compliance-card h3 { font-size: 16px; font-weight: 600; color: white; margin-bottom: 10px; }
.nd-compliance-card p  { font-size: 14px; color: rgba(255,255,255,0.5); line-height: 1.65; }
.nd-compliance-badge {
display: inline-flex;
align-items: center;
gap: 6px;
background: rgba(139,92,246,0.12);
border: 1px solid rgba(139,92,246,0.20);
color: var(--nd-accent-glow);
font-size: 11px;
font-weight: 500;
letter-spacing: 0.10em;
text-transform: uppercase;
padding: 6px 14px;
border-radius: 999px;
margin-bottom: 16px;
}
.nd-cta-section { background: var(--nd-accent); }
.nd-cta-section h2 {
font-family: 'DM Serif Display', serif;
font-size: clamp(40px, 5vw, 72px);
color: white;
margin-bottom: 20px;
letter-spacing: -0.02em;
}
.nd-cta-section p {
font-size: 20px;
font-weight: 300;
color: rgba(255,255,255,0.60);
margin-bottom: 48px;
max-width: 500px;
margin-left: auto;
margin-right: auto;
}
.nd-voice-demo-section {
background: var(--nd-accent);
padding: 100px 40px;
text-align: center;
position: relative;
overflow: hidden;
}
.nd-voice-demo-section::before {
content: '';
position: absolute;
inset: 0;
background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(109,40,217,0.22) 0%, transparent 70%);
pointer-events: none;
}
.nd-vd-inner {
position: relative;
max-width: 600px;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
gap: 48px;
}
.nd-vd-label {
display: inline-block;
font-size: 12px;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--nd-gold);
background: rgba(200,169,81,0.12);
border: 1px solid rgba(200,169,81,0.3);
padding: 4px 14px;
border-radius: 999px;
margin-bottom: 16px;
}
.nd-vd-copy h2 {
font-size: clamp(28px, 5vw, 42px);
font-weight: 700;
color: #fff;
line-height: 1.2;
margin: 0 0 16px;
}
.nd-vd-copy h2 em {
font-style: italic;
color: var(--nd-gold-light);
}
.nd-vd-copy p {
font-size: 16px;
color: rgba(255,255,255,0.65);
line-height: 1.6;
margin: 0;
}
.nd-vd-widget {
display: flex;
flex-direction: column;
align-items: center;
gap: 20px;
}
.nd-vd-btn-wrap {
position: relative;
width: 96px;
height: 96px;
display: flex;
align-items: center;
justify-content: center;
}
.nd-vd-btn-wrap::before,
.nd-vd-btn-wrap::after {
content: '';
position: absolute;
inset: -8px;
border-radius: 50%;
border: 2px solid rgba(200,169,81,0.4);
opacity: 0;
transform: scale(1);
pointer-events: none;
}
@keyframes nd-vd-pulse {
0%   { opacity: 0.7; transform: scale(1); }
100% { opacity: 0; transform: scale(1.7); }
}
.nd-vd-btn-wrap.nd-vd-connecting::before,
.nd-vd-btn-wrap.nd-vd-active::before {
animation: nd-vd-pulse 1.6s ease-out infinite;
}
.nd-vd-btn-wrap.nd-vd-connecting::after,
.nd-vd-btn-wrap.nd-vd-active::after {
animation: nd-vd-pulse 1.6s ease-out 0.55s infinite;
}
.nd-vd-btn-wrap.nd-vd-speaking::before {
animation: nd-vd-pulse 0.9s ease-out infinite;
border-color: rgba(139,92,246,0.7);
}
.nd-vd-btn-wrap.nd-vd-speaking::after {
animation: nd-vd-pulse 0.9s ease-out 0.3s infinite;
border-color: rgba(139,92,246,0.5);
}
.nd-vd-btn {
position: relative;
z-index: 1;
width: 96px;
height: 96px;
border-radius: 50%;
border: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
background: var(--nd-gold);
color: var(--nd-accent);
transition: transform 0.18s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.18s, background 0.25s;
box-shadow: 0 4px 24px rgba(200,169,81,0.35);
outline: none;
}
.nd-vd-btn:hover:not(:disabled) {
transform: scale(1.07);
box-shadow: 0 8px 36px rgba(200,169,81,0.55);
}
.nd-vd-btn:active:not(:disabled) {
transform: scale(0.97);
}
.nd-vd-btn:disabled {
cursor: wait;
opacity: 0.8;
}
.nd-vd-btn-wrap.nd-vd-active .nd-vd-btn,
.nd-vd-btn-wrap.nd-vd-speaking .nd-vd-btn {
background: var(--nd-accent-bright);
color: #fff;
box-shadow: 0 4px 28px rgba(109,40,217,0.5);
}
.nd-vd-btn-wrap.nd-vd-error .nd-vd-btn {
background: #e53935;
color: #fff;
box-shadow: 0 4px 20px rgba(229,57,53,0.4);
}
@keyframes nd-vd-shake {
0%,100% { transform: translateX(0); }
20%,60%  { transform: translateX(-5px); }
40%,80%  { transform: translateX(5px); }
}
.nd-vd-btn-wrap.nd-vd-error .nd-vd-btn {
animation: nd-vd-shake 0.4s ease;
}
.nd-vd-icon-mic {
width: 30px; height: 30px;
stroke-linecap: round; stroke-linejoin: round;
}
.nd-vd-icon-stop {
width: 26px; height: 26px;
fill: currentColor;
display: none;
}
.nd-vd-bars {
display: none;
align-items: center;
gap: 4px;
}
.nd-vd-bar {
width: 4px;
background: #fff;
border-radius: 2px;
height: 20px;
transform-origin: center;
}
@keyframes nd-vd-wave {
0%,100% { transform: scaleY(0.25); }
50%      { transform: scaleY(1.0); }
}
.nd-vd-btn-wrap.nd-vd-speaking .nd-vd-bar {
animation: nd-vd-wave 0.7s ease-in-out infinite;
animation-delay: calc(var(--i) * 0.1s);
}
@keyframes nd-vd-spin {
to { transform: rotate(360deg); }
}
.nd-vd-btn-wrap.nd-vd-connecting .nd-vd-btn::after {
content: '';
position: absolute;
inset: -5px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: var(--nd-gold-light);
animation: nd-vd-spin 0.9s linear infinite;
}
.nd-vd-status-row {
display: flex;
align-items: center;
gap: 8px;
height: 24px;
}
.nd-vd-dot {
width: 8px;
height: 8px;
border-radius: 50%;
background: rgba(255,255,255,0.25);
transition: background 0.3s;
flex-shrink: 0;
}
.nd-vd-btn-wrap.nd-vd-connecting ~ .nd-vd-status-row .nd-vd-dot { background: var(--nd-gold); }
.nd-vd-btn-wrap.nd-vd-active ~ .nd-vd-status-row .nd-vd-dot,
.nd-vd-btn-wrap.nd-vd-speaking ~ .nd-vd-status-row .nd-vd-dot {
background: #4ade80;
box-shadow: 0 0 6px rgba(74,222,128,0.7);
}
.nd-vd-btn-wrap.nd-vd-error ~ .nd-vd-status-row .nd-vd-dot { background: #ef5350; }
.nd-vd-status {
font-size: 14px;
font-weight: 500;
color: rgba(255,255,255,0.75);
transition: color 0.25s;
min-width: 120px;
text-align: left;
}
.nd-vd-hint {
font-size: 12px;
color: rgba(255,255,255,0.3);
margin: 0;
line-height: 1.5;
}
.nd-vd-hint a {
color: rgba(200,169,81,0.7);
text-decoration: underline;
text-underline-offset: 2px;
}
.nd-vd-hint a:hover { color: var(--nd-gold-light); }
@media (max-width: 640px) {
.nd-voice-demo-section { padding: 72px 24px; }
.nd-vd-copy h2 { font-size: 26px; }
.nd-vd-btn-wrap { width: 84px; height: 84px; }
.nd-vd-btn { width: 84px; height: 84px; }
}
.nd-footer {
background: var(--nd-black);
padding: 40px 56px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 24px;
}
.nd-footer-left { display: flex; flex-direction: column; gap: 6px; }
.nd-footer-brand {
font-family: 'DM Serif Display', serif;
font-size: 18px;
color: white;
}
.nd-footer-email { font-size: 13px; color: rgba(255,255,255,0.55); text-decoration: none; }
.nd-footer-email:hover { color: white; }
.nd-footer-note { font-size: 12px; color: rgba(255,255,255,0.28); }
.nd-footer-links {
display: flex;
gap: 28px;
align-items: center;
flex-wrap: wrap;
}
.nd-footer-links a {
font-size: 13px;
color: rgba(255,255,255,0.45);
text-decoration: none;
transition: color 0.18s;
}
.nd-footer-links a:hover { color: rgba(255,255,255,0.85); }
.nd-modal-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(9,7,15,0.72);
backdrop-filter: blur(4px);
z-index: 9999;
align-items: center;
justify-content: center;
padding: 24px;
}
.nd-modal {
background: var(--nd-white);
border-radius: var(--nd-radius-lg);
width: 100%;
max-width: 560px;
max-height: 90vh;
overflow-y: auto;
padding: 44px 40px 40px;
position: relative;
box-shadow: 0 24px 80px rgba(9,7,15,0.45);
}
.nd-modal-close {
position: absolute;
top: 16px; right: 20px;
background: none;
border: none;
font-size: 22px;
color: var(--nd-muted);
cursor: pointer;
line-height: 1;
padding: 4px 8px;
border-radius: 6px;
transition: color 0.15s, background 0.15s;
}
.nd-modal-close:hover { color: var(--nd-ink); background: var(--nd-off-white); }
.nd-modal-title {
font-family: 'DM Serif Display', serif;
font-size: 26px;
color: var(--nd-ink);
margin: 0 0 6px;
}
.nd-modal-subtitle {
font-size: 14px;
color: var(--nd-muted);
margin: 0 0 28px;
}
.nd-form-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
}
.nd-form-group {
display: flex;
flex-direction: column;
gap: 6px;
margin-bottom: 16px;
}
.nd-form-label {
font-size: 13px;
font-weight: 500;
color: var(--nd-ink);
}
.nd-form-input {
padding: 11px 14px;
border: 1.5px solid var(--nd-border-strong);
border-radius: var(--nd-radius);
font-size: 14px;
color: var(--nd-ink);
background: white;
outline: none;
transition: border-color 0.18s, box-shadow 0.18s;
font-family: 'DM Sans', sans-serif;
width: 100%;
}
.nd-form-input:focus {
border-color: var(--nd-accent-bright);
box-shadow: 0 0 0 3px rgba(109,40,217,0.10);
}
.nd-form-input::placeholder { color: rgba(124,111,168,0.55); }
.nd-form-textarea { resize: vertical; min-height: 110px; }
.nd-form-submit {
width: 100%;
padding: 14px;
background: var(--nd-gold);
color: var(--nd-accent);
border: none;
border-radius: var(--nd-radius);
font-size: 15px;
font-weight: 600;
font-family: 'DM Sans', sans-serif;
cursor: pointer;
transition: background 0.18s, transform 0.15s;
margin-top: 8px;
}
.nd-form-submit:hover { background: var(--nd-gold-light); transform: translateY(-1px); }
.nd-form-submit:active { transform: translateY(0); }
.w-form-done { display: none; }
.w-form-fail { display: none; }
.nd-form-done {
text-align: center;
padding: 40px 20px;
}
.nd-form-done-icon {
width: 52px; height: 52px;
background: rgba(109,40,217,0.10);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
color: var(--nd-accent-bright);
margin: 0 auto 16px;
}
.nd-form-done h4 {
font-family: 'DM Serif Display', serif;
font-size: 22px;
color: var(--nd-ink);
margin: 0 0 8px;
}
.nd-form-done p { font-size: 14px; color: var(--nd-muted); margin: 0; }
.nd-form-fail {
background: #fff0f0;
border: 1px solid #fca5a5;
border-radius: var(--nd-radius);
padding: 14px 16px;
font-size: 13px;
color: #b91c1c;
margin-top: 12px;
}
.nd-form-fail a { color: #b91c1c; }
@media (max-width: 560px) {
.nd-modal { padding: 32px 24px; }
.nd-form-row { grid-template-columns: 1fr; }
}
@media (max-width: 390px) {
.nd-roi-row { flex-wrap: wrap; gap: 2px; }
.nd-roi-row-val { font-size: 16px; }
.nd-roi-savings { font-size: 18px; }
.nd-hero-stat-num { font-size: 22px; }
.nd-nav-brand { font-size: 17px; }
.nd-what-is-copy p { font-size: 15px; }
.nd-faq-summary { padding: 15px 16px; font-size: 14px; }
.nd-faq-body    { padding: 0 16px 14px; }
}
.nd-btn-primary:focus-visible,
.nd-btn-outline:focus-visible {
outline: 3px solid var(--nd-accent-glow);
outline-offset: 3px;
}
@media (max-width: 900px) {
.nd-section, .nd-how-it-works, .nd-tools-section,
.nd-packages-section, .nd-competitive-section,
.nd-dashboard-section, .nd-compliance-section { padding: 64px 24px; }
.nd-cta-section { padding: 80px 24px; }
.nd-nav { padding: 0 24px; }
.nd-nav-links { display: none; }
.nd-nav-cta  { display: none; }
.nd-nav-burger { display: flex; }
.nd-hero-content { grid-template-columns: 1fr; padding: 40px 24px 40px; }
.nd-hero-right { display: none; }
.nd-hero-stats { padding: 24px; gap: 16px; flex-wrap: wrap; }
.nd-what-is { grid-template-columns: 1fr; }
.nd-flow-steps { grid-template-columns: 1fr 1fr; }
.nd-tools-grid { grid-template-columns: 1fr 1fr; }
.nd-packages-grid { grid-template-columns: 1fr; }
.nd-dashboard-features { grid-template-columns: 1fr; }
.nd-compliance-grid { grid-template-columns: 1fr; }
.nd-footer { flex-direction: column; gap: 20px; text-align: center; }
.nd-footer-links { justify-content: center; }
.nd-call-demo-section { padding: 64px 24px; }
.nd-call-demo-wrap { grid-template-columns: 1fr; gap: 32px; }
.nd-call-demo-phone { position: static; }
.nd-voice-widget { position: static; }
.nd-cdp-screen { max-width: 320px; margin: 0 auto; }
}
@media (max-width: 640px) {
.nd-nav { padding: 0 20px; height: 64px; }
.nd-nav-mobile { top: 64px; }
.nd-hero { padding-top: 64px; }
.nd-hero-content { padding: 32px 20px 40px; grid-template-columns: 1fr; }
.nd-hero-right   { display: none; }
.nd-hero-label   { font-size: 11px; padding: 7px 14px; margin-bottom: 24px; }
.nd-hero-desc    { font-size: 17px; margin-bottom: 36px; }
.nd-hero-cta-row { flex-direction: column; gap: 12px; }
.nd-btn-primary, .nd-btn-outline { width: 100%; text-align: center; padding: 14px 24px; }
.nd-call-demo-section { padding: 52px 20px; }
.nd-hero-stats {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0;
padding: 0;
}
.nd-hero-stat {
padding: 20px 16px;
border-right: 1px solid rgba(255,255,255,0.10);
border-bottom: 1px solid rgba(255,255,255,0.10);
}
.nd-hero-stat:nth-child(2n) { border-right: none; }
.nd-hero-stat:nth-child(3),
.nd-hero-stat:nth-child(4)  { border-bottom: none; }
.nd-hero-stat:first-child   { padding-left: 16px; }
.nd-hero-stat:last-child    { border-right: none; }
.nd-hero-stat-num { font-size: 26px; }
.nd-section, .nd-how-it-works, .nd-tools-section,
.nd-packages-section, .nd-competitive-section,
.nd-dashboard-section, .nd-compliance-section { padding: 52px 20px; }
.nd-cta-section { padding: 64px 20px; }
.nd-section-subtitle { font-size: 16px; margin-bottom: 40px; }
.nd-what-is { gap: 40px; }
.nd-what-is-visual { padding: 28px; }
.nd-flow-steps { grid-template-columns: 1fr; }
.nd-flow-step  { padding: 28px 24px; }
.nd-tools-grid { grid-template-columns: 1fr; }
.nd-comp-table-wrap { font-size: 13px; }
.nd-comp-table-wrap thead th { padding: 12px 10px; font-size: 12px; }
.nd-comp-table-wrap tbody td { padding: 10px; font-size: 12px; }
.nd-dash-mockup-browser { border-radius: 10px; }
.nd-dash-mockup-screen  { padding: 14px; }
.nd-dms-topbar { margin-bottom: 14px; }
.nd-dms-agent-name { font-size: 12px; }
.nd-dms-agent-sub  { font-size: 10px; }
.nd-dms-logo { width: 28px; height: 28px; border-radius: 6px; }
.nd-dms-kpi-value { font-size: 18px; }
.nd-dms-kpi-card  { padding: 10px 12px; }
.nd-annual-banner { display: flex; flex-wrap: wrap; justify-content: center; text-align: center; width: 100%; font-size: 13px; line-height: 1.5; gap: 4px; margin-left: auto; margin-right: auto; }
.nd-package-header { padding: 20px 20px 18px; }
.nd-package-body { padding: 20px; }
.nd-section-subtitle { max-width: 100%; }
.nd-cta-section h2 { font-size: clamp(28px, 8vw, 44px); }
.nd-cta-section .nd-btn-primary { font-size: 15px !important; padding: 14px 32px !important; width: auto; max-width: 100%; }
.nd-footer { padding: 32px 20px; }
.nd-footer-links { flex-wrap: wrap; gap: 12px; }
.nd-roi-grid { grid-template-columns: 1fr; }
.nd-roi-results { gap: 16px; }
.nd-use-cases-section { padding: 52px 20px; }
.nd-testimonials-grid { grid-template-columns: 1fr; }
.nd-onboarding-steps { flex-direction: column; gap: 32px; }
.nd-onboarding-step  { text-align: left; align-items: flex-start; }
.nd-onboarding-icon  { margin: 0 0 16px; }
.nd-onboarding-connector { display: none; }
}
@media (max-width: 640px) {
.nd-use-cases-grid { grid-template-columns: 1fr; }
}
.nd-annual-banner {
display: inline-flex;
align-items: center;
gap: 8px;
background: linear-gradient(135deg, rgba(200,169,81,0.14) 0%, rgba(232,200,120,0.07) 100%);
border: 1px solid rgba(200,169,81,0.35);
color: var(--nd-gold);
font-size: 14px;
font-weight: 500;
padding: 10px 22px;
border-radius: 999px;
margin-bottom: 48px;
margin-top: -20px;
}
.nd-annual-banner-icon { color: var(--nd-gold-light); font-size: 11px; }
.nd-roi-teaser { text-align:center; margin: 8px 0 0; font-size:13px; }
.nd-roi-teaser a { color:var(--nd-accent-glow); text-decoration:none; font-weight:500; }
.nd-roi-teaser a:hover { text-decoration:underline; }
.nd-use-cases-section {
background: var(--nd-off-white);
padding: 80px 56px;
}
.nd-use-cases-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
}
.nd-use-case-card {
background: var(--nd-white);
border: 1px solid var(--nd-border);
border-radius: var(--nd-radius-lg);
padding: 28px;
transition: border-color 0.2s, box-shadow 0.2s;
}
.nd-use-case-card:hover {
border-color: var(--nd-accent-bright);
box-shadow: 0 8px 28px rgba(109,40,217,0.08);
}
.nd-use-case-icon {
width: 44px; height: 44px;
background: rgba(109,40,217,0.07);
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 16px;
color: var(--nd-accent-bright);
}
.nd-use-case-card h3 {
font-family: 'DM Sans', sans-serif;
font-size: 16px;
font-weight: 600;
color: var(--nd-ink);
margin: 0 0 8px;
}
.nd-use-case-card p {
font-size: 14px;
color: var(--nd-muted);
line-height: 1.65;
margin: 0 0 18px;
}
.nd-use-case-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.nd-use-case-tag {
font-size: 11px;
font-weight: 500;
letter-spacing: 0.05em;
padding: 4px 10px;
border-radius: 999px;
background: rgba(109,40,217,0.07);
border: 1px solid rgba(109,40,217,0.15);
color: var(--nd-accent-bright);
}
@media (max-width: 900px) {
.nd-use-cases-section { padding: 64px 24px; }
.nd-use-cases-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
.nd-use-cases-grid { grid-template-columns: 1fr; }
}
.nd-onboarding-section {
background: var(--nd-white);
padding: 80px 56px;
}
.nd-onboarding-steps {
display: flex;
align-items: flex-start;
}
.nd-onboarding-step {
flex: 1;
padding: 0 24px;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
}
.nd-onboarding-step:first-child { padding-left: 0; }
.nd-onboarding-step:last-child  { padding-right: 0; }
.nd-onboarding-connector {
flex-shrink: 0;
width: 48px;
height: 2px;
background: var(--nd-border-strong);
margin-top: 40px;
position: relative;
}
.nd-onboarding-connector::after {
content: '';
position: absolute;
right: -5px; top: -4px;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
border-left: 6px solid var(--nd-border-strong);
}
.nd-onboarding-badge {
display: inline-block;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.10em;
text-transform: uppercase;
color: var(--nd-accent-bright);
background: rgba(109,40,217,0.08);
border: 1px solid rgba(109,40,217,0.18);
padding: 5px 14px;
border-radius: 999px;
margin-bottom: 16px;
}
.nd-onboarding-icon {
width: 52px; height: 52px;
background: var(--nd-accent);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 16px;
color: var(--nd-accent-glow);
}
.nd-onboarding-title { font-size: 16px; font-weight: 600; color: var(--nd-ink); margin-bottom: 8px; }
.nd-onboarding-desc  { font-size: 14px; color: var(--nd-muted); line-height: 1.65; margin: 0; }
@media (max-width: 900px) {
.nd-onboarding-section { padding: 64px 24px; }
.nd-onboarding-steps { flex-direction: column; gap: 32px; }
.nd-onboarding-step  { padding: 0; text-align: left; align-items: flex-start; }
.nd-onboarding-icon  { margin: 0 0 16px; }
.nd-onboarding-connector { display: none; }
}
@media (max-width: 640px) { .nd-onboarding-section { padding: 52px 20px; } }
.nd-faq-section {
background: var(--nd-off-white);
padding: 80px 56px;
}
.nd-faq-section .nd-section-title { margin-bottom: 48px; }
.nd-faq-list {
max-width: 800px;
margin: 0 auto;
display: flex;
flex-direction: column;
gap: 8px;
}
.nd-faq-item {
background: var(--nd-white);
border: 1px solid var(--nd-border);
border-radius: var(--nd-radius);
overflow: hidden;
transition: border-color 0.2s;
}
.nd-faq-item[open] { border-color: var(--nd-accent-bright); }
.nd-faq-summary {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding: 20px 24px;
cursor: pointer;
font-size: 15px;
font-weight: 500;
color: var(--nd-ink);
list-style: none;
user-select: none;
transition: background 0.15s;
}
.nd-faq-summary::-webkit-details-marker { display: none; }
.nd-faq-summary::marker { display: none; }
.nd-faq-summary:hover { background: var(--nd-off-white); }
.nd-faq-chevron {
flex-shrink: 0;
color: var(--nd-muted);
transition: transform 0.25s ease;
}
details[open] .nd-faq-chevron { transform: rotate(180deg); }
.nd-faq-body {
padding: 0 24px 20px;
border-top: 1px solid var(--nd-border);
}
.nd-faq-body p {
font-size: 14px;
color: var(--nd-muted);
line-height: 1.72;
margin: 16px 0 0;
}
@media (max-width: 900px) { .nd-faq-section { padding: 64px 24px; } }
@media (max-width: 640px) {
.nd-faq-section { padding: 52px 20px; }
.nd-faq-summary { font-size: 14px; padding: 16px 18px; }
.nd-faq-body { padding: 0 18px 16px; }
}
.nd-roi-section {
background: var(--nd-ink);
padding: 80px 56px;
}
.nd-roi-section .nd-section-label { color: var(--nd-accent-glow); }
.nd-roi-section .nd-section-title { color: white; }
.nd-roi-section .nd-section-title em { color: var(--nd-gold-light); font-style: italic; }
.nd-roi-section .nd-section-subtitle { color: rgba(255,255,255,0.50); }
.nd-roi-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 48px;
align-items: start;
}
.nd-roi-inputs {
display: flex;
flex-direction: column;
gap: 36px;
}
.nd-roi-slider-group {
display: flex;
flex-direction: column;
gap: 10px;
}
.nd-roi-label {
font-size: 13px;
font-weight: 500;
color: rgba(255,255,255,0.65);
letter-spacing: 0.01em;
}
.nd-roi-val-display {
font-family: 'DM Serif Display', serif;
font-size: 28px;
color: white;
text-align: center;
line-height: 1;
}
.nd-slider {
--fill: 20%;
-webkit-appearance: none;
appearance: none;
width: 100%;
height: 3px;
border-radius: 2px;
background: linear-gradient(
to right,
var(--nd-accent-bright) 0%,
var(--nd-accent-bright) var(--fill),
rgba(255,255,255,0.14) var(--fill),
rgba(255,255,255,0.14) 100%
);
outline: none;
cursor: pointer;
padding: 6px 0;
}
.nd-slider::-webkit-slider-thumb {
-webkit-appearance: none;
width: 18px; height: 18px;
border-radius: 50%;
background: white;
box-shadow: 0 1px 6px rgba(0,0,0,0.35);
cursor: pointer;
transition: transform 0.15s;
}
.nd-slider::-webkit-slider-thumb:hover { transform: scale(1.18); }
.nd-slider::-moz-range-thumb {
width: 18px; height: 18px;
border-radius: 50%;
background: white;
border: none;
box-shadow: 0 1px 6px rgba(0,0,0,0.35);
cursor: pointer;
}
.nd-roi-range-labels {
display: flex;
justify-content: space-between;
font-size: 11px;
color: rgba(255,255,255,0.30);
}
.nd-slider--agent {
background: linear-gradient(
to right,
var(--nd-gold) 0%,
var(--nd-gold) var(--fill),
rgba(255,255,255,0.14) var(--fill),
rgba(255,255,255,0.14) 100%
) !important;
}
.nd-slider--agent::-webkit-slider-thumb { background: var(--nd-gold-light); }
.nd-slider--agent::-moz-range-thumb     { background: var(--nd-gold-light); }
.nd-roi-results {
display: flex;
flex-direction: column;
gap: 20px;
}
.nd-roi-card {
border-radius: var(--nd-radius-lg);
padding: 24px 28px;
border: 1px solid rgba(255,255,255,0.08);
}
.nd-roi-card--purple {
background: linear-gradient(135deg, rgba(109,40,217,0.22) 0%, rgba(200,100,254,0.12) 100%);
}
.nd-roi-card--glass {
background: rgba(255,255,255,0.06);
}
.nd-roi-card-header {
display: flex;
flex-direction: column;
gap: 4px;
margin-bottom: 16px;
}
.nd-roi-card-label {
font-size: 13px;
font-weight: 500;
color: rgba(255,255,255,0.65);
}
.nd-roi-card-sub {
font-size: 11px;
color: rgba(255,255,255,0.35);
}
.nd-roi-big-num {
font-family: 'DM Serif Display', serif;
font-size: 42px;
color: white;
line-height: 1.1;
}
.nd-roi-big-num span { font-size: 26px; color: rgba(255,255,255,0.55); }
.nd-roi-rows {
display: flex;
flex-direction: column;
gap: 10px;
}
.nd-roi-row {
display: flex;
justify-content: space-between;
align-items: center;
gap: 8px;
}
.nd-roi-row-name {
font-size: 13px;
color: rgba(255,255,255,0.55);
}
.nd-roi-row-name--bold { font-weight: 500; color: rgba(255,255,255,0.75); }
.nd-roi-row-val {
font-size: 18px;
font-weight: 600;
color: white;
white-space: nowrap;
}
.nd-roi-savings {
color: var(--nd-gold-light);
font-size: 22px;
}
.nd-roi-divider {
height: 1px;
background: rgba(255,255,255,0.10);
margin: 4px 0;
}
.nd-roi-fte-block {
margin-top: 16px;
padding-top: 16px;
border-top: 1px solid rgba(255,255,255,0.08);
}
.nd-roi-fte-note {
font-size: 11px;
color: rgba(255,255,255,0.35);
margin: 0 0 10px;
}
.nd-roi-fte-desc {
font-size: 12px;
color: rgba(255,255,255,0.35);
line-height: 1.6;
margin: 10px 0 0;
}
.nd-roi-cta {
background: var(--nd-gold);
color: var(--nd-accent);
font-family: 'DM Sans', sans-serif;
font-size: 15px;
font-weight: 600;
padding: 16px 32px;
border-radius: 8px;
border: none;
cursor: pointer;
width: 100%;
transition: background 0.2s, transform 0.15s;
}
.nd-roi-cta:hover { background: var(--nd-gold-light); transform: translateY(-1px); }
@media (max-width: 900px) {
.nd-roi-section { padding: 64px 24px; }
.nd-roi-grid { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 640px) {
.nd-roi-section { padding: 52px 20px; }
.nd-roi-val-display { font-size: 24px; }
.nd-roi-big-num { font-size: 32px; }
.nd-roi-big-num span { font-size: 20px; }
}
.nd-pov-section {
max-width: 1200px;
margin: 0 auto;
padding: 64px 32px 48px;
text-align: center;
}
.nd-pov-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
margin-top: 36px;
align-items: start;
}
.nd-pov-card {
background: white;
border: 1px solid var(--nd-border);
border-radius: 16px;
padding: 28px 24px;
position: relative;
text-align: left;
}
.nd-pov-card--featured {
border: 2px solid var(--nd-accent-bright);
box-shadow: 0 8px 32px rgba(109,40,217,0.12);
}
.nd-pov-badge {
display: inline-block;
background: var(--nd-accent-bright);
color: white;
font-size: 11px;
font-weight: 600;
padding: 4px 10px;
border-radius: 20px;
margin-bottom: 12px;
}
.nd-pov-tag { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--nd-accent-bright); margin-bottom: 4px; }
.nd-pov-name { font-size: 18px; font-weight: 600; color: var(--nd-ink); margin-bottom: 12px; }
.nd-pov-price { font-family: 'DM Serif Display', serif; font-size: 36px; color: var(--nd-ink); }
.nd-pov-suffix { font-family: 'DM Sans', sans-serif; font-size: 14px; color: var(--nd-ink-light); margin-left: 4px; }
.nd-pov-setup { font-size: 13px; color: var(--nd-ink-light); margin-top: 6px; }
@media (max-width: 640px) { .nd-pov-grid { grid-template-columns: 1fr; } }
.nd-pt-section {
max-width: 1200px;
margin: 0 auto;
padding: 48px 32px;
}
.nd-pt-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
margin-top: 40px;
margin-bottom: 40px;
align-items: start;
}
.nd-pt-card {
background: #fff;
border: 1.5px solid var(--nd-border);
border-radius: 16px;
padding: 28px 24px;
position: relative;
opacity: 1;
transform: translateY(0);
transition: opacity 0.5s ease, transform 0.5s ease, box-shadow 0.2s;
animation: ndPtIn 0.5s ease both;
}
.nd-pt-card:nth-child(2) { animation-delay: 0.12s; }
.nd-pt-card:nth-child(3) { animation-delay: 0.24s; }
@keyframes ndPtIn {
from { opacity: 0; transform: translateY(24px); }
to   { opacity: 1; transform: translateY(0); }
}
.nd-pt-card:hover { box-shadow: 0 8px 32px rgba(109,40,217,0.1); }
.nd-pt-card--featured {
border-color: var(--nd-accent-bright);
box-shadow: 0 4px 24px rgba(109,40,217,0.12);
}
.nd-pt-card.nd-pt-visible { opacity: 1; transform: translateY(0); }
.nd-pt-featured-badge {
position: absolute;
top: -13px;
left: 50%;
transform: translateX(-50%);
background: var(--nd-accent-bright);
color: #fff;
font-size: 11px;
font-weight: 600;
padding: 3px 14px;
border-radius: 20px;
white-space: nowrap;
letter-spacing: 0.03em;
}
.nd-pt-card-label {
font-size: 12px;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--nd-muted);
margin-bottom: 16px;
}
.nd-pt-market-row {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 6px;
}
.nd-pt-market-label { font-size: 11px; color: var(--nd-muted); opacity: 0.8; }
.nd-pt-market {
font-size: 14px;
color: var(--nd-muted);
position: relative;
font-variant-numeric: tabular-nums;
}
.nd-pt-market::after {
content: '';
position: absolute;
left: 0; top: 50%;
width: 0; height: 1.5px;
background: var(--nd-muted);
transition: width 0.35s ease 0.45s;
}
.nd-pt-visible .nd-pt-market::after { width: 100%; }
.nd-pt-price-row {
margin: 10px 0 4px;
opacity: 1;
transform: translateY(0);
}
.nd-pt-visible .nd-pt-price-row { opacity: 1; transform: translateY(0); }
.nd-pt-price {
font-size: 34px;
font-weight: 700;
color: var(--nd-ink);
line-height: 1.1;
letter-spacing: -0.02em;
}
.nd-pt-price-sub { font-size: 12px; color: var(--nd-muted); margin-top: 2px; }
.nd-pt-savings {
display: inline-block;
background: #dcfce7;
color: #15803d;
font-size: 12px;
font-weight: 500;
padding: 5px 12px;
border-radius: 20px;
margin: 14px 0;
opacity: 1;
transform: scale(1);
}
.nd-pt-visible .nd-pt-savings { opacity: 1; transform: scale(1); }
.nd-pt-toggle {
display: flex;
align-items: center;
gap: 6px;
font-size: 12px;
font-weight: 500;
color: var(--nd-accent-bright);
background: none;
border: none;
cursor: pointer;
padding: 0;
margin-top: 4px;
transition: opacity 0.2s;
}
.nd-pt-breakdown-label {
font-size: 12px;
font-weight: 500;
color: var(--nd-accent-bright);
padding: 8px 0 0;
cursor: pointer;
display: flex;
align-items: center;
gap: 4px;
user-select: none;
}
.nd-pt-breakdown-label:hover { opacity: 0.75; }
.nd-pt-breakdown-label .nd-pt-toggle-icon { font-style: normal; transition: transform 0.2s; }
.nd-pt-breakdown-label.nd-pt-open .nd-pt-toggle-icon { transform: rotate(180deg); }
.nd-pt-breakdown {
display: none;
margin-top: 16px;
padding-top: 14px;
border-top: 1px solid var(--nd-border);
}
.nd-pt-breakdown.nd-pt-open { display: block; }
.nd-pt-breakdown-head {
display: grid;
grid-template-columns: 1fr auto;
gap: 8px;
font-size: 10px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--nd-muted);
padding-bottom: 8px;
border-bottom: 1px solid var(--nd-border);
margin-bottom: 4px;
}
.nd-pt-row {
display: grid;
grid-template-columns: 1fr auto;
gap: 8px;
font-size: 11px;
color: var(--nd-ink);
padding: 5px 0;
border-bottom: 1px solid rgba(26,21,48,0.05);
}
.nd-pt-row span:nth-child(2),
.nd-pt-breakdown-head span:nth-child(2) {
text-align: right;
font-variant-numeric: tabular-nums;
white-space: nowrap;
}
.nd-pt-row--total {
font-weight: 600;
color: var(--nd-accent-bright);
border-bottom: none;
padding-top: 8px;
}
.nd-pt-rate-note { font-size: 10px; color: var(--nd-muted); opacity: 0.7; margin-top: 10px; line-height: 1.5; }
.nd-pt-gotcha {
background: var(--nd-accent);
border-radius: 20px;
padding: 48px;
text-align: center;
color: var(--nd-white);
}
.nd-pt-gotcha-eyebrow {
font-size: 11px;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--nd-gold);
margin-bottom: 12px;
}
.nd-pt-gotcha-title {
font-size: 26px;
font-weight: 700;
color: #fff;
margin-bottom: 36px;
line-height: 1.3;
}
.nd-pt-gotcha-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
max-width: 860px;
margin: 0 auto 32px;
text-align: left;
}
.nd-pt-gotcha-col { border-radius: 12px; padding: 24px; }
.nd-pt-gotcha-col--them { background: rgba(220,38,38,0.08); border: 1px solid rgba(220,38,38,0.25); }
.nd-pt-gotcha-col--us { background: rgba(109,40,217,0.2); border: 1px solid rgba(109,40,217,0.4); }
.nd-pt-gotcha-col-head {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 18px;
gap: 8px;
flex-wrap: wrap;
}
.nd-pt-gotcha-col-label { font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.8); }
.nd-pt-gotcha-price-badge { font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 20px; }
.nd-pt-gotcha-price-badge--them { background: rgba(220,38,38,0.2); color: #fca5a5; }
.nd-pt-gotcha-price-badge--us { background: var(--nd-gold); color: var(--nd-accent); }
.nd-pt-gotcha-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.nd-pt-gotcha-list li {
display: flex;
gap: 10px;
font-size: 13px;
color: rgba(255,255,255,0.75);
line-height: 1.45;
align-items: flex-start;
}
.nd-pt-gotcha-icon { flex-shrink: 0; font-style: normal; font-weight: 700; font-size: 13px; margin-top: 1px; }
.nd-pt-gotcha-icon--no { color: #fca5a5; }
.nd-pt-gotcha-icon--yes { color: #86efac; }
.nd-pt-gotcha-total {
margin-top: 18px;
padding-top: 14px;
border-top: 1px solid rgba(255,255,255,0.1);
font-size: 13px;
line-height: 1.5;
}
.nd-pt-gotcha-total--them { color: #fca5a5; }
.nd-pt-gotcha-total--us { color: #86efac; }
.nd-pt-gotcha-footnote { font-size: 14px; color: rgba(255,255,255,0.45); font-style: italic; margin-top: 8px; }
@media (max-width: 900px) {
.nd-pt-grid { grid-template-columns: 1fr; max-width: 480px; margin-left: auto; margin-right: auto; }
.nd-pt-card:nth-child(2), .nd-pt-card:nth-child(3) { transition-delay: 0s; }
.nd-pt-gotcha { padding: 32px 20px; }
.nd-pt-gotcha-grid { grid-template-columns: 1fr; }
.nd-pt-gotcha-title { font-size: 20px; }
}
@media (max-width: 640px) {
.nd-pt-section { padding: 56px 16px; }
.nd-pt-price { font-size: 28px; }
}
.nd-impressum-page {
min-height: 100vh;
background: #fff;
}
.nd-impressum-header {
background: #fff;
border-bottom: 1px solid #ebe7f5;
padding: 56px 24px 40px;
}
.nd-impressum-inner {
max-width: 720px;
margin: 0 auto;
}
.nd-impressum-title {
font-size: 42px;
font-weight: 700;
color: #1a0f3d;
letter-spacing: -0.02em;
margin: 0 0 8px;
}
.nd-impressum-subtitle {
font-size: 14px;
color: #9585b8;
margin: 0;
}
.nd-impressum-body {
padding: 40px 24px 80px;
}
.nd-imp-section h2 {
font-size: 0.9375rem;
font-weight: 700;
color: #1a0f3d;
margin: 0 0 10px;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.nd-imp-section h3 {
font-size: 0.875rem;
font-weight: 600;
color: #374151;
margin: 16px 0 6px;
}
.nd-imp-section p {
color: #4b5563;
font-size: 0.9rem;
line-height: 1.8;
margin: 0 0 8px;
}
.nd-imp-section p:last-child { margin-bottom: 0; }
.nd-imp-section a {
color: #6d28d9;
text-decoration: none;
}
.nd-imp-section a:hover { text-decoration: underline; }
.nd-imp-placeholder {
color: #b45309;
font-style: italic;
}
.nd-imp-hr {
border: none;
border-top: 1px solid #ebe7f5;
margin: 28px 0;
}
.nd-imp-section--links p {
font-size: 0.875rem;
color: #6b7280;
}
@media (max-width: 640px) {
.nd-impressum-header { padding: 44px 20px 32px; }
.nd-impressum-title { font-size: 32px; }
.nd-impressum-body { padding: 32px 20px 64px; }
}
.nd-dse-layout {
display: grid;
grid-template-columns: 200px 1fr;
gap: 40px;
max-width: 980px;
margin: 0 auto;
padding: 40px 24px 80px;
align-items: start;
}
.nd-dse-toc {
position: sticky;
top: 88px;
}
.nd-dse-toc-title {
font-size: 0.75rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.06em;
color: #9585b8;
margin: 0 0 12px;
}
.nd-dse-toc-list {
list-style: none;
margin: 0;
padding: 0;
}
.nd-dse-toc-list li { margin: 0; }
.nd-dse-toc-list a {
display: block;
padding: 6px 12px;
font-size: 0.8rem;
color: #6b7280;
text-decoration: none;
border-left: 2px solid transparent;
transition: color 0.2s, border-color 0.2s;
line-height: 1.4;
}
.nd-dse-toc-list a:hover,
.nd-dse-toc-list a.nd-dse-toc-active {
color: #6d28d9;
border-left-color: #6d28d9;
font-weight: 600;
}
.nd-dse-card + .nd-dse-card {
border-top: 1px solid #ebe7f5;
}
.nd-dse-card summary {
list-style: none;
cursor: pointer;
padding: 18px 0;
display: flex;
align-items: center;
gap: 12px;
font-size: 0.9375rem;
font-weight: 700;
color: #1a0f3d;
text-transform: uppercase;
letter-spacing: 0.04em;
user-select: none;
}
.nd-dse-card summary::-webkit-details-marker { display: none; }
.nd-dse-card summary::before {
content: '+';
display: inline-flex;
align-items: center;
justify-content: center;
width: 22px;
height: 22px;
border-radius: 50%;
background: #f3effe;
color: #6d28d9;
font-size: 1rem;
font-weight: 700;
flex-shrink: 0;
transition: background 0.2s;
}
.nd-dse-card details[open] summary::before {
content: '−';
background: #6d28d9;
color: #fff;
}
.nd-dse-card-body {
padding: 0 0 20px 34px;
}
.nd-dse-card-body p {
color: #4b5563;
font-size: 0.9rem;
line-height: 1.8;
margin: 0 0 10px;
}
.nd-dse-card-body p:last-child { margin-bottom: 0; }
.nd-dse-card-body a { color: #6d28d9; text-decoration: none; }
.nd-dse-card-body a:hover { text-decoration: underline; }
.nd-dse-card-body ul {
margin: 6px 0 10px;
padding-left: 20px;
color: #4b5563;
font-size: 0.9rem;
line-height: 1.8;
}
.nd-dse-card-body ul li { margin-bottom: 2px; }
.nd-dse-rights {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px;
margin: 12px 0;
}
.nd-dse-right-item {
background: #f8f6ff;
border: 1px solid #ebe7f5;
border-radius: 8px;
padding: 10px 14px;
font-size: 0.8125rem;
color: #4b5563;
}
.nd-dse-right-item strong {
display: block;
color: #1a0f3d;
font-size: 0.8125rem;
margin-bottom: 2px;
}
.nd-dse-table {
width: 100%;
border-collapse: collapse;
font-size: 0.8125rem;
margin: 12px 0;
}
.nd-dse-table th {
text-align: left;
background: #f8f6ff;
color: #1a0f3d;
font-weight: 700;
padding: 8px 12px;
border-bottom: 2px solid #ebe7f5;
white-space: nowrap;
}
.nd-dse-table td {
padding: 8px 12px;
color: #4b5563;
border-bottom: 1px solid #f0ecfc;
vertical-align: top;
}
.nd-dse-table tr:last-child td { border-bottom: none; }
.nd-dse-toc-mobile { display: none; margin-bottom: 20px; }
.nd-dse-toc-toggle {
background: #f8f6ff;
border: 1px solid #ebe7f5;
border-radius: 8px;
padding: 12px 16px;
font-size: 0.875rem;
font-weight: 600;
color: #1a0f3d;
cursor: pointer;
width: 100%;
text-align: left;
display: flex;
justify-content: space-between;
align-items: center;
}
.nd-dse-toc-mobile-list {
border: 1px solid #ebe7f5;
border-top: none;
border-radius: 0 0 8px 8px;
display: none;
}
.nd-dse-toc-mobile-list.nd-dse-open { display: block; }
.nd-dse-toc-mobile-list a {
display: block;
padding: 10px 16px;
font-size: 0.875rem;
color: #6b7280;
text-decoration: none;
border-bottom: 1px solid #f0ecfc;
}
.nd-dse-toc-mobile-list a:last-child { border-bottom: none; }
.nd-dse-back-top {
position: fixed;
bottom: 32px;
right: 32px;
width: 44px;
height: 44px;
background: #6d28d9;
color: #fff;
border: none;
border-radius: 50%;
font-size: 20px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
pointer-events: none;
transition: opacity 0.3s;
z-index: 100;
box-shadow: 0 2px 12px rgba(109,40,217,0.35);
}
.nd-dse-back-top.nd-dse-back-top--visible {
opacity: 1;
pointer-events: auto;
}
@media (max-width: 1024px) {
.nd-dse-layout { grid-template-columns: 1fr; padding: 32px 24px 64px; }
.nd-dse-toc { display: none; }
.nd-dse-toc-mobile { display: block; }
}
@media (max-width: 640px) {
.nd-dse-layout { padding: 24px 20px 56px; }
.nd-dse-rights { grid-template-columns: 1fr; }
.nd-dse-table { font-size: 0.75rem; }
.nd-dse-back-top { bottom: 20px; right: 20px; }
}
.nd-agb-header-actions {
margin-top: 18px;
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
.nd-agb-download-btn {
display: inline-flex;
align-items: center;
gap: 7px;
padding: 9px 18px;
background: rgba(109,40,217,0.08);
border: 1px solid rgba(109,40,217,0.25);
border-radius: 8px;
color: #6d28d9;
font-weight: 600;
font-size: 0.85rem;
font-family: 'DM Sans', sans-serif;
text-decoration: none;
cursor: pointer;
transition: background 0.15s;
}
.nd-agb-download-btn:hover { background: rgba(109,40,217,0.15); }
.nd-agb-warn-badge {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 7px 14px;
background: #fff8e1;
border: 1px solid #f59e0b;
border-radius: 8px;
color: #92400e;
font-size: 0.8rem;
font-weight: 500;
font-family: 'DM Sans', sans-serif;
}
.nd-agb-summary-box {
background: rgba(109,40,217,0.04);
border: 1px solid rgba(109,40,217,0.14);
border-radius: 12px;
padding: 18px 20px;
margin-bottom: 24px;
}
.nd-agb-summary-box h3 {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.07em;
color: #6d28d9;
margin: 0 0 12px;
font-family: 'DM Sans', sans-serif;
font-weight: 700;
}
.nd-agb-summary-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 10px;
}
.nd-agb-summary-item {
background: #fff;
border: 1px solid #e8e2f8;
border-radius: 8px;
padding: 10px 12px;
}
.nd-agb-summary-item strong {
display: block;
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: #9b8cb8;
margin-bottom: 3px;
font-family: 'DM Sans', sans-serif;
}
.nd-agb-summary-item span {
font-size: 0.875rem;
color: #1e1333;
font-weight: 500;
}
@media (max-width: 768px) {
.nd-agb-summary-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
.nd-agb-summary-grid { grid-template-columns: 1fr; }
.nd-agb-header-actions { flex-direction: column; align-items: flex-start; }
}
.nd-cookie-page-cards {
max-width: 760px;
margin: 0 auto;
padding: 40px 24px 80px;
}
.nd-cookie-page-cards .nd-dse-card + .nd-dse-card { margin-top: 12px; }
@media (max-width: 640px) {
.nd-cookie-page-cards { padding: 24px 16px 60px; }
}
.nd-cookie-banner {
position: fixed;
bottom: 24px;
left: 24px;
z-index: 99999;
max-width: 420px;
width: calc(100% - 48px);
background: rgba(10,10,15,0.93);
backdrop-filter: blur(18px);
-webkit-backdrop-filter: blur(18px);
border: 1px solid rgba(109,40,217,0.35);
border-radius: 16px;
padding: 20px 22px;
box-shadow: 0 8px 32px rgba(0,0,0,0.55), 0 0 0 1px rgba(109,40,217,0.08);
font-family: 'DM Sans', sans-serif;
color: #e2e8f0;
transition: transform 0.35s cubic-bezier(.4,0,.2,1), opacity 0.35s ease;
}
.nd-cookie-banner[hidden] { display: none !important; }
.nd-cookie-banner--hiding {
transform: translateY(calc(100% + 40px));
opacity: 0;
pointer-events: none;
}
.nd-cookie-banner-title {
font-size: 14px;
font-weight: 600;
color: #f8fafc;
margin: 0 0 7px;
letter-spacing: 0.01em;
}
.nd-cookie-banner-text {
font-size: 13px;
line-height: 1.55;
color: #94a3b8;
margin: 0 0 15px;
}
.nd-cookie-banner-text a { color: #8b5cf6; text-decoration: none; }
.nd-cookie-banner-text a:hover { text-decoration: underline; }
.nd-cookie-banner-actions {
display: flex;
gap: 8px;
flex-wrap: wrap;
align-items: center;
}
.nd-cookie-btn {
font-family: 'DM Sans', sans-serif;
font-size: 13px;
font-weight: 500;
border-radius: 8px;
cursor: pointer;
transition: all 0.18s ease;
line-height: 1;
white-space: nowrap;
}
.nd-cookie-btn--accept {
padding: 9px 16px;
background: #6d28d9;
color: #fff;
border: 1px solid #6d28d9;
}
.nd-cookie-btn--accept:hover { background: #5b21b6; border-color: #5b21b6; }
.nd-cookie-btn--reject {
padding: 9px 16px;
background: transparent;
color: #e2e8f0;
border: 1px solid rgba(255,255,255,0.2);
}
.nd-cookie-btn--reject:hover { border-color: rgba(255,255,255,0.4); color: #fff; }
.nd-cookie-btn--settings-link {
padding: 9px 0;
background: none;
border: none;
color: #64748b;
text-decoration: underline;
font-size: 12px;
margin-left: 2px;
}
.nd-cookie-btn--settings-link:hover { color: #94a3b8; }
.nd-cookie-settings-panel {
margin-top: 16px;
padding-top: 14px;
border-top: 1px solid rgba(255,255,255,0.08);
}
.nd-cookie-settings-panel[hidden] { display: none !important; }
.nd-cookie-category {
display: flex;
align-items: flex-start;
gap: 12px;
padding: 10px 0;
border-bottom: 1px solid rgba(255,255,255,0.05);
}
.nd-cookie-category:last-of-type { border-bottom: none; }
.nd-cookie-cat-toggle {
position: relative;
flex-shrink: 0;
width: 36px;
height: 20px;
margin-top: 2px;
}
.nd-cookie-cat-toggle input {
opacity: 0;
width: 0;
height: 0;
position: absolute;
}
.nd-cookie-cat-slider {
position: absolute;
inset: 0;
background: rgba(255,255,255,0.15);
border-radius: 10px;
cursor: pointer;
transition: background 0.2s;
}
.nd-cookie-cat-slider::after {
content: '';
position: absolute;
left: 2px;
top: 2px;
width: 16px;
height: 16px;
border-radius: 50%;
background: #fff;
transition: transform 0.2s;
}
.nd-cookie-cat-toggle input:checked + .nd-cookie-cat-slider { background: #6d28d9; }
.nd-cookie-cat-toggle input:checked + .nd-cookie-cat-slider::after { transform: translateX(16px); }
.nd-cookie-cat-toggle input:disabled + .nd-cookie-cat-slider { background: #6d28d9; opacity: 0.6; cursor: not-allowed; }
.nd-cookie-cat-info { flex: 1; min-width: 0; }
.nd-cookie-cat-name { font-size: 13px; font-weight: 600; color: #f1f5f9; margin: 0 0 2px; }
.nd-cookie-cat-desc { font-size: 12px; color: #64748b; margin: 0; line-height: 1.4; }
.nd-cookie-btn--save {
margin-top: 12px;
width: 100%;
padding: 10px;
background: #6d28d9;
color: #fff;
border: 1px solid #6d28d9;
border-radius: 8px;
text-align: center;
}
.nd-cookie-btn--save:hover { background: #5b21b6; }
@media (max-width: 640px) {
.nd-cookie-banner {
left: 0;
bottom: 0;
max-width: 100%;
width: 100%;
border-radius: 16px 16px 0 0;
border-left: none;
border-right: none;
border-bottom: none;
}
}
@keyframes nd-rise {
from { opacity: 0; transform: translateY(22px); }
to   { opacity: 1; transform: none; }
}
.nd-hero-content .nd-hero-label { animation: nd-rise 0.7s cubic-bezier(0.16,1,0.3,1) 0.15s both; }
.nd-hero-content h1              { animation: nd-rise 0.9s cubic-bezier(0.16,1,0.3,1) 0.28s both; }
.nd-hero-version                 { animation: nd-rise 0.7s cubic-bezier(0.16,1,0.3,1) 0.42s both; }
.nd-hero-desc                    { animation: nd-rise 0.7s cubic-bezier(0.16,1,0.3,1) 0.52s both; }
.nd-hero-cta-row                 { animation: nd-rise 0.7s cubic-bezier(0.16,1,0.3,1) 0.64s both; }
.nd-hero-stats .nd-hero-stat:nth-child(1) { animation: nd-rise 0.7s cubic-bezier(0.16,1,0.3,1) 0.72s both; }
.nd-hero-stats .nd-hero-stat:nth-child(2) { animation: nd-rise 0.7s cubic-bezier(0.16,1,0.3,1) 0.84s both; }
.nd-hero-stats .nd-hero-stat:nth-child(3) { animation: nd-rise 0.7s cubic-bezier(0.16,1,0.3,1) 0.96s both; }
.nd-hero-stats .nd-hero-stat:nth-child(4) { animation: nd-rise 0.7s cubic-bezier(0.16,1,0.3,1) 1.08s both; }
.nd-reveal {
opacity: 0;
transform: translateY(30px);
transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1),
transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.nd-reveal.nd-in { opacity: 1; transform: none; }
.nd-hero-orb {
position: absolute;
border-radius: 50%;
filter: blur(88px);
pointer-events: none;
will-change: transform;
}
@keyframes nd-orb-a {
0%,100% { transform: translate(0,0) scale(1); }
40%     { transform: translate(55px,-42px) scale(1.1); }
70%     { transform: translate(-28px,18px) scale(0.93); }
}
@keyframes nd-orb-b {
0%,100% { transform: translate(0,0) scale(1); }
35%     { transform: translate(-48px,32px) scale(1.07); }
65%     { transform: translate(28px,-18px) scale(0.96); }
}
.nd-cursor-glow {
position: fixed;
width: 420px;
height: 420px;
border-radius: 50%;
background: radial-gradient(circle, rgba(139,92,246,0.08) 0%, transparent 65%);
pointer-events: none;
z-index: 9990;
mix-blend-mode: screen;
transform: translate(-50%,-50%);
will-change: left, top;
transition: opacity 0.4s;
}
.nd-package-card,
.nd-use-case-card,
.nd-compliance-card,
.nd-dash-feature {
transition: transform 0.35s cubic-bezier(0.16,1,0.3,1),
box-shadow 0.35s ease,
border-color 0.35s ease;
}
.nd-package-card:hover {
transform: translateY(-8px);
box-shadow: 0 28px 72px rgba(109,40,217,0.24);
}
.nd-package-card.nd-featured:hover {
box-shadow: 0 28px 72px rgba(200,169,81,0.22);
}
.nd-use-case-card:hover {
transform: translateY(-6px);
border-color: rgba(139,92,246,0.55);
box-shadow: 0 20px 52px rgba(109,40,217,0.15);
}
.nd-compliance-card:hover  { transform: translateY(-5px); }
.nd-dash-feature:hover     { transform: translateY(-4px); }
.nd-flow-step:hover .nd-step-num {
color: rgba(109,40,217,0.75);
transition: color 0.3s ease;
}
.nd-flow-step {
transition: transform 0.3s cubic-bezier(0.16,1,0.3,1);
}
.nd-flow-step:hover { transform: translateY(-4px); }
.nd-faq-summary:hover .nd-faq-chevron { color: var(--nd-accent-glow); }
.nd-faq-item { transition: box-shadow 0.25s ease; }
@keyframes nd-pulse-btn {
0%,100% { box-shadow: 0 0 0 0 rgba(200,169,81,0.45); }
50%     { box-shadow: 0 0 0 10px rgba(200,169,81,0); }
}
.nd-btn-primary { animation: nd-pulse-btn 3.2s ease-in-out infinite; }
.nd-roi-big-num,
.nd-roi-row-val,
.nd-roi-savings { transition: color 0.25s ease; }
.nd-onboarding-step.nd-reveal { transform: translateX(-24px) translateY(0); }
.nd-onboarding-step.nd-reveal.nd-in { transform: none; }
@media (hover: none) {
.nd-cursor-glow { display: none !important; }
}