:root {
    --z-bg: #0d1117;
    --z-bg-2: #121519;
    --z-card: #161c24;
    --z-card-2: #1b222c;
    --z-border: #2a313c;
    --z-border-soft: #222831;
    --z-text: #e6e9ef;
    --z-text-2: #9aa4b2;
    --z-text-3: #6b7480;
    --z-primary: #2f55d4;
    --z-primary-h: #2443ad;
    --z-green: #2eca8a;
    --z-red: #e6455d;
    --z-yellow: #f7b32b;
}

body {
    background-color: var(--z-bg) !important;
    color: var(--z-text) !important;
}

#topnav {
    background-color: rgba(13, 17, 23, .92) !important;
    box-shadow: 0 0 3px rgba(60, 72, 88, .35);
    backdrop-filter: blur(10px);
}
#topnav.nav-sticky {
    background-color: rgba(13, 17, 23, .98) !important;
    box-shadow: 0 0 6px rgba(0, 0, 0, .5);
}
#topnav .navigation-menu > li > a,
#topnav .navigation-menu > li.has-submenu > a {
    color: #cfd4dc !important;
}
#topnav .navigation-menu > li:hover > a,
#topnav .navigation-menu > li.active > a {
    color: var(--z-primary) !important;
}
#topnav .navigation-menu .has-submenu .submenu li a {
    color: #c2c8d2 !important;
}
#topnav .navigation-menu .has-submenu .submenu li a:hover {
    color: var(--z-primary) !important;
}
.logo .logo-text { font-weight: 800; font-size: 22px; color: #fff; letter-spacing: .3px; }
.logo .logo-text span { color: var(--z-primary); }

@media (max-width: 991px) {
    #topnav .navigation-menu li a { color: #cfd4dc !important; }
    #topnav .buy-button .login-btn-primary { display: inline-block !important; }
    #topnav .navigation-menu { background-color: var(--z-bg-2); }
}

.bg-home, .bg-half-170, .bg-half-260 {
    background: radial-gradient(circle at 20% 10%, #16203a 0%, var(--z-bg) 45%) !important;
}
.bg-overlay-white { background-color: transparent !important; }

.card {
    background-color: var(--z-card) !important;
    border: 1px solid var(--z-border) !important;
    color: var(--z-text) !important;
    box-shadow: 0 0 3px rgba(60, 72, 88, .35) !important;
}
.card .card-header {
    background-color: var(--z-card-2) !important;
    border-bottom: 1px solid var(--z-border) !important;
    color: var(--z-text) !important;
}
.form-signin { background-color: var(--z-card) !important; }

h1, h2, h3, h4, h5, h6 { color: var(--z-text) !important; }
.text-muted { color: var(--z-text-3) !important; }
.text-dark { color: var(--z-text) !important; }
p { color: var(--z-text-2); }
a { color: var(--z-primary); }
hr { border-color: var(--z-border) !important; opacity: 1; }

.form-control, .form-select {
    background-color: var(--z-bg-2) !important;
    border: 1px solid var(--z-border) !important;
    color: var(--z-text) !important;
}
.form-control::placeholder { color: var(--z-text-3) !important; }
.form-control:focus, .form-select:focus {
    background-color: var(--z-bg-2) !important;
    border-color: var(--z-primary) !important;
    box-shadow: 0 0 0 3px rgba(47, 85, 212, .15) !important;
    color: var(--z-text) !important;
}
.form-floating > label { color: var(--z-text-3) !important; }
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label { color: var(--z-text-2) !important; }
.input-group-text {
    background-color: var(--z-card-2) !important;
    border: 1px solid var(--z-border) !important;
    color: var(--z-text-2) !important;
}
.form-check-input { background-color: var(--z-bg-2); border-color: var(--z-border); }
.form-check-input:checked { background-color: var(--z-primary); border-color: var(--z-primary); }
.form-text { color: var(--z-text-3) !important; }

.btn-primary {
    background-color: var(--z-primary) !important;
    border-color: var(--z-primary) !important;
    box-shadow: 0 3px 5px rgba(47, 85, 212, .35);
}
.btn-primary:hover { background-color: var(--z-primary-h) !important; border-color: var(--z-primary-h) !important; }
.btn-soft-primary { background-color: rgba(47, 85, 212, .15) !important; color: #7c97f0 !important; border-color: transparent !important; }
.btn-outline-secondary { color: var(--z-text-2) !important; border-color: var(--z-border) !important; }
.btn-outline-secondary:hover { background-color: var(--z-card-2) !important; color: var(--z-text) !important; }
.btn-outline-primary { color: var(--z-primary) !important; border-color: var(--z-primary) !important; }
.btn-outline-primary:hover { background-color: var(--z-primary) !important; color: #fff !important; }
.btn-soft-danger { background-color: rgba(230, 69, 93, .15) !important; color: var(--z-red) !important; border-color: transparent !important; }

.table { color: var(--z-text-2) !important; }
.table > :not(caption) > * > * { background-color: transparent !important; border-color: var(--z-border) !important; }
.table thead th { color: var(--z-text-3) !important; border-color: var(--z-border) !important; text-transform: uppercase; font-size: 12px; letter-spacing: .04em; }
.table-hover > tbody > tr:hover > * { background-color: rgba(255, 255, 255, .03) !important; }
.table-light, .table .table-light { background-color: var(--z-card-2) !important; color: var(--z-text-2) !important; }
code {
    background-color: rgba(47, 85, 212, .12);
    color: #8fa8f5;
    padding: 2px 6px;
    border-radius: 4px;
}

.alert-info { background-color: rgba(47, 85, 212, .1); border-color: rgba(47, 85, 212, .25); color: #aab9ec; }
.alert-success { background-color: rgba(46, 202, 138, .1); border-color: rgba(46, 202, 138, .25); color: #79e3bb; }
.alert-danger { background-color: rgba(230, 69, 93, .1); border-color: rgba(230, 69, 93, .25); color: #f0a3ae; }
.alert-warning { background-color: rgba(247, 179, 43, .1); border-color: rgba(247, 179, 43, .25); color: #f3cd7e; }

.badge.bg-soft-primary { background-color: rgba(47, 85, 212, .15) !important; color: #7c97f0 !important; }
.badge.bg-soft-info { background-color: rgba(47, 187, 212, .15) !important; color: #6fd0e0 !important; }
.badge.bg-soft-success { background-color: rgba(46, 202, 138, .15) !important; color: #5fd9af !important; }
.badge.bg-soft-secondary { background-color: rgba(154, 164, 178, .15) !important; color: #b3bcc9 !important; }
.badge.bg-soft-warning { background-color: rgba(247, 179, 43, .15) !important; color: #f3cd7e !important; }
.badge.bg-soft-dark { background-color: rgba(110, 118, 129, .25) !important; color: #c2c8d2 !important; }
.badge.bg-soft-danger { background-color: rgba(230, 69, 93, .15) !important; color: #f0a3ae !important; }

.feature-card, .key-feature {
    background-color: var(--z-card) !important;
    border: 1px solid var(--z-border) !important;
    border-radius: 10px;
    transition: transform .2s, box-shadow .2s, border-color .2s;
}
.feature-card:hover { transform: translateY(-4px); border-color: rgba(47, 85, 212, .4); box-shadow: 0 12px 30px rgba(0, 0, 0, .35); }

.footer { background-color: var(--z-bg-2) !important; color: var(--z-text-3); border-top: 1px solid var(--z-border); }
.footer .footer-head { color: var(--z-text) !important; }
.footer a { color: var(--z-text-2) !important; }
.footer a:hover { color: var(--z-primary) !important; }

.dropdown-menu { background-color: var(--z-card) !important; border: 1px solid var(--z-border) !important; }
.dropdown-item { color: var(--z-text-2) !important; }
.dropdown-item:hover { background-color: rgba(47, 85, 212, .12) !important; color: var(--z-text) !important; }
.modal-content { background-color: var(--z-card) !important; border: 1px solid var(--z-border) !important; color: var(--z-text); }
.modal-header, .modal-footer { border-color: var(--z-border) !important; }
.btn-close { filter: invert(1) grayscale(1) brightness(1.5); }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--z-bg); }
::-webkit-scrollbar-thumb { background: #2f3947; border-radius: 4px; }

.hero-badge {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(47, 85, 212, .12);
    border: 1px solid rgba(47, 85, 212, .3);
    color: #8fa8f5; font-size: 13px; font-weight: 600;
    padding: 6px 14px; border-radius: 30px;
}
.domain-preview {
    font-family: 'Nunito', monospace; font-weight: 700;
    background: var(--z-bg-2); border: 1px dashed var(--z-border);
    border-radius: 8px; padding: 14px 18px; color: var(--z-text);
}
.domain-preview .sub { color: var(--z-primary); }
.stat-pill {
    background: var(--z-card); border: 1px solid var(--z-border);
    border-radius: 10px; padding: 18px 20px; text-align: center;
}
.stat-pill .num { font-size: 28px; font-weight: 800; color: #fff; }
.stat-pill .lbl { font-size: 12px; color: var(--z-text-3); text-transform: uppercase; letter-spacing: .05em; }