:root {
    --qq-bg: #f3f7f9;
    --qq-surface: #ffffff;
    --qq-surface-2: #eef2f5;
    --qq-ink: #111827;
    --qq-ink-2: #263241;
    --qq-muted: #667085;
    --qq-border: #d9e0e7;
    --qq-border-strong: #c5ced8;
    --qq-ocean: #075a99;
    --qq-ocean-dark: #06385f;
    --qq-pacific: #07314f;
    --qq-teal: #0f8f84;
    --qq-teal-dark: #0a615b;
    --qq-gold: #c9822b;
    --qq-sand: #f4c15d;
    --qq-red: #b42318;
    --qq-green: #117a4f;
    --qq-violet: #6254d9;
    --qq-shadow: 0 18px 42px rgba(17, 24, 39, 0.10);
    --qq-shadow-sm: 0 8px 24px rgba(17, 24, 39, 0.07);
}

/* QQ.PW v9.6: Dedicated IP shows one flat SSH access strip only. */
body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-card {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) auto !important;
    gap: 14px !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 1px solid rgba(0, 169, 184, 0.18) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.90), rgba(246, 253, 250, 0.70) 60%, rgba(255, 250, 237, 0.62)) !important;
    box-shadow: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-icon {
    width: 46px !important;
    height: 46px !important;
    border-radius: 13px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-copy strong {
    display: inline-block !important;
    margin-top: 4px !important;
    padding: 0 !important;
    color: #062f4d !important;
    font-size: clamp(21px, 2.2vw, 29px) !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
    white-space: normal !important;
    word-break: break-word !important;
    border: 0 !important;
    background: transparent !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-copy span {
    color: #5b7480 !important;
    font-size: 11px !important;
    letter-spacing: 0.03em !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-copy small {
    margin-top: 5px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-button {
    min-width: 108px !important;
    min-height: 38px !important;
    padding: 8px 12px !important;
    white-space: nowrap !important;
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-card {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        padding: 12px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-icon {
        width: 40px !important;
        height: 40px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-button {
        grid-column: 1 / -1 !important;
        width: 100% !important;
    }
}

/* QQ.PW v9.7: compact premium Client Area command hero. */
body.qqpw-next.template-clientareahome .qq-console-hero {
    grid-template-columns: minmax(260px, 0.68fr) minmax(520px, 1.32fr) !important;
    gap: clamp(18px, 2.4vw, 28px) !important;
    align-items: center !important;
    min-height: 0 !important;
    padding: clamp(18px, 2.2vw, 24px) clamp(22px, 2.8vw, 32px) !important;
    border-radius: 18px !important;
    background:
        linear-gradient(118deg, rgba(255, 255, 255, 0.94), rgba(239, 252, 249, 0.76) 55%, rgba(255, 250, 238, 0.66)),
        radial-gradient(circle at 86% 0%, rgba(255, 215, 140, 0.22), transparent 24rem),
        radial-gradient(circle at 8% 84%, rgba(10, 167, 154, 0.12), transparent 18rem) !important;
    box-shadow: 0 20px 48px rgba(7, 96, 115, 0.09) !important;
}

body.qqpw-next.template-clientareahome .qq-console-welcome {
    min-height: 112px !important;
}

body.qqpw-next.template-clientareahome .qq-console-welcome .qq-client-kicker {
    margin-bottom: 8px !important;
}

body.qqpw-next.template-clientareahome .qq-console-welcome h2 {
    margin: 0 !important;
    font-size: clamp(38px, 4.6vw, 54px) !important;
    line-height: 0.98 !important;
}

body.qqpw-next.template-clientareahome .qq-console-action-dock {
    align-self: stretch !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 9px !important;
    padding: 11px !important;
    border-color: rgba(0, 169, 184, 0.16) !important;
    border-radius: 17px !important;
    background:
        linear-gradient(140deg, rgba(255, 255, 255, 0.82), rgba(241, 253, 250, 0.58)),
        radial-gradient(circle at 98% 8%, rgba(255, 215, 140, 0.18), transparent 12rem) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78), 0 16px 34px rgba(7, 96, 115, 0.07) !important;
}

body.qqpw-next.template-clientareahome .qq-console-action-dock > .qq-client-kicker {
    color: #08766f !important;
    letter-spacing: 0.05em !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions {
    grid-template-columns: minmax(178px, 1.08fr) minmax(150px, 0.92fr) minmax(178px, 1.08fr) !important;
    grid-template-areas:
        "services invoices order"
        "services tickets order" !important;
    gap: 11px !important;
    grid-auto-rows: 58px !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions a {
    min-height: 0 !important;
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
    grid-template-rows: auto auto !important;
    align-content: center !important;
    gap: 5px 12px !important;
    padding: 11px 12px !important;
    border-color: rgba(0, 169, 184, 0.15) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 253, 250, 0.72)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.13), transparent 9rem) !important;
    box-shadow: inset 3px 0 0 rgba(10, 167, 154, 0.34), 0 12px 24px rgba(7, 96, 115, 0.055) !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-services {
    grid-area: services !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-invoices {
    grid-area: invoices !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-tickets {
    grid-area: tickets !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-order {
    grid-area: order !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-services,
body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-order {
    min-height: 0 !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions a:hover,
body.qqpw-next.template-clientareahome .qq-console-primary-actions a:focus {
    box-shadow: inset 3px 0 0 rgba(10, 167, 154, 0.58), 0 18px 36px rgba(7, 96, 115, 0.10) !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions a > i {
    grid-row: 1 / 3 !important;
    width: 38px !important;
    height: 38px !important;
    border: 1px solid rgba(0, 169, 184, 0.12) !important;
    border-radius: 13px !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions a span {
    grid-column: 2 !important;
    align-self: end !important;
    color: #07314f !important;
    font-size: 13.5px !important;
    line-height: 1.12 !important;
    white-space: nowrap !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions a small {
    grid-column: 2 / 4 !important;
    align-self: start !important;
    color: #607782 !important;
    font-size: 10.5px !important;
    font-weight: 750 !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions a strong {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: end !important;
    color: #065d66 !important;
    font-size: 17px !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-order {
    box-shadow: inset 3px 0 0 rgba(255, 190, 102, 0.55), 0 12px 24px rgba(7, 96, 115, 0.055) !important;
}

body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-order strong {
    color: #087fb0 !important;
}

@media (max-width: 1199px) {
    body.qqpw-next.template-clientareahome .qq-console-hero {
        grid-template-columns: minmax(240px, 0.62fr) minmax(500px, 1.38fr) !important;
    }

    body.qqpw-next.template-clientareahome .qq-console-primary-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareahome .qq-console-hero {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareahome .qq-console-welcome {
        min-height: 0 !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareahome .qq-console-hero {
        padding: 18px !important;
    }

    body.qqpw-next.template-clientareahome .qq-console-welcome h2 {
        font-size: clamp(34px, 12vw, 44px) !important;
    }

    body.qqpw-next.template-clientareahome .qq-console-primary-actions {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "services"
            "invoices"
            "tickets"
            "order" !important;
        grid-auto-rows: auto !important;
    }

    body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-services,
    body.qqpw-next.template-clientareahome .qq-console-primary-actions .qq-console-action-order {
        min-height: 74px !important;
    }
}

/* QQ.PW v9.4 final: concise console header and Debian-only Dedicated IP access. */
body.qqpw-next.template-clientareahome .qq-console-welcome p,
body.qqpw-next.template-clientareahome .qq-console-badges {
    display: none !important;
}

body.qqpw-next.template-clientareahome .qq-console-welcome h2 {
    margin-bottom: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card {
    padding: clamp(14px, 2vw, 18px) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-direct-grid,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-port-strip {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: clamp(16px, 2.2vw, 22px);
    border: 1px solid rgba(0, 169, 184, 0.18);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(240, 253, 250, 0.78)),
        radial-gradient(circle at 96% 12%, rgba(242, 207, 134, 0.18), transparent 13rem);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.82),
        0 16px 36px rgba(7, 96, 115, 0.065);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-icon {
    display: inline-grid;
    place-items: center;
    width: 52px;
    height: 52px;
    color: #087f8f;
    border: 1px solid rgba(0, 169, 184, 0.22);
    border-radius: 16px;
    background:
        radial-gradient(circle at 30% 22%, rgba(255, 255, 255, 0.96), transparent 35%),
        linear-gradient(135deg, rgba(10, 167, 154, 0.16), rgba(242, 207, 134, 0.28));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 12px 24px rgba(7, 96, 115, 0.08);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy {
    min-width: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy span,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy small {
    display: block;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy span {
    color: #55717c;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.02em;
    line-height: 1.1;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy strong {
    display: inline-block;
    max-width: 100%;
    margin-top: 7px;
    padding: 8px 10px;
    color: #062f4d;
    font-size: clamp(18px, 2.5vw, 24px);
    font-weight: 880;
    line-height: 1.12;
    white-space: normal;
    word-break: break-word;
    border: 1px solid rgba(0, 169, 184, 0.14);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.72);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy small {
    margin-top: 8px;
    color: #4f6975;
    font-size: 12px;
    font-weight: 700;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy code {
    padding: 2px 6px;
    color: #07314f;
    border: 1px solid rgba(0, 169, 184, 0.13);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-button {
    min-width: 112px;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-card {
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 12px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-icon {
        width: 44px;
        height: 44px;
        border-radius: 14px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-button {
        grid-column: 1 / -1;
        width: 100%;
    }
}

/* QQ.PW v9.5 final: flatten Dedicated IP SSH block. */
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card {
    padding: 12px !important;
    border-color: rgba(0, 169, 184, 0.13) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(240, 253, 250, 0.66)),
        radial-gradient(circle at 98% 0%, rgba(242, 207, 134, 0.14), transparent 14rem) !important;
    box-shadow: 0 14px 34px rgba(7, 96, 115, 0.055) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-card {
    grid-template-columns: 44px minmax(0, 1fr) auto !important;
    gap: 12px !important;
    padding: 12px 14px !important;
    border: 0 !important;
    border-radius: 11px !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-icon {
    width: 44px !important;
    height: 44px !important;
    border-radius: 13px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy span {
    font-size: 10.5px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy strong {
    margin-top: 5px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-size: clamp(22px, 2.35vw, 28px) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy small {
    margin-top: 5px !important;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card {
        padding: 10px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-card {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        padding: 10px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-icon {
        width: 40px !important;
        height: 40px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-button {
        grid-column: 1 / -1;
        width: 100%;
    }
}

html {
    background: var(--qq-bg);
}

body.qqpw-next {
    color: var(--qq-ink);
    background:
        linear-gradient(180deg, #f7fbfd 0, var(--qq-bg) 420px),
        var(--qq-bg);
    letter-spacing: 0;
    overflow-x: hidden;
}

body.qqpw-next,
.qqpw-next input,
.qqpw-next select,
.qqpw-next textarea,
.qqpw-next button {
    font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.qqpw-next a {
    color: var(--qq-teal-dark);
}

.qqpw-next a:hover,
.qqpw-next a:focus {
    color: var(--qq-teal);
}

body.qqpw-next #fullpage-overlay.w-hidden {
    display: none !important;
}

body.qqpw-next #fullpage-overlay:not(.w-hidden) {
    display: table;
}

.qq-header {
    position: relative;
    z-index: 20;
    color: #ffffff;
    background:
        linear-gradient(118deg, #061725 0%, #071927 58%, #07314f 100%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.qq-topbar {
    background: #0b2235;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.qq-topbar-grid {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.qq-alert-trigger,
.qq-client-name,
.qq-icon-link,
.qq-return-admin,
.qq-cart-link,
.qq-menu-toggle,
.qq-locale-btn {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 6px;
    text-decoration: none;
}

.qq-alert-trigger {
    color: #e8ecef;
    background: transparent;
    padding: 5px 10px;
}

.qq-alert-trigger:hover,
.qq-alert-trigger:focus {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
}

.qq-active-client {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.qq-client-name,
.qq-icon-link,
.qq-return-admin {
    color: #e8ecef;
    background: rgba(255, 255, 255, 0.06);
    padding: 5px 10px;
}

.qq-client-name span {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qq-client-name:hover,
.qq-icon-link:hover,
.qq-return-admin:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.12);
    text-decoration: none;
}

.qq-navbar {
    background: transparent;
}

.qq-navbar-row {
    min-height: 78px;
    display: flex;
    align-items: center;
    gap: 18px;
}

.qq-brand,
.qq-footer-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #ffffff;
    text-decoration: none;
    font-weight: 800;
    letter-spacing: 0;
}

.qq-brand:hover,
.qq-footer-brand:hover {
    color: #ffffff;
    text-decoration: none;
}

.qq-brand .logo-img {
    max-height: 42px;
}

.qq-brand-mark {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--qq-teal);
    border-radius: 50%;
    font-weight: 800;
}

.qq-brand-word {
    font-size: 22px;
    line-height: 1;
}

.qq-search,
.qq-mobile-search {
    flex: 1;
    max-width: 520px;
    display: flex;
    align-items: center;
    margin-left: auto;
    background: #102a3d;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 6px;
}

.qq-mobile-search {
    max-width: none;
    margin: 10px 0;
}

.qq-search input,
.qq-mobile-search input {
    width: 100%;
    min-height: 42px;
    color: #ffffff;
    background: transparent;
    border: 0;
    outline: 0;
    padding: 8px 12px 8px 0;
}

.qq-search input::placeholder,
.qq-mobile-search input::placeholder {
    color: #aeb7c2;
}

.qq-search-submit {
    width: 42px;
    height: 42px;
    color: #c9d2dc;
    background: transparent;
    border: 0;
}

.qq-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.qq-cart-link,
.qq-menu-toggle {
    min-width: 42px;
    height: 42px;
    justify-content: center;
    color: #ffffff;
    background: #102a3d;
    border-color: rgba(255, 255, 255, 0.11);
}

.qq-cart-link:hover,
.qq-menu-toggle:hover {
    color: #ffffff;
    background: #153854;
    text-decoration: none;
}

.qq-cart-count {
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #111827;
    background: var(--qq-sand);
    border-radius: 6px;
    font-size: 12px;
    font-weight: 800;
}

.qq-mainnav {
    background: rgba(4, 17, 28, 0.72);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 16px 34px rgba(4, 17, 28, 0.16);
}

.qq-mainnav .navbar-collapse {
    display: flex;
    align-items: center;
    min-height: 56px;
}

.qq-mainnav .navbar-nav {
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 4px;
    min-width: 0;
}

.qq-secondary-nav {
    margin-left: auto;
}

.qq-mainnav .navbar-nav > li {
    position: relative;
    display: block;
}

.qq-mainnav .navbar-nav > li > a,
.qq-mainnav .nav-link {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #d7e3ea !important;
    border-radius: 6px;
    padding: 10px 12px !important;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
}

.qq-mainnav .navbar-nav > li > a i,
.qq-mainnav .nav-link i {
    color: #86d7cf;
    font-size: 0.95em;
}

.qq-mainnav .navbar-nav > li > a .badge,
.qq-mainnav .nav-link .badge {
    color: #ffffff;
    background: var(--qq-teal);
    border-radius: 999px;
}

.qq-mainnav .navbar-nav > li.show > a,
.qq-mainnav .navbar-nav > li.active > a,
.qq-mainnav .navbar-nav > li > a:hover,
.qq-mainnav .navbar-nav > li > a:focus,
.qq-mainnav .nav-link:hover,
.qq-mainnav .nav-item.show > .nav-link,
.qq-mainnav .nav-link.active {
    color: #ffffff !important;
    background: rgba(15, 143, 132, 0.22);
    text-decoration: none;
}

.qq-mainnav .navbar-nav > li.show > a i,
.qq-mainnav .navbar-nav > li.active > a i,
.qq-mainnav .navbar-nav > li > a:hover i,
.qq-mainnav .navbar-nav > li > a:focus i {
    color: #ffffff;
}

.qq-mainnav .dropdown-menu {
    border: 1px solid var(--qq-border);
    border-radius: 6px;
    box-shadow: var(--qq-shadow);
    padding: 8px;
    min-width: 220px;
    margin-top: 8px;
    background: #ffffff;
}

.qq-mainnav .dropdown-menu > li.dropdown-item {
    display: block;
    background: transparent;
    padding: 0;
}

.qq-mainnav .dropdown-item,
.qq-mainnav .dropdown-menu > li > a {
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 6px;
    color: var(--qq-ink-2);
    padding: 9px 11px !important;
    font-weight: 700;
    line-height: 1.25;
    white-space: normal;
}

.qq-mainnav .dropdown-item:hover,
.qq-mainnav .dropdown-item:focus,
.qq-mainnav .dropdown-menu > li > a:hover,
.qq-mainnav .dropdown-menu > li > a:focus {
    color: var(--qq-teal-dark);
    background: #e8f4f2;
    text-decoration: none;
}

.qq-mainnav .dropdown-divider {
    border-top-color: var(--qq-border);
    margin: 7px 4px;
}

.qq-breadcrumb {
    background: #f7fbfd;
    border-bottom: 1px solid var(--qq-border);
    padding: 12px 0;
}

.qq-breadcrumb .breadcrumb {
    background: transparent;
    margin: 0;
    padding: 0;
    font-size: 13px;
}

.qq-main-body {
    padding: 24px 0 56px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0, rgba(255, 255, 255, 0) 260px),
        var(--qq-bg);
}

.qq-main-container,
.qq-layout-row {
    min-width: 0;
}

.qq-layout-row {
    row-gap: 24px;
}

.qq-content {
    min-width: 0;
}

.qq-content > .card:not(.card-sidebar),
.qq-content > .panel:not(.panel-sidebar),
.qqpw-next .logincontainer .card,
.qqpw-next .mw-540.card {
    border: 1px solid var(--qq-border);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(17, 24, 39, 0.08);
    overflow: hidden;
}

.qq-content > .card:not(.card-sidebar) > .card-header,
.qq-content > .panel:not(.panel-sidebar) > .panel-heading {
    background: #ffffff;
    border-bottom: 1px solid var(--qq-border);
    padding: 18px 22px;
}

.qq-content > .card:not(.card-sidebar) > .card-body,
.qq-content > .panel:not(.panel-sidebar) > .panel-body {
    padding: 24px;
}

.qq-content > h1,
.qq-content > h2,
.qq-content > h3 {
    color: var(--qq-ink);
    font-weight: 800;
    letter-spacing: 0;
}

.qq-page-heading,
.qq-order-heading {
    color: #ffffff;
    background:
        linear-gradient(118deg, #061725 0%, #07314f 58%, #0a657f 100%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    padding: 30px 0 34px;
}

.qq-order-heading {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.qq-page-heading-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.qq-page-eyebrow {
    color: #b6ece5;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
    margin: 0 0 8px;
}

.qq-page-heading h1,
.qq-order-heading h1 {
    color: #ffffff;
    font-size: 36px;
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0;
}

.qq-page-signal {
    min-width: 180px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    color: #d9e9ef;
    font-size: 13px;
    font-weight: 800;
}

.qq-page-signal span {
    min-width: 42px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 6px;
}

.qq-page-signal strong {
    color: #d9e9ef;
    font-size: 13px;
}

.is-shopping-cart .qq-breadcrumb {
    display: none;
}

.template-homepage .qq-breadcrumb {
    display: none;
}

.template-homepage .qq-main-body {
    padding: 0 0 64px;
}

.template-homepage .qq-main-body > .container {
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

.template-homepage .qq-layout-row {
    margin-left: 0;
    margin-right: 0;
}

.template-homepage .qq-content {
    padding-left: 0;
    padding-right: 0;
}

.qq-home .container {
    max-width: 1200px;
}

.qq-home,
.qq-hawaii-grid,
.qq-hero-copy,
.qq-pacific-board {
    min-width: 0;
}

.qq-home {
    overflow-x: hidden;
}

.qqpw-next .card,
.qqpw-next .panel,
.qqpw-next .modal-content,
.qqpw-next .table-container,
.qqpw-next .client-home-cards .card {
    background: var(--qq-surface);
    border: 1px solid var(--qq-border);
    border-radius: 6px;
    box-shadow: var(--qq-shadow-sm);
}

.qqpw-next .card-header,
.qqpw-next .panel-heading {
    background: #ffffff;
    border-bottom: 1px solid var(--qq-border);
    border-radius: 6px 6px 0 0;
}

.qqpw-next .card-title,
.qqpw-next .panel-title {
    color: var(--qq-ink);
    font-weight: 800;
}

.qqpw-next .btn {
    border-radius: 6px;
    font-weight: 800;
    letter-spacing: 0;
}

.qqpw-next .btn-primary,
.qqpw-next .btn-success {
    color: #ffffff;
    background: var(--qq-teal);
    border-color: var(--qq-teal);
}

.qqpw-next .btn-primary:hover,
.qqpw-next .btn-success:hover {
    background: var(--qq-teal-dark);
    border-color: var(--qq-teal-dark);
}

.qqpw-next .btn-default,
.qqpw-next .btn-outline-primary {
    color: var(--qq-ink);
    background: #ffffff;
    border-color: var(--qq-border-strong);
}

.qqpw-next .btn-default:hover,
.qqpw-next .btn-outline-primary:hover {
    color: var(--qq-teal-dark);
    background: #e8f4f2;
    border-color: #b6d8d4;
}

.qqpw-next .btn-danger {
    color: #ffffff;
    background: var(--qq-red);
    border-color: var(--qq-red);
}

.qqpw-next .form-control,
.qqpw-next .custom-select,
.qqpw-next select,
.qqpw-next textarea {
    min-height: 42px;
    border-color: var(--qq-border-strong);
    border-radius: 6px;
    color: var(--qq-ink);
    box-shadow: none;
}

.qqpw-next .form-control:focus,
.qqpw-next .custom-select:focus,
.qqpw-next textarea:focus {
    border-color: var(--qq-teal);
    box-shadow: 0 0 0 3px rgba(15, 143, 132, 0.14);
}

.qqpw-next label,
.qqpw-next .form-control-label {
    color: var(--qq-ink-2);
    font-weight: 800;
}

.qqpw-next .alert {
    border-radius: 6px;
    border-width: 1px;
    box-shadow: var(--qq-shadow-sm);
}

.qqpw-next .alert-info {
    color: #0b4d68;
    background: #e8f5f8;
    border-color: #b8dce7;
}

.qqpw-next .alert-warning {
    color: #6e4707;
    background: #fff4d8;
    border-color: #f1d18e;
}

.qqpw-next .alert-danger {
    color: #7a1d16;
    background: #fde7e5;
    border-color: #f4b7b2;
}

.qq-sidebar {
    position: sticky;
    top: 18px;
    color: #d7e3ea;
    background:
        linear-gradient(180deg, #061725 0%, #071927 100%);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 10px;
    box-shadow: 0 18px 42px rgba(4, 17, 28, 0.18);
    padding: 10px;
}

.qq-sidebar + .qq-sidebar {
    margin-top: 16px;
}

.qq-sidebar .list-group,
.qq-sidebar .panel,
.qq-sidebar .card {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
}

.qq-sidebar .panel-heading,
.qq-sidebar .card-header {
    color: #86d7cf;
    background: transparent;
    border: 0;
    padding: 10px 10px 8px;
}

.qq-sidebar .panel-title,
.qq-sidebar .card-title,
.qq-sidebar .panel-heading h3,
.qq-sidebar .card-header h3 {
    color: #d7e3ea;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.qq-sidebar .list-group {
    display: grid;
    gap: 3px;
}

.qq-sidebar .list-group-item {
    color: #d7e3ea;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 7px;
    margin: 0;
    padding: 10px 11px;
    font-weight: 700;
}

.qqpw-next .list-group-item {
    border-color: var(--qq-border);
    color: var(--qq-ink-2);
}

.qq-sidebar a.list-group-item:hover,
.qq-sidebar a.list-group-item:focus,
.qqpw-next a.list-group-item:hover,
.qqpw-next a.list-group-item:focus {
    color: var(--qq-teal-dark);
    background: #e8f4f2;
    text-decoration: none;
}

.qq-sidebar a.list-group-item:hover,
.qq-sidebar a.list-group-item:focus {
    color: #ffffff;
    background: rgba(15, 143, 132, 0.20);
    border-color: rgba(134, 215, 207, 0.22);
}

.qq-sidebar .list-group-item.active,
.qq-sidebar .list-group-item.active:hover,
.qq-sidebar .list-group-item.active:focus {
    color: #ffffff;
    background: rgba(15, 143, 132, 0.32);
    border-color: rgba(134, 215, 207, 0.34);
}

.qqpw-next .list-group-item.active {
    color: #ffffff;
    background: var(--qq-ink);
    border-color: var(--qq-ink);
}

.qq-sidebar .sidebar-menu-item-wrapper {
    display: flex;
    align-items: center;
    gap: 9px;
}

.qq-sidebar .sidebar-menu-item-icon-wrapper {
    color: #86d7cf;
}

.qq-sidebar .sidebar-menu-item-badge,
.qq-sidebar .badge {
    color: #061725;
    background: var(--qq-sand);
    border-radius: 999px;
}

.qq-hawaii-hero {
    position: relative;
    color: #ffffff;
    background:
        linear-gradient(118deg, #061725 0%, #07314f 46%, #0b6f8e 100%);
    overflow: hidden;
    padding: 58px 0 64px;
}

.qq-hawaii-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
    background-size: 72px 72px;
    opacity: 0.26;
    pointer-events: none;
}

.qq-hawaii-grid {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.03fr) minmax(360px, 0.97fr);
    align-items: center;
    gap: 42px;
}

.qq-hawaii-hero .qq-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #b6ece5;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    padding: 7px 12px;
}

.qq-hawaii-hero h1 {
    max-width: 720px;
    color: #ffffff;
    font-size: 56px;
    line-height: 1.04;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0 0 18px;
    overflow-wrap: anywhere;
}

.qq-hawaii-hero .qq-hero-line {
    max-width: 640px;
    color: #d9e9ef;
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 28px;
}

.qq-hawaii-hero .btn {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-left: 18px;
    padding-right: 18px;
}

.qq-hawaii-hero .btn-default {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.10);
    border-color: rgba(255, 255, 255, 0.22);
}

.qq-hawaii-hero .btn-default:hover,
.qq-hawaii-hero .btn-default:focus {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.16);
}

.qq-hero-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    max-width: 620px;
    margin-top: 28px;
}

.qq-hero-metrics div {
    min-height: 74px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    padding: 14px;
}

.qq-hero-metrics strong,
.qq-hero-metrics span {
    display: block;
}

.qq-hero-metrics strong {
    color: #ffffff;
    font-size: 22px;
    line-height: 1;
}

.qq-hero-metrics span {
    color: #b8d2dc;
    font-size: 12px;
    font-weight: 800;
    margin-top: 8px;
}

.qq-pacific-board {
    background: rgba(4, 17, 28, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.25);
    padding: 18px;
}

.qq-board-top,
.qq-node-row,
.qq-board-footer {
    display: flex;
    align-items: center;
}

.qq-board-top {
    justify-content: space-between;
    color: #d9e9ef;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    padding-bottom: 14px;
}

.qq-board-top span {
    font-weight: 800;
}

.qq-board-top em {
    color: var(--qq-sand);
    font-style: normal;
    font-weight: 800;
}

.qq-node-stack {
    display: grid;
    gap: 12px;
    padding: 18px 0;
}

.qq-node-row {
    gap: 14px;
    color: #ffffff;
    background: #ffffff;
    border-radius: 8px;
    padding: 14px;
    color: var(--qq-ink);
}

.qq-node-code {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--qq-ocean);
    border-radius: 8px;
    font-weight: 800;
}

.qq-node-row div {
    min-width: 0;
    flex: 1;
}

.qq-node-row strong,
.qq-node-row small,
.qq-node-row em {
    display: block;
}

.qq-node-row strong {
    color: var(--qq-ink);
    font-size: 16px;
    overflow-wrap: anywhere;
}

.qq-node-row small {
    color: var(--qq-muted);
    font-weight: 700;
    margin-top: 3px;
}

.qq-node-row em {
    color: var(--qq-green);
    font-style: normal;
    font-weight: 800;
}

.qq-board-footer {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.qq-board-footer div {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 8px;
    padding: 14px;
}

.qq-board-footer strong,
.qq-board-footer span {
    display: block;
}

.qq-board-footer strong {
    color: #ffffff;
}

.qq-board-footer span {
    color: #b8d2dc;
    font-size: 12px;
    font-weight: 800;
}

.qq-proof-band {
    background: #ffffff;
    border-bottom: 1px solid var(--qq-border);
    padding: 22px 0;
}

.qq-proof-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.qq-proof-card {
    min-height: 106px;
    display: grid;
    grid-template-columns: 44px 1fr;
    column-gap: 14px;
    align-items: center;
    color: var(--qq-ink);
    background: #f7fbfd;
    border: 1px solid var(--qq-border);
    border-radius: 8px;
    padding: 16px;
}

.qq-proof-card i {
    width: 44px;
    height: 44px;
    grid-row: span 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--qq-ocean);
    border-radius: 8px;
}

.qq-proof-card:nth-child(2) i {
    background: var(--qq-teal);
}

.qq-proof-card:nth-child(3) i {
    background: var(--qq-gold);
}

.qq-proof-card strong {
    display: block;
    font-size: 15px;
    font-weight: 800;
}

.qq-proof-card span {
    color: var(--qq-muted);
    font-size: 13px;
    line-height: 1.5;
}

.qq-portal-hero {
    min-height: 360px;
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
    align-items: center;
    gap: 28px;
    color: #ffffff;
    background:
        linear-gradient(135deg, #17181c 0%, #20242b 50%, #1d312f 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    padding: 42px;
    box-shadow: var(--qq-shadow);
    overflow: hidden;
}

.qq-eyebrow {
    color: #a9ddd6;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 13px;
    margin: 0 0 10px;
}

.qq-hero-copy h1 {
    color: #ffffff;
    font-size: 58px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0 0 16px;
}

.qq-hero-line {
    max-width: 540px;
    color: #d6dde5;
    font-size: 17px;
    margin-bottom: 24px;
}

.qq-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.qq-hero-console {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    padding: 16px;
}

.qq-console-row {
    display: grid;
    grid-template-columns: 12px 1fr auto;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    color: #ffffff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.qq-console-row:last-child {
    border-bottom: 0;
}

.qq-console-row span {
    width: 10px;
    height: 10px;
    background: #2fd2a4;
    border-radius: 50%;
}

.qq-console-row strong {
    font-size: 18px;
}

.qq-console-row em {
    color: #f4c15d;
    font-style: normal;
    font-weight: 800;
}

.qq-section {
    margin-top: 34px;
}

.qq-home .qq-section {
    margin-top: 0;
    padding-top: 48px;
}

.qq-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.qq-section-heading h2 {
    margin: 0;
    color: var(--qq-ink);
    font-size: 28px;
    font-weight: 800;
}

.qq-section-kicker {
    color: var(--qq-ocean);
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 800;
    margin: 0 0 5px;
}

.qq-heading-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--qq-ocean);
    background: #ffffff;
    border: 1px solid var(--qq-border);
    border-radius: 6px;
    padding: 9px 12px;
    font-weight: 800;
    text-decoration: none;
}

.qq-heading-link:hover,
.qq-heading-link:focus {
    color: var(--qq-ocean-dark);
    border-color: #aacde3;
    text-decoration: none;
}

.qq-product-grid,
.qq-action-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.qq-product-card,
.qq-action-card {
    position: relative;
    min-height: 184px;
    display: flex;
    flex-direction: column;
    color: var(--qq-ink);
    background: #ffffff;
    border: 1px solid var(--qq-border);
    border-radius: 8px;
    box-shadow: var(--qq-shadow-sm);
    text-decoration: none;
    padding: 22px;
}

.qq-product-card::before,
.qq-action-card::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
    background: var(--qq-ocean);
}

.qq-product-card:nth-child(3n + 2)::before,
.qq-action-card:nth-child(3n + 2)::before {
    background: var(--qq-teal);
}

.qq-product-card:nth-child(3n)::before,
.qq-action-card:nth-child(3n)::before {
    background: var(--qq-gold);
}

.qq-product-card:hover,
.qq-action-card:hover {
    color: var(--qq-ink);
    border-color: #a9d7d2;
    box-shadow: var(--qq-shadow);
    text-decoration: none;
}

.qq-product-card-icon,
.qq-action-card i {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: var(--qq-ocean);
    border-radius: 8px;
    margin-bottom: 16px;
}

.qq-product-card:nth-child(3n + 2) .qq-product-card-icon,
.qq-action-card:nth-child(3n + 2) i {
    background: var(--qq-teal);
}

.qq-product-card:nth-child(3n) .qq-product-card-icon,
.qq-action-card:nth-child(3n) i {
    background: var(--qq-gold);
}

.qq-product-card h3 {
    font-size: 20px;
    font-weight: 800;
    margin: 0 0 8px;
}

.qq-card-meta {
    color: var(--qq-muted);
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 800;
    margin-bottom: 7px;
}

.qq-product-card p {
    flex: 1;
    color: var(--qq-muted);
    margin-bottom: 18px;
    line-height: 1.55;
}

.qq-action-card {
    min-height: 164px;
}

.qq-action-card span {
    display: block;
    color: var(--qq-ink);
    font-weight: 800;
    margin-bottom: 8px;
}

.qq-action-card p {
    color: var(--qq-muted);
    line-height: 1.55;
    margin: 0;
}

.template-knowledgebase .kb-search {
    border-radius: 8px;
    box-shadow: var(--qq-shadow-sm);
}

.template-knowledgebase .kb-search .form-control {
    min-height: 52px;
    border-right: 0;
    border-radius: 8px 0 0 8px;
    font-weight: 600;
}

.template-knowledgebase .kb-search .btn {
    min-width: 98px;
    border-radius: 0 8px 8px 0;
}

.template-knowledgebase .kb-category {
    overflow: hidden;
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.template-knowledgebase .kb-category:hover {
    transform: translateY(-2px);
    border-color: #a9d7d2;
    box-shadow: var(--qq-shadow);
}

.template-knowledgebase .kb-category .card-body {
    color: var(--qq-ink);
    text-decoration: none;
}

.template-knowledgebase .kb-category .h5 {
    display: block;
    color: var(--qq-teal-dark);
    font-size: 21px;
    font-weight: 800;
}

.template-knowledgebase .kb-category .h5 i {
    margin-right: 8px;
}

.template-knowledgebase .kb-category .badge {
    float: right;
    margin-left: 12px;
}

.template-knowledgebase .kb-article-item {
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 0 8px;
    padding: 14px 18px;
}

.template-knowledgebase .kb-article-item small {
    grid-column: 2;
    color: var(--qq-muted);
    line-height: 1.45;
    margin-top: 3px;
}

.template-announcements .qq-content > .card > .card-body {
    padding: 26px 28px;
}

.template-announcements .announcements .announcement {
    position: relative;
    padding: 24px 0 30px;
    border-bottom: 1px solid var(--qq-border);
}

.template-announcements .announcements .announcement:first-child {
    padding-top: 14px;
}

.template-announcements .announcements .announcement:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.template-announcements .announcements .announcement h1 {
    font-size: 30px;
    line-height: 1.18;
    letter-spacing: 0;
    margin: 0 0 10px;
}

.template-announcements .announcements .announcement h1 a {
    color: var(--qq-teal-dark);
    text-decoration: none;
}

.template-announcements .announcements .announcement h1 a:hover {
    color: var(--qq-ocean);
}

.template-announcements .announcements .announcement article {
    color: var(--qq-ink-2);
    background: #f7fbfd;
    border-left: 3px solid var(--qq-teal);
    border-radius: 0 6px 6px 0;
    padding: 16px 18px;
    line-height: 1.6;
    margin: 14px 0 16px;
}

.template-announcements .announcements .announcement .list-inline {
    margin-bottom: 0;
}

.template-announcements .announcements .announcement .btn {
    min-height: 36px;
}

.tiles {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: var(--qq-shadow-sm);
}

.tiles .tile {
    min-height: 138px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    color: var(--qq-ink);
    background: #ffffff;
    border: 1px solid var(--qq-border);
    padding: 22px;
}

.tiles .tile:hover {
    color: var(--qq-ink);
    background: #f9fbfb;
    text-decoration: none;
}

.tiles .tile i {
    color: var(--qq-teal);
    font-size: 22px;
    margin-bottom: 12px;
}

.tiles .tile .stat {
    color: var(--qq-ink);
    font-size: 34px;
    font-weight: 800;
    line-height: 1;
}

.tiles .tile .title {
    color: var(--qq-muted);
    font-weight: 800;
}

.tiles .tile .highlight {
    height: 3px;
}

.qqpw-next .dataTables_wrapper {
    color: var(--qq-ink-2);
}

.qqpw-next .dataTables_wrapper .dataTables_length,
.qqpw-next .dataTables_wrapper .dataTables_filter,
.qqpw-next .dataTables_wrapper .dataTables_info,
.qqpw-next .dataTables_wrapper .dataTables_paginate {
    color: var(--qq-muted);
    font-size: 13px;
    font-weight: 700;
}

.qqpw-next .dataTables_wrapper .dataTables_length select,
.qqpw-next .dataTables_wrapper .dataTables_filter input {
    min-height: 36px;
    color: var(--qq-ink);
    background: #ffffff;
    border: 1px solid var(--qq-border-strong);
    border-radius: 6px;
    box-shadow: none;
}

.qqpw-next .dataTables_wrapper .dataTables_paginate .paginate_button {
    border: 1px solid var(--qq-border);
    border-radius: 6px !important;
    color: var(--qq-ink-2) !important;
    background: #ffffff !important;
    margin-left: 4px;
}

.qqpw-next .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.qqpw-next .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: #ffffff !important;
    background: var(--qq-teal) !important;
    border-color: var(--qq-teal) !important;
}

.table-container {
    padding: 0;
    overflow: hidden;
}

.qqpw-next .table {
    margin-bottom: 0;
    background: #ffffff;
}

.qqpw-next .table thead th {
    color: var(--qq-muted);
    background: #f7f9fb;
    border-bottom: 1px solid var(--qq-border);
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 800;
}

.qqpw-next .table tbody td {
    border-color: var(--qq-border);
    vertical-align: middle;
}

.qqpw-next .table tbody tr:hover {
    background: #f6fbfa;
}

.qqpw-next .table-list tbody tr {
    cursor: pointer;
}

.qqpw-next .table-list tbody td:first-child {
    border-left: 3px solid transparent;
}

.qqpw-next .table-list tbody tr:hover td:first-child {
    border-left-color: var(--qq-teal);
}

.label.status,
.qqpw-next .badge {
    border-radius: 6px;
    font-weight: 800;
    padding: 5px 8px;
}

.status-active,
.status-completed,
.badge-success {
    color: #ffffff;
    background: var(--qq-green);
}

.status-pending,
.badge-warning {
    color: #17181c;
    background: #f4c15d;
}

.status-suspended,
.status-cancelled,
.status-terminated,
.badge-danger {
    color: #ffffff;
    background: var(--qq-red);
}

.product-status {
    border-radius: 8px;
    overflow: hidden;
    background:
        linear-gradient(135deg, #071927 0%, #07314f 58%, #0f8f84 100%);
    box-shadow: var(--qq-shadow-sm);
}

.product-status .product-icon,
.product-status .product-status-text {
    color: #ffffff;
}

.product-status .product-icon h3,
.product-status .product-icon h4 {
    color: #ffffff;
    font-weight: 800;
    letter-spacing: 0;
}

.product-status .product-status-text {
    background: rgba(0, 0, 0, 0.20);
    font-weight: 800;
}

.product-details .card,
.product-details-tab-container {
    border-radius: 8px;
    border: 1px solid var(--qq-border);
    box-shadow: var(--qq-shadow-sm);
}

.responsive-tabs-sm .nav-link,
.qqpw-next .nav-tabs .nav-link {
    color: var(--qq-muted);
    border-radius: 6px 6px 0 0;
    font-weight: 800;
}

.responsive-tabs-sm .nav-link.active,
.qqpw-next .nav-tabs .nav-link.active {
    color: var(--qq-ink);
    border-color: var(--qq-border) var(--qq-border) #ffffff;
    background: #ffffff;
}

.product-details-tab-container {
    padding: 20px;
}

.product-actions-wrapper .btn {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.template-login .login-form {
    max-width: 560px;
    margin: 0 auto;
}

.template-login .login-form .card {
    border-radius: 8px;
    box-shadow: var(--qq-shadow);
}

.template-login .login-form .card-body {
    padding: 42px !important;
}

.template-login .login-form h6 {
    color: var(--qq-ink);
    font-weight: 800;
}

.domain-search {
    background: #20242b;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.domain-search .form-control {
    min-height: 52px;
    border-radius: 6px 0 0 6px;
}

.domain-search .btn {
    min-height: 52px;
}

.qq-footer {
    color: #d7dee6;
    background:
        linear-gradient(118deg, #061725 0%, #07314f 62%, #0a5f86 100%);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding: 34px 0;
}

.qq-footer-grid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.qq-footer-copy {
    color: #aeb7c2;
    margin: 12px 0 0;
}

.qq-footer-links {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.qq-social-links {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.qq-social-links .list-inline-item {
    margin-right: 0;
}

.qq-footer-links a,
.qq-locale-btn {
    color: #d7dee6;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    padding: 8px 10px;
}

.qq-footer-links a:hover,
.qq-locale-btn:hover {
    color: #ffffff;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.12);
}

.modal-localisation .modal-content {
    color: #ffffff;
    background: #17181c;
}

body.qqpw-next:not(.template-homepage):not(.is-shopping-cart) .qq-content > h1:first-child {
    display: none;
}

body.qqpw-next .qq-sidebar .list-group-item,
body.qqpw-next .qq-sidebar a.list-group-item {
    color: #d7e3ea;
    background: transparent;
    border-color: transparent;
}

body.qqpw-next .qq-sidebar a.list-group-item:hover,
body.qqpw-next .qq-sidebar a.list-group-item:focus {
    color: #ffffff;
    background: rgba(15, 143, 132, 0.20);
    border-color: rgba(134, 215, 207, 0.22);
}

body.qqpw-next .qq-sidebar .list-group-item.active,
body.qqpw-next .qq-sidebar .list-group-item.active:hover,
body.qqpw-next .qq-sidebar .list-group-item.active:focus {
    color: #ffffff;
    background: rgba(15, 143, 132, 0.32);
    border-color: rgba(134, 215, 207, 0.34);
}

.qqpw-next .qq-content > .alert,
.qqpw-next .qq-content > .card,
.qqpw-next .qq-content > .panel,
.qqpw-next .qq-content .client-home-panels .card,
.qqpw-next .qq-content .client-home-panels .panel,
.qqpw-next .qq-content .client-home-cards .card,
.qqpw-next .qq-content .domain-checker-container,
.qqpw-next .qq-content .invoice-container,
.qqpw-next .qq-content .ticket-reply,
.qqpw-next .qq-content .ticket-details,
.qqpw-next .qq-content .ticket-actions {
    border-radius: 8px;
}

.qqpw-next .qq-content > .card,
.qqpw-next .qq-content > .panel,
.qqpw-next .qq-content .client-home-panels .card,
.qqpw-next .qq-content .client-home-panels .panel,
.qqpw-next .qq-content .client-home-cards .card {
    border: 1px solid rgba(7, 49, 79, 0.12);
    box-shadow: 0 14px 34px rgba(17, 24, 39, 0.07);
}

.qqpw-next .qq-content .card-header,
.qqpw-next .qq-content .panel-heading {
    background:
        linear-gradient(180deg, #ffffff 0%, #f7fbfd 100%);
    border-bottom: 1px solid var(--qq-border);
    padding: 16px 18px;
}

.qqpw-next .qq-content .card-header:first-child,
.qqpw-next .qq-content .panel-heading:first-child {
    border-radius: 8px 8px 0 0;
}

.qqpw-next .qq-content .card-title,
.qqpw-next .qq-content .panel-title,
.qqpw-next .qq-content .panel-heading h3 {
    color: var(--qq-ink);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0;
}

.qqpw-next .qq-content .panel-body,
.qqpw-next .qq-content .card-body {
    color: var(--qq-ink-2);
}

.qqpw-next .tiles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
    gap: 12px;
    overflow: visible;
    border-radius: 0;
    box-shadow: none;
}

.qqpw-next .tiles .tile {
    position: relative;
    min-height: 116px;
    overflow: hidden;
    border: 1px solid rgba(7, 49, 79, 0.12);
    border-radius: 8px;
    box-shadow: 0 10px 26px rgba(17, 24, 39, 0.06);
    padding: 18px 18px 18px 22px;
}

.qqpw-next .tiles .tile::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 4px;
    background: var(--qq-ocean);
}

.qqpw-next .tiles .tile:nth-child(3n + 2)::before {
    background: var(--qq-teal);
}

.qqpw-next .tiles .tile:nth-child(3n)::before {
    background: var(--qq-gold);
}

.qqpw-next .tiles .tile i {
    position: absolute;
    right: 18px;
    top: 18px;
    color: rgba(7, 49, 79, 0.18);
    font-size: 28px;
    margin: 0;
}

.qqpw-next .tiles .tile .stat {
    color: var(--qq-ink);
    font-size: 30px;
}

.qqpw-next .tiles .tile .title {
    color: var(--qq-muted);
    max-width: 120px;
    line-height: 1.35;
}

.qqpw-next .table-container,
.qqpw-next .dataTables_wrapper {
    border-radius: 8px;
}

.qqpw-next .table-container {
    border: 1px solid rgba(7, 49, 79, 0.12);
    box-shadow: 0 14px 34px rgba(17, 24, 39, 0.07);
    background: #ffffff;
}

.qqpw-next .dataTables_wrapper .dataTables_length,
.qqpw-next .dataTables_wrapper .dataTables_filter {
    margin-bottom: 12px;
}

.qqpw-next .table thead th {
    color: #d7e3ea;
    background: #071927;
    border-color: rgba(255, 255, 255, 0.08);
}

.qqpw-next .table tbody td {
    background: #ffffff;
}

.qqpw-next .table tbody tr:hover td {
    background: #f3fbfa;
}

.qqpw-next .pagination > li > a,
.qqpw-next .pagination > li > span,
.qqpw-next .page-link {
    color: var(--qq-ink-2);
    border-color: var(--qq-border);
    border-radius: 6px;
    margin-left: 4px;
}

.qqpw-next .pagination > .active > a,
.qqpw-next .pagination > .active > span,
.qqpw-next .page-item.active .page-link {
    color: #ffffff;
    background: var(--qq-teal);
    border-color: var(--qq-teal);
}

.qqpw-next .nav-tabs {
    gap: 6px;
    border-bottom: 0;
    background: #eaf1f5;
    border: 1px solid var(--qq-border);
    border-radius: 8px;
    padding: 5px;
}

.qqpw-next .nav-tabs .nav-item {
    margin-bottom: 0;
}

.qqpw-next .nav-tabs .nav-link,
.responsive-tabs-sm .nav-link {
    border: 0;
    border-radius: 6px;
    padding: 9px 12px;
}

.qqpw-next .nav-tabs .nav-link.active,
.responsive-tabs-sm .nav-link.active {
    color: #ffffff;
    background: #071927;
    border-color: #071927;
}

.qqpw-next .tab-content,
.qqpw-next .product-details-tab-container {
    border: 1px solid rgba(7, 49, 79, 0.12);
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(17, 24, 39, 0.07);
    background: #ffffff;
}

.qqpw-next .ticket-reply,
.qqpw-next .ticket-details,
.qqpw-next .ticket-actions,
.qqpw-next .invoice-container,
.qqpw-next .masspay-total,
.qqpw-next .credit-card {
    border: 1px solid rgba(7, 49, 79, 0.12);
    box-shadow: 0 14px 34px rgba(17, 24, 39, 0.07);
    background: #ffffff;
}

.qqpw-next .ticket-reply .user,
.qqpw-next .ticket-reply.staff .user,
.qqpw-next .invoice-summary {
    color: #ffffff;
    background:
        linear-gradient(118deg, #061725 0%, #07314f 62%, #0a5f86 100%);
}

.qqpw-next .ticket-reply .user a,
.qqpw-next .ticket-reply .user .name,
.qqpw-next .invoice-summary * {
    color: #ffffff;
}

.qqpw-next .ticket-reply .message,
.qqpw-next .ticket-reply .attachments {
    color: var(--qq-ink-2);
    background: #ffffff;
}

.qqpw-next .invoice-status {
    border-radius: 8px;
    font-weight: 800;
    letter-spacing: 0;
}

.template-login .login-form .card,
.template-register .qq-content > .card,
.template-contact .qq-content > .card {
    border: 1px solid rgba(7, 49, 79, 0.12);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(17, 24, 39, 0.10);
}

.template-login .login-form .card::before,
.template-register .qq-content > .card::before,
.template-contact .qq-content > .card::before {
    content: "";
    display: block;
    height: 4px;
    background:
        linear-gradient(90deg, var(--qq-ocean), var(--qq-teal), var(--qq-gold));
}

.template-login .logincontainer,
.template-login .login-form {
    max-width: 940px !important;
    width: 100%;
}

.template-login .login-form .card {
    width: 100%;
    max-width: 940px !important;
    display: grid;
    grid-template-columns: minmax(300px, 0.85fr) minmax(420px, 1fr);
    overflow: hidden;
    border: 0;
    box-shadow: 0 26px 70px rgba(7, 49, 79, 0.13);
}

.template-login .login-form .card::before {
    grid-column: 1;
    grid-row: 1 / span 2;
    height: auto;
    min-height: 450px;
    background:
        linear-gradient(180deg, rgba(4, 17, 28, 0.22), rgba(4, 17, 28, 0.78)),
        url("../img/pacific-field.png") center center / cover no-repeat;
}

.template-login .login-form .card-body,
.template-login .login-form .card-footer {
    grid-column: 2;
}

.template-login .login-form .card-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 372px;
}

.template-login .login-form .card-footer {
    background: #f8fbfc;
}

@media (max-width: 1199px) {
    .qq-mainnav .navbar-collapse {
        display: none;
        min-height: 0;
        padding: 12px 0;
        background: #071927;
    }

    .qq-mainnav .navbar-collapse.show {
        display: block;
    }

    .qq-mainnav .navbar-nav {
        align-items: stretch;
        flex-direction: column;
        gap: 6px;
    }

    .qq-mainnav .navbar-nav > li > a,
    .qq-mainnav .nav-link {
        width: 100%;
        justify-content: space-between;
        white-space: normal;
    }

    .qq-mainnav .dropdown-menu {
        position: static !important;
        transform: none !important;
        width: 100%;
        margin: 4px 0 8px;
        box-shadow: none;
        background: rgba(255, 255, 255, 0.98);
    }

    .qq-secondary-nav {
        margin-left: 0;
    }
}

@media (max-width: 991px) {
    .qq-hawaii-grid {
        grid-template-columns: 1fr;
    }

    .qq-portal-hero {
        grid-template-columns: 1fr;
        padding: 32px;
    }

    .qq-product-grid,
    .qq-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .qq-hawaii-hero {
        padding: 34px 0 38px;
    }

    .qq-hawaii-hero h1 {
        max-width: 100%;
        font-size: 31px;
        line-height: 1.08;
    }

    .qq-hawaii-hero .qq-hero-line {
        font-size: 16px;
        max-width: 100%;
        overflow-wrap: break-word;
    }

    .qq-hawaii-grid,
    .qq-hero-copy,
    .qq-hawaii-hero .qq-eyebrow {
        width: 100%;
        max-width: 100%;
    }

    .qq-hero-copy,
    .qq-hawaii-hero .qq-hero-line {
        max-width: 330px;
    }

    .qq-hawaii-hero .qq-eyebrow {
        white-space: normal;
    }

    .qq-hero-metrics,
    .qq-proof-grid,
    .qq-board-footer {
        grid-template-columns: 1fr;
    }

    .qq-hawaii-hero .qq-hero-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .qq-hawaii-hero .btn {
        justify-content: center;
    }

    .qq-node-row {
        display: grid;
        grid-template-columns: 48px minmax(0, 1fr);
        align-items: start;
    }

    .qq-node-row em {
        grid-column: 2;
        margin-top: 3px;
    }

    .qq-section-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .qq-section-heading h2 {
        font-size: 24px;
    }

    .qq-page-heading,
    .qq-order-heading {
        padding: 24px 0 28px;
    }

    .qq-page-heading-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .qq-page-heading h1,
    .qq-order-heading h1 {
        font-size: 28px;
    }

    .qq-page-signal {
        justify-content: flex-start;
    }

    .qq-topbar-grid,
    .qq-navbar-row,
    .qq-footer-grid {
        align-items: stretch;
        flex-direction: column;
    }

    .qq-navbar-row {
        min-height: 0;
        padding: 18px 0;
    }

    .qq-toolbar,
    .qq-active-client,
    .qq-footer-links {
        justify-content: flex-start;
    }

    .qq-active-client {
        flex-wrap: wrap;
    }

    .qq-brand-word {
        font-size: 20px;
    }

    .qq-hero-copy h1 {
        font-size: 44px;
    }

    .qq-portal-hero {
        padding: 24px;
    }

    .qq-product-grid,
    .qq-action-grid {
        grid-template-columns: 1fr;
    }

    .template-login .login-form .card-body {
        padding: 26px !important;
    }
}

@media (max-width: 480px) {
    .qq-hawaii-hero h1 {
        font-size: 29px;
    }

    .qq-hero-copy,
    .qq-hawaii-hero .qq-hero-line {
        max-width: 330px;
    }

    .qq-hawaii-hero .qq-hero-line {
        font-size: 15px;
        line-height: 1.6;
    }

    .qq-hawaii-hero .qq-eyebrow {
        font-size: 11px;
    }
}

/* QQ.PW Pacific iteration: stronger brand, quicker product access, less stock WHMCS chrome. */
:root {
    --qq-reef: #13b9aa;
    --qq-reef-dark: #08766f;
    --qq-coral: #f26d55;
    --qq-sun: #ffbf57;
    --qq-deep: #04111c;
    --qq-foam: #edf7f6;
}

body.qqpw-next {
    background:
        radial-gradient(circle at 84% 0%, rgba(242, 109, 85, 0.10), transparent 28rem),
        linear-gradient(180deg, #f8fbfc 0, #eef5f7 36rem, #f5f8f8 100%);
}

.qq-header {
    background:
        linear-gradient(90deg, rgba(4, 17, 28, 0.96), rgba(6, 35, 54, 0.92)),
        url("../img/pacific-field.png") center 34% / cover no-repeat;
}

.qq-navbar-row {
    min-height: 88px;
}

.qq-brand {
    min-width: 0;
}

.qq-brand .logo-img {
    max-height: 56px;
    width: auto;
}

.qq-brand-mark {
    width: 42px;
    height: 42px;
    background: linear-gradient(135deg, var(--qq-reef), var(--qq-ocean));
}

.qq-brand-word {
    font-size: 26px;
}

.qq-search,
.qq-mobile-search,
.qq-cart-link,
.qq-menu-toggle {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.15);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.qq-search:focus-within,
.qq-mobile-search:focus-within {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(19, 185, 170, 0.55);
}

.qq-mainnav {
    background: rgba(4, 17, 28, 0.88);
    border-color: rgba(255, 255, 255, 0.10);
}

.qq-mainnav .navbar-nav > li > a,
.qq-mainnav .nav-link {
    min-height: 44px;
    border-radius: 8px;
}

.qq-mainnav .navbar-nav > li.show > a,
.qq-mainnav .navbar-nav > li.active > a,
.qq-mainnav .navbar-nav > li > a:hover,
.qq-mainnav .navbar-nav > li > a:focus,
.qq-mainnav .nav-link:hover,
.qq-mainnav .nav-item.show > .nav-link,
.qq-mainnav .nav-link.active {
    background: rgba(19, 185, 170, 0.18);
}

.qq-mainnav .dropdown-menu {
    border: 0;
    border-radius: 8px;
    box-shadow: 0 22px 56px rgba(4, 17, 28, 0.20);
}

.qq-hawaii-hero-v2 {
    min-height: 0;
    background:
        linear-gradient(90deg, rgba(4, 17, 28, 0.92) 0%, rgba(5, 31, 49, 0.78) 42%, rgba(4, 17, 28, 0.20) 100%),
        url("../img/pacific-field.png") center center / cover no-repeat;
    padding: 48px 0 46px;
}

.qq-hawaii-hero-v2::before {
    background:
        radial-gradient(circle at 76% 18%, rgba(255, 191, 87, 0.20), transparent 22rem),
        linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: auto, 96px 96px, 96px 96px;
    opacity: 1;
}

.qq-hawaii-hero-v2::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--qq-ocean), var(--qq-reef), var(--qq-sun), var(--qq-coral));
}

.qq-hawaii-hero-v2 .qq-hawaii-grid {
    grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
    gap: 40px;
}

.qq-hawaii-hero-v2 .qq-eyebrow {
    color: #d8fbf6;
    background: rgba(19, 185, 170, 0.14);
    border-color: rgba(195, 249, 242, 0.20);
    font-size: 12px;
}

.qq-hawaii-hero-v2 h1 {
    max-width: 660px;
    font-size: 50px;
    line-height: 1.02;
    text-wrap: balance;
}

.qq-hawaii-hero-v2 .qq-hero-line {
    max-width: 570px;
    color: #d9edf2;
    font-size: 18px;
    line-height: 1.58;
}

.qq-hawaii-hero-v2 .btn-primary {
    background: linear-gradient(135deg, var(--qq-reef), var(--qq-reef-dark));
    border-color: transparent;
    box-shadow: 0 14px 28px rgba(0, 105, 96, 0.24);
}

.qq-hawaii-hero-v2 .btn-primary:hover {
    background: linear-gradient(135deg, #23cbbb, var(--qq-reef-dark));
}

.qq-hawaii-hero-v2 .btn-default {
    color: #f7fbfd;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.22);
}

.qq-hawaii-hero-v2 .qq-hero-metrics {
    max-width: 580px;
    margin-top: 24px;
}

.qq-hawaii-hero-v2 .qq-hero-metrics div {
    min-height: 68px;
    background: rgba(4, 17, 28, 0.30);
    border-color: rgba(255, 255, 255, 0.13);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.qq-hero-commerce {
    position: relative;
    z-index: 1;
    color: #ffffff;
    background:
        linear-gradient(180deg, rgba(4, 17, 28, 0.82), rgba(5, 26, 41, 0.92));
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    box-shadow: 0 28px 74px rgba(0, 0, 0, 0.32);
    padding: 18px;
    backdrop-filter: blur(8px);
}

.qq-commerce-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.11);
    padding-bottom: 14px;
    margin-bottom: 14px;
}

.qq-commerce-head span,
.qq-commerce-head strong,
.qq-commerce-head em {
    display: block;
}

.qq-commerce-head span {
    color: #9be8df;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.qq-commerce-head strong {
    color: #ffffff;
    font-size: 22px;
    line-height: 1.15;
}

.qq-commerce-head em {
    color: var(--qq-sun);
    background: rgba(255, 191, 87, 0.10);
    border: 1px solid rgba(255, 191, 87, 0.22);
    border-radius: 999px;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    padding: 6px 10px;
    white-space: nowrap;
}

.qq-hero-product-list {
    display: grid;
    gap: 10px;
}

.qq-hero-product {
    min-height: 96px;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 26px;
    align-items: center;
    gap: 14px;
    color: #ffffff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.06));
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 8px;
    padding: 14px;
    text-decoration: none;
}

.qq-hero-product:hover,
.qq-hero-product:focus {
    color: #ffffff;
    background:
        linear-gradient(135deg, rgba(19, 185, 170, 0.24), rgba(255, 255, 255, 0.08));
    border-color: rgba(155, 232, 223, 0.34);
    text-decoration: none;
}

.qq-hero-product-icon {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #04111c;
    background: linear-gradient(135deg, #9be8df, var(--qq-sun));
    border-radius: 8px;
}

.qq-hero-product strong,
.qq-hero-product small {
    display: block;
}

.qq-hero-product strong {
    color: #ffffff;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2;
}

.qq-hero-product small {
    color: #bfd9df;
    display: -webkit-box;
    line-height: 1.45;
    margin-top: 4px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.qq-hero-product > .fa-arrow-right {
    color: #9be8df;
    justify-self: end;
}

.qq-hero-product-accent .qq-hero-product-icon {
    background: linear-gradient(135deg, var(--qq-sun), var(--qq-coral));
}

.qq-pacific-mini-board {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.qq-pacific-mini-board span {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #d9edf2;
    background: rgba(4, 17, 28, 0.44);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 8px;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
}

.qq-proof-band {
    background:
        linear-gradient(180deg, #ffffff 0%, #f2f7f8 100%);
    padding: 20px 0;
}

.qq-proof-card {
    border: 0;
    box-shadow: 0 12px 30px rgba(7, 49, 79, 0.08);
}

.qq-proof-card i {
    background: linear-gradient(135deg, var(--qq-ocean), var(--qq-reef));
}

.qq-proof-card:nth-child(2) i {
    background: linear-gradient(135deg, var(--qq-reef), var(--qq-reef-dark));
}

.qq-proof-card:nth-child(3) i {
    background: linear-gradient(135deg, var(--qq-sun), var(--qq-coral));
}

.qq-page-heading,
.qq-order-heading {
    background:
        linear-gradient(90deg, rgba(4, 17, 28, 0.92), rgba(5, 45, 68, 0.78)),
        url("../img/pacific-field.png") center 44% / cover no-repeat;
}

.qq-page-heading-row {
    min-height: 102px;
}

.qq-page-heading h1,
.qq-order-heading h1 {
    font-size: 40px;
    text-wrap: balance;
}

.qq-page-signal span {
    background: rgba(19, 185, 170, 0.18);
    border-color: rgba(155, 232, 223, 0.26);
}

.qq-main-body {
    background:
        radial-gradient(circle at 84% 0%, rgba(19, 185, 170, 0.10), transparent 22rem),
        linear-gradient(180deg, rgba(255, 255, 255, 0.84) 0, rgba(255, 255, 255, 0) 260px),
        var(--qq-bg);
}

.qqpw-next .qq-content > .card,
.qqpw-next .qq-content > .panel,
.qqpw-next .qq-content .client-home-cards .card,
.qqpw-next .table-container,
.qqpw-next .ticket-reply,
.qqpw-next .ticket-details,
.qqpw-next .ticket-actions,
.qqpw-next .invoice-container {
    border: 0;
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(7, 49, 79, 0.08);
}

.qqpw-next .qq-content .card-header,
.qqpw-next .qq-content .panel-heading {
    background:
        linear-gradient(90deg, rgba(237, 247, 246, 0.92), #ffffff);
    border-bottom-color: rgba(7, 49, 79, 0.08);
}

.qq-sidebar {
    border: 0;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(4, 17, 28, 0.96), rgba(5, 32, 48, 0.96)),
        url("../img/pacific-field.png") left top / 560px auto no-repeat;
}

.qq-product-card,
.qq-action-card,
.qqpw-next .tiles .tile {
    border: 0;
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(7, 49, 79, 0.08);
}

.qq-product-card::before,
.qq-action-card::before {
    height: 4px;
    background: linear-gradient(90deg, var(--qq-ocean), var(--qq-reef), var(--qq-sun));
}

.qq-product-card:hover,
.qq-action-card:hover,
.qqpw-next .tiles .tile:hover {
    transform: translateY(-2px);
    box-shadow: 0 22px 52px rgba(7, 49, 79, 0.12);
}

.qq-footer {
    background:
        linear-gradient(90deg, rgba(4, 17, 28, 0.96), rgba(5, 45, 68, 0.88)),
        url("../img/pacific-field.png") center 82% / cover no-repeat;
}

@media (max-width: 1199px) {
    .qq-hawaii-hero-v2 .qq-hawaii-grid {
        grid-template-columns: 1fr;
    }

    .qq-hero-commerce {
        max-width: 760px;
    }
}

@media (max-width: 767px) {
    .qq-navbar-row {
        padding: 14px 0;
    }

    .qq-brand .logo-img {
        max-height: 48px;
    }

    .qq-hawaii-hero-v2 {
        padding: 32px 0 34px;
    }

    .qq-hawaii-hero-v2 h1 {
        font-size: 34px;
    }

    .qq-hawaii-hero-v2 .qq-hero-line {
        font-size: 16px;
    }

    .qq-hawaii-hero-v2 .qq-hero-metrics {
        display: none;
    }

    .qq-hero-product {
        grid-template-columns: 44px minmax(0, 1fr);
    }

    .qq-hero-product > .fa-arrow-right {
        display: none;
    }

    .qq-pacific-mini-board {
        grid-template-columns: 1fr;
    }

    .qq-page-heading-row {
        min-height: 0;
    }

    .qq-page-heading h1,
    .qq-order-heading h1 {
        font-size: 30px;
    }

    .template-login .login-form .card {
        grid-template-columns: 1fr;
    }

    .template-login .login-form .card::before {
        grid-column: 1;
        grid-row: 1;
        min-height: 170px;
    }

    .template-login .login-form .card-body,
    .template-login .login-form .card-footer {
        grid-column: 1;
    }
}

/* Hawaii refinement v3: lighter homepage, smoother navigation, stronger footer and login identity. */
.qq-home-v3 {
    background:
        linear-gradient(180deg, #f8fcfc 0%, #eef6f7 48%, #f7faf9 100%);
}

.qq-island-hero {
    position: relative;
    color: #ffffff;
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(3, 17, 28, 0.86) 0%, rgba(4, 26, 40, 0.72) 42%, rgba(5, 36, 46, 0.32) 100%),
        url("../img/hawaii-premium-hero.png") center center / cover no-repeat;
    padding: 78px 0 68px;
}

.qq-island-hero::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 5px;
    background: linear-gradient(90deg, #075a99, #13b9aa 38%, #ffbf57 70%, #f26d55);
}

.qq-island-shell {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 470px);
    gap: 54px;
    align-items: center;
}

.qq-island-copy h1 {
    max-width: 760px;
    color: #ffffff;
    font-size: 58px;
    line-height: 1.02;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0 0 18px;
    text-wrap: balance;
}

.qq-island-copy .qq-hero-line {
    max-width: 610px;
    color: #dceff0;
    font-size: 19px;
    line-height: 1.62;
}

.qq-island-copy .qq-eyebrow {
    color: #f7fbfb;
    background: rgba(19, 185, 170, 0.18);
    border-color: rgba(210, 255, 248, 0.20);
}

.qq-island-market {
    background: rgba(3, 17, 28, 0.68);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.28);
    padding: 18px;
    backdrop-filter: blur(10px);
}

.qq-market-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 14px;
    margin-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.qq-market-heading span,
.qq-market-heading strong {
    display: block;
}

.qq-market-heading span {
    color: #9be8df;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.qq-market-heading strong {
    color: #ffffff;
    font-size: 24px;
    line-height: 1.15;
}

.qq-market-list {
    display: grid;
    gap: 10px;
}

.qq-market-row {
    min-height: 92px;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.095);
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 8px;
    padding: 13px;
    text-decoration: none;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.qq-market-row:hover,
.qq-market-row:focus {
    color: #ffffff;
    background: rgba(19, 185, 170, 0.20);
    border-color: rgba(155, 232, 223, 0.36);
    transform: translateY(-1px);
    text-decoration: none;
}

.qq-market-row > span {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #04111c;
    background: linear-gradient(135deg, #9be8df, #ffbf57);
    border-radius: 8px;
}

.qq-market-row strong,
.qq-market-row small {
    display: block;
}

.qq-market-row strong {
    color: #ffffff;
    font-size: 16px;
    font-weight: 800;
}

.qq-market-row small {
    color: #c7dde0;
    line-height: 1.45;
    margin-top: 4px;
}

.qq-market-row em {
    color: #ffcf7a;
    font-style: normal;
    font-weight: 800;
}

.qq-island-strip {
    background: #ffffff;
    border-bottom: 1px solid rgba(7, 49, 79, 0.10);
}

.qq-strip-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    background: rgba(7, 49, 79, 0.08);
}

.qq-strip-grid div {
    min-height: 86px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #ffffff;
    padding: 18px 22px;
}

.qq-strip-grid strong {
    color: #052238;
    font-size: 22px;
    line-height: 1;
}

.qq-strip-grid span {
    color: #667085;
    font-size: 12px;
    font-weight: 800;
    margin-top: 8px;
}

.qq-home-products-compact {
    padding-top: 42px !important;
}

.qq-home-v3 .qq-product-card {
    min-height: 176px;
}

.qq-home-dock {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding-top: 26px !important;
}

.qq-home-dock a {
    min-height: 74px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #07314f;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(7, 49, 79, 0.10);
    border-radius: 8px;
    box-shadow: 0 12px 30px rgba(7, 49, 79, 0.06);
    padding: 14px 16px;
    font-weight: 800;
    text-decoration: none;
}

.qq-home-dock a:hover,
.qq-home-dock a:focus {
    color: #08766f;
    border-color: rgba(19, 185, 170, 0.34);
    transform: translateY(-1px);
    text-decoration: none;
}

.qq-home-dock i {
    color: #13b9aa;
    font-size: 18px;
}

.qq-sidebar,
#order-standard_cart .cart-sidebar {
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(3, 17, 28, 0.97), rgba(5, 34, 48, 0.96)),
        url("../img/hawaii-premium-hero.png") 22% 72% / 860px auto no-repeat;
    box-shadow: 0 24px 62px rgba(4, 17, 28, 0.20);
}

#order-standard_cart .cart-sidebar {
    background:
        linear-gradient(180deg, rgba(3, 17, 28, 0.97), rgba(5, 34, 48, 0.96)),
        url("/templates/qqpw_next/img/hawaii-premium-hero.png") 22% 72% / 860px auto no-repeat;
}

.qq-sidebar .list-group-item,
.qq-sidebar a.list-group-item,
#order-standard_cart .cart-sidebar .list-group-item {
    position: relative;
    overflow: hidden;
    border: 1px solid transparent !important;
    border-radius: 8px;
    box-shadow: none !important;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.qq-sidebar .list-group-item::before,
#order-standard_cart .cart-sidebar .list-group-item::before {
    content: "";
    position: absolute;
    top: 9px;
    bottom: 9px;
    left: 0;
    width: 3px;
    border-radius: 0 999px 999px 0;
    background: linear-gradient(180deg, #13b9aa, #ffbf57);
    opacity: 0;
    transition: opacity 0.18s ease;
}

.qq-sidebar a.list-group-item:hover,
.qq-sidebar a.list-group-item:focus,
.qq-sidebar .list-group-item.active,
.qq-sidebar .list-group-item.active:hover,
.qq-sidebar .list-group-item.active:focus,
#order-standard_cart .cart-sidebar .list-group-item:hover,
#order-standard_cart .cart-sidebar .list-group-item:focus,
#order-standard_cart .cart-sidebar .list-group-item.active {
    color: #ffffff !important;
    background: rgba(19, 185, 170, 0.15) !important;
    border-color: rgba(155, 232, 223, 0.20) !important;
    transform: translateX(2px);
}

.qq-sidebar a.list-group-item:hover::before,
.qq-sidebar a.list-group-item:focus::before,
.qq-sidebar .list-group-item.active::before,
#order-standard_cart .cart-sidebar .list-group-item:hover::before,
#order-standard_cart .cart-sidebar .list-group-item:focus::before,
#order-standard_cart .cart-sidebar .list-group-item.active::before {
    opacity: 1;
}

.qq-sidebar .panel-heading,
.qq-sidebar .card-header,
#order-standard_cart .cart-sidebar .panel-heading {
    background: rgba(255, 255, 255, 0.075);
    border-radius: 8px;
}

.template-login .login-form .card::before {
    background:
        linear-gradient(180deg, rgba(3, 17, 28, 0.10), rgba(3, 17, 28, 0.62)),
        url("../img/hawaii-login-panel.png") center center / cover no-repeat;
}

.template-login .login-form .card {
    position: relative;
}

.template-login .login-form .card::after {
    content: "";
    position: absolute;
    left: 34px;
    bottom: 34px;
    max-width: 320px;
    color: #ffffff;
    white-space: pre-line;
    font-size: 28px;
    line-height: 1.12;
    font-weight: 800;
    text-shadow: 0 2px 18px rgba(0, 0, 0, 0.40);
    pointer-events: none;
}

.template-homepage .qq-main-body {
    padding: 0 !important;
}

.qq-footer {
    background:
        linear-gradient(90deg, rgba(3, 17, 28, 0.96), rgba(4, 42, 57, 0.90)),
        url("../img/hawaii-premium-hero.png") center 74% / cover no-repeat;
    padding: 44px 0 26px;
}

.qq-footer-shell {
    display: grid;
    grid-template-columns: minmax(260px, 1.4fr) minmax(130px, 0.65fr) minmax(140px, 0.65fr) minmax(190px, 0.8fr);
    gap: 34px;
    align-items: start;
}

.qq-footer-brand-block p {
    max-width: 430px;
    color: #b8cbd2;
    line-height: 1.7;
    margin: 14px 0 16px;
}

.qq-footer-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.qq-footer-badges span {
    color: #dbfbf6;
    background: rgba(19, 185, 170, 0.14);
    border: 1px solid rgba(155, 232, 223, 0.20);
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 800;
}

.qq-footer-nav,
.qq-footer-action-block {
    display: grid;
    gap: 10px;
}

.qq-footer-nav strong,
.qq-footer-action-block strong {
    color: #ffffff;
    font-size: 13px;
    text-transform: uppercase;
}

.qq-footer-nav a,
.qq-footer-action-block a,
.qq-footer-action-block .qq-locale-btn {
    width: fit-content;
    color: #c8d9df;
    background: transparent;
    border: 0;
    border-radius: 8px;
    padding: 0;
    text-decoration: none;
}

.qq-footer-nav a:hover,
.qq-footer-action-block a:hover {
    color: #ffffff;
    text-decoration: none;
}

.qq-footer-action-block .qq-footer-cta,
.qq-footer-action-block .qq-locale-btn {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.13);
    padding: 9px 12px;
}

.qq-footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    margin-top: 34px;
    padding-top: 18px;
}

.qq-footer-bottom .qq-footer-copy {
    margin: 0;
}

#order-standard_cart .products > .row > [class*="col-"],
#order-standard_cart .products > .row-eq-height > [class*="col-"] {
    display: flex;
}

#order-standard_cart .products .product {
    min-height: 282px;
    height: 100%;
    align-items: start;
}

#order-standard_cart .products .product footer {
    align-self: stretch;
}

#order-standard_cart .products .product div.product-pricing {
    min-height: 104px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (max-width: 991px) {
    .qq-island-shell,
    .qq-footer-shell {
        grid-template-columns: 1fr;
    }

    .qq-strip-grid,
    .qq-home-dock {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .qq-island-copy h1 {
        font-size: 44px;
    }
}

@media (max-width: 767px) {
    .qq-island-hero {
        padding: 42px 0 38px;
    }

    .qq-island-copy h1 {
        font-size: 34px;
    }

    .qq-island-copy .qq-hero-line {
        font-size: 16px;
    }

    .qq-market-row {
        grid-template-columns: 44px minmax(0, 1fr);
    }

    .qq-market-row em {
        display: none;
    }

    .qq-strip-grid,
    .qq-home-dock {
        grid-template-columns: 1fr;
    }

    .template-login .login-form .card::after {
        top: 44px;
        bottom: auto;
        left: 26px;
        font-size: 22px;
    }

    .qq-footer-bottom {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Hawaii refinement v4: efficient first viewport, smoother sidebars, stronger mobile rhythm. */
.qq-home-v4 {
    background:
        radial-gradient(circle at 78% -8%, rgba(242, 109, 85, 0.13), transparent 26rem),
        linear-gradient(180deg, #f8fcfc 0%, #eef7f7 46%, #f7faf8 100%);
}

.qq-atoll-hero {
    position: relative;
    color: #ffffff;
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(3, 17, 28, 0.90) 0%, rgba(4, 25, 39, 0.78) 46%, rgba(4, 38, 48, 0.34) 100%),
        url("../img/hawaii-premium-hero.png") center center / cover no-repeat;
    padding: 62px 0 52px;
}

.qq-atoll-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 108px 108px;
    opacity: 0.42;
    pointer-events: none;
}

.qq-atoll-hero::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 5px;
    background: linear-gradient(90deg, #075a99, #13b9aa 40%, #ffbf57 72%, #f26d55);
}

.qq-atoll-shell {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 0.96fr) minmax(390px, 0.82fr);
    gap: 48px;
    align-items: center;
}

.qq-atoll-copy {
    min-width: 0;
}

.qq-atoll-copy .qq-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #e9fffb;
    background: rgba(19, 185, 170, 0.18);
    border: 1px solid rgba(210, 255, 248, 0.20);
    border-radius: 999px;
    padding: 8px 12px;
}

.qq-atoll-copy h1 {
    max-width: 760px;
    color: #ffffff;
    font-size: 56px;
    line-height: 1.02;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0 0 18px;
    text-wrap: balance;
}

.qq-atoll-copy .qq-hero-line {
    max-width: 620px;
    color: #dceff0;
    font-size: 18px;
    line-height: 1.62;
    margin-bottom: 24px;
}

.qq-atoll-copy .btn {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    padding-left: 18px;
    padding-right: 18px;
}

.qq-atoll-copy .btn-primary {
    background: linear-gradient(135deg, #13b9aa, #08766f);
    border-color: transparent;
    box-shadow: 0 14px 28px rgba(0, 105, 96, 0.24);
}

.qq-atoll-copy .btn-default {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.09);
    border-color: rgba(255, 255, 255, 0.24);
}

.qq-atoll-signals {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    max-width: 690px;
    margin-top: 26px;
}

.qq-atoll-signals span {
    min-height: 64px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #bfd9df;
    background: rgba(4, 17, 28, 0.34);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 12px;
    font-weight: 800;
}

.qq-atoll-signals strong {
    color: #ffffff;
    font-size: 20px;
    line-height: 1;
    margin-bottom: 7px;
}

.qq-atoll-order {
    min-width: 0;
    color: #ffffff;
    background:
        linear-gradient(180deg, rgba(3, 17, 28, 0.72), rgba(4, 24, 38, 0.90));
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    box-shadow: 0 28px 76px rgba(0, 0, 0, 0.32);
    padding: 18px;
    backdrop-filter: blur(10px);
}

.qq-atoll-order-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    padding-bottom: 14px;
    margin-bottom: 12px;
}

.qq-atoll-order-head span,
.qq-atoll-order-head strong,
.qq-atoll-order-head em {
    display: block;
}

.qq-atoll-order-head span {
    color: #9be8df;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.qq-atoll-order-head strong {
    color: #ffffff;
    font-size: 24px;
    line-height: 1.15;
}

.qq-atoll-order-head em {
    color: #ffcf7a;
    background: rgba(255, 191, 87, 0.10);
    border: 1px solid rgba(255, 191, 87, 0.22);
    border-radius: 999px;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    padding: 6px 10px;
    white-space: nowrap;
}

.qq-atoll-products {
    display: grid;
    gap: 10px;
}

.qq-atoll-product {
    min-height: 86px;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 24px;
    align-items: center;
    gap: 13px;
    color: #ffffff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.06));
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 8px;
    padding: 13px;
    text-decoration: none;
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.qq-atoll-product:hover,
.qq-atoll-product:focus {
    color: #ffffff;
    background:
        linear-gradient(135deg, rgba(19, 185, 170, 0.24), rgba(255, 255, 255, 0.08));
    border-color: rgba(155, 232, 223, 0.34);
    box-shadow: inset 0 0 0 1px rgba(155, 232, 223, 0.12);
    text-decoration: none;
}

.qq-atoll-product-icon {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #04111c;
    background: linear-gradient(135deg, #9be8df, #ffbf57);
    border-radius: 8px;
}

.qq-atoll-product-alt .qq-atoll-product-icon {
    background: linear-gradient(135deg, #13b9aa, #9be8df);
}

.qq-atoll-product-domain .qq-atoll-product-icon {
    background: linear-gradient(135deg, #ffbf57, #f26d55);
}

.qq-atoll-product strong,
.qq-atoll-product small {
    display: block;
}

.qq-atoll-product strong {
    color: #ffffff;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 800;
}

.qq-atoll-product small {
    color: #c7dde0;
    display: -webkit-box;
    line-height: 1.45;
    margin-top: 4px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.qq-atoll-product > .fa-arrow-right {
    color: #9be8df;
    justify-self: end;
}

.qq-atoll-order-foot {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.qq-atoll-order-foot span {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #d9edf2;
    background: rgba(4, 17, 28, 0.44);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 8px;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
}

.qq-atoll-strip {
    background: #ffffff;
    border-bottom: 1px solid rgba(7, 49, 79, 0.10);
}

.qq-home-v4 .qq-home-products-compact {
    padding-top: 38px !important;
}

.qq-home-v4 .qq-product-card {
    min-height: 168px;
}

.qq-home-v4 .qq-home-dock {
    padding-top: 22px !important;
    padding-bottom: 42px;
}

.qq-brand .logo-img {
    max-height: 64px;
}

.qq-navbar-row {
    min-height: 92px;
}

.qq-sidebar,
#order-standard_cart .cart-sidebar {
    border-radius: 8px;
}

.qq-sidebar .list-group,
#order-standard_cart .cart-sidebar .list-group {
    gap: 5px;
}

.qq-sidebar .list-group-item,
.qq-sidebar a.list-group-item,
#order-standard_cart .cart-sidebar .list-group-item {
    position: relative;
    overflow: hidden;
    border: 1px solid transparent !important;
    border-radius: 8px;
    box-shadow: none !important;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.qq-sidebar .list-group-item::before,
#order-standard_cart .cart-sidebar .list-group-item::before {
    content: "";
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 8px;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(180deg, #13b9aa, #ffbf57);
    opacity: 0;
    transform: scaleY(0.55);
    transform-origin: center;
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.qq-sidebar a.list-group-item:hover,
.qq-sidebar a.list-group-item:focus,
.qq-sidebar .list-group-item.active,
.qq-sidebar .list-group-item.active:hover,
.qq-sidebar .list-group-item.active:focus,
#order-standard_cart .cart-sidebar .list-group-item:hover,
#order-standard_cart .cart-sidebar .list-group-item:focus,
#order-standard_cart .cart-sidebar .list-group-item.active {
    color: #ffffff !important;
    background:
        linear-gradient(90deg, rgba(19, 185, 170, 0.20), rgba(255, 255, 255, 0.055)) !important;
    border-color: rgba(155, 232, 223, 0.24) !important;
    box-shadow: inset 0 0 0 1px rgba(155, 232, 223, 0.06) !important;
    transform: none;
}

.qq-sidebar a.list-group-item:hover::before,
.qq-sidebar a.list-group-item:focus::before,
.qq-sidebar .list-group-item.active::before,
#order-standard_cart .cart-sidebar .list-group-item:hover::before,
#order-standard_cart .cart-sidebar .list-group-item:focus::before,
#order-standard_cart .cart-sidebar .list-group-item.active::before {
    opacity: 1;
    transform: scaleY(1);
}

.template-login .login-form .card {
    border-radius: 8px;
    box-shadow: 0 28px 80px rgba(7, 49, 79, 0.14);
}

.template-login .login-form .card::before {
    background:
        linear-gradient(180deg, rgba(3, 17, 28, 0.08), rgba(3, 17, 28, 0.58)),
        url("../img/hawaii-premium-hero.png") center center / cover no-repeat;
}

.template-login .login-form .card::after {
    content: "";
    left: 34px;
    bottom: 34px;
    max-width: 330px;
    color: #ffffff;
    white-space: pre-line;
    font-size: 27px;
    line-height: 1.12;
    font-weight: 800;
    text-shadow: 0 2px 18px rgba(0, 0, 0, 0.44);
}

.template-login .login-form .card-body {
    padding: 44px !important;
}

.template-login .login-form .input-group,
.template-login .login-form .form-control {
    border-radius: 8px;
}

.qq-footer {
    position: relative;
    overflow: hidden;
    padding: 48px 0 26px;
}

.qq-footer::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 4px;
    background: linear-gradient(90deg, #075a99, #13b9aa, #ffbf57, #f26d55);
}

.qq-footer-shell {
    position: relative;
    z-index: 1;
}

.qq-footer-brand .qq-brand-mark {
    width: 44px;
    height: 44px;
}

.qq-footer-nav a,
.qq-footer-action-block a {
    transition: color 0.16s ease, transform 0.16s ease;
}

.qq-footer-nav a:hover,
.qq-footer-action-block a:hover {
    transform: translateX(2px);
}

@media (max-width: 1199px) {
    .qq-atoll-shell {
        grid-template-columns: 1fr;
    }

    .qq-atoll-order {
        max-width: 760px;
    }

    .qq-mainnav .dropdown.show > .dropdown-menu {
        display: block;
    }
}

@media (max-width: 767px) {
    .qq-navbar-row {
        min-height: 0;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: 12px 0;
    }

    .qq-brand .logo-img {
        max-height: 52px;
    }

    .qq-toolbar {
        margin-left: auto;
        justify-content: flex-end;
    }

    .qq-atoll-hero {
        padding: 34px 0 32px;
    }

    .qq-atoll-copy h1 {
        font-size: 34px;
    }

    .qq-atoll-copy .qq-hero-line {
        font-size: 16px;
        line-height: 1.58;
    }

    .qq-atoll-signals {
        display: none;
    }

    .qq-atoll-order {
        padding: 14px;
    }

    .qq-atoll-order-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .qq-atoll-product {
        grid-template-columns: 44px minmax(0, 1fr);
        min-height: 82px;
    }

    .qq-atoll-product > .fa-arrow-right {
        display: none;
    }

    .qq-atoll-order-foot,
    .qq-strip-grid,
    .qq-home-dock {
        grid-template-columns: 1fr;
    }

    .template-login .login-form .card::before {
        min-height: 158px;
    }

    .template-login .login-form .card::after {
        top: 38px;
        bottom: auto;
        left: 24px;
        max-width: 280px;
        font-size: 21px;
    }

    .template-login .login-form .card-body {
        padding: 28px !important;
    }

    .qq-footer-shell {
        gap: 24px;
    }
}

@media (max-width: 420px) {
    .qq-atoll-copy h1 {
        font-size: 31px;
    }

    .qq-atoll-copy .btn {
        width: 100%;
        justify-content: center;
    }

    .qq-hero-actions {
        width: 100%;
    }
}

/* Client Area refinement v1: make the logged-in console feel like a product dashboard. */
.template-clientareahome .qq-page-heading,
.template-clientareaproducts .qq-page-heading,
.template-clientareaproductdetails .qq-page-heading {
    background:
        linear-gradient(96deg, rgba(3, 17, 28, 0.94), rgba(5, 50, 63, 0.84)),
        url("../img/hawaii-premium-hero.png") center 54% / cover no-repeat;
}

.qq-client-area-shell,
.qq-services-console,
.qq-product-console {
    min-width: 0;
}

.qq-client-command {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(230px, auto);
    gap: 22px;
    align-items: center;
    color: #ffffff;
    background:
        linear-gradient(124deg, rgba(3, 17, 28, 0.96), rgba(6, 57, 77, 0.88)),
        url("../img/hawaii-premium-hero.png") center 58% / cover no-repeat;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    box-shadow: 0 24px 62px rgba(7, 49, 79, 0.14);
    padding: 26px;
    margin-bottom: 18px;
}

.qq-client-command::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4px;
    background: linear-gradient(90deg, #075a99, #13b9aa 42%, #ffbf57 72%, #f26d55);
}

.qq-client-command-copy {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.qq-client-kicker,
.qq-client-section-head span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #9be8df;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.qq-client-command h2,
.qq-client-section-head h2 {
    color: inherit;
    font-size: 30px;
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: 0;
    margin: 8px 0 9px;
}

.qq-client-command p {
    max-width: 610px;
    color: #d7e8ec;
    font-size: 15px;
    line-height: 1.62;
    margin: 0;
}

.qq-client-command-actions {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.qq-client-command-actions a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    padding: 10px 12px;
    font-weight: 800;
    text-align: center;
    text-decoration: none;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.qq-client-command-actions a:hover,
.qq-client-command-actions a:focus {
    color: #ffffff;
    background: rgba(19, 185, 170, 0.22);
    border-color: rgba(155, 232, 223, 0.36);
    text-decoration: none;
}

.qq-client-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 24px;
}

.qq-client-stat {
    position: relative;
    min-height: 124px;
    overflow: hidden;
    display: grid;
    align-content: end;
    color: var(--qq-ink);
    background: #ffffff;
    border: 1px solid rgba(7, 49, 79, 0.10);
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(17, 24, 39, 0.07);
    padding: 18px;
    text-decoration: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.qq-client-stat::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: var(--qq-ocean);
}

.qq-client-stat:hover,
.qq-client-stat:focus {
    color: var(--qq-ink);
    border-color: rgba(19, 185, 170, 0.28);
    box-shadow: 0 18px 44px rgba(7, 49, 79, 0.11);
    transform: translateY(-1px);
    text-decoration: none;
}

.qq-client-stat span {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: #07314f;
    border-radius: 8px;
}

.qq-client-stat strong,
.qq-client-stat em {
    position: relative;
    z-index: 1;
    display: block;
}

.qq-client-stat strong {
    color: #071927;
    font-size: 34px;
    line-height: 1;
    font-weight: 800;
    margin-bottom: 8px;
}

.qq-client-stat em {
    color: #667085;
    font-size: 13px;
    font-style: normal;
    font-weight: 800;
}

.qq-stat-teal::before,
.qq-stat-teal span {
    background: var(--qq-teal);
}

.qq-stat-gold::before,
.qq-stat-gold span {
    background: linear-gradient(135deg, #ffbf57, #c9822b);
}

.qq-stat-coral::before,
.qq-stat-coral span {
    background: linear-gradient(135deg, #f26d55, #b42318);
}

.qq-client-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 12px;
}

.qq-client-section-head h2 {
    color: #071927;
    font-size: 24px;
    margin-bottom: 0;
}

.qq-client-panels .card.qq-client-panel,
.qq-client-addon > .card,
.qq-client-addon > .panel {
    border: 1px solid rgba(7, 49, 79, 0.10);
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(17, 24, 39, 0.06);
}

.qq-client-panels .qq-client-panel .card-header {
    background:
        linear-gradient(180deg, #ffffff, #f6fbfb);
    border-bottom: 1px solid rgba(7, 49, 79, 0.08);
}

.qq-client-panels .qq-client-panel .list-group-item {
    border-color: rgba(7, 49, 79, 0.08);
    padding: 13px 16px;
}

.qq-client-panels .qq-client-panel a.list-group-item:hover,
.qq-client-panels .qq-client-panel a.list-group-item:focus {
    color: #07314f;
    background: #f3fbfa;
}

.qq-services-command {
    margin-bottom: 16px;
}

.qq-services-table {
    overflow-x: auto;
}

.qq-services-table #tableServicesList tbody tr {
    transition: background 0.16s ease;
}

.qq-services-table #tableServicesList tbody td:nth-child(2) strong {
    color: #071927;
    font-size: 15px;
}

.qq-services-table #tableServicesList tbody td:nth-child(2) a {
    color: #0f8f84;
    font-size: 13px;
    font-weight: 700;
}

.qq-services-table #tableServicesList .btn-sm {
    min-height: 34px;
    border-radius: 8px;
    font-weight: 800;
}

.qq-product-main-tabs {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.qq-product-overview-card {
    overflow: hidden;
    border: 1px solid rgba(7, 49, 79, 0.10) !important;
    border-radius: 8px;
    box-shadow: 0 18px 46px rgba(7, 49, 79, 0.09) !important;
}

.qq-product-overview-card > .card-body {
    padding: 22px !important;
    background:
        linear-gradient(135deg, #ffffff 0%, #f7fbfb 100%);
}

.qq-product-overview-card .product-details > .row {
    align-items: stretch;
}

.qq-product-overview-card .product-status {
    height: 100%;
    min-height: 230px;
    display: grid;
    grid-template-rows: 1fr auto;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: none;
}

.qq-product-overview-card .product-status .product-icon {
    display: grid;
    place-items: center;
    align-content: center;
    background:
        linear-gradient(135deg, rgba(3, 17, 28, 0.92), rgba(5, 83, 94, 0.84)),
        url("../img/hawaii-premium-hero.png") center 58% / cover no-repeat;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    padding: 28px 20px;
}

.qq-product-overview-card .product-status .fa-stack {
    width: 64px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #9be8df;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(155, 232, 223, 0.24);
    border-radius: 8px;
    font-size: 24px;
    line-height: 1;
}

.qq-product-overview-card .product-status .fa-stack .fa-circle {
    display: none;
}

.qq-product-overview-card .product-status .fa-stack .fa-stack-1x {
    position: static;
    color: #9be8df !important;
    font-size: 24px;
    line-height: 1;
}

.qq-product-overview-card .product-status .product-icon h3 {
    max-width: 420px;
    font-size: 26px;
    line-height: 1.15;
    margin: 12px auto 6px;
}

.qq-product-overview-card .product-status .product-icon h4 {
    color: #bfe4e5;
    font-size: 13px;
    text-transform: uppercase;
}

.qq-product-overview-card .product-status .product-status-text {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
}

.qq-product-facts {
    text-align: left !important;
    color: #071927;
    background: #ffffff;
    border: 1px solid rgba(7, 49, 79, 0.10);
    border-radius: 8px;
    padding: 22px 24px !important;
}

.qq-product-facts h4 {
    color: #667085;
    font-size: 11px;
    line-height: 1.3;
    font-weight: 800;
    text-transform: uppercase;
    margin: 0 0 4px;
}

.qq-product-facts h4:not(:first-child) {
    margin-top: 16px;
}

.product-actions-wrapper {
    gap: 8px 0;
    margin-top: 10px;
}

.product-actions-wrapper > div + div {
    margin-top: 8px;
}

.product-actions-wrapper .btn {
    border-radius: 8px;
    box-shadow: none;
}

.qq-product-console .nav-tabs {
    margin-top: 18px;
}

.qq-product-console .product-details-tab-container {
    padding: 24px;
}

.qq-product-console .tab-pane .row {
    row-gap: 10px;
}

.qq-product-console .tab-pane strong {
    color: #071927;
}

.qq-product-console .badge-lg,
.qq-product-console .badge {
    border-radius: 999px;
}

.qqpw-next .qq-sidebar .list-group-item,
.qqpw-next .qq-sidebar a.list-group-item,
#order-standard_cart .cart-sidebar .list-group-item {
    padding-left: 18px;
    transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease, box-shadow 0.22s ease;
}

.qqpw-next .qq-sidebar .list-group-item::before,
#order-standard_cart .cart-sidebar .list-group-item::before {
    top: 50%;
    bottom: auto;
    left: 9px;
    height: calc(100% - 20px);
    transform: translateY(-50%) scaleY(0.35);
}

.qqpw-next .qq-sidebar a.list-group-item:hover::before,
.qqpw-next .qq-sidebar a.list-group-item:focus::before,
.qqpw-next .qq-sidebar .list-group-item.active::before,
#order-standard_cart .cart-sidebar .list-group-item:hover::before,
#order-standard_cart .cart-sidebar .list-group-item:focus::before,
#order-standard_cart .cart-sidebar .list-group-item.active::before {
    transform: translateY(-50%) scaleY(1);
}

@media (max-width: 991px) {
    .qq-layout-row > [class*="col-lg-4"] {
        order: 2;
    }

    .qq-layout-row > .qq-content {
        order: 1;
    }

    .qq-client-command {
        grid-template-columns: 1fr;
    }

    .qq-client-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .qq-client-command-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .qq-product-overview-card .product-status {
        height: auto;
        min-height: 210px;
        margin-bottom: 14px;
    }
}

@media (max-width: 767px) {
    .qq-client-command {
        padding: 20px;
    }

    .qq-client-command h2 {
        font-size: 25px;
    }

    .qq-client-command-actions {
        grid-template-columns: 1fr;
    }

    .qq-client-stat-grid {
        gap: 10px;
    }

    .qq-client-stat {
        min-height: 98px;
        padding: 16px;
    }

    .qq-client-stat strong {
        font-size: 29px;
    }

    .qq-client-section-head h2 {
        font-size: 21px;
    }

    .template-clientareaproducts .dataTables_wrapper .dataTables_length,
    .template-clientareaproducts .dataTables_wrapper .dataTables_filter {
        float: none;
        width: 100%;
        text-align: left;
    }

    .template-clientareaproducts .dataTables_wrapper .dataTables_filter input {
        width: 100%;
        margin: 6px 0 0;
    }

    .template-clientareaproducts #tableServicesList,
    .template-clientareaproducts #tableServicesList tbody,
    .template-clientareaproducts #tableServicesList tr,
    .template-clientareaproducts #tableServicesList td {
        display: block;
        width: 100% !important;
    }

    .template-clientareaproducts #tableServicesList thead {
        display: none;
    }

    .template-clientareaproducts #tableServicesList tr {
        position: relative;
        overflow: hidden;
        background: #ffffff;
        border: 1px solid rgba(7, 49, 79, 0.10);
        border-radius: 8px;
        box-shadow: 0 12px 30px rgba(7, 49, 79, 0.06);
        padding: 14px 14px 15px;
        margin-bottom: 12px;
    }

    .template-clientareaproducts #tableServicesList tr::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 4px;
        background: linear-gradient(180deg, #075a99, #13b9aa, #ffbf57);
    }

    .template-clientareaproducts #tableServicesList td {
        border: 0 !important;
        padding: 6px 4px 6px 10px !important;
        text-align: left !important;
    }

    .template-clientareaproducts #tableServicesList td:first-child {
        position: absolute;
        top: 12px;
        right: 12px;
        width: auto !important;
        padding: 0 !important;
    }

    .template-clientareaproducts #tableServicesList td:nth-child(3)::before,
    .template-clientareaproducts #tableServicesList td:nth-child(4)::before,
    .template-clientareaproducts #tableServicesList td:nth-child(5)::before {
        display: block;
        color: #667085;
        font-size: 11px;
        font-weight: 800;
        text-transform: uppercase;
        margin-bottom: 2px;
    }

    .template-clientareaproducts #tableServicesList td:nth-child(3)::before {
        content: "Billing";
    }

    .template-clientareaproducts #tableServicesList td:nth-child(4)::before {
        content: "Next due";
    }

    .template-clientareaproducts #tableServicesList td:nth-child(5)::before {
        content: "Status";
    }

    .template-clientareaproducts #tableServicesList td:nth-child(5) br {
        display: none;
    }

    .template-clientareaproducts #tableServicesList td:nth-child(5) .btn {
        margin-top: 9px;
    }

    .qq-product-overview-card > .card-body,
    .qq-product-console .product-details-tab-container {
        padding: 16px !important;
    }

    .qq-product-overview-card .product-status .product-icon h3 {
        font-size: 22px;
    }

    .qq-product-facts {
        padding: 18px !important;
    }

    .qq-product-console .nav-tabs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
        width: 100%;
        background: #e9f3f5 !important;
        border: 1px solid rgba(7, 49, 79, 0.12);
        border-radius: 8px;
        padding-bottom: 6px;
        -webkit-overflow-scrolling: touch;
    }

    .qq-product-console .nav-tabs .nav-item {
        min-width: 0;
        width: 100%;
        margin: 0 !important;
        border: 0 !important;
    }

    .qq-product-console .responsive-tabs-sm .nav-item a {
        min-height: 48px;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        color: #667085 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 8px !important;
        padding: 10px 12px !important;
        line-height: 1.22;
        text-align: center;
        white-space: normal;
    }

    .qq-product-console .responsive-tabs-sm .nav-item a.active {
        color: #ffffff !important;
        background: #071927 !important;
    }

    .qq-product-console .responsive-tabs-sm-connector {
        display: none !important;
    }

    .qq-product-console .product-details-tab-container .row > [class*="col-sm-"] {
        text-align: left !important;
    }
}

@media (max-width: 340px) {
    .qq-client-stat-grid {
        grid-template-columns: 1fr;
    }
}

/* Hawaii sunlight refinement v5: brighter island palette across public, cart, and client pages. */
:root {
    --qq-bg: #f3fbfb;
    --qq-surface-2: #e9f8f6;
    --qq-border: #cfe6e5;
    --qq-border-strong: #afd6d5;
    --qq-ocean: #087fb0;
    --qq-pacific: #076073;
    --qq-teal: #0aa79a;
    --qq-teal-dark: #08766f;
    --qq-gold: #e49a2f;
    --qq-sand: #ffd78c;
    --qq-red: #df5b46;
    --qq-shadow: 0 22px 54px rgba(7, 96, 115, 0.12);
    --qq-shadow-sm: 0 10px 26px rgba(7, 96, 115, 0.08);
}

body.qqpw-next {
    background:
        linear-gradient(180deg, #f7ffff 0, #ecf9f8 430px, #f8fcfb 100%);
}

.qq-header {
    color: #07314f;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(236, 250, 249, 0.93)),
        url("../img/hawaii-sunrise-hero.png") center 42% / cover no-repeat;
    border-bottom: 1px solid rgba(10, 167, 154, 0.18);
    box-shadow: 0 12px 30px rgba(7, 96, 115, 0.08);
}

.qq-topbar {
    color: #084a57;
    background: rgba(255, 246, 224, 0.88);
    border-bottom: 1px solid rgba(228, 154, 47, 0.24);
}

.qq-alert-trigger,
.qq-client-name,
.qq-icon-link,
.qq-return-admin,
.qq-cart-link,
.qq-menu-toggle {
    color: #07314f;
    background: rgba(255, 255, 255, 0.76);
    border-color: rgba(8, 127, 176, 0.16);
}

.qq-alert-trigger:hover,
.qq-alert-trigger:focus,
.qq-client-name:hover,
.qq-icon-link:hover,
.qq-return-admin:hover,
.qq-cart-link:hover,
.qq-menu-toggle:hover {
    color: #075f68;
    background: #ffffff;
    border-color: rgba(10, 167, 154, 0.32);
}

.qq-search,
.qq-mobile-search {
    background: rgba(255, 255, 255, 0.82);
    border-color: rgba(8, 127, 176, 0.18);
    box-shadow: 0 10px 28px rgba(7, 96, 115, 0.06);
}

.qq-search input,
.qq-mobile-search input {
    color: #07314f;
}

.qq-search input::placeholder,
.qq-mobile-search input::placeholder {
    color: #66808c;
}

.qq-search-submit {
    color: #087fb0;
}

.qq-mainnav {
    background: rgba(255, 255, 255, 0.90);
    border-top: 1px solid rgba(255, 255, 255, 0.54);
    border-bottom: 1px solid rgba(8, 127, 176, 0.12);
}

.qq-mainnav .navbar-nav > li > a,
.qq-mainnav .navbar-nav > li > .nav-link,
.qq-mainnav .dropdown-toggle {
    color: #07314f !important;
}

.qq-mainnav .navbar-nav > li > a:hover,
.qq-mainnav .navbar-nav > li > .nav-link:hover,
.qq-mainnav .dropdown-toggle:hover,
.qq-mainnav .dropdown.show > .dropdown-toggle {
    color: #08766f !important;
}

.qq-mainnav .dropdown-menu {
    background: #ffffff;
    border: 1px solid rgba(8, 127, 176, 0.14);
    box-shadow: 0 18px 42px rgba(7, 96, 115, 0.14);
}

.qq-mainnav .dropdown-menu a {
    color: #07314f !important;
}

.qq-mainnav .dropdown-menu a:hover,
.qq-mainnav .dropdown-menu a:focus {
    color: #08766f !important;
    background: #effaf8;
}

.qq-breadcrumb {
    background: #ffffff;
    border-bottom: 1px solid rgba(8, 127, 176, 0.10);
}

.qq-page-heading,
.qq-order-heading,
.template-clientareahome .qq-page-heading,
.template-clientareaproducts .qq-page-heading,
.template-clientareaproductdetails .qq-page-heading {
    color: #07314f;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.58) 42%, rgba(255, 255, 255, 0.24)),
        url("../img/hawaii-sunrise-hero.png") center 48% / cover no-repeat;
}

.qq-page-heading h1,
.qq-order-heading h1,
.qq-page-heading .qq-page-eyebrow,
.qq-order-heading .qq-page-eyebrow {
    color: #07314f;
}

.qq-page-signal {
    color: #07314f;
    background: rgba(255, 255, 255, 0.64);
    border-color: rgba(10, 167, 154, 0.24);
}

.qq-page-signal span {
    color: #ffffff;
    background: linear-gradient(135deg, #087fb0, #0aa79a);
}

.qq-home-sun,
.qq-home-v4 {
    background:
        radial-gradient(circle at 86% 2%, rgba(255, 215, 140, 0.26), transparent 28rem),
        linear-gradient(180deg, #f7ffff 0%, #edfafa 52%, #fffaf0 100%);
}

.qq-atoll-hero {
    color: #07314f;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.88) 0%, rgba(255, 255, 255, 0.64) 42%, rgba(255, 255, 255, 0.16) 100%),
        url("../img/hawaii-sunrise-hero.png") center center / cover no-repeat;
    padding: 58px 0 50px;
}

.qq-atoll-hero::before {
    background:
        linear-gradient(90deg, rgba(8, 127, 176, 0.045) 1px, transparent 1px),
        linear-gradient(180deg, rgba(8, 127, 176, 0.040) 1px, transparent 1px);
    opacity: 0.55;
}

.qq-atoll-copy h1,
.qq-atoll-copy .qq-eyebrow {
    color: #07314f;
}

.qq-atoll-copy .qq-hero-line {
    color: #38535f;
}

.qq-atoll-copy .qq-eyebrow {
    background: rgba(255, 255, 255, 0.62);
    border-color: rgba(10, 167, 154, 0.24);
}

.qq-atoll-copy .btn-primary,
.qqpw-next .btn-primary {
    color: #ffffff;
    background: linear-gradient(135deg, #0bb8a8, #087fb0);
    border-color: transparent;
    box-shadow: 0 14px 28px rgba(8, 127, 176, 0.20);
}

.qq-atoll-copy .btn-default,
.qqpw-next .btn-default {
    color: #07314f;
    background: rgba(255, 255, 255, 0.74);
    border-color: rgba(8, 127, 176, 0.20);
}

.qq-atoll-signals span {
    color: #3e5d68;
    background: rgba(255, 255, 255, 0.70);
    border-color: rgba(8, 127, 176, 0.13);
}

.qq-atoll-signals strong {
    color: #07314f;
}

.qq-atoll-order,
.qq-client-command,
.qq-services-command {
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(236, 250, 249, 0.76)),
        url("../img/hawaii-sunrise-hero.png") center center / cover no-repeat;
    border-color: rgba(8, 127, 176, 0.16);
    box-shadow: 0 24px 58px rgba(7, 96, 115, 0.14);
}

.qq-atoll-order-head {
    border-bottom-color: rgba(8, 127, 176, 0.14);
}

.qq-atoll-order-head span,
.qq-client-kicker,
.qq-client-section-head span {
    color: #08766f;
}

.qq-atoll-order-head strong,
.qq-client-command h2 {
    color: #07314f;
}

.qq-atoll-order-head em {
    color: #8a5311;
    background: rgba(255, 215, 140, 0.68);
    border-color: rgba(228, 154, 47, 0.28);
}

.qq-client-command p {
    color: #38535f;
}

.qq-atoll-product,
.qq-client-command-actions a {
    color: #07314f;
    background: rgba(255, 255, 255, 0.74);
    border-color: rgba(8, 127, 176, 0.16);
}

.qq-atoll-product:hover,
.qq-atoll-product:focus,
.qq-client-command-actions a:hover,
.qq-client-command-actions a:focus {
    color: #07314f;
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(10, 167, 154, 0.34);
}

.qq-atoll-product strong {
    color: #07314f;
}

.qq-atoll-product small {
    color: #506b76;
}

.qq-atoll-product > .fa-arrow-right {
    color: #087fb0;
}

.qq-atoll-order-foot span {
    color: #38535f;
    background: rgba(255, 255, 255, 0.64);
    border-color: rgba(8, 127, 176, 0.13);
}

.qq-strip-grid {
    background: rgba(8, 127, 176, 0.11);
}

.qq-strip-grid div,
.qq-product-card,
.qq-client-stat,
.qqpw-next .table-container,
.qqpw-next .qq-content > .card,
.qqpw-next .qq-content > .panel,
.qqpw-next .qq-content .client-home-cards .card {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(8, 127, 176, 0.12);
    box-shadow: 0 16px 38px rgba(7, 96, 115, 0.08);
}

.qq-product-card::before,
.qq-client-stat::before {
    background: linear-gradient(90deg, #087fb0, #0aa79a 48%, #ffd78c 74%, #df5b46);
}

.qq-product-card-icon,
.qq-client-stat span,
.qq-atoll-product-icon {
    background: linear-gradient(135deg, #0aa79a, #ffd78c);
}

.qq-sidebar,
#order-standard_cart .cart-sidebar {
    color: #07314f;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(238, 250, 248, 0.92)),
        url("../img/hawaii-sunrise-hero.png") 40% 82% / 900px auto no-repeat;
    border: 1px solid rgba(8, 127, 176, 0.14);
    box-shadow: 0 20px 48px rgba(7, 96, 115, 0.12);
}

.qq-sidebar .panel-heading,
.qq-sidebar .card-header,
#order-standard_cart .cart-sidebar .panel-heading {
    color: #07314f;
    background: rgba(255, 255, 255, 0.70);
    border-color: rgba(8, 127, 176, 0.12);
}

body.qqpw-next .qq-sidebar .list-group-item,
body.qqpw-next .qq-sidebar a.list-group-item,
#order-standard_cart .cart-sidebar .list-group-item {
    color: #07314f;
    background: rgba(255, 255, 255, 0.52);
}

body.qqpw-next .qq-sidebar a.list-group-item:hover,
body.qqpw-next .qq-sidebar a.list-group-item:focus,
body.qqpw-next .qq-sidebar .list-group-item.active,
body.qqpw-next .qq-sidebar .list-group-item.active:hover,
body.qqpw-next .qq-sidebar .list-group-item.active:focus,
#order-standard_cart .cart-sidebar .list-group-item:hover,
#order-standard_cart .cart-sidebar .list-group-item:focus,
#order-standard_cart .cart-sidebar .list-group-item.active {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: rgba(10, 167, 154, 0.34) !important;
    box-shadow: inset 0 0 0 1px rgba(10, 167, 154, 0.08) !important;
}

.qq-footer {
    color: #07314f;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(237, 250, 248, 0.92)),
        url("../img/hawaii-sunrise-hero.png") center 78% / cover no-repeat;
    border-top: 1px solid rgba(8, 127, 176, 0.14);
}

.qq-footer::before {
    background: linear-gradient(90deg, #087fb0, #0aa79a, #ffd78c, #df5b46);
}

.qq-footer-brand,
.qq-footer-brand:hover,
.qq-footer-nav strong,
.qq-footer-action-block strong {
    color: #07314f;
}

.qq-footer-brand-block p,
.qq-footer-copy,
.qq-footer-nav a,
.qq-footer-action-block a {
    color: #38535f;
}

.qq-footer-nav a:hover,
.qq-footer-action-block a:hover {
    color: #08766f;
}

.qq-footer-badges span {
    color: #075f68;
    background: rgba(255, 255, 255, 0.66);
    border-color: rgba(10, 167, 154, 0.22);
}

.qq-footer-action-block .qq-footer-cta,
.qq-footer-action-block .qq-locale-btn {
    color: #07314f;
    background: rgba(255, 255, 255, 0.70);
    border-color: rgba(8, 127, 176, 0.18);
}

.qq-footer-bottom {
    border-top-color: rgba(8, 127, 176, 0.16);
}

.template-login .login-form .card::before,
.qq-product-overview-card .product-status .product-icon {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.10), rgba(7, 96, 115, 0.38)),
        url("../img/hawaii-sunrise-hero.png") center center / cover no-repeat;
}

.template-login .login-form .card::after {
    color: #ffffff;
    text-shadow: 0 2px 18px rgba(7, 49, 79, 0.34);
}

.qq-product-overview-card .product-status {
    background: linear-gradient(135deg, #087fb0, #0aa79a);
}

.qq-product-overview-card .product-status .fa-stack {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.30);
}

.qq-product-overview-card .product-status .fa-stack .fa-stack-1x,
.qq-product-overview-card .product-status .product-icon h4 {
    color: #dffdf8 !important;
}

@media (max-width: 767px) {
    .qq-atoll-hero {
        background-position: 58% center;
    }

    .qq-page-heading,
    .qq-order-heading {
        background-position: 54% center;
    }

    .qq-mainnav .collapse.show {
        background: rgba(255, 255, 255, 0.96);
    }

    .qq-mobile-search {
        background: #ffffff;
    }
}

/* v5.1 contrast pass for light Hawaii sidebars. */
body.qqpw-next .qq-sidebar .panel-heading,
body.qqpw-next .qq-sidebar .card-header,
body.qqpw-next .qq-sidebar .panel-title,
body.qqpw-next .qq-sidebar .card-title,
body.qqpw-next .qq-sidebar .panel-heading h3,
body.qqpw-next .qq-sidebar .card-header h3 {
    color: #07314f !important;
    text-shadow: none !important;
}

body.qqpw-next .qq-sidebar .panel-heading i,
body.qqpw-next .qq-sidebar .card-header i,
body.qqpw-next .qq-sidebar .panel-title i,
body.qqpw-next .qq-sidebar .card-title i,
body.qqpw-next .qq-sidebar .list-group-item i,
body.qqpw-next .qq-sidebar a.list-group-item i {
    color: #0a938c !important;
}

body.qqpw-next .qq-sidebar .panel-heading .pull-right,
body.qqpw-next .qq-sidebar .card-header .pull-right,
body.qqpw-next .qq-sidebar .panel-heading .fa-chevron-up,
body.qqpw-next .qq-sidebar .panel-heading .fa-chevron-down,
body.qqpw-next .qq-sidebar .card-header .fa-chevron-up,
body.qqpw-next .qq-sidebar .card-header .fa-chevron-down {
    color: #0b5875 !important;
    opacity: 1 !important;
}

body.qqpw-next .qq-sidebar .panel,
body.qqpw-next .qq-sidebar .card {
    background: rgba(255, 255, 255, 0.50) !important;
}

body.qqpw-next .qq-sidebar .list-group-item,
body.qqpw-next .qq-sidebar a.list-group-item,
body.qqpw-next .qq-sidebar .panel-body,
body.qqpw-next .qq-sidebar .card-body {
    color: #07314f !important;
}

body.qqpw-next .qq-sidebar .list-group-item small,
body.qqpw-next .qq-sidebar a.list-group-item small,
body.qqpw-next .qq-sidebar .text-muted {
    color: #48636d !important;
}

/* v5.2 mobile form polish for stock WHMCS forms. */
@media (max-width: 767px) {
    body.qqpw-next .form-horizontal .form-group {
        margin-right: 0;
        margin-left: 0;
    }

    body.qqpw-next .form-horizontal .control-label,
    body.qqpw-next .form-horizontal label.control-label,
    body.qqpw-next label.col-form-label {
        display: block;
        padding-top: 0;
        margin-bottom: 8px;
        text-align: left !important;
        color: #07314f;
    }

    body.qqpw-next label.text-right,
    body.qqpw-next .text-right.col-form-label {
        text-align: left !important;
    }

    body.qqpw-next .row > [class*="col-sm-"].col-form-label,
    body.qqpw-next .row > label[class*="col-sm-"] {
        flex: 0 0 100%;
        max-width: 100%;
        padding-right: 0;
        padding-left: 0;
    }

    body.qqpw-next .form-horizontal .col-sm-6,
    body.qqpw-next .form-horizontal .col-sm-8,
    body.qqpw-next .form-horizontal .col-sm-9,
    body.qqpw-next .form-horizontal .col-sm-10 {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
    }

    body.qqpw-next .input-group-lg > .form-control,
    body.qqpw-next .input-group-lg > .input-group-btn > .btn {
        min-height: 52px;
        font-size: 16px;
    }

    body.qqpw-next .template-contact .qq-content > .card,
    body.qqpw-next .template-contact .qq-content > .panel,
    body.qqpw-next .template-clientregister .qq-content > .card,
    body.qqpw-next .template-clientregister .qq-content > .panel {
        padding: 22px;
    }
}

/* v5.3 tablet and phone-desktop-mode navigation polish. */
@media (max-width: 1199px) {
    body.qqpw-next .qq-mainnav {
        background: rgba(255, 255, 255, 0.82);
        border-top: 1px solid rgba(8, 127, 176, 0.10);
        border-bottom: 1px solid rgba(8, 127, 176, 0.14);
        box-shadow: 0 16px 34px rgba(7, 96, 115, 0.10);
    }

    body.qqpw-next .qq-mainnav > .container {
        width: 100%;
        max-width: none;
        padding-right: 16px;
        padding-left: 16px;
    }

    body.qqpw-next .qq-mainnav .navbar-collapse {
        width: min(100%, 760px);
        margin-right: auto;
        margin-left: auto;
        padding: 12px;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(237, 250, 248, 0.96)),
            url("../img/hawaii-sunrise-hero.png") center 82% / 900px auto no-repeat;
        border: 1px solid rgba(8, 127, 176, 0.16);
        border-radius: 12px;
        box-shadow: 0 24px 48px rgba(7, 96, 115, 0.16);
    }

    body.qqpw-next .qq-mainnav .navbar-nav {
        width: 100%;
    }

    body.qqpw-next .qq-mainnav .navbar-nav > li > a,
    body.qqpw-next .qq-mainnav .nav-link,
    body.qqpw-next .qq-mainnav .dropdown-toggle {
        min-height: 46px;
        color: #07314f !important;
        background: rgba(255, 255, 255, 0.56);
        border: 1px solid rgba(8, 127, 176, 0.10);
        border-radius: 9px;
    }

    body.qqpw-next .qq-mainnav .navbar-nav > li > a:hover,
    body.qqpw-next .qq-mainnav .navbar-nav > li > a:focus,
    body.qqpw-next .qq-mainnav .nav-link:hover,
    body.qqpw-next .qq-mainnav .nav-link:focus,
    body.qqpw-next .qq-mainnav .dropdown.show > .dropdown-toggle {
        color: #08766f !important;
        background: rgba(255, 255, 255, 0.94) !important;
        border-color: rgba(10, 167, 154, 0.28);
    }

    body.qqpw-next .qq-mainnav .dropdown-menu {
        width: 100%;
        padding: 6px;
        background: rgba(255, 255, 255, 0.96) !important;
        border: 1px solid rgba(8, 127, 176, 0.13);
        border-radius: 10px;
        box-shadow: none;
    }

    body.qqpw-next .qq-mainnav .dropdown-menu > li > a,
    body.qqpw-next .qq-mainnav .dropdown-menu a,
    body.qqpw-next .qq-mainnav .dropdown-item {
        color: #07314f !important;
        background: rgba(255, 255, 255, 0.62);
        border-radius: 8px;
    }

    body.qqpw-next .qq-mainnav .dropdown-menu > li > a:hover,
    body.qqpw-next .qq-mainnav .dropdown-menu > li > a:focus,
    body.qqpw-next .qq-mainnav .dropdown-menu a:hover,
    body.qqpw-next .qq-mainnav .dropdown-menu a:focus,
    body.qqpw-next .qq-mainnav .dropdown-item:hover,
    body.qqpw-next .qq-mainnav .dropdown-item:focus {
        color: #08766f !important;
        background: rgba(238, 250, 248, 0.98) !important;
    }
}

/* v5.7 login as a Hawaii starry-night art entry page. */
body.qqpw-next.template-login .qq-page-heading {
    min-height: 230px;
    padding: 0;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.36), rgba(255, 255, 255, 0.05) 42%, rgba(255, 250, 240, 0.22)),
        url("../img/hawaii-starry-plumeria-header-v4.png") center 42% / cover no-repeat;
    border-bottom: 1px solid rgba(8, 127, 176, 0.14);
}

body.qqpw-next.template-login .qq-page-heading-row {
    display: none;
}

body.qqpw-next.template-login .qq-main-body {
    background:
        radial-gradient(circle at 80% 14%, rgba(255, 215, 140, 0.18), transparent 21rem),
        linear-gradient(180deg, #f8ffff 0%, #edfafa 48%, #fffaf0 100%);
}

body.qqpw-next.template-login .logincontainer,
body.qqpw-next.template-login .login-form {
    max-width: 1060px !important;
}

body.qqpw-next.template-login .login-form {
    position: relative;
    z-index: 2;
    margin-top: -78px;
    margin-bottom: 56px;
}

body.qqpw-next.template-login .login-form .card {
    grid-template-columns: minmax(360px, 0.96fr) minmax(420px, 1fr);
    overflow: hidden;
    background: rgba(255, 255, 255, 0.97);
    border: 10px solid rgba(255, 255, 255, 0.82);
    border-radius: 18px;
    box-shadow:
        0 34px 86px rgba(7, 96, 115, 0.16),
        0 0 0 1px rgba(8, 127, 176, 0.10);
}

body.qqpw-next.template-login .login-form .card::before {
    min-height: 560px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(4, 47, 61, 0.08)),
        url("../img/hawaii-starry-plumeria-login-v4.png") 28% center / cover no-repeat;
}

body.qqpw-next .qq-page-heading .qq-page-eyebrow,
body.qqpw-next .qq-order-heading .qq-page-eyebrow,
body.qqpw-next .qq-page-signal strong {
    display: none;
}

body.qqpw-next .qq-page-signal {
    min-width: 0;
}

body.qqpw-next.template-login .login-form .card::after {
    content: "";
    display: none;
}

body.qqpw-next.template-login .login-form .card-body {
    min-width: 0;
    padding: 56px !important;
}

body.qqpw-next.template-login .login-form h1,
body.qqpw-next.template-login .login-form h2,
body.qqpw-next.template-login .login-form h3 {
    color: #07314f;
    letter-spacing: 0;
}

body.qqpw-next.template-login .login-form .form-control,
body.qqpw-next.template-login .login-form .input-group-text,
body.qqpw-next.template-login .login-form .input-group-addon {
    border-color: rgba(8, 127, 176, 0.18);
}

body.qqpw-next.template-login .login-form .card-footer {
    background: rgba(248, 253, 252, 0.94);
    border-top: 1px solid rgba(8, 127, 176, 0.11);
}

@media (max-width: 991px) {
    body.qqpw-next.template-login .qq-page-heading {
        min-height: 185px;
        background-position: center 28%;
    }

    body.qqpw-next.template-login .login-form {
        margin-top: -56px;
    }

    body.qqpw-next.template-login .login-form .card {
        grid-template-columns: 1fr;
        max-width: 620px !important;
        margin-right: auto;
        margin-left: auto;
    }

    body.qqpw-next.template-login .login-form .card::before {
        grid-column: 1;
        grid-row: 1;
        min-height: 300px;
        background-position: 28% 37%;
    }

    body.qqpw-next.template-login .login-form .card-body,
    body.qqpw-next.template-login .login-form .card-footer {
        grid-column: 1;
    }

    body.qqpw-next.template-login .login-form .card-body {
        min-height: 0;
        padding: 34px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-login .qq-page-heading {
        min-height: 150px;
    }

    body.qqpw-next.template-login .login-form {
        margin-top: -34px;
    }

    body.qqpw-next.template-login .login-form .card {
        border-width: 7px;
        border-radius: 14px;
    }

    body.qqpw-next.template-login .login-form .card::before {
        min-height: 225px;
        background-position: 31% 34%;
    }

    body.qqpw-next.template-login .login-form .card-body {
        padding: 26px !important;
    }
}

/* v5.8 private Hawaii night gallery login. */
body.qqpw-next.template-login {
    color: #edf7f4;
    background: #061423;
}

body.qqpw-next.template-login .qq-header {
    color: #f7fbf8;
    background:
        linear-gradient(180deg, rgba(3, 12, 24, 0.86), rgba(4, 22, 36, 0.68)),
        url("../img/hawaii-private-night-wide-v6.png") center 32% / cover no-repeat;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.28);
}

body.qqpw-next.template-login .qq-navbar {
    background: rgba(3, 13, 25, 0.18);
}

body.qqpw-next.template-login .qq-navbar-row {
    min-height: 86px;
}

body.qqpw-next.template-login .qq-brand .logo-img {
    filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.36)) drop-shadow(0 0 16px rgba(255, 238, 190, 0.18));
}

body.qqpw-next.template-login .qq-search,
body.qqpw-next.template-login .qq-mobile-search,
body.qqpw-next.template-login .qq-cart-link,
body.qqpw-next.template-login .qq-menu-toggle {
    color: #f8fbf7;
    background: rgba(7, 25, 43, 0.58);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 12px 26px rgba(0, 0, 0, 0.20);
    backdrop-filter: blur(16px);
}

body.qqpw-next.template-login .qq-search input,
body.qqpw-next.template-login .qq-mobile-search input {
    color: #fffaf0;
}

body.qqpw-next.template-login .qq-search input::placeholder,
body.qqpw-next.template-login .qq-mobile-search input::placeholder {
    color: rgba(238, 246, 244, 0.68);
}

body.qqpw-next.template-login .qq-search-submit {
    color: #f2cf86;
}

body.qqpw-next.template-login .qq-cart-count {
    color: #061423;
    background: linear-gradient(135deg, #ffe0a3, #e6ad54);
}

body.qqpw-next.template-login .qq-mainnav {
    background: rgba(2, 10, 20, 0.44);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: none;
    backdrop-filter: blur(18px);
}

body.qqpw-next.template-login .qq-mainnav .navbar-nav > li > a,
body.qqpw-next.template-login .qq-mainnav .nav-link,
body.qqpw-next.template-login .qq-mainnav .dropdown-toggle {
    color: rgba(245, 250, 247, 0.88) !important;
}

body.qqpw-next.template-login .qq-mainnav .navbar-nav > li > a:hover,
body.qqpw-next.template-login .qq-mainnav .navbar-nav > li > a:focus,
body.qqpw-next.template-login .qq-mainnav .nav-link:hover,
body.qqpw-next.template-login .qq-mainnav .nav-link:focus,
body.qqpw-next.template-login .qq-mainnav .dropdown.show > .dropdown-toggle {
    color: #fffaf0 !important;
    background: rgba(242, 207, 134, 0.14) !important;
}

body.qqpw-next.template-login .qq-mainnav .dropdown-menu {
    background: rgba(7, 22, 37, 0.96) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.34) !important;
}

body.qqpw-next.template-login .qq-mainnav .dropdown-menu > li > a,
body.qqpw-next.template-login .qq-mainnav .dropdown-menu a,
body.qqpw-next.template-login .qq-mainnav .dropdown-item {
    color: rgba(247, 251, 248, 0.90) !important;
}

body.qqpw-next.template-login .qq-mainnav .dropdown-menu > li > a:hover,
body.qqpw-next.template-login .qq-mainnav .dropdown-menu a:hover,
body.qqpw-next.template-login .qq-mainnav .dropdown-item:hover {
    color: #fffaf0 !important;
    background: rgba(18, 117, 126, 0.24) !important;
}

body.qqpw-next.template-login .qq-breadcrumb,
body.qqpw-next.template-login .qq-page-heading {
    display: none;
}

body.qqpw-next.template-login .qq-main-body {
    position: relative;
    min-height: calc(100vh - 143px);
    padding: clamp(54px, 7vw, 90px) 0 clamp(68px, 8vw, 108px);
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(2, 9, 19, 0.42) 0%, rgba(3, 16, 29, 0.18) 40%, rgba(2, 9, 19, 0.64) 100%),
        linear-gradient(180deg, rgba(4, 15, 28, 0.12), rgba(4, 15, 28, 0.28)),
        url("../img/hawaii-private-night-art-v6.png") center center / cover no-repeat;
}

body.qqpw-next.template-login .qq-main-body::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 73% 16%, rgba(242, 207, 134, 0.18), transparent 22rem),
        radial-gradient(circle at 23% 42%, rgba(40, 173, 171, 0.10), transparent 20rem),
        linear-gradient(180deg, transparent 0%, rgba(2, 9, 18, 0.34) 100%);
}

body.qqpw-next.template-login .logincontainer,
body.qqpw-next.template-login .login-form {
    width: 100%;
    max-width: 1180px !important;
}

body.qqpw-next.template-login .login-form {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: flex-end;
    margin: 0 auto;
    padding: 0 28px;
}

body.qqpw-next.template-login .login-form .card {
    display: block !important;
    width: min(468px, 100%);
    overflow: hidden;
    color: #f7fbf8;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.075)),
        rgba(7, 24, 39, 0.38);
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 18px;
    box-shadow:
        0 34px 90px rgba(0, 0, 0, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(22px) saturate(132%);
}

body.qqpw-next.template-login .login-form .card::before {
    display: none !important;
}

body.qqpw-next.template-login .login-form .card::after {
    content: "";
    display: block;
    height: 3px;
    background: linear-gradient(90deg, rgba(12, 165, 158, 0.78), rgba(242, 207, 134, 0.86), rgba(255, 255, 255, 0.20));
}

body.qqpw-next.template-login .login-form .card-body {
    padding: 44px 42px 36px !important;
    color: rgba(247, 251, 248, 0.92);
}

body.qqpw-next.template-login .login-form h1,
body.qqpw-next.template-login .login-form h2,
body.qqpw-next.template-login .login-form h3,
body.qqpw-next.template-login .login-form h4,
body.qqpw-next.template-login .login-form h5,
body.qqpw-next.template-login .login-form h6,
body.qqpw-next.template-login .login-form .h1,
body.qqpw-next.template-login .login-form .h2,
body.qqpw-next.template-login .login-form .h3,
body.qqpw-next.template-login .login-form .h4,
body.qqpw-next.template-login .login-form .h5,
body.qqpw-next.template-login .login-form .h6 {
    color: #fffaf0;
    text-shadow: 0 12px 34px rgba(0, 0, 0, 0.26);
}

body.qqpw-next.template-login .login-form p,
body.qqpw-next.template-login .login-form label,
body.qqpw-next.template-login .login-form .small,
body.qqpw-next.template-login .login-form .text-muted {
    color: rgba(237, 247, 244, 0.78) !important;
}

body.qqpw-next.template-login .login-form a {
    color: #f2cf86;
}

body.qqpw-next.template-login .login-form a.text-muted,
body.qqpw-next.template-login .login-form .small.text-muted,
body.qqpw-next.template-login .login-form .card-footer a {
    color: #f2cf86 !important;
}

body.qqpw-next.template-login .login-form .input-group,
body.qqpw-next.template-login .login-form .form-control {
    min-width: 0;
}

body.qqpw-next.template-login .login-form .form-control {
    min-height: 44px;
    color: #071928 !important;
    background: rgba(255, 252, 244, 0.90) !important;
    border-color: rgba(255, 255, 255, 0.26) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.60);
}

body.qqpw-next.template-login .login-form .form-control::placeholder {
    color: rgba(7, 25, 40, 0.52) !important;
    opacity: 1;
}

body.qqpw-next.template-login .login-form .input-group-text,
body.qqpw-next.template-login .login-form .input-group-addon {
    color: #0a5f68 !important;
    background: rgba(255, 252, 244, 0.82) !important;
    border-color: rgba(255, 255, 255, 0.26) !important;
}

body.qqpw-next.template-login .login-form .btn-primary,
body.qqpw-next.template-login .login-form button[type="submit"] {
    color: #061423 !important;
    background: linear-gradient(135deg, #f4d28a, #0fb5ac 58%, #087fb0) !important;
    border: 0 !important;
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.28);
}

body.qqpw-next.template-login .login-form .card-footer {
    padding: 18px 42px 28px !important;
    color: rgba(237, 247, 244, 0.82);
    background: rgba(3, 16, 29, 0.22);
    border-top: 1px solid rgba(255, 255, 255, 0.13);
}

body.qqpw-next.template-login .login-form .card-footer a {
    color: #f4d28a;
}

body.qqpw-next.template-login .qq-footer {
    color: rgba(247, 251, 248, 0.86);
    background:
        linear-gradient(180deg, rgba(3, 12, 24, 0.94), rgba(4, 22, 36, 0.96)),
        url("../img/hawaii-private-night-wide-v6.png") center 52% / cover no-repeat;
    border-top: 1px solid rgba(242, 207, 134, 0.22);
}

body.qqpw-next.template-login .qq-footer::before {
    background: linear-gradient(90deg, #0aa79a, #f2cf86, rgba(255, 250, 240, 0.34));
}

body.qqpw-next.template-login .qq-footer-brand,
body.qqpw-next.template-login .qq-footer-brand:hover,
body.qqpw-next.template-login .qq-footer-nav strong,
body.qqpw-next.template-login .qq-footer-action-block strong {
    color: #fffaf0;
}

body.qqpw-next.template-login .qq-footer-brand-block p,
body.qqpw-next.template-login .qq-footer-copy,
body.qqpw-next.template-login .qq-footer-nav a,
body.qqpw-next.template-login .qq-footer-action-block a {
    color: rgba(221, 238, 235, 0.80);
}

body.qqpw-next.template-login .qq-footer-nav a:hover,
body.qqpw-next.template-login .qq-footer-action-block a:hover {
    color: #f2cf86;
}

body.qqpw-next.template-login .qq-footer-badges span,
body.qqpw-next.template-login .qq-footer-action-block .qq-footer-cta,
body.qqpw-next.template-login .qq-footer-action-block .qq-locale-btn {
    color: #fffaf0;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.18);
}

body.qqpw-next.template-login .qq-footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.12);
}

@media (max-width: 1199px) {
    body.qqpw-next.template-login .qq-mainnav .navbar-collapse {
        background: rgba(4, 16, 30, 0.94) !important;
        border-color: rgba(255, 255, 255, 0.14) !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-login .qq-main-body {
        min-height: auto;
        padding: 48px 0 66px;
        background-position: 42% center;
    }

    body.qqpw-next.template-login .login-form {
        justify-content: center;
        padding: 0 22px;
    }

    body.qqpw-next.template-login .login-form .card {
        max-width: 560px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-login .qq-navbar-row {
        min-height: 76px;
    }

    body.qqpw-next.template-login .qq-main-body {
        padding: 34px 0 54px;
        background-position: 37% center;
    }

    body.qqpw-next.template-login .login-form {
        padding: 0 14px;
    }

    body.qqpw-next.template-login .login-form .card {
        border-radius: 16px;
    }

    body.qqpw-next.template-login .login-form .card-body {
        padding: 32px 26px 28px !important;
    }

body.qqpw-next.template-login .login-form .card-footer {
        padding: 18px 26px 24px !important;
    }
}

/* v7.5 client area console: remove native sidebar feel and flatten the dashboard. */
body.qqpw-next.template-clientareahome .qq-breadcrumb,
body.qqpw-next.template-clientareahome .qq-page-heading {
    display: none !important;
}

body.qqpw-next.template-clientareahome .qq-main-body {
    padding-top: clamp(24px, 4vw, 42px);
}

body.qqpw-next.template-clientareahome .qq-main-container {
    max-width: 1240px;
}

body.qqpw-next.template-clientareahome .qq-layout-row {
    justify-content: center;
}

body.qqpw-next.template-clientareahome .qq-content {
    max-width: 1180px;
    margin: 0 auto;
}

.qq-console-v2 {
    max-width: 1180px;
    margin: 0 auto;
}

.qq-console-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(380px, 0.74fr);
    gap: 22px;
    align-items: center;
    padding: clamp(22px, 3vw, 32px);
    color: #07314f;
    background:
        linear-gradient(120deg, rgba(255, 255, 255, 0.92), rgba(239, 252, 249, 0.78) 58%, rgba(255, 250, 240, 0.62)),
        radial-gradient(circle at 92% 6%, rgba(255, 215, 140, 0.26), transparent 24rem),
        radial-gradient(circle at 6% 70%, rgba(10, 167, 154, 0.13), transparent 20rem);
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 16px;
    box-shadow: 0 22px 60px rgba(7, 96, 115, 0.10);
}

.qq-console-hero::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 4px;
    background: linear-gradient(90deg, #087fb0, #0aa79a, #ffd78c, #df5b46);
}

.qq-console-welcome {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 160px;
}

.qq-console-welcome h2 {
    max-width: 620px;
    margin: 8px 0 10px;
    color: #07314f;
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.02;
    letter-spacing: 0;
}

.qq-console-welcome p {
    max-width: 620px;
    margin: 0;
    color: #38535f;
    font-size: 17px;
    line-height: 1.55;
}

.qq-console-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.qq-console-badges span {
    color: #075f68;
    background: rgba(255, 255, 255, 0.66);
    border: 1px solid rgba(10, 167, 154, 0.18);
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 900;
}

.qq-console-primary-actions {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.qq-console-action-dock {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 12px;
    min-width: 0;
    padding: 18px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(240, 252, 249, 0.56));
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 15px;
    box-shadow: 0 18px 44px rgba(7, 96, 115, 0.08);
    backdrop-filter: blur(14px);
}

.qq-console-primary-actions a {
    min-height: 74px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    color: #07314f;
    background: rgba(255, 255, 255, 0.74);
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 12px;
    padding: 12px;
    text-decoration: none;
    box-shadow: 0 10px 26px rgba(7, 96, 115, 0.06);
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.qq-console-primary-actions a:hover,
.qq-console-primary-actions a:focus {
    color: #07314f;
    border-color: rgba(10, 167, 154, 0.32);
    box-shadow: 0 18px 40px rgba(7, 96, 115, 0.11);
    transform: translateY(-1px);
    text-decoration: none;
}

.qq-console-primary-actions a > i {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #08766f;
    background: linear-gradient(135deg, rgba(10, 167, 154, 0.15), rgba(255, 215, 140, 0.20));
    border-radius: 10px;
}

.qq-console-primary-actions a span {
    min-width: 0;
    font-size: 14px;
    font-weight: 900;
}

.qq-console-primary-actions a strong {
    min-width: 28px;
    color: #075f68;
    font-size: 16px;
    font-weight: 900;
    text-align: right;
}

.qq-console-mini-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.qq-console-mini-metrics a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    color: #07314f;
    background: rgba(255, 255, 255, 0.58);
    border: 1px solid rgba(8, 127, 176, 0.10);
    border-radius: 11px;
    padding: 10px 12px;
    text-decoration: none;
}

.qq-console-mini-metrics span {
    min-width: 0;
    color: #5f7280;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.qq-console-mini-metrics strong {
    color: #07314f;
    font-size: 13px;
    font-weight: 900;
    text-align: right;
    white-space: nowrap;
}

.qq-console-mini-metrics a:hover,
.qq-console-mini-metrics a:focus {
    color: #07314f;
    background: rgba(255, 255, 255, 0.88);
    border-color: rgba(10, 167, 154, 0.22);
    text-decoration: none;
}

.qq-console-v2 .qq-client-stat-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0 24px;
}

.qq-console-v2 .qq-client-stat {
    min-height: 92px;
    align-content: center;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(247, 255, 253, 0.72));
    border-color: rgba(8, 127, 176, 0.12);
    border-radius: 12px;
    box-shadow: 0 14px 34px rgba(7, 96, 115, 0.06);
}

.qq-console-v2 .qq-client-stat strong {
    font-size: clamp(25px, 3vw, 36px);
}

.qq-console-v2 .qq-stat-balance strong {
    font-size: clamp(18px, 1.8vw, 25px);
}

.qq-console-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    gap: 18px;
    align-items: start;
    margin-top: 24px;
}

.qq-console-main,
.qq-console-side {
    min-width: 0;
}

.qq-section-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #08766f;
    background: rgba(255, 255, 255, 0.70);
    border: 1px solid rgba(10, 167, 154, 0.18);
    border-radius: 999px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
}

.qq-section-link:hover,
.qq-section-link:focus {
    color: #07314f;
    background: rgba(255, 255, 255, 0.94);
    text-decoration: none;
}

.qq-console-panel-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.qq-console-panel {
    min-width: 0;
    overflow: hidden;
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(247, 255, 253, 0.70));
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(7, 96, 115, 0.07);
}

.qq-console-panel-wide {
    grid-column: 1 / -1;
}

.qq-console-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 72px;
    padding: 16px 18px;
    border-bottom: 1px solid rgba(8, 127, 176, 0.10);
}

.qq-console-panel-title {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.qq-console-panel-title > span {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #08766f;
    background: linear-gradient(135deg, rgba(10, 167, 154, 0.14), rgba(255, 215, 140, 0.22));
    border-radius: 10px;
}

.qq-console-panel-title small {
    display: block;
    color: #5f7280;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.qq-console-panel-title h3 {
    margin: 1px 0 0;
    color: #07314f;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.2;
}

.qq-console-panel-title h3 em {
    font-style: normal;
}

.qq-console-panel-action {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #08766f;
    background: rgba(255, 255, 255, 0.70);
    border: 1px solid rgba(10, 167, 154, 0.18);
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 900;
    text-decoration: none;
}

.qq-console-panel-action:hover,
.qq-console-panel-action:focus {
    color: #07314f;
    background: #ffffff;
    text-decoration: none;
}

.qq-console-panel-body {
    padding: 18px;
    color: #324c5a;
    line-height: 1.55;
}

.qq-console-panel-body p:last-child {
    margin-bottom: 0;
}

.qq-console-panel-list {
    padding: 8px;
}

.qq-console-panel-row {
    display: block;
    color: #07314f;
    background: rgba(255, 255, 255, 0.54);
    border: 1px solid rgba(8, 127, 176, 0.10);
    border-radius: 12px;
    margin: 8px;
    text-decoration: none;
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

a.qq-console-panel-row:hover,
a.qq-console-panel-row:focus {
    color: #07314f;
    background: rgba(255, 255, 255, 0.86);
    border-color: rgba(10, 167, 154, 0.28);
    transform: translateY(-1px);
    text-decoration: none;
}

.qq-console-panel-row .div-service-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 14px;
}

.qq-console-panel-row .div-service-status {
    width: auto !important;
    min-width: 74px;
}

.qq-console-panel-row .label-placeholder {
    display: none !important;
}

.qq-console-panel-row .label,
.qq-console-panel-row .badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    color: #ffffff;
    background: #0f8f84;
    border-radius: 999px;
    padding: 4px 9px;
    font-size: 11px;
    font-weight: 900;
}

.qq-console-panel-row .div-service-name {
    min-width: 0;
}

.qq-console-panel-row .font-weight-bold {
    display: block;
    color: #07314f;
    font-size: 14px;
    font-weight: 900 !important;
    overflow-wrap: anywhere;
}

.qq-console-panel-row .text-domain {
    display: block;
    margin-top: 3px;
    color: #5f7280;
    font-size: 13px;
    overflow-wrap: anywhere;
}

.qq-console-panel-row .div-service-buttons .btn,
.qq-console-panel-row .btn-view-details {
    color: #08766f !important;
    background: rgba(255, 255, 255, 0.82) !important;
    border: 1px solid rgba(10, 167, 154, 0.18) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    font-weight: 900;
}

.qq-console-panel-row .btn-view-details span:not(.sr-only) {
    display: inline !important;
    margin-left: 6px;
}

.qq-console-panel-body .form-control,
.qq-console-panel-body input[type="text"] {
    min-height: 44px;
    border-color: rgba(8, 127, 176, 0.16);
    border-radius: 10px;
}

.qq-console-panel-body .btn,
.qq-console-panel-footer .btn {
    border-radius: 10px;
}

.qq-console-panel-footer {
    padding: 12px 18px 16px;
    color: #5f7280;
    border-top: 1px solid rgba(8, 127, 176, 0.10);
}

.qq-passport-card,
.qq-route-card {
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(239, 252, 249, 0.70));
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 16px;
    box-shadow: 0 16px 40px rgba(7, 96, 115, 0.07);
}

.qq-passport-card {
    padding: 18px;
}

.qq-passport-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(8, 127, 176, 0.10);
}

.qq-passport-head > span {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: linear-gradient(135deg, #0bb8a8, #087fb0);
    border-radius: 14px;
    box-shadow: 0 14px 28px rgba(8, 127, 176, 0.14);
}

.qq-passport-head small,
.qq-route-kicker {
    display: block;
    color: #5f7280;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.qq-passport-head strong {
    display: block;
    color: #07314f;
    font-size: 18px;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.qq-passport-lines {
    display: grid;
    gap: 8px;
    margin: 14px 0;
}

.qq-passport-lines span {
    display: flex;
    gap: 8px;
    color: #38535f;
    font-size: 13px;
    line-height: 1.4;
}

.qq-passport-lines i {
    color: #08766f;
    margin-top: 2px;
}

.qq-passport-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.qq-passport-actions a {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #07314f;
    background: rgba(255, 255, 255, 0.62);
    border: 1px solid rgba(8, 127, 176, 0.11);
    border-radius: 10px;
    padding: 8px 10px;
    font-size: 12px;
    font-weight: 900;
    text-decoration: none;
}

.qq-passport-actions a:hover,
.qq-passport-actions a:focus {
    color: #08766f;
    background: #ffffff;
    text-decoration: none;
}

.qq-route-card {
    display: grid;
    gap: 8px;
    margin-top: 14px;
    padding: 16px;
}

.qq-route-card a {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 10px;
    align-items: center;
    color: #07314f;
    background: rgba(255, 255, 255, 0.58);
    border: 1px solid rgba(8, 127, 176, 0.10);
    border-radius: 12px;
    padding: 12px;
    text-decoration: none;
}

.qq-route-card a strong {
    font-size: 14px;
    font-weight: 900;
}

.qq-route-card a em {
    grid-column: 1;
    color: #5f7280;
    font-size: 12px;
    font-style: normal;
}

.qq-route-card a i {
    grid-row: 1 / span 2;
    grid-column: 2;
    color: #08766f;
}

.qq-route-card a:hover,
.qq-route-card a:focus {
    color: #07314f;
    background: #ffffff;
    border-color: rgba(10, 167, 154, 0.24);
    text-decoration: none;
}

@media (max-width: 1199px) {
    .qq-console-workspace {
        grid-template-columns: minmax(0, 1fr);
    }

    .qq-console-side {
        display: grid;
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
        gap: 14px;
    }

    .qq-route-card {
        margin-top: 0;
    }
}

@media (max-width: 991px) {
    .qq-console-hero {
        grid-template-columns: 1fr;
    }

    .qq-console-v2 .qq-client-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .qq-console-v2 .qq-stat-balance {
        grid-column: 1 / -1;
    }

    .qq-console-side {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .qq-console-hero {
        padding: 20px;
        border-radius: 14px;
    }

    .qq-console-panel-grid,
    .qq-passport-actions {
        grid-template-columns: 1fr;
    }

    .qq-console-primary-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .qq-console-primary-actions a {
        min-height: 64px;
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 8px;
        padding: 10px;
    }

    .qq-console-primary-actions a > i {
        width: 30px;
        height: 30px;
    }

    .qq-console-primary-actions a span {
        grid-column: auto;
        font-size: 12px;
        line-height: 1.25;
    }

    .qq-console-primary-actions a strong {
        min-width: 18px;
        font-size: 13px;
    }

    .qq-console-action-dock {
        padding: 14px;
    }

    .qq-console-mini-metrics {
        grid-template-columns: 1fr;
    }

    .qq-console-panel-row .div-service-item {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .qq-console-panel-row .div-service-buttons {
        width: 100%;
    }

    .qq-console-panel-row .div-service-buttons .btn,
    .qq-console-panel-row .btn-view-details {
        width: 100%;
    }

    .qq-client-section-head {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* v6.8 service detail polish: no inner scroll, light tabs, embedded NAT and module alignment. */
body.qqpw-next.template-clientareaproductdetails .qq-product-main-tabs,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .card,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .card-body,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .row,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .qq-product-facts {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card {
    position: relative;
    border: 1px solid rgba(8, 127, 176, 0.14) !important;
    border-radius: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(180deg, #087fb0, #0aa79a 52%, #ffd78c);
    pointer-events: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    align-items: stretch;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
    min-height: 270px;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active a,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active > a {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: rgba(10, 167, 154, 0.32) !important;
    box-shadow: inset 4px 0 0 #ffd78c, 0 12px 24px rgba(7, 96, 115, 0.07) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link:hover,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a:hover {
    color: #075f68 !important;
    background: rgba(255, 255, 255, 0.70) !important;
    border-color: rgba(8, 127, 176, 0.16) !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container,
body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-content,
body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane {
    color: #07314f !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(247, 255, 253, 0.78)) !important;
    border-radius: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-note {
    color: #4b6570;
    line-height: 1.55;
    margin: 0 0 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-note code {
    color: #07314f;
    background: rgba(239, 252, 249, 0.90);
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 6px;
    padding: 3px 6px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-command span {
    display: block;
    color: #5b7280;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 6px;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-table,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget__body {
    color: #07314f !important;
    background-color: rgba(255, 255, 255, 0.88) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel-header,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget__header,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-top,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-top__toolbar {
    color: #07314f !important;
    background: linear-gradient(90deg, rgba(239, 252, 249, 0.96), rgba(255, 250, 240, 0.80)) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-btn,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-btn--default,
body.qqpw-next.template-clientareaproductdetails .module-client-area .btn {
    color: #075f68 !important;
    background: rgba(255, 255, 255, 0.90) !important;
    border-color: rgba(8, 127, 176, 0.16) !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 22px rgba(7, 96, 115, 0.05) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-btn:hover,
body.qqpw-next.template-clientareaproductdetails .module-client-area .btn:hover {
    color: #07314f !important;
    border-color: rgba(10, 167, 154, 0.30) !important;
    box-shadow: 0 14px 30px rgba(7, 96, 115, 0.09) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-alert,
body.qqpw-next.template-clientareaproductdetails .module-client-area .alert {
    color: #075f68 !important;
    background: rgba(239, 252, 249, 0.86) !important;
    border-color: rgba(8, 127, 176, 0.16) !important;
    border-left: 4px solid #087fb0 !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-table th,
body.qqpw-next.template-clientareaproductdetails .module-client-area table th {
    background: rgba(239, 252, 249, 0.90) !important;
    color: #07314f !important;
    font-weight: 800 !important;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
        min-height: 180px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
        min-height: 0;
        padding: 20px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tiles.lu-row {
        grid-template-columns: 1fr 1fr !important;
    }
}

@media (max-width: 420px) {
    body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tiles.lu-row {
        grid-template-columns: 1fr !important;
    }
}

/* v7.7 final service console priority layer. */
body.qqpw-next.template-clientareaproductdetails .qq-content {
    flex: 0 0 100% !important;
    max-width: 1180px !important;
    width: 100% !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console > .nav-tabs,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm {
    display: inline-flex !important;
    width: auto !important;
    gap: 4px !important;
    padding: 5px !important;
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.62) !important;
    box-shadow: 0 14px 30px rgba(7, 96, 115, 0.06) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link {
    min-height: 36px !important;
    color: #4b6570 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 8px 14px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active a,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active > a {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 10px 20px rgba(7, 96, 115, 0.08) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm-connector {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel-header h5 {
    font-size: 20px !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-content {
        max-width: 760px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-console > .nav-tabs,
    body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm {
        display: flex !important;
        width: 100% !important;
        border-radius: 14px !important;
    }
}

/* v8.1 final priority layer for the default service workbench. */
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    align-items: flex-start !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
    min-height: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel {
    margin-bottom: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench {
    display: grid !important;
    gap: 16px !important;
    margin-top: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-strip,
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
    border: 1px solid rgba(8, 127, 176, 0.15) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(239, 252, 249, 0.82)),
        radial-gradient(circle at 94% 8%, rgba(255, 215, 140, 0.28), transparent 34%) !important;
    box-shadow: 0 18px 44px rgba(7, 96, 115, 0.08) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-strip {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 18px !important;
    padding: 18px 20px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-ring {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    width: 78px !important;
    height: 78px !important;
    border-radius: 999px !important;
    background: conic-gradient(#0aa79a 0 var(--qq-bandwidth-pct), rgba(8, 127, 176, 0.10) var(--qq-bandwidth-pct) 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.84), 0 12px 28px rgba(7, 96, 115, 0.09) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-ring::after {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: inherit;
    background: rgba(255, 255, 255, 0.94);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-ring span {
    position: relative;
    z-index: 1;
    color: #087fb0;
    font-size: 17px;
    font-weight: 900;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-copy span,
body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats span {
    display: block;
    color: #5b7280;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-copy strong {
    display: block;
    color: #07314f;
    font-size: 25px;
    line-height: 1.16;
    margin: 3px 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-copy small {
    color: #5b7280;
    font-size: 12px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(122px, 1fr)) !important;
    gap: 10px !important;
    min-width: 280px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats > div {
    min-width: 0;
    padding: 12px 14px;
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.76);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats strong {
    display: block;
    color: #075f68;
    font-size: 16px;
    line-height: 1.28;
    overflow-wrap: anywhere;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.08fr) minmax(350px, 0.92fr) !important;
    gap: 16px !important;
    align-items: start !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
    min-width: 0 !important;
    padding: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head,
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-head {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 14px !important;
    padding: 0 0 13px !important;
    border-bottom: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 0 !important;
    background: transparent !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head > span,
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-icon {
    display: inline-grid !important;
    place-items: center !important;
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 auto !important;
    color: #075f68 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, rgba(10, 167, 154, 0.16), rgba(255, 215, 140, 0.28)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head h5,
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-head h5 {
    color: #07314f !important;
    font-size: 20px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
    margin: 0 0 4px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head p,
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-head p {
    color: #5b7280 !important;
    font-size: 12.5px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-grid {
    grid-template-columns: 1fr !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-tool {
    min-height: 74px !important;
    padding: 13px 14px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-credential-note {
    display: grid !important;
    gap: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-credential-fields {
    justify-content: flex-start !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline {
    padding: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline > .card,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget {
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 32px rgba(7, 96, 115, 0.06) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles.lu-row {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)) !important;
    gap: 12px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles > [class*="lu-col"] {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile--btn {
    min-height: 104px !important;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-strip {
        grid-template-columns: 66px minmax(0, 1fr) !important;
        gap: 12px !important;
        padding: 14px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-ring {
        width: 66px !important;
        height: 66px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-copy strong {
        font-size: 20px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats {
        grid-column: 1 / -1 !important;
        grid-template-columns: 1fr 1fr !important;
        min-width: 0 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
        padding: 14px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-head,
    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head {
        align-items: flex-start !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 420px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles.lu-row {
        grid-template-columns: 1fr 1fr !important;
    }
}

/* v9.1 last-pass service tools layout override. */
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
    grid-template-columns: 1fr !important;
    align-items: start !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-server-tools-panel {
    padding: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-action-grid {
    grid-template-columns: repeat(6, minmax(104px, 1fr)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-utility-grid {
    grid-template-columns: repeat(4, minmax(132px, 1fr)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline {
    display: grid !important;
    grid-template-columns: minmax(220px, 0.72fr) minmax(260px, 1fr) minmax(280px, 1fr) !important;
    gap: 12px !important;
    align-items: stretch !important;
    margin-top: 16px !important;
    padding: 14px !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(239, 252, 249, 0.72)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.20), transparent 42%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-toolkit-head {
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-toolkit-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-credential-note {
    height: 100% !important;
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-map,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-ip-addresses-widget {
    display: none !important;
}

@media (max-width: 1199px) {
    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-action-grid {
        grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline {
        grid-template-columns: 1fr 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-toolkit-head {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-server-tools-panel {
        padding: 14px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-action-grid,
    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-utility-grid {
        grid-template-columns: 1fr 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline {
        grid-template-columns: 1fr !important;
        padding: 12px !important;
    }
}

/* v9 service tools: merge account access and restyle the module workspace. */
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
    grid-template-columns: 1fr !important;
    align-items: start !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-server-tools-panel {
    padding: 18px !important;
    overflow: hidden !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head {
    display: flex !important;
    gap: 14px !important;
    align-items: center !important;
    margin-bottom: 16px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head > span,
body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-icon {
    display: inline-grid !important;
    place-items: center !important;
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 auto !important;
    color: #075f68 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, rgba(10, 167, 154, 0.18), rgba(255, 215, 140, 0.26)) !important;
    box-shadow: inset 0 0 0 1px rgba(8, 127, 176, 0.08) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head h5,
body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-head h5 {
    color: #07314f !important;
    font-size: 21px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    margin: 0 0 3px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head p,
body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-head p {
    max-width: 680px !important;
    color: #48636f !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline {
    color: #07314f !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .mg-wrapper,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .full-screen-module-container,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-app,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .page-container,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .page-content,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-container-fluid,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-block,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-block__body {
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .h4 {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 18px 0 10px !important;
    color: #07314f !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .h4:first-of-type {
    margin-top: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .h4::before {
    content: "";
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: linear-gradient(135deg, #0aa79a, #087fb0, #ffd78c);
    box-shadow: 0 0 0 5px rgba(10, 167, 154, 0.10);
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles.lu-row {
    display: grid !important;
    gap: 10px !important;
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-action-grid {
    grid-template-columns: repeat(6, minmax(104px, 1fr)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-utility-grid {
    grid-template-columns: repeat(4, minmax(132px, 1fr)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles > [class*="lu-col"] {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile--btn {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    min-height: 70px !important;
    padding: 12px !important;
    overflow: hidden !important;
    color: #07314f !important;
    text-align: left !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 13px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(241, 252, 249, 0.78)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.20), transparent 40%) !important;
    box-shadow: 0 12px 28px rgba(7, 96, 115, 0.06) !important;
    transition: transform 140ms ease, border-color 140ms ease, box-shadow 140ms ease !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile:hover,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile:focus {
    transform: translateY(-1px) !important;
    border-color: rgba(10, 167, 154, 0.38) !important;
    box-shadow: 0 16px 34px rgba(7, 96, 115, 0.10) !important;
    text-decoration: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile .lu-i-c-6x {
    position: relative !important;
    display: inline-grid !important;
    place-items: center !important;
    width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, rgba(10, 167, 154, 0.17), rgba(255, 215, 140, 0.24)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile .lu-i-c-6x img {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile .lu-i-c-6x::before {
    content: "\f061";
    color: #087f8f;
    font-family: "Font Awesome 5 Free";
    font-size: 16px;
    font-weight: 900;
    line-height: 1;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-start .lu-i-c-6x::before { content: "\f04b"; color: #0a9f74; }
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-reboot .lu-i-c-6x::before { content: "\f2f1"; color: #087fb0; }
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-stop .lu-i-c-6x::before { content: "\f04d"; color: #d64b40; }
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-shut-down .lu-i-c-6x::before { content: "\f011"; color: #d64b40; }
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-open-novnc-console .lu-i-c-6x::before { content: "\f108"; color: #087fb0; }
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-open-spice-console .lu-i-c-6x::before { content: "\f26c"; color: #087fb0; }
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-backup-schedules .lu-i-c-6x::before { content: "\f1da"; color: #0a9f74; }
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-graphs .lu-i-c-6x::before { content: "\f201"; color: #087fb0; }
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-reinstallation .lu-i-c-6x::before { content: "\f2f1"; color: #e09b22; }
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-tool-task-history .lu-i-c-6x::before { content: "\f1da"; color: #7b6b4f; }

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile__title {
    display: block !important;
    color: #07314f !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    overflow-wrap: anywhere !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget {
    margin: 16px 0 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, 0.88) !important;
    box-shadow: 0 14px 32px rgba(7, 96, 115, 0.06) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget__header {
    padding: 13px 16px !important;
    color: #07314f !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(8, 127, 176, 0.11) !important;
    background:
        linear-gradient(135deg, rgba(239, 252, 249, 0.90), rgba(255, 250, 240, 0.72)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.22), transparent 36%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget__body {
    min-height: 0 !important;
    padding: 0 !important;
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.68) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget table,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-table {
    width: 100% !important;
    margin: 0 !important;
    color: #07314f !important;
    border-collapse: collapse !important;
    background: transparent !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget tr,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-table tr {
    border-bottom: 1px solid rgba(8, 127, 176, 0.09) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget tr:last-child,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-table tr:last-child {
    border-bottom: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget td,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget th,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-table td,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-table th {
    padding: 12px 16px !important;
    color: #07314f !important;
    border: 0 !important;
    background: transparent !important;
    vertical-align: middle !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget th,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-table th {
    color: #4b6570 !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget__header.lu-bg-danger-lighter,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget__body.lu-bg-danger-faded {
    background: linear-gradient(135deg, rgba(255, 246, 240, 0.96), rgba(255, 255, 255, 0.86)) !important;
    color: #8a3b2f !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-ip-addresses-widget {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline {
    display: grid !important;
    grid-template-columns: minmax(220px, 0.72fr) minmax(260px, 1fr) minmax(280px, 1fr) !important;
    gap: 12px !important;
    align-items: stretch !important;
    margin-top: 16px !important;
    padding: 14px !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(239, 252, 249, 0.72)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.20), transparent 42%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-toolkit-head {
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-toolkit-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-tool {
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-credential-note {
    height: 100% !important;
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-map {
    display: none !important;
}

@media (max-width: 1199px) {
    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-action-grid {
        grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline {
        grid-template-columns: 1fr 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-toolkit-head {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-server-tools-panel {
        padding: 14px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-action-grid,
    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-utility-grid {
        grid-template-columns: 1fr 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile,
    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile--btn {
        grid-template-columns: 34px minmax(0, 1fr) !important;
        min-height: 62px !important;
        padding: 10px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile .lu-i-c-6x {
        width: 34px !important;
        height: 34px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline {
        grid-template-columns: 1fr !important;
        padding: 12px !important;
    }
}

/* v8.6 absolute last override: mobile service workbench stacks without equal-height overlap. */
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    align-items: stretch !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row > .col-md-6:first-child {
    display: flex !important;
    flex-direction: column !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status {
    flex: 1 1 auto !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
    height: 100% !important;
    min-height: 245px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench > .qq-service-bandwidth-strip {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
    display: grid !important;
    grid-template-columns: 74px minmax(0, 1fr) minmax(220px, 0.86fr) !important;
    align-items: center !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
        grid-template-columns: 1fr !important;
        align-items: start !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
        grid-template-columns: 66px minmax(0, 1fr) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status {
        flex: 0 0 auto !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
        min-height: 190px !important;
    }
}

/* v8.5 absolute final: keep desktop aligned, let mobile workbench stack naturally. */
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    align-items: stretch !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row > .col-md-6:first-child {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status {
    flex: 1 1 auto !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
    height: 100% !important;
    min-height: 245px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
    display: grid !important;
    grid-template-columns: 74px minmax(0, 1fr) minmax(220px, 0.86fr) !important;
    align-items: center !important;
    gap: 13px !important;
    margin-top: 12px !important;
    padding: 13px 14px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench > .qq-service-bandwidth-strip {
    display: none !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
        grid-template-columns: 1fr !important;
        align-items: start !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
        grid-template-columns: 66px minmax(0, 1fr) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status {
        flex: 0 0 auto !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
        min-height: 190px !important;
    }
}

/* v8.4 overview balance: use bandwidth in the detail rail and align the visual column bottom. */
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    align-items: stretch !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row > .col-md-6:first-child {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status {
    flex: 1 1 auto !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
    height: 100% !important;
    min-height: 245px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
    display: flex !important;
    flex-direction: column !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
    display: grid !important;
    grid-template-columns: 74px minmax(0, 1fr) minmax(220px, 0.86fr) !important;
    align-items: center !important;
    gap: 13px !important;
    margin-top: 12px !important;
    padding: 13px 14px !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 12px !important;
    background:
        linear-gradient(135deg, rgba(239, 252, 249, 0.84), rgba(255, 250, 240, 0.58)),
        radial-gradient(circle at 88% 18%, rgba(255, 215, 140, 0.20), transparent 42%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini .qq-service-bandwidth-ring {
    width: 64px !important;
    height: 64px !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.84), 0 10px 22px rgba(7, 96, 115, 0.08) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini .qq-service-bandwidth-ring::after {
    inset: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini .qq-service-bandwidth-ring span {
    font-size: 15px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-main span,
body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats span {
    display: block !important;
    color: #5b7280 !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-main strong {
    display: block !important;
    color: #07314f !important;
    font-size: 20px !important;
    line-height: 1.12 !important;
    margin: 2px 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-main small {
    display: block !important;
    color: #5b7280 !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats > div {
    min-width: 0 !important;
    padding: 10px !important;
    border: 1px solid rgba(8, 127, 176, 0.10) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.74) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats strong {
    display: block !important;
    color: #075f68 !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench > .qq-service-bandwidth-strip {
    display: none !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
        min-height: 220px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
        grid-template-columns: 66px minmax(0, 1fr) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats {
        grid-column: 1 / -1 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
        align-items: start !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
    }
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status {
        flex: 0 0 auto !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
        min-height: 190px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
        margin-top: 10px !important;
        padding: 12px !important;
    }
}

/* v8.3 console density: remove blank gutters, deduplicate tools, and add compact service analytics. */
body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-board {
    display: grid !important;
    grid-template-columns: 104px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 14px !important;
    margin-top: 12px !important;
    padding: 14px !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 12px !important;
    background:
        linear-gradient(135deg, rgba(239, 252, 249, 0.84), rgba(255, 250, 240, 0.58)),
        radial-gradient(circle at 88% 18%, rgba(255, 215, 140, 0.22), transparent 42%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-ring {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    width: 92px !important;
    height: 92px !important;
    border-radius: 999px !important;
    background: conic-gradient(#087fb0 0 var(--qq-term-used), rgba(10, 167, 154, 0.16) var(--qq-term-used) 100%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-ring::after {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: inherit;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: inset 0 0 0 1px rgba(8, 127, 176, 0.08);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-ring span,
body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-ring small {
    position: relative;
    z-index: 1;
    display: block;
    text-align: center;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-ring span {
    color: #07314f;
    font-size: 21px;
    font-weight: 950;
    line-height: 1;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-ring small {
    color: #5b7280;
    font-size: 9px;
    font-weight: 850;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-metrics {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 9px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-metrics > div {
    min-width: 0;
    padding: 10px 11px;
    border: 1px solid rgba(8, 127, 176, 0.10);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.72);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-metrics span,
body.qqpw-next.template-clientareaproductdetails .qq-service-route-lines span {
    display: block;
    color: #5b7280;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-metrics strong {
    display: block;
    color: #07314f;
    font-size: 15px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel #domain {
    display: grid !important;
    gap: 14px !important;
    text-align: left !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel #domain > .row {
    display: grid !important;
    grid-template-columns: 180px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 12px 18px !important;
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel #domain > .row > [class*="col-sm-"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding: 0 !important;
    text-align: left !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel #domain > .qq-service-connection-row {
    grid-template-columns: minmax(0, 1fr) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel #domain > .qq-service-connection-row > .col-sm-5 {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel #domain > .qq-service-connection-row > .col-sm-7,
body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel .qq-nat-connect-card {
    width: 100% !important;
    max-width: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(350px, 0.92fr) !important;
    align-items: stretch !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel,
body.qqpw-next.template-clientareaproductdetails .qq-service-quick-tools-panel .qq-service-toolkit {
    display: flex !important;
    flex-direction: column !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-map {
    margin-top: 16px !important;
    padding: 14px !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 13px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(239, 252, 249, 0.80)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.24), transparent 36%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-head {
    display: flex !important;
    gap: 11px !important;
    align-items: flex-start !important;
    margin-bottom: 12px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-head > span {
    display: inline-grid !important;
    place-items: center !important;
    width: 38px !important;
    height: 38px !important;
    flex: 0 0 auto !important;
    color: #075f68 !important;
    border-radius: 11px !important;
    background: linear-gradient(135deg, rgba(10, 167, 154, 0.16), rgba(255, 215, 140, 0.25)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-head h6 {
    color: #07314f !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
    margin: 0 0 3px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-head p {
    color: #5b7280 !important;
    font-size: 12px !important;
    line-height: 1.42 !important;
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-lines {
    display: grid !important;
    gap: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-lines > div {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 74px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 10px 11px !important;
    overflow: hidden !important;
    border: 1px solid rgba(8, 127, 176, 0.09) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.68) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-lines > div::before {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    width: var(--route-level);
    height: 3px;
    background: linear-gradient(90deg, #0aa79a, #087fb0, #ffd78c);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-lines strong {
    color: #07314f;
    font-size: 13px;
    font-weight: 850;
    text-align: right;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-board {
        grid-template-columns: 86px minmax(0, 1fr) !important;
        padding: 12px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-ring {
        width: 76px !important;
        height: 76px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-cycle-metrics {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel #domain > .row {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-route-map {
        margin-top: 12px !important;
    }
}

/* v8.0 service workbench: surface bandwidth, server tools, and quick tools on the default page. */
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    align-items: flex-start !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
    min-height: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel {
    margin-bottom: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench {
    display: grid;
    gap: 16px;
    margin-top: 18px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-strip,
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
    border: 1px solid rgba(8, 127, 176, 0.15);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(239, 252, 249, 0.82)),
        radial-gradient(circle at 94% 8%, rgba(255, 215, 140, 0.28), transparent 34%);
    box-shadow: 0 18px 44px rgba(7, 96, 115, 0.08);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-strip {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 18px 20px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-ring {
    position: relative;
    display: grid;
    place-items: center;
    width: 78px;
    height: 78px;
    border-radius: 999px;
    background: conic-gradient(#0aa79a 0 var(--qq-bandwidth-pct), rgba(8, 127, 176, 0.10) var(--qq-bandwidth-pct) 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.84), 0 12px 28px rgba(7, 96, 115, 0.09);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-ring::after {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: inherit;
    background: rgba(255, 255, 255, 0.94);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-ring span {
    position: relative;
    z-index: 1;
    color: #087fb0;
    font-size: 17px;
    font-weight: 900;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-copy span,
body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats span,
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head p {
    color: #5b7280;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-copy span,
body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats span {
    display: block;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-copy strong {
    display: block;
    color: #07314f;
    font-size: 25px;
    line-height: 1.16;
    margin: 3px 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-copy small {
    color: #5b7280;
    font-size: 12px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(122px, 1fr));
    gap: 10px;
    min-width: 280px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats > div {
    min-width: 0;
    padding: 12px 14px;
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.76);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats strong {
    display: block;
    color: #075f68;
    font-size: 16px;
    line-height: 1.28;
    overflow-wrap: anywhere;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 390px), 1fr));
    gap: 16px;
    align-items: start;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
    min-width: 0;
    padding: 18px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 13px;
    border-bottom: 1px solid rgba(8, 127, 176, 0.12);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head > span {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    color: #075f68;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(10, 167, 154, 0.16), rgba(255, 215, 140, 0.28));
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head h5 {
    color: #07314f;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.15;
    margin: 0 0 4px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head p {
    font-size: 12.5px;
    line-height: 1.4;
    margin: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-head {
    padding: 0 0 13px;
    margin-bottom: 14px;
    border-bottom: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 0;
    background: transparent;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-grid {
    grid-template-columns: 1fr;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-tool {
    min-height: 74px;
    padding: 13px 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-credential-note {
    display: grid;
    gap: 10px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-credential-fields {
    justify-content: flex-start;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline {
    padding: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline > .card,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-widget {
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 32px rgba(7, 96, 115, 0.06) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles.lu-row {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)) !important;
    gap: 12px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles > [class*="lu-col"] {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tile--btn {
    min-height: 104px !important;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-strip {
        grid-template-columns: 66px minmax(0, 1fr);
        gap: 12px;
        padding: 14px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-ring {
        width: 66px;
        height: 66px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-copy strong {
        font-size: 20px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats {
        grid-column: 1 / -1;
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
        padding: 14px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-head,
    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head {
        align-items: flex-start;
    }
}

@media (max-width: 420px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats {
        grid-template-columns: 1fr;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles.lu-row {
        grid-template-columns: 1fr 1fr !important;
    }
}

/* v7.5 compact service value summary. */
body.qqpw-next.template-clientareaproductdetails .qq-product-facts[data-qq-service-value] {
    min-height: 0 !important;
    align-content: start !important;
    gap: 12px;
    padding: 14px !important;
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 10px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(239, 252, 249, 0.72)),
        radial-gradient(circle at 98% 2%, rgba(255, 215, 140, 0.18), transparent 34%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-value-summary {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid rgba(10, 167, 154, 0.16);
    border-radius: 10px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 253, 252, 0.74));
    box-shadow: 0 14px 30px rgba(7, 96, 115, 0.06);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-value-main {
    display: grid;
    gap: 2px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-value-main span,
body.qqpw-next.template-clientareaproductdetails .qq-service-fact span {
    display: block;
    color: #5b7280;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-value-main strong {
    color: #07314f;
    font-size: clamp(24px, 3.2vw, 34px);
    line-height: 1.08;
    font-weight: 800;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-value-main small {
    color: #4b6570;
    font-size: 12px;
    line-height: 1.35;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-value-progress {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(8, 127, 176, 0.10);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-value-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0bb8a8, #087fb0, #ffd78c);
    transition: width 0.35s ease;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-fact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-fact {
    min-width: 0;
    padding: 10px 11px;
    border: 1px solid rgba(8, 127, 176, 0.10);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.66);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-fact strong {
    display: block;
    overflow-wrap: anywhere;
    color: #07314f;
    font-size: 14px;
    line-height: 1.28;
    font-weight: 700;
    margin-top: 4px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-fact-money strong {
    color: #075f68;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-fact-wide {
    grid-column: 1 / -1;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-facts[data-qq-service-value] {
        gap: 10px;
        padding: 12px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-value-summary {
        padding: 12px;
    }
}

@media (max-width: 420px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-fact-grid {
        gap: 7px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-fact {
        padding: 9px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-fact strong {
        font-size: 13px;
    }
}

/* v7.6 full-width service console. */
body.qqpw-next.template-clientareaproductdetails .qq-breadcrumb {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-page-heading {
    min-height: 118px !important;
    padding: 30px 0 28px !important;
    background-position: center 48% !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-page-heading h1 {
    font-size: clamp(32px, 4vw, 48px) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-page-heading .qq-page-eyebrow {
    margin-bottom: 6px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-main-body {
    padding-top: 22px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-layout-row {
    justify-content: center;
}

body.qqpw-next.template-clientareaproductdetails .qq-layout-row > [class*="col-lg-4"],
body.qqpw-next.template-clientareaproductdetails .qq-layout-row > [class*="col-xl-3"],
body.qqpw-next.template-clientareaproductdetails .qq-sidebar {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-content {
    flex: 0 0 100% !important;
    max-width: 1180px !important;
    width: 100% !important;
    margin-right: auto;
    margin-left: auto;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card {
    border-radius: 12px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card > .card-body {
    padding: clamp(14px, 2vw, 20px) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    grid-template-columns: minmax(320px, 0.78fr) minmax(430px, 1.22fr) !important;
    gap: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
    min-height: 210px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console > .nav-tabs,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm {
    display: inline-flex !important;
    width: auto;
    max-width: 100%;
    gap: 4px !important;
    padding: 5px !important;
    margin: 16px 0 10px !important;
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.62) !important;
    box-shadow: 0 14px 30px rgba(7, 96, 115, 0.06);
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-item {
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link {
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #4b6570 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 8px 14px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active a,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active > a {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 10px 20px rgba(7, 96, 115, 0.08) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm-connector {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container {
    margin-top: 4px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel {
    border-radius: 12px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel-header {
    padding: 14px 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel-header h5 {
    font-size: 20px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel > .card-body {
    padding-top: 14px !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-content {
        max-width: 760px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-console > .nav-tabs,
    body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm {
        display: flex !important;
        width: 100%;
        border-radius: 14px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-item {
        flex: 1 1 auto;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a,
    body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link {
        width: 100%;
        padding-right: 10px !important;
        padding-left: 10px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-page-heading {
        min-height: 92px !important;
        padding: 22px 0 22px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-page-heading .qq-page-signal {
        display: none;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-main-body {
        padding-top: 16px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-console > .nav-tabs,
    body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm {
        gap: 5px !important;
        padding: 5px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-item {
        flex: 1 1 100%;
    }
}

/* v7.1 EOF footer compact override. */
body.qqpw-next .qq-footer {
    padding-top: clamp(28px, 5vw, 42px);
    padding-bottom: 22px;
}

body.qqpw-next .qq-footer-shell {
    display: grid !important;
    grid-template-columns: minmax(240px, 1.4fr) minmax(120px, 0.65fr) minmax(130px, 0.65fr) minmax(130px, 0.7fr) !important;
    gap: clamp(18px, 3vw, 34px) !important;
    align-items: start;
}

body.qqpw-next .qq-footer-brand-block p {
    margin: 12px 0 14px;
}

body.qqpw-next .qq-footer-nav,
body.qqpw-next .qq-footer-action-block {
    min-width: 0;
    gap: 8px;
}

body.qqpw-next .qq-footer-nav a,
body.qqpw-next .qq-footer-action-block a {
    line-height: 1.35;
}

@media (max-width: 991px) {
    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 18px 14px !important;
    }

    body.qqpw-next .qq-footer-brand-block {
        grid-column: 1 / -1;
    }

    body.qqpw-next .qq-footer-brand-block p {
        max-width: 680px;
    }

    body.qqpw-next .qq-footer-bottom {
        margin-top: 22px;
    }
}

@media (max-width: 575px) {
    body.qqpw-next .qq-footer {
        padding: 28px 0 18px;
        background-position: 68% 72% !important;
    }

    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 16px 10px !important;
    }

    body.qqpw-next .qq-footer-brand-block {
        grid-column: 1 / -1;
    }

    body.qqpw-next .qq-footer-brand .qq-brand-mark {
        width: 38px;
        height: 38px;
    }

    body.qqpw-next .qq-footer-brand-block p {
        max-width: none;
        font-size: 14px;
        line-height: 1.58;
        margin: 10px 0 12px;
    }

    body.qqpw-next .qq-footer-badges {
        gap: 6px;
    }

    body.qqpw-next .qq-footer-badges span {
        padding: 5px 8px;
        font-size: 11px;
    }

    body.qqpw-next .qq-footer-nav strong,
    body.qqpw-next .qq-footer-action-block strong {
        font-size: 10px;
    }

    body.qqpw-next .qq-footer-nav a,
    body.qqpw-next .qq-footer-action-block a {
        font-size: 13px;
    }

    body.qqpw-next .qq-footer-action-block .qq-footer-cta,
    body.qqpw-next .qq-footer-action-block .qq-locale-btn {
        padding: 7px 9px;
        font-size: 13px;
    }

    body.qqpw-next .qq-footer-bottom {
        margin-top: 20px;
        padding-top: 14px;
    }
}

@media (max-width: 374px) {
    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.qqpw-next .qq-footer-action-block {
        grid-column: 1 / -1;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 10px;
    }
}

/* v7.1 compact footer: keep navigation groups horizontal on mobile. */
body.qqpw-next .qq-footer {
    padding-top: clamp(28px, 5vw, 42px);
    padding-bottom: 22px;
}

body.qqpw-next .qq-footer-shell {
    display: grid !important;
    grid-template-columns: minmax(240px, 1.4fr) minmax(120px, 0.65fr) minmax(130px, 0.65fr) minmax(130px, 0.7fr) !important;
    gap: clamp(18px, 3vw, 34px) !important;
    align-items: start;
}

body.qqpw-next .qq-footer-brand-block p {
    margin: 12px 0 14px;
}

body.qqpw-next .qq-footer-nav,
body.qqpw-next .qq-footer-action-block {
    min-width: 0;
    gap: 8px;
}

body.qqpw-next .qq-footer-nav a,
body.qqpw-next .qq-footer-action-block a {
    line-height: 1.35;
}

@media (max-width: 991px) {
    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 18px 14px !important;
    }

    body.qqpw-next .qq-footer-brand-block {
        grid-column: 1 / -1;
    }

    body.qqpw-next .qq-footer-brand-block p {
        max-width: 680px;
    }

    body.qqpw-next .qq-footer-bottom {
        margin-top: 22px;
    }
}

@media (max-width: 575px) {
    body.qqpw-next .qq-footer {
        padding: 28px 0 18px;
        background-position: 68% 72% !important;
    }

    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 16px 10px !important;
    }

    body.qqpw-next .qq-footer-brand-block {
        grid-column: 1 / -1;
    }

    body.qqpw-next .qq-footer-brand {
        gap: 10px;
    }

    body.qqpw-next .qq-footer-brand .qq-brand-mark {
        width: 38px;
        height: 38px;
    }

    body.qqpw-next .qq-footer-brand-block p {
        max-width: none;
        font-size: 14px;
        line-height: 1.58;
        margin: 10px 0 12px;
    }

    body.qqpw-next .qq-footer-badges {
        gap: 6px;
    }

    body.qqpw-next .qq-footer-badges span {
        padding: 5px 8px;
        font-size: 11px;
    }

    body.qqpw-next .qq-footer-nav strong,
    body.qqpw-next .qq-footer-action-block strong {
        font-size: 10px;
    }

    body.qqpw-next .qq-footer-nav a,
    body.qqpw-next .qq-footer-action-block a {
        font-size: 13px;
    }

    body.qqpw-next .qq-footer-action-block .qq-footer-cta,
    body.qqpw-next .qq-footer-action-block .qq-locale-btn {
        padding: 7px 9px;
        font-size: 13px;
    }

    body.qqpw-next .qq-footer-bottom {
        margin-top: 20px;
        padding-top: 14px;
    }
}

@media (max-width: 374px) {
    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.qqpw-next .qq-footer-action-block {
        grid-column: 1 / -1;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 10px;
    }
}

/* v7.0 EOF priority layer: NAT summary and full mapping link. */
body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    gap: 8px;
    margin: 0 0 10px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary > div {
    min-width: 0;
    padding: 10px 12px;
    color: #07314f;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 8px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary span {
    display: block;
    color: #5b7280;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 5px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary strong {
    display: block;
    overflow-wrap: anywhere;
    font-size: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-secondary-link {
    width: calc(100% - 26px);
    min-height: 38px;
    margin: 0 13px 13px;
    color: #075f68 !important;
    background: rgba(255, 255, 255, 0.60);
    border-color: rgba(8, 127, 176, 0.12);
    box-shadow: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-full-link.qq-nat-secondary-link {
    width: calc(100% - 26px) !important;
    min-height: 38px !important;
    margin: 0 13px 13px !important;
    background: rgba(255, 255, 255, 0.60) !important;
    border-color: rgba(8, 127, 176, 0.12) !important;
    box-shadow: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-secondary-link:hover,
body.qqpw-next.template-clientareaproductdetails .qq-nat-secondary-link:focus {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.88);
    border-color: rgba(10, 167, 154, 0.26);
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary {
        grid-template-columns: 1fr 1fr;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary > div:first-child {
        grid-column: 1 / -1;
    }
}

/* v7.0 final priority layer: NAT summary and full mapping link. */
body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    gap: 8px;
    margin: 0 0 10px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary > div {
    min-width: 0;
    padding: 10px 12px;
    color: #07314f;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 8px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary span {
    display: block;
    color: #5b7280;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 5px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary strong {
    display: block;
    overflow-wrap: anywhere;
    font-size: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-secondary-link {
    width: calc(100% - 26px);
    min-height: 38px;
    margin: 0 13px 13px;
    color: #075f68 !important;
    background: rgba(255, 255, 255, 0.60);
    border-color: rgba(8, 127, 176, 0.12);
    box-shadow: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-secondary-link:hover,
body.qqpw-next.template-clientareaproductdetails .qq-nat-secondary-link:focus {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.88);
    border-color: rgba(10, 167, 154, 0.26);
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary {
        grid-template-columns: 1fr 1fr;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary > div:first-child {
        grid-column: 1 / -1;
    }
}

/* v7.0 NAT summary: same natmap.conf source, concise in-service connection details. */
body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    gap: 8px;
    margin: 0 0 10px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary > div {
    min-width: 0;
    padding: 10px 12px;
    color: #07314f;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 8px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary span {
    display: block;
    color: #5b7280;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 5px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary strong {
    display: block;
    overflow-wrap: anywhere;
    font-size: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-secondary-link {
    width: calc(100% - 26px);
    min-height: 38px;
    margin: 0 13px 13px;
    color: #075f68 !important;
    background: rgba(255, 255, 255, 0.60);
    border-color: rgba(8, 127, 176, 0.12);
    box-shadow: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-secondary-link:hover,
body.qqpw-next.template-clientareaproductdetails .qq-nat-secondary-link:focus {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.88);
    border-color: rgba(10, 167, 154, 0.26);
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary {
        grid-template-columns: 1fr 1fr;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-port-summary > div:first-child {
        grid-column: 1 / -1;
    }
}

/* v6.9 final priority layer: mobile service detail and compact NAT connection card. */
body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane {
    text-align: left !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane > .row {
    display: grid !important;
    grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
    gap: 8px 18px;
    align-items: start;
    margin: 0 0 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane > .row > [class*="col-sm-"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane > .row > .col-sm-5 {
    color: #5b7280;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row-nat {
    grid-template-columns: minmax(120px, 180px) minmax(280px, 620px) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-card {
    max-width: 620px;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head {
    background: linear-gradient(135deg, rgba(239, 252, 249, 0.95), rgba(255, 250, 240, 0.80));
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact {
    box-shadow: none;
    border: 0;
    background: transparent;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-primary {
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    margin-bottom: 12px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-field {
    background: rgba(255, 255, 255, 0.82);
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    margin-bottom: 10px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary code {
    display: block;
    width: 100%;
    font-size: 13px;
    line-height: 1.45;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary .qq-copy-inline {
    min-width: 74px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-note {
    margin: 0;
    padding: 10px 12px;
    color: #4b6570;
    background: rgba(255, 255, 255, 0.64);
    border: 1px solid rgba(8, 127, 176, 0.10);
    border-radius: 8px;
    font-size: 13px;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
        display: block !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row > [class*="col-"] {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status {
        height: auto !important;
        min-height: 0 !important;
        margin-bottom: 14px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .product-actions-wrapper {
        position: static !important;
        z-index: 1 !important;
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 10px;
        width: 100% !important;
        margin: 0 0 16px !important;
        transform: none !important;
    }

    body.qqpw-next.template-clientareaproductdetails .product-actions-wrapper > div {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .product-actions-wrapper .btn {
        min-height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        white-space: normal;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
        position: relative;
        z-index: 2;
        height: auto !important;
        min-height: 0 !important;
        clear: both;
    }

    body.qqpw-next.template-clientareaproductdetails .product-details-tab-container {
        padding: 18px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane > .row,
    body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row-nat {
        grid-template-columns: 1fr !important;
        gap: 7px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head {
        grid-template-columns: 34px minmax(0, 1fr);
        padding: 13px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head > span {
        width: 34px;
        height: 34px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-nat-inline-map {
        padding: 13px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-primary,
    body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-primary {
        grid-template-columns: 1fr 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-field:first-child {
        grid-column: 1 / -1;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary .qq-copy-inline {
        width: 100%;
    }
}

/* v6.9 mobile service detail and compact NAT connection card. */
body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane {
    text-align: left !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane > .row {
    display: grid !important;
    grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
    gap: 8px 18px;
    align-items: start;
    margin: 0 0 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane > .row > [class*="col-sm-"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane > .row > .col-sm-5 {
    color: #5b7280;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row-nat {
    grid-template-columns: minmax(120px, 180px) minmax(280px, 620px) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-card {
    max-width: 620px;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head {
    background: linear-gradient(135deg, rgba(239, 252, 249, 0.95), rgba(255, 250, 240, 0.80));
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact {
    box-shadow: none;
    border: 0;
    background: transparent;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-primary {
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    margin-bottom: 12px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-field {
    background: rgba(255, 255, 255, 0.82);
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-field code {
    display: inline-block;
    max-width: 100%;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    margin-bottom: 10px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary code {
    display: block;
    width: 100%;
    font-size: 13px;
    line-height: 1.45;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary .qq-copy-inline {
    min-width: 74px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-note {
    margin: 0;
    padding: 10px 12px;
    color: #4b6570;
    background: rgba(255, 255, 255, 0.64);
    border: 1px solid rgba(8, 127, 176, 0.10);
    border-radius: 8px;
    font-size: 13px;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
        display: block !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row > [class*="col-"] {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status {
        height: auto !important;
        min-height: 0 !important;
        margin-bottom: 14px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .product-actions-wrapper {
        position: static !important;
        z-index: 1 !important;
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 10px;
        width: 100% !important;
        margin: 0 0 16px !important;
        transform: none !important;
    }

    body.qqpw-next.template-clientareaproductdetails .product-actions-wrapper > div {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .product-actions-wrapper .btn {
        min-height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        white-space: normal;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
        position: relative;
        z-index: 2;
        height: auto !important;
        min-height: 0 !important;
        clear: both;
    }

    body.qqpw-next.template-clientareaproductdetails .product-details-tab-container {
        padding: 18px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane > .row,
    body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row-nat {
        grid-template-columns: 1fr !important;
        gap: 7px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head {
        grid-template-columns: 34px minmax(0, 1fr);
        padding: 13px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head > span {
        width: 34px;
        height: 34px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-nat-inline-map {
        padding: 13px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-primary,
    body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-primary {
        grid-template-columns: 1fr 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-card-compact .qq-natmap-field:first-child {
        grid-column: 1 / -1;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-command-primary .qq-copy-inline {
        width: 100%;
    }
}

/* v6.7 product console module refinement. */
body.qqpw-next.template-clientareaproductdetails .qq-product-console,
body.qqpw-next.template-clientareaproductdetails .qq-product-main-tabs,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card > .card-body,
body.qqpw-next.template-clientareaproductdetails .product-details {
    max-height: none !important;
    overflow: visible !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(239, 252, 249, 0.72)) !important;
    border-color: rgba(8, 127, 176, 0.13) !important;
    box-shadow: 0 22px 54px rgba(7, 96, 115, 0.10) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card > .card-body {
    padding: 20px !important;
    background: transparent !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    display: grid;
    grid-template-columns: minmax(280px, 0.86fr) minmax(280px, 1fr);
    gap: 16px;
    margin-right: 0;
    margin-left: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row > [class*="col-"] {
    width: auto;
    max-width: none;
    padding-right: 0;
    padding-left: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status {
    min-height: 0;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 16px 36px rgba(7, 96, 115, 0.10);
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
    min-height: 210px;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
    height: auto;
    display: grid;
    align-content: center;
    padding: 24px !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(248, 253, 252, 0.78));
    border-color: rgba(8, 127, 176, 0.12);
}

body.qqpw-next.template-clientareaproductdetails .qq-product-facts h4 {
    color: #5b7280;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px;
    background:
        linear-gradient(145deg, rgba(239, 252, 249, 0.92), rgba(255, 250, 240, 0.68)) !important;
    border: 1px solid rgba(8, 127, 176, 0.13);
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(7, 96, 115, 0.07);
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-item {
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #52697a !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    white-space: normal;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link.active {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.88) !important;
    border-color: rgba(10, 167, 154, 0.28) !important;
    box-shadow: inset 3px 0 0 #ffd78c, 0 10px 22px rgba(7, 96, 115, 0.06);
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm-connector {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container {
    padding: 24px !important;
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(247, 255, 253, 0.76)) !important;
    border-color: rgba(8, 127, 176, 0.13) !important;
    box-shadow: 0 18px 42px rgba(7, 96, 115, 0.08) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-warning {
    color: #075f68 !important;
    background: rgba(239, 252, 249, 0.88) !important;
    border-color: rgba(8, 127, 176, 0.18) !important;
    border-left: 4px solid #ffd78c;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-card,
body.qqpw-next.template-clientareaproductdetails .qq-natmap-card {
    overflow: hidden;
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(239, 252, 249, 0.74));
    border: 1px solid rgba(8, 127, 176, 0.16);
    border-radius: 8px;
    box-shadow: 0 16px 38px rgba(7, 96, 115, 0.08);
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid rgba(8, 127, 176, 0.11);
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head > span {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #07314f;
    background: linear-gradient(135deg, #9fe9df, #ffd78c);
    border-radius: 8px;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head strong,
body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head small {
    display: block;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head small {
    color: #4b6570;
    line-height: 1.45;
    margin-top: 4px;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-inline-map {
    padding: 16px;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-inline-loading {
    color: #5b7280;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-primary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-field {
    min-width: 0;
    padding: 12px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(8, 127, 176, 0.11);
    border-radius: 8px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-field span {
    display: block;
    color: #5b7280;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 5px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-field code,
body.qqpw-next.template-clientareaproductdetails .qq-natmap-command code {
    color: #07314f;
    background: rgba(239, 252, 249, 0.90);
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 6px;
    padding: 4px 7px;
    overflow-wrap: anywhere;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-command {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px;
    background: rgba(255, 250, 240, 0.66);
    border: 1px solid rgba(255, 215, 140, 0.34);
    border-radius: 8px;
    margin-bottom: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-table-wrap {
    overflow-x: auto;
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 8px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    background: rgba(255, 255, 255, 0.82);
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-table th,
body.qqpw-next.template-clientareaproductdetails .qq-natmap-table td {
    padding: 10px 12px;
    border-bottom: 1px solid rgba(8, 127, 176, 0.10);
    text-align: left;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-table th {
    color: #07314f;
    background: rgba(239, 252, 249, 0.88);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-copy-inline {
    min-height: 32px;
    color: #075f68;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(8, 127, 176, 0.18);
    border-radius: 7px;
    padding: 5px 9px;
    font-size: 12px;
    font-weight: 800;
}

body.qqpw-next.template-clientareaproductdetails .qq-copy-inline.is-copied {
    color: #ffffff;
    background: #0aa79a;
    border-color: #0aa79a;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-full-link {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: calc(100% - 32px);
    color: #075f68;
    background: rgba(255, 255, 255, 0.76);
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 8px;
    margin: 0 16px 16px;
    font-weight: 800;
    text-decoration: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel {
    overflow: hidden;
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(239, 252, 249, 0.74)) !important;
    border: 1px solid rgba(8, 127, 176, 0.14) !important;
    border-radius: 8px;
    box-shadow: 0 18px 44px rgba(7, 96, 115, 0.09) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel-header {
    color: #07314f !important;
    background:
        linear-gradient(90deg, rgba(239, 252, 249, 0.96), rgba(255, 250, 240, 0.78)) !important;
    border-bottom: 1px solid rgba(8, 127, 176, 0.13) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel-header h5 {
    color: #07314f !important;
    font-weight: 800;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .alert-info {
    color: #075f68;
    background: rgba(239, 252, 249, 0.84);
    border-color: rgba(8, 127, 176, 0.16);
    border-left: 4px solid #087fb0;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area #layers,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-app,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-table {
    color: #07314f !important;
    background: transparent !important;
    font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .h4,
body.qqpw-next.template-clientareaproductdetails .module-client-area h4 {
    color: #07314f !important;
    font-size: 22px !important;
    line-height: 1.2;
    font-weight: 800 !important;
    text-align: left !important;
    margin: 28px 0 14px !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tiles.lu-row {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    gap: 12px;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tiles > [class*="lu-col"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tile,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tile--btn {
    min-height: 132px;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #07314f !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(247, 255, 253, 0.76)) !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 8px !important;
    box-shadow: 0 12px 30px rgba(7, 96, 115, 0.06) !important;
    padding: 16px 12px !important;
    text-align: center;
    text-decoration: none !important;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tile:hover,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tile:focus {
    border-color: rgba(10, 167, 154, 0.30) !important;
    box-shadow: 0 16px 36px rgba(7, 96, 115, 0.10) !important;
    transform: translateY(-1px);
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-i-c-6x {
    width: 54px !important;
    height: 54px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-i-c-6x img {
    max-width: 46px;
    max-height: 46px;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tile__title {
    color: #07314f !important;
    font-size: 13px !important;
    line-height: 1.24;
    font-weight: 800 !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget {
    overflow: hidden;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 8px !important;
    box-shadow: 0 14px 34px rgba(7, 96, 115, 0.06) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget__header {
    color: #07314f !important;
    background: rgba(239, 252, 249, 0.88) !important;
    border-bottom: 1px solid rgba(8, 127, 176, 0.12) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-top__title {
    color: #07314f !important;
    font-weight: 800 !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget__body {
    background: rgba(255, 255, 255, 0.82) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-table th,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-table td,
body.qqpw-next.template-clientareaproductdetails .module-client-area table th,
body.qqpw-next.template-clientareaproductdetails .module-client-area table td {
    color: #07314f !important;
    border-color: rgba(8, 127, 176, 0.10) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-table tr:hover td {
    background: rgba(239, 252, 249, 0.52) !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs {
        display: grid;
        grid-template-columns: 1fr;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-primary,
    body.qqpw-next.template-clientareaproductdetails .qq-natmap-command {
        grid-template-columns: 1fr;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-natmap-command {
        display: grid;
    }

    body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tiles.lu-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* v6.0 light Hawaii gallery system pass for shared pages. */
body.qqpw-next:not(.template-login) {
    background: #f6ffff;
}

body.qqpw-next:not(.template-login) .qq-main-body {
    background:
        radial-gradient(circle at 88% 4%, rgba(255, 215, 140, 0.18), transparent 24rem),
        radial-gradient(circle at 8% 30%, rgba(10, 167, 154, 0.08), transparent 20rem),
        linear-gradient(180deg, #f7ffff 0%, #edfafa 56%, #fffaf0 100%);
}

body.qqpw-next:not(.template-login) .qq-page-heading,
body.qqpw-next:not(.template-login) .qq-order-heading,
body.qqpw-next:not(.template-login).template-clientareahome .qq-page-heading,
body.qqpw-next:not(.template-login).template-clientareaproducts .qq-page-heading,
body.qqpw-next:not(.template-login).template-clientareaproductdetails .qq-page-heading {
    min-height: 154px;
    padding: 40px 0 42px;
    color: #07314f;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.92) 0%, rgba(247, 255, 253, 0.64) 48%, rgba(255, 250, 240, 0.34) 100%),
        url("../img/hawaii-luminous-private-wide-v7.png") center 46% / cover no-repeat;
    border-bottom: 1px solid rgba(8, 127, 176, 0.12);
}

body.qqpw-next:not(.template-login) .qq-page-heading-row {
    min-height: 72px;
    align-items: center;
}

body.qqpw-next:not(.template-login) .qq-page-heading h1,
body.qqpw-next:not(.template-login) .qq-order-heading h1 {
    color: #07314f;
    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.05;
    text-shadow: none;
}

body.qqpw-next:not(.template-login) .qq-page-signal {
    display: none !important;
}

body.qqpw-next:not(.template-login) .qq-atoll-hero {
    color: #07314f;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.90) 0%, rgba(247, 255, 253, 0.62) 48%, rgba(255, 250, 240, 0.28) 100%),
        url("../img/hawaii-luminous-private-art-v7.png") center 42% / cover no-repeat;
    padding: 56px 0 46px;
}

body.qqpw-next:not(.template-login) .qq-atoll-hero::before {
    display: none;
}

body.qqpw-next:not(.template-login) .qq-atoll-hero::after {
    height: 4px;
    background: linear-gradient(90deg, #087fb0, #0aa79a, #ffd78c, #df5b46);
}

body.qqpw-next:not(.template-login) .qq-atoll-copy h1,
body.qqpw-next:not(.template-login) .qq-atoll-copy .qq-eyebrow {
    color: #07314f;
}

body.qqpw-next:not(.template-login) .qq-atoll-copy .qq-hero-line {
    color: #38535f;
}

body.qqpw-next:not(.template-login) .qq-atoll-copy .qq-eyebrow {
    background: rgba(255, 255, 255, 0.72);
    border-color: rgba(10, 167, 154, 0.24);
    box-shadow: 0 12px 24px rgba(7, 96, 115, 0.06);
}

body.qqpw-next:not(.template-login) .qq-atoll-order,
body.qqpw-next:not(.template-login) .qq-client-command,
body.qqpw-next:not(.template-login) .qq-services-command {
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(247, 255, 253, 0.66));
    border: 1px solid rgba(8, 127, 176, 0.14);
    box-shadow: 0 24px 58px rgba(7, 96, 115, 0.13);
    backdrop-filter: blur(18px);
}

body.qqpw-next:not(.template-login) .qq-atoll-order-head span,
body.qqpw-next:not(.template-login) .qq-atoll-order-head em {
    display: none;
}

body.qqpw-next:not(.template-login) .qq-atoll-order-head {
    border-bottom-color: rgba(8, 127, 176, 0.12);
}

body.qqpw-next:not(.template-login) .qq-atoll-order-head strong {
    color: #07314f;
}

body.qqpw-next:not(.template-login) .qq-atoll-product,
body.qqpw-next:not(.template-login) .qq-client-command-actions a {
    color: #07314f;
    background: rgba(255, 255, 255, 0.76);
    border-color: rgba(8, 127, 176, 0.14);
}

body.qqpw-next:not(.template-login) .qq-atoll-product strong {
    color: #07314f;
}

body.qqpw-next:not(.template-login) .qq-atoll-product small {
    color: #506b76;
}

body.qqpw-next:not(.template-login) .qq-atoll-product > .fa-arrow-right {
    color: #087fb0;
}

body.qqpw-next:not(.template-login) .qq-atoll-order-foot span {
    color: #38535f;
    background: rgba(255, 255, 255, 0.70);
    border-color: rgba(8, 127, 176, 0.12);
}

body.qqpw-next:not(.template-login) .qq-atoll-signals span {
    color: #38535f;
    background: rgba(255, 255, 255, 0.70);
    border-color: rgba(8, 127, 176, 0.12);
}

body.qqpw-next:not(.template-login) .qq-atoll-signals strong {
    color: #07314f;
}

body.qqpw-next:not(.template-login) .qq-atoll-strip {
    display: none;
}

body.qqpw-next:not(.template-login) .qq-home-products-compact {
    padding-top: 44px !important;
}

body.qqpw-next:not(.template-login) .qq-sidebar,
body.qqpw-next:not(.template-login) #order-standard_cart .cart-sidebar {
    color: #07314f;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(239, 252, 249, 0.74));
    border: 1px solid rgba(8, 127, 176, 0.13);
    box-shadow: 0 18px 46px rgba(7, 96, 115, 0.10);
    backdrop-filter: blur(16px);
}

body.qqpw-next:not(.template-login) .qq-sidebar .panel,
body.qqpw-next:not(.template-login) .qq-sidebar .card,
body.qqpw-next:not(.template-login) .qq-sidebar .list-group {
    background: transparent !important;
}

body.qqpw-next:not(.template-login) .qq-sidebar .panel-heading,
body.qqpw-next:not(.template-login) .qq-sidebar .card-header {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.54) !important;
    border-color: rgba(8, 127, 176, 0.10) !important;
}

body.qqpw-next:not(.template-login) .qq-sidebar .list-group-item,
body.qqpw-next:not(.template-login) .qq-sidebar a.list-group-item {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.34) !important;
    border-color: rgba(8, 127, 176, 0.08) !important;
}

body.qqpw-next:not(.template-login) .qq-sidebar a.list-group-item:hover,
body.qqpw-next:not(.template-login) .qq-sidebar a.list-group-item:focus,
body.qqpw-next:not(.template-login) .qq-sidebar .list-group-item.active,
body.qqpw-next:not(.template-login) .qq-sidebar .list-group-item.active:hover,
body.qqpw-next:not(.template-login) .qq-sidebar .list-group-item.active:focus {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.82) !important;
    border-color: rgba(10, 167, 154, 0.28) !important;
    box-shadow: inset 3px 0 0 #ffd78c, 0 10px 24px rgba(7, 96, 115, 0.06) !important;
}

body.qqpw-next:not(.template-login) .qqpw-next .table-container,
body.qqpw-next:not(.template-login) .table-container,
body.qqpw-next:not(.template-login) .dataTables_wrapper,
body.qqpw-next:not(.template-login) .qq-content > .card,
body.qqpw-next:not(.template-login) .qq-content > .panel,
body.qqpw-next:not(.template-login) .qq-content .client-home-cards .card,
body.qqpw-next:not(.template-login) .qq-content .client-home-panels .card,
body.qqpw-next:not(.template-login) .qq-content .client-home-panels .panel {
    background: rgba(255, 255, 255, 0.86) !important;
    border-color: rgba(8, 127, 176, 0.12) !important;
    box-shadow: 0 16px 38px rgba(7, 96, 115, 0.08) !important;
}

body.qqpw-next:not(.template-login) .dataTables_wrapper .dataTables_length,
body.qqpw-next:not(.template-login) .dataTables_wrapper .dataTables_filter,
body.qqpw-next:not(.template-login) .dataTables_wrapper .dataTables_info {
    color: #4b6570 !important;
}

body.qqpw-next:not(.template-login) .dataTables_wrapper .dataTables_length select,
body.qqpw-next:not(.template-login) .dataTables_wrapper .dataTables_filter input,
body.qqpw-next:not(.template-login) .form-control,
body.qqpw-next:not(.template-login) select.form-control {
    color: #07314f;
    background: rgba(255, 255, 255, 0.82);
    border-color: rgba(8, 127, 176, 0.17);
    border-radius: 8px;
    box-shadow: none;
}

body.qqpw-next:not(.template-login) .table {
    color: #173448;
    background: rgba(255, 255, 255, 0.84);
}

body.qqpw-next:not(.template-login) .table thead th,
body.qqpw-next:not(.template-login) table.dataTable thead th,
body.qqpw-next:not(.template-login) table.dataTable thead td {
    color: #07314f !important;
    background:
        linear-gradient(180deg, rgba(239, 252, 249, 0.98), rgba(255, 250, 240, 0.92)) !important;
    border-color: rgba(8, 127, 176, 0.16) !important;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.60);
    text-shadow: none !important;
}

body.qqpw-next:not(.template-login) .table tbody td,
body.qqpw-next:not(.template-login) table.dataTable tbody td {
    color: #173448;
    background: rgba(255, 255, 255, 0.78) !important;
    border-color: rgba(8, 127, 176, 0.11) !important;
}

body.qqpw-next:not(.template-login) .table tbody tr:hover td,
body.qqpw-next:not(.template-login) table.dataTable tbody tr:hover td {
    background: rgba(239, 252, 249, 0.72) !important;
}

body.qqpw-next:not(.template-login) .btn-info,
body.qqpw-next:not(.template-login) .btn-primary,
body.qqpw-next:not(.template-login) .btn-success {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0bb8a8, #087fb0) !important;
    border-color: transparent !important;
}

body.qqpw-next:not(.template-login) .qq-footer {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(237, 250, 248, 0.94)),
        url("../img/hawaii-luminous-private-wide-v7.png") center 64% / cover no-repeat;
}

@media (max-width: 991px) {
    body.qqpw-next:not(.template-login) .qq-page-heading,
    body.qqpw-next:not(.template-login) .qq-order-heading {
        min-height: 128px;
        padding: 30px 0 32px;
        background-position: center 44%;
    }

    body.qqpw-next:not(.template-login) .qq-atoll-hero {
        padding: 42px 0 38px;
        background-position: 36% 42%;
    }
}

@media (max-width: 575px) {
    body.qqpw-next:not(.template-login) .qq-page-heading,
    body.qqpw-next:not(.template-login) .qq-order-heading {
        min-height: 108px;
        padding: 24px 0 26px;
    }

    body.qqpw-next:not(.template-login) .qq-atoll-signals {
        display: none;
    }
}

/* v6.1 remove remaining network-map motifs from the light system. */
body.qqpw-next:not(.template-login) .qq-header {
    color: #07314f;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(238, 250, 248, 0.82)),
        url("../img/hawaii-luminous-private-wide-v7.png") center 36% / cover no-repeat;
    border-bottom: 1px solid rgba(8, 127, 176, 0.12);
    box-shadow: 0 14px 34px rgba(7, 96, 115, 0.08);
}

body.qqpw-next:not(.template-login) .qq-atoll-signals {
    display: none !important;
}

body.qqpw-next:not(.template-login) .qq-atoll-copy .qq-hero-actions {
    margin-top: 26px;
}

/* v6.2 homepage editorial balance: premium first viewport without losing purchase access. */
body.qqpw-next.template-homepage .qq-atoll-shell {
    max-width: 1120px;
    margin-right: auto;
    margin-left: auto;
    grid-template-columns: minmax(0, 0.95fr) minmax(360px, 0.72fr);
    gap: clamp(34px, 5vw, 64px);
}

body.qqpw-next.template-homepage .qq-atoll-copy {
    padding-left: clamp(8px, 2.4vw, 28px);
}

body.qqpw-next.template-homepage .qq-atoll-copy h1 {
    max-width: 690px;
    font-size: clamp(44px, 5.1vw, 60px);
    line-height: 1.02;
    letter-spacing: 0;
}

body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
    max-width: 610px;
}

body.qqpw-next.template-homepage .qq-atoll-order {
    align-self: center;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.76), rgba(247, 255, 253, 0.56));
    border-color: rgba(255, 255, 255, 0.56);
    box-shadow:
        0 26px 70px rgba(7, 96, 115, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.66);
}

body.qqpw-next.template-homepage .qq-atoll-order-head strong {
    font-size: 22px;
}

body.qqpw-next.template-homepage .qq-atoll-product {
    background: rgba(255, 255, 255, 0.70);
    box-shadow: 0 10px 26px rgba(7, 96, 115, 0.05);
}

body.qqpw-next.template-homepage .qq-atoll-order-foot {
    opacity: 0.82;
}

@media (min-width: 1200px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-top: 68px;
        padding-bottom: 58px;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        grid-template-columns: 1fr;
        max-width: 720px;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy {
        padding-left: 0;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1,
    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        max-width: none;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        font-size: clamp(40px, 12vw, 52px);
    }

    body.qqpw-next.template-homepage .qq-atoll-order {
        margin-top: 8px;
    }
}

/* v6.3 homepage role split: hero builds trust, product cards handle purchase choice. */
body.qqpw-next.template-homepage .qq-atoll-shell {
    max-width: 1160px;
    grid-template-columns: minmax(0, 0.98fr) minmax(360px, 0.68fr);
}

body.qqpw-next.template-homepage .qq-atoll-trust-panel {
    position: relative;
    overflow: hidden;
    padding: 24px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(246, 255, 252, 0.58)),
        radial-gradient(circle at 88% 8%, rgba(255, 215, 140, 0.26), transparent 14rem);
    border: 1px solid rgba(255, 255, 255, 0.66);
    box-shadow:
        0 28px 72px rgba(7, 96, 115, 0.13),
        inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

body.qqpw-next.template-homepage .qq-atoll-trust-panel::before {
    content: "";
    position: absolute;
    right: -72px;
    bottom: -92px;
    width: 220px;
    height: 220px;
    pointer-events: none;
    background:
        radial-gradient(circle at 52% 52%, rgba(255, 215, 140, 0.24) 0 6px, transparent 7px),
        radial-gradient(ellipse at 50% 18%, rgba(255, 255, 255, 0.60) 0 22px, transparent 23px),
        radial-gradient(ellipse at 82% 52%, rgba(255, 255, 255, 0.52) 0 22px, transparent 23px),
        radial-gradient(ellipse at 50% 84%, rgba(255, 255, 255, 0.48) 0 22px, transparent 23px),
        radial-gradient(ellipse at 18% 52%, rgba(255, 255, 255, 0.50) 0 22px, transparent 23px);
    opacity: 0.52;
    transform: rotate(-18deg);
}

body.qqpw-next.template-homepage .qq-trust-panel-head,
body.qqpw-next.template-homepage .qq-trust-route-card,
body.qqpw-next.template-homepage .qq-trust-grid,
body.qqpw-next.template-homepage .qq-trust-actions {
    position: relative;
    z-index: 1;
}

body.qqpw-next.template-homepage .qq-trust-panel-head {
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(8, 127, 176, 0.12);
    margin-bottom: 16px;
}

body.qqpw-next.template-homepage .qq-trust-panel-head p {
    color: #08766f;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
    margin: 0 0 8px;
}

body.qqpw-next.template-homepage .qq-trust-panel-head strong {
    display: block;
    color: #07314f;
    font-size: 23px;
    line-height: 1.18;
    font-weight: 800;
    text-wrap: balance;
}

body.qqpw-next.template-homepage .qq-trust-route-card {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 104px;
    padding: 16px;
    color: #07314f;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(239, 252, 249, 0.66));
    border: 1px solid rgba(8, 127, 176, 0.13);
    border-radius: 8px;
    box-shadow: 0 14px 32px rgba(7, 96, 115, 0.07);
}

body.qqpw-next.template-homepage .qq-trust-route-mark {
    width: 54px;
    height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #07314f;
    background: linear-gradient(135deg, #9fe9df, #ffd78c);
    border-radius: 8px;
    font-weight: 900;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.70);
}

body.qqpw-next.template-homepage .qq-trust-route-card strong,
body.qqpw-next.template-homepage .qq-trust-route-card small {
    display: block;
}

body.qqpw-next.template-homepage .qq-trust-route-card strong {
    color: #07314f;
    font-size: 16px;
    line-height: 1.22;
    font-weight: 800;
}

body.qqpw-next.template-homepage .qq-trust-route-card small {
    color: #4b6570;
    line-height: 1.45;
    margin-top: 5px;
}

body.qqpw-next.template-homepage .qq-trust-route-card em {
    color: #08766f;
    background: rgba(10, 167, 154, 0.10);
    border: 1px solid rgba(10, 167, 154, 0.18);
    border-radius: 999px;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    padding: 6px 10px;
}

body.qqpw-next.template-homepage .qq-trust-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

body.qqpw-next.template-homepage .qq-trust-grid span {
    min-height: 94px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #38535f;
    background: rgba(255, 255, 255, 0.60);
    border: 1px solid rgba(8, 127, 176, 0.11);
    border-radius: 8px;
    padding: 14px;
}

body.qqpw-next.template-homepage .qq-trust-grid i {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #08766f;
    background: rgba(10, 167, 154, 0.10);
    border-radius: 8px;
    margin-bottom: 10px;
}

body.qqpw-next.template-homepage .qq-trust-grid strong,
body.qqpw-next.template-homepage .qq-trust-grid small {
    display: block;
}

body.qqpw-next.template-homepage .qq-trust-grid strong {
    color: #07314f;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 800;
}

body.qqpw-next.template-homepage .qq-trust-grid small {
    color: #607883;
    font-size: 12px;
    line-height: 1.35;
    margin-top: 4px;
}

body.qqpw-next.template-homepage .qq-trust-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

body.qqpw-next.template-homepage .qq-trust-actions a {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    color: #075f68;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

body.qqpw-next.template-homepage .qq-trust-actions a:hover,
body.qqpw-next.template-homepage .qq-trust-actions a:focus {
    color: #07314f;
    border-color: rgba(10, 167, 154, 0.28);
    box-shadow: 0 12px 26px rgba(7, 96, 115, 0.08);
    transform: translateY(-1px);
}

body.qqpw-next.template-homepage .qq-home-products-compact {
    padding-top: 52px !important;
}

body.qqpw-next.template-homepage .qq-home-products-compact .qq-section-heading {
    align-items: flex-end;
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        grid-template-columns: 1fr;
    }

    body.qqpw-next.template-homepage .qq-atoll-trust-panel {
        max-width: 620px;
        margin-right: auto;
        margin-left: auto;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-trust-panel {
        padding: 18px;
    }

    body.qqpw-next.template-homepage .qq-trust-panel-head strong {
        font-size: 20px;
    }

    body.qqpw-next.template-homepage .qq-trust-route-card {
        grid-template-columns: 46px minmax(0, 1fr);
    }

    body.qqpw-next.template-homepage .qq-trust-route-mark {
        width: 46px;
        height: 46px;
    }

    body.qqpw-next.template-homepage .qq-trust-route-card em {
        grid-column: 2;
        justify-self: start;
        margin-top: 2px;
    }

    body.qqpw-next.template-homepage .qq-trust-grid,
    body.qqpw-next.template-homepage .qq-trust-actions {
        grid-template-columns: 1fr;
    }
}

/* v6.4 tuned for mobile Chrome desktop mode and compact tablets. */
@media (min-width: 768px) and (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-top: 40px;
        padding-bottom: 38px;
        background:
            linear-gradient(90deg, rgba(255, 255, 255, 0.94) 0%, rgba(247, 255, 253, 0.72) 54%, rgba(255, 250, 240, 0.48) 100%),
            radial-gradient(circle at 84% 10%, rgba(255, 255, 255, 0.48), transparent 15rem),
            url("../img/hawaii-luminous-private-art-v7.png") center 42% / cover no-repeat;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        max-width: 760px;
        gap: 26px;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        max-width: 720px;
        font-size: clamp(38px, 5.1vw, 44px);
        line-height: 1.04;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        max-width: 700px;
        font-size: 16px;
        line-height: 1.52;
        margin-bottom: 18px;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-actions {
        margin-top: 20px;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .btn {
        min-height: 42px;
        padding-right: 16px;
        padding-left: 16px;
    }

    body.qqpw-next.template-homepage .qq-atoll-trust-panel {
        width: 100%;
        max-width: none !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        padding: 18px;
        border-color: rgba(255, 255, 255, 0.72);
        box-shadow:
            0 22px 52px rgba(7, 96, 115, 0.11),
            inset 0 1px 0 rgba(255, 255, 255, 0.76);
    }

    body.qqpw-next.template-homepage .qq-trust-panel-head {
        padding-bottom: 14px;
        margin-bottom: 12px;
    }

    body.qqpw-next.template-homepage .qq-trust-panel-head strong {
        max-width: 620px;
        font-size: 21px;
    }

    body.qqpw-next.template-homepage .qq-trust-route-card {
        min-height: 78px;
        grid-template-columns: 48px minmax(0, 1fr) auto;
        padding: 13px 14px;
    }

    body.qqpw-next.template-homepage .qq-trust-route-mark {
        width: 48px;
        height: 48px;
    }

    body.qqpw-next.template-homepage .qq-trust-route-card small {
        max-width: 480px;
    }

    body.qqpw-next.template-homepage .qq-trust-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
    }

    body.qqpw-next.template-homepage .qq-trust-grid span {
        min-height: 78px;
        padding: 12px;
    }

    body.qqpw-next.template-homepage .qq-trust-grid i {
        width: 26px;
        height: 26px;
        margin-bottom: 7px;
    }

    body.qqpw-next.template-homepage .qq-trust-grid strong {
        font-size: 13px;
    }

    body.qqpw-next.template-homepage .qq-trust-grid small {
        font-size: 11px;
    }

    body.qqpw-next.template-homepage .qq-trust-actions a {
        min-height: 38px;
    }

    body.qqpw-next.template-homepage .qq-home-products-compact {
        width: 100%;
        max-width: 760px;
        padding-right: 0 !important;
        padding-left: 0 !important;
        padding-top: 42px !important;
    }

    body.qqpw-next.template-homepage .qq-home-dock {
        width: 100%;
        max-width: 760px;
        padding-right: 0 !important;
        padding-left: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-product-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    body.qqpw-next.template-homepage .qq-product-card {
        min-height: 132px;
        display: grid;
        grid-template-columns: 52px minmax(0, 1fr) minmax(154px, 190px);
        grid-template-rows: auto auto auto;
        align-items: center;
        column-gap: 18px;
        padding: 18px 20px;
    }

    body.qqpw-next.template-homepage .qq-product-card-icon {
        grid-row: 1 / span 3;
        margin-bottom: 0;
    }

    body.qqpw-next.template-homepage .qq-product-card .qq-card-meta,
    body.qqpw-next.template-homepage .qq-product-card h3,
    body.qqpw-next.template-homepage .qq-product-card p {
        grid-column: 2;
    }

    body.qqpw-next.template-homepage .qq-product-card h3 {
        font-size: 18px;
    }

    body.qqpw-next.template-homepage .qq-product-card p {
        margin-bottom: 0;
    }

    body.qqpw-next.template-homepage .qq-product-card .btn {
        grid-column: 3;
        grid-row: 1 / span 3;
        align-self: center;
        margin-top: 0;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-top: 30px;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        font-size: clamp(34px, 10.6vw, 43px);
        line-height: 1.05;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        font-size: 16px;
        line-height: 1.55;
    }

    body.qqpw-next.template-homepage .qq-trust-grid,
    body.qqpw-next.template-homepage .qq-trust-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    body.qqpw-next.template-homepage .qq-trust-grid span {
        min-height: 116px;
        padding: 12px;
    }

    body.qqpw-next.template-homepage .qq-trust-actions a {
        min-height: 42px;
        font-size: 12px;
    }
}

/* v5.9 luminous private Hawaii gallery login, aligned with the light site theme. */
body.qqpw-next.template-login {
    color: #07314f;
    background: #f7ffff;
}

body.qqpw-next.template-login .qq-header {
    color: #07314f;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(238, 250, 248, 0.78)),
        url("../img/hawaii-luminous-private-wide-v7.png") center 38% / cover no-repeat;
    border-bottom: 1px solid rgba(8, 127, 176, 0.13);
    box-shadow: 0 16px 38px rgba(7, 96, 115, 0.10);
}

body.qqpw-next.template-login .qq-navbar {
    background: rgba(255, 255, 255, 0.36);
}

body.qqpw-next.template-login .qq-navbar-row {
    min-height: 84px;
}

body.qqpw-next.template-login .qq-brand .logo-img {
    filter: drop-shadow(0 10px 18px rgba(7, 96, 115, 0.18));
}

body.qqpw-next.template-login .qq-search,
body.qqpw-next.template-login .qq-mobile-search,
body.qqpw-next.template-login .qq-cart-link,
body.qqpw-next.template-login .qq-menu-toggle {
    color: #07314f;
    background: rgba(255, 255, 255, 0.72);
    border-color: rgba(8, 127, 176, 0.16);
    box-shadow: 0 12px 28px rgba(7, 96, 115, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.64);
    backdrop-filter: blur(16px);
}

body.qqpw-next.template-login .qq-search input,
body.qqpw-next.template-login .qq-mobile-search input {
    color: #07314f;
}

body.qqpw-next.template-login .qq-search input::placeholder,
body.qqpw-next.template-login .qq-mobile-search input::placeholder {
    color: #5e7a86;
}

body.qqpw-next.template-login .qq-search-submit {
    color: #087fb0;
}

body.qqpw-next.template-login .qq-mainnav {
    background: rgba(255, 255, 255, 0.70);
    border-top: 1px solid rgba(255, 255, 255, 0.58);
    border-bottom: 1px solid rgba(8, 127, 176, 0.12);
    box-shadow: none;
    backdrop-filter: blur(18px);
}

body.qqpw-next.template-login .qq-mainnav .navbar-nav > li > a,
body.qqpw-next.template-login .qq-mainnav .nav-link,
body.qqpw-next.template-login .qq-mainnav .dropdown-toggle {
    color: #07314f !important;
}

body.qqpw-next.template-login .qq-mainnav .navbar-nav > li > a:hover,
body.qqpw-next.template-login .qq-mainnav .navbar-nav > li > a:focus,
body.qqpw-next.template-login .qq-mainnav .nav-link:hover,
body.qqpw-next.template-login .qq-mainnav .nav-link:focus,
body.qqpw-next.template-login .qq-mainnav .dropdown.show > .dropdown-toggle {
    color: #075f68 !important;
    background: rgba(239, 252, 249, 0.86) !important;
}

body.qqpw-next.template-login .qq-mainnav .dropdown-menu {
    background: rgba(255, 255, 255, 0.96) !important;
    border-color: rgba(8, 127, 176, 0.14) !important;
    box-shadow: 0 22px 48px rgba(7, 96, 115, 0.15) !important;
}

body.qqpw-next.template-login .qq-mainnav .dropdown-menu > li > a,
body.qqpw-next.template-login .qq-mainnav .dropdown-menu a,
body.qqpw-next.template-login .qq-mainnav .dropdown-item {
    color: #07314f !important;
}

body.qqpw-next.template-login .qq-mainnav .dropdown-menu > li > a:hover,
body.qqpw-next.template-login .qq-mainnav .dropdown-menu a:hover,
body.qqpw-next.template-login .qq-mainnav .dropdown-item:hover {
    color: #08766f !important;
    background: rgba(239, 252, 249, 0.95) !important;
}

body.qqpw-next.template-login .qq-breadcrumb,
body.qqpw-next.template-login .qq-page-heading {
    display: none;
}

body.qqpw-next.template-login .qq-main-body {
    position: relative;
    min-height: calc(100vh - 141px);
    padding: clamp(52px, 7vw, 88px) 0 clamp(66px, 8vw, 104px);
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.58) 42%, rgba(255, 250, 240, 0.32) 100%),
        linear-gradient(180deg, rgba(247, 255, 253, 0.28), rgba(255, 250, 240, 0.38)),
        url("../img/hawaii-luminous-private-art-v7.png") center center / cover no-repeat;
}

body.qqpw-next.template-login .qq-main-body::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 73% 14%, rgba(255, 215, 140, 0.20), transparent 22rem),
        radial-gradient(circle at 17% 42%, rgba(10, 167, 154, 0.12), transparent 18rem),
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 250, 240, 0.28));
}

body.qqpw-next.template-login .logincontainer,
body.qqpw-next.template-login .login-form {
    width: 100%;
    max-width: 1180px !important;
}

body.qqpw-next.template-login .login-form {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: flex-start;
    margin: 0 auto;
    padding: 0 28px;
}

body.qqpw-next.template-login .login-form .card {
    display: block !important;
    width: min(448px, 100%);
    overflow: hidden;
    margin-right: auto !important;
    margin-left: 0 !important;
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.80), rgba(247, 255, 253, 0.62)),
        rgba(255, 255, 255, 0.56);
    border: 1px solid rgba(8, 127, 176, 0.16);
    border-radius: 8px;
    box-shadow:
        0 28px 72px rgba(7, 96, 115, 0.17),
        inset 0 1px 0 rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(22px) saturate(122%);
}

body.qqpw-next.template-login .login-form .card::before {
    content: "";
    display: block !important;
    height: 5px;
    min-height: 0;
    background: linear-gradient(90deg, #087fb0, #0aa79a 46%, #ffd78c 78%, #df5b46);
}

body.qqpw-next.template-login .login-form .card::after {
    display: none;
}

body.qqpw-next.template-login .login-form .card-body {
    padding: 42px 40px 34px !important;
    color: #07314f;
}

body.qqpw-next.template-login .login-form h1,
body.qqpw-next.template-login .login-form h2,
body.qqpw-next.template-login .login-form h3,
body.qqpw-next.template-login .login-form h4,
body.qqpw-next.template-login .login-form h5,
body.qqpw-next.template-login .login-form h6,
body.qqpw-next.template-login .login-form .h1,
body.qqpw-next.template-login .login-form .h2,
body.qqpw-next.template-login .login-form .h3,
body.qqpw-next.template-login .login-form .h4,
body.qqpw-next.template-login .login-form .h5,
body.qqpw-next.template-login .login-form .h6 {
    color: #07314f;
    text-shadow: none;
}

body.qqpw-next.template-login .login-form p,
body.qqpw-next.template-login .login-form label,
body.qqpw-next.template-login .login-form .small,
body.qqpw-next.template-login .login-form .text-muted {
    color: #4b6570 !important;
}

body.qqpw-next.template-login .login-form label {
    color: #173448 !important;
}

body.qqpw-next.template-login .login-form a,
body.qqpw-next.template-login .login-form a.text-muted,
body.qqpw-next.template-login .login-form .small.text-muted,
body.qqpw-next.template-login .login-form .card-footer a {
    color: #08766f !important;
}

body.qqpw-next.template-login .login-form .input-group {
    overflow: hidden;
    border: 1px solid rgba(8, 127, 176, 0.16);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: 0 12px 24px rgba(7, 96, 115, 0.06);
}

body.qqpw-next.template-login .login-form .form-control {
    min-height: 46px;
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.76) !important;
    border: 0 !important;
    box-shadow: none;
}

body.qqpw-next.template-login .login-form .form-control::placeholder {
    color: #6c818a !important;
    opacity: 1;
}

body.qqpw-next.template-login .login-form .input-group-text,
body.qqpw-next.template-login .login-form .input-group-addon {
    min-width: 46px;
    justify-content: center;
    color: #08766f !important;
    background: rgba(239, 252, 249, 0.88) !important;
    border: 0 !important;
    border-right: 1px solid rgba(8, 127, 176, 0.12) !important;
}

body.qqpw-next.template-login .login-form .btn-primary,
body.qqpw-next.template-login .login-form button[type="submit"] {
    min-height: 44px;
    color: #ffffff !important;
    background: linear-gradient(135deg, #0bb8a8, #087fb0) !important;
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: 0 14px 28px rgba(8, 127, 176, 0.20);
}

body.qqpw-next.template-login .login-form .card-footer {
    padding: 18px 40px 28px !important;
    color: #4b6570;
    background: rgba(248, 253, 252, 0.82);
    border-top: 1px solid rgba(8, 127, 176, 0.11);
}

body.qqpw-next.template-login .login-form .card-footer a {
    color: #08766f !important;
}

body.qqpw-next.template-login .qq-footer {
    color: #07314f;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(237, 250, 248, 0.94)),
        url("../img/hawaii-luminous-private-wide-v7.png") center 64% / cover no-repeat;
    border-top: 1px solid rgba(8, 127, 176, 0.14);
}

body.qqpw-next.template-login .qq-footer::before {
    background: linear-gradient(90deg, #087fb0, #0aa79a, #ffd78c, #df5b46);
}

body.qqpw-next.template-login .qq-footer-brand,
body.qqpw-next.template-login .qq-footer-brand:hover,
body.qqpw-next.template-login .qq-footer-nav strong,
body.qqpw-next.template-login .qq-footer-action-block strong {
    color: #07314f;
}

body.qqpw-next.template-login .qq-footer-brand-block p,
body.qqpw-next.template-login .qq-footer-copy,
body.qqpw-next.template-login .qq-footer-nav a,
body.qqpw-next.template-login .qq-footer-action-block a {
    color: #38535f;
}

body.qqpw-next.template-login .qq-footer-nav a:hover,
body.qqpw-next.template-login .qq-footer-action-block a:hover {
    color: #08766f;
}

body.qqpw-next.template-login .qq-footer-badges span,
body.qqpw-next.template-login .qq-footer-action-block .qq-footer-cta,
body.qqpw-next.template-login .qq-footer-action-block .qq-locale-btn {
    color: #075f68;
    background: rgba(255, 255, 255, 0.66);
    border-color: rgba(10, 167, 154, 0.22);
}

body.qqpw-next.template-login .qq-footer-bottom {
    border-top-color: rgba(8, 127, 176, 0.16);
}

@media (max-width: 1199px) {
    body.qqpw-next.template-login .qq-mainnav .navbar-collapse {
        background: rgba(255, 255, 255, 0.96) !important;
        border-color: rgba(8, 127, 176, 0.14) !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-login .qq-main-body {
        min-height: auto;
        padding: 48px 0 64px;
        background-position: 44% center;
    }

    body.qqpw-next.template-login .login-form {
        justify-content: center;
        padding: 0 22px;
    }

    body.qqpw-next.template-login .login-form .card {
        max-width: 540px !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-login .qq-navbar-row {
        min-height: 76px;
    }

    body.qqpw-next.template-login .qq-main-body {
        padding: 34px 0 52px;
        background-position: 34% center;
    }

    body.qqpw-next.template-login .login-form {
        padding: 0 14px;
    }

    body.qqpw-next.template-login .login-form .card {
        border-radius: 8px;
    }

body.qqpw-next.template-login .login-form .card-body {
        padding: 30px 26px 28px !important;
    }

    body.qqpw-next.template-login .login-form .card-footer {
        padding: 18px 26px 24px !important;
    }
}

/* QQ.PW v8.3: true EOF homepage hero override for tablet/mobile visibility. */
@media (min-width: 576px) and (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 820px !important;
        padding-bottom: 285px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.94) 34%, rgba(255, 255, 255, 0.42) 58%, rgba(255, 255, 255, 0.08) 100%),
            url("../img/qqpwhero_tablet.png") !important;
        background-size: auto, 100% auto !important;
        background-position: 0 0, center bottom !important;
        background-repeat: no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        min-height: 0 !important;
        padding-top: 96px !important;
        padding-bottom: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy {
        max-width: 660px !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        max-width: 650px !important;
        font-size: clamp(42px, 5.8vw, 58px) !important;
        line-height: 1.08 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        max-width: 620px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 870px !important;
        padding-bottom: 315px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.95) 37%, rgba(255, 255, 255, 0.48) 61%, rgba(255, 255, 255, 0.10) 100%),
            url("../img/qqpwhero_mobile.png") !important;
        background-size: auto, 100% auto !important;
        background-position: 0 0, center bottom !important;
        background-repeat: no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        min-height: 0 !important;
        padding-top: 54px !important;
        padding-bottom: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        font-size: clamp(40px, 11.4vw, 50px) !important;
        line-height: 1.09 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        max-width: 100% !important;
        line-height: 1.46 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-actions {
        margin-top: 22px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product footer {
        width: calc(100% - 36px) !important;
        gap: 8px !important;
        margin: 0 18px 16px !important;
        box-sizing: border-box !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product div.product-pricing {
        width: 100% !important;
        min-height: 76px !important;
        padding: 10px 12px !important;
        border-radius: 10px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product div.product-pricing .price {
        font-size: 23px !important;
        line-height: 1.04 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .btn-order-now {
        width: 100% !important;
        min-height: 40px !important;
        padding: 8px 12px !important;
    }
}

/* QQ.PW v9.6: Dedicated IP shows one flat SSH access strip only. */
body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-card {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) auto !important;
    gap: 14px !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 1px solid rgba(0, 169, 184, 0.18) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.90), rgba(246, 253, 250, 0.70) 60%, rgba(255, 250, 237, 0.62)) !important;
    box-shadow: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-icon {
    width: 46px !important;
    height: 46px !important;
    border-radius: 13px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-copy strong {
    display: inline-block !important;
    margin-top: 4px !important;
    padding: 0 !important;
    color: #062f4d !important;
    font-size: clamp(21px, 2.2vw, 29px) !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
    white-space: normal !important;
    word-break: break-word !important;
    border: 0 !important;
    background: transparent !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-copy span {
    color: #5b7480 !important;
    font-size: 11px !important;
    letter-spacing: 0.03em !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-copy small {
    margin-top: 5px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-button {
    min-width: 108px !important;
    min-height: 38px !important;
    padding: 8px 12px !important;
    white-space: nowrap !important;
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-card {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        padding: 12px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-icon {
        width: 40px !important;
        height: 40px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) .qq-dedicated-ssh-button {
        grid-column: 1 / -1 !important;
        width: 100% !important;
    }
}

/* QQ.PW v9.4 final: concise console header and Debian-only Dedicated IP access. */
body.qqpw-next.template-clientareahome .qq-console-welcome p,
body.qqpw-next.template-clientareahome .qq-console-badges {
    display: none !important;
}

body.qqpw-next.template-clientareahome .qq-console-welcome h2 {
    margin-bottom: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card {
    padding: clamp(14px, 2vw, 18px) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-direct-grid,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-port-strip {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: clamp(16px, 2.2vw, 22px);
    border: 1px solid rgba(0, 169, 184, 0.18);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(240, 253, 250, 0.78)),
        radial-gradient(circle at 96% 12%, rgba(242, 207, 134, 0.18), transparent 13rem);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.82),
        0 16px 36px rgba(7, 96, 115, 0.065);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-icon {
    display: inline-grid;
    place-items: center;
    width: 52px;
    height: 52px;
    color: #087f8f;
    border: 1px solid rgba(0, 169, 184, 0.22);
    border-radius: 16px;
    background:
        radial-gradient(circle at 30% 22%, rgba(255, 255, 255, 0.96), transparent 35%),
        linear-gradient(135deg, rgba(10, 167, 154, 0.16), rgba(242, 207, 134, 0.28));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 12px 24px rgba(7, 96, 115, 0.08);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy {
    min-width: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy span,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy small {
    display: block;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy span {
    color: #55717c;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.02em;
    line-height: 1.1;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy strong {
    display: inline-block;
    max-width: 100%;
    margin-top: 7px;
    padding: 8px 10px;
    color: #062f4d;
    font-size: clamp(18px, 2.5vw, 24px);
    font-weight: 880;
    line-height: 1.12;
    white-space: normal;
    word-break: break-word;
    border: 1px solid rgba(0, 169, 184, 0.14);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.72);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy small {
    margin-top: 8px;
    color: #4f6975;
    font-size: 12px;
    font-weight: 700;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy code {
    padding: 2px 6px;
    color: #07314f;
    border: 1px solid rgba(0, 169, 184, 0.13);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-button {
    min-width: 112px;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-card {
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 12px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-icon {
        width: 44px;
        height: 44px;
        border-radius: 14px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-button {
        grid-column: 1 / -1;
        width: 100%;
    }
}

/* QQ.PW v9.3: remove explanatory copy and make Dedicated IP access Debian-first. */
body.qqpw-next.template-clientareahome .qq-console-hero {
    align-items: center !important;
}

body.qqpw-next.template-clientareahome .qq-console-welcome {
    align-content: center !important;
}

body.qqpw-next.template-clientareahome .qq-console-welcome h2 {
    margin-bottom: 0 !important;
}

body.qqpw-next.template-clientareahome .qq-console-welcome p,
body.qqpw-next.template-clientareahome .qq-console-badges {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card {
    padding: clamp(14px, 2vw, 18px) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: clamp(16px, 2.2vw, 22px);
    border: 1px solid rgba(0, 169, 184, 0.18);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(240, 253, 250, 0.78)),
        radial-gradient(circle at 96% 12%, rgba(242, 207, 134, 0.18), transparent 13rem);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.82),
        0 16px 36px rgba(7, 96, 115, 0.065);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-icon {
    display: inline-grid;
    place-items: center;
    width: 52px;
    height: 52px;
    color: #087f8f;
    border: 1px solid rgba(0, 169, 184, 0.22);
    border-radius: 16px;
    background:
        radial-gradient(circle at 30% 22%, rgba(255, 255, 255, 0.96), transparent 35%),
        linear-gradient(135deg, rgba(10, 167, 154, 0.16), rgba(242, 207, 134, 0.28));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 12px 24px rgba(7, 96, 115, 0.08);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy {
    min-width: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy span,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy small {
    display: block;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy span {
    color: #55717c;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.02em;
    line-height: 1.1;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy strong {
    display: inline-block;
    max-width: 100%;
    margin-top: 7px;
    padding: 8px 10px;
    color: #062f4d;
    font-size: clamp(18px, 2.5vw, 24px);
    font-weight: 880;
    line-height: 1.12;
    white-space: normal;
    word-break: break-word;
    border: 1px solid rgba(0, 169, 184, 0.14);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.72);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy small {
    margin-top: 8px;
    color: #4f6975;
    font-size: 12px;
    font-weight: 700;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-copy code {
    padding: 2px 6px;
    color: #07314f;
    border: 1px solid rgba(0, 169, 184, 0.13);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-button {
    min-width: 112px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-direct-grid,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-port-strip {
    display: none !important;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-card {
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 12px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-icon {
        width: 44px;
        height: 44px;
        border-radius: 14px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-ssh-button {
        grid-column: 1 / -1;
        width: 100%;
    }
}

/* QQ.PW v8.8: keep the canoe team visible in phone desktop mode and tighten product cards. */
@media (min-width: 576px) and (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 1020px !important;
        padding-bottom: 420px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.96) 33%, rgba(255, 255, 255, 0.54) 53%, rgba(255, 255, 255, 0.12) 100%),
            url("../img/qqpwhero_tablet.png") !important;
        background-size: auto, 100% auto !important;
        background-position: 0 0, center calc(100% + 116px) !important;
        background-repeat: no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        padding-top: 88px !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        max-width: 660px !important;
        font-size: clamp(42px, 5.55vw, 56px) !important;
        line-height: 1.07 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        max-width: 615px !important;
    }
}

body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc p {
    margin: 0 !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc ul:empty {
    display: none !important;
}

@media (min-width: 576px) and (max-width: 1199px) {
    body.qqpw-next.is-shopping-cart #order-standard_cart .products {
        margin-top: 12px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products > .row {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product {
        min-height: 0 !important;
        grid-template-columns: minmax(380px, 1fr) minmax(190px, 0.46fr) !important;
        grid-template-rows: auto auto !important;
        column-gap: 16px !important;
        align-items: start !important;
        overflow: hidden !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product header {
        min-height: 52px !important;
        padding: 17px 20px 6px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product header .qty {
        top: 18px !important;
        right: 20px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc {
        padding: 7px 20px 18px !important;
        font-size: 11px !important;
        line-height: 1.35 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc p,
    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc strong {
        line-height: 1.35 !important;
        white-space: nowrap !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product footer {
        align-self: start !important;
        justify-content: start !important;
        gap: 10px !important;
        height: auto !important;
        margin: 0 20px 18px 0 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product div.product-pricing {
        width: 100% !important;
        min-height: 88px !important;
        padding: 13px 14px !important;
        justify-content: center !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product div.product-pricing .price {
        font-size: clamp(23px, 3vw, 26px) !important;
        line-height: 1.05 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .btn-order-now {
        width: 100% !important;
        min-height: 40px !important;
        padding: 8px 14px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.is-shopping-cart #order-standard_cart .products {
        margin-top: 10px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products > .row {
        gap: 12px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product {
        min-height: 0 !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto auto !important;
        border-radius: 14px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product header {
        min-height: 48px !important;
        padding: 15px 18px 7px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product header .qty {
        top: 15px !important;
        right: 18px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc {
        width: 100% !important;
        padding: 6px 18px 12px !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        font-size: 10.8px !important;
        line-height: 1.33 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc p,
    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc strong {
        line-height: 1.33 !important;
        white-space: nowrap !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product footer {
        width: auto !important;
        gap: 10px !important;
        height: auto !important;
        margin: 0 18px 18px !important;
        justify-content: start !important;
        align-self: stretch !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product div.product-pricing {
        width: 100% !important;
        min-height: 82px !important;
        padding: 12px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product div.product-pricing .price {
        font-size: 24px !important;
        line-height: 1.06 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .btn-order-now {
        width: 100% !important;
        min-height: 42px !important;
        padding: 9px 14px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product header {
        order: 1;
        grid-row: 1 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc {
        order: 2;
        grid-row: 2 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product footer {
        order: 3;
        grid-row: 3 !important;
    }
}

/* QQ.PW v8.2: mobile/tablet hero visibility and order-card spec line integrity. */
@media (min-width: 576px) and (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 820px !important;
        padding-bottom: 285px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.94) 34%, rgba(255, 255, 255, 0.42) 58%, rgba(255, 255, 255, 0.08) 100%),
            url("../img/qqpwhero_tablet.png") !important;
        background-size: auto, 100% auto !important;
        background-position: 0 0, center bottom !important;
        background-repeat: no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        min-height: 0 !important;
        padding-top: 96px !important;
        padding-bottom: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy {
        max-width: 660px !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        max-width: 650px !important;
        font-size: clamp(42px, 5.8vw, 58px) !important;
        line-height: 1.08 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        max-width: 620px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 870px !important;
        padding-bottom: 315px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.95) 37%, rgba(255, 255, 255, 0.48) 61%, rgba(255, 255, 255, 0.10) 100%),
            url("../img/qqpwhero_mobile.png") !important;
        background-size: auto, 118% auto !important;
        background-position: 0 0, center bottom !important;
        background-repeat: no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        min-height: 0 !important;
        padding-top: 54px !important;
        padding-bottom: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        font-size: clamp(40px, 11.4vw, 50px) !important;
        line-height: 1.09 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        max-width: 100% !important;
        line-height: 1.46 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-actions {
        margin-top: 22px !important;
    }
}

@media (max-width: 1199px) {
    body.qqpw-next.is-shopping-cart #order-standard_cart .products > .row {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product {
        grid-template-columns: minmax(260px, 1fr) minmax(220px, 0.72fr) !important;
        min-height: 236px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc {
        min-width: 0;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc p,
    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc strong {
        white-space: nowrap !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product {
        grid-template-columns: 1fr !important;
        min-height: 0 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-desc {
        width: 100% !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product footer {
        width: 100% !important;
    }
}

/* QQ.PW v7.7: keep contextual pages focused by removing duplicate body shortcuts. */
body.qqpw-next.qq-contextual-page .qq-context-nav .qq-context-link.active {
    display: none !important;
}

body.qqpw-next.template-clientareaproducts .qq-context-nav a[menuItemName="Place a New Order"] {
    display: none !important;
}

body.qqpw-next.template-clientareainvoices .qq-context-nav a[menuItemName="Add Funds"] {
    display: none !important;
}

body.qqpw-next.template-knowledgebase .qq-context-nav article[menuItemName="Support Knowledgebase Categories"] {
    display: none !important;
}

body.qqpw-next .qq-context-nav article[menuItemName="My Services Status Filter"],
body.qqpw-next .qq-context-nav article[menuItemName="My Domains Status Filter"],
body.qqpw-next .qq-context-nav article[menuItemName="My Invoices Status Filter"],
body.qqpw-next .qq-context-nav article[menuItemName="My Quotes Status Filter"],
body.qqpw-next .qq-context-nav article[menuItemName="Ticket List Status Filter"] {
    display: none !important;
}

/* QQ.PW v7.8: premium Dedicated IP connection card. */
body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) > .col-sm-5 {
    display: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-connection-row:not(.qq-service-connection-row-nat) > .col-sm-7 {
    flex: 0 0 100%;
    max-width: 100%;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-connect-card {
    width: 100%;
    padding: 18px;
    color: #062f4d;
    text-align: left;
    border: 1px solid rgba(0, 169, 184, 0.20);
    border-radius: 18px;
    background:
        radial-gradient(circle at 94% 8%, rgba(242, 207, 134, 0.18), transparent 18rem),
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(239, 253, 250, 0.88) 58%, rgba(255, 250, 237, 0.78));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.92),
        0 22px 54px rgba(2, 69, 91, 0.10);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 16px;
    border: 1px solid rgba(6, 118, 138, 0.16);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(242, 250, 248, 0.80)),
        radial-gradient(circle at 90% 20%, rgba(242, 207, 134, 0.18), transparent 12rem);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint-icon,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access header > span {
    display: inline-grid;
    place-items: center;
    width: 52px;
    height: 52px;
    color: #087f8f;
    border: 1px solid rgba(0, 169, 184, 0.22);
    border-radius: 16px;
    background:
        radial-gradient(circle at 30% 22%, rgba(255, 255, 255, 0.96), transparent 35%),
        linear-gradient(135deg, rgba(10, 167, 154, 0.18), rgba(242, 207, 134, 0.30));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 12px 24px rgba(7, 96, 115, 0.08);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint-copy span,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-command span,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-field span,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-port-strip strong {
    display: block;
    color: #5d7380;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.15;
    text-transform: uppercase;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint-copy strong {
    display: block;
    margin-top: 3px;
    color: #062f4d;
    font-size: clamp(22px, 3vw, 32px);
    font-weight: 850;
    line-height: 1;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint-copy small,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access header small {
    display: block;
    margin-top: 6px;
    color: #496774;
    font-weight: 650;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint-copy,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint-copy small,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access header,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-note,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-note span {
    min-width: 0;
    text-align: left;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-copy,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-connect-card .qq-copy-inline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 12px;
    color: #065d66;
    font-size: 12px;
    font-weight: 850;
    border: 1px solid rgba(0, 169, 184, 0.24);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 10px 20px rgba(2, 69, 91, 0.06);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-connect-card .qq-copy-inline:hover {
    color: #043748;
    border-color: rgba(0, 169, 184, 0.42);
    background: #ffffff;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access {
    padding: 16px;
    border: 1px solid rgba(6, 118, 138, 0.16);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access header {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin-bottom: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access header > span {
    width: 46px;
    height: 46px;
    border-radius: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access header strong {
    display: block;
    color: #062f4d;
    font-size: 18px;
    font-weight: 850;
    line-height: 1.1;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-field,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-command {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding: 12px;
    border: 1px solid rgba(6, 118, 138, 0.13);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.72);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-field span,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-command span {
    grid-column: 1 / -1;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-field code,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-command code {
    display: block;
    min-width: 0;
    color: #07314f;
    font-size: 13px;
    font-weight: 800;
    white-space: normal;
    word-break: break-word;
    background: transparent;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-field .qq-copy-inline {
    width: 38px;
    min-width: 38px;
    min-height: 38px;
    padding: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-command {
    margin-top: 10px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.74), rgba(255, 248, 232, 0.64));
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-note {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin-top: 14px;
    padding: 12px 14px;
    color: #674a0b;
    border: 1px solid rgba(242, 207, 134, 0.48);
    border-radius: 13px;
    background: linear-gradient(135deg, rgba(255, 250, 237, 0.92), rgba(255, 255, 255, 0.66));
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-note i {
    margin-top: 2px;
    color: #c98a10;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-port-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-top: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-port-strip strong {
    margin-right: 2px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-port-strip span {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 6px 10px;
    color: #065d66;
    font-size: 12px;
    font-weight: 800;
    border: 1px solid rgba(0, 169, 184, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-connect-card {
        padding: 12px;
        border-radius: 15px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint {
        grid-template-columns: 44px minmax(0, 1fr);
        padding: 12px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint-icon {
        width: 44px;
        height: 44px;
        border-radius: 14px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-endpoint .qq-dedicated-copy {
        grid-column: 1 / -1;
        width: 100%;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-field-grid {
        grid-template-columns: 1fr;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-field,
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-command {
        grid-template-columns: minmax(0, 1fr);
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-field {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-command .qq-copy-inline {
        width: 100%;
    }
}

/* QQ.PW v7.9: Client Area homepage dedupe and single-workspace layout. */
body.qqpw-next.template-clientareahome .qq-console-workspace {
    grid-template-columns: minmax(0, 1fr) !important;
}

body.qqpw-next.template-clientareahome .qq-console-main {
    width: 100%;
}

body.qqpw-next.template-clientareahome .qq-client-section-head {
    margin-bottom: 12px;
}

body.qqpw-next.template-clientareahome .qq-console-panel[menuItemName="Active Products/Services"] .qq-console-panel-head {
    min-height: 66px;
}

body.qqpw-next.template-clientareahome .qq-console-panel[menuItemName="Active Products/Services"] .qq-console-panel-list {
    padding-bottom: 16px;
}

body.qqpw-next.template-clientareahome .qq-console-panel[menuItemName="Recent Support Tickets"] .qq-console-panel-body a[href*="submitticket.php"] {
    font-weight: 900;
}

body.qqpw-next.template-clientareahome .qq-console-panel-grid {
    align-items: start;
}

/* QQ.PW v8.0: simplify Dedicated IP access and clarify service password recovery. */
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card {
    padding: 20px !important;
    border-color: rgba(0, 169, 184, 0.18) !important;
    background:
        radial-gradient(circle at 96% 0%, rgba(242, 207, 134, 0.20), transparent 18rem),
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(241, 253, 250, 0.90) 56%, rgba(255, 250, 237, 0.82)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-endpoint {
    grid-template-columns: 54px minmax(0, 1fr) auto;
    align-items: center;
    padding: 18px;
    border-color: rgba(0, 169, 184, 0.20);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(247, 253, 250, 0.86)),
        radial-gradient(circle at 88% 12%, rgba(0, 169, 184, 0.08), transparent 13rem);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-endpoint-copy span {
    color: #55717c;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-endpoint-copy strong {
    letter-spacing: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-endpoint-copy small {
    max-width: 780px;
    line-height: 1.45;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    margin-top: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-main,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-panel {
    border: 1px solid rgba(6, 118, 138, 0.15);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-main {
    padding: 16px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-section-head {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(6, 118, 138, 0.10);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-section-head > span,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-row-icon,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-icon {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    color: #087f8f;
    border: 1px solid rgba(0, 169, 184, 0.20);
    border-radius: 14px;
    background:
        radial-gradient(circle at 30% 22%, rgba(255, 255, 255, 0.98), transparent 35%),
        linear-gradient(135deg, rgba(10, 167, 154, 0.16), rgba(242, 207, 134, 0.27));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86), 0 10px 24px rgba(7, 96, 115, 0.08);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-section-head strong {
    display: block;
    color: #062f4d;
    font-size: 17px;
    font-weight: 850;
    line-height: 1.18;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-section-head small {
    display: block;
    margin-top: 4px;
    color: #55717c;
    font-weight: 650;
    line-height: 1.35;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access-list {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access-row {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border: 1px solid rgba(6, 118, 138, 0.11);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(246, 253, 250, 0.68));
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-row-copy {
    min-width: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-row-copy strong {
    display: block;
    color: #062f4d;
    font-size: 15px;
    font-weight: 850;
    line-height: 1.16;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-row-copy small {
    display: block;
    margin-top: 3px;
    color: #57717b;
    font-weight: 650;
    line-height: 1.35;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-row-copy code {
    display: inline-block;
    max-width: 100%;
    margin-top: 9px;
    padding: 6px 9px;
    color: #07314f;
    font-size: 13px;
    font-weight: 850;
    white-space: normal;
    word-break: break-word;
    border: 1px solid rgba(0, 169, 184, 0.14);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.72);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-row-copy small code {
    margin: 0;
    padding: 1px 5px;
    font-size: 12px;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-panel {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
    align-content: start;
    padding: 16px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(255, 250, 237, 0.64)),
        radial-gradient(circle at 92% 8%, rgba(242, 207, 134, 0.22), transparent 10rem);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-panel strong {
    display: block;
    color: #062f4d;
    font-size: 16px;
    font-weight: 850;
    line-height: 1.16;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-panel p {
    margin: 7px 0 12px;
    color: #4f6975;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.42;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-action,
body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-fallback {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 12px;
    color: #065d66;
    font-size: 12px;
    font-weight: 900;
    border: 1px solid rgba(0, 169, 184, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.80);
    text-decoration: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-action:hover {
    color: #043748;
    border-color: rgba(0, 169, 184, 0.40);
    background: #ffffff;
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-port-strip {
    padding-top: 14px;
    border-top: 1px solid rgba(6, 118, 138, 0.10);
}

body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-port-strip span:first-of-type {
    color: #07314f;
    border-color: rgba(242, 207, 134, 0.42);
    background: linear-gradient(135deg, rgba(255, 250, 237, 0.96), rgba(255, 255, 255, 0.72));
}

body.qqpw-next.template-clientareaproductdetails .qq-service-server-tools-panel .qq-module-client-area-inline .qq-module-tool-change-password {
    grid-template-columns: 44px minmax(0, 1fr) !important;
    min-height: 78px !important;
    height: 78px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-server-tools-panel .qq-module-client-area-inline .qq-module-tool-change-password .qq-service-tool-copy strong {
    font-size: 12px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-server-tools-panel .qq-module-client-area-inline .qq-module-tool-change-password .qq-service-tool-copy small {
    font-size: 9.5px !important;
    max-width: 150px;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card {
        padding: 12px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-endpoint,
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access-row,
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-panel {
        grid-template-columns: 40px minmax(0, 1fr);
        padding: 12px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-section-head {
        grid-template-columns: 40px minmax(0, 1fr);
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-section-head > span,
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-row-icon,
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-icon {
        width: 40px;
        height: 40px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-access-row .qq-copy-inline,
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-direct-card .qq-dedicated-endpoint .qq-dedicated-copy {
        grid-column: 1 / -1;
        width: 100%;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-action,
    body.qqpw-next.template-clientareaproductdetails .qq-dedicated-password-fallback {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}

/* v7.6 contextual client pages: replace WHMCS sidebars with a flat command strip. */
body.qqpw-next.qq-contextual-page .qq-breadcrumb {
    display: none !important;
}

body.qqpw-next:not(.template-homepage):not(.template-login):not(.is-shopping-cart) .qq-breadcrumb {
    display: none !important;
}

body.qqpw-next.qq-contextual-page .qq-page-heading {
    padding: clamp(34px, 5vw, 58px) 0;
}

body.qqpw-next.qq-contextual-page .qq-page-heading h1 {
    font-size: clamp(34px, 5vw, 56px);
}

body.qqpw-next.qq-contextual-page .qq-main-body {
    padding-top: clamp(18px, 3vw, 28px);
}

body.qqpw-next.qq-contextual-page .qq-main-container,
body.qqpw-next.qq-contextual-page .qq-content {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
}

.qq-context-nav-col {
    margin-bottom: 18px;
}

.qq-context-nav {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(255px, 1fr));
    gap: 12px;
    align-items: stretch;
    padding: 14px;
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(239, 252, 249, 0.70)),
        radial-gradient(circle at 94% 0%, rgba(255, 215, 140, 0.18), transparent 22rem);
    border: 1px solid rgba(8, 127, 176, 0.13);
    border-radius: 18px;
    box-shadow: 0 18px 44px rgba(7, 96, 115, 0.08);
}

.qq-context-card {
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(247, 255, 253, 0.58));
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 14px;
}

.qq-context-card-head {
    min-height: 52px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 9px;
    align-items: center;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(8, 127, 176, 0.08);
}

.qq-context-card-head > span {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #08766f;
    background: linear-gradient(135deg, rgba(10, 167, 154, 0.14), rgba(255, 215, 140, 0.22));
    border-radius: 9px;
}

.qq-context-card-head strong {
    min-width: 0;
    color: #07314f;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-transform: uppercase;
}

.qq-context-card-head em,
.qq-context-link em {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 22px;
    padding: 3px 8px;
    color: #07314f;
    background: rgba(255, 215, 140, 0.58);
    border-radius: 999px;
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
}

.qq-context-card-body {
    padding: 13px 14px;
    color: #38535f;
    line-height: 1.5;
}

.qq-context-card-body p:last-child {
    margin-bottom: 0;
}

.qq-context-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
}

.qq-context-card-body + .qq-context-links {
    padding-top: 0;
}

.qq-context-link {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.66);
    border: 1px solid rgba(8, 127, 176, 0.10);
    border-radius: 999px;
    padding: 8px 11px;
    text-decoration: none !important;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.qq-context-link span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.2;
}

.qq-context-link i {
    color: #08766f;
}

.qq-context-link:hover,
.qq-context-link:focus,
.qq-context-link.active {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.95);
    border-color: rgba(10, 167, 154, 0.34);
    transform: translateY(-1px);
}

.qq-context-link.active {
    box-shadow: inset 3px 0 0 #f4c76b;
}

.qq-context-link.disabled {
    pointer-events: none;
    opacity: 0.52;
}

.qq-context-card-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: auto;
    padding: 0 14px 14px;
}

.qq-context-card-footer .btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.qq-context-sidebar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    margin: 0 !important;
}

.qq-context-nav .card-sidebar,
.qq-context-nav .card,
.qq-context-nav .panel {
    overflow: hidden;
    margin: 0 !important;
    color: #07314f;
    background: rgba(255, 255, 255, 0.72) !important;
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}

.qq-context-nav .card-header,
.qq-context-nav .panel-heading {
    min-height: 42px;
    display: flex;
    align-items: center;
    padding: 12px 14px !important;
    background: transparent !important;
    border: 0 !important;
}

.qq-context-nav .card-title,
.qq-context-nav .panel-title,
.qq-context-nav .card-header h3,
.qq-context-nav .panel-heading h3 {
    width: 100%;
    margin: 0 !important;
    color: #07314f !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: 0.05em;
    line-height: 1.2;
    text-transform: uppercase;
}

.qq-context-nav .card-title i,
.qq-context-nav .panel-title i {
    color: #08766f;
}

.qq-context-nav .card-minimise,
.qq-context-nav .fa-chevron-up,
.qq-context-nav .fa-chevron-down {
    display: none !important;
}

.qq-context-nav .collapsable-card-body {
    display: block !important;
}

.qq-context-nav .card-body,
.qq-context-nav .panel-body {
    padding: 0 14px 12px !important;
    color: #38535f;
    line-height: 1.5;
}

.qq-context-nav .list-group {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 12px 12px !important;
    background: transparent !important;
    border: 0 !important;
}

.qq-context-nav .list-group-item,
.qq-context-nav a.list-group-item {
    width: auto;
    min-height: 40px;
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.62) !important;
    border: 1px solid rgba(8, 127, 176, 0.11) !important;
    border-radius: 999px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.qq-context-nav a.list-group-item:hover,
.qq-context-nav a.list-group-item:focus,
.qq-context-nav .list-group-item.active,
.qq-context-nav .list-group-item.active:hover,
.qq-context-nav .list-group-item.active:focus {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.94) !important;
    border-color: rgba(10, 167, 154, 0.35) !important;
    transform: translateY(-1px);
}

.qq-context-nav .list-group-item.active {
    box-shadow: inset 3px 0 0 #f4c76b !important;
}

.qq-context-nav .sidebar-menu-item-wrapper {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto;
}

.qq-context-nav .sidebar-menu-item-icon-wrapper {
    width: auto;
    min-width: 0;
    color: #08766f;
}

.qq-context-nav .sidebar-menu-item-label {
    white-space: nowrap;
    font-weight: 900;
}

.qq-context-nav .sidebar-menu-item-badge,
.qq-context-nav .badge {
    color: #07314f !important;
    background: rgba(255, 215, 140, 0.46) !important;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
}

.qq-context-nav .card-footer,
.qq-context-nav .panel-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 14px 14px !important;
    background: transparent !important;
    border: 0 !important;
}

.qq-context-nav .btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px !important;
    font-weight: 900;
}

body.qqpw-next.qq-contextual-page .qq-content > .card,
body.qqpw-next.qq-contextual-page .qq-content > .panel,
body.qqpw-next.qq-contextual-page .qq-content .card:not(.card-sidebar),
body.qqpw-next.qq-contextual-page .qq-content .panel:not(.panel-sidebar),
body.qqpw-next.qq-contextual-page .qq-content .table-container,
body.qqpw-next.qq-contextual-page .qq-content .invoice-container,
body.qqpw-next.qq-contextual-page .qq-content .domain-checker-container {
    overflow: hidden;
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(247, 255, 253, 0.72)) !important;
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 16px !important;
    box-shadow: 0 18px 44px rgba(7, 96, 115, 0.07) !important;
}

body.qqpw-next.qq-contextual-page .qq-content .card-header,
body.qqpw-next.qq-contextual-page .qq-content .panel-heading {
    min-height: 58px;
    padding: 18px 22px !important;
    color: #07314f !important;
    background:
        linear-gradient(90deg, rgba(239, 252, 249, 0.82), rgba(255, 250, 240, 0.54)) !important;
    border-bottom: 1px solid rgba(8, 127, 176, 0.10) !important;
}

body.qqpw-next.qq-contextual-page .qq-content .card-title,
body.qqpw-next.qq-contextual-page .qq-content .panel-title,
body.qqpw-next.qq-contextual-page .qq-content .card-header h3,
body.qqpw-next.qq-contextual-page .qq-content .panel-heading h3 {
    color: #07314f !important;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 0;
}

body.qqpw-next.qq-contextual-page .qq-content .card-body,
body.qqpw-next.qq-contextual-page .qq-content .panel-body {
    padding: 22px !important;
}

body.qqpw-next.qq-contextual-page .dataTables_wrapper {
    padding: 0 !important;
    color: #07314f;
}

body.qqpw-next.qq-contextual-page .dataTables_wrapper .dataTables_length,
body.qqpw-next.qq-contextual-page .dataTables_wrapper .dataTables_filter {
    margin: 0 0 14px;
}

body.qqpw-next.qq-contextual-page .dataTables_wrapper .dataTables_filter input,
body.qqpw-next.qq-contextual-page .dataTables_wrapper .dataTables_length select,
body.qqpw-next.qq-contextual-page .form-control,
body.qqpw-next.qq-contextual-page input[type="text"],
body.qqpw-next.qq-contextual-page input[type="email"],
body.qqpw-next.qq-contextual-page input[type="password"],
body.qqpw-next.qq-contextual-page select,
body.qqpw-next.qq-contextual-page textarea {
    min-height: 44px;
    color: #07314f;
    background: rgba(255, 255, 255, 0.82) !important;
    border: 1px solid rgba(8, 127, 176, 0.16) !important;
    border-radius: 11px !important;
    box-shadow: none !important;
}

body.qqpw-next.qq-contextual-page table.table,
body.qqpw-next.qq-contextual-page table.table-list {
    overflow: hidden;
    width: 100% !important;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid rgba(8, 127, 176, 0.10);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.68);
}

body.qqpw-next.qq-contextual-page table.table thead th,
body.qqpw-next.qq-contextual-page table.table-list thead th {
    color: #07314f !important;
    background:
        linear-gradient(90deg, rgba(239, 252, 249, 0.92), rgba(255, 250, 240, 0.74)) !important;
    border-bottom: 1px solid rgba(8, 127, 176, 0.13) !important;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

body.qqpw-next.qq-contextual-page table.table td,
body.qqpw-next.qq-contextual-page table.table-list td {
    border-top: 1px solid rgba(8, 127, 176, 0.09) !important;
    vertical-align: middle;
}

body.qqpw-next.qq-contextual-page .btn,
body.qqpw-next.qq-contextual-page .btn-default,
body.qqpw-next.qq-contextual-page .btn-primary {
    border-radius: 999px !important;
    font-weight: 900;
    box-shadow: none !important;
}

body.qqpw-next.qq-contextual-page .btn-primary,
body.qqpw-next.qq-contextual-page .btn-success {
    color: #ffffff !important;
    background: linear-gradient(135deg, #10b8aa, #0789b6) !important;
    border-color: transparent !important;
}

body.qqpw-next.qq-contextual-page .btn-default,
body.qqpw-next.qq-contextual-page .btn-outline-primary {
    color: #08766f !important;
    background: rgba(255, 255, 255, 0.72) !important;
    border: 1px solid rgba(10, 167, 154, 0.20) !important;
}

body.qqpw-next.qq-contextual-page .label,
body.qqpw-next.qq-contextual-page .badge,
body.qqpw-next.qq-contextual-page .status {
    border-radius: 999px !important;
    font-weight: 900;
}

body.qqpw-next.qq-contextual-page .alert {
    border-radius: 14px;
    border-color: rgba(8, 127, 176, 0.14);
}

@media (max-width: 991px) {
    .qq-context-nav {
        padding: 12px;
        border-radius: 15px;
    }

    .qq-context-sidebar {
        grid-template-columns: 1fr;
    }

    body.qqpw-next.qq-contextual-page .qq-main-container,
    body.qqpw-next.qq-contextual-page .qq-content {
        max-width: 100%;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.qq-contextual-page .qq-page-heading {
        padding: 28px 0 34px;
    }

    .qq-context-nav {
        gap: 10px;
        padding: 10px;
    }

    .qq-context-nav .list-group {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 14px !important;
        -webkit-overflow-scrolling: touch;
    }

    .qq-context-nav .list-group-item,
    .qq-context-nav a.list-group-item {
        flex: 0 0 auto;
    }

    body.qqpw-next.qq-contextual-page .qq-content .card-body,
    body.qqpw-next.qq-contextual-page .qq-content .panel-body {
        padding: 18px !important;
    }
}

/* v7.6 order form: flatten categories/actions and keep purchase flow full width. */
body.qqpw-next.is-shopping-cart #order-standard_cart > .row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
    margin-left: 0;
    margin-right: 0;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar,
body.qqpw-next.is-shopping-cart #order-standard_cart .cart-body {
    float: none !important;
    width: 100% !important;
    max-width: none !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 12px;
    min-height: 0 !important;
    height: auto !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .panel-sidebar,
body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .card-sidebar {
    overflow: hidden;
    margin: 0 !important;
    color: #07314f;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.84), rgba(247, 255, 253, 0.62)) !important;
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 14px !important;
    box-shadow: 0 14px 34px rgba(7, 96, 115, 0.06) !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .panel-heading,
body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .card-header {
    min-height: 52px;
    display: flex;
    align-items: center;
    padding: 12px 14px !important;
    background: transparent !important;
    border-bottom: 1px solid rgba(8, 127, 176, 0.08) !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .panel-title,
body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .card-title,
body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .panel-heading h3,
body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .card-header h3 {
    margin: 0 !important;
    color: #07314f !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .list-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px !important;
    background: transparent !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .list-group-item,
body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar a.list-group-item {
    width: auto;
    min-height: 38px;
    display: inline-flex !important;
    align-items: center;
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.66) !important;
    border: 1px solid rgba(8, 127, 176, 0.10) !important;
    border-radius: 999px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    font-weight: 900;
    text-decoration: none !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .list-group-item.active,
body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar a.list-group-item:hover,
body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar a.list-group-item:focus {
    background: rgba(255, 255, 255, 0.96) !important;
    border-color: rgba(10, 167, 154, 0.32) !important;
    box-shadow: inset 3px 0 0 #f4c76b !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-body {
    color: #07314f;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .products {
    display: grid;
    width: 100% !important;
    margin: 18px 0 0 !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .products > .row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 0 !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .products > .row > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding: 0 !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .products .product {
    width: 100% !important;
    min-height: 280px;
    float: none !important;
    margin: 0 !important;
    border-radius: 16px !important;
    box-shadow: 0 18px 44px rgba(7, 96, 115, 0.07) !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .products .product header,
body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .product-title {
    color: #07314f;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .btn,
body.qqpw-next.is-shopping-cart #order-standard_cart .btn-default,
body.qqpw-next.is-shopping-cart #order-standard_cart .btn-primary {
    border-radius: 999px !important;
    font-weight: 900;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .btn-primary,
body.qqpw-next.is-shopping-cart #order-standard_cart .btn-success {
    color: #ffffff !important;
    background: linear-gradient(135deg, #10b8aa, #0789b6) !important;
    border-color: transparent !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .btn-default {
    color: #08766f !important;
    background: rgba(255, 255, 255, 0.72) !important;
    border: 1px solid rgba(10, 167, 154, 0.20) !important;
}

body.qqpw-next.is-shopping-cart #order-standard_cart .cart-body > .sidebar-collapsed {
    display: none !important;
}

@media (max-width: 767px) {
    body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar,
    body.qqpw-next.is-shopping-cart #order-standard_cart .products,
    body.qqpw-next.is-shopping-cart #order-standard_cart .products > .row {
        grid-template-columns: 1fr;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .list-group {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar .list-group-item,
    body.qqpw-next.is-shopping-cart #order-standard_cart .cart-sidebar a.list-group-item {
        flex: 0 0 auto;
    }
}

/* v7.1 late footer compact override. */
body.qqpw-next .qq-footer {
    padding-top: clamp(28px, 5vw, 42px);
    padding-bottom: 22px;
}

body.qqpw-next .qq-footer-shell {
    display: grid !important;
    grid-template-columns: minmax(240px, 1.4fr) minmax(120px, 0.65fr) minmax(130px, 0.65fr) minmax(130px, 0.7fr) !important;
    gap: clamp(18px, 3vw, 34px) !important;
    align-items: start;
}

body.qqpw-next .qq-footer-nav,
body.qqpw-next .qq-footer-action-block {
    min-width: 0;
    gap: 8px;
}

@media (max-width: 991px) {
    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 18px 14px !important;
    }

    body.qqpw-next .qq-footer-brand-block {
        grid-column: 1 / -1;
    }

    body.qqpw-next .qq-footer-bottom {
        margin-top: 22px;
    }
}

@media (max-width: 575px) {
    body.qqpw-next .qq-footer {
        padding: 28px 0 18px;
        background-position: 68% 72% !important;
    }

    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 16px 10px !important;
    }

    body.qqpw-next .qq-footer-brand-block {
        grid-column: 1 / -1;
    }

    body.qqpw-next .qq-footer-brand .qq-brand-mark {
        width: 38px;
        height: 38px;
    }

    body.qqpw-next .qq-footer-brand-block p {
        font-size: 14px;
        line-height: 1.58;
        margin: 10px 0 12px;
    }

    body.qqpw-next .qq-footer-badges {
        gap: 6px;
    }

    body.qqpw-next .qq-footer-badges span {
        padding: 5px 8px;
        font-size: 11px;
    }

    body.qqpw-next .qq-footer-nav strong,
    body.qqpw-next .qq-footer-action-block strong {
        font-size: 10px;
    }

    body.qqpw-next .qq-footer-nav a,
    body.qqpw-next .qq-footer-action-block a {
        font-size: 13px;
        line-height: 1.35;
    }

    body.qqpw-next .qq-footer-action-block .qq-footer-cta,
    body.qqpw-next .qq-footer-action-block .qq-locale-btn {
        padding: 7px 9px;
        font-size: 13px;
    }

    body.qqpw-next .qq-footer-bottom {
        margin-top: 20px;
        padding-top: 14px;
    }
}

@media (max-width: 374px) {
    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.qqpw-next .qq-footer-action-block {
        grid-column: 1 / -1;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 10px;
    }
}

/* v7.2 compact gallery footer. */
body.qqpw-next .qq-footer {
    padding: 22px 0 14px !important;
}

body.qqpw-next .qq-footer-shell {
    position: relative;
    grid-template-columns: minmax(250px, 1.18fr) minmax(116px, 0.52fr) minmax(122px, 0.52fr) minmax(118px, 0.50fr) !important;
    gap: 16px 20px !important;
    padding: 16px 18px !important;
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.76), rgba(237, 250, 248, 0.48)),
        radial-gradient(circle at 92% 18%, rgba(255, 215, 140, 0.22), transparent 28%);
    box-shadow: 0 18px 48px rgba(7, 49, 79, 0.08);
    backdrop-filter: blur(12px);
}

body.qqpw-next .qq-footer-brand {
    gap: 10px;
}

body.qqpw-next .qq-footer-brand .qq-brand-mark {
    width: 38px;
    height: 38px;
    box-shadow: 0 12px 24px rgba(8, 127, 176, 0.15);
}

body.qqpw-next .qq-footer-brand-block p {
    max-width: 360px;
    margin: 8px 0 10px !important;
    font-size: 14px;
    line-height: 1.45;
}

body.qqpw-next .qq-footer-badges {
    gap: 6px;
}

body.qqpw-next .qq-footer-badges span {
    padding: 4px 8px !important;
    font-size: 10px !important;
    letter-spacing: 0;
}

body.qqpw-next .qq-footer-nav,
body.qqpw-next .qq-footer-action-block {
    gap: 6px !important;
}

body.qqpw-next .qq-footer-nav strong,
body.qqpw-next .qq-footer-action-block strong {
    font-size: 10px !important;
    letter-spacing: 0.04em;
}

body.qqpw-next .qq-footer-nav a,
body.qqpw-next .qq-footer-action-block a {
    font-size: 13px;
    line-height: 1.25 !important;
}

body.qqpw-next .qq-footer-action-block .qq-footer-cta,
body.qqpw-next .qq-footer-action-block .qq-locale-btn {
    padding: 6px 10px !important;
    border-radius: 8px;
}

body.qqpw-next .qq-footer-bottom {
    margin-top: 10px !important;
    padding-top: 10px !important;
    border-top-color: rgba(8, 127, 176, 0.10) !important;
}

body.qqpw-next .qq-footer-copy {
    font-size: 12px;
}

@media (max-width: 991px) {
    body.qqpw-next .qq-footer {
        padding: 18px 0 12px !important;
    }

    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 12px 12px !important;
        padding: 14px !important;
    }

    body.qqpw-next .qq-footer-brand-block {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px 12px;
    }

    body.qqpw-next .qq-footer-brand-block p {
        max-width: none;
        margin: 0 !important;
        font-size: 13px;
        line-height: 1.35;
    }

    body.qqpw-next .qq-footer-badges {
        justify-content: flex-end;
        flex-wrap: nowrap;
    }
}

@media (max-width: 575px) {
    body.qqpw-next .qq-footer {
        padding: 14px 0 10px !important;
        background-position: 70% 72% !important;
    }

    body.qqpw-next .qq-footer-shell {
        gap: 10px 8px !important;
        padding: 12px !important;
        border-radius: 12px;
    }

    body.qqpw-next .qq-footer-brand-block {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 8px 10px;
    }

    body.qqpw-next .qq-footer-brand .qq-brand-mark {
        width: 34px;
        height: 34px;
    }

    body.qqpw-next .qq-footer-brand-block p {
        display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        font-size: 12px;
    }

    body.qqpw-next .qq-footer-badges {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    body.qqpw-next .qq-footer-badges span {
        padding: 3px 7px !important;
        font-size: 9px !important;
    }

    body.qqpw-next .qq-footer-nav strong,
    body.qqpw-next .qq-footer-action-block strong {
        font-size: 9px !important;
    }

    body.qqpw-next .qq-footer-nav a,
    body.qqpw-next .qq-footer-action-block a {
        font-size: 11.5px;
        line-height: 1.2 !important;
    }

    body.qqpw-next .qq-footer-action-block .qq-footer-cta,
    body.qqpw-next .qq-footer-action-block .qq-locale-btn {
        padding: 5px 7px !important;
        font-size: 11.5px;
    }

    body.qqpw-next .qq-footer-bottom {
        margin-top: 8px !important;
        padding-top: 8px !important;
        gap: 8px;
    }

    body.qqpw-next .qq-footer-copy {
        font-size: 11px;
    }
}

@media (max-width: 374px) {
    body.qqpw-next .qq-footer-shell {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    body.qqpw-next .qq-footer-action-block {
        grid-column: auto;
        display: grid;
        gap: 6px !important;
    }
}

/* v7.3 footer signature rail. */
body.qqpw-next .qq-footer-shell {
    grid-template-columns: minmax(320px, 0.95fr) minmax(360px, 1.05fr) !important;
    align-items: center;
    gap: 16px 24px !important;
    padding: 14px 16px !important;
}

body.qqpw-next .qq-footer-brand-block {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px 12px;
}

body.qqpw-next .qq-footer-brand-block p {
    margin: 0 !important;
    max-width: none;
}

body.qqpw-next .qq-footer-badges {
    grid-column: 1 / -1;
    margin-left: 50px;
}

body.qqpw-next .qq-footer-linkbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

body.qqpw-next .qq-footer-linkbar a,
body.qqpw-next .qq-footer-linkbar .qq-locale-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    color: #075f68;
    background: rgba(255, 255, 255, 0.66);
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 999px;
    padding: 6px 11px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(7, 96, 115, 0.04);
}

body.qqpw-next .qq-footer-linkbar a:hover,
body.qqpw-next .qq-footer-linkbar .qq-locale-btn:hover {
    color: #07314f;
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(10, 167, 154, 0.28);
    text-decoration: none;
}

body.qqpw-next .qq-footer-linkbar .qq-footer-cta {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0bb8a8, #087fb0) !important;
    border-color: transparent !important;
    box-shadow: 0 12px 24px rgba(8, 127, 176, 0.16);
}

@media (max-width: 991px) {
    body.qqpw-next .qq-footer-shell {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        padding: 13px 14px !important;
    }

    body.qqpw-next .qq-footer-brand-block {
        grid-column: auto;
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    body.qqpw-next .qq-footer-badges {
        grid-column: auto;
        margin-left: 0;
        justify-content: flex-end;
    }

    body.qqpw-next .qq-footer-linkbar {
        justify-content: flex-start;
        gap: 7px;
    }
}

@media (max-width: 575px) {
    body.qqpw-next .qq-footer-shell {
        gap: 10px !important;
        padding: 11px !important;
    }

    body.qqpw-next .qq-footer-brand-block {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 7px 10px;
    }

    body.qqpw-next .qq-footer-badges {
        display: none;
    }

    body.qqpw-next .qq-footer-linkbar {
        gap: 6px;
    }

    body.qqpw-next .qq-footer-linkbar a,
    body.qqpw-next .qq-footer-linkbar .qq-locale-btn {
        min-height: 28px;
        padding: 5px 8px;
        font-size: 11px;
    }

    body.qqpw-next .qq-footer-bottom {
        justify-content: center;
        text-align: center;
    }
}

/* v7.4 service productivity toolkit. */
body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit {
    width: min(100%, 980px);
    margin: 0 auto;
    padding: 4px 0;
    text-align: left;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
    padding: 18px 20px;
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 12px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(239, 252, 249, 0.84)),
        radial-gradient(circle at 96% 16%, rgba(255, 215, 140, 0.24), transparent 30%);
    box-shadow: 0 16px 34px rgba(7, 96, 115, 0.07);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-icon {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: #ffffff;
    background: linear-gradient(135deg, #0bb8a8, #087fb0);
    border-radius: 12px;
    box-shadow: 0 14px 26px rgba(8, 127, 176, 0.18);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-head h5 {
    color: #07314f;
    font-size: 21px;
    line-height: 1.2;
    font-weight: 800;
    margin: 0 0 4px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-head p {
    color: #4b6570;
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 82px;
    padding: 14px 16px;
    color: #07314f;
    border: 1px solid rgba(8, 127, 176, 0.13);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.84);
    box-shadow: 0 12px 28px rgba(7, 96, 115, 0.06);
    text-decoration: none;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool:hover,
body.qqpw-next.template-clientareaproductdetails .qq-service-tool:focus {
    color: #07314f;
    border-color: rgba(10, 167, 154, 0.32);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 18px 36px rgba(7, 96, 115, 0.10);
    transform: translateY(-1px);
    text-decoration: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool.disabled {
    opacity: 0.48;
    pointer-events: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool-icon {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #075f68;
    background: linear-gradient(135deg, rgba(11, 184, 168, 0.14), rgba(255, 215, 140, 0.26));
    border-radius: 11px;
    font-size: 17px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool-secure .qq-service-tool-icon {
    color: #075f68;
    background: linear-gradient(135deg, rgba(11, 184, 168, 0.18), rgba(8, 127, 176, 0.14));
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool-rebuild .qq-service-tool-icon {
    color: #8a5604;
    background: linear-gradient(135deg, rgba(255, 215, 140, 0.36), rgba(255, 255, 255, 0.72));
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool-caution .qq-service-tool-icon {
    color: #9b3d2d;
    background: linear-gradient(135deg, rgba(223, 91, 70, 0.14), rgba(255, 215, 140, 0.20));
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool-copy strong {
    display: block;
    color: #07314f;
    font-size: 15px;
    line-height: 1.25;
    margin-bottom: 4px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool-copy small {
    display: block;
    color: #5b7280;
    font-size: 12px;
    line-height: 1.35;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool-arrow {
    color: #087fb0;
    opacity: 0.70;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool-empty,
body.qqpw-next.template-clientareaproductdetails .qq-service-credential-note {
    color: #4b6570;
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 12px;
    background: rgba(239, 252, 249, 0.78);
}

body.qqpw-next.template-clientareaproductdetails .qq-service-tool-empty {
    grid-column: 1 / -1;
    padding: 18px;
    text-align: center;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-credential-note {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 14px;
    padding: 14px 16px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-credential-main {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-credential-main > i {
    color: #087fb0;
    font-size: 18px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-credential-main strong,
body.qqpw-next.template-clientareaproductdetails .qq-service-credential-field strong {
    display: block;
    color: #07314f;
    font-size: 13px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-credential-main span,
body.qqpw-next.template-clientareaproductdetails .qq-service-credential-field span {
    display: block;
    color: #5b7280;
    font-size: 12px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-credential-fields {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-credential-field {
    min-width: 180px;
    padding: 8px 10px;
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.72);
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-head,
    body.qqpw-next.template-clientareaproductdetails .qq-service-credential-note {
        align-items: flex-start;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-grid {
        grid-template-columns: 1fr;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-credential-note {
        display: grid;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-credential-fields {
        justify-content: flex-start;
    }
}

@media (max-width: 420px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-head {
        padding: 14px;
        gap: 10px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-icon {
        width: 40px;
        height: 40px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-head h5 {
        font-size: 18px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-tool {
        grid-template-columns: 38px minmax(0, 1fr);
        min-height: 78px;
        padding: 12px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-tool-icon {
        width: 38px;
        height: 38px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-tool-arrow {
        display: none;
    }
}

/* v6.8 final priority layer for service detail and module pages. */
body.qqpw-next.template-clientareaproductdetails .qq-product-main-tabs,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .card,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .card-body,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .row,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details,
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .qq-product-facts {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card {
    position: relative;
    border: 1px solid rgba(8, 127, 176, 0.14) !important;
    border-radius: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(180deg, #087fb0, #0aa79a 52%, #ffd78c);
    pointer-events: none;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    align-items: stretch;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
    min-height: 270px;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active a,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active > a {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: rgba(10, 167, 154, 0.32) !important;
    box-shadow: inset 4px 0 0 #ffd78c, 0 12px 24px rgba(7, 96, 115, 0.07) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link:hover,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a:hover {
    color: #075f68 !important;
    background: rgba(255, 255, 255, 0.70) !important;
    border-color: rgba(8, 127, 176, 0.16) !important;
}

body.qqpw-next.template-clientareaproductdetails .product-details-tab-container,
body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-content,
body.qqpw-next.template-clientareaproductdetails .product-details-tab-container .tab-pane {
    color: #07314f !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(247, 255, 253, 0.78)) !important;
    border-radius: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-note {
    color: #4b6570;
    line-height: 1.55;
    margin: 0 0 14px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-note code {
    color: #07314f;
    background: rgba(239, 252, 249, 0.90);
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 6px;
    padding: 3px 6px;
}

body.qqpw-next.template-clientareaproductdetails .qq-natmap-command span {
    display: block;
    color: #5b7280;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 6px;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-table,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget__body {
    color: #07314f !important;
    background-color: rgba(255, 255, 255, 0.88) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-panel-header,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-widget__header,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-top,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-top__toolbar {
    color: #07314f !important;
    background: linear-gradient(90deg, rgba(239, 252, 249, 0.96), rgba(255, 250, 240, 0.80)) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-btn,
body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-btn--default,
body.qqpw-next.template-clientareaproductdetails .module-client-area .btn {
    color: #075f68 !important;
    background: rgba(255, 255, 255, 0.90) !important;
    border-color: rgba(8, 127, 176, 0.16) !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 22px rgba(7, 96, 115, 0.05) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-btn:hover,
body.qqpw-next.template-clientareaproductdetails .module-client-area .btn:hover {
    color: #07314f !important;
    border-color: rgba(10, 167, 154, 0.30) !important;
    box-shadow: 0 14px 30px rgba(7, 96, 115, 0.09) !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-alert,
body.qqpw-next.template-clientareaproductdetails .module-client-area .alert {
    color: #075f68 !important;
    background: rgba(239, 252, 249, 0.86) !important;
    border-color: rgba(8, 127, 176, 0.16) !important;
    border-left: 4px solid #087fb0 !important;
}

body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-table th,
body.qqpw-next.template-clientareaproductdetails .module-client-area table th {
    background: rgba(239, 252, 249, 0.90) !important;
    color: #07314f !important;
    font-weight: 800 !important;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-status .product-icon {
        min-height: 180px;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
        min-height: 0;
        padding: 20px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tiles.lu-row {
        grid-template-columns: 1fr 1fr !important;
    }
}

@media (max-width: 420px) {
    body.qqpw-next.template-clientareaproductdetails .module-client-area .lu-tiles.lu-row {
        grid-template-columns: 1fr !important;
    }
}
/* v7.8 absolute final service console priority layer. */
body.qqpw-next.template-clientareaproductdetails .qq-content {
    flex: 0 0 100% !important;
    max-width: 1180px !important;
    width: 100% !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console > .nav-tabs,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm {
    display: inline-flex !important;
    width: auto !important;
    gap: 4px !important;
    padding: 5px !important;
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.62) !important;
    box-shadow: 0 14px 30px rgba(7, 96, 115, 0.06) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link {
    min-height: 36px !important;
    color: #4b6570 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 8px 14px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm .nav-item a.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .nav-link.active,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active a,
body.qqpw-next.template-clientareaproductdetails .qq-product-console .nav-tabs .active > a {
    color: #07314f !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 10px 20px rgba(7, 96, 115, 0.08) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm-connector {
    display: none !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-clientareaproductdetails .qq-content {
        max-width: 760px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-product-console > .nav-tabs,
    body.qqpw-next.template-clientareaproductdetails .qq-product-console .responsive-tabs-sm {
        display: flex !important;
        width: 100% !important;
        border-radius: 14px !important;
    }
}

/* v8.2 absolute final layer: workbench takes priority after legacy service-detail rules. */
body.qqpw-next.template-clientareaproductdetails .qq-product-overview-card .product-details > .row {
    align-items: stretch !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-product-facts {
    min-height: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-info-panel {
    margin-bottom: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench {
    display: grid !important;
    gap: 16px !important;
    margin-top: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-strip {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 18px !important;
    padding: 18px 20px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-strip,
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
    border: 1px solid rgba(8, 127, 176, 0.15) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(239, 252, 249, 0.82)),
        radial-gradient(circle at 94% 8%, rgba(255, 215, 140, 0.28), transparent 34%) !important;
    box-shadow: 0 18px 44px rgba(7, 96, 115, 0.08) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(122px, 1fr)) !important;
    gap: 10px !important;
    min-width: 280px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.08fr) minmax(350px, 0.92fr) !important;
    gap: 16px !important;
    align-items: start !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
    min-width: 0 !important;
    padding: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-head,
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-head {
    align-items: center !important;
    padding: 0 0 13px !important;
    border-bottom: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 0 !important;
    background: transparent !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-workbench .qq-service-toolkit-grid {
    grid-template-columns: 1fr !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles.lu-row {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)) !important;
    gap: 12px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles > [class*="lu-col"] {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-strip {
        grid-template-columns: 66px minmax(0, 1fr) !important;
        gap: 12px !important;
        padding: 14px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats {
        grid-column: 1 / -1 !important;
        grid-template-columns: 1fr 1fr !important;
        min-width: 0 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
        padding: 14px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
        grid-template-columns: 1fr !important;
        align-items: start !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-panel {
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
        grid-template-columns: 66px minmax(0, 1fr) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 420px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-stats {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .lu-tiles.lu-row {
        grid-template-columns: 1fr 1fr !important;
    }
}

/* v9.2 true final service tools override: single workspace, no detached access rail. */
body.qqpw-next.template-clientareaproductdetails .qq-service-workbench-grid {
    grid-template-columns: 1fr !important;
    align-items: start !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-action-grid {
    grid-template-columns: repeat(6, minmax(104px, 1fr)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-utility-grid {
    grid-template-columns: repeat(4, minmax(132px, 1fr)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline {
    display: grid !important;
    grid-template-columns: minmax(220px, 0.72fr) minmax(260px, 1fr) minmax(280px, 1fr) !important;
    gap: 12px !important;
    align-items: stretch !important;
    margin-top: 16px !important;
    padding: 14px !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(239, 252, 249, 0.72)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.20), transparent 42%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-toolkit-head {
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-toolkit-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-credential-note {
    height: 100% !important;
    margin: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-route-map,
body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-ip-addresses-widget {
    display: none !important;
}

@media (max-width: 1199px) {
    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-action-grid {
        grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline {
        grid-template-columns: 1fr 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline .qq-service-toolkit-head {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-action-grid,
    body.qqpw-next.template-clientareaproductdetails .qq-module-client-area-inline .qq-module-utility-grid {
        grid-template-columns: 1fr 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-toolkit-inline {
        grid-template-columns: 1fr !important;
        padding: 12px !important;
    }
}

/* v10 homepage trust panel: four Top standards, designed as a reliability promise. */
body.qqpw-next.template-homepage .qq-atoll-shell {
    grid-template-columns: minmax(0, 0.92fr) minmax(430px, 0.82fr) !important;
    gap: clamp(34px, 4.4vw, 58px) !important;
}

body.qqpw-next.template-homepage .qq-atoll-trust-panel {
    padding: 24px !important;
    border-radius: 10px !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.84), rgba(244, 255, 252, 0.68) 58%, rgba(255, 250, 239, 0.72)),
        radial-gradient(circle at 88% 4%, rgba(255, 215, 140, 0.30), transparent 13rem) !important;
    border: 1px solid rgba(255, 255, 255, 0.72) !important;
    box-shadow:
        0 28px 74px rgba(7, 96, 115, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
}

body.qqpw-next.template-homepage .qq-trust-panel-head {
    margin-bottom: 14px !important;
    padding-bottom: 14px !important;
}

body.qqpw-next.template-homepage .qq-trust-panel-head p {
    color: #00776f !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: 0.03em !important;
}

body.qqpw-next.template-homepage .qq-trust-panel-head strong {
    max-width: 420px;
    color: #062f4d !important;
    font-size: 25px !important;
    line-height: 1.12 !important;
    font-weight: 880 !important;
}

body.qqpw-next.template-homepage .qq-top-score-card {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 104px;
    padding: 15px;
    color: #062f4d;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.90), rgba(238, 252, 249, 0.72)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.20), transparent 8rem);
    border: 1px solid rgba(8, 127, 176, 0.14);
    border-radius: 10px;
    box-shadow: 0 16px 36px rgba(7, 96, 115, 0.08);
}

body.qqpw-next.template-homepage .qq-top-score-mark {
    width: 62px;
    height: 62px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #062f4d;
    background:
        radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.96), transparent 34%),
        linear-gradient(135deg, #80e5d8, #ffd78c);
    border: 1px solid rgba(8, 127, 176, 0.13);
    border-radius: 18px;
    font-size: 15px;
    font-weight: 950;
    letter-spacing: 0.02em;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        0 14px 28px rgba(7, 96, 115, 0.10);
}

body.qqpw-next.template-homepage .qq-top-score-card strong,
body.qqpw-next.template-homepage .qq-top-score-card small {
    display: block;
}

body.qqpw-next.template-homepage .qq-top-score-card strong {
    color: #062f4d;
    font-size: 16px;
    font-weight: 880;
    line-height: 1.2;
}

body.qqpw-next.template-homepage .qq-top-score-card small {
    color: #4f6973;
    font-size: 12px;
    line-height: 1.42;
    margin-top: 5px;
}

body.qqpw-next.template-homepage .qq-top-score-card em {
    color: #00776f;
    background: rgba(10, 167, 154, 0.11);
    border: 1px solid rgba(10, 167, 154, 0.20);
    border-radius: 999px;
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
    padding: 6px 10px;
    white-space: nowrap;
}

body.qqpw-next.template-homepage .qq-top-standards {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

body.qqpw-next.template-homepage .qq-top-standards article {
    min-height: 146px;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    align-content: start;
    gap: 8px;
    padding: 14px;
    color: #062f4d;
    background:
        linear-gradient(150deg, rgba(255, 255, 255, 0.84), rgba(245, 255, 252, 0.62)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.13), transparent 7rem);
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(7, 96, 115, 0.055);
}

body.qqpw-next.template-homepage .qq-top-standards article span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

body.qqpw-next.template-homepage .qq-top-standards article i {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #007f90;
    background:
        radial-gradient(circle at 34% 26%, rgba(255, 255, 255, 0.92), transparent 35%),
        linear-gradient(135deg, rgba(10, 167, 154, 0.16), rgba(255, 215, 140, 0.20));
    border: 1px solid rgba(8, 127, 176, 0.12);
    border-radius: 12px;
}

body.qqpw-next.template-homepage .qq-top-standards article b {
    color: rgba(6, 47, 77, 0.34);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 0.04em;
}

body.qqpw-next.template-homepage .qq-top-standards article strong {
    color: #062f4d;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.12;
}

body.qqpw-next.template-homepage .qq-top-standards article small {
    color: #526c76;
    font-size: 11.5px;
    line-height: 1.38;
}

body.qqpw-next.template-homepage .qq-trust-actions {
    margin-top: 12px !important;
}

body.qqpw-next.template-homepage .qq-trust-actions a {
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.78) !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-trust-panel {
        max-width: 680px !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-top-standards {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    body.qqpw-next.template-homepage .qq-top-standards article {
        min-height: 156px;
        padding: 12px;
    }

    body.qqpw-next.template-homepage .qq-top-standards article small {
        font-size: 10.5px;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-trust-panel {
        padding: 18px !important;
    }

    body.qqpw-next.template-homepage .qq-trust-panel-head strong {
        font-size: 22px !important;
    }

    body.qqpw-next.template-homepage .qq-top-score-card {
        grid-template-columns: 54px minmax(0, 1fr);
        min-height: 0;
        padding: 13px;
    }

    body.qqpw-next.template-homepage .qq-top-score-mark {
        width: 54px;
        height: 54px;
        border-radius: 16px;
    }

    body.qqpw-next.template-homepage .qq-top-score-card em {
        grid-column: 2;
        justify-self: start;
    }

    body.qqpw-next.template-homepage .qq-top-standards {
        grid-template-columns: 1fr;
    }

    body.qqpw-next.template-homepage .qq-top-standards article {
        min-height: 0;
    }
}

/* v10.1 homepage trust panel: lower, lighter, and more architectural so the moon remains visible. */
body.qqpw-next.template-homepage .qq-atoll-shell {
    max-width: 1180px !important;
    grid-template-columns: minmax(0, 1fr) minmax(390px, 0.64fr) !important;
    align-items: center !important;
}

body.qqpw-next.template-homepage .qq-atoll-trust-panel {
    width: min(100%, 468px) !important;
    justify-self: end !important;
    transform: translateY(62px);
    padding: 18px !important;
    border-radius: 14px !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.68), rgba(244, 255, 252, 0.44) 56%, rgba(255, 250, 238, 0.50)),
        radial-gradient(circle at 88% 2%, rgba(255, 215, 140, 0.22), transparent 10rem) !important;
    border: 1px solid rgba(255, 255, 255, 0.70) !important;
    box-shadow:
        0 22px 58px rgba(7, 96, 115, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.74) !important;
    backdrop-filter: blur(14px) saturate(1.05);
}

body.qqpw-next.template-homepage .qq-atoll-trust-panel::before {
    opacity: 0.24 !important;
}

body.qqpw-next.template-homepage .qq-trust-panel-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 5px;
    margin-bottom: 9px !important;
    padding-bottom: 10px !important;
}

body.qqpw-next.template-homepage .qq-trust-panel-head p {
    font-size: 10px !important;
    letter-spacing: 0.055em !important;
}

body.qqpw-next.template-homepage .qq-trust-panel-head strong {
    max-width: 390px !important;
    font-size: 21px !important;
    line-height: 1.08 !important;
}

body.qqpw-next.template-homepage .qq-top-score-card {
    grid-template-columns: 46px minmax(0, 1fr) auto !important;
    min-height: 62px !important;
    gap: 11px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(238, 252, 249, 0.48)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.18), transparent 6rem) !important;
    box-shadow: 0 10px 24px rgba(7, 96, 115, 0.06) !important;
}

body.qqpw-next.template-homepage .qq-top-score-mark {
    width: 46px !important;
    height: 46px !important;
    border-radius: 14px !important;
    font-size: 12px !important;
}

body.qqpw-next.template-homepage .qq-top-score-card strong {
    font-size: 12.5px !important;
    line-height: 1.16 !important;
}

body.qqpw-next.template-homepage .qq-top-score-card small {
    max-width: 265px;
    font-size: 10px !important;
    line-height: 1.22 !important;
    margin-top: 3px !important;
}

body.qqpw-next.template-homepage .qq-top-score-card em {
    font-size: 10px !important;
    padding: 5px 8px !important;
}

body.qqpw-next.template-homepage .qq-top-standards {
    gap: 9px !important;
    margin-top: 10px !important;
}

body.qqpw-next.template-homepage .qq-top-standards article {
    min-height: 96px !important;
    gap: 6px !important;
    padding: 11px 12px !important;
    border-radius: 12px !important;
    background:
        linear-gradient(150deg, rgba(255, 255, 255, 0.66), rgba(245, 255, 252, 0.46)),
        radial-gradient(circle at 100% 0%, rgba(255, 215, 140, 0.12), transparent 6rem) !important;
    box-shadow: 0 10px 22px rgba(7, 96, 115, 0.045) !important;
}

body.qqpw-next.template-homepage .qq-top-standards article i {
    width: 28px !important;
    height: 28px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
}

body.qqpw-next.template-homepage .qq-top-standards article b {
    font-size: 10px !important;
}

body.qqpw-next.template-homepage .qq-top-standards article strong {
    font-size: 12.5px !important;
    line-height: 1.12 !important;
}

body.qqpw-next.template-homepage .qq-top-standards article small {
    font-size: 10px !important;
    line-height: 1.24 !important;
}

body.qqpw-next.template-homepage .qq-trust-actions {
    gap: 9px !important;
    margin-top: 10px !important;
}

body.qqpw-next.template-homepage .qq-trust-actions a {
    min-height: 38px !important;
    font-size: 12px !important;
    background: rgba(255, 255, 255, 0.62) !important;
    border-color: rgba(8, 127, 176, 0.12) !important;
}

@media (min-width: 1200px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-top: 48px !important;
        padding-bottom: 72px !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-trust-panel {
        width: 100% !important;
        max-width: 620px !important;
        justify-self: center !important;
        transform: none;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-trust-panel {
        padding: 15px !important;
    }

    body.qqpw-next.template-homepage .qq-trust-panel-head strong {
        font-size: 20px !important;
    }

    body.qqpw-next.template-homepage .qq-top-score-card {
        grid-template-columns: 44px minmax(0, 1fr) !important;
    }

    body.qqpw-next.template-homepage .qq-top-score-card em {
        grid-column: 2 !important;
    }

    body.qqpw-next.template-homepage .qq-top-standards {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-homepage .qq-top-standards article {
        min-height: 0 !important;
    }
}

/* v10.2 homepage trust panel: compact gallery card that preserves the moon and keeps the promise grid orderly. */
@media (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        grid-template-columns: minmax(0, 1fr) minmax(360px, 0.55fr) !important;
        align-items: start !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-trust-panel {
        width: min(100%, 424px) !important;
        transform: none !important;
        margin-top: 136px;
        padding: 15px !important;
        border-radius: 16px !important;
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.62), rgba(244, 255, 252, 0.42) 58%, rgba(255, 250, 238, 0.48)),
            radial-gradient(circle at 100% 0%, rgba(255, 218, 148, 0.18), transparent 8.5rem) !important;
        border-color: rgba(255, 255, 255, 0.76) !important;
        box-shadow:
            0 20px 50px rgba(6, 88, 107, 0.12),
            inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
    }

    body.qqpw-next.template-homepage .qq-trust-panel-head {
        gap: 4px;
        margin-bottom: 7px !important;
        padding-bottom: 8px !important;
    }

    body.qqpw-next.template-homepage .qq-trust-panel-head p {
        font-size: 9.5px !important;
        letter-spacing: 0.07em !important;
    }

    body.qqpw-next.template-homepage .qq-trust-panel-head strong {
        max-width: 320px !important;
        font-size: 19px !important;
        line-height: 1.06 !important;
    }

    body.qqpw-next.template-homepage .qq-top-score-card {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-top-score-mark {
        width: 42px !important;
        height: 42px !important;
        border-radius: 14px !important;
        font-size: 11px !important;
    }

    body.qqpw-next.template-homepage .qq-top-score-card strong {
        font-size: 12px !important;
        line-height: 1.12 !important;
    }

    body.qqpw-next.template-homepage .qq-top-score-card small {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-top-score-card em {
        font-size: 9.5px !important;
        padding: 5px 8px !important;
        white-space: nowrap;
    }

    body.qqpw-next.template-homepage .qq-top-standards {
        gap: 8px !important;
        margin-top: 10px !important;
    }

    body.qqpw-next.template-homepage .qq-top-standards article {
        min-height: 76px !important;
        gap: 5px !important;
        padding: 9px 10px !important;
        border-radius: 13px !important;
    }

    body.qqpw-next.template-homepage .qq-top-standards article span {
        margin-bottom: 1px;
    }

    body.qqpw-next.template-homepage .qq-top-standards article i {
        width: 24px !important;
        height: 24px !important;
        border-radius: 9px !important;
        font-size: 10.5px !important;
    }

    body.qqpw-next.template-homepage .qq-top-standards article b {
        font-size: 9px !important;
    }

    body.qqpw-next.template-homepage .qq-top-standards article strong {
        font-size: 12px !important;
        line-height: 1.08 !important;
    }

    body.qqpw-next.template-homepage .qq-top-standards article small {
        font-size: 9.4px !important;
        line-height: 1.16 !important;
    }

    body.qqpw-next.template-homepage .qq-trust-actions {
        gap: 8px !important;
        margin-top: 9px !important;
    }

    body.qqpw-next.template-homepage .qq-trust-actions a {
        min-height: 33px !important;
        border-radius: 10px !important;
        font-size: 11.5px !important;
    }
}

/* v10.3 homepage four Top canoe: the standards become part of the moonlit water scene instead of a WHMCS-style panel. */
body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-score-card,
body.qqpw-next.template-homepage .qq-canoe-standards .qq-trust-actions {
    display: none !important;
}

@media (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        grid-template-columns: minmax(0, 1fr) minmax(492px, 0.76fr) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards {
        position: relative;
        width: min(100%, 492px) !important;
        height: 216px;
        margin-top: 218px;
        padding: 0 !important;
        overflow: visible;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards::before {
        content: "";
        position: absolute;
        left: -44px;
        right: -38px;
        bottom: 26px;
        height: 86px;
        pointer-events: none;
        background:
            radial-gradient(ellipse at 52% 90%, rgba(255, 255, 255, 0.46), transparent 44%),
            repeating-linear-gradient(-4deg, rgba(255, 255, 255, 0.44) 0 1px, transparent 1px 15px),
            repeating-linear-gradient(4deg, rgba(255, 211, 142, 0.34) 0 1px, transparent 1px 19px);
        mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent);
        opacity: 0.72;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards::after {
        content: "";
        position: absolute;
        left: 22px;
        right: 22px;
        bottom: 46px;
        height: 62px;
        pointer-events: none;
        background:
            linear-gradient(180deg, rgba(255, 207, 133, 0.78), rgba(160, 91, 45, 0.76) 45%, rgba(83, 58, 44, 0.82)),
            linear-gradient(90deg, transparent 0 8%, rgba(255, 255, 255, 0.28) 11% 13%, transparent 16% 84%, rgba(255, 255, 255, 0.20) 87% 89%, transparent 92%);
        clip-path: polygon(0 16%, 7% 8%, 93% 8%, 100% 16%, 90% 68%, 64% 96%, 36% 96%, 10% 68%);
        border: 1px solid rgba(255, 235, 192, 0.45);
        box-shadow:
            0 16px 34px rgba(2, 72, 91, 0.18),
            inset 0 8px 12px rgba(255, 241, 198, 0.26),
            inset 0 -13px 16px rgba(54, 38, 30, 0.18);
        opacity: 0.86;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-trust-panel-head {
        position: absolute;
        left: 16px;
        right: 16px;
        top: 10px;
        z-index: 3;
        display: grid;
        justify-items: center;
        gap: 3px;
        margin: 0 !important;
        padding: 0 !important;
        border-bottom: 0;
        text-align: center;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-trust-panel-head p {
        font-size: 9.5px !important;
        letter-spacing: 0.11em !important;
        color: rgba(0, 106, 105, 0.96) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-trust-panel-head strong {
        max-width: none !important;
        width: auto;
        padding: 7px 14px;
        border: 1px solid rgba(255, 255, 255, 0.68);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.42);
        box-shadow: 0 10px 24px rgba(6, 88, 107, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.64);
        font-size: 13px !important;
        line-height: 1 !important;
        letter-spacing: 0.07em;
        text-transform: uppercase;
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.52);
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        position: absolute;
        left: 44px;
        right: 44px;
        bottom: 82px;
        z-index: 4;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 9px !important;
        margin: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        position: relative;
        min-height: 66px !important;
        padding: 8px 8px 7px !important;
        gap: 3px !important;
        align-content: center;
        border-radius: 999px 999px 18px 18px !important;
        background:
            linear-gradient(160deg, rgba(255, 255, 255, 0.72), rgba(240, 255, 251, 0.42)),
            radial-gradient(circle at 50% 0%, rgba(255, 223, 157, 0.32), transparent 4.8rem) !important;
        border: 1px solid rgba(255, 255, 255, 0.76) !important;
        box-shadow:
            0 10px 24px rgba(4, 80, 99, 0.12),
            inset 0 1px 0 rgba(255, 255, 255, 0.70) !important;
        text-align: center;
        overflow: visible !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::after {
        content: "";
        position: absolute;
        left: 22%;
        right: 22%;
        bottom: -12px;
        height: 16px;
        background: linear-gradient(180deg, rgba(129, 78, 42, 0.48), rgba(68, 45, 35, 0.62));
        border-radius: 0 0 999px 999px;
        filter: blur(0.2px);
        z-index: -1;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 5px;
        margin: 0;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
        width: 25px !important;
        height: 25px !important;
        border-radius: 11px !important;
        font-size: 10px !important;
        background: linear-gradient(135deg, rgba(14, 178, 168, 0.20), rgba(255, 213, 129, 0.26)) !important;
        color: #007a82 !important;
        box-shadow: inset 0 0 0 1px rgba(7, 151, 154, 0.18);
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article b {
        font-size: 8px !important;
        color: rgba(3, 73, 99, 0.44) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        font-size: 11px !important;
        line-height: 1.08 !important;
        color: #06385f !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        display: none !important;
    }
}

/* QQ.PW hero v16 final override: canoe standards aligned and compact. */
@media (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        overflow: visible !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards {
        left: 0 !important;
        right: 0 !important;
        bottom: 28px !important;
        width: auto !important;
        height: 124px !important;
        overflow: visible !important;
        pointer-events: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        gap: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        position: absolute !important;
        top: 10px !important;
        width: 120px !important;
        min-height: 94px !important;
        padding: 12px 8px 10px !important;
        text-align: center !important;
        border: 1px solid rgba(101, 61, 27, 0.38) !important;
        border-radius: 5px !important;
        background:
            linear-gradient(90deg, rgba(90, 52, 22, 0.08) 0 1px, transparent 1px 100%),
            linear-gradient(180deg, #dfb778 0%, #d29d5a 47%, #b9803d 100%) !important;
        background-size: 18px 100%, 100% 100% !important;
        box-shadow:
            0 16px 34px rgba(50, 29, 12, 0.20),
            inset 0 1px 0 rgba(255, 242, 204, 0.54),
            inset 0 -1px 0 rgba(86, 49, 22, 0.24) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(1) {
        left: 56% !important;
        transform: translateX(-50%) rotate(-1.5deg) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(2) {
        left: 68% !important;
        transform: translateX(-50%) rotate(0.8deg) translateY(-3px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(3) {
        left: 82% !important;
        transform: translateX(-50%) rotate(-0.7deg) translateY(3px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(4) {
        left: 95% !important;
        transform: translateX(-50%) rotate(1.2deg) translateY(-2px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::before,
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::after {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        display: block !important;
        width: auto !important;
        height: auto !important;
        margin: 0 0 7px !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article b,
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
        display: inline-block !important;
        font-size: 23px !important;
        color: #120b03 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        display: block !important;
        font-size: 15px !important;
        line-height: 1.05 !important;
        color: #130d05 !important;
        letter-spacing: 0 !important;
    }
}

@media (max-width: 1199px) and (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        width: 108px !important;
        min-height: 88px !important;
        padding: 10px 7px 9px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(1) {
        left: 53% !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(2) {
        left: 66% !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(3) {
        left: 80% !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(4) {
        left: 93% !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-canoe-standards {
        position: relative !important;
        right: auto !important;
        bottom: auto !important;
        width: 100% !important;
        max-width: 640px !important;
        height: auto !important;
        margin: 16px auto 0 !important;
        pointer-events: auto !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        display: flex !important;
        align-items: center !important;
        min-height: 50px !important;
        padding: 8px 10px !important;
        text-align: left !important;
        border: 1px solid rgba(4, 138, 152, 0.22) !important;
        border-radius: 10px !important;
        background: linear-gradient(135deg, rgba(255, 255, 255, 0.90), rgba(239, 252, 250, 0.74)) !important;
        background-size: auto !important;
        box-shadow:
            0 12px 26px rgba(7, 86, 118, 0.10),
            inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
        transform: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::before,
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::after {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 30px !important;
        height: 30px !important;
        flex: 0 0 30px !important;
        margin: 0 8px 0 0 !important;
        border: 1px solid rgba(212, 165, 77, 0.42) !important;
        border-radius: 8px !important;
        background: linear-gradient(135deg, rgba(255, 250, 227, 0.94), rgba(202, 237, 227, 0.88)) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
        font-size: 15px !important;
        color: #083160 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article b,
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        display: block !important;
        min-width: 0 !important;
        font-size: 12px !important;
        line-height: 1.15 !important;
        color: #082b5f !important;
        letter-spacing: 0 !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-canoe-standards {
        margin-top: 14px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        gap: 7px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 46px !important;
        padding: 7px 8px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        width: 27px !important;
        height: 27px !important;
        flex-basis: 27px !important;
        margin-right: 7px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        font-size: 11px !important;
    }
}

/* QQ.PW hero v15: align canoe standards with the service team, keep mobile compact. */
@media (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        overflow: visible !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards {
        left: 0 !important;
        right: 0 !important;
        bottom: 28px !important;
        width: auto !important;
        height: 124px !important;
        overflow: visible !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        position: absolute !important;
        top: 10px !important;
        width: 120px !important;
        min-height: 94px !important;
        padding: 12px 8px 10px !important;
        text-align: center !important;
        border-radius: 5px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(1) {
        left: 56% !important;
        transform: translateX(-50%) rotate(-1.5deg) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(2) {
        left: 68% !important;
        transform: translateX(-50%) rotate(0.8deg) translateY(-3px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(3) {
        left: 82% !important;
        transform: translateX(-50%) rotate(-0.7deg) translateY(3px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(4) {
        left: 95% !important;
        transform: translateX(-50%) rotate(1.2deg) translateY(-2px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        display: block !important;
        width: auto !important;
        height: auto !important;
        margin: 0 0 7px !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article b {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
        display: inline-block !important;
        font-size: 23px !important;
        color: #120b03 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        display: block !important;
        font-size: 15px !important;
        line-height: 1.05 !important;
        color: #130d05 !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-canoe-standards {
        position: relative !important;
        right: auto !important;
        bottom: auto !important;
        width: 100% !important;
        max-width: 640px !important;
        height: auto !important;
        margin: 18px auto 0 !important;
        pointer-events: auto;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        display: flex !important;
        align-items: center !important;
        min-height: 50px !important;
        padding: 8px 10px !important;
        text-align: left !important;
        border: 1px solid rgba(4, 138, 152, 0.22) !important;
        border-radius: 10px !important;
        background:
            linear-gradient(135deg, rgba(255, 255, 255, 0.90), rgba(239, 252, 250, 0.74)) !important;
        background-size: auto !important;
        box-shadow:
            0 12px 26px rgba(7, 86, 118, 0.10),
            inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
        transform: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 30px !important;
        height: 30px !important;
        flex: 0 0 30px !important;
        margin: 0 8px 0 0 !important;
        border: 1px solid rgba(212, 165, 77, 0.42) !important;
        border-radius: 8px !important;
        background: linear-gradient(135deg, rgba(255, 250, 227, 0.94), rgba(202, 237, 227, 0.88)) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
        font-size: 15px !important;
        color: #083160 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article b,
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        display: block !important;
        min-width: 0 !important;
        font-size: 12px !important;
        line-height: 1.15 !important;
        color: #082b5f !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-canoe-standards {
        margin-top: 14px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        gap: 7px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 46px !important;
        padding: 7px 8px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        width: 27px !important;
        height: 27px !important;
        flex-basis: 27px !important;
        margin-right: 7px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        font-size: 11px !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-canoe-standards {
        position: relative;
        padding: 16px !important;
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.64), rgba(240, 255, 252, 0.42)),
            radial-gradient(ellipse at 50% 100%, rgba(255, 213, 138, 0.18), transparent 12rem) !important;
        border: 1px solid rgba(255, 255, 255, 0.74) !important;
        box-shadow: 0 18px 42px rgba(4, 80, 99, 0.10) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards::after {
        content: "";
        position: absolute;
        left: 28px;
        right: 28px;
        bottom: 18px;
        height: 44px;
        pointer-events: none;
        background: linear-gradient(180deg, rgba(255, 207, 133, 0.42), rgba(128, 84, 55, 0.38));
        clip-path: polygon(0 24%, 10% 10%, 90% 10%, 100% 24%, 85% 72%, 62% 95%, 38% 95%, 15% 72%);
        opacity: 0.54;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-trust-panel-head {
        margin-bottom: 12px !important;
        padding-bottom: 12px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        position: relative;
        z-index: 2;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        margin-top: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 94px !important;
        padding: 12px !important;
        text-align: left;
    }
}

/* v11 homepage: real Hawaii canoe hero image with lightweight wooden standard placards. */
body.qqpw-next.template-homepage .qq-atoll-hero {
    position: relative;
    min-height: clamp(600px, 72vh, 760px);
    padding: 70px 0 82px !important;
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.91) 31%, rgba(255, 255, 255, 0.43) 51%, rgba(255, 255, 255, 0.05) 78%),
        linear-gradient(180deg, rgba(247, 253, 255, 0.28), rgba(243, 255, 252, 0.16)),
        url("../img/hero-hawaii-canoe.jpg") center center / cover no-repeat !important;
    border-bottom: 4px solid transparent;
    border-image: linear-gradient(90deg, #008db5, #10b5a8, #f3c45c, #f17358) 1;
}

body.qqpw-next.template-homepage .qq-atoll-hero::before,
body.qqpw-next.template-homepage .qq-atoll-hero::after {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-atoll-shell {
    position: relative;
    z-index: 2;
    display: grid !important;
    grid-template-columns: minmax(0, 668px) minmax(0, 500px) !important;
    align-items: start !important;
    gap: 34px !important;
    max-width: 1220px !important;
    min-height: 480px;
}

body.qqpw-next.template-homepage .qq-atoll-copy {
    padding-top: 10px;
}

body.qqpw-next.template-homepage .qq-atoll-copy .qq-eyebrow {
    width: max-content;
    max-width: 100%;
    padding: 11px 18px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.86) !important;
    box-shadow: 0 16px 36px rgba(6, 43, 74, 0.10);
}

body.qqpw-next.template-homepage .qq-atoll-copy h1 {
    max-width: 668px;
    margin-top: 26px !important;
    font-size: clamp(52px, 5vw, 70px) !important;
    line-height: 1.04 !important;
    color: #082b5f !important;
    text-shadow: 0 2px 0 rgba(255, 255, 255, 0.36);
}

body.qqpw-next.template-homepage .qq-hero-line {
    max-width: 610px !important;
    margin-top: 22px !important;
    color: rgba(8, 43, 95, 0.88) !important;
    font-size: 20px !important;
    line-height: 1.55 !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.40);
}

body.qqpw-next.template-homepage .qq-hero-actions {
    margin-top: 34px !important;
}

body.qqpw-next.template-homepage .qq-atoll-signals {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards {
    position: relative !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
    margin-top: 272px !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards::before,
body.qqpw-next.template-homepage .qq-canoe-standards::after {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-trust-panel-head {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    top: auto !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
    position: relative;
    min-height: 154px !important;
    padding: 15px 10px 13px !important;
    border: 1px solid rgba(111, 70, 32, 0.34) !important;
    border-radius: 3px !important;
    background:
        linear-gradient(90deg, rgba(111, 70, 32, 0.07) 0 1px, transparent 1px 100%),
        linear-gradient(180deg, #d7a968 0%, #c99551 52%, #b98342 100%) !important;
    background-size: 18px 100%, 100% 100% !important;
    box-shadow:
        0 18px 32px rgba(52, 32, 18, 0.18),
        inset 0 1px 0 rgba(255, 237, 196, 0.45),
        inset 0 -1px 0 rgba(96, 56, 24, 0.22) !important;
    text-align: center;
    color: #241709 !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -64px;
    width: 10px;
    height: 66px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, #7d4a24, #c08a4a 45%, #6b3b1d);
    border-radius: 0 0 999px 999px;
    box-shadow: 0 8px 16px rgba(37, 20, 10, 0.22);
    z-index: -1;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::after {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
    display: grid;
    justify-items: center;
    gap: 4px;
    margin: 0 0 8px !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
    width: 34px !important;
    height: 34px !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #1c140c !important;
    font-size: 26px !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article b {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
    display: block;
    font-size: 16px !important;
    line-height: 1.08 !important;
    color: #211407 !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
    display: block !important;
    margin-top: 10px;
    font-size: 11px !important;
    line-height: 1.25 !important;
    color: rgba(31, 19, 9, 0.88) !important;
}

@media (max-width: 1199px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        grid-template-columns: minmax(390px, 0.85fr) minmax(420px, 1fr) !important;
        gap: 24px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards {
        margin-top: 276px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        gap: 10px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 150px !important;
        padding: 14px 10px 12px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        font-size: 15px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        font-size: 10.5px !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 0;
        padding: 52px 0 64px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.82) 38%, rgba(255, 255, 255, 0.20) 100%),
            url("../img/hero-hawaii-canoe.jpg") center center / cover no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        grid-template-columns: 1fr !important;
        min-height: 0;
        max-width: 760px !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        max-width: 720px;
        font-size: clamp(40px, 8vw, 58px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards {
        margin-top: 24px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 128px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::before {
        display: none !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-top: 32px !important;
        background-position: 58% center !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        font-size: 39px !important;
        line-height: 1.08 !important;
    }

    body.qqpw-next.template-homepage .qq-hero-line {
        font-size: 16px !important;
        line-height: 1.45 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 116px !important;
        padding: 12px 9px 10px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
        font-size: 20px !important;
        height: 24px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        font-size: 13px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        font-size: 10px !important;
    }
}

/* v12 sunny canoe hero: image-led Hawaii trust scene with integrated service standards. */
body.qqpw-next.template-homepage .qq-atoll-hero {
    min-height: 680px !important;
    padding: 74px 0 70px !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.97) 0%, rgba(255, 255, 255, 0.86) 31%, rgba(255, 255, 255, 0.34) 54%, rgba(255, 255, 255, 0.02) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.00) 46%, rgba(2, 113, 145, 0.14) 100%),
        url("../img/hero-hawaii-canoe-v4.jpg") center center / cover no-repeat !important;
}

body.qqpw-next.template-homepage .qq-atoll-hero::before {
    background:
        radial-gradient(circle at 5% 16%, rgba(255, 255, 255, 0.78), transparent 16rem),
        radial-gradient(circle at 58% 102%, rgba(13, 168, 173, 0.20), transparent 20rem) !important;
    opacity: 1 !important;
}

body.qqpw-next.template-homepage .qq-atoll-shell {
    display: block !important;
    position: relative !important;
    max-width: 1220px !important;
    min-height: 536px !important;
}

body.qqpw-next.template-homepage .qq-atoll-copy {
    position: relative;
    z-index: 2;
    max-width: 700px;
    padding-left: clamp(0px, 1.2vw, 18px) !important;
}

body.qqpw-next.template-homepage .qq-atoll-copy .qq-eyebrow {
    color: #082b5f !important;
    background: rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 18px 36px rgba(8, 43, 95, 0.10) !important;
}

body.qqpw-next.template-homepage .qq-atoll-copy h1 {
    max-width: 680px !important;
    margin-top: 30px !important;
    font-size: clamp(56px, 5.2vw, 76px) !important;
    line-height: 1.035 !important;
    color: #08265a !important;
    text-shadow: 0 2px 0 rgba(255, 255, 255, 0.34), 0 18px 46px rgba(255, 255, 255, 0.48) !important;
}

body.qqpw-next.template-homepage .qq-hero-line {
    max-width: 595px !important;
    margin-top: 24px !important;
    color: rgba(8, 38, 90, 0.92) !important;
    font-size: 21px !important;
    line-height: 1.58 !important;
}

body.qqpw-next.template-homepage .qq-hero-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
    margin-top: 36px !important;
}

body.qqpw-next.template-homepage .qq-atoll-copy .btn {
    min-height: 54px !important;
    border-radius: 10px !important;
    padding: 0 24px !important;
    font-size: 17px !important;
    font-weight: 850 !important;
}

body.qqpw-next.template-homepage .qq-atoll-copy .btn-primary {
    background: linear-gradient(135deg, #10b9ad, #0787b5) !important;
    box-shadow: 0 18px 34px rgba(7, 135, 181, 0.26) !important;
}

body.qqpw-next.template-homepage .qq-atoll-copy .btn-default {
    color: #082b5f !important;
    background: rgba(255, 255, 255, 0.88) !important;
    border-color: rgba(8, 43, 95, 0.10) !important;
    box-shadow: 0 16px 32px rgba(8, 43, 95, 0.08) !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards {
    position: absolute !important;
    z-index: 3 !important;
    right: clamp(20px, 3.2vw, 56px) !important;
    bottom: 34px !important;
    width: min(548px, 44vw) !important;
    margin: 0 !important;
    pointer-events: none;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
    min-height: 104px !important;
    padding: 13px 8px 11px !important;
    border: 1px solid rgba(101, 61, 27, 0.38) !important;
    border-radius: 5px !important;
    background:
        linear-gradient(90deg, rgba(90, 52, 22, 0.08) 0 1px, transparent 1px 100%),
        linear-gradient(180deg, #dfb778 0%, #d29d5a 47%, #b9803d 100%) !important;
    background-size: 18px 100%, 100% 100% !important;
    box-shadow:
        0 16px 34px rgba(50, 29, 12, 0.20),
        inset 0 1px 0 rgba(255, 242, 204, 0.54),
        inset 0 -1px 0 rgba(86, 49, 22, 0.24) !important;
    transform-origin: 50% 100%;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(1) {
    transform: rotate(-1.5deg) translateY(2px);
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(2) {
    transform: rotate(1deg) translateY(-4px);
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(3) {
    transform: rotate(-0.7deg) translateY(3px);
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(4) {
    transform: rotate(1.4deg) translateY(-2px);
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::before {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
    font-size: 24px !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
    font-size: 15px !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-atoll-strip {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-home-products-compact {
    padding-top: 52px !important;
}

@media (max-width: 1199px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 640px !important;
        background-position: 56% center !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        max-width: 620px !important;
        font-size: clamp(48px, 5.4vw, 66px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards {
        right: 18px !important;
        bottom: 38px !important;
        width: min(484px, 44vw) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        gap: 10px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 96px !important;
        padding: 12px 8px 10px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        display: none !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 0 !important;
        padding: 46px 0 58px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.86) 46%, rgba(255, 255, 255, 0.20) 100%),
            url("../img/hero-hawaii-canoe-v4.jpg") 59% center / cover no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        min-height: 0 !important;
        max-width: 760px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards {
        position: relative !important;
        right: auto !important;
        bottom: auto !important;
        width: 100% !important;
        margin-top: 28px !important;
        pointer-events: auto;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 108px !important;
        transform: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::before {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        display: none !important;
    }
}

/* QQ.PW hero v17 final override: true end-of-file canoe standard tuning. */
@media (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-atoll-shell {
        overflow: visible !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards {
        left: 0 !important;
        right: 0 !important;
        bottom: 28px !important;
        width: auto !important;
        height: 124px !important;
        overflow: visible !important;
        pointer-events: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        gap: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        position: absolute !important;
        top: 10px !important;
        width: 120px !important;
        min-height: 94px !important;
        padding: 12px 8px 10px !important;
        text-align: center !important;
        border: 1px solid rgba(101, 61, 27, 0.38) !important;
        border-radius: 5px !important;
        background:
            linear-gradient(90deg, rgba(90, 52, 22, 0.08) 0 1px, transparent 1px 100%),
            linear-gradient(180deg, #dfb778 0%, #d29d5a 47%, #b9803d 100%) !important;
        background-size: 18px 100%, 100% 100% !important;
        box-shadow:
            0 16px 34px rgba(50, 29, 12, 0.20),
            inset 0 1px 0 rgba(255, 242, 204, 0.54),
            inset 0 -1px 0 rgba(86, 49, 22, 0.24) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(1) {
        left: 56% !important;
        transform: translateX(-50%) rotate(-1.5deg) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(2) {
        left: 68% !important;
        transform: translateX(-50%) rotate(0.8deg) translateY(-3px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(3) {
        left: 82% !important;
        transform: translateX(-50%) rotate(-0.7deg) translateY(3px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(4) {
        left: 95% !important;
        transform: translateX(-50%) rotate(1.2deg) translateY(-2px) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::before,
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::after {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        display: block !important;
        width: auto !important;
        height: auto !important;
        margin: 0 0 7px !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article b,
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
        display: inline-block !important;
        font-size: 23px !important;
        color: #120b03 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        display: block !important;
        font-size: 15px !important;
        line-height: 1.05 !important;
        color: #130d05 !important;
        letter-spacing: 0 !important;
    }
}

@media (max-width: 1199px) and (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        width: 108px !important;
        min-height: 88px !important;
        padding: 10px 7px 9px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(1) {
        left: 53% !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(2) {
        left: 66% !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(3) {
        left: 80% !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article:nth-child(4) {
        left: 93% !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-canoe-standards {
        position: relative !important;
        right: auto !important;
        bottom: auto !important;
        width: 100% !important;
        max-width: 640px !important;
        height: auto !important;
        margin: 16px auto 0 !important;
        pointer-events: auto !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        display: flex !important;
        align-items: center !important;
        min-height: 50px !important;
        padding: 8px 10px !important;
        text-align: left !important;
        border: 1px solid rgba(4, 138, 152, 0.22) !important;
        border-radius: 10px !important;
        background: linear-gradient(135deg, rgba(255, 255, 255, 0.90), rgba(239, 252, 250, 0.74)) !important;
        background-size: auto !important;
        box-shadow:
            0 12px 26px rgba(7, 86, 118, 0.10),
            inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
        transform: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::before,
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article::after {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 30px !important;
        height: 30px !important;
        flex: 0 0 30px !important;
        margin: 0 8px 0 0 !important;
        border: 1px solid rgba(212, 165, 77, 0.42) !important;
        border-radius: 8px !important;
        background: linear-gradient(135deg, rgba(255, 250, 227, 0.94), rgba(202, 237, 227, 0.88)) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article i {
        font-size: 15px !important;
        color: #083160 !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article b,
    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        display: none !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        display: block !important;
        min-width: 0 !important;
        font-size: 12px !important;
        line-height: 1.15 !important;
        color: #082b5f !important;
        letter-spacing: 0 !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-canoe-standards {
        margin-top: 14px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        gap: 7px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 46px !important;
        padding: 7px 8px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        width: 27px !important;
        height: 27px !important;
        flex-basis: 27px !important;
        margin-right: 7px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        font-size: 11px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding: 32px 0 42px !important;
        background-position: 62% center !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        font-size: 38px !important;
        line-height: 1.08 !important;
    }

    body.qqpw-next.template-homepage .qq-hero-line {
        font-size: 16px !important;
        line-height: 1.46 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .btn {
        min-height: 48px !important;
        padding: 0 16px !important;
        font-size: 15px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 98px !important;
        padding: 12px 8px 10px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        font-size: 13px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article small {
        display: none !important;
    }
}

/* QQ.PW hero v17 mobile clamp at EOF. */
@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-canoe-standards {
        margin-top: 14px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards {
        gap: 7px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article {
        min-height: 46px !important;
        padding: 7px 8px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article span {
        width: 27px !important;
        height: 27px !important;
        flex-basis: 27px !important;
        margin-right: 7px !important;
    }

    body.qqpw-next.template-homepage .qq-canoe-standards .qq-top-standards article strong {
        font-size: 11px !important;
    }
}

/* QQ.PW hero v18 desktop width fix after all earlier overrides. */
@media (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-canoe-standards {
        left: 0 !important;
        right: auto !important;
        width: 100% !important;
        max-width: none !important;
    }
}

/* QQ.PW hero v19: 4T is baked into the desktop hero image, not positioned by CSS. */
body.qqpw-next.template-homepage .qq-canoe-standards {
    display: none !important;
}

body.qqpw-next.template-homepage .qq-atoll-hero {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.88) 28%, rgba(255, 255, 255, 0.20) 58%, rgba(255, 255, 255, 0.02) 100%),
        url("../img/hero-hawaii-canoe-v5.jpg") center center / cover no-repeat !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.86) 46%, rgba(255, 255, 255, 0.20) 100%),
            url("../img/hero-hawaii-canoe-v4.jpg") 59% center / cover no-repeat !important;
    }
}

/* QQ.PW hero v23: final rule after every legacy hero override. */
body.qqpw-next.template-homepage .qq-atoll-hero {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.88) 27%, rgba(255, 255, 255, 0.22) 56%, rgba(255, 255, 255, 0.02) 100%),
        url("../img/qqpwhero.png") center center / cover no-repeat !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 82px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.91) 36%, rgba(255, 255, 255, 0.42) 70%, rgba(255, 255, 255, 0.24) 100%),
            url("../img/qqpwhero_tablet.png") center bottom / cover no-repeat !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 112px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.93) 40%, rgba(255, 255, 255, 0.50) 70%, rgba(255, 255, 255, 0.28) 100%),
            url("../img/qqpwhero_mobile.png") center bottom / cover no-repeat !important;
    }
}

/* QQ.PW hero v22: final artwork switch, placed after legacy overrides. */
body.qqpw-next.template-homepage .qq-atoll-hero {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.88) 27%, rgba(255, 255, 255, 0.22) 56%, rgba(255, 255, 255, 0.02) 100%),
        url("../img/qqpwhero.png") center center / cover no-repeat !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 82px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.91) 36%, rgba(255, 255, 255, 0.42) 70%, rgba(255, 255, 255, 0.24) 100%),
            url("../img/qqpwhero_tablet.png") center bottom / cover no-repeat !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 112px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.93) 40%, rgba(255, 255, 255, 0.50) 70%, rgba(255, 255, 255, 0.28) 100%),
            url("../img/qqpwhero_mobile.png") center bottom / cover no-repeat !important;
    }
}

/* QQ.PW hero v21: dedicated desktop, tablet, and mobile artwork. */
body.qqpw-next.template-homepage .qq-atoll-hero {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.88) 27%, rgba(255, 255, 255, 0.22) 56%, rgba(255, 255, 255, 0.02) 100%),
        url("../img/qqpwhero.png") center center / cover no-repeat !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 68px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.90) 38%, rgba(255, 255, 255, 0.34) 72%, rgba(255, 255, 255, 0.18) 100%),
            url("../img/qqpwhero_tablet.png") center bottom / cover no-repeat !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 76px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.92) 42%, rgba(255, 255, 255, 0.45) 74%, rgba(255, 255, 255, 0.24) 100%),
            url("../img/qqpwhero_mobile.png") center bottom / cover no-repeat !important;
    }
}

/* QQ.PW hero v20: user-supplied integrated 4T scene. */
body.qqpw-next.template-homepage .qq-atoll-hero {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.88) 28%, rgba(255, 255, 255, 0.20) 58%, rgba(255, 255, 255, 0.02) 100%),
        url("../img/qqpwhero.png") center center / cover no-repeat !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.86) 46%, rgba(255, 255, 255, 0.20) 100%),
            url("../img/hero-hawaii-canoe-v4.jpg") 59% center / cover no-repeat !important;
    }
}
/* QQ.PW hero v24: EOF final device artwork switch. */
body.qqpw-next.template-homepage .qq-atoll-hero {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.88) 27%, rgba(255, 255, 255, 0.22) 56%, rgba(255, 255, 255, 0.02) 100%),
        url("../img/qqpwhero.png") center center / cover no-repeat !important;
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 82px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.91) 36%, rgba(255, 255, 255, 0.42) 70%, rgba(255, 255, 255, 0.24) 100%),
            url("../img/qqpwhero_tablet.png") center bottom / cover no-repeat !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 112px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.93) 40%, rgba(255, 255, 255, 0.50) 70%, rgba(255, 255, 255, 0.28) 100%),
            url("../img/qqpwhero_mobile.png") center bottom / cover no-repeat !important;
    }
}
/* QQ.PW hero v25: give mobile/tablet artwork room below the call to action. */
@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 168px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.92) 34%, rgba(255, 255, 255, 0.48) 67%, rgba(255, 255, 255, 0.22) 100%),
            url("../img/qqpwhero_tablet.png") center bottom / cover no-repeat !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 188px !important;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.94) 39%, rgba(255, 255, 255, 0.56) 68%, rgba(255, 255, 255, 0.24) 100%),
            url("../img/qqpwhero_mobile.png") center bottom / cover no-repeat !important;
    }
}

/* QQ.PW hero v26: final device-specific artwork crop for supplied desktop/tablet/mobile images. */
@media (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 650px !important;
        background-image:
            linear-gradient(90deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.95) 30%, rgba(255, 255, 255, 0.52) 55%, rgba(255, 255, 255, 0.10) 78%, rgba(255, 255, 255, 0.02) 100%),
            url("../img/qqpwhero.png") !important;
        background-size: auto, auto 100% !important;
        background-position: 0 0, right center !important;
        background-repeat: no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        min-height: 510px !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy {
        max-width: 620px !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        max-width: 620px !important;
        font-size: clamp(52px, 4.4vw, 68px) !important;
        line-height: 1.045 !important;
    }

    body.qqpw-next.template-homepage .qq-hero-line {
        max-width: 535px !important;
        font-size: 20px !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 124px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.985) 42%, rgba(255, 255, 255, 0.80) 63%, rgba(255, 255, 255, 0.40) 100%),
            url("../img/qqpwhero_tablet.png") !important;
        background-size: auto, 100% auto !important;
        background-position: 0 0, center calc(100% + 140px) !important;
        background-repeat: no-repeat !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 136px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.985) 48%, rgba(255, 255, 255, 0.82) 68%, rgba(255, 255, 255, 0.43) 100%),
            url("../img/qqpwhero_mobile.png") !important;
        background-size: auto, 108% auto !important;
        background-position: 0 0, center calc(100% + 170px) !important;
        background-repeat: no-repeat !important;
    }
}

/* QQ.PW hero v27: desktop headline balance after real wide-screen review. */
@media (min-width: 992px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 640px !important;
        background-image:
            linear-gradient(90deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.95) 30%, rgba(255, 255, 255, 0.54) 57%, rgba(255, 255, 255, 0.12) 80%, rgba(255, 255, 255, 0.02) 100%),
            url("../img/qqpwhero.png") !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        min-height: 500px !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy {
        max-width: 720px !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        max-width: 720px !important;
        margin-top: 26px !important;
        font-size: clamp(52px, 3.95vw, 66px) !important;
        line-height: 1.045 !important;
    }

    body.qqpw-next.template-homepage .qq-hero-line {
        max-width: 610px !important;
        margin-top: 20px !important;
        font-size: 20px !important;
    }

    body.qqpw-next.template-homepage .qq-hero-actions {
        margin-top: 30px !important;
    }
}

/* QQ.PW hero v28: reveal the 4T signs more clearly on tablet and mobile. */
@media (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 150px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.985) 42%, rgba(255, 255, 255, 0.76) 61%, rgba(255, 255, 255, 0.30) 100%),
            url("../img/qqpwhero_tablet.png") !important;
        background-position: 0 0, center calc(100% + 95px) !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        padding-bottom: 160px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.985) 48%, rgba(255, 255, 255, 0.78) 66%, rgba(255, 255, 255, 0.32) 100%),
            url("../img/qqpwhero_mobile.png") !important;
        background-size: auto, 108% auto !important;
        background-position: 0 0, center calc(100% + 105px) !important;
    }
}

/* QQ.PW client credit display. */
.qq-credit-pill,
.qq-telegram-pill {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    color: #07314f;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(155, 232, 223, 0.46), rgba(244, 193, 93, 0.18));
    border: 1px solid rgba(7, 90, 153, 0.14);
    border-radius: 999px;
    padding: 5px 12px;
    text-decoration: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.qq-credit-pill i {
    color: #0f8f84;
}

.qq-telegram-pill {
    color: #ffffff;
    background: linear-gradient(135deg, #1da1f2, #0088cc 54%, #0f8f84);
    border-color: rgba(125, 214, 255, 0.36);
    box-shadow: 0 8px 18px rgba(0, 136, 204, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.qq-telegram-pill i,
.qq-telegram-pill span {
    color: #ffffff;
}

.qq-credit-pill span {
    color: #0b3b5c;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.qq-telegram-pill span {
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
}

.qq-credit-pill strong {
    color: #07314f;
    font-size: 13px;
    font-weight: 900;
    white-space: nowrap;
}

.qq-credit-pill:hover,
.qq-credit-pill:focus,
.qq-telegram-pill:hover,
.qq-telegram-pill:focus {
    color: #07314f;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(155, 232, 223, 0.58), rgba(244, 193, 93, 0.24));
    border-color: rgba(15, 143, 132, 0.34);
    text-decoration: none;
}

.qq-telegram-pill:hover,
.qq-telegram-pill:focus {
    color: #ffffff;
    background: linear-gradient(135deg, #35b7ff, #0088cc 58%, #0aa79a);
    border-color: rgba(125, 214, 255, 0.56);
}

.qq-client-home-v1 .qq-client-stat-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.qq-stat-balance::before,
.qq-stat-balance span {
    background: linear-gradient(135deg, #13b9aa, #0a87c6);
}

.qq-stat-balance span {
    display: none;
}

.qq-stat-balance {
    background:
        linear-gradient(150deg, rgba(19, 185, 170, 0.08), rgba(244, 193, 93, 0.10)),
        #ffffff;
}

.qq-stat-balance strong {
    font-size: clamp(18px, 1.6vw, 24px);
    line-height: 1.08;
    white-space: nowrap;
}

@media (max-width: 1199px) {
    .qq-client-home-v1 .qq-client-stat-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .qq-client-home-v1 .qq-client-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .qq-credit-pill,
    .qq-telegram-pill {
        max-width: 100%;
        justify-content: center;
    }

    .qq-credit-pill span {
        display: none;
    }

    .qq-client-home-v1 .qq-stat-balance {
        grid-column: 1 / -1;
        min-height: 92px;
    }
}

/* v9.7 top account bar: make balance, support, account, and switch controls one visual set. */
.qq-topbar .qq-active-client {
    gap: 7px;
    flex-wrap: wrap;
}

.qq-topbar .qq-alert-trigger,
.qq-topbar .qq-client-name,
.qq-topbar .qq-credit-pill,
.qq-topbar .qq-telegram-pill,
.qq-topbar .qq-icon-link,
.qq-topbar .qq-return-admin {
    min-height: 34px;
    border: 1px solid rgba(8, 127, 176, 0.16);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.66), 0 6px 14px rgba(7, 96, 115, 0.05);
    color: #07314f;
    line-height: 1;
}

.qq-topbar .qq-alert-trigger,
.qq-topbar .qq-client-name,
.qq-topbar .qq-credit-pill,
.qq-topbar .qq-telegram-pill,
.qq-topbar .qq-return-admin {
    padding: 5px 11px;
}

.qq-topbar .qq-icon-link {
    justify-content: center;
    width: 34px;
    padding: 0;
}

.qq-topbar .qq-client-name span {
    max-width: 210px;
}

.qq-topbar .qq-credit-pill {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.90), rgba(239, 252, 249, 0.78));
    border-color: rgba(15, 143, 132, 0.22);
}

.qq-topbar .qq-credit-pill span,
.qq-topbar .qq-telegram-pill span {
    font-size: 10.5px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.qq-topbar .qq-credit-pill strong {
    font-size: 12px;
    line-height: 1;
}

.qq-topbar .qq-telegram-pill {
    color: #ffffff;
    background: linear-gradient(135deg, #1ca9f2, #0088cc 54%, #0aa79a);
    border-color: rgba(0, 136, 204, 0.34);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), 0 8px 18px rgba(0, 136, 204, 0.18);
}

.qq-topbar .qq-telegram-pill i,
.qq-topbar .qq-telegram-pill span {
    color: #ffffff;
}

.qq-topbar .qq-alert-trigger:hover,
.qq-topbar .qq-alert-trigger:focus,
.qq-topbar .qq-client-name:hover,
.qq-topbar .qq-client-name:focus,
.qq-topbar .qq-credit-pill:hover,
.qq-topbar .qq-credit-pill:focus,
.qq-topbar .qq-icon-link:hover,
.qq-topbar .qq-icon-link:focus,
.qq-topbar .qq-return-admin:hover,
.qq-topbar .qq-return-admin:focus {
    color: #075f68;
    background: #ffffff;
    border-color: rgba(10, 167, 154, 0.32);
    text-decoration: none;
}

.qq-topbar .qq-telegram-pill:hover,
.qq-topbar .qq-telegram-pill:focus {
    color: #ffffff;
    background: linear-gradient(135deg, #35b7ff, #0088cc 58%, #0a9f92);
    border-color: rgba(0, 136, 204, 0.48);
    text-decoration: none;
}

/* v7.4 login page: use the new private Hawaii night artwork cleanly. */
body.qqpw-next.template-login {
    color: #f7fbf8;
    background: #061423;
}

body.qqpw-next.template-login .qq-header {
    color: #f7fbf8;
    background:
        linear-gradient(180deg, rgba(3, 10, 21, 0.82), rgba(5, 20, 35, 0.62)),
        url("../img/hawaii-private-night-wide-v6.png") center 44% / cover no-repeat;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.26);
}

body.qqpw-next.template-login .qq-navbar {
    background: rgba(3, 12, 24, 0.22);
}

body.qqpw-next.template-login .qq-brand .logo-img {
    filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.42));
}

body.qqpw-next.template-login .qq-search,
body.qqpw-next.template-login .qq-mobile-search,
body.qqpw-next.template-login .qq-cart-link,
body.qqpw-next.template-login .qq-menu-toggle {
    color: #fffaf0;
    background: rgba(4, 18, 32, 0.66);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(16px);
}

body.qqpw-next.template-login .qq-search input,
body.qqpw-next.template-login .qq-mobile-search input {
    color: #fffaf0;
}

body.qqpw-next.template-login .qq-search input::placeholder,
body.qqpw-next.template-login .qq-mobile-search input::placeholder {
    color: rgba(247, 251, 248, 0.66);
}

body.qqpw-next.template-login .qq-search-submit {
    color: #f2cf86;
}

body.qqpw-next.template-login .qq-mainnav {
    background: rgba(2, 9, 18, 0.52);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: none;
    backdrop-filter: blur(18px);
}

body.qqpw-next.template-login .qq-mainnav .navbar-nav > li > a,
body.qqpw-next.template-login .qq-mainnav .nav-link,
body.qqpw-next.template-login .qq-mainnav .dropdown-toggle {
    color: rgba(247, 251, 248, 0.90) !important;
}

body.qqpw-next.template-login .qq-mainnav .navbar-nav > li > a:hover,
body.qqpw-next.template-login .qq-mainnav .navbar-nav > li > a:focus,
body.qqpw-next.template-login .qq-mainnav .nav-link:hover,
body.qqpw-next.template-login .qq-mainnav .nav-link:focus,
body.qqpw-next.template-login .qq-mainnav .dropdown.show > .dropdown-toggle {
    color: #fffaf0 !important;
    background: rgba(242, 207, 134, 0.14) !important;
}

body.qqpw-next.template-login .qq-mainnav .dropdown-menu {
    background: rgba(7, 22, 37, 0.96) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.34) !important;
}

body.qqpw-next.template-login .qq-mainnav .dropdown-menu > li > a,
body.qqpw-next.template-login .qq-mainnav .dropdown-menu a,
body.qqpw-next.template-login .qq-mainnav .dropdown-item {
    color: rgba(247, 251, 248, 0.90) !important;
}

body.qqpw-next.template-login .qq-mainnav .dropdown-menu > li > a:hover,
body.qqpw-next.template-login .qq-mainnav .dropdown-menu a:hover,
body.qqpw-next.template-login .qq-mainnav .dropdown-item:hover {
    color: #fffaf0 !important;
    background: rgba(18, 117, 126, 0.24) !important;
}

body.qqpw-next.template-login .qq-breadcrumb,
body.qqpw-next.template-login .qq-page-heading {
    display: none !important;
}

body.qqpw-next.template-login .qq-main-body {
    position: relative;
    min-height: calc(100vh - 141px);
    padding: clamp(62px, 7vw, 96px) 0 clamp(74px, 8vw, 112px);
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(2, 8, 19, 0.82) 0%, rgba(2, 8, 19, 0.58) 31%, rgba(2, 8, 19, 0.22) 57%, rgba(2, 8, 19, 0.06) 100%),
        linear-gradient(180deg, rgba(2, 8, 19, 0.14), rgba(2, 8, 19, 0.36)),
        url("../img/hawaii-private-night-art-v6.png") center 28% / cover no-repeat;
}

body.qqpw-next.template-login .qq-main-body::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 74% 20%, rgba(242, 207, 134, 0.16), transparent 22rem),
        radial-gradient(circle at 18% 52%, rgba(9, 170, 168, 0.12), transparent 20rem),
        linear-gradient(180deg, rgba(3, 10, 21, 0.02), rgba(3, 10, 21, 0.22));
}

body.qqpw-next.template-login .logincontainer,
body.qqpw-next.template-login .login-form {
    width: 100%;
    max-width: 1180px !important;
}

body.qqpw-next.template-login .login-form {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: flex-start;
    margin: 0 auto;
    padding: 0 30px;
}

body.qqpw-next.template-login .login-form .card {
    display: block !important;
    width: min(456px, 100%);
    overflow: hidden;
    margin: 0 auto 0 0 !important;
    color: #f7fbf8;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.075)),
        rgba(6, 22, 38, 0.54);
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 14px;
    box-shadow:
        0 34px 90px rgba(0, 0, 0, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.20);
    backdrop-filter: blur(22px) saturate(132%);
}

body.qqpw-next.template-login .login-form .card::before {
    content: "";
    display: block !important;
    height: 4px;
    min-height: 0;
    background: linear-gradient(90deg, #0aa79a, #f2cf86 58%, rgba(255, 250, 240, 0.42));
}

body.qqpw-next.template-login .login-form .card::after {
    display: none !important;
}

body.qqpw-next.template-login .login-form .card-body {
    padding: 42px 40px 34px !important;
    color: rgba(247, 251, 248, 0.92);
}

body.qqpw-next.template-login .login-form h1,
body.qqpw-next.template-login .login-form h2,
body.qqpw-next.template-login .login-form h3,
body.qqpw-next.template-login .login-form h4,
body.qqpw-next.template-login .login-form h5,
body.qqpw-next.template-login .login-form h6,
body.qqpw-next.template-login .login-form .h1,
body.qqpw-next.template-login .login-form .h2,
body.qqpw-next.template-login .login-form .h3,
body.qqpw-next.template-login .login-form .h4,
body.qqpw-next.template-login .login-form .h5,
body.qqpw-next.template-login .login-form .h6 {
    color: #fffaf0;
    text-shadow: 0 12px 34px rgba(0, 0, 0, 0.26);
}

body.qqpw-next.template-login .login-form p,
body.qqpw-next.template-login .login-form label,
body.qqpw-next.template-login .login-form .small,
body.qqpw-next.template-login .login-form .text-muted {
    color: rgba(237, 247, 244, 0.80) !important;
}

body.qqpw-next.template-login .login-form label {
    color: rgba(247, 251, 248, 0.92) !important;
}

body.qqpw-next.template-login .login-form a,
body.qqpw-next.template-login .login-form a.text-muted,
body.qqpw-next.template-login .login-form .small.text-muted,
body.qqpw-next.template-login .login-form .card-footer a {
    color: #f4d28a !important;
}

body.qqpw-next.template-login .login-form .input-group {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 8px;
    background: rgba(255, 252, 244, 0.92);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
}

body.qqpw-next.template-login .login-form .form-control {
    min-height: 46px;
    color: #071928 !important;
    background: rgba(255, 252, 244, 0.92) !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.qqpw-next.template-login .login-form .form-control::placeholder {
    color: rgba(7, 25, 40, 0.52) !important;
    opacity: 1;
}

body.qqpw-next.template-login .login-form .input-group-text,
body.qqpw-next.template-login .login-form .input-group-addon {
    min-width: 46px;
    justify-content: center;
    color: #0a5f68 !important;
    background: rgba(255, 252, 244, 0.84) !important;
    border: 0 !important;
    border-right: 1px solid rgba(7, 25, 40, 0.12) !important;
}

body.qqpw-next.template-login .login-form .btn-primary,
body.qqpw-next.template-login .login-form button[type="submit"] {
    min-height: 44px;
    color: #061423 !important;
    background: linear-gradient(135deg, #f4d28a, #0fb5ac 58%, #087fb0) !important;
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.30);
}

body.qqpw-next.template-login .login-form .card-footer {
    padding: 18px 40px 28px !important;
    color: rgba(237, 247, 244, 0.82);
    background: rgba(3, 16, 29, 0.32);
    border-top: 1px solid rgba(255, 255, 255, 0.13);
}

body.qqpw-next.template-login .qq-footer {
    color: rgba(247, 251, 248, 0.86);
    background:
        linear-gradient(180deg, rgba(3, 12, 24, 0.92), rgba(4, 22, 36, 0.96)),
        url("../img/hawaii-private-night-wide-v6.png") center 58% / cover no-repeat;
    border-top: 1px solid rgba(242, 207, 134, 0.22);
}

body.qqpw-next.template-login .qq-footer::before {
    background: linear-gradient(90deg, #0aa79a, #f2cf86, rgba(255, 250, 240, 0.34));
}

body.qqpw-next.template-login .qq-footer-brand,
body.qqpw-next.template-login .qq-footer-brand:hover,
body.qqpw-next.template-login .qq-footer-nav strong,
body.qqpw-next.template-login .qq-footer-action-block strong {
    color: #fffaf0;
}

body.qqpw-next.template-login .qq-footer-brand-block p,
body.qqpw-next.template-login .qq-footer-copy,
body.qqpw-next.template-login .qq-footer-nav a,
body.qqpw-next.template-login .qq-footer-action-block a {
    color: rgba(221, 238, 235, 0.80);
}

body.qqpw-next.template-login .qq-footer-nav a:hover,
body.qqpw-next.template-login .qq-footer-action-block a:hover {
    color: #f2cf86;
}

body.qqpw-next.template-login .qq-footer-badges span,
body.qqpw-next.template-login .qq-footer-action-block .qq-footer-cta,
body.qqpw-next.template-login .qq-footer-action-block .qq-locale-btn {
    color: #fffaf0;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.18);
}

body.qqpw-next.template-login .qq-footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.12);
}

body.qqpw-next.template-login .qq-footer-shell {
    background:
        linear-gradient(135deg, rgba(5, 18, 32, 0.74), rgba(4, 24, 38, 0.54)),
        radial-gradient(circle at 90% 18%, rgba(242, 207, 134, 0.10), transparent 24%);
    border-color: rgba(255, 255, 255, 0.13);
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.26);
}

body.qqpw-next.template-login .qq-footer-linkbar a,
body.qqpw-next.template-login .qq-footer-linkbar .qq-locale-btn,
body.qqpw-next.template-login .qq-footer-badges span {
    color: rgba(247, 251, 248, 0.90);
    background: rgba(255, 255, 255, 0.10);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: none;
}

body.qqpw-next.template-login .qq-footer-linkbar a:hover,
body.qqpw-next.template-login .qq-footer-linkbar .qq-locale-btn:hover {
    color: #fffaf0;
    background: rgba(242, 207, 134, 0.14);
    border-color: rgba(242, 207, 134, 0.26);
}

body.qqpw-next.template-login .qq-footer-linkbar .qq-footer-cta {
    color: #061423 !important;
    background: linear-gradient(135deg, #f4d28a, #0fb5ac 58%, #087fb0) !important;
    border-color: transparent !important;
}

@media (max-width: 1199px) {
    body.qqpw-next.template-login .qq-mainnav .navbar-collapse {
        background: rgba(4, 16, 30, 0.94) !important;
        border-color: rgba(255, 255, 255, 0.14) !important;
    }
}

@media (max-width: 991px) {
    body.qqpw-next.template-login .qq-main-body {
        min-height: auto;
        padding: 48px 0 64px;
        background-position: 0 0, 0 0, 62% 32%;
    }

    body.qqpw-next.template-login .login-form {
        justify-content: center;
        padding: 0 22px;
    }

    body.qqpw-next.template-login .login-form .card {
        max-width: 540px !important;
        margin: 0 auto !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-login .qq-navbar-row {
        min-height: 76px;
    }

    body.qqpw-next.template-login .qq-main-body {
        padding: 34px 0 52px;
        background-position: 0 0, 0 0, 64% 34%;
    }

    body.qqpw-next.template-login .login-form {
        padding: 0 14px;
    }

    body.qqpw-next.template-login .login-form .card {
        border-radius: 12px;
    }

    body.qqpw-next.template-login .login-form .card-body {
        padding: 30px 26px 28px !important;
    }

    body.qqpw-next.template-login .login-form .card-footer {
        padding: 18px 26px 24px !important;
    }
}

/* QQ.PW v8.4: final homepage hero override at true file end. */
@media (min-width: 576px) and (max-width: 991px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 1020px !important;
        padding-bottom: 420px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.96) 33%, rgba(255, 255, 255, 0.54) 53%, rgba(255, 255, 255, 0.12) 100%),
            url("../img/qqpwhero_tablet.png") !important;
        background-size: auto, 100% auto !important;
        background-position: 0 0, center calc(100% + 116px) !important;
        background-repeat: no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        min-height: 0 !important;
        padding-top: 88px !important;
        padding-bottom: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy {
        max-width: 660px !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        max-width: 660px !important;
        font-size: clamp(42px, 5.55vw, 56px) !important;
        line-height: 1.07 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        max-width: 615px !important;
    }
}

@media (max-width: 575px) {
    body.qqpw-next.template-homepage .qq-atoll-hero {
        min-height: 870px !important;
        padding-bottom: 315px !important;
        background-image:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.95) 37%, rgba(255, 255, 255, 0.48) 61%, rgba(255, 255, 255, 0.10) 100%),
            url("../img/qqpwhero_mobile.png") !important;
        background-size: auto, 100% auto !important;
        background-position: 0 0, center bottom !important;
        background-repeat: no-repeat !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-shell {
        min-height: 0 !important;
        padding-top: 54px !important;
        padding-bottom: 0 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy h1 {
        font-size: clamp(40px, 11.4vw, 50px) !important;
        line-height: 1.09 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-line {
        max-width: 100% !important;
        line-height: 1.46 !important;
    }

    body.qqpw-next.template-homepage .qq-atoll-copy .qq-hero-actions {
        margin-top: 22px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product footer {
        width: calc(100% - 36px) !important;
        gap: 8px !important;
        margin: 0 18px 16px !important;
        box-sizing: border-box !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product div.product-pricing {
        width: 100% !important;
        min-height: 76px !important;
        padding: 10px 12px !important;
        border-radius: 10px !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product div.product-pricing .price {
        font-size: 23px !important;
        line-height: 1.04 !important;
    }

    body.qqpw-next.is-shopping-cart #order-standard_cart .products .product .btn-order-now {
        width: 100% !important;
        min-height: 40px !important;
        padding: 8px 12px !important;
    }
}

/* Product group tagline links from WHMCS admin fields. */
.qq-product-tagline a,
.header-lined p a {
    color: #007f7a;
    font-weight: 800;
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 160, 155, 0.35);
}

.qq-product-tagline a:hover,
.header-lined p a:hover {
    color: #005f71;
    border-bottom-color: rgba(0, 95, 113, 0.75);
}

/* v9.5 compact traffic status: one dense card, no infrastructure wording. */
body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini.is-speed-limited {
    border-color: rgba(201, 130, 43, 0.28) !important;
    background:
        linear-gradient(135deg, rgba(255, 248, 232, 0.92), rgba(239, 252, 249, 0.70)),
        radial-gradient(circle at 88% 18%, rgba(223, 91, 70, 0.13), transparent 42%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini.is-speed-limited .qq-service-bandwidth-ring {
    background: conic-gradient(#c9822b 0 var(--qq-bandwidth-pct), rgba(201, 130, 43, 0.14) var(--qq-bandwidth-pct) 100%) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
    grid-template-columns: minmax(220px, 0.88fr) minmax(255px, 1fr) !important;
    align-items: stretch !important;
    gap: 10px !important;
    padding: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-usage {
    display: grid !important;
    grid-template-columns: 96px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
    padding: 8px 9px 8px 7px !important;
    border: 1px solid rgba(8, 127, 176, 0.10) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.54) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini .qq-service-bandwidth-ring {
    align-self: center !important;
    justify-self: center !important;
    width: 92px !important;
    height: 92px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini .qq-service-bandwidth-ring::after {
    inset: 14px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini .qq-service-bandwidth-ring span {
    font-size: 18px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-main {
    align-self: center !important;
    min-width: 0 !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-main strong {
    font-size: 18.5px !important;
    margin: 1px 0 !important;
    white-space: nowrap !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-main small {
    font-size: 10px !important;
    line-height: 1.2 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats {
    grid-column: auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    align-self: stretch !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats > div {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-height: 48px !important;
    padding: 7px 9px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats > div:nth-child(3) {
    grid-column: 1 / -1 !important;
    min-height: 64px !important;
    padding: 7px 10px 8px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(239, 252, 249, 0.72)),
        linear-gradient(90deg, rgba(8, 127, 176, 0.08), rgba(201, 130, 43, 0.08)) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats strong {
    font-size: 12px !important;
    line-height: 1.18 !important;
    margin-top: 2px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini.is-speed-limited .qq-service-bandwidth-mini-stats strong {
    color: #8a4c13 !important;
}

body.qqpw-next.template-clientareaproductdetails [data-qq-network-rate] {
    font-size: 13px !important;
    line-height: 1.12 !important;
    margin-top: 2px !important;
    white-space: nowrap !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats .qq-speed-policy {
    display: block !important;
    color: #6c7d86 !important;
    border-top: 1px solid rgba(8, 127, 176, 0.12) !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    line-height: 1.14 !important;
    margin-top: 5px !important;
    padding-top: 5px !important;
    text-transform: none !important;
    white-space: nowrap !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini.is-speed-limited .qq-service-bandwidth-mini-stats .qq-speed-policy {
    color: #8a4c13 !important;
    border-top-color: rgba(201, 130, 43, 0.22) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats small {
    display: block !important;
    color: #5b7280 !important;
    font-size: 10.5px !important;
    line-height: 1.22 !important;
    margin-top: 3px !important;
}

@media (max-width: 1199px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
        grid-template-columns: minmax(205px, 0.84fr) minmax(238px, 1fr) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-usage {
        grid-template-columns: 84px minmax(0, 1fr) !important;
        gap: 9px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats {
        grid-column: auto !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini .qq-service-bandwidth-ring {
        width: 82px !important;
        height: 82px !important;
    }

    body.qqpw-next.template-clientareaproductdetails [data-qq-network-rate] {
        font-size: 12.2px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats .qq-speed-policy {
        font-size: 10px !important;
    }
}

/* v9.9 topbar and NAT notice alignment polish. */
body.qqpw-next .qq-topbar {
    background: rgba(255, 248, 232, 0.94) !important;
    border-bottom-color: rgba(228, 154, 47, 0.18) !important;
}

body.qqpw-next .qq-topbar-grid {
    min-height: 42px !important;
    gap: 10px !important;
}

body.qqpw-next .qq-topbar .qq-active-client {
    gap: 8px !important;
    flex-wrap: wrap !important;
}

body.qqpw-next .qq-topbar .qq-alert-trigger,
body.qqpw-next .qq-topbar .qq-active-client > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 34px !important;
    height: 34px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(8, 127, 176, 0.16) !important;
    border-radius: 999px !important;
    color: #0b5260 !important;
    background: rgba(255, 255, 255, 0.86) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78), 0 5px 14px rgba(7, 96, 115, 0.05) !important;
    font-size: 13px !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

body.qqpw-next .qq-topbar .qq-credit-pill {
    padding: 0 13px !important;
    gap: 7px !important;
}

body.qqpw-next .qq-topbar .qq-telegram-pill {
    background: rgba(255, 255, 255, 0.86) !important;
    border-color: rgba(8, 127, 176, 0.16) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78), 0 5px 14px rgba(7, 96, 115, 0.05) !important;
}

body.qqpw-next .qq-topbar .qq-icon-link {
    width: 34px !important;
    min-width: 34px !important;
    padding: 0 !important;
}

body.qqpw-next .qq-topbar .qq-alert-trigger i,
body.qqpw-next .qq-topbar .qq-client-name i,
body.qqpw-next .qq-topbar .qq-credit-pill i,
body.qqpw-next .qq-topbar .qq-telegram-pill i,
body.qqpw-next .qq-topbar .qq-icon-link i,
body.qqpw-next .qq-topbar .qq-return-admin i {
    flex: 0 0 auto !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

body.qqpw-next .qq-topbar .qq-alert-trigger i,
body.qqpw-next .qq-topbar .qq-client-name i,
body.qqpw-next .qq-topbar .qq-credit-pill i,
body.qqpw-next .qq-topbar .qq-icon-link i,
body.qqpw-next .qq-topbar .qq-return-admin i {
    color: #0a8c82 !important;
}

body.qqpw-next .qq-topbar .qq-telegram-pill i {
    color: #0088cc !important;
}

body.qqpw-next .qq-topbar .qq-client-name span,
body.qqpw-next .qq-topbar .qq-alert-trigger span,
body.qqpw-next .qq-topbar .qq-telegram-pill span {
    color: #0b5260 !important;
    font-size: 13px !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
    line-height: 1 !important;
    text-transform: none !important;
    white-space: nowrap !important;
}

body.qqpw-next .qq-topbar .qq-client-name span {
    max-width: 190px !important;
}

body.qqpw-next .qq-topbar .qq-credit-pill span {
    color: #52707c !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: 0.035em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

body.qqpw-next .qq-topbar .qq-credit-pill strong {
    color: #07314f !important;
    font-size: 12.5px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

body.qqpw-next .qq-topbar .qq-alert-trigger:hover,
body.qqpw-next .qq-topbar .qq-alert-trigger:focus,
body.qqpw-next .qq-topbar .qq-active-client > a:hover,
body.qqpw-next .qq-topbar .qq-active-client > a:focus {
    color: #07314f !important;
    background: #ffffff !important;
    border-color: rgba(10, 167, 154, 0.32) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 7px 18px rgba(7, 96, 115, 0.08) !important;
    text-decoration: none !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head {
    grid-template-columns: 42px minmax(0, 1fr) auto !important;
    column-gap: 10px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-advisory-link-head {
    justify-self: end !important;
    align-self: center !important;
    min-height: 30px !important;
    margin-top: 0 !important;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.82) !important;
    font-size: 10.5px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-advisory-link-head span {
    max-width: 190px !important;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-nat-connect-head {
        grid-template-columns: 42px minmax(0, 1fr) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-nat-advisory-link-head {
        grid-column: 1 / -1 !important;
        justify-self: stretch !important;
        justify-content: center !important;
        margin-top: 2px !important;
    }
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-usage {
        grid-template-columns: 72px minmax(0, 1fr) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats {
        grid-column: 1 / -1 !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.qqpw-next.template-clientareaproductdetails [data-qq-network-rate] {
        white-space: normal !important;
    }
}

@media (max-width: 420px) {
    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini {
        grid-template-columns: 1fr !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-usage {
        grid-template-columns: 58px minmax(0, 1fr) !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini .qq-service-bandwidth-ring {
        width: 56px !important;
        height: 56px !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-service-bandwidth-mini-stats {
        grid-template-columns: 1fr !important;
    }
}

/* v9.6 VM customer notices: compact KB links without changing the console layout. */
body.qqpw-next.template-clientareaproductdetails .qq-nat-advisory-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 7px 10px !important;
    color: #075f68 !important;
    border: 1px solid rgba(8, 127, 176, 0.13) !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, 0.70) !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-advisory-link i {
    flex: 0 0 auto !important;
    margin-right: 6px !important;
    font-size: 12px !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-advisory-link span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-nat-advisory-link:hover,
body.qqpw-next.template-clientareaproductdetails .qq-nat-advisory-link:focus {
    color: #07314f !important;
    border-color: rgba(10, 167, 154, 0.32) !important;
    background: rgba(255, 255, 255, 0.92) !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-info-inline-help {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    max-width: 100% !important;
    margin-left: 8px !important;
    padding: 3px 7px !important;
    color: #075f68 !important;
    border: 1px solid rgba(8, 127, 176, 0.12) !important;
    border-radius: 999px !important;
    background: rgba(239, 252, 249, 0.86) !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    line-height: 1.1 !important;
    text-decoration: none !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

body.qqpw-next.template-clientareaproductdetails .qq-info-inline-help:hover,
body.qqpw-next.template-clientareaproductdetails .qq-info-inline-help:focus {
    color: #07314f !important;
    border-color: rgba(10, 167, 154, 0.30) !important;
    background: rgba(255, 255, 255, 0.94) !important;
}

@media (max-width: 767px) {
    body.qqpw-next.template-clientareaproductdetails .qq-nat-advisory-link {
        justify-content: flex-start !important;
        white-space: normal !important;
    }

    body.qqpw-next.template-clientareaproductdetails .qq-info-inline-help {
        margin: 5px 0 0 !important;
    }
}