/* Vazzilo 1.0 — tokens, shell, marketing, WHMCS components, responsive.
   Scoped to the portal body; standalone invoices and gateway documents retain upstream styles. */
.vz-theme {
  --vz-bg:#060d19; --vz-surface:#0d192a; --vz-raised:#122239;
  --vz-line:#273b53; --vz-text:#f3f7ff; --vz-muted:#b0c1d8;
  --vz-blue:#0861e8; --vz-cyan:#4cd5ff;
  --color-headings:var(--vz-text); --color-texts:var(--vz-text);
  --color-texts-opacity:var(--vz-muted); --color-bg:var(--vz-bg);
  --primary:#0861e8; --text:#f3f7ff; --text-muted:#b0c1d8;
  --bg:#0d192a; --bg-muted:#060d19; --border:#273b53;
  background:var(--vz-bg); color:var(--vz-text); font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
.vz-theme h1,.vz-theme h2,.vz-theme h3,.vz-theme h4,.vz-theme h5,.vz-theme h6 {color:var(--vz-text);font-family:inherit;letter-spacing:-.025em}
.vz-theme p {color:var(--vz-muted);font-family:inherit}
.vz-theme a {color:var(--vz-cyan)}
.vz-theme a:hover {color:#b3edff}
.vz-theme :focus-visible {outline:3px solid #68dcff!important;outline-offset:4px;box-shadow:none!important}
.vz-theme input,.vz-theme select,.vz-theme textarea {color-scheme:dark}
.vz-theme .vz-skip {position:fixed;top:8px;left:16px;transform:translateY(-180%);z-index:10000;background:#fff;color:#091629;padding:12px 20px;border-radius:8px}
.vz-theme .vz-skip:focus {transform:none}
.vz-theme .site-wrapper {overflow:clip;min-height:100vh}
.vz-theme .site-header {position:relative!important;top:auto!important;background:rgba(6,13,25,.98)!important;border-bottom:1px solid var(--vz-line);padding:10px 0;z-index:1030}
.vz-theme .site-navbar {min-height:64px;max-width:1320px;margin:auto}
.vz-theme .brand-logo>a>img {width:172px;height:auto;max-height:none}
.vz-theme .brand-logo .light-version-logo {display:none!important}
.vz-theme .brand-logo .dark-version-logo {display:block!important}
.vz-theme .site-navbar .nav-link,.vz-theme .header-btn-whmcs a,.vz-theme .navbar-toggler {color:var(--vz-text)!important}
.vz-theme .site-navbar .nav-link {font-size:14px;padding-top:12px;padding-bottom:12px}
.vz-theme .dropdown-menu,.vz-theme .coodiv-menu-dropdown {background:var(--vz-surface)!important;color:var(--vz-text);border:1px solid var(--vz-line);border-radius:12px;box-shadow:0 18px 50px #0006}
.vz-theme .dropdown-item,.vz-theme .drop-menu-item a {color:var(--vz-text)!important;white-space:normal}
.vz-theme .dropdown-item:hover,.vz-theme .dropdown-item:focus {background:var(--vz-raised)!important;color:var(--vz-cyan)!important}
.vz-theme .shoping-cart-btn-header,.vz-theme .notifications-btn-header {background:var(--vz-raised)!important;border-radius:9px}
.vz-theme .nav-scroller-subpages {border-bottom:1px solid var(--vz-line);box-shadow:none!important}
.vz-theme #main-body {padding:30px 0 64px;min-height:55vh}
.vz-theme .breadcrumb {background:transparent;color:var(--vz-muted)}
.vz-theme .breadcrumb-item.active {color:var(--vz-muted)}
.vz-container {width:min(1200px,calc(100% - 64px));margin-inline:auto}
.vz-theme .vz-hero {padding:84px 0 88px;background:radial-gradient(ellipse at 80% 20%,#09326666,transparent 55%),linear-gradient(180deg,#091323,#060d19);border-bottom:1px solid #1a2b41}
.vz-hero-grid {display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}
.vz-theme .vz-eyebrow {font-size:11px;line-height:1.5;font-weight:700;letter-spacing:.15em;color:var(--vz-cyan);margin:0 0 20px;text-transform:uppercase}
.vz-eyebrow>span {display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--vz-cyan);margin-right:8px}
.vz-theme .vz-hero h1 {font-size:clamp(36px,4.1vw,57px);line-height:1.09;letter-spacing:-.055em;font-weight:750;margin:0 0 25px}
.vz-hero h1 em {font-style:normal;color:var(--vz-cyan)}
.vz-theme .vz-intro {font-size:17px;line-height:1.85;max-width:500px;margin:0 0 30px}
.vz-actions {display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.vz-theme .vz-button {display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:48px;padding:12px 22px;border-radius:8px;background:linear-gradient(120deg,#0878e5,#084bdd);border:1px solid #3899ff;color:#fff;font-size:14px;font-weight:650;text-decoration:none;box-shadow:0 6px 24px #005aff20;line-height:1.5;transition:background .15s,border-color .15s}
.vz-theme .vz-button:hover {background:#1254c9;border-color:#78c6ff;color:white}
.vz-theme .vz-button-secondary {background:#0b1726;border-color:#45617e;box-shadow:none}
.vz-system {border:1px solid #2d587e;border-radius:18px;background:linear-gradient(145deg,#112540,#08121f);box-shadow:0 28px 70px #0005,0 0 65px #0067ff0c;transform:perspective(1400px) rotateY(-5deg)}
.vz-system-top {display:flex;align-items:center;justify-content:space-between;padding:17px 22px;border-bottom:1px solid #294059;font-size:9px;color:#9eb4cc;letter-spacing:.12em}
.vz-dots {color:#4d779c;font-size:10px;letter-spacing:4px}
.vz-system-body {padding:30px 22px}
.vz-theme .vz-system h2 {font-size:23px;line-height:1.35;max-width:320px;font-weight:600;margin:0}
.vz-theme .vz-system .vz-eyebrow {font-size:9px;margin-bottom:12px}
.vz-core {width:190px;margin:34px auto 0;padding:20px;background:#102a49;border:1px solid #3978b5;border-radius:14px;box-shadow:0 0 32px #007cff25}
.vz-core img {width:100%;height:auto;display:block}
.vz-connections {display:grid;grid-template-columns:repeat(4,1fr);height:40px;margin:0 10%}
.vz-connections span {border-bottom:1px solid #258ac9;position:relative}
.vz-connections span::after {content:"";position:absolute;bottom:-9px;left:50%;height:9px;border-left:1px solid #258ac9}
.vz-connections::before {content:"";position:absolute;left:50%;height:40px;border-left:1px solid #258ac9}
.vz-system-nodes {display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:9px}
.vz-system-nodes>div {display:flex;flex-direction:column;align-items:center;gap:12px;padding:18px 6px;background:#0c1e34;border:1px solid #254a70;border-radius:10px;text-align:center}
.vz-system-nodes i {font-size:23px;color:#48caff}
.vz-system-nodes span {font-size:10px;line-height:1.4;color:#d6e8ff}
.vz-section {padding-block:68px}
.vz-theme .vz-section-heading {max-width:740px;margin-bottom:32px}
.vz-theme .vz-section-heading h2,.vz-theme .vz-domain h2,.vz-theme .vz-cta h2 {font-size:clamp(27px,2.6vw,36px);line-height:1.2;font-weight:650;margin:0 0 16px;letter-spacing:-.04em}
.vz-theme .vz-section-heading p:not(.vz-eyebrow) {font-size:16px;margin:0;line-height:1.7}
.vz-service-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.vz-service {padding:26px 24px;border:1px solid var(--vz-line);border-radius:12px;background:linear-gradient(145deg,#102035,#0b1524);display:flex;flex-direction:column;transition:border-color .15s}
.vz-service:hover {border-color:#44799f}
.vz-icon {width:46px;height:46px;display:grid;place-items:center;background:#073564;border:1px solid #1a5685;border-radius:10px;color:#66d7ff;font-size:22px;margin-bottom:25px}
.vz-theme .vz-service h3 {font-size:18px;font-weight:650;line-height:1.35;margin:0 0 14px}
.vz-theme .vz-service p {font-size:14px;line-height:1.8;margin:0 0 26px}
.vz-service a {margin-top:auto;font-size:13px;font-weight:600;display:flex;gap:10px;align-items:center;justify-content:space-between}
.vz-journey {background:#091322;border-block:1px solid #1c2d43}
.vz-steps {display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.vz-steps article {border-top:1px solid #325270;padding-top:24px}
.vz-steps article>span {font-size:12px;color:var(--vz-cyan);display:block;margin-bottom:16px}
.vz-theme .vz-steps h3 {font-size:20px;margin:0 0 10px}
.vz-theme .vz-steps p {font-size:15px;line-height:1.8;margin:0}
.vz-domain {display:flex;justify-content:space-between;align-items:center;gap:30px;padding:32px;border:1px solid var(--vz-line);border-radius:14px;background:var(--vz-surface)}
.vz-theme .vz-domain h2 {font-size:26px}
.vz-theme .vz-domain p {font-size:14px;margin:0}
.vz-domain .vz-actions {flex-shrink:0;flex-direction:column;align-items:flex-start}
.vz-text-link {font-size:13px}
.vz-cta {padding:48px 0;background:radial-gradient(ellipse at 90% 80%,#0d3670,transparent 70%),#0e1b30;border-block:1px solid #284366}
.vz-cta>.vz-container {display:flex;justify-content:space-between;align-items:center;gap:40px}
.vz-theme .vz-cta p {font-size:15px;margin-bottom:0}
.vz-theme .vz-cta .vz-eyebrow {margin-bottom:15px;font-size:10px}
.vz-cta .vz-button {flex-shrink:0}
.vz-footer {padding:48px 0 20px;background:#050c17}
.vz-footer-grid {display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
.vz-footer-brand img {width:185px;height:auto;display:block;margin-bottom:18px}
.vz-theme .vz-footer-brand p {font-size:13px;max-width:240px}
.vz-theme .vz-footer h2 {font-size:13px;letter-spacing:0;font-weight:600;margin:6px 0 18px}
.vz-footer ul {list-style:none;margin:0;padding:0}
.vz-footer li {margin-bottom:9px}
.vz-theme .vz-footer a {font-size:13px;color:#b0c1d8}
.vz-theme .vz-footer a:hover {color:var(--vz-cyan)}
.vz-footer-bottom {display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid #203149;margin-top:35px;padding-top:20px;font-size:12px;color:#9eb2cc}
.vz-currency {background:transparent;border:1px solid #45617e;color:#c9dcf2;padding:6px 14px;border-radius:6px;font-size:12px}
/* Existing WHMCS components: retain dimensions, identifiers and state classes. */
.vz-theme .bg-default,.vz-theme .bg-default-2,.vz-theme .primary-bg-color {background-color:var(--vz-bg)!important}
.vz-theme .white-bg,.vz-theme .bg-white,.vz-theme .card,.vz-theme .panel,.vz-theme .list-group-item,.vz-theme .modal-content,.vz-theme .light-bg {background-color:var(--vz-surface)!important;color:var(--vz-text);border-color:var(--vz-line)!important}
.vz-theme .card-header,.vz-theme .card-footer,.vz-theme .panel-heading,.vz-theme .panel-footer {background:#122238;border-color:var(--vz-line)}
.vz-theme .border,.vz-theme .border-bottom,.vz-theme .border-top,.vz-theme .border-right,.vz-theme .border-opacity {border-color:var(--vz-line)!important}
.vz-theme .text-dark,.vz-theme .text-blackish-blue,.vz-theme .color-blackish-blue,.vz-theme .color-blackish {color:var(--vz-text)!important}
.vz-theme .text-muted,.vz-theme .color-blackish-blue-opacity,.vz-theme .coodiv-text-color {color:var(--vz-muted)!important}
.vz-theme .text-primary {color:var(--vz-cyan)!important}
.vz-theme .form-control,.vz-theme .custom-select,.vz-theme .nice-select,.vz-theme .nice-select .list {background:#081321!important;border:1px solid #47607e!important;color:var(--vz-text)!important;border-radius:8px;min-height:44px}
.vz-theme .form-control::placeholder {color:#91a7c2;opacity:1}
.vz-theme .form-control:disabled,.vz-theme .form-control[readonly] {background:#1a293c!important;color:#a8b9cf!important}
.vz-theme .input-group-text {background:#172c44;color:#d5e6fc;border-color:#47607e}
.vz-theme .btn-primary,.vz-theme .btn-red,.vz-theme .btn-order-now,.vz-theme .second-pricing-table-button {background:#075bdc!important;color:#fff!important;border:1px solid #3b98ff!important;border-radius:8px}
.vz-theme .btn-primary:hover {background:#074bb5!important}
.vz-theme .btn-default,.vz-theme .btn-light {background:#162a43;color:#e4efff;border:1px solid #47607e}
.vz-theme .btn {white-space:normal;min-height:40px}
.vz-theme .table {color:#e4eeff;background:transparent}
.vz-theme .table td,.vz-theme .table th {border-color:#2b3f57;vertical-align:middle}
.vz-theme .table thead th,.vz-theme .table-list>thead>tr>th {background:#172b44;color:#dceaff}
.vz-theme .table-striped tbody tr:nth-of-type(odd) {background:#122136}
.vz-theme .table-hover tbody tr:hover {background:#1a304c;color:#fff}
.vz-theme .table-container,.vz-theme .table-responsive {overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.vz-theme .page-link {background:#102138;border-color:#35506f;color:#c8e2ff}
.vz-theme .page-item.active .page-link {background:#075bdc;border-color:#478eff}
.vz-theme .page-item.disabled .page-link {background:#132034;color:#a2b2c8;border-color:#35506f}
.vz-theme .alert-info {background:#0e3049;color:#c2eaff;border-color:#316d94}
.vz-theme .alert-success {background:#103c35;color:#b4f3d4;border-color:#357966}
.vz-theme .alert-warning {background:#3d3015;color:#ffe2a4;border-color:#8a6a29}
.vz-theme .alert-danger {background:#421f2d;color:#ffd0dc;border-color:#8a425a}
.vz-theme .close {color:#fff;opacity:.85;text-shadow:none}
.vz-theme .full-page-login-screen {min-height:100vh;background:radial-gradient(ellipse at 50% 10%,#11396a77,transparent 65%),#060d19!important;padding-bottom:40px}
.vz-theme .form-holder {box-shadow:0 24px 65px #0005;border:1px solid #2f4c6f!important;border-radius:18px!important}
.vz-theme .form-holder .form-items {padding:32px}
.vz-theme .full-page-login-screen .brand-logo img {width:220px;height:auto}
.vz-theme .full-page-login-screen .col-lg-4 {max-width:min(500px,100%);flex-basis:min(500px,100%)}
.vz-theme .form-holder input[type=checkbox]:focus-visible+span {outline:3px solid #68dcff;outline-offset:3px}
.vz-theme .vz-empty {text-align:center;padding:56px 20px;background:#0b1727;border:1px dashed #375a7c;border-radius:14px}
.vz-empty>i {font-size:36px;color:var(--vz-cyan);margin-bottom:20px}
.vz-theme .vz-empty h2 {font-size:23px}.vz-theme .vz-empty p {font-size:15px}
.vz-theme .announcement-item {padding:24px!important;border:1px solid var(--vz-line);border-radius:12px;background:#0a1525}
.vz-theme .announcement-arcticle {overflow-wrap:anywhere}
.vz-theme #order-standard_cart .products-item {border:1px solid var(--vz-line)!important;border-radius:14px;margin-bottom:20px}
.vz-theme #order-standard_cart .summary-container,.vz-theme #order-standard_cart .order-summary,.vz-theme #order-standard_cart .view-cart-items,.vz-theme #order-standard_cart .sub-heading span,.vz-theme #order-standard_cart .panel-addon {background:#102138;color:var(--vz-text);border-color:var(--vz-line)}
.vz-theme #order-standard_cart .field,.vz-theme #order-standard_cart .form-control {color:var(--vz-text);background:#081321;border-color:#47607e}
.vz-theme .separte-or span {background:var(--vz-surface);color:var(--vz-muted)}
.vz-theme .nice-select .option:hover,.vz-theme .nice-select .option.selected {background:#203c5d}
@media(min-width:992px){.vz-theme .site-navbar .navbar-nav {flex-wrap:wrap}.vz-theme .site-navbar .navbar-collapse {min-width:0}.vz-theme .site-header .header-btn-whmcs {margin-left:16px!important}}
@media(max-width:1100px){.vz-hero-grid{gap:30px}.vz-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vz-theme .site-navbar .nav-link{font-size:12px}}
@media(max-width:991px){
 .vz-theme .site-navbar .navbar-collapse{position:static!important;width:100%!important;height:auto!important;max-height:70vh;overflow:auto;background:#0c192a!important;transform:none!important;visibility:visible!important;order:5;border-radius:10px}
 .vz-theme .site-navbar{flex-wrap:wrap}.vz-theme .site-navbar .navbar-collapse:not(.show){display:none!important}.vz-theme .site-navbar .navbar-collapse.show{display:block!important}
 .vz-theme .navbar-nav-wrapper{padding:16px}.vz-theme .site-navbar .nav-link{font-size:15px}.vz-theme .site-navbar .dropdown-menu{position:static!important;transform:none!important;width:auto!important}
 .vz-theme .navbar-toggler{display:block!important}.vz-theme .site-navbar .navbar-nav{display:block}.vz-theme .site-navbar .nav-item{width:100%}
 .vz-hero-grid{grid-template-columns:1fr}.vz-hero-copy{max-width:650px}.vz-system{max-width:600px;width:100%;transform:none;margin-top:16px}.vz-theme .vz-hero{padding:56px 0}
 .vz-cta>.vz-container,.vz-domain{align-items:flex-start;flex-direction:column}.vz-footer-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:575px){
 .vz-container{width:calc(100% - 36px)}.vz-theme .site-header>.container-fluid{padding-inline:18px!important}.vz-theme .brand-logo>a>img{width:124px}.vz-theme .brand-logo{margin-right:8px!important}
 .vz-theme .header-btn-whmcs{margin-right:8px!important;gap:4px}.vz-theme .header-btn-whmcs .mr-5{margin-right:8px!important}.vz-theme .vz-search{display:none}
 .vz-theme .shoping-cart-btn-header{width:30px;height:36px}.vz-theme .navbar-toggler{padding:4px}
 .vz-theme .vz-hero h1{font-size:39px}.vz-theme .vz-intro{font-size:16px}.vz-system-body{padding:24px 14px}.vz-system-nodes{gap:6px}.vz-system-nodes span{font-size:9px}
 .vz-service-grid,.vz-steps{grid-template-columns:1fr}.vz-section{padding-block:44px}.vz-service{padding:24px}.vz-icon{margin-bottom:18px}
 .vz-footer-grid{gap:26px 18px}.vz-footer-brand{grid-column:1/-1}.vz-footer-bottom{align-items:flex-start;flex-direction:column}.vz-footer{padding-top:36px}
 .vz-theme .vz-cta h2{font-size:30px}.vz-domain{padding:24px}.vz-theme .main-page-contents{padding:20px 14px!important}.vz-theme #main-body .row.px-5{padding-inline:0!important}
 .vz-theme .form-holder .form-items{padding:24px 18px}.vz-theme .announcment-header{gap:12px;flex-wrap:wrap}.vz-theme .input-group-lg>.form-control{min-width:0;font-size:16px}
}
@media(prefers-reduced-motion:reduce){.vz-theme *,.vz-theme *::before,.vz-theme *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.vz-theme{background:white!important;color:black!important}.vz-theme .site-header,.vz-theme .vz-footer,.vz-theme .vz-cta{display:none!important}.vz-theme .card,.vz-theme .white-bg{background:white!important;color:black!important}}