/*
Theme Name: MonitorSuggest Custom
Theme URI: https://monitorsuggest.com
Author: MonitorSuggest
Author URI: https://monitorsuggest.com
Description: A custom WordPress theme for MonitorSuggest.
Version: 50.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: monitorsuggest-custom
Tags: custom
*/

/* =============================================================
   DESIGN TOKENS
   ============================================================= */
:root {
    /* Colours */
    --color-bg-base: #f6f4ef;
    --color-bg-header: rgba(255, 253, 248, 0.94);
    --color-bg-card: #fffdf8;
    --color-bg-card-hover: #ffffff;
    --color-border: rgba(20, 45, 50, 0.12);
    --color-border-hover: rgba(15, 118, 110, 0.32);

    --color-text-primary: #102027;
    --color-text-secondary: #334155;
    --color-text-muted: #5b6870;

    --color-accent: #ff5a45;
    --color-accent-dark: #0f766e;
    --color-accent-glow: rgba(255, 107, 74, 0.18);

    --color-neon-blue: #2563eb;
    --color-neon-pink: #d94686;

    /* Gradients */
    --gradient-accent: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%);
    --gradient-hero: linear-gradient(110deg, #0b6b60 0%, #0f766e 48%, #13a79a 100%);

    /* Typography */
    --font-sans: 'Inter', system-ui, -apple-system, sans-serif;

    /* Spacing */
    --nav-height: 72px;
    --container-max: 1500px;
    --container-pad: 24px;

    /* Radius */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-pill: 999px;

    /* Shadows */
    --shadow-header: 0 1px 0 rgba(255, 255, 255, 0.04), 0 4px 24px rgba(16, 35, 45, .10);
    --shadow-glow: 0 0 20px rgba(168, 85, 247, 0.35);

    /* Transitions */
    --transition-fast: 140ms ease;
    --transition-base: 220ms ease;
}

/* =============================================================
   GLOBAL RESET & BASE
   ============================================================= */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: var(--font-sans);
    background-color: var(--color-bg-base);
    color: var(--color-text-primary);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
}

a {
    color: inherit;
    text-decoration: none;
}

ul,
ol {
    list-style: none;
}

img,
svg {
    display: block;
    max-width: 100%;
}

button {
    font-family: inherit;
    cursor: pointer;
    border: none;
    background: none;
}

/* Page offset for fixed header */
.ms-page-content {
    padding-top: var(--nav-height);
}

/* =============================================================
   HEADER / PRIMARY NAVIGATION - CLEAN FINAL VERSION
   ============================================================= */
.ms-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--nav-height);
    background: var(--color-bg-header);
    border-bottom: 1px solid var(--color-border);
    box-shadow: var(--shadow-header);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    overflow: visible;
}

.ms-header.is-scrolled {
    background: rgba(13, 13, 20, 0.96);
    border-bottom-color: rgba(168, 85, 247, 0.12);
}

.ms-nav-container {
    display: flex;
    align-items: center;
    height: 100%;
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--container-pad);
    min-width: 0;
}

/* ---- LOGO ---- */
.ms-logo {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
    margin-right: 32px;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity var(--transition-fast);
}

.ms-logo:hover {
    opacity: 0.88;
}

.ms-logo-icon {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}

.ms-logo-text {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.2px;
    color: var(--color-text-primary);
    white-space: nowrap;
    line-height: 1;
}

/* ---- PRIMARY NAV LIST (Direct Child Selectors fix the stretching) ---- */
.ms-primary-nav {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: visible;
}

.ms-primary-nav>.ms-nav-list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    list-style: none;
    margin: 0;
    padding: 0;
    width: auto;
    max-width: 100%;
}

.ms-primary-nav>.ms-nav-list>.menu-item {
    position: relative;
    flex: 0 0 auto;
    list-style: none;
}

.ms-primary-nav>.ms-nav-list>.menu-item>a {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 0;
    color: var(--color-text-secondary);
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s ease;
}

.ms-primary-nav>.ms-nav-list>.menu-item>a:hover,
.ms-primary-nav>.ms-nav-list>.current-menu-item>a {
    color: var(--color-text-primary);
}

/* Dropdown Arrow (Desktop) */
.ms-primary-nav>.ms-nav-list>.menu-item-has-children>a::after {
    content: "";
    width: 6px;
    height: 6px;
    border-right: 1.5px solid var(--color-accent);
    border-bottom: 1.5px solid var(--color-accent);
    transform: rotate(45deg) translateY(-2px);
    opacity: 0.8;
    margin-left: 6px;
    transition: transform 0.2s ease;
    display: inline-block;
}

.ms-primary-nav>.ms-nav-list>.menu-item-has-children:hover>a::after {
    transform: rotate(225deg) translateY(-1px);
}

/* ---- DROPDOWN PANEL ---- */
.ms-primary-nav>.ms-nav-list>.menu-item-has-children>.sub-menu {
    position: absolute;
    top: calc(100% + 5px);
    left: 50%;
    z-index: 99999;
    display: none;
    /* Hide by default */
    min-width: 240px;
    margin: 0;
    padding: 8px;
    list-style: none;
    background: #fffdf8;
    border: 1px solid rgba(168, 85, 247, 0.28);
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(16, 35, 45, 0.10);
    transform: translateX(-50%);
}

/* Show Dropdown on Hover */
@media (min-width: 1025px) {
    .ms-primary-nav>.ms-nav-list>.menu-item-has-children:hover>.sub-menu {
        display: block;
        animation: dropFadeIn 0.2s ease forwards;
    }
}

/* Dropdown Links */
.ms-primary-nav .sub-menu>.menu-item {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}

.ms-primary-nav .sub-menu>.menu-item>a {
    display: block;
    width: 100%;
    padding: 12px 16px;
    color: #334155;
    font-size: 13.5px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    transition: background-color 0.2s ease, color 0.2s ease, padding-left 0.2s ease;
}

.ms-primary-nav .sub-menu>.menu-item:last-child>a {
    border-bottom: none;
}

.ms-primary-nav .sub-menu>.menu-item>a:hover {
    color: #102027;
    background: rgba(168, 85, 247, 0.12);
    padding-left: 22px;
    /* Smooth slide effect */
}

/* Hide arrow on sub-menu items if any */
.ms-primary-nav .sub-menu>.menu-item-has-children>a::after {
    display: none;
}

/* ---- RIGHT SIDE ACTIONS ---- */
.ms-nav-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    margin-left: 32px;
}

.ms-icon-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: var(--radius-sm);
    color: var(--color-text-muted);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: color var(--transition-fast), background var(--transition-fast);
}

.ms-icon-btn:hover {
    color: var(--color-text-primary);
    background: rgba(20,45,50,.10);
}

.ms-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 16px;
    font-size: 13px;
    font-weight: 600;
    border-radius: var(--radius-sm);
    text-decoration: none;
    transition: background var(--transition-fast), border-color var(--transition-fast), opacity var(--transition-fast);
}

.ms-btn-outline {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: var(--color-text-secondary);
}

.ms-btn-outline:hover {
    border-color: rgba(255, 255, 255, 0.35);
    color: var(--color-text-primary);
    background: rgba(255, 255, 255, 0.05);
}

/* ---- MOBILE MENU & HAMBURGER ---- */
.ms-hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 34px;
    height: 34px;
    padding: 6px 5px;
    border-radius: var(--radius-sm);
    color: var(--color-text-muted);
    background: transparent;
    border: none;
    cursor: pointer;
}

.ms-hamburger-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    transition: transform var(--transition-base), opacity var(--transition-base);
}

.ms-hamburger.is-open .ms-hamburger-bar:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.ms-hamburger.is-open .ms-hamburger-bar:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
}

.ms-hamburger.is-open .ms-hamburger-bar:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.ms-mobile-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, .86);
    z-index: 999;
    backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity var(--transition-base);
}

.ms-mobile-overlay.is-visible {
    opacity: 1;
}

@media (max-width: 1024px) {
    .ms-nav-container {
        justify-content: space-between;
    }

    .ms-logo {
        margin-right: 0;
    }

    .ms-primary-nav {
        position: fixed;
        top: var(--nav-height);
        right: -300px;
        bottom: 0;
        width: 300px;
        background: #fffdf8;
        border-left: 1px solid var(--color-border);
        flex-direction: column;
        align-items: flex-start;
        padding: 24px 20px;
        z-index: 1001;
        transition: right 0.3s ease;
        overflow-y: auto;
    }

    .ms-primary-nav.is-open {
        right: 0;
    }

    .ms-primary-nav>.ms-nav-list {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        width: 100%;
    }

    .ms-primary-nav>.ms-nav-list>.menu-item {
        width: 100%;
    }

    .ms-primary-nav>.ms-nav-list>.menu-item>a {
        justify-content: space-between;
        padding: 15px 10px;
        font-size: 16px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    }

    /* Mobile Dropdown */
    .ms-primary-nav>.ms-nav-list>.menu-item-has-children>.sub-menu {
        position: static;
        display: none;
        width: 100%;
        margin: 5px 0 10px 0;
        padding: 5px 0 5px 15px;
        background: transparent;
        border: 0;
        border-left: 2px solid var(--color-accent);
        border-radius: 0;
        box-shadow: none;
        transform: none;
    }

    .ms-primary-nav>.ms-nav-list>.menu-item-has-children.mobile-dropdown-open>.sub-menu {
        display: block;
    }

    .ms-primary-nav>.ms-nav-list>.menu-item-has-children.mobile-dropdown-open>a::after {
        transform: rotate(225deg) translateY(-1px);
    }

    .ms-primary-nav .sub-menu>.menu-item>a {
        padding: 10px;
        font-size: 14px;
        border-bottom: none;
        color: var(--text-muted);
    }

    .ms-hamburger {
        display: flex;
    }

    .ms-mobile-overlay {
        display: block;
    }

    .ms-btn-outline {
        display: none;
    }
}


/* =============================================================
   HERO SECTION
   ============================================================= */
.ms-hero {
    position: relative;
    overflow: hidden;
    padding: 80px 0 60px;
    background:
        radial-gradient(ellipse 60% 50% at 70% 40%, rgba(124, 58, 237, 0.18) 0%, transparent 70%),
        radial-gradient(ellipse 40% 60% at 80% 10%, rgba(168, 85, 247, 0.10) 0%, transparent 60%),
        var(--color-bg-base);
}

.ms-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(168, 85, 247, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(168, 85, 247, 0.04) 1px, transparent 1px);
    background-size: 48px 48px;
    pointer-events: none;
}

.ms-container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--container-pad);
}

.ms-hero-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 48px;
    position: relative;
    z-index: 1;
}

.ms-hero-copy {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.ms-hero-heading {
    font-size: clamp(36px, 5vw, 56px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -1.5px;
    color: var(--color-text-primary);
}

.ms-hero-heading-accent {
    background: var(--gradient-hero);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.ms-hero-subtext {
    font-size: 15px;
    line-height: 1.7;
    color: var(--color-text-secondary);
    max-width: 440px;
}

.ms-hero-ctas {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.ms-btn-lg {
    padding: 11px 22px;
    font-size: 14px;
    gap: 8px;
}

.ms-hero-stats {
    display: flex;
    gap: 28px;
    flex-wrap: wrap;
    padding-top: 8px;
    border-top: 1px solid var(--color-border);
}

.ms-hero-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ms-hero-stat-value {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-text-primary);
    letter-spacing: -0.5px;
}

.ms-hero-stat-label {
    font-size: 11px;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.ms-hero-visual {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.ms-hero-monitor-wrap {
    position: relative;
    width: 100%;
    max-width: 500px;
}

.ms-hero-glow-orb {
    position: absolute;
    top: 20%;
    left: 50%;
    transform: translateX(-50%);
    width: 320px;
    height: 200px;
    background: radial-gradient(ellipse, rgba(124, 58, 237, 0.35) 0%, transparent 70%);
    filter: blur(40px);
    pointer-events: none;
    z-index: 0;
}

.ms-hero-monitor-svg {
    position: relative;
    z-index: 1;
    width: 100%;
    filter: drop-shadow(0 0 40px rgba(124, 58, 237, 0.4));
    animation: ms-float 5s ease-in-out infinite;
}

@keyframes ms-float {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

/* =============================================================
   FILTER SECTION
   ============================================================= */
.ms-filter-section {
    padding: 0 0 64px;
    position: relative;
    z-index: 2;
}

.ms-filter-card {
    background: rgba(16, 16, 26, 0.82);
    backdrop-filter: blur(24px);
    border: 1px solid rgba(168, 85, 247, 0.22);
    border-radius: var(--radius-lg);
    box-shadow: 0 0 0 1px rgba(168, 85, 247, 0.06), 0 0 60px rgba(124, 58, 237, 0.12), 0 24px 64px rgba(16, 35, 45, .10);
    padding: 28px 32px 20px;
    position: relative;
    overflow: hidden;
}

.ms-filter-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 10%;
    right: 10%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(168, 85, 247, 0.5) 40%, rgba(232, 121, 249, 0.4) 60%, transparent);
    pointer-events: none;
}

.ms-filter-header {
    display: flex;
    gap: 28px;
    align-items: flex-start;
}

.ms-filter-title-block {
    flex-shrink: 0;
    width: 168px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 2px;
}

.ms-filter-eyebrow {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-accent);
}

.ms-filter-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.4px;
    color: var(--color-text-primary);
    margin: 0;
}

.ms-filter-desc {
    font-size: 11.5px;
    line-height: 1.55;
    color: var(--color-text-muted);
    margin-top: 2px;
}

.ms-filter-divider {
    width: 1px;
    align-self: stretch;
    background: var(--color-border);
    flex-shrink: 0;
    margin: 0 4px;
}

.ms-filter-grid {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px 12px;
    align-items: end;
}

.ms-filter-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.ms-filter-field--action {
    justify-content: flex-end;
}

.ms-filter-label {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--color-text-muted);
    text-transform: uppercase;
    cursor: default;
    user-select: none;
}

.ms-filter-label svg {
    color: var(--color-accent);
    flex-shrink: 0;
}

.ms-filter-select-wrap {
    position: relative;
}

.ms-filter-select {
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: var(--radius-sm);
    color: var(--color-text-secondary);
    font-family: var(--font-sans);
    font-size: 12.5px;
    font-weight: 500;
    padding: 7px 30px 7px 10px;
    cursor: pointer;
    outline: none;
    transition: border-color var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast), color var(--transition-fast);
    background-image: none;
    line-height: 1.4;
}

.ms-filter-select option {
    background: #f4f7f4;
    color: var(--color-text-secondary);
    font-size: 13px;
}

.ms-filter-select:hover {
    border-color: rgba(168, 85, 247, 0.35);
    background: rgba(168, 85, 247, 0.06);
    color: var(--color-text-primary);
}

.ms-filter-select:focus {
    border-color: rgba(168, 85, 247, 0.6);
    background: rgba(168, 85, 247, 0.08);
    color: var(--color-text-primary);
    box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.12);
}

.ms-filter-select.is-active {
    border-color: rgba(168, 85, 247, 0.5);
    color: var(--color-accent);
}

.ms-filter-chevron {
    position: absolute;
    right: 9px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-text-muted);
    pointer-events: none;
    flex-shrink: 0;
    transition: transform var(--transition-fast), color var(--transition-fast);
}

.ms-filter-select:focus~.ms-filter-chevron,
.ms-filter-select:hover~.ms-filter-chevron {
    color: var(--color-accent);
}

.ms-filter-submit {
    width: 100%;
    justify-content: center;
    gap: 7px;
    padding: 8px 14px;
    font-size: 13px;
    white-space: nowrap;
}

.ms-filter-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 14px;
    margin-top: 14px;
    border-top: 1px solid var(--color-border);
}

.ms-filter-reset {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    color: var(--color-text-muted);
    font-family: var(--font-sans);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    padding: 4px 0;
    border-radius: var(--radius-sm);
    transition: color var(--transition-fast);
}

.ms-filter-reset:hover {
    color: var(--color-text-secondary);
}

.ms-filter-reset svg {
    flex-shrink: 0;
    transition: transform var(--transition-base);
}

.ms-filter-reset:hover svg {
    transform: rotate(-45deg);
}

.ms-filter-hint {
    font-size: 11.5px;
    color: var(--color-text-muted);
    font-style: italic;
}

@media (max-width: 1100px) {
    .ms-filter-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 900px) {
    .ms-filter-header {
        flex-direction: column;
        gap: 20px;
    }

    .ms-filter-title-block {
        width: 100%;
        flex-direction: row;
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 12px;
    }

    .ms-filter-divider {
        display: none;
    }

    .ms-filter-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}


@media (max-width: 640px) {
    .ms-filter-card {
        padding: 20px 18px 16px;
    }

    .ms-filter-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .ms-filter-field--action {
        grid-column: 1 / -1;
    }

    .ms-hero-inner {
        grid-template-columns: 1fr;
    }

    .ms-hero-visual {
        display: none;
    }

    .ms-filter-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
}

/* =============================================================
   SHARED SECTION UTILITIES
   ============================================================= */
.ms-section {
    padding: 56px 0;
}

.ms-section-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 28px;
}

.ms-section-title {
    font-size: clamp(18px, 2.5vw, 22px);
    font-weight: 700;
    letter-spacing: -0.4px;
    color: var(--color-text-primary);
    margin: 0;
}

.ms-section-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    font-weight: 500;
    color: var(--color-accent);
    text-decoration: none;
    white-space: nowrap;
    transition: gap var(--transition-fast), opacity var(--transition-fast);
}

.ms-section-link:hover {
    gap: 9px;
    opacity: 0.85;
}

/* =============================================================
   SHOP BY CATEGORY
   ============================================================= */
.ms-shopcat-section {
    padding: 70px 0 90px;
}

.ms-shopcat-grid {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 15px;
    list-style: none;
    margin: 40px 0 0;
    padding: 0;
}

.ms-shopcat-card {
    min-width: 0;
}

.ms-shopcat-inner {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px 14px 16px;
    border-radius: 10px;
    height: 100%;
    background: #f6f4ef;
    border: 1px solid rgba(139, 92, 246, 0.14);
    color: var(--color-text-primary);
    text-decoration: none;
    transition: border-color .22s ease, box-shadow .22s ease, background .22s ease, transform .22s ease;
}

.ms-shopcat-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: 14px;
    color: var(--sc-icon, #a78bfa);
    flex-shrink: 0;
}

.ms-shopcat-icon svg {
    width: 100%;
    height: 100%;
}

.ms-shopcat-name {
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.25;
    margin-bottom: 6px;
}

.ms-shopcat-sub {
    font-size: 11.5px;
    color: rgba(180, 180, 200, 0.7);
    line-height: 1.5;
    margin-bottom: 8px;
    flex-grow: 1;
}

.ms-shopcat-count {
    font-size: 11px;
    font-weight: 500;
    color: rgba(160, 160, 185, 0.5);
    letter-spacing: .03em;
    margin-bottom: 10px;
}

.ms-shopcat-arrow {
    display: flex;
    align-items: center;
    color: rgba(139, 92, 246, 0.5);
    transition: color .2s ease, transform .2s ease;
}

.ms-shopcat-arrow svg {
    width: 13px;
    height: 13px;
}

.ms-shopcat-inner:hover,
.ms-shopcat-inner:focus-visible {
    background: #110f1d;
    border-color: rgba(139, 92, 246, 0.55);
    box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.18), 0 8px 28px rgba(16, 35, 45, .10), 0 0 18px rgba(139, 92, 246, 0.14);
    transform: translateY(-2px);
}

.ms-shopcat-inner:hover .ms-shopcat-arrow,
.ms-shopcat-inner:focus-visible .ms-shopcat-arrow {
    color: var(--sc-icon, #a78bfa);
    transform: translateX(3px);
}

@media (max-width: 1200px) {
    .ms-shopcat-inner {
        padding: 16px 11px 14px;
    }

    .ms-shopcat-name {
        font-size: 13px;
    }

    .ms-shopcat-sub {
        font-size: 11px;
    }
}

@media (max-width: 900px) {
    .ms-shopcat-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
    }

    .ms-shopcat-section {
        padding: 55px 0 70px;
    }
}

@media (max-width: 560px) {
    .ms-shopcat-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .ms-shopcat-inner {
        padding: 16px 12px 14px;
    }

    .ms-shopcat-icon {
        width: 34px;
        height: 34px;
        margin-bottom: 10px;
    }

    .ms-shopcat-section {
        padding: 45px 0 55px;
    }
}

/* Current section highlight for primary navigation. */
.ms-primary-nav > .ms-nav-list > .menu-item > a,
#ms-primary-nav .ms-nav-link {
    position: relative !important;
    border-radius: 999px !important;
}

.ms-primary-nav > .ms-nav-list > .ms-nav-active > a,
.ms-primary-nav > .ms-nav-list > .current-menu-item > a,
.ms-primary-nav > .ms-nav-list > .current-menu-parent > a,
.ms-primary-nav > .ms-nav-list > .current-menu-ancestor > a,
#ms-primary-nav .ms-nav-active > .ms-nav-link,
#ms-primary-nav .current-menu-item > .ms-nav-link,
#ms-primary-nav a[aria-current="page"] {
    color: #0f766e !important;
    background: linear-gradient(135deg, rgba(15, 118, 110, .10), rgba(255, 100, 72, .10)) !important;
    box-shadow: inset 0 0 0 1px rgba(15, 118, 110, .14), 0 10px 24px rgba(16, 35, 45, .08) !important;
}

.ms-primary-nav > .ms-nav-list > .ms-nav-active > a::before,
.ms-primary-nav > .ms-nav-list > .current-menu-item > a::before,
.ms-primary-nav > .ms-nav-list > .current-menu-parent > a::before,
.ms-primary-nav > .ms-nav-list > .current-menu-ancestor > a::before,
#ms-primary-nav a[aria-current="page"]::before {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 4px !important;
    width: 18px !important;
    height: 3px !important;
    border-radius: 999px !important;
    transform: translateX(-50%) !important;
    background: linear-gradient(90deg, #ff6448, #0f766e) !important;
}

@media (max-width: 1180px) {
    .ms-primary-nav > .ms-nav-list > .ms-nav-active > a::before,
    .ms-primary-nav > .ms-nav-list > .current-menu-item > a::before,
    .ms-primary-nav > .ms-nav-list > .current-menu-parent > a::before,
    .ms-primary-nav > .ms-nav-list > .current-menu-ancestor > a::before,
    #ms-primary-nav a[aria-current="page"]::before {
        left: 18px !important;
        bottom: 10px !important;
        transform: none !important;
    }
}

/* v61 live repair: keep Free Tools labels visible and compare controls free from mojibake artifacts. */
#ms-header .ms-nav-free-tools > .sub-menu > .menu-item > a,
#ms-primary-nav .ms-nav-free-tools > .sub-menu > .menu-item > a,
#ms-header .ms-nav-free-tools .sub-menu a,
#ms-primary-nav .ms-nav-free-tools .sub-menu a {
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    color: #102027 !important;
    -webkit-text-fill-color: #102027 !important;
    font-size: 13.5px !important;
    font-weight: 900 !important;
    line-height: 1.25 !important;
    text-indent: 0 !important;
    letter-spacing: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

#ms-header .ms-nav-free-tools > .sub-menu > .menu-item > a:hover,
#ms-primary-nav .ms-nav-free-tools > .sub-menu > .menu-item > a:hover,
#ms-header .ms-nav-free-tools > .sub-menu > .menu-item > a:focus-visible,
#ms-primary-nav .ms-nav-free-tools > .sub-menu > .menu-item > a:focus-visible {
    color: #0f766e !important;
    -webkit-text-fill-color: #0f766e !important;
}

body.category-compare .cmp-search-icon {
    font-family: Arial, Helvetica, sans-serif !important;
    line-height: 1 !important;
}

body.category-compare .remove-btn {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 20px !important;
    line-height: 1 !important;
    color: #ef4444 !important;
}

body.category-compare #compare-results-area[style*="display: block"],
body.category-compare #compare-results-area[style*="display:block"] {
    display: block !important;
}

body.category-compare #comp-table-body:not(:empty) {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* v62 live compare/category repair: override old Additional CSS pseudo badges and keep generated table first. */
body.category-compare #compare-results-area[style*="display: block"],
body.category-compare #compare-results-area[style*="display:block"] {
    display: block !important;
}

body.category-compare #compare-results-area[style*="display: block"] .comp-scroll-wrap,
body.category-compare #compare-results-area[style*="display:block"] .comp-scroll-wrap {
    display: block !important;
    order: 1 !important;
}

body.category-compare #compare-results-area[style*="display: block"] #dynamic-overview-area,
body.category-compare #compare-results-area[style*="display:block"] #dynamic-overview-area {
    order: 2 !important;
}

body.category-compare #comp-table-body .val-winner::after,
body.category-compare #sticky-comp-header .val-winner::after,
body.category-compare .comp-val.val-winner::after,
body.category-compare .win-icon::after,
body.category-compare .win-icon:not(:has(.win-text))::after {
    content: none !important;
    display: none !important;
}

body.category-compare .win-icon {
    font-size: 0 !important;
}

body.category-compare .win-icon::before {
    content: "Winner" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
}

body.category-compare .win-icon .win-text {
    display: none !important;
}

/* v63 local source sync: fold live Additional CSS features into the theme without reintroducing duplicate Winner labels. */
@media screen and (max-width: 1180px) {
    #ms-mobile-overlay,
    #ms-header .ms-mobile-overlay,
    .ms-mobile-overlay {
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    #ms-mobile-overlay.is-visible,
    #ms-header .ms-mobile-overlay.is-visible,
    .ms-mobile-overlay.is-visible {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    #ms-primary-nav,
    #ms-header .ms-primary-nav {
        pointer-events: none !important;
    }

    #ms-primary-nav.is-open,
    #ms-header .ms-primary-nav.is-open {
        pointer-events: auto !important;
    }

    #ms-menu-toggle,
    #ms-header #ms-menu-toggle,
    #ms-header .ms-logo,
    #ms-header .ms-icon-btn,
    #ms-header .rs-switcher {
        pointer-events: auto !important;
    }
}

@media screen and (max-width: 767px) {
    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: clip !important;
    }

    *,
    *::before,
    *::after {
        box-sizing: border-box !important;
    }

    img,
    svg,
    video,
    canvas,
    iframe {
        max-width: 100% !important;
        height: auto;
    }

    #page,
    .site,
    .ms-site,
    .ms-page,
    .site-main,
    .ms-main,
    .content-area,
    .site-content,
    main,
    header,
    footer,
    section,
    article,
    .container,
    .wrap,
    .ms-container,
    .ms-wrap,
    .ms-section-inner,
    .entry-content {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .ms-section,
    body.home .ms-section,
    .comparison-spotlight-section {
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow-x: clip !important;
    }

    .ms-global-card,
    .ms-trend-card,
    .monitor-card,
    .product-card,
    .ms-card,
    .lc-card,
    .lgr-card {
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
        transform: none !important;
    }

    .ms-card-title,
    .ms-trend-title,
    .ms-section-title,
    .ms-single-auto h1,
    .ms-hero-title,
    .ms-hero-v2__title {
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
        hyphens: auto !important;
    }

    .ms-section-header,
    .spotlight-header,
    .find-results-toolbar,
    .finder-toolbar,
    .results-toolbar,
    .ms-hero-actions,
    .ms-hero-v2__actions {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        width: 100% !important;
    }

    .ms-section-link,
    .btn-compare,
    .ms-btn,
    .ms-buy,
    .ms-compare,
    .ms-hero-v2__btn,
    .ms-card-secondary,
    .ms-card-compare,
    .ms-amazon-btn,
    .ms-store-offer-btn,
    button,
    input,
    select,
    textarea {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .ms-hero-v2__btn,
    .ms-btn,
    .btn-compare,
    .ms-buy,
    .ms-compare,
    .ms-section-link {
        width: 100% !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: normal !important;
    }

    table,
    .find-usecase-table,
    .ms-single-content table,
    .ms-table,
    .spec-table,
    .comparison-table,
    .ms-compare-table {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
    }

    table th,
    table td,
    .find-usecase-table th,
    .find-usecase-table td,
    .ms-table th,
    .ms-table td {
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 11px 10px !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    body.category-find-monitor .find-usecase-table,
    body.page-template-page-ppi-calculator main table,
    body.page-template-page-panel-guide main table {
        display: block !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
        background: transparent !important;
    }

    body.category-find-monitor .find-usecase-table thead,
    body.page-template-page-ppi-calculator main table thead,
    body.page-template-page-panel-guide main table thead {
        display: none !important;
    }

    body.category-find-monitor .find-usecase-table tbody,
    body.category-find-monitor .find-usecase-table tr,
    body.category-find-monitor .find-usecase-table th,
    body.category-find-monitor .find-usecase-table td,
    body.page-template-page-ppi-calculator main table tbody,
    body.page-template-page-ppi-calculator main table tr,
    body.page-template-page-ppi-calculator main table th,
    body.page-template-page-ppi-calculator main table td,
    body.page-template-page-panel-guide main table tbody,
    body.page-template-page-panel-guide main table tr,
    body.page-template-page-panel-guide main table th,
    body.page-template-page-panel-guide main table td {
        display: block !important;
        width: 100% !important;
    }

    body.category-find-monitor .find-usecase-table tr,
    body.page-template-page-ppi-calculator main table tr,
    body.page-template-page-panel-guide main table tr {
        margin: 0 0 12px !important;
        overflow: hidden !important;
        border: 1px solid rgba(15, 118, 110, .12) !important;
        border-radius: 8px !important;
        background: #fff !important;
    }

    body.category-find-monitor .find-usecase-table th,
    body.page-template-page-ppi-calculator main table th,
    body.page-template-page-panel-guide main table th {
        color: #0f766e !important;
        background: #f0fdfa !important;
        font-weight: 900 !important;
    }

    .spotlight-table,
    .spotlight-table--three {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .spotlight-table--three .spotlight-row--three {
        width: max-content !important;
        min-width: 620px !important;
    }

    body.home #ms-filter-results-section .ms-container {
        padding-right: 0 !important;
        overflow: visible !important;
    }

    body.home #monitors-results.ms-filter-results-grid {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: minmax(270px, 82vw) !important;
        grid-template-columns: none !important;
        gap: 14px !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        overscroll-behavior-x: contain !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 2px 14px 16px 0 !important;
        scrollbar-width: thin !important;
        transform: none !important;
    }

    body.home #monitors-results.ms-filter-results-grid > * {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        scroll-snap-align: start !important;
        transform: none !important;
    }

    body.home #monitors-results.ms-filter-results-grid .ms-global-card {
        height: 100% !important;
    }

    body.home #ms-filter-results-section .ms-results-count::after {
        content: " - swipe cards" !important;
        color: #64748b !important;
        font-weight: 800 !important;
    }

    body.home #ms-shop-by-category .ms-shopcat-count {
        font-size: 0 !important;
        line-height: 1 !important;
        white-space: normal !important;
        text-align: center !important;
    }

    body.home #ms-shop-by-category .ms-shopcat-count::before {
        content: "Open category" !important;
        color: inherit !important;
        font-size: 12px !important;
        line-height: 1.25 !important;
        font-weight: 900 !important;
    }
}

@media screen and (max-width: 420px) {
    .ms-wrap,
    .ms-container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .ms-global-card .ms-card-specs,
    .ms-trend-specs,
    .ms-card-rating-breakdown {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    }
}

body.home #ms-hero .ms-hero-monitor-card__screen,
#ms-hero .ms-hero-monitor-card__screen {
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-color: rgba(255, 255, 255, .94) !important;
}

body.home #ms-hero .ms-hero-monitor-card__screen img,
#ms-hero .ms-hero-monitor-card__screen img {
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    padding: 10px !important;
    background: rgba(255, 255, 255, .92) !important;
}

body.home #ms-hero .ms-hero-monitor-card:nth-child(1) .ms-hero-monitor-card__screen {
    background-image: url("https://www.monitorsuggest.com/wp-content/uploads/2026/06/asus-rog-swift-oled-pg32ucdm.webp") !important;
}

body.home #ms-hero .ms-hero-monitor-card:nth-child(2) .ms-hero-monitor-card__screen {
    background-image: url("https://www.monitorsuggest.com/wp-content/uploads/2026/06/alienware-aw2725df.webp") !important;
}

body.home #ms-hero .ms-hero-monitor-card__screen::before {
    display: none !important;
}

@media screen and (max-width: 767px) {
    body.single-monitor .entry-content,
    body.single-monitor .ms-single-content,
    body.single-monitor .ms-single-auto,
    body.single-monitor .monitor-content,
    body.single-monitor .ms-monitor-content,
    body.single-monitor .ms-specs-section,
    body.single-monitor .ms-table-wrap,
    body.single-monitor .spec-table-wrap,
    body.post-type-archive-monitor .entry-content,
    body.page-id-9 .entry-content {
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior-x: contain !important;
        scrollbar-width: thin !important;
    }

    body.single-monitor table,
    body.single-monitor .ms-single-content table,
    body.single-monitor .entry-content table,
    body.single-monitor .ms-table,
    body.single-monitor .spec-table,
    body.single-monitor .comparison-table,
    body.single-monitor .monitor-specs-table,
    body.single-monitor .ms-monitor-specs table,
    body.post-type-archive-monitor table,
    body.page-id-9 table {
        display: table !important;
        width: max-content !important;
        max-width: none !important;
        min-width: 720px !important;
        table-layout: auto !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
    }

    body.single-monitor table th,
    body.single-monitor table td,
    body.single-monitor .ms-single-content table th,
    body.single-monitor .ms-single-content table td,
    body.single-monitor .entry-content table th,
    body.single-monitor .entry-content table td {
        min-width: max-content !important;
        padding: 12px 14px !important;
        white-space: nowrap !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    body.single-monitor .ms-single-content table th:first-child,
    body.single-monitor .entry-content table th:first-child,
    body.single-monitor .ms-single-content table td:first-child,
    body.single-monitor .entry-content table td:first-child {
        position: sticky !important;
        left: 0 !important;
        z-index: 2 !important;
        background: #f8fafc !important;
    }

    body.post-type-archive-monitor .ms-filter-results-grid,
    body.post-type-archive-monitor #monitors-results,
    body.page-id-9 #monitors-results,
    body.page-id-9 .ms-filter-results-grid,
    body.page-id-9 .monitor-grid,
    body.page-id-9 .ms-monitor-grid {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: minmax(270px, 82vw) !important;
        grid-template-columns: none !important;
        gap: 14px !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scroll-snap-type: x mandatory !important;
        padding: 2px 14px 16px 0 !important;
    }

    body.post-type-archive-monitor .ms-filter-results-grid > *,
    body.post-type-archive-monitor #monitors-results > *,
    body.page-id-9 #monitors-results > *,
    body.page-id-9 .ms-filter-results-grid > *,
    body.page-id-9 .monitor-grid > *,
    body.page-id-9 .ms-monitor-grid > * {
        width: auto !important;
        max-width: none !important;
        scroll-snap-align: start !important;
    }
}

/* Final compare overrides after imported live fixes. */
body.category-compare #comp-table-body .val-winner::after,
body.category-compare #sticky-comp-header .val-winner::after,
body.category-compare .comp-val.val-winner::after,
body.category-compare .win-icon::after,
body.category-compare .win-icon:not(:has(.win-text))::after {
    content: none !important;
    display: none !important;
}

/* =============================================================
   MISSING HERO ALIASES
   ============================================================= */
.ms-hero-title {
    font-size: clamp(36px, 5vw, 58px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -1.8px;
    color: var(--color-text-primary);
    margin: 0;
}

.ms-hero-title-accent {
    background: var(--gradient-hero);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.ms-hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-accent);
    opacity: 0.85;
}

.ms-hero-eyebrow-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--color-accent);
    box-shadow: 0 0 8px var(--color-accent);
    flex-shrink: 0;
    display: inline-block;
}

.ms-hero-desc {
    font-size: 15px;
    line-height: 1.7;
    color: var(--color-text-secondary);
    max-width: 440px;
    margin: 0;
}

.ms-hero-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.ms-btn-secondary {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: var(--color-text-secondary);
}

.ms-btn-secondary:hover {
    border-color: rgba(255, 255, 255, 0.35);
    color: var(--color-text-primary);
    background: rgba(255, 255, 255, 0.05);
}

.ms-hero-monitor {
    width: 100%;
}

.ms-hero-monitor--primary {
    position: relative;
    z-index: 2;
    filter: drop-shadow(0 0 40px rgba(124, 58, 237, 0.45));
    animation: ms-float 5s ease-in-out infinite;
}

.ms-hero-monitor--secondary {
    position: absolute;
    top: -10%;
    right: -12%;
    width: 78%;
    z-index: 1;
    opacity: 0.5;
    filter: drop-shadow(0 0 24px rgba(124, 58, 237, 0.25));
    animation: ms-float 5s ease-in-out 1.5s infinite;
}

.ms-hero-svg-monitor {
    width: 100%;
    height: auto;
    display: block;
}

.ms-filter-title-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--color-text-primary);
}

.ms-filter-actions {
    display: flex;
    align-items: flex-end;
}

.ms-filter-actions .ms-btn {
    width: 100%;
    justify-content: center;
    gap: 7px;
}

/* =============================================================
   TRENDING MONITORS
   ============================================================= */
.ms-trending-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.ms-trend-card {
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.ms-trend-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(16, 35, 45, 0.10), 0 0 24px rgba(168, 85, 247, 0.18);
}

.ms-trend-card-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    text-decoration: none;
    color: var(--color-text-primary);
    overflow: hidden;
    transition: border-color var(--transition-base);
}

.ms-trend-card:hover .ms-trend-card-inner {
    border-color: rgba(168, 85, 247, 0.3);
}

.ms-trend-img-wrap {
    position: relative;
    background: #fffdf8;
    overflow: hidden;
    aspect-ratio: 16 / 10;
}

.ms-trend-img {
    width: 100%;
    height: 100%;
}

.ms-trend-img svg {
    width: 100%;
    height: 100%;
    display: block;
}

.ms-trend-rank {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    padding: 3px 8px;
    border-radius: var(--radius-pill);
    line-height: 1.4;
}

.ms-trend-rank--gold {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    color: #1a0a00;
}

.ms-trend-rank--silver {
    background: linear-gradient(135deg, #d1d5db, #9ca3af);
    color: #102027;
}

.ms-trend-rank--bronze {
    background: linear-gradient(135deg, #d97706, #b45309);
    color: #e2e8f0;
}

.ms-trend-rank--muted {
    background: rgba(20,45,50,.12);
    color: var(--color-text-muted);
    border: 1px solid var(--color-border);
}

.ms-trend-score {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 2;
    font-size: 15px;
    font-weight: 800;
    padding: 5px 10px;
    border-radius: var(--radius-md);
    line-height: 1;
    letter-spacing: -0.5px;
}

.ms-trend-score--excellent {
    background: linear-gradient(135deg, #a855f7, #7c3aed);
    color: #102027;
    box-shadow: 0 0 14px rgba(168, 85, 247, 0.5);
}

.ms-trend-score--great {
    background: linear-gradient(135deg, #22d3ee, #0891b2);
    color: #102027;
    box-shadow: 0 0 14px rgba(34, 211, 238, 0.4);
}

.ms-trend-score--good {
    background: linear-gradient(135deg, #34d399, #059669);
    color: #102027;
    box-shadow: 0 0 14px rgba(52, 211, 153, 0.4);
}

.ms-trend-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
    flex: 1;
}

.ms-trend-title {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--color-text-primary);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ms-trend-specs {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.ms-trend-spec {
    font-size: 10.5px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: var(--radius-pill);
    background: rgba(20,45,50,.10);
    border: 1px solid rgba(255, 255, 255, 0.09);
    color: var(--color-text-secondary);
    white-space: nowrap;
}

.ms-trend-bottom {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid var(--color-border);
}

.ms-trend-price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.ms-trend-price {
    font-size: 18px;
    font-weight: 800;
    color: var(--color-text-primary);
    letter-spacing: -0.5px;
}

.ms-trend-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 3px 8px;
    border-radius: var(--radius-pill);
    text-transform: uppercase;
}

.ms-trend-label--excellent {
    background: rgba(168, 85, 247, 0.15);
    color: #c084fc;
    border: 1px solid rgba(168, 85, 247, 0.3);
}

.ms-trend-label--great {
    background: rgba(34, 211, 238, 0.12);
    color: #67e8f9;
    border: 1px solid rgba(34, 211, 238, 0.25);
}

.ms-trend-label--good {
    background: rgba(52, 211, 153, 0.12);
    color: #6ee7b7;
    border: 1px solid rgba(52, 211, 153, 0.25);
}

.ms-trend-stars {
    display: flex;
    align-items: center;
    gap: 5px;
}

.ms-stars {
    color: #fbbf24;
    font-size: 11px;
    letter-spacing: 1px;
    line-height: 1;
}

.ms-star-half {
    opacity: 0.5;
}

.ms-trend-rating-val {
    font-size: 12px;
    font-weight: 700;
    color: var(--color-text-primary);
}

.ms-trend-rating-count {
    font-size: 11px;
    color: var(--color-text-muted);
}

.ms-section-title-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ms-trending-flame {
    font-size: 18px;
    line-height: 1;
}

.ms-filter-results-grid {
    grid-template-columns: repeat(4, 1fr);
}

.ms-filter-no-results {
    grid-column: 1 / -1;
    text-align: center;
    padding: 48px 24px;
    color: var(--color-text-muted);
}

.ms-results-count {
    font-size: 13px;
    color: var(--color-text-muted);
    font-style: italic;
}

.ms-grid--loading {
    opacity: 0.45;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

@media (max-width: 1100px) {
    .ms-trending-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .ms-filter-results-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 900px) {
    .ms-hero-inner {
        grid-template-columns: 1fr;
    }

    .ms-hero-visual {
        display: none;
    }
}

@media (max-width: 560px) {
    .ms-trending-grid {
        grid-template-columns: 1fr;
    }

    .ms-filter-results-grid {
        grid-template-columns: 1fr;
    }

    .ms-hero-monitor--secondary {
        display: none;
    }
}

/* =============================================================
   COMPARISON SPOTLIGHT
   ============================================================= */
.comparison-spotlight {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 1px;
    background: #222;
    border: 1px solid #333;
}

.comp-row {
    display: contents;
}

.comp-row>div {
    background: #fffdf8;
    padding: 15px;
    text-align: center;
}

.comp-row>div:first-child {
    text-align: left;
}

/* =============================================================
   FOOTER
   ============================================================= */
.ms-site-footer {
    background-color: #fffdf8;
    border-top: 1px solid var(--color-border);
    padding: 80px 0 30px;
    margin-top: 60px;
}

.ms-footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 40px;
    margin-bottom: 60px;
}

.ms-footer-brand {
    padding-right: 40px;
}

.ms-footer-logo {
    font-size: 24px;
    font-weight: 800;
    color: var(--color-text-primary);
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.ms-footer-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--color-text-muted);
}

.ms-footer-heading {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 24px;
}

.ms-footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ms-footer-links a {
    color: var(--color-text-muted);
    font-size: 14px;
    text-decoration: none;
    transition: color 0.2s ease;
}

.ms-footer-links a:hover {
    color: var(--color-accent);
    text-shadow: 0 0 10px rgba(168, 85, 247, 0.5);
}

.ms-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding-top: 30px;
    text-align: center;
    font-size: 13px;
    color: var(--color-text-muted);
}

@media (max-width: 900px) {
    .ms-footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .ms-footer-grid {
        grid-template-columns: 1fr;
    }

    .ms-footer-brand {
        padding-right: 0;
    }
}

/* =============================================================
   COMPARISON SPOTLIGHT SECTION - Ultra-Premium
   ============================================================= */
.comparison-spotlight-section {
    max-width: var(--container-max);
    margin: 80px auto;
    color: #e2e8f0;
    font-family: inherit;
}

.spotlight-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 30px;
}

.spotlight-titles h2 {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 8px;
    background: linear-gradient(to right, #ffffff, #a78bfa);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.spotlight-titles p {
    color: #888;
    font-size: 16px;
    margin: 0;
}

.btn-compare {
    background: transparent;
    color: #a78bfa;
    text-decoration: none;
    font-weight: 600;
    font-size: 15px;
    border: 1px solid rgba(167, 139, 250, 0.4);
    padding: 10px 22px;
    border-radius: 6px;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.btn-compare:hover {
    background: rgba(167, 139, 250, 0.1);
    box-shadow: 0 0 15px rgba(167, 139, 250, 0.2);
    border-color: #a78bfa;
}

.spotlight-table {
    background: #fffdf80f;
    border: 1px solid #1f1f2e;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(16, 35, 45, .08);
    overflow: hidden;
}

.spotlight-row {
    display: grid;
    grid-template-columns: 1.5fr 1.2fr 60px 1.2fr 1fr;
    align-items: center;
    padding: 20px 30px;
    border-bottom: 1px solid #1a1a26;
    transition: background 0.2s ease;
}

.spotlight-row:hover {
    background: rgba(255, 255, 255, 0.02);
}

.spotlight-row:last-child {
    border-bottom: none;
}

.table-header-row {
    padding-top: 35px;
    padding-bottom: 30px;
    background: #fffdf8;
}

.table-footer-row {
    background: rgba(16, 185, 129, 0.04);
}

.col-spec {
    color: #5b6870;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.col-mon {
    text-align: center;
    font-size: 15px;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 15px;
    color: #e2e8f0;
}

.table-header-row .col-mon {
    flex-direction: column;
    justify-content: center;
    gap: 0;
}

.col-mon img {
    height: 110px;
    width: auto;
    object-fit: contain;
    margin-bottom: 15px;
}

.col-mon h3 {
    font-size: 17px;
    margin: 0 0 6px 0;
    font-weight: 600;
    color: #f8fafc;
}

.col-mon .price {
    color: #a78bfa;
    font-weight: 700;
    font-size: 16px;
    margin: 0;
}

.col-mon .price span {
    color: #fbbf24;
    font-size: 13px;
    margin-left: 8px;
}

.col-vs {
    display: flex;
    justify-content: center;
    align-items: center;
}

.vs-badge {
    background: linear-gradient(135deg, #8b5cf6, #6d28d9);
    color: #102027;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 0 12px rgba(139, 92, 246, 0.5);
    flex-shrink: 0;
}

.col-better {
    text-align: right;
    font-weight: 600;
    font-size: 15px;
    color: #334155;
}

.col-better.trophy {
    color: #fbbf24;
    font-size: 16px;
    text-shadow: 0 0 10px rgba(251, 191, 36, 0.3);
}

.check-icon {
    color: #10b981;
    font-size: 17px;
    text-shadow: 0 0 8px rgba(16, 185, 129, 0.4);
}

.score-badge {
    background: rgba(16, 185, 129, 0.1);
    color: #10b981;
    padding: 6px 12px;
    border-radius: 6px;
    font-weight: 700;
    border: 1px solid rgba(16, 185, 129, 0.2);
    font-size: 13px;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .comparison-spotlight-section {
        margin: 60px auto;
    }

    .spotlight-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .spotlight-row {
        grid-template-columns: 1.2fr 1fr 44px 1fr 0.8fr;
        padding: 14px 18px;
    }

    .table-header-row {
        padding: 20px 18px 24px;
    }

    .col-mon img {
        height: 80px;
    }

    .col-mon h3 {
        font-size: 14px;
    }

    .col-mon .price {
        font-size: 13px;
    }
}


@media (max-width: 640px) {
    .spotlight-row {
        grid-template-columns: 1.2fr 1fr 36px 1fr;
        padding: 12px 14px;
        font-size: 13px;
    }

    .col-better {
        display: none;
    }

    .col-mon h3 {
        font-size: 12px;
    }

    .col-mon .price {
        font-size: 12px;
    }

    .col-spec {
        font-size: 12px;
    }

    .vs-badge {
        width: 28px;
        height: 28px;
        font-size: 9px;
    }
}

/* =============================================================
   LATEST COMPARISONS SECTION  (.lc-*)
   ============================================================= */
.lc-section {
    padding: 70px 0 60px;
    background: var(--color-bg-base);
}

.lc-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
}

.lc-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 28px;
}

.lc-header-left {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.lc-eyebrow {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-accent);
}

.lc-title {
    font-size: 26px;
    font-weight: 700;
    color: #102027;
    margin: 0;
    letter-spacing: -0.4px;
}

.lc-view-all {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent);
    text-decoration: none;
    padding: 8px 16px;
    border: 1px solid rgba(168, 85, 247, 0.3);
    border-radius: 6px;
    transition: background 200ms ease, border-color 200ms ease;
    white-space: nowrap;
}

.lc-view-all:hover {
    background: rgba(168, 85, 247, 0.08);
    border-color: rgba(168, 85, 247, 0.6);
}

.lc-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
}

.lc-card {
    display: flex;
    flex-direction: column;
    background: #fffdf8;
    border: 1px solid #1e1e2e;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: border-color 220ms ease, transform 220ms ease, box-shadow 220ms ease;
}

.lc-card:hover {
    border-color: rgba(168, 85, 247, 0.4);
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(16, 35, 45, .08), 0 0 0 1px rgba(168, 85, 247, 0.12);
}

.lc-card-monitors {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 16px 12px 10px;
    background: #fffdf8;
}

.lc-mon-thumb {
    flex: 1;
    max-width: 80px;
}

.lc-mon-thumb svg {
    width: 100%;
    height: auto;
    display: block;
}

.lc-vs-mini {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #8b5cf6, #6d28d9);
    color: #102027;
    font-size: 8px;
    font-weight: 800;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(139, 92, 246, 0.5);
    letter-spacing: 0.02em;
}

.lc-card-body {
    padding: 12px 14px 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.lc-card-names {
    font-size: 12px;
    font-weight: 500;
    color: #c4c4d8;
    margin: 0;
    line-height: 1.4;
}

.lc-card-names span {
    color: #666;
    font-weight: 400;
}

.lc-card-link {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--color-accent);
    margin-top: auto;
    transition: color 150ms ease;
}

.lc-card:hover .lc-card-link {
    color: #c084fc;
}

@media (max-width: 1024px) {
    .lc-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}


@media (max-width: 640px) {
    .lc-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .lc-title {
        font-size: 20px;
    }
}

/* =============================================================
   LATEST GUIDES & REVIEWS  (.lgr-*)
   ============================================================= */
.lgr-section {
    padding: 70px 0 60px;
    background: #fffdf8;
    border-top: 1px solid #141420;
}

.lgr-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
}

.lgr-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 28px;
}

.lgr-header-left {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.lgr-eyebrow {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-accent);
}

.lgr-title {
    font-size: 26px;
    font-weight: 700;
    color: #102027;
    margin: 0;
    letter-spacing: -0.4px;
}

.lgr-view-all {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent);
    text-decoration: none;
    padding: 8px 16px;
    border: 1px solid rgba(168, 85, 247, 0.3);
    border-radius: 6px;
    transition: background 200ms ease, border-color 200ms ease;
    white-space: nowrap;
}

.lgr-view-all:hover {
    background: rgba(168, 85, 247, 0.08);
    border-color: rgba(168, 85, 247, 0.6);
}

.lgr-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.lgr-card {
    display: flex;
    flex-direction: column;
    background: #fffdf8;
    border: 1px solid #1e1e2e;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: border-color 220ms ease, transform 220ms ease, box-shadow 220ms ease;
}

.lgr-card:hover {
    border-color: rgba(168, 85, 247, 0.4);
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(16, 35, 45, 0.08);
}

.lgr-thumb {
    position: relative;
    line-height: 0;
}

.lgr-thumb svg {
    width: 100%;
    height: auto;
    display: block;
}

.lgr-tag {
    position: absolute;
    top: 12px;
    left: 12px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.07em;
    padding: 4px 9px;
    border-radius: 4px;
    text-transform: uppercase;
}

.lgr-tag--buying {
    background: rgba(168, 85, 247, 0.18);
    color: #c084fc;
    border: 1px solid rgba(168, 85, 247, 0.35);
    box-shadow: 0 0 10px rgba(168, 85, 247, 0.25);
}

.lgr-tag--explainer {
    background: rgba(34, 211, 238, 0.12);
    color: #67e8f9;
    border: 1px solid rgba(34, 211, 238, 0.3);
    box-shadow: 0 0 10px rgba(34, 211, 238, 0.2);
}

.lgr-tag--guide {
    background: rgba(16, 185, 129, 0.12);
    color: #34d399;
    border: 1px solid rgba(16, 185, 129, 0.3);
    box-shadow: 0 0 10px rgba(16, 185, 129, 0.2);
}

.lgr-tag--review {
    background: rgba(251, 191, 36, 0.12);
    color: #fcd34d;
    border: 1px solid rgba(251, 191, 36, 0.3);
    box-shadow: 0 0 10px rgba(251, 191, 36, 0.2);
}

.lgr-card-body {
    padding: 16px 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.lgr-card-title {
    font-size: 14px;
    font-weight: 700;
    color: #f0f0f8;
    margin: 0;
    line-height: 1.45;
}

.lgr-card-excerpt {
    font-size: 12.5px;
    color: #7878a0;
    line-height: 1.6;
    margin: 0;
    flex: 1;
}

.lgr-card-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    color: #555570;
    margin-top: auto;
}

@media (max-width: 1024px) {
    .lgr-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 540px) {
    .lgr-grid {
        grid-template-columns: 1fr;
    }

    .lgr-title {
        font-size: 20px;
    }
}

/* =============================================================
   EMAIL CAPTURE BANNER  (.ecb-*)
   ============================================================= */
.ecb-section {
    padding: 60px 0;
    background: #fffdf8;
    border-top: 1px solid #141420;
    border-bottom: 1px solid #141420;
    position: relative;
    overflow: hidden;
}

.ecb-section::before,
.ecb-section::after {
    content: '';
    position: absolute;
    left: 10%;
    right: 10%;
    height: 1px;
    pointer-events: none;
}

.ecb-section::before {
    top: 0;
    background: linear-gradient(90deg, transparent, rgba(168, 85, 247, 0.5) 40%, rgba(232, 121, 249, 0.4) 60%, transparent);
}

.ecb-section::after {
    bottom: 0;
    background: linear-gradient(90deg, transparent, rgba(124, 58, 237, 0.4) 40%, rgba(168, 85, 247, 0.3) 60%, transparent);
}

.ecb-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 56px;
    align-items: center;
}

.ecb-left {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.ecb-icon {
    flex-shrink: 0;
    margin-top: 4px;
}

.ecb-copy {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ecb-eyebrow {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-accent);
}

.ecb-heading {
    font-size: 26px;
    font-weight: 700;
    color: #f0f0f8;
    margin: 0;
    line-height: 1.25;
    letter-spacing: -0.4px;
}

.ecb-accent {
    background: linear-gradient(to right, #a855f7, #e879f9);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.ecb-desc {
    font-size: 13.5px;
    color: #7878a0;
    line-height: 1.65;
    margin: 0;
    max-width: 380px;
}

.ecb-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.ecb-fields {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.ecb-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.ecb-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #666688;
}

.ecb-input {
    width: 100%;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(20,45,50,.12);
    border-radius: 6px;
    color: #e0e0f0;
    font-family: var(--font-sans);
    font-size: 13px;
    padding: 9px 12px;
    outline: none;
    transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
    appearance: none;
    -webkit-appearance: none;
}

.ecb-input::placeholder {
    color: #444460;
}

.ecb-input:focus {
    border-color: rgba(168, 85, 247, 0.55);
    background: rgba(168, 85, 247, 0.06);
    box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.1);
}

.ecb-select-wrap {
    position: relative;
}

.ecb-select {
    padding-right: 30px;
    cursor: pointer;
}

.ecb-chevron {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #555575;
    pointer-events: none;
}

.ecb-select option {
    background: #f4f7f4;
    color: #c0c0e0;
}

.ecb-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 24px;
    background: linear-gradient(135deg, #a855f7 0%, #7c3aed 100%);
    color: #102027;
    font-family: var(--font-sans);
    font-size: 14px;
    font-weight: 700;
    border: none;
    border-radius: 7px;
    cursor: pointer;
    transition: opacity 180ms ease, box-shadow 180ms ease;
    box-shadow: 0 0 16px rgba(124, 58, 237, 0.45);
    letter-spacing: 0.01em;
}

.ecb-btn:hover {
    opacity: 0.9;
    box-shadow: 0 0 28px rgba(124, 58, 237, 0.65);
}

.ecb-trust {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.ecb-trust-item {
    font-size: 11.5px;
    color: #555575;
    display: flex;
    align-items: center;
    gap: 4px;
}

@media (max-width: 900px) {
    .ecb-inner {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .ecb-fields {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 540px) {
    .ecb-fields {
        grid-template-columns: 1fr;
    }

    .ecb-heading {
        font-size: 21px;
    }

    .ecb-trust {
        gap: 12px;
    }
}

/* =============================================================
   DUAL CONVERSION CARDS  (.dcc-*)
   ============================================================= */
.dcc-section {
    padding: 60px 0 70px;
    background: var(--color-bg-base);
    border-top: 1px solid #141420;
}

.dcc-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.dcc-card {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    padding: 32px 32px 36px;
    background: #fffdf8;
    border: 1px solid #1e1e2e;
    border-radius: 14px;
    transition: border-color 220ms ease, box-shadow 220ms ease;
    position: relative;
    overflow: hidden;
}

.dcc-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 15%;
    right: 15%;
    height: 1px;
    pointer-events: none;
}

.dcc-card--suggest::before {
    background: linear-gradient(90deg, transparent, rgba(168, 85, 247, 0.6), transparent);
}

.dcc-card--experience::before {
    background: linear-gradient(90deg, transparent, rgba(251, 191, 36, 0.5), transparent);
}

.dcc-card--suggest:hover {
    border-color: rgba(168, 85, 247, 0.4);
    box-shadow: 0 0 40px rgba(168, 85, 247, 0.08), 0 12px 30px rgba(16, 35, 45, .08);
}

.dcc-card--experience:hover {
    border-color: rgba(251, 191, 36, 0.3);
    box-shadow: 0 0 40px rgba(251, 191, 36, 0.06), 0 12px 30px rgba(16, 35, 45, .08);
}

.dcc-card-icon {
    flex-shrink: 0;
    margin-top: 4px;
}

.dcc-card-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.dcc-stars {
    display: flex;
    gap: 3px;
    margin-bottom: 2px;
}

.dcc-star {
    font-size: 18px;
    color: #2a2a3a;
    line-height: 1;
}

.dcc-star--lit {
    color: #fbbf24;
    text-shadow: 0 0 8px rgba(251, 191, 36, 0.5);
}

.dcc-card-title {
    font-size: 19px;
    font-weight: 700;
    color: #f0f0f8;
    margin: 0;
    line-height: 1.3;
    letter-spacing: -0.3px;
}

.dcc-card-desc {
    font-size: 13.5px;
    color: #6868a0;
    line-height: 1.65;
    margin: 0;
}

.dcc-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 20px;
    font-size: 13.5px;
    font-weight: 700;
    border-radius: 7px;
    text-decoration: none;
    transition: opacity 180ms ease, box-shadow 180ms ease, background 180ms ease, border-color 180ms ease;
    align-self: flex-start;
    margin-top: 6px;
    letter-spacing: 0.01em;
}

.dcc-btn--primary {
    background: linear-gradient(135deg, #a855f7 0%, #7c3aed 100%);
    color: #102027;
    box-shadow: 0 0 16px rgba(124, 58, 237, 0.4);
}

.dcc-btn--primary:hover {
    opacity: 0.88;
    box-shadow: 0 0 28px rgba(124, 58, 237, 0.6);
}

.dcc-btn--secondary {
    background: rgba(251, 191, 36, 0.1);
    color: #fbbf24;
    border: 1px solid rgba(251, 191, 36, 0.3);
}

.dcc-btn--secondary:hover {
    background: rgba(251, 191, 36, 0.18);
    border-color: rgba(251, 191, 36, 0.55);
    box-shadow: 0 0 18px rgba(251, 191, 36, 0.2);
}

@media (max-width: 768px) {
    .dcc-inner {
        grid-template-columns: 1fr;
    }

    .dcc-card {
        padding: 24px 22px 28px;
    }
}

@media (max-width: 480px) {
    .dcc-card {
        flex-direction: column;
        gap: 16px;
    }
}

/* =============================================================
   PAGE HEADER
   ============================================================= */
.page-header {
    position: relative;
    overflow: hidden;
    padding: calc(var(--nav-height) + 64px) 0 64px;
    background: radial-gradient(ellipse 55% 60% at 60% 40%, rgba(124, 58, 237, 0.16) 0%, transparent 65%), radial-gradient(ellipse 35% 50% at 85% 10%, rgba(168, 85, 247, 0.10) 0%, transparent 60%), #fffdf8;
}

.page-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(168, 85, 247, 0.08) 1px, transparent 1px);
    background-size: 28px 28px;
    pointer-events: none;
}

.page-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: linear-gradient(to bottom, transparent, #fffdf8);
    pointer-events: none;
}

.page-header__glow-line {
    position: absolute;
    top: 0;
    left: 10%;
    right: 10%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(168, 85, 247, 0.55) 40%, rgba(232, 121, 249, 0.4) 60%, transparent);
    pointer-events: none;
}

.page-header__inner {
    position: relative;
    z-index: 1;
    max-width: 900px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.page-header__breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: #555575;
}

.page-header__breadcrumb a {
    color: #555575;
    text-decoration: none;
    transition: color 150ms ease;
}

.page-header__breadcrumb a:hover {
    color: var(--color-accent);
}

.page-header__breadcrumb-sep {
    color: #333350;
    font-size: 11px;
}

.page-header__badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-accent);
    align-self: flex-start;
}

.page-header__badge-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--color-accent);
    box-shadow: 0 0 8px rgba(168, 85, 247, 0.7);
    animation: ph-pulse 2.4s ease-in-out infinite;
}

@keyframes ph-pulse {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.5;
        transform: scale(0.75);
    }
}

.page-header__badge--cyan {
    color: #22d3ee;
}

.page-header__badge-dot--cyan {
    background: #22d3ee;
    box-shadow: 0 0 8px rgba(34, 211, 238, 0.7);
}

.page-header__title {
    font-size: clamp(34px, 5.5vw, 54px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -1.5px;
    color: #f0f0f8;
    margin: 0;
}

.page-header__accent {
    background: linear-gradient(135deg, #a855f7 0%, #e879f9 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.page-header__desc {
    font-size: 16px;
    line-height: 1.7;
    color: #7878a0;
    max-width: 640px;
    margin: 0;
}

.page-content-area {
    background: #fffdf8;
    padding: 60px 0 80px;
    min-height: 400px;
}

.page-content-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
}

@media (max-width: 768px) {
    .page-header {
        padding: calc(var(--nav-height) + 48px) 0 48px;
    }
}

/* =============================================================
   FIND MONITOR PAGE
   ============================================================= */
.fm-layout {
    background: #fffdf8;
    padding: 40px 0 80px;
    min-height: 600px;
}

.fm-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 28px;
    align-items: start;
}

.fm-sidebar {
    background: #fffdf814;
    border: 1px solid #1a1a28;
    border-radius: 14px;
    overflow: hidden;
    position: sticky;
    top: 90px;
}

.fm-sidebar__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 16px;
    border-bottom: 1px solid #141422;
}

.fm-sidebar__title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 700;
    color: #e0e0f0;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin: 0;
}

.fm-clear-btn {
    background: none;
    border: none;
    font-size: 11.5px;
    font-weight: 600;
    color: #555575;
    cursor: pointer;
    transition: color 150ms ease;
}

.fm-clear-btn:hover {
    color: var(--color-accent);
}

.fm-form {
    padding: 6px 0 12px;
}

.fm-group {
    border-bottom: 1px solid #141422;
}

.fm-group__toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 20px;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: #c0c0d8;
    text-align: left;
}

.fm-group__body {
    padding: 2px 20px 16px;
    overflow: hidden;
    transition: max-height 250ms ease, opacity 250ms ease;
}

.fm-group__body--collapsed {
    max-height: 0 !important;
    padding-top: 0;
    padding-bottom: 0;
    opacity: 0;
    pointer-events: none;
}

.fm-pill-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 2px 0 4px;
}

.fm-pill {
    display: inline-flex;
    cursor: pointer;
    user-select: none;
    position: relative;
}

.fm-pill__input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.fm-pill__face {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 500;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #222238;
    color: #7878a0;
}

.fm-pill__input:checked+.fm-pill__face {
    background: rgba(168, 85, 247, 0.15);
    border-color: #a78bfa;
    color: #e0d0ff;
    font-weight: 600;
}

.fm-checkbox-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fm-checkbox-label {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    border-radius: 7px;
    cursor: pointer;
}

.fm-checkbox {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.fm-checkbox-custom {
    width: 16px;
    height: 16px;
    border: 1.5px solid #2e2e48;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.03);
    display: flex;
    align-items: center;
    justify-content: center;
}

.fm-checkbox:checked+.fm-checkbox-custom {
    background: linear-gradient(135deg, #a855f7, #7c3aed);
    border-color: #a855f7;
}

/* =============================================================
   REGION SWITCHER / RANGE / COMPONENT STYLES
   ============================================================= */
.rs-switcher {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 30px 5px 8px;
    background: rgba(168, 85, 247, 0.06);
    border: 1px solid rgba(168, 85, 247, 0.18);
    border-radius: 8px;
    cursor: pointer;
}

.rs-select {
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    border: none;
    outline: none;
    cursor: pointer;
    width: 100%;
    position: absolute;
    inset: 0;
    opacity: 0;
    z-index: 2;
}

.rs-switcher::after {
    content: attr(data-currency);
    font-size: 11.5px;
    font-weight: 700;
    color: var(--color-accent);
    pointer-events: none;
}

.rs-chevron {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    color: #555575;
    pointer-events: none;
    z-index: 1;
}

.prs-track-wrap {
    position: relative;
    height: 36px;
    display: flex;
    align-items: center;
    padding: 0 2px;
    margin-bottom: 6px;
}

.prs-track-wrap::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 4px;
    background: #1e1e32;
    border-radius: 2px;
    z-index: 0;
}

.prs-fill {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    height: 4px;
    background: linear-gradient(90deg, #a855f7, #7c3aed);
    border-radius: 2px;
    z-index: 1;
}

.prs-range {
    appearance: none;
    position: absolute;
    width: 100%;
    height: 100%;
    background: transparent;
    outline: none;
    margin: 0;
    padding: 0;
    z-index: 2;
}

.prs-range::-webkit-slider-thumb {
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #ffffff;
    border: 2.5px solid #a855f7;
    cursor: pointer;
    pointer-events: all;
}

/* =============================================================
   COMPARE BUILDER UI - Minimal Premium
   ============================================================= */
.cmp-layout {
    padding: 40px 20px;
    background-color: #fffdf8;
    min-height: 80vh;
}

.cmp-inner {
    max-width: var(--container-max);
    margin: 0 auto;
}

.glass-panel {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    padding: 30px;
    backdrop-filter: blur(12px);
    box-shadow: 0 10px 40px rgba(16, 35, 45, .10);
}

.cmp-selection-arena {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-bottom: 60px;
}

.cmp-search-input {
    width: 100%;
    background: rgba(10, 10, 18, 0.8);
    border: 1px solid rgba(167, 139, 250, 0.3);
    color: #102027;
    padding: 16px 20px 16px 45px;
    border-radius: 12px;
    font-size: 16px;
}

/* ==========================================================================
   TRENDING HUB PAGE - Minimal Premium
   ========================================================================== */
.ms-trending-layout {
    padding: 40px 20px 80px;
    background-color: #fffdf8;
}

.ms-trending-inner {
    max-width: var(--container-max);
    margin: 0 auto;
}

.ms-trend-cat-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 30px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    padding-bottom: 20px;
}

.ms-trend-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

/* =========================================================
   HEADER OVERLAP EMERGENCY FIX - FINAL OVERRIDE
   Paste this at the VERY END of style.css
   ========================================================= */

.ms-header {
    height: 68px !important;
    overflow: visible !important;
}

.ms-nav-container {
    display: grid !important;
    grid-template-columns: minmax(145px, max-content) minmax(0, 1fr) max-content !important;
    align-items: center !important;
    gap: clamp(10px, 1vw, 16px) !important;
    max-width: min(100%, 1600px) !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    overflow: visible !important;
}

/* Logo fixed left */
.ms-logo {
    grid-column: 1 !important;
    display: flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    min-width: max-content !important;
    max-width: 170px !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 5 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.ms-nav-actions .ms-icon-btn {
    width: 30px !important;
    height: 30px !important;
}

.ms-nav-actions .ms-btn {
    padding: 7px 12px !important;
    font-size: 12.5px !important;
}

.ms-nav-actions .rs-switcher {
    min-width: 104px !important;
    height: 36px !important;
    padding: 0 10px !important;
}

/* Nav stays in middle column only */
.ms-primary-nav {
    grid-column: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    overflow: visible !important;
}

/* Only top-level nav UL should be flex */
.ms-primary-nav>.ms-nav-list {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: clamp(7px, 0.68vw, 12px) !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

/* Top-level menu items */
.ms-primary-nav>.ms-nav-list>.menu-item {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* Top-level menu links */
.ms-primary-nav>.ms-nav-list>.menu-item>a {
    display: flex !important;
    align-items: center !important;
    padding: 10px 0 !important;
    font-size: clamp(11.25px, 0.72vw, 12.5px) !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    color: #c9c4d8 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.ms-primary-nav>.ms-nav-list>.menu-item>a:hover,
.ms-primary-nav>.ms-nav-list>.current-menu-item>a,
.ms-primary-nav>.ms-nav-list>.current-menu-ancestor>a {
    color: #ffffff !important;
}

/* Actions fixed right */
.ms-nav-actions {
    grid-column: 3 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
    flex: 0 0 auto !important;
    min-width: max-content !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 6 !important;
    white-space: nowrap !important;
}

/* Dropdown should not affect header height/width */
.ms-primary-nav .sub-menu {
    position: absolute !important;
    top: calc(100% + 14px) !important;
    left: 50% !important;
    z-index: 99999 !important;

    display: block !important;
    min-width: 240px !important;
    width: max-content !important;
    max-width: 320px !important;

    margin: 0 !important;
    padding: 8px !important;
    list-style: none !important;

    background: #fffdf8 !important;
    border: 1px solid rgba(168, 85, 247, 0.3) !important;
    border-radius: 14px !important;
    box-shadow: 0 20px 50px rgba(16, 35, 45, 0.10) !important;

    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateX(-50%) translateY(8px) !important;

    transition: opacity 0.18s ease, visibility 0.18s ease, transform 0.18s ease !important;
}

/* Desktop dropdown hover */
@media (min-width: 1025px) {

    .ms-primary-nav>.ms-nav-list>.menu-item-has-children:hover>.sub-menu,
    .ms-primary-nav>.ms-nav-list>.menu-item-has-children:focus-within>.sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateX(-50%) translateY(0) !important;
    }
}

/* Dropdown item reset */
.ms-primary-nav .sub-menu .menu-item {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.ms-primary-nav .sub-menu .menu-item a {
    display: block !important;
    width: 100% !important;
    padding: 11px 14px !important;
    color: #c9c4d8 !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    border-radius: 10px !important;
}

.ms-primary-nav .sub-menu .menu-item a:hover {
    color: #ffffff !important;
    background: rgba(168, 85, 247, 0.12) !important;
}

/* Important: prevent generic ul rules from breaking submenu */
.ms-primary-nav ul.sub-menu {
    display: block !important;
}

/* Narrow desktop: reduce pressure before switching to drawer */
@media (min-width: 1440px) and (max-width: 1530px) {
    .ms-nav-container {
        gap: 10px !important;
        padding: 0 18px !important;
    }

    .ms-primary-nav>.ms-nav-list {
        gap: 8px !important;
    }

    .ms-primary-nav>.ms-nav-list>.menu-item>a {
        font-size: 11.25px !important;
    }

    .ms-logo-text {
        font-size: 14px !important;
    }
}

/* Tablet / small laptop should switch to drawer to avoid menu overlap */
@media (max-width: 1439px) {
    .ms-nav-container {
        display: flex !important;
        justify-content: space-between !important;
    }

    .ms-primary-nav {
        position: fixed !important;
        top: 68px !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: min(340px, 86vw) !important;
        height: calc(100vh - 68px) !important;
        display: none !important;
        padding: 22px !important;
        background: rgba(255, 253, 248, 0.98) !important;
        border-left: 1px solid rgba(20,45,50,.10) !important;
        overflow-y: auto !important;
        transform: translateX(100%) !important;
        transition: transform 0.25s ease !important;
        z-index: 1001 !important;
    }

    .ms-primary-nav.is-open {
        display: block !important;
        transform: translateX(0) !important;
    }

    .ms-primary-nav>.ms-nav-list {
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 4px !important;
        width: 100% !important;
    }

    .ms-primary-nav>.ms-nav-list>.menu-item {
        width: 100% !important;
    }

    .ms-primary-nav>.ms-nav-list>.menu-item>a {
        width: 100% !important;
        justify-content: space-between !important;
        padding: 12px 10px !important;
        font-size: 14px !important;
    }

    .ms-primary-nav .sub-menu {
        position: static !important;
        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 4px 0 8px !important;
        padding: 4px 0 4px 12px !important;
        background: transparent !important;
        border: 0 !important;
        border-left: 2px solid rgba(168, 85, 247, 0.45) !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
    }

    .ms-primary-nav .menu-item-has-children.mobile-open>.sub-menu,
    .ms-primary-nav .menu-item-has-children.mobile-dropdown-open>.sub-menu {
        display: block !important;
    }

    .ms-hamburger {
        display: flex !important;
    }

    .ms-nav-actions .ms-icon-btn,
    .ms-nav-actions .ms-btn-outline {
        display: none !important;
    }
}

/* ==========================================================================
   WIDE LAYOUT OVERRIDES (1500px SITE WIDTH)
   ========================================================================== */

/* 1. Global Container Update */
:root {
    --container-max: 1500px;
}

/* 2. Keep header aligned with the rest of the site */
.ms-nav-container {
    max-width: min(100%, 1600px) !important;
}

/* 3. Find Monitor Page Extra Width (1200px -> 1500px) */
.fm-inner {
    max-width: 1500px !important;
    /* Optional: Side bar ko thoda aur width de rahe hain wide screen ke hisaab se */
    grid-template-columns: 300px 1fr !important;
}

/* 4. Compare Builder & Versus Arena Extra Width */
.cmp-inner,
.cp-shell,
.comparison-spotlight-section {
    max-width: 1500px !important;
}

/* 5. Trending Hub Page Extra Width */
.ms-trending-inner {
    max-width: 1500px !important;
}

/* 6. Other Inner Sections (Blog, Latest Tools, Footers) */
.ms-single-inner,
.page-content-inner,
.lc-inner,
.lgr-inner,
.ecb-inner,
.dcc-inner,
.page-header__inner {
    max-width: var(--container-max) !important;
}

/* Footer Grid Adjustment for wide screens */
.ms-footer-grid {
    max-width: 1500px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 24px;
}

/* Adjust Find Monitor Grid on Ultra-Wide (Show 4 items instead of 3 if space allows) */
@media (min-width: 1400px) {
    .fm-monitors-grid {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

/* ==========================================================================
   GLOBAL MONITOR CARD + AMAZON CTA POLISH
   ========================================================================== */

#ms-engine-results {
    align-items: stretch;
}

.ms-global-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 100%;
    overflow: hidden;
    background:
        linear-gradient(180deg, #f1f5f1, rgba(255, 255, 255, 0.018)),
        #fffdf8;
    border: 1px solid rgba(148, 163, 184, 0.13);
    border-radius: 14px;
    box-shadow: 0 18px 44px rgba(16, 35, 45, .06);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.ms-global-card:hover {
    transform: translateY(-4px);
    border-color: rgba(168, 85, 247, 0.5);
    box-shadow: 0 24px 60px rgba(16, 35, 45, .10), 0 0 0 1px rgba(168, 85, 247, 0.08);
}

.ms-card-media {
    position: relative;
    display: block;
    height: 190px;
    margin: 18px 18px 0;
    overflow: hidden;
    background: #f8fafc;
    border: 1px solid #f1f5f1;
    border-radius: 10px;
    text-decoration: none;
}

.ms-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ms-card-placeholder {
    position: relative;
    display: grid;
    place-items: center;
    height: 100%;
    padding: 22px;
    color: #5b6870;
    text-align: center;
    background:
        radial-gradient(circle at 30% 18%, rgba(168, 85, 247, 0.18), transparent 32%),
        radial-gradient(circle at 78% 72%, rgba(56, 189, 248, 0.12), transparent 34%),
        linear-gradient(135deg, #090d15, #fffdf8);
}

.ms-card-placeholder strong {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 16px;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
}

.ms-card-monitor-illustration {
    position: relative;
    width: min(72%, 230px);
    aspect-ratio: 16 / 9;
    border: 2px solid rgba(168, 85, 247, 0.65);
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(135deg, rgba(15, 23, 42, 0.9), rgba(2, 6, 23, 0.9));
    background-size: 28px 28px, 28px 28px, auto;
    box-shadow: 0 0 40px rgba(168, 85, 247, 0.14);
}

.ms-card-monitor-illustration::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -24px;
    width: 42px;
    height: 24px;
    transform: translateX(-50%);
    background: #252b39;
    border-radius: 0 0 5px 5px;
}

.ms-card-monitor-illustration::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -34px;
    width: 120px;
    height: 12px;
    transform: translateX(-50%);
    background: #252b39;
    border-radius: 999px;
}

.ms-card-score {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 5px 9px;
    color: #03120b;
    background: #22c55e;
    border-radius: 999px;
    box-shadow: 0 8px 20px rgba(34, 197, 94, 0.28);
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.ms-card-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    padding: 16px 18px 14px;
}

.ms-card-rating-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 22px;
    margin-bottom: 10px;
}

.ms-card-rating-row strong {
    color: #f8fafc;
    font-size: 13px;
    font-weight: 900;
}

.ms-card-rating-row > span:last-child {
    color: #5b6870;
    font-size: 11px;
    font-weight: 700;
}

.ms-star-rating {
    position: relative;
    display: inline-block;
    width: 74px;
    height: 16px;
    color: rgba(148, 163, 184, 0.34);
    font-size: 15px;
    line-height: 16px;
    letter-spacing: 1px;
    white-space: nowrap;
}

.ms-stars-base,
.ms-stars-fill {
    position: absolute;
    inset: 0 auto auto 0;
    display: block;
    overflow: hidden;
}

.ms-stars-fill {
    color: #f59e0b;
    text-shadow: 0 0 12px rgba(245, 158, 11, 0.28);
}

.ms-card-title {
    min-height: 46px;
    margin: 0 0 12px;
    font-size: 17px;
    font-weight: 850;
    line-height: 1.35;
    letter-spacing: 0;
}

.ms-card-title a {
    color: #f8fafc;
    text-decoration: none;
}

.ms-card-title a:hover {
    color: #ffffff;
}

.ms-card-specs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 12px;
}

.ms-card-specs span {
    display: inline-flex;
    align-items: center;
    min-height: 23px;
    padding: 4px 8px;
    color: #b6c1d2;
    background: rgba(148, 163, 184, 0.09);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
}

.ms-card-rating-breakdown {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin: 0 0 14px;
}

.ms-card-rating-breakdown span {
    min-width: 0;
    padding: 6px 7px;
    color: #a8b3c7;
    background: rgba(15, 23, 42, 0.72);
    border: 1px solid rgba(148, 163, 184, 0.1);
    border-radius: 7px;
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.ms-card-price-row {
    margin-top: auto;
    margin-bottom: 14px;
}

.ms-card-price {
    color: #a855f7;
    font-size: 21px;
    font-weight: 950;
    line-height: 1;
}

.ms-card-actions {
    display: grid;
    grid-template-columns: 1fr 0.82fr;
    gap: 9px;
}

.ms-card-secondary,
.ms-card-compare {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.1;
    text-align: center;
    text-decoration: none;
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.ms-card-secondary {
    color: #e5e7eb;
    background: rgba(20,45,50,.10);
    border: 1px solid rgba(20,45,50,.10);
}

.ms-card-secondary:hover {
    color: #102027;
    background: rgba(255, 255, 255, 0.11);
}

.ms-card-compare {
    color: #38bdf8;
    background: rgba(14, 165, 233, 0.13);
    border: 1px solid rgba(56, 189, 248, 0.12);
}

.ms-card-compare:hover {
    color: #7dd3fc;
    background: rgba(14, 165, 233, 0.2);
}

.ms-card-footer {
    display: grid;
    grid-template-columns: auto minmax(132px, 1fr);
    align-items: center;
    gap: 12px;
    padding: 14px 18px 18px;
    background: rgba(16, 35, 45, .06);
    border-top: 1px solid rgba(20,45,50,.10);
}

.ms-card-votes {
    display: flex;
    gap: 7px;
}

.ms-vote-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 39px;
    height: 32px;
    padding: 0 9px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.ms-vote-btn[data-type="up"] {
    color: #34d399;
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.28);
}

.ms-vote-btn[data-type="down"] {
    color: #f87171;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.24);
}

.ms-vote-btn:hover {
    transform: translateY(-1px);
}

.ms-vote-btn .v-count {
    margin-left: 4px;
}

.ms-amazon-btn,
.cmp-btn-amazon,
.single-monitor a[href*="amazon."],
.ms-global-card a[href*="amazon."] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    padding: 10px 16px;
    color: #1a1000 !important;
    background: linear-gradient(180deg, #ffb423, #f59e0b) !important;
    border: 1px solid rgba(255, 194, 73, 0.72) !important;
    border-radius: 10px;
    box-shadow: 0 12px 26px rgba(245, 158, 11, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.35);
    font-size: 12px;
    font-weight: 950;
    line-height: 1.05;
    text-align: center;
    text-decoration: none !important;
    text-transform: none;
    transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.ms-amazon-btn span {
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    opacity: 0.78;
}

.ms-amazon-btn strong {
    display: block;
    font-size: 12px;
    font-weight: 950;
    white-space: nowrap;
}

.ms-amazon-btn:hover,
.cmp-btn-amazon:hover,
.single-monitor a[href*="amazon."]:hover,
.ms-global-card a[href*="amazon."]:hover {
    transform: translateY(-2px);
    filter: saturate(1.08);
    box-shadow: 0 16px 34px rgba(245, 158, 11, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.ms-single-rating-panel {
    display: inline-flex;
    flex-direction: column;
    gap: 10px;
    width: min(100%, 560px);
    margin: 0 0 22px;
    padding: 14px 16px;
    background: rgba(15, 23, 42, 0.68);
    border: 1px solid rgba(245, 158, 11, 0.18);
    border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.ms-single-rating-main {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #f8fafc;
}

.ms-single-rating-main strong {
    font-size: 18px;
    font-weight: 950;
}

.ms-single-rating-main span {
    color: #5b6870;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.ms-single-rating-parts {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.ms-single-rating-parts span {
    padding: 6px 8px;
    color: #334155;
    background: #f1f5f1;
    border: 1px solid rgba(20,45,50,.10);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 850;
}


@media (max-width: 640px) {
    .ms-card-media {
        height: 170px;
        margin: 14px 14px 0;
    }

    .ms-card-body {
        padding: 15px 14px 13px;
    }

    .ms-card-footer {
        grid-template-columns: 1fr;
        padding: 13px 14px 15px;
    }

    .ms-amazon-btn {
        width: 100%;
    }
}
.ms-card-rating-breakdown b,
.ms-single-rating-parts b,
.ms-trend-rating-breakdown b {
    color: #f8fafc;
    font-weight: 950;
}

.ms-trend-rating-row,
.cmp-rating-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 10px 0 7px;
    min-height: 22px;
}

.ms-trend-rating-row strong,
.cmp-rating-row strong {
    color: #f8fafc;
    font-size: 13px;
    font-weight: 950;
}

.ms-trend-rating-row .ms-rating-vote-total,
.cmp-rating-row .ms-rating-vote-total,
.ms-single-rating-main .ms-rating-vote-total {
    color: #5b6870;
    font-size: 11px;
    font-weight: 800;
    text-transform: none;
}

.ms-trend-rating-breakdown {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}

.ms-trend-rating-breakdown span {
    padding: 5px 7px;
    color: #334155;
    background: #f1f5f1;
    border: 1px solid rgba(20,45,50,.10);
    border-radius: 999px;
    font-size: 10px;
    font-weight: 850;
}

.ms-brand-stars {
    transform: scale(0.92);
    transform-origin: center right;
}

.ms-single-votes {
    justify-content: flex-start;
}

/* Dynamic three-monitor homepage spotlight */
.spotlight-table--three .spotlight-row--three {
    grid-template-columns: minmax(150px, 1.05fr) repeat(3, minmax(180px, 1fr)) minmax(150px, .8fr);
    column-gap: 12px;
}

.spotlight-table--three .col-mon {
    justify-content: center;
    gap: 8px;
    text-align: center;
    min-width: 0;
}

.spotlight-table--three .col-mon.is-best {
    color: #d1fae5;
}

.spotlight-monitor-img {
    height: 92px;
    max-width: 150px;
    width: auto;
    object-fit: contain;
    margin-bottom: 14px;
}

.spotlight-monitor-placeholder {
    width: 150px;
    height: 92px;
    margin-bottom: 14px;
    border-radius: 8px;
    border: 1px solid rgba(167, 139, 250, .35);
    background: linear-gradient(135deg, rgba(56, 189, 248, .10), rgba(168, 85, 247, .12));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #5b6870;
    font-size: 11px;
    text-align: center;
    padding: 8px;
}

.spotlight-table--three .table-header-row .col-mon {
    padding-inline: 8px;
}

.spotlight-table--three .col-mon h3 {
    max-width: 190px;
    line-height: 1.25;
}

@media (max-width: 1100px) {
    .spotlight-table--three {
        overflow-x: auto;
    }
    .spotlight-table--three .spotlight-row--three {
        min-width: 980px;
    }
}

@media (max-width: 640px) {
    .spotlight-table--three .spotlight-row--three {
        grid-template-columns: minmax(130px, 1fr) repeat(3, minmax(150px, 1fr)) minmax(120px, .8fr);
        min-width: 820px;
    }
    .spotlight-table--three .col-better {
        display: block;
        text-align: right;
    }
    .spotlight-monitor-img,
    .spotlight-monitor-placeholder {
        width: 120px;
        height: 74px;
    }
}
/* Mobile polish pass: header hamburger + Community/Brands homepage block */
.ms-hamburger {
    position: relative;
    align-items: center;
    justify-content: center;
    overflow: visible;
    transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.ms-hamburger::before {
    content: "";
    position: absolute;
    inset: -4px;
    border-radius: 12px;
    background: radial-gradient(circle, rgba(168, 85, 247, .20), transparent 68%);
    opacity: 0;
    transform: scale(.82);
    transition: opacity .24s ease, transform .24s ease;
    pointer-events: none;
}

.ms-hamburger:hover,
.ms-hamburger.is-open {
    color: #102027;
    background: rgba(168, 85, 247, .10);
    box-shadow: 0 0 0 1px rgba(168, 85, 247, .22), 0 0 22px rgba(168, 85, 247, .16);
}

.ms-hamburger.is-open::before {
    opacity: 1;
    transform: scale(1);
    animation: msMenuPulse 1.4s ease-in-out infinite;
}

.ms-hamburger-bar {
    transform-origin: center;
    transition: transform .24s cubic-bezier(.2, .8, .2, 1), opacity .18s ease, width .22s ease, background .22s ease;
}

.ms-hamburger.is-open .ms-hamburger-bar:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.ms-hamburger.is-open .ms-hamburger-bar:nth-child(2) {
    opacity: 0;
    width: 8px;
    transform: scaleX(.2);
}

.ms-hamburger.is-open .ms-hamburger-bar:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

@keyframes msMenuPulse {
    0%, 100% { opacity: .35; transform: scale(.95); }
    50% { opacity: .9; transform: scale(1.06); }
}

@media (max-width: 767px) {
    .ms-header {
        height: 68px !important;
    }

    .ms-nav-container {
        padding: 0 16px !important;
        gap: 10px !important;
    }

    .ms-logo {
        max-width: 170px !important;
        min-width: 0 !important;
    }

    .ms-logo-text {
        font-size: 14px !important;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .ms-nav-actions {
        gap: 8px !important;
        min-width: 0 !important;
    }

    .ms-nav-actions .rs-switcher {
        min-width: 96px !important;
        max-width: 106px !important;
        height: 36px !important;
        padding: 0 9px !important;
        flex-shrink: 0 !important;
    }

    .ms-hamburger {
        width: 38px !important;
        height: 38px !important;
        flex: 0 0 38px !important;
        border-radius: 10px !important;
    }

    .ms-community-hub {
        padding: 44px 14px !important;
    }

    .ms-community-duo {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 18px !important;
        margin-bottom: 22px !important;
        width: 100% !important;
    }

    .ms-community-panel,
    .ms-brand-panel {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding: 20px !important;
        border-radius: 16px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .ms-community-panel > div:first-child {
        align-items: flex-start !important;
        margin-bottom: 18px !important;
    }

    .ms-community-panel h2,
    .ms-brand-panel h2 {
        font-size: 26px !important;
        line-height: 1.12 !important;
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
    }

    .ms-community-panel a,
    .ms-brand-panel a {
        max-width: 100%;
    }

    .ms-community-tracker {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        margin-bottom: 12px !important;
    }

    .ms-community-stat,
    .ms-community-meter,
    .ms-community-status-pill {
        min-width: 0 !important;
        padding: 14px !important;
        box-sizing: border-box !important;
    }

    .ms-community-stat strong {
        font-size: 25px !important;
    }

    .ms-community-stat span,
    .ms-community-meter-top span,
    .ms-community-status-pill span {
        font-size: 10px !important;
        line-height: 1.35 !important;
        overflow-wrap: anywhere !important;
    }

    .ms-community-meter {
        grid-column: 1 / -1 !important;
    }

    .ms-community-status-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .ms-community-status-pill {
        align-items: flex-start !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
    }

    .ms-brand-panel p {
        font-size: 15px !important;
        line-height: 1.65 !important;
    }

    .ms-brand-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .ms-brand-stat-grid > div {
        min-width: 0 !important;
        padding: 14px !important;
        box-sizing: border-box !important;
    }

    .ms-suggest-cta-band {
        padding: 24px 20px !important;
        align-items: flex-start !important;
    }

    .ms-suggest-cta-band a {
        width: 100% !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }
}

/* v59 Refresh Rate Guide visual demo */
.ms-refresh-visual {
    max-width: 1050px;
    margin: 0 auto 48px;
    padding: clamp(22px, 4vw, 36px);
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 18px;
    background:
        radial-gradient(circle at 12% 0, rgba(245, 158, 11, .16), transparent 34%),
        linear-gradient(145deg, #ffffff, #f8fafc);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .08);
    overflow: hidden;
}

.ms-refresh-visual__copy {
    max-width: 780px;
    margin-bottom: 24px;
}

.ms-refresh-visual__copy span {
    color: #b45309;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.ms-refresh-visual__copy h2 {
    margin: 8px 0 10px;
    color: #0f172a;
    font-size: clamp(26px, 4vw, 42px);
    line-height: 1.08;
    letter-spacing: 0;
}

.ms-refresh-visual__copy p {
    margin: 0;
    color: #475569;
    font-size: 16px;
    line-height: 1.75;
}

.ms-refresh-visual__stage {
    display: grid;
    gap: 16px;
}

.ms-refresh-visual__lane {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
}

.ms-refresh-visual__label strong,
.ms-refresh-visual__label small {
    display: block;
}

.ms-refresh-visual__label strong {
    color: #102027;
    font-size: 22px;
    font-weight: 950;
}

.ms-refresh-visual__label small {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
}

.ms-refresh-visual__track {
    position: relative;
    min-height: 54px;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 14px;
    background: repeating-linear-gradient(90deg, rgba(148, 163, 184, .15) 0 1px, transparent 1px 11%);
    overflow: hidden;
}

.ms-refresh-visual__track > span {
    position: absolute;
    top: 12px;
    bottom: 12px;
    width: 2px;
    border-radius: 99px;
    background: rgba(15, 23, 42, .08);
}

.ms-refresh-visual__track > span:nth-of-type(1) { left: 18%; }
.ms-refresh-visual__track > span:nth-of-type(2) { left: 34%; }
.ms-refresh-visual__track > span:nth-of-type(3) { left: 50%; }
.ms-refresh-visual__track > span:nth-of-type(4) { left: 66%; }
.ms-refresh-visual__track > span:nth-of-type(5) { left: 82%; }

.ms-refresh-visual__dot {
    position: absolute;
    top: 50%;
    left: 12px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    transform: translateY(-50%);
    background: linear-gradient(135deg, #14b8a6, #8b5cf6);
    box-shadow: 0 0 0 8px rgba(20, 184, 166, .12), 0 10px 24px rgba(15, 23, 42, .18);
    animation: ms-refresh-run 2.4s linear infinite;
}

.ms-refresh-visual__dot--60 {
    animation-timing-function: steps(6, end);
    opacity: .78;
}

.ms-refresh-visual__dot--144 {
    animation-timing-function: steps(14, end);
}

.ms-refresh-visual__dot--240 {
    animation-timing-function: linear;
}

.ms-refresh-visual__frames {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 22px;
}

.ms-refresh-visual__frames > div {
    padding: 14px;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 12px;
    background: rgba(255, 255, 255, .82);
}

.ms-refresh-visual__frames strong,
.ms-refresh-visual__frames small {
    display: block;
}

.ms-refresh-visual__frames strong {
    color: #0f172a;
    font-size: 15px;
    font-weight: 950;
}

.ms-refresh-visual__frames span {
    display: block;
    height: 34px;
    margin: 10px 0;
    border-radius: 9px;
    background: repeating-linear-gradient(90deg, #14b8a6 0 5px, transparent 5px calc(100% / var(--bars)));
    background-color: #ecfeff;
    border: 1px solid rgba(20, 184, 166, .18);
}

.ms-refresh-visual__frames small {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
}

@keyframes ms-refresh-run {
    from { left: 12px; }
    to { left: calc(100% - 34px); }
}

@media (max-width: 767px) {
    .ms-refresh-visual {
        padding: 18px;
        border-radius: 14px;
    }

    .ms-refresh-visual__lane {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .ms-refresh-visual__track {
        min-height: 50px;
    }

    .ms-refresh-visual__frames {
        grid-template-columns: 1fr;
    }

}

@media (prefers-reduced-motion: reduce) {
    .ms-refresh-visual__dot {
        animation-duration: 8s;
    }
}

@media (max-width: 420px) {
    .ms-community-hub {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .ms-community-panel,
    .ms-brand-panel {
        padding: 18px !important;
    }

    .ms-community-tracker,
    .ms-community-status-row,
    .ms-brand-stat-grid {
        grid-template-columns: 1fr !important;
    }

    .ms-brand-panel h2,
    .ms-community-panel h2 {
        font-size: 25px !important;
    }
}
/* =============================================================
   PREMIUM LIGHT THEME OVERRIDE - VISUAL LAYER ONLY
   This block intentionally changes colors, spacing, cards, shadows,
   and responsive polish without touching WordPress/PHP logic.
   ============================================================= */
:root {
    --color-bg-base: #fbfbff;
    --color-bg-header: rgba(255, 255, 255, 0.88);
    --color-bg-card: #ffffff;
    --color-bg-card-hover: #fff8fb;
    --color-border: rgba(19, 34, 61, 0.09);
    --color-border-hover: rgba(255, 91, 111, 0.32);
    --color-text-primary: #121a2f;
    --color-text-secondary: #54617d;
    --color-text-muted: #8792aa;
    --color-accent: #ff4f7b;
    --color-accent-dark: #a855f7;
    --color-accent-glow: rgba(255, 79, 123, 0.18);
    --color-neon-blue: #3b82f6;
    --color-neon-pink: #ec4899;
    --gradient-accent: linear-gradient(135deg, #ff7a45 0%, #ff4f7b 48%, #a855f7 100%);
    --gradient-hero: linear-gradient(135deg, #ff7a45 0%, #ff4f7b 45%, #a855f7 100%);
    --shadow-header: 0 1px 0 rgba(19, 34, 61, 0.06), 0 18px 50px rgba(24, 39, 75, 0.08);
    --shadow-glow: 0 18px 45px rgba(255, 79, 123, 0.22);
    --shadow-soft-card: 0 18px 50px rgba(24, 39, 75, 0.08), 0 2px 8px rgba(24, 39, 75, 0.04);
    --shadow-soft-card-hover: 0 26px 70px rgba(24, 39, 75, 0.13), 0 6px 16px rgba(255, 79, 123, 0.08);
}

html,
body {
    background: #fbfbff !important;
    color: #121a2f !important;
}

body {
    background:
        radial-gradient(circle at 78% 9%, rgba(255, 224, 236, .92), transparent 24%),
        radial-gradient(circle at 10% 34%, rgba(237, 245, 255, .96), transparent 28%),
        linear-gradient(180deg, #ffffff 0%, #fbfbff 42%, #f8fbff 100%) !important;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image:
        radial-gradient(circle at 18% 18%, rgba(255, 111, 97, .10) 0 2px, transparent 3px),
        radial-gradient(circle at 86% 22%, rgba(168, 85, 247, .10) 0 2px, transparent 3px),
        radial-gradient(circle at 72% 70%, rgba(59, 130, 246, .08) 0 2px, transparent 3px);
}

.ms-header {
    background: rgba(255, 255, 255, .90) !important;
    border-bottom: 1px solid rgba(19, 34, 61, .08) !important;
    box-shadow: 0 12px 35px rgba(24, 39, 75, .07) !important;
    backdrop-filter: blur(18px) saturate(1.3) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.3) !important;
}

.ms-header.is-scrolled {
    background: rgba(255, 255, 255, .96) !important;
    border-bottom-color: rgba(255, 79, 123, .14) !important;
}

.ms-logo-text,
.ms-primary-nav > .ms-nav-list > .menu-item > a,
.ms-nav-link {
    color: #16213d !important;
}

.ms-primary-nav > .ms-nav-list > .menu-item > a:hover,
.ms-primary-nav > .ms-nav-list > .current-menu-item > a,
.ms-primary-nav > .ms-nav-list > .current-menu-ancestor > a {
    color: #ff4f7b !important;
}

.ms-icon-btn,
.ms-btn-outline,
.rs-switcher,
.ms-hamburger {
    background: rgba(255, 255, 255, .88) !important;
    border: 1px solid rgba(19, 34, 61, .10) !important;
    color: #263653 !important;
    box-shadow: 0 8px 20px rgba(24, 39, 75, .06) !important;
}

.ms-btn-outline:hover,
.ms-icon-btn:hover,
.ms-hamburger:hover,
.ms-hamburger.is-open {
    border-color: rgba(255, 79, 123, .35) !important;
    color: #ff4f7b !important;
    background: #fff7fb !important;
    box-shadow: 0 14px 34px rgba(255, 79, 123, .14) !important;
}

.rs-switcher::after,
.rs-active-flag {
    color: #8b3ff6 !important;
}

.ms-primary-nav .sub-menu {
    background: #ffffff !important;
    border-color: rgba(19, 34, 61, .10) !important;
    box-shadow: 0 24px 70px rgba(24, 39, 75, .16) !important;
}

.ms-primary-nav .sub-menu .menu-item a {
    color: #4f5f7b !important;
}

.ms-primary-nav .sub-menu .menu-item a:hover {
    color: #ff4f7b !important;
    background: #fff2f7 !important;
}

.ms-hero,
#ms-hero {
    background:
        radial-gradient(circle at 78% 36%, rgba(255, 228, 236, .95), transparent 31%),
        radial-gradient(circle at 55% 58%, rgba(239, 246, 255, .9), transparent 29%),
        linear-gradient(180deg, #ffffff 0%, #fbfbff 100%) !important;
}

.ms-hero-title,
.ms-section-title,
.spotlight-titles h2,
.lc-title,
.lgr-title,
.ecb-title,
.ms-filter-title,
.ms-card-title,
.ms-trend-title,
.ms-shopcat-name,
.ms-community-panel h2,
.ms-brand-panel h2,
.page-header h1,
h1,
h2,
h3 {
    color: #121a2f !important;
    text-shadow: none !important;
}

.ms-hero-title-accent,
.ms-filter-eyebrow,
.ms-hero-eyebrow,
.ms-trending-flame,
.lc-eyebrow,
.lgr-eyebrow,
.ms-community-panel span[style*="text-transform"],
.ms-brand-panel > span,
.ms-section-link {
    color: #ff4f7b !important;
}

.ms-hero-title-accent,
.spotlight-titles h2 {
    background: linear-gradient(135deg, #ff7a45, #ff4f7b 48%, #8b5cf6) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.ms-hero-desc,
.ms-filter-desc,
.ms-section-subtitle,
.ms-shopcat-sub,
.ms-trend-rating-breakdown,
.lc-card-link,
.lgr-card-excerpt,
.ecb-subtitle,
.ms-community-panel p,
.ms-brand-panel p,
.page-header p,
p {
    color: #61708f !important;
}

.ms-btn-primary,
.ms-filter-submit,
.btn-compare,
.ecb-btn,
.ms-amazon-btn,
.ms-buy,
.ms-card-compare,
.ms-suggest-cta-band a,
.ms-brand-panel > a,
.lgr-view-all,
.lc-view-all {
    background: var(--gradient-accent) !important;
    border: 0 !important;
    color: #ffffff !important;
    box-shadow: 0 16px 34px rgba(255, 79, 123, .24) !important;
}

.ms-btn-primary:hover,
.ms-filter-submit:hover,
.btn-compare:hover,
.ecb-btn:hover,
.ms-card-compare:hover,
.ms-suggest-cta-band a:hover,
.ms-brand-panel > a:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 22px 46px rgba(255, 79, 123, .30) !important;
}

.ms-btn-secondary,
.ms-card-secondary,
.ms-filter-reset {
    color: #243550 !important;
    background: #ffffff !important;
    border: 1px solid rgba(19, 34, 61, .12) !important;
    box-shadow: 0 10px 24px rgba(24, 39, 75, .06) !important;
}

.ms-filter-section,
.ms-trending-section,
.ms-shopcat-section,
.comparison-spotlight-section,
.lc-section,
.lgr-section,
.ecb-section,
.ms-community-hub,
main,
.page-header {
    background: transparent !important;
}

.ms-filter-card,
.ms-global-card,
.ms-trend-card-inner,
.ms-shopcat-inner,
.spotlight-table,
.lc-card,
.lgr-card,
.ecb-inner,
.ms-community-panel,
.ms-brand-panel,
.glass-panel,
.ms-suggest-cta-band,
.amz-card,
.cmp-card,
.fm-card,
.ms-single-rating-panel,
.ms-frame,
.ms-content-card,
.ms-spec-table,
.ms-article,
.ms-faq-section,
.ms-page-card {
    background: rgba(255, 255, 255, .94) !important;
    border: 1px solid rgba(19, 34, 61, .08) !important;
    box-shadow: var(--shadow-soft-card) !important;
    color: #121a2f !important;
}

.ms-global-card:hover,
.ms-trend-card-inner:hover,
.ms-shopcat-inner:hover,
.lc-card:hover,
.lgr-card:hover,
.ms-filter-card:hover {
    border-color: rgba(255, 79, 123, .22) !important;
    box-shadow: var(--shadow-soft-card-hover) !important;
    transform: translateY(-3px) !important;
}

.ms-filter-card {
    border-radius: 22px !important;
    padding: 28px !important;
}

.ms-filter-label,
.ms-card-title a,
.ms-card-price,
.ms-trend-price,
.ms-rating-value,
.ms-community-stat strong,
.ms-community-status-pill strong,
.ms-brand-stat-grid strong,
.col-mon,
.col-spec,
.score-badge {
    color: #15223b !important;
}

.ms-filter-select,
.amz-inp,
.ecb-input,
input,
select,
textarea {
    background: #ffffff !important;
    border: 1px solid rgba(19, 34, 61, .12) !important;
    color: #15223b !important;
    box-shadow: 0 8px 18px rgba(24, 39, 75, .04) !important;
}

.ms-filter-select:focus,
.amz-inp:focus,
.ecb-input:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: rgba(255, 79, 123, .45) !important;
    box-shadow: 0 0 0 4px rgba(255, 79, 123, .10) !important;
}

.ms-filter-footer,
.ms-section-header,
.spotlight-row,
.table-header-row,
.table-footer-row {
    border-color: rgba(19, 34, 61, .08) !important;
}

.ms-filter-hint,
.ms-results-count,
.ms-card-specs span,
.ms-trend-spec,
.ms-shopcat-count,
.ms-community-stat span,
.ms-community-meter-top span,
.ms-community-status-pill span,
.ms-rating-vote-total,
.col-better,
.ms-card-rating-breakdown span {
    color: #7a89a6 !important;
}

.ms-card-specs span,
.ms-trend-spec,
.ms-shopcat-icon--text,
.preset-pill span,
.ms-card-votes button,
.ms-vote-btn,
.ms-community-stat,
.ms-community-meter,
.ms-community-status-pill,
.ms-brand-stat-grid > div,
.ms-card-footer,
.ms-card-placeholder,
.ms-trend-img,
.spotlight-monitor-placeholder {
    background: #f7f9ff !important;
    border-color: rgba(19, 34, 61, .08) !important;
    color: #253754 !important;
}

.ms-shopcat-inner {
    border-radius: 18px !important;
    background: linear-gradient(180deg, #ffffff, #fbfcff) !important;
}

.ms-shopcat-card:nth-child(1) .ms-shopcat-inner { box-shadow: 0 18px 40px rgba(236, 72, 153, .10) !important; }
.ms-shopcat-card:nth-child(2) .ms-shopcat-inner { box-shadow: 0 18px 40px rgba(20, 184, 166, .10) !important; }
.ms-shopcat-card:nth-child(3) .ms-shopcat-inner { box-shadow: 0 18px 40px rgba(168, 85, 247, .10) !important; }
.ms-shopcat-card:nth-child(4) .ms-shopcat-inner { box-shadow: 0 18px 40px rgba(255, 79, 123, .10) !important; }
.ms-shopcat-card:nth-child(5) .ms-shopcat-inner { box-shadow: 0 18px 40px rgba(59, 130, 246, .10) !important; }
.ms-shopcat-card:nth-child(6) .ms-shopcat-inner { box-shadow: 0 18px 40px rgba(249, 115, 22, .10) !important; }
.ms-shopcat-card:nth-child(7) .ms-shopcat-inner { box-shadow: 0 18px 40px rgba(99, 102, 241, .10) !important; }
.ms-shopcat-card:nth-child(8) .ms-shopcat-inner { box-shadow: 0 18px 40px rgba(139, 92, 246, .10) !important; }

.ms-trend-rank,
.vs-badge,
.ms-card-score,
.score-badge,
.lgr-tag,
.ms-card-compare {
    background: var(--gradient-accent) !important;
    color: #ffffff !important;
    border: 0 !important;
}

.ms-stars-base {
    color: #e7ebf3 !important;
}

.ms-stars-fill,
.ms-rating-stars,
.stars {
    color: #ffb020 !important;
}

.ms-card-media,
.ms-trend-img,
.lgr-thumb,
.lc-mon-thumb,
.spotlight-monitor-placeholder {
    background:
        radial-gradient(circle at 78% 20%, rgba(255, 79, 123, .16), transparent 34%),
        radial-gradient(circle at 20% 88%, rgba(59, 130, 246, .12), transparent 34%),
        #f8fbff !important;
}

.comparison-spotlight-section,
.lc-section,
.lgr-section,
.ecb-section {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.spotlight-table {
    background: #ffffff !important;
    border-radius: 18px !important;
    overflow: hidden !important;
}

.spotlight-row:hover {
    background: #fff8fb !important;
}

.col-better.trophy,
.check-icon {
    color: #ff9f1c !important;
    text-shadow: none !important;
}

.ecb-inner {
    background:
        linear-gradient(135deg, rgba(255, 126, 69, .14), rgba(236, 72, 153, .12), rgba(168, 85, 247, .12)),
        #ffffff !important;
    border-radius: 22px !important;
}

.ms-community-hub {
    background:
        linear-gradient(180deg, rgba(249, 250, 255, .72), rgba(255, 255, 255, .94)) !important;
    border-top: 1px solid rgba(19, 34, 61, .06) !important;
}

.ms-community-panel {
    border-color: rgba(16, 185, 129, .18) !important;
}

.ms-brand-panel {
    border-color: rgba(59, 130, 246, .18) !important;
}

.ms-suggest-cta-band {
    background:
        linear-gradient(135deg, rgba(255, 126, 69, .12), rgba(236, 72, 153, .10), rgba(168, 85, 247, .10)),
        #ffffff !important;
}

.ms-mobile-overlay {
    background: rgba(18, 26, 47, .28) !important;
    backdrop-filter: blur(8px) !important;
}

@media (max-width: 1439px) {
    .ms-primary-nav {
        background: rgba(255, 255, 255, .98) !important;
        border-left: 1px solid rgba(19, 34, 61, .08) !important;
        box-shadow: -24px 0 70px rgba(24, 39, 75, .18) !important;
    }

    .ms-primary-nav > .ms-nav-list > .menu-item > a {
        color: #1b2a47 !important;
        border-bottom: 1px solid rgba(19, 34, 61, .06) !important;
    }

    .ms-primary-nav .sub-menu {
        background: #f8faff !important;
        border-left-color: rgba(255, 79, 123, .38) !important;
    }
}

@media (max-width: 767px) {
    body {
        background: linear-gradient(180deg, #ffffff 0%, #fbfbff 45%, #f8fbff 100%) !important;
    }

    .ms-hero-title {
        font-size: clamp(40px, 12vw, 62px) !important;
    }

    .ms-filter-card,
    .ms-community-panel,
    .ms-brand-panel,
    .spotlight-table,
    .ecb-inner,
    .glass-panel,
    .ms-suggest-cta-band {
        border-radius: 18px !important;
    }

    .ms-trend-card-inner,
    .ms-shopcat-inner,
    .ms-global-card {
        border-radius: 16px !important;
    }
}
/* =========================================================
   LIGHT THEME HARDENING + HERO MONITOR ARTWORK
   Visual layer only: no PHP, CPT, AJAX, or data logic changed.
   ========================================================= */
:root {
    --ms-ink: #10182f;
    --ms-ink-2: #263653;
    --ms-muted-strong: #5f6f8e;
    --ms-soft-line: rgba(20, 31, 56, .10);
    --ms-soft-card: #ffffff;
    --ms-soft-bg: #f7f9ff;
    --ms-coral: #ff5f73;
    --ms-orange: #ff8a3d;
    --ms-purple: #a855f7;
    --ms-blue: #4f8cff;
    --ms-green: #10b981;
    --gradient-accent: linear-gradient(135deg, var(--ms-orange) 0%, var(--ms-coral) 48%, var(--ms-purple) 100%) !important;
    --gradient-hero: linear-gradient(135deg, var(--ms-orange) 0%, var(--ms-coral) 45%, var(--ms-purple) 100%) !important;
    --shadow-soft-card: 0 18px 48px rgba(23, 35, 64, .10) !important;
    --shadow-soft-card-hover: 0 26px 68px rgba(23, 35, 64, .15) !important;
}

html,
body,
#page,
.site,
.site-content,
.ms-page,
.ms-site,
.ms-main,
main,
article,
.archive,
.single-monitor,
.category,
.search,
.blog {
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 36%, #f7f9ff 100%) !important;
    color: var(--ms-ink) !important;
}

body::before,
body::after,
.ms-hero::before,
.ms-hero::after,
.ms-bg-grid,
.ms-grid-bg,
.page-bg,
.theme-bg,
.legacy-bg {
    opacity: .34 !important;
    background-image:
        radial-gradient(circle at 10% 18%, rgba(255, 95, 115, .10) 0 2px, transparent 3px),
        radial-gradient(circle at 82% 16%, rgba(168, 85, 247, .10) 0 2px, transparent 3px),
        radial-gradient(circle at 70% 76%, rgba(79, 140, 255, .08) 0 2px, transparent 3px) !important;
}

/* Replace the old animated SVG hero visual with a premium monitor image card. */
.ms-hero-inner {
    align-items: center !important;
    gap: clamp(36px, 5vw, 82px) !important;
}

.ms-hero-visual {
    min-height: clamp(340px, 34vw, 560px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    isolation: isolate !important;
}

.ms-hero-visual::before {
    content: "" !important;
    position: absolute !important;
    inset: -8% -3% -4% -8% !important;
    z-index: 0 !important;
    background:
        radial-gradient(circle at 56% 48%, rgba(255, 95, 115, .16), transparent 31%),
        radial-gradient(circle at 74% 28%, rgba(168, 85, 247, .18), transparent 32%),
        radial-gradient(circle at 30% 76%, rgba(255, 138, 61, .13), transparent 26%) !important;
    filter: blur(2px) !important;
    pointer-events: none !important;
}

.ms-hero-monitor-wrap {
    position: relative !important;
    z-index: 1 !important;
    width: min(100%, 760px) !important;
    min-height: clamp(320px, 32vw, 520px) !important;
    transform: none !important;
}

.ms-hero-monitor-wrap::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 3 !important;
    background-image: none !important;
    background-repeat: no-repeat !important;
    background-position: center right !important;
    background-size: contain !important;
    filter: drop-shadow(0 34px 46px rgba(23, 35, 64, .18)) !important;
    transform: translateY(4px) !important;
}

.ms-hero-monitor-wrap::after {
    content: "" !important;
    position: absolute !important;
    left: 10% !important;
    right: 4% !important;
    bottom: 6% !important;
    height: 16% !important;
    z-index: 1 !important;
    background: radial-gradient(ellipse, rgba(255, 95, 115, .22), transparent 68%) !important;
    filter: blur(14px) !important;
}

.ms-hero-monitor,
.ms-hero-monitor--primary,
.ms-hero-monitor--secondary,
.ms-hero-svg-monitor,
.ms-hero-monitor-svg,
.ms-hero-glow-orb {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    animation: none !important;
}

.ms-hero-copy {
    z-index: 2 !important;
}

.ms-hero-title,
.ms-hero-heading,
.entry-title,
.page-title,
.archive-title,
.ms-section-title,
.ms-heading,
h1,
h2,
h3,
h4 {
    color: var(--ms-ink) !important;
    text-shadow: none !important;
    letter-spacing: 0 !important;
}

.ms-hero-title-accent,
.ms-hero-heading-accent,
.text-gradient,
.gradient-text,
.ms-gradient-text {
    background: var(--gradient-hero) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
}

p,
li,
.ms-hero-desc,
.ms-section-subtitle,
.ms-card-desc,
.ms-card-meta,
.ms-filter-help,
.ms-small-text,
.ms-muted,
.ms-copy,
.excerpt,
.entry-content,
.entry-content p,
.ms-faq-answer,
.ms-article p,
.ms-article li {
    color: var(--ms-muted-strong) !important;
    text-shadow: none !important;
}

/* Broad cleanup for any legacy panels still coming from legacy selectors or inline section styles. */
[class*="card"],
[class*="panel"],
[class*="box"],
[class*="table"],
[class*="section"],
[class*="widget"],
[class*="module"],
[class*="wrap"],
[class*="hub"],
.ms-filter-card,
.ms-global-card,
.ms-trend-card-inner,
.ms-shopcat-inner,
.spotlight-table,
.comparison-table,
.compare-result,
.compare-panel,
.monitor-card,
.monitor-tile,
.brand-card,
.request-card,
.faq-item,
.spec-card,
.offer-card,
.affiliate-card,
.ms-content-card,
.ms-page-card {
    border-color: var(--ms-soft-line) !important;
}

.ms-global-card,
.ms-trend-card-inner,
.ms-shopcat-inner,
.ms-filter-card,
.spotlight-table,
.compare-result,
.compare-panel,
.monitor-card,
.monitor-tile,
.brand-card,
.request-card,
.faq-item,
.spec-card,
.offer-card,
.affiliate-card,
.ms-content-card,
.ms-page-card,
.ms-community-panel,
.ms-brand-panel,
.glass-panel,
.lc-card,
.lgr-card,
.ecb-inner,
.amz-card,
.cmp-card,
.fm-card,
.ms-single-rating-panel,
.ms-spec-table,
.ms-article,
.ms-faq-section {
    background: rgba(255, 255, 255, .96) !important;
    color: var(--ms-ink) !important;
    box-shadow: var(--shadow-soft-card) !important;
}

.ms-global-card *,
.ms-trend-card-inner *,
.ms-shopcat-inner *,
.ms-filter-card *,
.spotlight-table *,
.compare-result *,
.compare-panel *,
.monitor-card *,
.monitor-tile *,
.brand-card *,
.request-card *,
.faq-item *,
.spec-card *,
.offer-card *,
.affiliate-card *,
.ms-content-card *,
.ms-page-card *,
.ms-community-panel *,
.ms-brand-panel *,
.glass-panel * {
    text-shadow: none !important;
}

.ms-filter-card,
.ms-community-panel,
.ms-brand-panel,
.glass-panel,
.ecb-inner,
.ms-suggest-cta-band,
.newsletter-card,
.ms-newsletter,
.footer-cta {
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.94)),
        radial-gradient(circle at 14% 12%, rgba(255, 95, 115, .12), transparent 30%),
        radial-gradient(circle at 88% 16%, rgba(168, 85, 247, .10), transparent 34%) !important;
    border: 1px solid rgba(20, 31, 56, .10) !important;
}

.ms-site-header,
.site-header,
header,
.ms-header-inner {
    background: rgba(255, 255, 255, .92) !important;
    color: var(--ms-ink) !important;
    border-color: rgba(20, 31, 56, .08) !important;
    box-shadow: 0 12px 38px rgba(23, 35, 64, .08) !important;
}

.ms-primary-nav a,
.ms-nav-list a,
.menu a,
.site-header a,
.ms-brand-text,
.ms-logo-text {
    color: var(--ms-ink-2) !important;
}

.ms-primary-nav a:hover,
.ms-nav-list a:hover,
.menu a:hover,
.site-header a:hover {
    color: var(--ms-coral) !important;
}

.ms-primary-nav .sub-menu,
.sub-menu,
.dropdown-menu,
.ms-region-dropdown,
.ms-tools-dropdown {
    background: rgba(255, 255, 255, .98) !important;
    color: var(--ms-ink) !important;
    border: 1px solid rgba(20, 31, 56, .10) !important;
    box-shadow: 0 22px 60px rgba(23, 35, 64, .14) !important;
}

button,
.button,
.btn,
.wp-block-button__link,
input[type="submit"],
.ms-btn,
.ms-button,
.ms-hero-actions a:first-child,
.ms-filter-submit,
.ms-card-amazon,
.amazon-btn,
.ms-compare-btn,
.ms-submit-btn,
.ms-card-compare,
.ecb-submit,
.lgr-btn,
.ms-brand-panel .ms-button,
.ms-community-panel .ms-button {
    border-radius: 12px !important;
    font-weight: 800 !important;
}

.ms-btn-primary,
.button-primary,
.wp-block-button__link,
input[type="submit"],
.ms-hero-actions a:first-child,
.ms-filter-submit,
.ms-card-amazon,
.amazon-btn,
.ms-submit-btn,
.ecb-submit {
    background: var(--gradient-accent) !important;
    color: #ffffff !important;
    border: 0 !important;
    box-shadow: 0 14px 28px rgba(255, 95, 115, .22) !important;
}

.ms-btn-secondary,
.ms-hero-actions a:last-child,
.ms-compare-btn,
.ms-card-compare,
.lgr-btn,
button.secondary,
.button.secondary {
    background: #ffffff !important;
    color: var(--ms-ink) !important;
    border: 1px solid rgba(20, 31, 56, .13) !important;
    box-shadow: 0 12px 24px rgba(23, 35, 64, .08) !important;
}

button:hover,
.button:hover,
.btn:hover,
.ms-btn:hover,
.ms-button:hover,
.ms-card-amazon:hover,
.amazon-btn:hover,
.ms-filter-submit:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 20px 44px rgba(255, 95, 115, .20) !important;
}

input,
select,
textarea,
.ms-filter-select,
.search-field,
.ms-search-input {
    background: #ffffff !important;
    color: var(--ms-ink) !important;
    border: 1px solid rgba(20, 31, 56, .12) !important;
    box-shadow: 0 10px 22px rgba(23, 35, 64, .05) !important;
}

input::placeholder,
textarea::placeholder {
    color: #98a4bb !important;
}

table,
thead,
tbody,
tr,
th,
td,
.spotlight-row,
.compare-row,
.spec-row {
    background-color: transparent !important;
    border-color: rgba(20, 31, 56, .08) !important;
    color: var(--ms-ink-2) !important;
}

th,
.col-spec,
.spec-label,
.table-label,
.ms-spec-label {
    color: #6d7d9a !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
}

.ms-card-price,
.ms-trend-price,
.price,
.amount {
    color: var(--ms-coral) !important;
    font-weight: 900 !important;
}

.ms-card-votes button,
.ms-vote-btn,
.like-btn,
.dislike-btn,
.vote-btn,
.status-pill,
.pill,
.tag,
.badge,
.ms-card-specs span,
.ms-trend-spec,
.ms-shopcat-count,
.ms-shopcat-icon--text {
    background: #f5f7ff !important;
    color: #293c5f !important;
    border: 1px solid rgba(20, 31, 56, .08) !important;
}

.ms-shopcat-card:nth-child(1) .ms-shopcat-inner { background: linear-gradient(180deg, #ffffff, #fff6fb) !important; }
.ms-shopcat-card:nth-child(2) .ms-shopcat-inner { background: linear-gradient(180deg, #ffffff, #f1fffc) !important; }
.ms-shopcat-card:nth-child(3) .ms-shopcat-inner { background: linear-gradient(180deg, #ffffff, #fbf6ff) !important; }
.ms-shopcat-card:nth-child(4) .ms-shopcat-inner { background: linear-gradient(180deg, #ffffff, #fff5f8) !important; }
.ms-shopcat-card:nth-child(5) .ms-shopcat-inner { background: linear-gradient(180deg, #ffffff, #f3f8ff) !important; }
.ms-shopcat-card:nth-child(6) .ms-shopcat-inner { background: linear-gradient(180deg, #ffffff, #fff8ef) !important; }
.ms-shopcat-card:nth-child(7) .ms-shopcat-inner { background: linear-gradient(180deg, #ffffff, #f6f7ff) !important; }
.ms-shopcat-card:nth-child(8) .ms-shopcat-inner { background: linear-gradient(180deg, #ffffff, #fbf7ff) !important; }

footer,
.site-footer,
.ms-footer {
    background: #ffffff !important;
    color: var(--ms-muted-strong) !important;
    border-top: 1px solid rgba(20, 31, 56, .08) !important;
}

footer a,
.site-footer a,
.ms-footer a {
    color: var(--ms-ink-2) !important;
}

@media (max-width: 980px) {
    .ms-hero-inner {
        grid-template-columns: 1fr !important;
        text-align: left !important;
    }

    .ms-hero-visual {
        min-height: clamp(270px, 62vw, 440px) !important;
        margin-top: 6px !important;
    }

    .ms-hero-monitor-wrap {
        width: 100% !important;
        min-height: clamp(260px, 58vw, 410px) !important;
    }

    .ms-hero-monitor-wrap::before {
        background-position: center !important;
    }
}

@media (max-width: 767px) {
    .ms-hero {
        padding-top: 92px !important;
    }

    .ms-hero-visual {
        min-height: 255px !important;
    }

    .ms-hero-monitor-wrap {
        min-height: 245px !important;
    }

    .ms-hero-monitor-wrap::before {
        background-size: 118% auto !important;
    }

    .ms-filter-card,
    .ms-community-panel,
    .ms-brand-panel,
    .glass-panel,
    .ecb-inner,
    .ms-suggest-cta-band,
    .spotlight-table {
        box-shadow: 0 14px 36px rgba(23, 35, 64, .10) !important;
    }
}
/* =========================================================
   FINAL LIGHT UI CLEANUP - REMOVE LEGACY BLACK SURFACES
   ========================================================= */
:root {
    --color-bg-base: #f7f9ff !important;
    --color-bg-header: #ffffff !important;
    --color-bg-card: #ffffff !important;
    --color-bg-card-hover: #fff8fb !important;
    --color-border: rgba(22, 35, 61, .10) !important;
    --color-text-primary: #10182f !important;
    --color-text-secondary: #5d6f91 !important;
    --color-accent: #ff5f73 !important;
    --color-accent-dark: #a855f7 !important;
    --color-accent-light: #ff8a3d !important;
}

body.home,
body.page,
body.archive,
body.single,
body.category,
body.search,
body.blog {
    background:
        radial-gradient(circle at 8% 10%, rgba(255, 138, 61, .08), transparent 25%),
        radial-gradient(circle at 88% 6%, rgba(168, 85, 247, .09), transparent 27%),
        linear-gradient(180deg, #ffffff 0%, #fbfcff 42%, #f6f8ff 100%) !important;
}

.ms-hero,
#ms-hero,
.ms-filter-section,
#ms-filter,
#ms-filter-results-section,
#ms-trending,
#ms-shop-by-category,
.comparison-spotlight-section,
.lc-section,
.lgr-section,
.ecb-section,
.ms-community-hub,
.ms-site-footer,
.site-footer,
footer,
section[style*="#fffdf8"],
section[style*="background-color: #fffdf8"],
section[style*="background-color:#fffdf8"] {
    background:
        radial-gradient(circle at 12% 18%, rgba(255, 95, 115, .055), transparent 24%),
        radial-gradient(circle at 88% 12%, rgba(79, 140, 255, .06), transparent 27%),
        linear-gradient(180deg, #ffffff 0%, #fbfcff 100%) !important;
    color: #10182f !important;
    border-color: rgba(22, 35, 61, .08) !important;
}

.ms-filter-section,
#ms-filter-results-section,
#ms-trending,
#ms-shop-by-category,
.comparison-spotlight-section,
.lc-section,
.lgr-section,
.ecb-section,
.ms-community-hub {
    padding-top: clamp(54px, 6vw, 92px) !important;
    padding-bottom: clamp(54px, 6vw, 92px) !important;
}

#ms-filter-results-section,
.comparison-spotlight-section,
.ecb-section,
.ms-community-hub {
    background:
        radial-gradient(circle at 22% 0%, rgba(255, 95, 115, .06), transparent 28%),
        linear-gradient(180deg, #f8faff 0%, #ffffff 100%) !important;
}

/* Hero product-shot placement. */
.ms-hero {
    overflow: hidden !important;
    padding: clamp(120px, 11vw, 170px) 20px clamp(48px, 5vw, 82px) !important;
}

.ms-hero-inner {
    display: grid !important;
    grid-template-columns: minmax(340px, .86fr) minmax(520px, 1.14fr) !important;
    min-height: 0 !important;
}

.ms-hero-copy {
    max-width: 620px !important;
}

.ms-hero-visual {
    position: relative !important;
    min-height: 0 !important;
    overflow: visible !important;
}

.ms-hero-monitor-wrap {
    position: relative !important;
    width: min(100%, 860px) !important;
    aspect-ratio: 1701 / 925 !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    border-radius: 32px !important;
}

.ms-hero-monitor-wrap::before {
    inset: -4% -6% -8% -3% !important;
    background-position: center !important;
    background-size: contain !important;
    filter: drop-shadow(0 42px 55px rgba(27, 43, 78, .18)) !important;
    transform: translate3d(0, 0, 0) !important;
}

.ms-hero-monitor-wrap::after {
    left: 12% !important;
    right: 10% !important;
    bottom: 0 !important;
    height: 13% !important;
    background: radial-gradient(ellipse, rgba(255, 95, 115, .24), rgba(168, 85, 247, .12) 34%, transparent 72%) !important;
    filter: blur(18px) !important;
}

.ms-hero-stats {
    background: rgba(255,255,255,.74) !important;
    border: 1px solid rgba(22, 35, 61, .08) !important;
    border-radius: 18px !important;
    padding: 18px !important;
    box-shadow: 0 18px 46px rgba(23, 35, 64, .08) !important;
}

.ms-hero-stat-value {
    color: #10182f !important;
}

.ms-hero-stat-label {
    color: #72809b !important;
}

/* Legacy inline dark panels from front-page.php. */
.glass-panel,
.glass-panel[style],
.ms-community-hub[style],
.ms-brand-panel[style],
.ms-suggest-cta-band[style] {
    background:
        linear-gradient(135deg, rgba(255, 138, 61, .12), rgba(255, 95, 115, .10) 46%, rgba(168, 85, 247, .10)),
        #ffffff !important;
    border: 1px solid rgba(22, 35, 61, .10) !important;
    color: #10182f !important;
    box-shadow: 0 22px 58px rgba(23, 35, 64, .11) !important;
}

.glass-panel [style*="color:#102027"],
.glass-panel [style*="color: #102027"],
.ms-community-hub [style*="color:#102027"],
.ms-community-hub [style*="color: #102027"],
.ms-brand-panel [style*="color:#102027"],
.ms-brand-panel [style*="color: #102027"] {
    color: #10182f !important;
}

.glass-panel [style*="color:#5b6870"],
.glass-panel [style*="color: #5b6870"],
.ms-community-hub [style*="color:#5b6870"],
.ms-community-hub [style*="color: #5b6870"] {
    color: #61708d !important;
}

.glass-panel a[style],
.ms-suggest-cta-band a,
.ms-community-panel a.ms-btn,
.ms-brand-panel a.ms-btn,
.btn-compare,
.lc-view-all,
.lgr-view-all {
    background: linear-gradient(135deg, #ff8a3d, #ff5f73 52%, #a855f7) !important;
    color: #ffffff !important;
    border: 0 !important;
    box-shadow: 0 16px 34px rgba(255, 95, 115, .24) !important;
}

/* Cards and grids: force premium white surfaces. */
.ms-filter-card,
.ms-global-card,
.ms-trend-card-inner,
.ms-shopcat-inner,
.spotlight-table,
.lc-card,
.lgr-card,
.ecb-inner,
.ms-community-panel,
.ms-brand-panel,
.ms-suggest-cta-band,
.glass-panel,
.ms-card,
.monitor-card,
.request-card,
.brand-card,
.offer-card,
.faq-item,
.spec-card,
.compare-card,
.comparison-card,
.wp-block-group,
.wp-block-column,
.widget,
aside[class*="panel"] {
    background: rgba(255, 255, 255, .97) !important;
    color: #10182f !important;
    border: 1px solid rgba(22, 35, 61, .10) !important;
    box-shadow: 0 18px 48px rgba(23, 35, 64, .10) !important;
}

.ms-filter-card:hover,
.ms-global-card:hover,
.ms-trend-card-inner:hover,
.ms-shopcat-inner:hover,
.lc-card:hover,
.lgr-card:hover,
.brand-card:hover,
.request-card:hover,
.monitor-card:hover {
    border-color: rgba(255, 95, 115, .22) !important;
    box-shadow: 0 28px 70px rgba(23, 35, 64, .15) !important;
}

.ms-trend-img,
.ms-card-media,
.lgr-thumb,
.lc-mon-thumb,
.spotlight-monitor-placeholder,
.ms-card-placeholder {
    background:
        radial-gradient(circle at 74% 20%, rgba(255, 95, 115, .18), transparent 30%),
        radial-gradient(circle at 18% 78%, rgba(79, 140, 255, .14), transparent 34%),
        linear-gradient(135deg, #f7f9ff, #ffffff) !important;
    border: 1px solid rgba(22, 35, 61, .08) !important;
    color: #6c7c99 !important;
}

/* Text/readability cleanup. */
.ms-section-title,
.spotlight-title,
.lc-title,
.lgr-title,
.ecb-heading,
.ms-community-panel h2,
.ms-community-panel h3,
.ms-brand-panel h2,
.ms-brand-panel h3,
.ms-suggest-cta-band h2,
.ms-suggest-cta-band h3,
.glass-panel h2,
.glass-panel h3,
.ms-footer-heading,
.ms-footer-logo,
.ms-card-title,
.ms-trend-title,
.lc-card-title,
.lgr-card-title {
    color: #10182f !important;
}

.ms-section-subtitle,
.spotlight-subtitle,
.lc-subtitle,
.lgr-card-excerpt,
.ecb-desc,
.ms-community-panel p,
.ms-brand-panel p,
.ms-suggest-cta-band p,
.glass-panel p,
.ms-footer-desc,
.ms-footer-links a,
.ms-card-meta,
.ms-trend-specs,
.lc-card-meta,
.lgr-card-meta {
    color: #61708d !important;
}

.ms-filter-eyebrow,
.ms-hero-eyebrow,
.ecb-eyebrow,
.lgr-eyebrow,
.ms-trending-flame,
.ms-text-accent,
.ms-section-link,
.ms-community-panel .ms-section-link,
.ms-brand-panel .ms-section-link {
    color: #ff5f73 !important;
}

.ms-filter-select,
.ecb-input,
.search-field,
input:not([type="submit"]),
select,
textarea {
    background: #ffffff !important;
    color: #10182f !important;
    border: 1px solid rgba(22, 35, 61, .12) !important;
    border-radius: 12px !important;
}

.ms-filter-reset,
.ms-mobile-menu-toggle,
.ms-region-trigger,
.ms-search-toggle,
.ms-btn-outline {
    background: #ffffff !important;
    color: #10182f !important;
    border: 1px solid rgba(22, 35, 61, .12) !important;
}

.ms-site-footer {
    background: linear-gradient(180deg, #ffffff, #f8faff) !important;
    box-shadow: inset 0 1px 0 rgba(22, 35, 61, .08) !important;
}

/* Remove dark overlays/pseudo-elements that were part of the legacy theme. */
.ms-filter-card::before,
.ms-filter-card::after,
.ms-trend-card-inner::before,
.ms-shopcat-inner::before,
.spotlight-table::before,
.lc-card::before,
.lgr-card::before,
.ecb-inner::before,
.glass-panel::before,
.ms-community-panel::before,
.ms-brand-panel::before {
    background: transparent !important;
    opacity: 0 !important;
}

@media (max-width: 1100px) {
    .ms-hero-inner {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    .ms-hero-copy {
        max-width: 760px !important;
    }

    .ms-hero-visual {
        min-height: 0 !important;
    }

    .ms-hero-monitor-wrap {
        width: min(100%, 760px) !important;
    }
}

@media (max-width: 767px) {
    .ms-hero {
        padding: 96px 16px 42px !important;
    }

    .ms-hero-monitor-wrap {
        width: min(118%, 560px) !important;
        margin-left: -6% !important;
    }

    .ms-hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        padding: 14px !important;
    }

    .ms-filter-section,
    #ms-filter-results-section,
    #ms-trending,
    #ms-shop-by-category,
    .comparison-spotlight-section,
    .lc-section,
    .lgr-section,
    .ecb-section,
    .ms-community-hub {
        padding-top: 44px !important;
        padding-bottom: 44px !important;
    }
}
/* Header final light polish. */
.ms-header,
#ms-header,
.ms-nav-container,
.ms-page-content {
    background: rgba(255, 255, 255, .94) !important;
    color: #10182f !important;
    border-color: rgba(22, 35, 61, .08) !important;
}

.ms-header {
    backdrop-filter: blur(18px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(150%) !important;
    box-shadow: 0 12px 38px rgba(23, 35, 64, .08) !important;
}

.ms-nav-container {
    box-shadow: none !important;
}

.ms-logo-text,
.ms-nav-link,
.ms-icon-btn,
.ms-hamburger,
.rs-switcher,
.rs-select,
.rs-globe,
.rs-active-flag {
    color: #10182f !important;
}

.ms-icon-btn,
.rs-switcher,
.ms-btn-outline,
.ms-hamburger {
    background: #ffffff !important;
    border: 1px solid rgba(22, 35, 61, .12) !important;
    box-shadow: 0 10px 24px rgba(23, 35, 64, .07) !important;
}

.ms-hamburger-bar {
    background: linear-gradient(135deg, #ff8a3d, #ff5f73 52%, #a855f7) !important;
}

.ms-nav-active > .ms-nav-link,
.ms-nav-link:hover,
.ms-logo:hover .ms-logo-text {
    color: #ff5f73 !important;
}

.ms-page-content {
    min-height: 0 !important;
}
/* =========================================================
   GLOBAL LIGHT REBUILD SYSTEM - LEGACY BLACK REMOVAL
   This is the final visual authority for the whole theme.
   ========================================================= */
:root {
    color-scheme: light !important;
    --ms-page-bg: #f7f9ff;
    --ms-page-bg-2: #ffffff;
    --ms-card-bg: #ffffff;
    --ms-card-tint: #fbfcff;
    --ms-ink-900: #102027;
    --ms-ink-800: #1f2d4a;
    --ms-ink-700: #33435f;
    --ms-ink-600: #52637f;
    --ms-ink-500: #6f7f99;
    --ms-line: rgba(24, 39, 75, .10);
    --ms-line-strong: rgba(24, 39, 75, .16);
    --ms-shadow-sm: 0 10px 28px rgba(23, 35, 64, .07);
    --ms-shadow-md: 0 18px 48px rgba(23, 35, 64, .10);
    --ms-shadow-lg: 0 28px 80px rgba(23, 35, 64, .14);
    --ms-coral: #ff5f73;
    --ms-coral-2: #ff416c;
    --ms-orange: #ff8a3d;
    --ms-purple: #9b5cff;
    --ms-blue: #4f8cff;
    --ms-cyan: #22c7e8;
    --ms-green: #12b981;
    --ms-amber: #ffb020;
    --ms-cta: linear-gradient(135deg, #ff8a3d 0%, #ff5f73 52%, #9b5cff 100%);
    --ms-hero-soft: radial-gradient(circle at 74% 18%, rgba(255, 95, 115, .13), transparent 26%), radial-gradient(circle at 14% 18%, rgba(79, 140, 255, .09), transparent 24%), linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
}

* {
    box-sizing: border-box;
}

html,
body {
    background: var(--ms-page-bg) !important;
    color: var(--ms-ink-800) !important;
}

body,
button,
input,
select,
textarea {
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body,
#page,
.site,
.site-content,
.ms-page-content,
.ms-page,
.ms-main,
main,
article,
.archive,
.category,
.blog,
.single,
.search,
.ms-brand-page,
.ms-req-page {
    background:
        radial-gradient(circle at 12% 4%, rgba(255, 138, 61, .07), transparent 28%),
        radial-gradient(circle at 92% 0%, rgba(155, 92, 255, .08), transparent 30%),
        linear-gradient(180deg, #ffffff 0%, #fbfcff 42%, #f7f9ff 100%) !important;
    color: var(--ms-ink-800) !important;
}

/* Kill old inline legacy backgrounds across templates. */
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#f6f4ef"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#f2e8ff"],
[style*="#1e293b"],
[style*="rgba(20,20,25"],
[style*="rgba(20, 20, 25"],
[style*="rgba(5,5,8"],
[style*="rgba(5, 5, 8"],
[style*="rgba(26,21,62"],
[style*="background-color: #fffdf8"],
[style*="background-color:#fffdf8"],
[style*="background:#fffdf8"],
[style*="background: #fffdf8"] {
    background: var(--ms-hero-soft) !important;
    background-color: #ffffff !important;
    color: var(--ms-ink-800) !important;
    border-color: var(--ms-line) !important;
    box-shadow: var(--ms-shadow-md) !important;
}

/* Dark translucent boxes become white cards. */
[style*="rgba(255,255,255,0.025"],
[style*="rgba(255, 255, 255, 0.025"],
[style*="rgba(255,255,255,.025"],
[style*="rgba(255, 255, 255, .025"],
[style*="rgba(255,255,255,.035"],
[style*="rgba(255,255,255,.045"],
[style*="rgba(255,255,255,.06"] {
    background: #ffffff !important;
    color: var(--ms-ink-800) !important;
    border-color: var(--ms-line) !important;
}

/* Readability: no low contrast white/grey text on light theme. */
[style*="color:#102027"],
[style*="color: #102027"],
[style*="color:#ffffff"],
[style*="color: #ffffff"],
[style*="color:#334155"],
[style*="color: #334155"] {
    color: var(--ms-ink-900) !important;
}

[style*="color:#5b6870"],
[style*="color: #5b6870"],
[style*="color:#64748b"],
[style*="color: #64748b"],
[style*="color:#6b7280"],
[style*="color: #6b7280"] {
    color: var(--ms-ink-600) !important;
}

/* But CTA/button text must remain strong white where the background is gradient/color. */
a[style*="background:#38bdf8"],
a[style*="background: #38bdf8"],
a[style*="background:#a855f7"],
a[style*="background: #a855f7"],
button[style*="background:#38bdf8"],
button[style*="background: #38bdf8"],
button[style*="background:#a855f7"],
button[style*="background: #a855f7"],
input[type="submit"],
button[type="submit"],
.ms-btn-primary,
.ms-filter-submit,
.ecb-btn,
.ms-community-form button[type=submit],
.ms-card-amazon,
.amazon-btn,
.btn-compare {
    background: var(--ms-cta) !important;
    color: #ffffff !important;
    border: 0 !important;
    box-shadow: 0 16px 36px rgba(255, 95, 115, .24) !important;
}

/* Universal page heroes and content sections. */
.page-header,
.ms-req-hero,
.ms-brand-hero,
.category-hero,
.archive-header,
.ms-hero,
section[class*="hero"],
div[class*="hero"] {
    background: var(--ms-hero-soft) !important;
    color: var(--ms-ink-900) !important;
    border-bottom: 1px solid var(--ms-line) !important;
}

.page-header h1,
.ms-req-hero h1,
.ms-brand-hero h1,
.category-hero h1,
.archive-header h1,
.ms-hero h1,
.entry-title,
.page-title,
h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--ms-ink-900) !important;
    text-shadow: none !important;
}

.page-header p,
.ms-req-hero p,
.ms-brand-hero p,
.category-hero p,
.archive-header p,
.ms-hero p,
p,
li,
.entry-content,
.entry-content p,
.ms-content-block,
.ms-brand-content,
.ms-article,
.ms-faq-block p,
.ms-brand-faq p,
.ms-req-reason,
.ms-form-panel p,
.ms-footer-desc {
    color: var(--ms-ink-600) !important;
    text-shadow: none !important;
}

/* Cards/panels/forms across all pages. */
.ms-card,
.ms-global-card,
.ms-trend-card-inner,
.ms-shopcat-inner,
.ms-filter-card,
.spotlight-table,
.lc-card,
.lgr-card,
.ecb-inner,
.ms-community-panel,
.ms-brand-panel,
.ms-suggest-cta-band,
.glass-panel,
.ms-form-panel,
.ms-content-block,
.ms-faq-block,
.ms-status-board,
.ms-meter-panel,
.ms-req-card,
.ms-meter-cell,
.ms-brand-card,
.ms-brand-content,
.ms-brand-faq,
.ms-brand-detail,
.ms-brand-monitor-card,
.offer-card,
.affiliate-card,
.monitor-card,
.compare-card,
.comparison-card,
.spec-card,
.faq-item,
.widget,
article.post,
article.monitor,
.card,
.panel,
.box {
    background: rgba(255, 255, 255, .98) !important;
    color: var(--ms-ink-800) !important;
    border: 1px solid var(--ms-line) !important;
    box-shadow: var(--ms-shadow-md) !important;
}

.ms-card:hover,
.ms-global-card:hover,
.ms-trend-card-inner:hover,
.ms-shopcat-inner:hover,
.lc-card:hover,
.lgr-card:hover,
.ms-req-card:hover,
.ms-brand-card:hover,
.ms-brand-monitor-card:hover,
.monitor-card:hover,
.card:hover {
    border-color: rgba(255, 95, 115, .24) !important;
    box-shadow: var(--ms-shadow-lg) !important;
    transform: translateY(-2px);
}

/* Forms. */
input:not([type="submit"]),
select,
textarea,
.ms-community-form input,
.ms-community-form select,
.ms-community-form textarea,
.ms-filter-select,
.ecb-input,
.search-field,
.cmp-search-input {
    background: #ffffff !important;
    color: var(--ms-ink-900) !important;
    border: 1px solid var(--ms-line-strong) !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 22px rgba(23, 35, 64, .05) !important;
}

input::placeholder,
textarea::placeholder {
    color: #8b98af !important;
}

label,
.ms-community-form label,
.ms-filter-label,
.ecb-label {
    color: var(--ms-ink-700) !important;
}

/* Badges, meta chips, small cells. */
.ms-req-meta span,
.ms-card-specs span,
.ms-trend-spec,
.ms-brand-stat-list span,
.ms-brand-countries,
.ms-brand-metrics div,
.ms-community-stat,
.ms-community-meter,
.ms-community-status-pill,
.ms-meter-cell,
.ms-shopcat-count,
.badge,
.tag,
.pill,
.status-pill {
    background: #f6f8ff !important;
    color: var(--ms-ink-700) !important;
    border: 1px solid var(--ms-line) !important;
}

.ms-community-stat strong,
.ms-community-status-pill strong,
.ms-meter-cell strong,
.ms-brand-stat-list b,
.ms-brand-metrics strong,
.ms-brand-card h3 a,
.ms-brand-detail h2,
.ms-brand-monitor-card strong,
.ms-req-title,
.ms-form-panel h2,
.ms-content-block h2,
.ms-faq-block h2,
.ms-list-section h2,
.ms-status-col h3,
.ms-faq-block summary,
.ms-brand-faq summary,
.ms-footer-heading,
.ms-footer-logo {
    color: var(--ms-ink-900) !important;
}

.ms-req-type,
.ms-req-listed-link,
.ms-brand-open,
.ms-brand-back,
.ms-section-link,
.lc-card-link,
.lgr-view-all,
.lc-view-all,
.ms-brand-score-big,
.ms-community-meter-top strong,
.ms-text-accent {
    color: var(--ms-coral) !important;
}

.ms-req-listed-link,
.ms-brand-open,
.ms-brand-back {
    background: rgba(255, 95, 115, .10) !important;
    border: 1px solid rgba(255, 95, 115, .22) !important;
}

.ms-req-meter-track,
.ms-community-meter-track {
    background: #edf1fb !important;
}

.ms-req-meter-track span,
.ms-community-meter-track span {
    background: var(--ms-cta) !important;
}

/* Tables and comparison surfaces. */
table,
thead,
tbody,
tr,
th,
td,
.spotlight-row,
.compare-row,
.spec-row,
.table-header-row,
.table-footer-row {
    background: transparent !important;
    color: var(--ms-ink-800) !important;
    border-color: var(--ms-line) !important;
}

th,
.col-spec,
.spec-label,
.table-label,
.ms-spec-label {
    color: var(--ms-ink-600) !important;
}

.spotlight-row:hover,
.compare-row:hover,
.spec-row:hover {
    background: #fff7fb !important;
}

/* Media placeholders/images. */
.ms-trend-img,
.ms-card-media,
.lgr-thumb,
.lc-mon-thumb,
.spotlight-monitor-placeholder,
.ms-card-placeholder,
.post-thumbnail,
.thumbnail-placeholder {
    background:
        radial-gradient(circle at 74% 20%, rgba(255, 95, 115, .18), transparent 30%),
        radial-gradient(circle at 18% 78%, rgba(79, 140, 255, .14), transparent 34%),
        linear-gradient(135deg, #f7f9ff, #ffffff) !important;
    color: var(--ms-ink-500) !important;
    border: 1px solid var(--ms-line) !important;
}

/* Header/footer are always light. */
.ms-header,
#ms-header,
.ms-nav-container,
.site-header,
header[role="banner"],
.ms-site-footer,
.site-footer,
footer {
    background: rgba(255, 255, 255, .96) !important;
    color: var(--ms-ink-800) !important;
    border-color: var(--ms-line) !important;
    box-shadow: 0 10px 34px rgba(23, 35, 64, .07) !important;
}

.ms-site-footer,
.site-footer,
footer {
    background: linear-gradient(180deg, #ffffff, #f7f9ff) !important;
}

.ms-nav-link,
.ms-logo-text,
.ms-footer-links a,
.ms-footer a,
.site-footer a,
footer a {
    color: var(--ms-ink-700) !important;
}

.ms-nav-link:hover,
.ms-footer a:hover,
.site-footer a:hover,
footer a:hover {
    color: var(--ms-coral) !important;
}

/* Hero image placement: use the generated monitor art as the actual visual. */
.ms-hero-inner {
    max-width: 1500px !important;
    grid-template-columns: minmax(360px, .9fr) minmax(580px, 1.1fr) !important;
    align-items: center !important;
    gap: clamp(36px, 5vw, 88px) !important;
}

.ms-hero-visual {
    position: relative !important;
    min-height: auto !important;
    overflow: visible !important;
}

.ms-hero-monitor-wrap {
    width: min(100%, 850px) !important;
    aspect-ratio: 1701 / 925 !important;
    min-height: 0 !important;
    margin: 0 auto !important;
}

.ms-hero-monitor-wrap::before {
    content: "" !important;
    position: absolute !important;
    inset: -2% -4% -5% -4% !important;
    background: transparent !important;
    filter: drop-shadow(0 38px 58px rgba(23, 35, 64, .18)) !important;
    z-index: 3 !important;
}

.ms-hero-monitor,
.ms-hero-monitor--primary,
.ms-hero-monitor--secondary,
.ms-hero-svg-monitor,
.ms-hero-monitor-svg {
    display: none !important;
}

@media (max-width: 1100px) {
    .ms-hero-inner {
        grid-template-columns: 1fr !important;
    }

    .ms-hero-monitor-wrap {
        width: min(100%, 760px) !important;
    }
}

@media (max-width: 767px) {
    .ms-hero,
    .page-header,
    .ms-req-hero,
    .ms-brand-hero {
        padding-top: 92px !important;
    }

    .ms-hero-monitor-wrap {
        width: min(116%, 560px) !important;
        margin-left: -6% !important;
    }

    .ms-card,
    .ms-global-card,
    .ms-trend-card-inner,
    .ms-shopcat-inner,
    .ms-filter-card,
    .spotlight-table,
    .lc-card,
    .lgr-card,
    .ecb-inner,
    .ms-community-panel,
    .ms-brand-panel,
    .ms-suggest-cta-band,
    .glass-panel,
    .ms-form-panel,
    .ms-content-block,
    .ms-faq-block,
    .ms-status-board,
    .ms-meter-panel,
    .ms-req-card,
    .ms-brand-card,
    .ms-brand-content,
    .ms-brand-faq,
    .ms-brand-detail {
        border-radius: 18px !important;
        box-shadow: 0 14px 36px rgba(23, 35, 64, .09) !important;
    }
}
/* =========================================================
   SCREENSHOT QA PATCH - CONTRAST + BLACK BAND REMOVAL
   ========================================================= */
.page-header::after,
.ms-hero::after,
.ms-req-hero::after,
.ms-brand-hero::after,
.category-hero::after,
.archive-header::after,
section[class*="hero"]::after,
div[class*="hero"]::after {
    content: none !important;
    display: none !important;
    opacity: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

.page-header::before,
.ms-req-hero::before,
.ms-brand-hero::before,
.category-hero::before,
.archive-header::before {
    opacity: .36 !important;
    background-image: radial-gradient(circle, rgba(79, 140, 255, .12) 1px, transparent 1px) !important;
    background-size: 28px 28px !important;
}

.page-header,
.ms-req-hero,
.ms-brand-hero,
.category-hero,
.archive-header {
    padding-top: calc(var(--nav-height, 72px) + 70px) !important;
    padding-bottom: 58px !important;
    background:
        radial-gradient(circle at 18% 18%, rgba(79, 140, 255, .10), transparent 30%),
        radial-gradient(circle at 78% 16%, rgba(255, 95, 115, .12), transparent 30%),
        linear-gradient(180deg, #ffffff 0%, #fbfcff 100%) !important;
}

.page-header__title,
.page-header h1,
.ms-req-hero h1,
.ms-brand-hero h1,
.category-hero h1,
.archive-header h1 {
    color: #10182f !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

.page-header__desc,
.page-header p,
.ms-req-hero p,
.ms-brand-hero p,
.category-hero p,
.archive-header p {
    color: #44546f !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
    font-weight: 600 !important;
}

/* Strong readable article/content typography. */
.entry-content,
.entry-content p,
.page-content-area,
.page-content-area p,
.ms-content-block,
.ms-content-block p,
.ms-brand-content,
.ms-brand-content p,
.ms-article,
.ms-article p,
.ms-faq-block p,
.ms-brand-faq p,
.single-post p,
.single-monitor p,
.category main p,
.archive main p {
    color: #34425f !important;
    font-size: 16px !important;
    line-height: 1.85 !important;
    font-weight: 500 !important;
}

.entry-content strong,
.ms-content-block strong,
.ms-brand-content strong,
.ms-article strong,
.single-post strong,
.category main strong,
.archive main strong {
    color: #10182f !important;
    font-weight: 850 !important;
}

/* Make section links visible on light backgrounds. */
.ms-section-link,
.lc-view-all,
.lgr-view-all,
.ms-section-head a,
.ms-board-tabs a,
.page-content-area a,
.entry-content a,
.ms-content-block a,
.ms-brand-content a,
.ms-faq-block a,
.ms-brand-faq a,
a.lc-card-link,
a.lgr-card-link {
    color: #ff416c !important;
    font-weight: 850 !important;
    text-decoration: none !important;
}

.ms-section-link:hover,
.lc-view-all:hover,
.lgr-view-all:hover,
.ms-section-head a:hover,
.ms-board-tabs a:hover,
.entry-content a:hover,
.ms-content-block a:hover,
.ms-brand-content a:hover {
    color: #9b5cff !important;
}

/* Monitor card chips were still reading like the old dark UI. */
.ms-card-specs span,
.ms-trend-spec,
.ms-card-rating-breakdown span,
.ms-trend-rating-breakdown span,
.ms-card-votes button,
.ms-vote-btn,
.ms-brand-stat-list span,
.ms-brand-countries,
.ms-brand-metrics div,
.ms-req-meta span,
.ms-meter-cell,
.ms-community-stat,
.ms-community-meter,
.ms-community-status-pill {
    background: #f3f6ff !important;
    border: 1px solid rgba(24, 39, 75, .12) !important;
    color: #263653 !important;
    box-shadow: none !important;
}

.ms-card-rating-breakdown b,
.ms-trend-rating-breakdown b,
.ms-card-specs b,
.ms-trend-spec b,
.ms-community-stat strong,
.ms-meter-cell strong,
.ms-brand-stat-list b,
.ms-brand-metrics strong {
    color: #10182f !important;
}

.ms-card-title,
.ms-card-title a,
.ms-trend-title,
.ms-brand-card h3,
.ms-brand-card h3 a,
.ms-req-title,
.lgr-card-title,
.lc-card-title,
.monitor-card h3,
.monitor-card a {
    color: #10182f !important;
    font-weight: 900 !important;
}

.ms-card-meta,
.ms-card-rating-row > span:last-child,
.ms-rating-vote-total,
.ms-trend-rating-row,
.ms-trend-specs,
.lgr-card-meta,
.lc-card-meta,
.ms-req-reason,
.ms-empty {
    color: #52637f !important;
    opacity: 1 !important;
}

/* FAQ rows need visible text and clickable affordance. */
details,
.ms-faq-block details,
.ms-brand-faq details,
.faq-item,
.ms-faq-section details {
    background: #ffffff !important;
    border-color: rgba(24, 39, 75, .10) !important;
    color: #10182f !important;
}

summary,
.ms-faq-block summary,
.ms-brand-faq summary,
.faq-item summary,
.ms-faq-section summary {
    color: #10182f !important;
    font-weight: 900 !important;
}

/* Homepage hero monitor appears too tiny if the generated asset whitespace is fitted fully. Crop it larger. */
.ms-hero-monitor-wrap {
    width: min(100%, 920px) !important;
}

.ms-hero-monitor-wrap::before {
    inset: -15% -20% -18% -18% !important;
    background-size: 132% auto !important;
    background-position: center right !important;
}

.ms-hero-title {
    color: #10182f !important;
    font-weight: 900 !important;
}

.ms-hero-desc {
    color: #44546f !important;
    font-weight: 600 !important;
    font-size: 17px !important;
    line-height: 1.7 !important;
}

/* Keep fixed header from creating harsh separators in full-page captures. */
.ms-header,
#ms-header,
.ms-nav-container {
    box-shadow: 0 8px 26px rgba(23, 35, 64, .08) !important;
    border-bottom: 1px solid rgba(24, 39, 75, .08) !important;
}

@media (max-width: 767px) {
    .page-header,
    .ms-req-hero,
    .ms-brand-hero,
    .category-hero,
    .archive-header {
        padding-top: calc(var(--nav-height, 70px) + 42px) !important;
        padding-bottom: 38px !important;
    }

    .entry-content p,
    .ms-content-block p,
    .ms-brand-content p,
    .ms-article p,
    .category main p,
    .archive main p {
        font-size: 15px !important;
        line-height: 1.78 !important;
    }

    .ms-hero-monitor-wrap::before {
        inset: -12% -24% -16% -22% !important;
        background-size: 142% auto !important;
    }
}

/* =========================================================
   HOMEPAGE HERO REBUILD - reference aligned product hero
   ========================================================= */
#ms-hero.ms-hero {
    min-height: clamp(620px, 78vh, 860px) !important;
    padding: calc(var(--nav-height, 72px) + 42px) 20px 50px !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
    border-bottom: 1px solid rgba(24, 39, 75, .07) !important;
    background:
        radial-gradient(circle at 87% 20%, rgba(255, 183, 127, .22) 0 3px, transparent 4px),
        radial-gradient(circle at 82% 44%, rgba(255, 81, 123, .18) 0 5px, transparent 7px),
        radial-gradient(circle at 66% 30%, rgba(255, 232, 241, .92), transparent 32%),
        radial-gradient(circle at 17% 24%, rgba(238, 244, 255, .90), transparent 29%),
        linear-gradient(105deg, #ffffff 0%, #fffdfb 44%, #f7fbff 100%) !important;
}

#ms-hero.ms-hero::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    opacity: .85 !important;
    background-image:
        radial-gradient(circle, rgba(255, 95, 115, .16) 0 1px, transparent 1.5px),
        radial-gradient(circle, rgba(79, 140, 255, .11) 0 1px, transparent 1.5px) !important;
    background-size: 34px 34px, 48px 48px !important;
    background-position: 0 0, 18px 16px !important;
    pointer-events: none !important;
}

#ms-hero.ms-hero::after {
    display: none !important;
}

#ms-hero .ms-hero-inner {
    width: 100% !important;
    max-width: 1500px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(430px, .84fr) minmax(680px, 1.16fr) !important;
    align-items: center !important;
    gap: clamp(44px, 5.4vw, 96px) !important;
    position: relative !important;
    z-index: 1 !important;
}

#ms-hero .ms-hero-copy {
    max-width: 650px !important;
    gap: 0 !important;
    transform: translateY(-6px) !important;
}

#ms-hero .ms-hero-eyebrow {
    display: inline-flex !important;
    width: fit-content !important;
    margin: 0 0 22px !important;
    padding: 8px 13px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, rgba(255, 95, 115, .11), rgba(155, 92, 255, .12)) !important;
    color: #ff4f7b !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .08em !important;
}

#ms-hero .ms-hero-eyebrow-dot {
    background: #ff5f73 !important;
    box-shadow: 0 0 0 5px rgba(255, 95, 115, .12) !important;
}

#ms-hero .ms-hero-title {
    margin: 0 !important;
    color: #10182f !important;
    font-size: clamp(58px, 5.65vw, 92px) !important;
    line-height: .96 !important;
    letter-spacing: 0 !important;
    font-weight: 950 !important;
}

#ms-hero .ms-hero-title-accent {
    background: linear-gradient(105deg, #ff7d39 0%, #ff4f7b 48%, #a855f7 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

#ms-hero .ms-hero-desc {
    max-width: 575px !important;
    margin: 24px 0 0 !important;
    color: #42516d !important;
    font-size: 18px !important;
    line-height: 1.68 !important;
    font-weight: 650 !important;
}

#ms-hero .ms-hero-actions {
    margin-top: 30px !important;
    gap: 14px !important;
}

#ms-hero .ms-hero-actions .ms-btn {
    min-height: 50px !important;
    padding: 0 27px !important;
    border-radius: 14px !important;
    font-weight: 900 !important;
    font-size: 15px !important;
    box-shadow: none !important;
}

#ms-hero .ms-hero-actions .ms-btn-primary {
    color: #ffffff !important;
    border: 0 !important;
    background: linear-gradient(135deg, #ff8a3d 0%, #ff4f7b 52%, #9b5cff 100%) !important;
    box-shadow: 0 18px 34px rgba(255, 83, 117, .26) !important;
}

#ms-hero .ms-hero-actions .ms-btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 22px 42px rgba(255, 83, 117, .32) !important;
}

#ms-hero .ms-hero-actions .ms-btn-secondary {
    color: #18233b !important;
    background: rgba(255, 255, 255, .86) !important;
    border: 1px solid rgba(24, 39, 75, .13) !important;
    box-shadow: 0 14px 30px rgba(23, 35, 64, .08) !important;
}

#ms-hero .ms-hero-actions .ms-btn-secondary:hover {
    color: #ff4f7b !important;
    border-color: rgba(255, 79, 123, .32) !important;
    transform: translateY(-2px) !important;
}

#ms-hero .ms-hero-stats {
    width: min(100%, 690px) !important;
    margin-top: 32px !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: clamp(16px, 2.2vw, 30px) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

#ms-hero .ms-hero-stat {
    min-width: 0 !important;
    padding: 0 !important;
    gap: 6px !important;
    position: relative !important;
}

#ms-hero .ms-hero-stat::before {
    content: "" !important;
    width: 25px !important;
    height: 25px !important;
    margin-bottom: 6px !important;
    display: block !important;
    border-radius: 50% !important;
    background:
        radial-gradient(circle at 50% 50%, #ff4f7b 0 3px, transparent 4px),
        linear-gradient(135deg, rgba(255, 95, 115, .12), rgba(155, 92, 255, .12)) !important;
    border: 1px solid rgba(255, 79, 123, .14) !important;
}

#ms-hero .ms-hero-stat-value {
    color: #10182f !important;
    font-size: clamp(22px, 1.7vw, 30px) !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
}

#ms-hero .ms-hero-stat-label {
    color: #667690 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    letter-spacing: .06em !important;
    line-height: 1.35 !important;
}

#ms-hero .ms-hero-visual {
    min-height: clamp(430px, 43vw, 675px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    overflow: visible !important;
    transform: translateX(38px) !important;
}

#ms-hero .ms-hero-visual::before {
    content: "" !important;
    position: absolute !important;
    inset: 3% -4% 5% 9% !important;
    display: block !important;
    border-radius: 999px !important;
    background:
        radial-gradient(circle at 72% 40%, rgba(255, 95, 115, .20), transparent 36%),
        radial-gradient(circle at 36% 70%, rgba(155, 92, 255, .10), transparent 34%),
        linear-gradient(135deg, rgba(255, 243, 236, .70), rgba(255, 228, 241, .42)) !important;
    filter: blur(.2px) !important;
    pointer-events: none !important;
}

#ms-hero .ms-hero-monitor-wrap {
    position: relative !important;
    z-index: 2 !important;
    width: min(100%, 1010px) !important;
    aspect-ratio: 1701 / 925 !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#ms-hero .ms-hero-monitor-wrap::before {
    content: "" !important;
    position: absolute !important;
    z-index: 3 !important;
    inset: -26% -39% -26% -30% !important;
    display: block !important;
    background: transparent !important;
    filter: drop-shadow(0 40px 46px rgba(23, 35, 64, .17)) !important;
    transform: translate3d(0, 0, 0) !important;
}

#ms-hero .ms-hero-monitor-wrap::after {
    content: "" !important;
    position: absolute !important;
    z-index: 1 !important;
    left: 21% !important;
    right: 8% !important;
    bottom: 8% !important;
    height: 16% !important;
    border-radius: 999px !important;
    background: radial-gradient(ellipse, rgba(255, 95, 115, .22), rgba(155, 92, 255, .12) 38%, transparent 72%) !important;
    filter: blur(18px) !important;
}

#ms-hero .ms-hero-monitor,
#ms-hero .ms-hero-monitor--primary,
#ms-hero .ms-hero-monitor--secondary,
#ms-hero .ms-hero-svg-monitor,
#ms-hero .ms-hero-monitor-svg,
#ms-hero .ms-hero-glow-orb {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

@media (max-width: 1320px) {
    #ms-hero .ms-hero-inner {
        grid-template-columns: minmax(380px, .9fr) minmax(560px, 1.1fr) !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(52px, 5.3vw, 76px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap::before {
        inset: -22% -35% -23% -30% !important;
        background-size: 154% auto !important;
    }
}

@media (max-width: 1100px) {
    #ms-hero.ms-hero {
        min-height: auto !important;
        padding: calc(var(--nav-height, 72px) + 34px) 18px 48px !important;
    }

    #ms-hero .ms-hero-inner {
        grid-template-columns: 1fr !important;
        gap: 26px !important;
    }

    #ms-hero .ms-hero-copy {
        max-width: 820px !important;
        transform: none !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(315px, 57vw, 520px) !important;
        justify-content: center !important;
        transform: none !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 820px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap::before {
        inset: -18% -28% -20% -28% !important;
        background-position: center !important;
        background-size: 146% auto !important;
    }
}

@media (max-width: 767px) {
    #ms-hero.ms-hero {
        padding: calc(var(--nav-height, 70px) + 28px) 16px 38px !important;
        text-align: left !important;
    }

    #ms-hero .ms-hero-eyebrow {
        font-size: 10px !important;
        margin-bottom: 16px !important;
        padding: 7px 11px !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(42px, 13.5vw, 58px) !important;
        line-height: 1 !important;
    }

    #ms-hero .ms-hero-desc {
        margin-top: 18px !important;
        font-size: 16px !important;
        line-height: 1.62 !important;
    }

    #ms-hero .ms-hero-actions {
        margin-top: 24px !important;
    }

    #ms-hero .ms-hero-actions .ms-btn {
        flex: 1 1 155px !important;
        justify-content: center !important;
        padding: 0 18px !important;
    }

    #ms-hero .ms-hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px 14px !important;
        margin-top: 26px !important;
    }

    #ms-hero .ms-hero-stat-value {
        font-size: 23px !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(250px, 70vw, 350px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(128%, 610px) !important;
        margin-left: -9% !important;
    }

    #ms-hero .ms-hero-monitor-wrap::before {
        inset: -16% -27% -18% -27% !important;
        background-size: 145% auto !important;
    }
}

/* =========================================================
   HERO IMAGE REPAIR - true cutout, no forced rectangle crop
   ========================================================= */
#ms-hero.ms-hero {
    min-height: clamp(600px, 74vh, 790px) !important;
    padding-top: calc(var(--nav-height, 72px) + 34px) !important;
    padding-bottom: 42px !important;
}

#ms-hero .ms-hero-inner {
    grid-template-columns: minmax(520px, .96fr) minmax(650px, 1.04fr) !important;
    gap: clamp(34px, 4.4vw, 76px) !important;
}

#ms-hero .ms-hero-copy {
    max-width: 710px !important;
}

#ms-hero .ms-hero-title {
    max-width: 700px !important;
    font-size: clamp(56px, 4.75vw, 80px) !important;
    line-height: 1.02 !important;
}

#ms-hero .ms-hero-title-accent {
    white-space: nowrap !important;
}

#ms-hero .ms-hero-desc {
    max-width: 610px !important;
}

#ms-hero .ms-hero-visual {
    min-height: clamp(395px, 39vw, 590px) !important;
    transform: translateX(12px) !important;
}

#ms-hero .ms-hero-visual::before {
    inset: 7% 2% 10% 13% !important;
    background:
        radial-gradient(circle at 70% 40%, rgba(255, 108, 134, .20), transparent 35%),
        radial-gradient(circle at 35% 70%, rgba(155, 92, 255, .10), transparent 32%),
        linear-gradient(135deg, rgba(255, 244, 238, .50), rgba(255, 229, 242, .34)) !important;
}

#ms-hero .ms-hero-monitor-wrap {
    width: min(100%, 790px) !important;
    aspect-ratio: 1097 / 888 !important;
}

#ms-hero .ms-hero-monitor-wrap::before {
    inset: -6% -4% -5% -8% !important;
    background: transparent !important;
    filter: drop-shadow(0 34px 42px rgba(23, 35, 64, .16)) !important;
}

#ms-hero .ms-hero-monitor-wrap::after {
    left: 18% !important;
    right: 12% !important;
    bottom: 3% !important;
    height: 10% !important;
    opacity: .62 !important;
}

#ms-hero .ms-hero-stats {
    width: min(100%, 620px) !important;
    gap: 18px !important;
}

@media (max-width: 1320px) {
    #ms-hero .ms-hero-inner {
        grid-template-columns: minmax(460px, .98fr) minmax(520px, 1.02fr) !important;
        gap: 34px !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(50px, 4.55vw, 68px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 680px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap::before {
        inset: -5% -2% -4% -8% !important;
        background-size: contain !important;
    }
}

@media (max-width: 1100px) {
    #ms-hero .ms-hero-inner {
        grid-template-columns: 1fr !important;
    }

    #ms-hero .ms-hero-title-accent {
        white-space: normal !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(330px, 58vw, 500px) !important;
        transform: none !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 700px) !important;
    }
}

@media (max-width: 767px) {
    #ms-hero .ms-hero-title {
        font-size: clamp(42px, 12.5vw, 56px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(112%, 520px) !important;
        margin-left: -4% !important;
    }

    #ms-hero .ms-hero-monitor-wrap::before {
        inset: -4% -3% -4% -7% !important;
        background-size: contain !important;
    }
}

/* =========================================================
   MERGED LIGHT UI FINAL - single stylesheet authority
   ========================================================= */
/*
 * MonitorSuggest Final Light UI
 * Visual-only authority layer loaded after style.css.
 */

:root {
    color-scheme: light !important;
    --ms-final-bg: #f6f8fc;
    --ms-final-surface: #ffffff;
    --ms-final-surface-soft: #fbfcff;
    --ms-final-ink: #102027;
    --ms-final-ink-2: #24324f;
    --ms-final-muted: #64748b;
    --ms-final-muted-2: #8491a7;
    --ms-final-line: rgba(24, 39, 75, .10);
    --ms-final-line-2: rgba(24, 39, 75, .16);
    --ms-final-coral: #ff5f73;
    --ms-final-orange: #ff8a3d;
    --ms-final-pink: #f04495;
    --ms-final-purple: #9b5cff;
    --ms-final-blue: #3b82f6;
    --ms-final-teal: #0f9f8f;
    --ms-final-green: #13b981;
    --ms-final-amber: #ffb020;
    --ms-final-cta: linear-gradient(135deg, #ff8a3d 0%, #ff5f73 50%, #9b5cff 100%);
    --ms-final-cta-teal: linear-gradient(135deg, #14b8a6 0%, #0f766e 100%);
    --ms-final-hero: radial-gradient(circle at 80% 17%, rgba(255, 138, 61, .15), transparent 24%), radial-gradient(circle at 16% 22%, rgba(59, 130, 246, .09), transparent 25%), linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    --ms-final-card-shadow: 0 18px 46px rgba(23, 35, 64, .09);
    --ms-final-card-shadow-lg: 0 28px 76px rgba(23, 35, 64, .13);
    --ms-final-radius: 18px;
    --ms-final-radius-sm: 12px;
    --color-bg-base: var(--ms-final-bg) !important;
    --color-bg-header: rgba(255, 255, 255, .96) !important;
    --color-bg-card: var(--ms-final-surface) !important;
    --color-bg-card-hover: var(--ms-final-surface-soft) !important;
    --color-border: var(--ms-final-line) !important;
    --color-border-hover: var(--ms-final-line-2) !important;
    --color-text-primary: var(--ms-final-ink) !important;
    --color-text-secondary: var(--ms-final-muted) !important;
    --color-text-muted: var(--ms-final-muted-2) !important;
    --color-accent: var(--ms-final-coral) !important;
    --color-accent-dark: var(--ms-final-purple) !important;
    --gradient-hero: linear-gradient(110deg, #ff7a45 0%, #ff4f7b 44%, #9b5cff 100%) !important;
    --gradient-accent: var(--ms-final-cta) !important;
}

html,
body {
    background: var(--ms-final-bg) !important;
    color: var(--ms-final-ink) !important;
}

body {
    background:
        radial-gradient(circle at 5% 12%, rgba(255, 138, 61, .08), transparent 18%),
        radial-gradient(circle at 94% 14%, rgba(155, 92, 255, .08), transparent 19%),
        linear-gradient(180deg, #ffffff 0%, #f8faff 42%, #f5f8fe 100%) !important;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body::before,
body::after,
.page-header::after,
.ms-hero::after,
.ms-req-hero::after,
.ms-brand-hero::after,
.category-hero::after,
.archive-header::after,
section[class*="hero"]::after,
div[class*="hero"]::after,
.ms-bg-grid,
.ms-grid-bg,
.page-bg,
.theme-bg,
.legacy-bg {
    display: none !important;
    opacity: 0 !important;
    background: transparent !important;
}

[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#f6f4ef"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#fffdf8"],
[style*="#ffffff"],
[style*="#f2e8ff"],
[style*="#1e293b"],
[style*="background:#fffdf8"],
[style*="background: #fffdf8"],
[style*="background-color:#fffdf8"],
[style*="background-color: #fffdf8"],
[style*="background:#fffdf8"],
[style*="background: #fffdf8"] {
    background: var(--ms-final-surface) !important;
    background-color: var(--ms-final-surface) !important;
    color: var(--ms-final-ink) !important;
    border-color: var(--ms-final-line) !important;
}

a {
    color: var(--ms-final-teal) !important;
}

a:hover {
    color: var(--ms-final-coral) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.page-title,
.archive-title,
.ms-section-title,
.ms-card-title,
.ms-filter-title,
.ms-hero-title,
.spotlight-titles h2,
.lc-title,
.lgr-title,
.ms-req-title,
.ms-brand-card h3,
.ms-brand-title {
    color: var(--ms-final-ink) !important;
    text-shadow: none !important;
    letter-spacing: 0 !important;
}

p,
li,
td,
th,
label,
small,
.entry-content,
.entry-content p,
.ms-section-subtitle,
.ms-card-desc,
.ms-card-meta,
.ms-filter-desc,
.ms-filter-help,
.ms-hero-desc,
.ms-shopcat-sub,
.ms-req-reason,
.ms-brand-content p,
.ms-content-block p,
.ms-article p {
    color: var(--ms-final-muted) !important;
    text-shadow: none !important;
}

strong,
b,
.ms-price,
.ms-card-price,
.ms-rating-value,
.ms-stat-value {
    color: var(--ms-final-ink) !important;
}

.ms-header,
#ms-header,
.site-header,
header[role="banner"] {
    background: rgba(255, 255, 255, .94) !important;
    border-bottom: 1px solid var(--ms-final-line) !important;
    box-shadow: 0 10px 30px rgba(23, 35, 64, .08) !important;
    backdrop-filter: blur(18px) !important;
}

.ms-header.is-scrolled,
#ms-header.is-scrolled {
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 14px 38px rgba(23, 35, 64, .11) !important;
}

.ms-logo,
.custom-logo-link,
.site-title,
.ms-brand {
    color: var(--ms-final-ink) !important;
}

.ms-nav a,
.main-navigation a,
.menu a,
#ms-primary-nav a {
    color: #26334f !important;
    font-weight: 800 !important;
}

.ms-nav a:hover,
.main-navigation a:hover,
.menu a:hover,
#ms-primary-nav a:hover,
.current-menu-item > a,
.current_page_item > a {
    color: var(--ms-final-coral) !important;
}

.ms-header-actions button,
.ms-search-toggle,
.ms-region-current,
.ms-region-toggle,
.ms-community-btn,
.ms-nav-cta,
.join-community,
.ms-menu-toggle {
    background: #ffffff !important;
    color: var(--ms-final-ink) !important;
    border: 1px solid var(--ms-final-line) !important;
    box-shadow: 0 10px 24px rgba(23, 35, 64, .07) !important;
}

.ms-menu-toggle span,
.ms-menu-toggle::before,
.ms-menu-toggle::after {
    background: var(--ms-final-ink-2) !important;
}

.ms-region-menu,
.ms-region-dropdown,
.sub-menu,
.dropdown-menu {
    background: #ffffff !important;
    color: var(--ms-final-ink) !important;
    border: 1px solid var(--ms-final-line) !important;
    box-shadow: var(--ms-final-card-shadow-lg) !important;
}

.ms-region-menu a,
.ms-region-dropdown a,
.sub-menu a,
.dropdown-menu a {
    color: var(--ms-final-ink-2) !important;
}

.ms-region-menu a:hover,
.ms-region-dropdown a:hover,
.sub-menu a:hover,
.dropdown-menu a:hover {
    background: #fff4f6 !important;
    color: var(--ms-final-coral) !important;
}

.ms-hero,
#ms-hero,
.page-header,
.ms-req-hero,
.ms-brand-hero,
.category-hero,
.archive-header,
section[class*="hero"],
div[class*="hero"] {
    background: var(--ms-final-hero) !important;
    color: var(--ms-final-ink) !important;
    border-bottom: 1px solid var(--ms-final-line) !important;
}

#ms-hero.ms-hero {
    min-height: clamp(610px, 76vh, 820px) !important;
    padding: calc(var(--nav-height, 72px) + 42px) 22px 50px !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
}

#ms-hero.ms-hero::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    opacity: .75 !important;
    background-image:
        radial-gradient(circle, rgba(255, 95, 115, .13) 0 1px, transparent 1.5px),
        radial-gradient(circle, rgba(20, 184, 166, .10) 0 1px, transparent 1.5px) !important;
    background-size: 34px 34px, 48px 48px !important;
    background-position: 0 0, 18px 16px !important;
}

#ms-hero .ms-hero-inner {
    width: 100% !important;
    max-width: 1500px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(520px, .96fr) minmax(650px, 1.04fr) !important;
    align-items: center !important;
    gap: clamp(34px, 4.5vw, 76px) !important;
    position: relative !important;
    z-index: 1 !important;
}

#ms-hero .ms-hero-copy {
    max-width: 720px !important;
    gap: 0 !important;
    transform: none !important;
}

#ms-hero .ms-hero-eyebrow,
.ms-filter-eyebrow,
.lc-eyebrow,
.lgr-eyebrow,
.ms-req-kicker,
.ms-brand-kicker {
    display: inline-flex !important;
    width: fit-content !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 13px !important;
    border-radius: 999px !important;
    background: #fff1f3 !important;
    color: var(--ms-final-coral) !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

#ms-hero .ms-hero-title {
    max-width: 700px !important;
    margin: 0 !important;
    font-size: clamp(56px, 4.75vw, 80px) !important;
    line-height: 1.02 !important;
    font-weight: 950 !important;
}

#ms-hero .ms-hero-title-accent,
.ms-hero-heading-accent,
.text-gradient,
.gradient-text,
.ms-gradient-text {
    background: linear-gradient(110deg, #0f766e 0%, #14b8a6 38%, #ff5f73 74%, #9b5cff 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

#ms-hero .ms-hero-title-accent {
    white-space: nowrap !important;
}

#ms-hero .ms-hero-desc {
    max-width: 610px !important;
    margin: 22px 0 0 !important;
    color: #40516e !important;
    font-size: 18px !important;
    line-height: 1.68 !important;
    font-weight: 650 !important;
}

.ms-btn,
.ms-button,
.button,
.wp-block-button__link,
input[type="submit"],
button[type="submit"],
.ms-filter-submit,
.ms-submit-btn,
.ms-card-amazon,
.ms-amazon-btn,
.amazon-btn,
.ms-compare-btn,
.ms-card-secondary,
.ms-card-compare,
.lgr-btn,
.lc-btn,
.ms-request-cta {
    border-radius: 12px !important;
    border: 1px solid var(--ms-final-line) !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    box-shadow: 0 12px 26px rgba(23, 35, 64, .08) !important;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease, background .18s ease !important;
}

.ms-btn-primary,
.button-primary,
.wp-block-button__link,
input[type="submit"],
button[type="submit"],
.ms-filter-submit,
.ms-submit-btn,
#ms-hero .ms-hero-actions .ms-btn-primary,
.ms-request-cta,
.ms-card-amazon,
.ms-amazon-btn,
.amazon-btn {
    color: #ffffff !important;
    background: var(--ms-final-cta) !important;
    border-color: transparent !important;
    box-shadow: 0 16px 34px rgba(255, 95, 115, .24) !important;
}

.ms-btn-secondary,
#ms-hero .ms-hero-actions .ms-btn-secondary,
.ms-card-secondary,
.ms-card-compare,
.ms-compare-btn,
.lgr-btn,
.lc-btn {
    color: var(--ms-final-ink) !important;
    background: #ffffff !important;
    border-color: var(--ms-final-line) !important;
}

.ms-btn:hover,
.ms-button:hover,
.button:hover,
.wp-block-button__link:hover,
button:hover,
input[type="submit"]:hover,
.ms-card-secondary:hover,
.ms-card-compare:hover,
.ms-amazon-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 20px 42px rgba(23, 35, 64, .13) !important;
}

#ms-hero .ms-hero-actions {
    margin-top: 30px !important;
    gap: 14px !important;
}

#ms-hero .ms-hero-actions .ms-btn {
    min-height: 50px !important;
    padding: 0 27px !important;
    font-size: 15px !important;
}

#ms-hero .ms-hero-stats {
    width: min(100%, 620px) !important;
    margin-top: 30px !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

#ms-hero .ms-hero-stat {
    min-width: 0 !important;
    gap: 6px !important;
}

#ms-hero .ms-hero-stat::before {
    content: "" !important;
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    margin-bottom: 6px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle, var(--ms-final-teal) 0 3px, transparent 4px), rgba(20, 184, 166, .10) !important;
    border: 1px solid rgba(20, 184, 166, .16) !important;
}

#ms-hero .ms-hero-stat-value {
    color: var(--ms-final-ink) !important;
    font-size: clamp(22px, 1.7vw, 30px) !important;
    font-weight: 950 !important;
}

#ms-hero .ms-hero-stat-label {
    color: #65748c !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    letter-spacing: .05em !important;
    line-height: 1.35 !important;
}

#ms-hero .ms-hero-visual {
    min-height: clamp(395px, 39vw, 590px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    overflow: visible !important;
    transform: translateX(10px) !important;
}

#ms-hero .ms-hero-visual::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 7% 2% 10% 13% !important;
    border-radius: 999px !important;
    background: radial-gradient(circle at 70% 40%, rgba(255, 138, 61, .20), transparent 35%), radial-gradient(circle at 35% 70%, rgba(20, 184, 166, .12), transparent 32%), linear-gradient(135deg, rgba(255, 245, 237, .56), rgba(236, 253, 245, .36)) !important;
    pointer-events: none !important;
}

#ms-hero .ms-hero-monitor-wrap {
    position: relative !important;
    z-index: 2 !important;
    width: min(100%, 790px) !important;
    aspect-ratio: 1097 / 888 !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
}

#ms-hero .ms-hero-monitor-wrap::before {
    content: "" !important;
    position: absolute !important;
    z-index: 3 !important;
    inset: -6% -4% -5% -8% !important;
    display: block !important;
    background: transparent !important;
    filter: drop-shadow(0 34px 42px rgba(23, 35, 64, .16)) !important;
}

#ms-hero .ms-hero-monitor-wrap::after {
    content: "" !important;
    position: absolute !important;
    z-index: 1 !important;
    left: 18% !important;
    right: 12% !important;
    bottom: 3% !important;
    height: 10% !important;
    border-radius: 999px !important;
    background: radial-gradient(ellipse, rgba(20, 184, 166, .18), rgba(255, 95, 115, .10) 40%, transparent 72%) !important;
    filter: blur(18px) !important;
}

#ms-hero .ms-hero-monitor,
#ms-hero .ms-hero-monitor--primary,
#ms-hero .ms-hero-monitor--secondary,
#ms-hero .ms-hero-svg-monitor,
#ms-hero .ms-hero-monitor-svg,
#ms-hero .ms-hero-glow-orb {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

.ms-container,
.site-main,
.content-area,
main > .container,
.wrap {
    color: var(--ms-final-ink) !important;
}

.ms-filter-card,
.ms-filter-panel,
.ms-card,
.ms-global-card,
.monitor-card,
.comparison-card,
.spotlight-card,
.ms-community-panel,
.ms-brand-panel,
.ms-req-card,
.ms-brand-card,
.ms-form-card,
.ms-content-block,
.ms-article,
.entry-content > .wp-block-group,
.wp-block-group,
.wp-block-cover,
.wp-block-columns,
.ms-panel,
.ms-box,
.card,
details,
.faq-item {
    background: rgba(255, 255, 255, .96) !important;
    color: var(--ms-final-ink) !important;
    border: 1px solid var(--ms-final-line) !important;
    border-radius: var(--ms-final-radius) !important;
    box-shadow: var(--ms-final-card-shadow) !important;
}

.ms-filter-card,
.ms-filter-panel {
    background: rgba(255, 255, 255, .92) !important;
    backdrop-filter: blur(18px) !important;
    padding: clamp(18px, 2.5vw, 28px) !important;
}

input,
select,
textarea,
.select2-selection,
.ms-input,
.ms-select,
.ms-filter-input,
.ms-filter-select {
    background: #ffffff !important;
    color: var(--ms-final-ink) !important;
    border: 1px solid var(--ms-final-line-2) !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 18px rgba(23, 35, 64, .04) !important;
}

input::placeholder,
textarea::placeholder {
    color: #9aa6ba !important;
    opacity: 1 !important;
}

input:focus,
select:focus,
textarea:focus,
.select2-selection:focus {
    border-color: rgba(255, 95, 115, .46) !important;
    box-shadow: 0 0 0 4px rgba(255, 95, 115, .12) !important;
    outline: none !important;
}

.ms-global-card,
.monitor-card,
.ms-card {
    overflow: hidden !important;
    background: #ffffff !important;
    border-radius: 16px !important;
}

.ms-global-card:hover,
.monitor-card:hover,
.ms-card:hover,
.ms-brand-card:hover,
.ms-req-card:hover,
.ms-shopcat-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--ms-final-card-shadow-lg) !important;
    border-color: rgba(255, 95, 115, .22) !important;
}

.ms-card-media,
.ms-card-placeholder,
.monitor-image,
.ms-image-placeholder,
.ms-card-image-wrap {
    background: linear-gradient(145deg, #eef8ff 0%, #fff4f7 52%, #ffffff 100%) !important;
    border: 1px solid rgba(24, 39, 75, .08) !important;
    border-radius: 12px !important;
    color: var(--ms-final-muted) !important;
}

.ms-card-placeholder strong,
.ms-card-placeholder span {
    color: #71809a !important;
}

.ms-card-specs span,
.ms-spec-chip,
.spec-chip,
.chip,
.tag,
.badge,
.ms-card-rating-breakdown span,
.ms-meta-pill {
    background: #f3f6ff !important;
    color: #465875 !important;
    border: 1px solid rgba(24, 39, 75, .08) !important;
    border-radius: 9px !important;
}

.ms-card-price,
.price,
.monitor-price {
    color: var(--ms-final-coral) !important;
    font-weight: 950 !important;
}

.ms-star-rating,
.ms-stars-base,
.ms-stars-fill,
.star-rating,
.rating-stars {
    color: #ffb020 !important;
}

.ms-card-footer,
.ms-card-actions,
.ms-vote-row,
.ms-card-votes {
    background: transparent !important;
    border-color: var(--ms-final-line) !important;
}

.ms-vote-btn,
.ms-sugg-vote,
.vote-btn {
    background: #ffffff !important;
    color: var(--ms-final-ink-2) !important;
    border: 1px solid var(--ms-final-line) !important;
    border-radius: 10px !important;
}

.ms-vote-btn:hover,
.ms-sugg-vote:hover,
.vote-btn:hover {
    background: #ecfdf5 !important;
    color: var(--ms-final-teal) !important;
    border-color: rgba(20, 184, 166, .28) !important;
}

.ms-shopcat-card,
.ms-shopcat-inner,
.category-card {
    background: #ffffff !important;
    border: 1px solid var(--ms-final-line) !important;
    border-radius: 16px !important;
    box-shadow: 0 15px 38px rgba(23, 35, 64, .08) !important;
}

.ms-shopcat-card:nth-child(8n+1) .ms-shopcat-inner,
.category-card:nth-child(8n+1) { background: linear-gradient(180deg, #ffffff, #f0fdfa) !important; }
.ms-shopcat-card:nth-child(8n+2) .ms-shopcat-inner,
.category-card:nth-child(8n+2) { background: linear-gradient(180deg, #ffffff, #eff6ff) !important; }
.ms-shopcat-card:nth-child(8n+3) .ms-shopcat-inner,
.category-card:nth-child(8n+3) { background: linear-gradient(180deg, #ffffff, #fff1f6) !important; }
.ms-shopcat-card:nth-child(8n+4) .ms-shopcat-inner,
.category-card:nth-child(8n+4) { background: linear-gradient(180deg, #ffffff, #fff7ed) !important; }
.ms-shopcat-card:nth-child(8n+5) .ms-shopcat-inner,
.category-card:nth-child(8n+5) { background: linear-gradient(180deg, #ffffff, #f5f3ff) !important; }
.ms-shopcat-card:nth-child(8n+6) .ms-shopcat-inner,
.category-card:nth-child(8n+6) { background: linear-gradient(180deg, #ffffff, #fefce8) !important; }
.ms-shopcat-card:nth-child(8n+7) .ms-shopcat-inner,
.category-card:nth-child(8n+7) { background: linear-gradient(180deg, #ffffff, #f0f9ff) !important; }
.ms-shopcat-card:nth-child(8n+8) .ms-shopcat-inner,
.category-card:nth-child(8n+8) { background: linear-gradient(180deg, #ffffff, #faf5ff) !important; }

.ms-section,
.ms-section-band,
.ms-filter-section,
#ms-filter,
#ms-filter-results-section,
#ms-trending,
#ms-shop-by-category,
#ms-comparison-spotlight,
#ms-latest-comparisons,
#ms-latest-guides,
#ms-community-requests,
#ms-brands-we-track,
#ms-suggest-monitor,
#ms-warranty-claim {
    background: transparent !important;
    color: var(--ms-final-ink) !important;
}

.ms-section-link,
.view-all,
.view-more,
.ms-more-link {
    color: var(--ms-final-teal) !important;
    font-weight: 900 !important;
}

table,
.comparison-table,
.ms-compare-table,
.spec-table,
.ms-spec-table {
    background: #ffffff !important;
    color: var(--ms-final-ink) !important;
    border: 1px solid var(--ms-final-line) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: var(--ms-final-card-shadow) !important;
}

thead,
thead tr,
.comparison-table thead,
.ms-compare-table thead {
    background: #f6f8ff !important;
    color: var(--ms-final-ink) !important;
}

tbody tr,
td,
th {
    border-color: var(--ms-final-line) !important;
}

tbody tr:nth-child(even) {
    background: #fbfcff !important;
}

tbody tr:hover {
    background: #fff7f8 !important;
}

.winner,
.better,
.ok,
.success,
.ms-score-good,
.ms-badge-good {
    color: var(--ms-final-teal) !important;
}

.ms-score,
.score-badge,
.monitor-score,
.ms-card-score {
    background: #ecfdf5 !important;
    color: #047857 !important;
    border: 1px solid rgba(16, 185, 129, .20) !important;
    border-radius: 999px !important;
}

.ms-req-card,
.ms-community-panel,
.ms-brand-panel {
    background: #ffffff !important;
    border-color: rgba(20, 184, 166, .16) !important;
}

.ms-req-status,
.status-pill {
    background: #ecfdf5 !important;
    color: #047857 !important;
    border: 1px solid rgba(16, 185, 129, .18) !important;
}

.ms-req-meter-track,
.meter-track,
.progress-track {
    background: #edf1f7 !important;
    border-radius: 999px !important;
}

.ms-req-meter-track span,
.meter-fill,
.progress-fill {
    background: var(--ms-final-cta-teal) !important;
    border-radius: inherit !important;
}

.ms-community-cta,
.ms-final-community,
.ms-live-community {
    background: linear-gradient(135deg, #0f766e 0%, #115e59 100%) !important;
    color: #ffffff !important;
    border: 0 !important;
    box-shadow: 0 24px 70px rgba(15, 118, 110, .22) !important;
}

.ms-community-cta *,
.ms-final-community *,
.ms-live-community * {
    color: #ffffff !important;
}

.ms-community-cta .ms-btn,
.ms-final-community .ms-btn,
.ms-live-community .ms-btn {
    background: #ffffff !important;
    color: #0f766e !important;
}

.ms-newsletter,
.newsletter,
.subscribe-box,
.ms-join-panel {
    background: linear-gradient(135deg, rgba(20, 184, 166, .12), rgba(255, 95, 115, .12), rgba(155, 92, 255, .12)) !important;
    color: var(--ms-final-ink) !important;
    border: 1px solid var(--ms-final-line) !important;
    border-radius: 20px !important;
    box-shadow: var(--ms-final-card-shadow) !important;
}

.ms-footer,
footer,
.site-footer {
    background: #ffffff !important;
    color: var(--ms-final-muted) !important;
    border-top: 1px solid var(--ms-final-line) !important;
}

.ms-footer h2,
.ms-footer h3,
.ms-footer h4,
footer h2,
footer h3,
footer h4 {
    color: var(--ms-final-ink) !important;
}

.ms-footer a,
footer a {
    color: #4c5b73 !important;
}

.ms-footer a:hover,
footer a:hover {
    color: var(--ms-final-coral) !important;
}

.ms-mobile-overlay {
    background: rgba(15, 23, 42, .30) !important;
    backdrop-filter: blur(5px) !important;
}

summary {
    color: var(--ms-final-ink) !important;
    font-weight: 900 !important;
}

details[open],
.faq-item:hover {
    border-color: rgba(255, 95, 115, .22) !important;
}

hr,
.divider,
.separator {
    border-color: var(--ms-final-line) !important;
}

::selection {
    background: rgba(255, 95, 115, .20) !important;
    color: var(--ms-final-ink) !important;
}

@media (max-width: 1320px) {
    #ms-hero .ms-hero-inner {
        grid-template-columns: minmax(450px, .96fr) minmax(520px, 1.04fr) !important;
        gap: 34px !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(50px, 4.55vw, 68px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 680px) !important;
    }
}

@media (max-width: 1100px) {
    #ms-hero.ms-hero {
        min-height: auto !important;
        padding: calc(var(--nav-height, 72px) + 34px) 18px 48px !important;
    }

    #ms-hero .ms-hero-inner {
        grid-template-columns: 1fr !important;
        gap: 26px !important;
    }

    #ms-hero .ms-hero-title-accent {
        white-space: normal !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(330px, 58vw, 500px) !important;
        justify-content: center !important;
        transform: none !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 700px) !important;
    }

    #ms-primary-nav {
        background: #ffffff !important;
        color: var(--ms-final-ink) !important;
        box-shadow: var(--ms-final-card-shadow-lg) !important;
    }
}

@media (max-width: 767px) {
    body {
        background: linear-gradient(180deg, #ffffff 0%, #f8faff 100%) !important;
    }

    #ms-hero.ms-hero,
    .page-header,
    .ms-req-hero,
    .ms-brand-hero,
    .category-hero,
    .archive-header {
        padding-top: calc(var(--nav-height, 70px) + 28px) !important;
        padding-bottom: 38px !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(42px, 12.5vw, 56px) !important;
        line-height: 1 !important;
    }

    #ms-hero .ms-hero-desc {
        font-size: 16px !important;
        line-height: 1.62 !important;
    }

    #ms-hero .ms-hero-actions .ms-btn {
        flex: 1 1 155px !important;
        justify-content: center !important;
    }

    #ms-hero .ms-hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px 14px !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(112%, 520px) !important;
        margin-left: -4% !important;
    }

    .ms-filter-card,
    .ms-global-card,
    .ms-community-panel,
    .ms-brand-panel,
    .ms-form-card,
    .ms-content-block,
    .ms-article,
    details {
        border-radius: 14px !important;
    }

    table,
    .comparison-table,
    .ms-compare-table,
    .spec-table {
        font-size: 13px !important;
    }
}

/* =========================================================
   HOMEPAGE FINAL POLISH - scale, color, hero and section rhythm
   This is intentionally last so the new light UI wins over legacy rules.
   ========================================================= */
body.home,
body.home .site,
body.home #page,
body.home main {
    background:
        radial-gradient(circle at 12% 8%, rgba(255, 107, 74, .08), transparent 28%),
        radial-gradient(circle at 86% 16%, rgba(15, 118, 110, .08), transparent 32%),
        linear-gradient(180deg, #FFFDF8 0%, #F6F4EF 46%, #F4F7F4 100%) !important;
}

body.home .ms-container,
body.home .lc-inner,
body.home .spotlight-header,
body.home .spotlight-table {
    width: min(100% - 56px, 1500px) !important;
    max-width: 1500px !important;
}

body.home .ms-section,
body.home .lc-section,
body.home .comparison-spotlight-section {
    padding: clamp(58px, 6vw, 92px) 0 !important;
}

#ms-hero.ms-hero {
    min-height: clamp(720px, 82vh, 920px) !important;
    padding: calc(var(--nav-height, 72px) + 58px) 0 74px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 82% 25%, rgba(255, 107, 74, .13), transparent 34%),
        radial-gradient(circle at 64% 48%, rgba(15, 118, 110, .09), transparent 38%),
        linear-gradient(180deg, #FFFDF8 0%, #F6F4EF 100%) !important;
}

#ms-hero.ms-hero::before {
    opacity: .48 !important;
    background-image:
        radial-gradient(circle, rgba(255, 107, 74, .11) 0 1px, transparent 1.6px),
        radial-gradient(circle, rgba(15, 118, 110, .08) 0 1px, transparent 1.6px) !important;
    background-size: 38px 38px, 58px 58px !important;
}

#ms-hero .ms-hero-inner {
    width: min(100% - 56px, 1500px) !important;
    max-width: 1500px !important;
    grid-template-columns: minmax(540px, .82fr) minmax(760px, 1.18fr) !important;
    gap: clamp(42px, 5vw, 92px) !important;
    align-items: center !important;
}

#ms-hero .ms-hero-copy {
    max-width: 720px !important;
    padding-top: 8px !important;
}

#ms-hero .ms-hero-eyebrow {
    width: max-content !important;
    max-width: 100% !important;
    margin-bottom: 26px !important;
    padding: 9px 16px !important;
    border-radius: 999px !important;
    background: rgba(255, 107, 74, .11) !important;
    color: #E5533D !important;
    border: 1px solid rgba(255, 107, 74, .14) !important;
    box-shadow: 0 10px 24px rgba(255, 107, 74, .09) !important;
    letter-spacing: .06em !important;
}

#ms-hero .ms-hero-title {
    max-width: 800px !important;
    margin: 0 !important;
    color: #102027 !important;
    font-size: clamp(76px, 5.9vw, 112px) !important;
    line-height: .94 !important;
    letter-spacing: 0 !important;
    font-weight: 950 !important;
}

#ms-hero .ms-hero-title-accent {
    display: inline-block !important;
    background: linear-gradient(105deg, #0B6B60 0%, #0F766E 52%, #0A4F49 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

#ms-hero .ms-hero-desc {
    max-width: 630px !important;
    margin: 26px 0 0 !important;
    color: #334155 !important;
    font-size: clamp(17px, 1vw, 20px) !important;
    line-height: 1.75 !important;
    font-weight: 700 !important;
}

#ms-hero .ms-hero-actions {
    margin-top: 34px !important;
    gap: 18px !important;
}

#ms-hero .ms-hero-actions .ms-btn {
    min-height: 58px !important;
    padding: 0 34px !important;
    border-radius: 14px !important;
    font-size: 16px !important;
    font-weight: 900 !important;
}

#ms-hero .ms-hero-actions .ms-btn-primary {
    background: linear-gradient(135deg, #FF6B4A 0%, #FF4F45 100%) !important;
    box-shadow: 0 14px 30px rgba(255, 107, 74, .25) !important;
}

#ms-hero .ms-hero-actions .ms-btn-secondary {
    background: rgba(255, 255, 255, .88) !important;
    color: #102027 !important;
    border: 1px solid rgba(20, 45, 50, .15) !important;
    box-shadow: 0 12px 28px rgba(16, 35, 45, .07) !important;
}

#ms-hero .ms-hero-stats {
    width: min(100%, 790px) !important;
    margin-top: 40px !important;
    padding: 24px 26px !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 20px !important;
    background: rgba(255, 253, 248, .82) !important;
    border: 1px solid rgba(20, 45, 50, .10) !important;
    border-radius: 22px !important;
    box-shadow: 0 18px 44px rgba(16, 35, 45, .08) !important;
    backdrop-filter: blur(14px) !important;
}

#ms-hero .ms-hero-stat-value {
    color: #102027 !important;
    font-size: clamp(28px, 2.2vw, 38px) !important;
    line-height: 1 !important;
}

#ms-hero .ms-hero-stat-label {
    margin-top: 8px !important;
    color: #5B6870 !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
}

#ms-hero .ms-hero-visual {
    min-height: clamp(520px, 43vw, 720px) !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
}

#ms-hero .ms-hero-visual::before {
    inset: 2% -4% 6% 7% !important;
    border-radius: 999px !important;
    background:
        radial-gradient(circle at 76% 38%, rgba(255, 107, 74, .16), transparent 36%),
        radial-gradient(circle at 30% 68%, rgba(15, 118, 110, .10), transparent 34%),
        linear-gradient(135deg, rgba(255, 239, 227, .72), rgba(230, 245, 239, .48)) !important;
    filter: blur(.2px) !important;
}

#ms-hero .ms-hero-monitor-wrap {
    width: min(108%, 980px) !important;
    aspect-ratio: 1318 / 965 !important;
    margin: 0 -4% 0 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

#ms-hero .ms-hero-monitor,
#ms-hero .ms-hero-monitor--primary,
#ms-hero .ms-hero-monitor--secondary,
#ms-hero .ms-hero-svg-monitor,
#ms-hero .ms-hero-monitor-svg,
#ms-hero .ms-hero-glow-orb {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

#ms-hero .ms-hero-monitor-wrap::before {
    content: "" !important;
    position: absolute !important;
    inset: -7% -7% -8% -10% !important;
    z-index: 2 !important;
    background: transparent !important;
    filter: drop-shadow(0 34px 44px rgba(16, 35, 45, .16)) !important;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 4.5%, #000 98%, transparent 100%) !important;
    mask-image: linear-gradient(90deg, transparent 0%, #000 4.5%, #000 98%, transparent 100%) !important;
}

#ms-hero .ms-hero-monitor-wrap::after {
    content: "" !important;
    position: absolute !important;
    left: 18% !important;
    right: 7% !important;
    bottom: 5% !important;
    height: 13% !important;
    z-index: 1 !important;
    background: radial-gradient(ellipse, rgba(15, 118, 110, .18), rgba(255, 107, 74, .10) 45%, transparent 74%) !important;
    filter: blur(12px) !important;
}

#ms-filter.ms-filter-section,
.ms-filter-section {
    margin-top: -42px !important;
    padding-bottom: 28px !important;
}

body.home .ms-filter-card {
    padding: clamp(28px, 2.6vw, 42px) !important;
    border-radius: 26px !important;
    background: rgba(255, 253, 248, .96) !important;
    border: 1px solid rgba(20, 45, 50, .10) !important;
    box-shadow: 0 24px 70px rgba(16, 35, 45, .10) !important;
}

body.home .ms-filter-grid {
    gap: 18px !important;
}

body.home .ms-filter-title {
    color: #102027 !important;
    font-size: 24px !important;
}

body.home .ms-filter-desc,
body.home .ms-filter-footer,
body.home .ms-filter-count {
    color: #5B6870 !important;
}

body.home .ms-filter-select,
body.home .ms-filter-input {
    min-height: 52px !important;
    border-radius: 12px !important;
}

body.home .ms-section-header {
    margin-bottom: 28px !important;
}

body.home .ms-section-title,
body.home .spotlight-titles h2,
body.home .lc-title {
    color: #102027 !important;
    font-size: clamp(28px, 2.1vw, 38px) !important;
    letter-spacing: 0 !important;
}

body.home .ms-section-sub,
body.home .spotlight-titles p,
body.home .lc-subtitle {
    color: #5B6870 !important;
    font-size: 15px !important;
}

body.home .ms-trending-grid,
body.home .ms-filter-results-grid {
    grid-template-columns: repeat(4, minmax(250px, 1fr)) !important;
    gap: 26px !important;
}

body.home .ms-global-card,
body.home .monitor-card {
    border-radius: 22px !important;
    background: #FFFDF8 !important;
    border: 1px solid rgba(20, 45, 50, .11) !important;
    box-shadow: 0 16px 44px rgba(16, 35, 45, .08) !important;
    overflow: hidden !important;
}

body.home .ms-card-media {
    min-height: 178px !important;
    margin: 16px 16px 0 !important;
    border-radius: 16px !important;
}

body.home .ms-card-body {
    padding: 18px 18px 16px !important;
}

body.home .ms-card-title,
body.home .ms-card-title a {
    color: #102027 !important;
    font-size: 17px !important;
    line-height: 1.25 !important;
}

body.home .ms-card-price {
    color: #FF5A45 !important;
    font-size: 22px !important;
}

body.home .ms-card-footer {
    padding: 14px 18px 18px !important;
    background: linear-gradient(180deg, rgba(244, 247, 244, .42), rgba(255, 253, 248, .95)) !important;
}

body.home .ms-amazon-btn,
body.home .amazon-btn {
    min-height: 42px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #FFB020 0%, #FF9800 100%) !important;
    color: #102027 !important;
    box-shadow: 0 10px 22px rgba(255, 152, 0, .20) !important;
}

body.home .ms-shopcat-grid {
    grid-template-columns: repeat(8, minmax(128px, 1fr)) !important;
    gap: 18px !important;
}

body.home .ms-shopcat-inner {
    min-height: 180px !important;
    padding: 20px !important;
    border-radius: 20px !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,253,248,.96)),
        radial-gradient(circle at top right, color-mix(in srgb, var(--sc-icon, #0F766E) 18%, transparent), transparent 44%) !important;
}

body.home .ms-shopcat-icon {
    width: 46px !important;
    height: 46px !important;
    border-radius: 16px !important;
    background: color-mix(in srgb, var(--sc-icon, #0F766E) 16%, #FFFFFF) !important;
    color: var(--sc-icon, #0F766E) !important;
}

body.home .comparison-spotlight-section {
    background:
        radial-gradient(circle at 12% 10%, rgba(255, 107, 74, .08), transparent 28%),
        radial-gradient(circle at 92% 18%, rgba(15, 118, 110, .08), transparent 34%),
        linear-gradient(180deg, #F8FAFC 0%, #FFFDF8 100%) !important;
}

body.home .spotlight-header {
    margin-bottom: 24px !important;
}

body.home .spotlight-table {
    border-radius: 24px !important;
    background: rgba(255, 253, 248, .98) !important;
    border: 1px solid rgba(20, 45, 50, .10) !important;
    box-shadow: 0 24px 70px rgba(16, 35, 45, .10) !important;
    overflow: hidden !important;
}

body.home .spotlight-row {
    border-color: rgba(20, 45, 50, .10) !important;
}

body.home .spotlight-row.table-header-row {
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%) !important;
}

body.home .spotlight-row > div,
body.home .spotlight-row span {
    color: #334155 !important;
}

body.home .spotlight-row h3,
body.home .spotlight-row .col-spec {
    color: #102027 !important;
}

body.home .spotlight-row .price,
body.home .spotlight-row .price span,
body.home .spotlight-row .trophy {
    color: #E5533D !important;
}

body.home .score-badge {
    background: linear-gradient(135deg, #0F766E, #0B6B60) !important;
    color: #FFFFFF !important;
}

body.home .lc-section,
body.home .lgr-section,
body.home .ms-newsletter-section,
body.home .ms-community-home-section {
    background: transparent !important;
}

@media (max-width: 1280px) {
    #ms-hero .ms-hero-inner {
        grid-template-columns: minmax(450px, .9fr) minmax(560px, 1.1fr) !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(58px, 5.4vw, 86px) !important;
    }

    body.home .ms-trending-grid,
    body.home .ms-filter-results-grid {
        grid-template-columns: repeat(4, minmax(210px, 1fr)) !important;
    }
}

@media (max-width: 1024px) {
    body.home .ms-container,
    body.home .lc-inner,
    body.home .spotlight-header,
    body.home .spotlight-table,
    #ms-hero .ms-hero-inner {
        width: min(100% - 36px, 1500px) !important;
    }

    #ms-hero .ms-hero-inner {
        grid-template-columns: 1fr !important;
    }

    #ms-hero .ms-hero-copy {
        max-width: 820px !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(360px, 58vw, 560px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 780px) !important;
        margin: 0 auto !important;
    }

    body.home .ms-trending-grid,
    body.home .ms-filter-results-grid,
    body.home .ms-shopcat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    body.home .ms-container,
    body.home .lc-inner,
    body.home .spotlight-header,
    body.home .spotlight-table,
    #ms-hero .ms-hero-inner {
        width: min(100% - 28px, 1500px) !important;
    }

    #ms-hero.ms-hero {
        min-height: auto !important;
        padding-top: calc(var(--nav-height, 70px) + 32px) !important;
        padding-bottom: 58px !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(46px, 14vw, 62px) !important;
    }

    #ms-hero .ms-hero-desc {
        font-size: 16px !important;
    }

    #ms-hero .ms-hero-actions {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    #ms-hero .ms-hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        padding: 18px !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(260px, 82vw, 390px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(124%, 560px) !important;
        margin-left: -8% !important;
    }

    #ms-filter.ms-filter-section,
    .ms-filter-section {
        margin-top: -22px !important;
    }

    body.home .ms-filter-card {
        padding: 22px !important;
    }

    body.home .ms-trending-grid,
    body.home .ms-filter-results-grid,
    body.home .ms-shopcat-grid {
        grid-template-columns: 1fr !important;
    }
}







/* Hero stats repair: prevent big numbers from colliding in the left column. */
#ms-hero .ms-hero-stats {
    width: min(100%, 690px) !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: clamp(14px, 1.4vw, 22px) !important;
    padding: 22px 24px !important;
}

#ms-hero .ms-hero-stat {
    min-width: 0 !important;
    overflow: hidden !important;
}

#ms-hero .ms-hero-stat-value {
    display: block !important;
    font-size: clamp(23px, 1.55vw, 30px) !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

#ms-hero .ms-hero-stat-label {
    display: block !important;
    max-width: 100% !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere !important;
}

@media (max-width: 1180px) {
    #ms-hero .ms-hero-stats {
        width: min(100%, 560px) !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    #ms-hero .ms-hero-stats {
        width: 100% !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        padding: 18px !important;
    }
}

/* =========================================================
   HOMEPAGE HERO FINAL - premium monitor comparison reference
   ========================================================= */
#ms-hero.ms-hero {
    min-height: clamp(650px, 78vh, 850px) !important;
    padding: calc(var(--nav-height, 72px) + 42px) 22px 46px !important;
    background:
        radial-gradient(circle at 78% 25%, rgba(255, 107, 74, .12), transparent 34%),
        radial-gradient(circle at 62% 45%, rgba(15, 118, 110, .08), transparent 38%),
        linear-gradient(180deg, #FFFDF8 0%, #F6F4EF 100%) !important;
    border-bottom: 1px solid rgba(20, 45, 50, .08) !important;
}

#ms-hero.ms-hero::before {
    opacity: .42 !important;
    background-image:
        radial-gradient(circle, rgba(255, 107, 74, .09) 0 1px, transparent 1.5px),
        radial-gradient(circle, rgba(15, 118, 110, .07) 0 1px, transparent 1.5px) !important;
    background-size: 36px 36px, 54px 54px !important;
}

#ms-hero .ms-hero-inner {
    grid-template-columns: minmax(520px, .86fr) minmax(720px, 1.14fr) !important;
    gap: clamp(38px, 4.6vw, 82px) !important;
    max-width: 1520px !important;
}

#ms-hero .ms-hero-copy {
    max-width: 700px !important;
}

#ms-hero .ms-hero-eyebrow {
    margin-bottom: 24px !important;
    padding: 8px 14px !important;
    background: rgba(255, 107, 74, .10) !important;
    border: 1px solid rgba(255, 107, 74, .13) !important;
    color: #E5533D !important;
    box-shadow: 0 8px 22px rgba(255, 107, 74, .08) !important;
}

#ms-hero .ms-hero-eyebrow-dot {
    background: #FF6B4A !important;
    box-shadow: 0 0 0 5px rgba(255, 107, 74, .12) !important;
}

#ms-hero .ms-hero-title {
    max-width: 760px !important;
    color: #102027 !important;
    font-size: clamp(68px, 5.4vw, 96px) !important;
    line-height: .98 !important;
    font-weight: 950 !important;
}

#ms-hero .ms-hero-title-accent {
    background: linear-gradient(110deg, #0B6B60 0%, #0F766E 62%, #102027 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

#ms-hero .ms-hero-desc {
    max-width: 660px !important;
    margin-top: 24px !important;
    color: #334155 !important;
    font-size: 18px !important;
    line-height: 1.7 !important;
    font-weight: 700 !important;
}

#ms-hero .ms-hero-actions {
    margin-top: 32px !important;
    gap: 18px !important;
}

#ms-hero .ms-hero-actions .ms-btn {
    min-height: 56px !important;
    padding: 0 32px !important;
    border-radius: 12px !important;
    font-size: 16px !important;
}

#ms-hero .ms-hero-actions .ms-btn-primary {
    background: #FF6B4A !important;
    color: #FFFFFF !important;
    box-shadow: 0 10px 24px rgba(255, 107, 74, .22) !important;
}

#ms-hero .ms-hero-actions .ms-btn-primary:hover {
    background: #F04B37 !important;
    box-shadow: 0 16px 32px rgba(255, 107, 74, .30) !important;
}

#ms-hero .ms-hero-actions .ms-btn-secondary {
    background: #FFFFFF !important;
    color: #102027 !important;
    border: 1px solid rgba(20, 45, 50, .14) !important;
    box-shadow: 0 10px 24px rgba(16, 35, 45, .07) !important;
}

#ms-hero .ms-hero-stats {
    width: min(100%, 760px) !important;
    margin-top: 38px !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: clamp(18px, 2.3vw, 34px) !important;
}

#ms-hero .ms-hero-stat::before {
    width: 28px !important;
    height: 28px !important;
    margin-bottom: 9px !important;
    border: 1px solid rgba(20, 45, 50, .10) !important;
    box-shadow: 0 8px 18px rgba(16, 35, 45, .06) !important;
}

#ms-hero .ms-hero-stat:nth-child(1)::before {
    background: radial-gradient(circle, #0F766E 0 4px, transparent 5px), rgba(15, 118, 110, .10) !important;
}

#ms-hero .ms-hero-stat:nth-child(2)::before {
    background: radial-gradient(circle, #FF6B4A 0 4px, transparent 5px), rgba(255, 107, 74, .10) !important;
}

#ms-hero .ms-hero-stat:nth-child(3)::before {
    background: radial-gradient(circle, #F59E0B 0 4px, transparent 5px), rgba(245, 158, 11, .12) !important;
}

#ms-hero .ms-hero-stat:nth-child(4)::before {
    background: radial-gradient(circle, #0E7C68 0 4px, transparent 5px), rgba(14, 124, 104, .10) !important;
}

#ms-hero .ms-hero-stat-value {
    color: #102027 !important;
    font-size: clamp(25px, 2vw, 34px) !important;
}

#ms-hero .ms-hero-stat-label {
    color: #5B6870 !important;
    font-size: 13px !important;
    font-weight: 850 !important;
}

#ms-hero .ms-hero-visual {
    min-height: clamp(460px, 42vw, 690px) !important;
    justify-content: flex-end !important;
    transform: translateX(18px) !important;
}

#ms-hero .ms-hero-visual::before {
    inset: 6% -3% 9% 10% !important;
    border-radius: 999px !important;
    background:
        radial-gradient(circle at 72% 38%, rgba(255, 107, 74, .16), transparent 35%),
        radial-gradient(circle at 38% 60%, rgba(15, 118, 110, .10), transparent 36%) !important;
}

#ms-hero .ms-hero-monitor-wrap {
    width: min(100%, 900px) !important;
    aspect-ratio: 1318 / 965 !important;
    overflow: visible !important;
}

#ms-hero .ms-hero-monitor-wrap::before {
    inset: -6% -6% -7% -8% !important;
    background: transparent !important;
    filter: drop-shadow(0 32px 42px rgba(16, 35, 45, .14)) !important;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 96%, transparent 100%) !important;
    mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 96%, transparent 100%) !important;
}

#ms-hero .ms-hero-monitor-wrap::after {
    left: 22% !important;
    right: 10% !important;
    bottom: 4% !important;
    height: 10% !important;
    background: radial-gradient(ellipse, rgba(15, 118, 110, .16), rgba(255, 107, 74, .10) 42%, transparent 72%) !important;
}

.ms-filter-section,
#ms-filter {
    margin-top: clamp(-34px, -2vw, -18px) !important;
    position: relative !important;
    z-index: 4 !important;
}

.ms-filter-card,
.ms-filter-panel {
    background: #FFFFFF !important;
    border: 1px solid rgba(20, 45, 50, .10) !important;
    box-shadow: 0 14px 40px rgba(16, 35, 45, .08) !important;
    border-radius: 22px !important;
}

.ms-filter-label,
.ms-filter-card label,
.ms-filter-panel label {
    color: #334155 !important;
    font-weight: 850 !important;
}

.ms-filter-card select,
.ms-filter-card input,
.ms-filter-panel select,
.ms-filter-panel input {
    color: #102027 !important;
    border-color: rgba(20, 45, 50, .16) !important;
}

.ms-filter-footer,
.ms-filter-help,
.ms-filter-count {
    color: #5B6870 !important;
}

@media (max-width: 1320px) {
    #ms-hero .ms-hero-inner {
        grid-template-columns: minmax(450px, .9fr) minmax(560px, 1.1fr) !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(56px, 5vw, 78px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 760px) !important;
    }
}

@media (max-width: 1100px) {
    #ms-hero.ms-hero {
        min-height: auto !important;
    }

    #ms-hero .ms-hero-inner {
        grid-template-columns: 1fr !important;
    }

    #ms-hero .ms-hero-title {
        max-width: 800px !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(340px, 60vw, 560px) !important;
        justify-content: center !important;
        transform: none !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 760px) !important;
    }
}

@media (max-width: 767px) {
    #ms-hero.ms-hero {
        padding-top: calc(var(--nav-height, 70px) + 30px) !important;
        padding-bottom: 44px !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(44px, 13vw, 58px) !important;
    }

    #ms-hero .ms-hero-actions .ms-btn {
        min-height: 50px !important;
        padding: 0 18px !important;
    }

    #ms-hero .ms-hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(270px, 78vw, 390px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(124%, 560px) !important;
        margin-left: -7% !important;
    }
}

/* =========================================================
   PREMIUM READABILITY PASS - warm ultra-HD light theme
   Visual-only contrast polish loaded as the final authority.
   ========================================================= */
:root {
    color-scheme: light !important;
    --ms-final-bg: #F6F4EF !important;
    --ms-final-surface: #FFFDF8 !important;
    --ms-final-surface-soft: #F9F7F1 !important;
    --ms-final-ink: #102027 !important;
    --ms-final-ink-2: #12232E !important;
    --ms-final-muted: #334155 !important;
    --ms-final-muted-2: #5B6870 !important;
    --ms-final-line: rgba(20, 45, 50, .12) !important;
    --ms-final-line-2: rgba(20, 45, 50, .18) !important;
    --ms-final-coral: #FF5A45 !important;
    --ms-final-orange: #FF6B4A !important;
    --ms-final-pink: #D94686 !important;
    --ms-final-purple: #7C3AED !important;
    --ms-final-blue: #2563EB !important;
    --ms-final-teal: #0F766E !important;
    --ms-final-green: #0E7C68 !important;
    --ms-final-amber: #F59E0B !important;
    --ms-final-cta: linear-gradient(135deg, #FF6B4A 0%, #FF5A45 58%, #D94686 100%) !important;
    --ms-final-cta-teal: linear-gradient(135deg, #0E7C68 0%, #0B6B60 100%) !important;
    --ms-final-hero: radial-gradient(circle at top right, rgba(16, 120, 100, .08), transparent 35%), radial-gradient(circle at top left, rgba(255, 112, 84, .08), transparent 30%), linear-gradient(180deg, #FFFDF8 0%, #F6F4EF 100%) !important;
    --ms-final-card-shadow: 0 14px 40px rgba(16, 35, 45, .08), 0 4px 14px rgba(16, 35, 45, .05) !important;
    --ms-final-card-shadow-lg: 0 24px 66px rgba(16, 35, 45, .13), 0 8px 22px rgba(16, 35, 45, .07) !important;
    --color-bg-base: #F6F4EF !important;
    --color-bg-header: rgba(255, 253, 248, .92) !important;
    --color-bg-card: #FFFDF8 !important;
    --color-bg-card-hover: #FFFFFF !important;
    --color-border: rgba(20, 45, 50, .12) !important;
    --color-border-hover: rgba(15, 118, 110, .36) !important;
    --color-text-primary: #102027 !important;
    --color-text-secondary: #334155 !important;
    --color-text-muted: #5B6870 !important;
    --color-accent: #FF5A45 !important;
    --color-accent-dark: #0F766E !important;
    --gradient-hero: linear-gradient(110deg, #0B6B60 0%, #0F766E 48%, #FF5A45 100%) !important;
    --gradient-accent: var(--ms-final-cta) !important;
}

html,
body {
    background:
        radial-gradient(circle at top right, rgba(16, 120, 100, .08), transparent 35%),
        radial-gradient(circle at top left, rgba(255, 112, 84, .08), transparent 30%),
        linear-gradient(180deg, #FFFDF8 0%, #F6F4EF 46%, #F4F7F4 100%) !important;
    color: #102027 !important;
}

body,
p,
li,
td,
th,
label,
input,
select,
textarea,
button,
.entry-content,
.entry-content p,
.wp-block-paragraph,
.ms-card-desc,
.ms-card-meta,
.ms-section-subtitle,
.ms-filter-desc,
.ms-filter-help,
.ms-shopcat-sub,
.ms-req-reason,
.ms-brand-content p,
.ms-content-block p,
.ms-article p,
.ms-rating-vote-total,
.ms-trend-rating-breakdown,
.ms-card-rating-breakdown,
.ms-card-rating-breakdown span,
.ms-filter-count,
.ms-result-count,
.meta,
.post-meta,
.entry-meta {
    color: #334155 !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.page-title,
.archive-title,
.ms-section-title,
.ms-card-title,
.ms-card-title a,
.ms-filter-title,
.ms-hero-title,
.spotlight-titles h2,
.lc-title,
.lgr-title,
.ms-req-title,
.ms-brand-card h3,
.ms-brand-title,
.comparison-title,
.guide-title,
.article-title {
    color: #102027 !important;
    text-shadow: none !important;
}

small,
.muted,
.text-muted,
.ms-muted,
.ms-card-meta,
.ms-card-specs,
.ms-filter-note,
.ms-filter-footer,
.ms-shopcat-count,
.ms-rating-vote-total,
.entry-meta,
.post-meta,
.footer-note,
.ms-footer p,
footer p {
    color: #5B6870 !important;
    opacity: 1 !important;
}

a {
    color: #0F766E !important;
}

a:hover,
.ms-section-link:hover,
.view-all:hover,
.view-more:hover {
    color: #FF5A45 !important;
}

.ms-header,
#ms-header,
.site-header,
header[role="banner"] {
    background: rgba(255, 253, 248, .90) !important;
    border-bottom: 1px solid rgba(20, 45, 50, .10) !important;
    box-shadow: 0 8px 28px rgba(16, 35, 45, .08) !important;
    backdrop-filter: blur(18px) saturate(1.15) !important;
}

.ms-header.is-scrolled,
#ms-header.is-scrolled {
    background: rgba(255, 253, 248, .97) !important;
    border-bottom-color: rgba(20, 45, 50, .13) !important;
    box-shadow: 0 12px 34px rgba(16, 35, 45, .11) !important;
}

.ms-logo-text,
.site-title {
    color: #102027 !important;
    font-weight: 950 !important;
}

.ms-nav a,
.main-navigation a,
.menu a,
#ms-primary-nav a,
.ms-primary-nav > .ms-nav-list > .menu-item > a {
    color: #12232E !important;
    font-weight: 850 !important;
}

.ms-nav a:hover,
.main-navigation a:hover,
.menu a:hover,
#ms-primary-nav a:hover,
.current-menu-item > a,
.current_page_item > a,
.ms-primary-nav > .ms-nav-list > .current-menu-item > a {
    color: #0F766E !important;
}

.ms-search-toggle,
.ms-region-current,
.ms-region-toggle,
.ms-community-btn,
.ms-nav-cta,
.join-community,
.ms-menu-toggle,
.ms-icon-btn {
    background: #FFFDF8 !important;
    color: #102027 !important;
    border: 1px solid rgba(20, 45, 50, .14) !important;
    box-shadow: 0 8px 20px rgba(16, 35, 45, .06) !important;
}

.ms-region-menu,
.ms-region-dropdown,
.sub-menu,
.dropdown-menu {
    background: #FFFDF8 !important;
    border: 1px solid rgba(20, 45, 50, .12) !important;
    box-shadow: var(--ms-final-card-shadow-lg) !important;
}

#ms-hero.ms-hero,
.ms-hero,
.page-header,
.ms-req-hero,
.ms-brand-hero,
.category-hero,
.archive-header {
    background: var(--ms-final-hero) !important;
    color: #102027 !important;
}

#ms-hero .ms-hero-eyebrow,
.ms-filter-eyebrow,
.lc-eyebrow,
.lgr-eyebrow,
.ms-req-kicker,
.ms-brand-kicker {
    background: rgba(255, 90, 69, .10) !important;
    color: #C2412D !important;
    border: 1px solid rgba(255, 90, 69, .12) !important;
}

#ms-hero .ms-hero-title {
    color: #102027 !important;
}

#ms-hero .ms-hero-title-accent,
.ms-hero-title-accent,
.ms-hero-heading-accent {
    background: linear-gradient(110deg, #0B6B60 0%, #0F766E 58%, #FF5A45 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

#ms-hero .ms-hero-desc {
    color: #334155 !important;
    font-weight: 700 !important;
}

#ms-hero .ms-hero-stat-value {
    color: #102027 !important;
}

#ms-hero .ms-hero-stat-label {
    color: #5B6870 !important;
    opacity: 1 !important;
}

#ms-hero .ms-hero-visual::before {
    background:
        radial-gradient(circle at 70% 40%, rgba(255, 107, 74, .20), transparent 34%),
        radial-gradient(circle at 34% 70%, rgba(15, 118, 110, .14), transparent 34%),
        linear-gradient(135deg, rgba(255, 253, 248, .65), rgba(230, 245, 239, .44)) !important;
}

.ms-filter-card,
.ms-filter-panel,
.ms-card,
.ms-global-card,
.monitor-card,
.comparison-card,
.spotlight-card,
.ms-community-panel,
.ms-brand-panel,
.ms-req-card,
.ms-brand-card,
.ms-form-card,
.ms-content-block,
.ms-article,
.entry-content > .wp-block-group,
.wp-block-group,
.ms-panel,
.ms-box,
.card,
details,
.faq-item {
    background: #FFFDF8 !important;
    color: #102027 !important;
    border: 1px solid rgba(20, 45, 50, .12) !important;
    border-radius: 20px !important;
    box-shadow: var(--ms-final-card-shadow) !important;
}

.ms-global-card:hover,
.monitor-card:hover,
.ms-card:hover,
.ms-brand-card:hover,
.ms-req-card:hover,
.ms-shopcat-card:hover,
.category-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--ms-final-card-shadow-lg) !important;
    border-color: rgba(15, 118, 110, .24) !important;
}

input,
select,
textarea,
.select2-selection,
.ms-input,
.ms-select,
.ms-filter-input,
.ms-filter-select,
.search-field {
    background: #FFFFFF !important;
    color: #14213D !important;
    border: 1px solid rgba(20, 45, 50, .18) !important;
    box-shadow: 0 5px 14px rgba(16, 35, 45, .04) !important;
}

input::placeholder,
textarea::placeholder,
.search-field::placeholder {
    color: #64727A !important;
    opacity: 1 !important;
}

input:focus,
select:focus,
textarea:focus,
.search-field:focus {
    border-color: rgba(15, 118, 110, .48) !important;
    box-shadow: 0 0 0 4px rgba(15, 118, 110, .12) !important;
}

.ms-btn-primary,
.button-primary,
.wp-block-button__link,
input[type="submit"],
button[type="submit"],
.ms-filter-submit,
.ms-submit-btn,
#ms-hero .ms-hero-actions .ms-btn-primary,
.ms-request-cta,
.ms-card-amazon,
.ms-amazon-btn,
.amazon-btn {
    color: #FFFFFF !important;
    background: var(--ms-final-cta) !important;
    border-color: transparent !important;
    box-shadow: 0 16px 34px rgba(255, 90, 69, .24) !important;
}

.ms-btn-primary:hover,
.button-primary:hover,
input[type="submit"]:hover,
button[type="submit"]:hover,
.ms-filter-submit:hover,
.ms-submit-btn:hover,
.ms-card-amazon:hover,
.ms-amazon-btn:hover,
.amazon-btn:hover {
    background: linear-gradient(135deg, #F04B37 0%, #FF5A45 58%, #C2417A 100%) !important;
}

.ms-btn-secondary,
#ms-hero .ms-hero-actions .ms-btn-secondary,
.ms-card-secondary,
.ms-card-compare,
.ms-compare-btn,
.lgr-btn,
.lc-btn {
    color: #102A43 !important;
    background: #FFFDF8 !important;
    border-color: rgba(20, 45, 50, .18) !important;
}

.ms-card-title,
.ms-card-title a,
.monitor-card h3,
.ms-global-card h3 {
    color: #102027 !important;
}

.ms-card-specs span,
.ms-spec-chip,
.spec-chip,
.chip,
.tag,
.badge,
.ms-card-rating-breakdown span,
.ms-meta-pill {
    background: #F1F5F1 !important;
    color: #334155 !important;
    border: 1px solid rgba(20, 45, 50, .11) !important;
}

.ms-card-price,
.price,
.monitor-price {
    color: #102027 !important;
    font-weight: 950 !important;
}

.ms-star-rating,
.ms-stars-base,
.ms-stars-fill,
.star-rating,
.rating-stars {
    color: #F59E0B !important;
}

.ms-card-media,
.ms-card-placeholder,
.monitor-image,
.ms-image-placeholder,
.ms-card-image-wrap {
    background: linear-gradient(145deg, #F0F7F4 0%, #FFF4EE 56%, #FFFDF8 100%) !important;
    border-color: rgba(20, 45, 50, .12) !important;
}

.ms-shopcat-card,
.ms-shopcat-inner,
.category-card {
    background: #FFFDF8 !important;
    border: 1px solid rgba(20, 45, 50, .12) !important;
    box-shadow: var(--ms-final-card-shadow) !important;
}

.ms-shopcat-card h3,
.ms-shopcat-title,
.category-card h3 {
    color: #102027 !important;
}

.ms-shopcat-sub,
.ms-shopcat-count,
.category-card p,
.category-card span {
    color: #5B6870 !important;
}

table,
.comparison-table,
.ms-compare-table,
.spec-table,
.ms-spec-table {
    background: #FFFDF8 !important;
    color: #334155 !important;
    border: 1px solid rgba(20, 45, 50, .12) !important;
    box-shadow: var(--ms-final-card-shadow) !important;
}

thead,
thead tr,
.comparison-table thead,
.ms-compare-table thead {
    background: #F1F5F1 !important;
    color: #102027 !important;
}

th,
.comparison-table th,
.ms-compare-table th,
.spec-label {
    color: #334155 !important;
    font-weight: 900 !important;
}

td,
.comparison-table td,
.ms-compare-table td,
.spec-value,
.table-value {
    color: #334155 !important;
}

tbody tr,
td,
th {
    border-color: rgba(20, 45, 50, .10) !important;
}

tbody tr:nth-child(even) {
    background: #FAF8F2 !important;
}

tbody tr:hover {
    background: #FFF2EE !important;
}

.ms-score,
.score-badge,
.monitor-score,
.ms-card-score,
.ms-score-good,
.ms-badge-good {
    background: #0F766E !important;
    color: #FFFFFF !important;
    border-color: rgba(15, 118, 110, .24) !important;
}

.winner,
.better,
.ok,
.success {
    color: #0B6B60 !important;
}

.ms-newsletter,
.newsletter,
.subscribe-box,
.ms-join-panel {
    background: linear-gradient(135deg, rgba(15,118,110,.12), rgba(255,107,74,.10)) !important;
    color: #102027 !important;
    border: 1px solid rgba(20, 45, 50, .12) !important;
}

.ms-newsletter *,
.newsletter *,
.subscribe-box *,
.ms-join-panel * {
    color: #102027 !important;
}

.ms-newsletter input,
.newsletter input,
.subscribe-box input,
.ms-join-panel input {
    color: #14213D !important;
    border-color: rgba(20, 45, 50, .18) !important;
}

.ms-community-panel,
.ms-brand-panel,
.ms-req-card,
.ms-brand-card {
    border-color: rgba(15, 118, 110, .18) !important;
}

.ms-community-stat strong,
.ms-community-status-pill strong,
.ms-brand-panel strong,
.ms-req-card strong,
.ms-brand-card strong {
    color: #102027 !important;
}

.ms-community-stat span,
.ms-community-meter-top span,
.ms-community-status-pill span,
.ms-brand-panel span,
.ms-req-meta,
.ms-req-status {
    color: #5B6870 !important;
}

.ms-community-meter-track,
.ms-req-meter-track,
.meter-track,
.progress-track {
    background: #DDE7E1 !important;
}

.ms-community-meter-track span,
.ms-req-meter-track span,
.meter-fill,
.progress-fill {
    background: var(--ms-final-cta-teal) !important;
}

.ms-community-cta,
.ms-final-community,
.ms-live-community,
.ms-community-band,
.ms-bottom-community,
section[class*="community"][style*="0B"],
section[class*="community"][style*="0F"] {
    background: linear-gradient(135deg, #0B4A43, #0F766E) !important;
    color: #F8FAFC !important;
    border: 1px solid rgba(20,45,50,.12) !important;
    box-shadow: inset 0 1px 0 rgba(20,45,50,.12), 0 22px 70px rgba(11, 74, 67, .18) !important;
}

.ms-community-cta *,
.ms-final-community *,
.ms-live-community *,
.ms-community-band *,
.ms-bottom-community * {
    color: #F8FAFC !important;
}

.ms-community-cta p,
.ms-final-community p,
.ms-live-community p,
.ms-community-band p,
.ms-bottom-community p {
    color: rgba(255,255,255,.78) !important;
}

.ms-community-cta .ms-btn,
.ms-final-community .ms-btn,
.ms-live-community .ms-btn,
.ms-community-band .ms-btn,
.ms-bottom-community .ms-btn {
    background: #FFFDF8 !important;
    color: #0B4A43 !important;
    border-color: rgba(255,255,255,.28) !important;
}

.ms-footer,
footer,
.site-footer {
    background: #FFFDF8 !important;
    color: #5B6870 !important;
    border-top: 1px solid rgba(20, 45, 50, .12) !important;
}

.ms-footer h2,
.ms-footer h3,
.ms-footer h4,
footer h2,
footer h3,
footer h4 {
    color: #102027 !important;
}

.ms-footer a,
footer a {
    color: #334155 !important;
}

.ms-footer a:hover,
footer a:hover {
    color: #0F766E !important;
}

.ms-footer small,
.ms-footer p,
footer small,
footer p {
    color: #5B6870 !important;
}

@media (max-width: 767px) {
    html,
    body {
        background: linear-gradient(180deg, #FFFDF8 0%, #F6F4EF 100%) !important;
    }

    #ms-primary-nav {
        background: #FFFDF8 !important;
        color: #102027 !important;
        border-color: rgba(20, 45, 50, .12) !important;
    }

    .ms-filter-card,
    .ms-global-card,
    .monitor-card,
    .ms-community-panel,
    .ms-brand-panel,
    .ms-form-card,
    .ms-content-block,
    .ms-article,
    details {
        box-shadow: 0 12px 32px rgba(16, 35, 45, .08) !important;
    }
}

/* =========================================================
   HOMEPAGE FINAL LOCK - must remain the last visual authority
   ========================================================= */
body.home,
body.home .site,
body.home #page,
body.home main {
    background:
        radial-gradient(circle at 10% 8%, rgba(255, 107, 74, .08), transparent 28%),
        radial-gradient(circle at 88% 14%, rgba(15, 118, 110, .08), transparent 32%),
        linear-gradient(180deg, #FFFDF8 0%, #F6F4EF 46%, #F4F7F4 100%) !important;
}

body.home .ms-container,
body.home .lc-inner,
body.home .spotlight-header,
body.home .spotlight-table,
#ms-hero .ms-hero-inner {
    width: min(100% - 56px, 1500px) !important;
    max-width: 1500px !important;
}

#ms-hero.ms-hero {
    min-height: clamp(720px, 82vh, 920px) !important;
    padding: calc(var(--nav-height, 72px) + 58px) 0 74px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 82% 25%, rgba(255, 107, 74, .13), transparent 34%),
        radial-gradient(circle at 64% 48%, rgba(15, 118, 110, .09), transparent 38%),
        linear-gradient(180deg, #FFFDF8 0%, #F6F4EF 100%) !important;
}

#ms-hero.ms-hero::before {
    opacity: .48 !important;
    background-image:
        radial-gradient(circle, rgba(255, 107, 74, .11) 0 1px, transparent 1.6px),
        radial-gradient(circle, rgba(15, 118, 110, .08) 0 1px, transparent 1.6px) !important;
    background-size: 38px 38px, 58px 58px !important;
}

#ms-hero .ms-hero-inner {
    grid-template-columns: minmax(540px, .82fr) minmax(760px, 1.18fr) !important;
    gap: clamp(42px, 5vw, 92px) !important;
    align-items: center !important;
}

#ms-hero .ms-hero-copy {
    max-width: 720px !important;
    padding-top: 8px !important;
}

#ms-hero .ms-hero-eyebrow {
    width: max-content !important;
    max-width: 100% !important;
    margin-bottom: 26px !important;
    padding: 9px 16px !important;
    border-radius: 999px !important;
    background: rgba(255, 107, 74, .11) !important;
    color: #E5533D !important;
    border: 1px solid rgba(255, 107, 74, .14) !important;
    box-shadow: 0 10px 24px rgba(255, 107, 74, .09) !important;
    letter-spacing: .06em !important;
}

#ms-hero .ms-hero-title {
    max-width: 800px !important;
    margin: 0 !important;
    color: #102027 !important;
    font-size: clamp(76px, 5.9vw, 112px) !important;
    line-height: .94 !important;
    letter-spacing: 0 !important;
    font-weight: 950 !important;
}

#ms-hero .ms-hero-title-accent {
    display: inline-block !important;
    background: linear-gradient(105deg, #0B6B60 0%, #0F766E 52%, #0A4F49 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

#ms-hero .ms-hero-desc {
    max-width: 630px !important;
    margin: 26px 0 0 !important;
    color: #334155 !important;
    font-size: clamp(17px, 1vw, 20px) !important;
    line-height: 1.75 !important;
    font-weight: 700 !important;
}

#ms-hero .ms-hero-actions {
    margin-top: 34px !important;
    gap: 18px !important;
}

#ms-hero .ms-hero-actions .ms-btn {
    min-height: 58px !important;
    padding: 0 34px !important;
    border-radius: 14px !important;
    font-size: 16px !important;
    font-weight: 900 !important;
}

#ms-hero .ms-hero-actions .ms-btn-primary {
    background: linear-gradient(135deg, #FF6B4A 0%, #FF4F45 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 14px 30px rgba(255, 107, 74, .25) !important;
}

#ms-hero .ms-hero-actions .ms-btn-secondary {
    background: rgba(255, 255, 255, .9) !important;
    color: #102027 !important;
    border: 1px solid rgba(20, 45, 50, .15) !important;
    box-shadow: 0 12px 28px rgba(16, 35, 45, .07) !important;
}

#ms-hero .ms-hero-stats {
    width: min(100%, 790px) !important;
    margin-top: 40px !important;
    padding: 24px 26px !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 20px !important;
    background: rgba(255, 253, 248, .82) !important;
    border: 1px solid rgba(20, 45, 50, .10) !important;
    border-radius: 22px !important;
    box-shadow: 0 18px 44px rgba(16, 35, 45, .08) !important;
    backdrop-filter: blur(14px) !important;
}

#ms-hero .ms-hero-stat-value {
    color: #102027 !important;
    font-size: clamp(28px, 2.2vw, 38px) !important;
    line-height: 1 !important;
}

#ms-hero .ms-hero-stat-label {
    margin-top: 8px !important;
    color: #5B6870 !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
}

#ms-hero .ms-hero-visual {
    min-height: clamp(520px, 43vw, 720px) !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
}

#ms-hero .ms-hero-visual::before {
    inset: 2% -4% 6% 7% !important;
    border-radius: 999px !important;
    background:
        radial-gradient(circle at 76% 38%, rgba(255, 107, 74, .16), transparent 36%),
        radial-gradient(circle at 30% 68%, rgba(15, 118, 110, .10), transparent 34%),
        linear-gradient(135deg, rgba(255, 239, 227, .72), rgba(230, 245, 239, .48)) !important;
}

#ms-hero .ms-hero-monitor-wrap {
    width: min(108%, 980px) !important;
    aspect-ratio: 1318 / 965 !important;
    margin: 0 -4% 0 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

#ms-hero .ms-hero-monitor,
#ms-hero .ms-hero-monitor--primary,
#ms-hero .ms-hero-monitor--secondary,
#ms-hero .ms-hero-svg-monitor,
#ms-hero .ms-hero-monitor-svg,
#ms-hero .ms-hero-glow-orb {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

#ms-hero .ms-hero-monitor-wrap::before {
    content: "" !important;
    position: absolute !important;
    inset: -7% -7% -8% -10% !important;
    z-index: 2 !important;
    background: transparent !important;
    filter: drop-shadow(0 34px 44px rgba(16, 35, 45, .16)) !important;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 4.5%, #000 98%, transparent 100%) !important;
    mask-image: linear-gradient(90deg, transparent 0%, #000 4.5%, #000 98%, transparent 100%) !important;
}

#ms-hero .ms-hero-monitor-wrap::after {
    content: "" !important;
    position: absolute !important;
    left: 18% !important;
    right: 7% !important;
    bottom: 5% !important;
    height: 13% !important;
    z-index: 1 !important;
    background: radial-gradient(ellipse, rgba(15, 118, 110, .18), rgba(255, 107, 74, .10) 45%, transparent 74%) !important;
    filter: blur(12px) !important;
}

#ms-filter.ms-filter-section,
.ms-filter-section {
    margin-top: -42px !important;
    padding-bottom: 28px !important;
}

body.home .ms-filter-card,
body.home .spotlight-table {
    background: rgba(255, 253, 248, .96) !important;
    border: 1px solid rgba(20, 45, 50, .10) !important;
    border-radius: 26px !important;
    box-shadow: 0 24px 70px rgba(16, 35, 45, .10) !important;
}

body.home .ms-filter-card {
    padding: clamp(28px, 2.6vw, 42px) !important;
}

body.home .ms-section,
body.home .lc-section,
body.home .comparison-spotlight-section {
    padding: clamp(58px, 6vw, 92px) 0 !important;
}

body.home .ms-section-title,
body.home .spotlight-titles h2,
body.home .lc-title {
    color: #102027 !important;
    font-size: clamp(28px, 2.1vw, 38px) !important;
    letter-spacing: 0 !important;
}

body.home .ms-section-sub,
body.home .spotlight-titles p,
body.home .lc-subtitle,
body.home .ms-filter-desc,
body.home .ms-filter-footer,
body.home .ms-filter-count {
    color: #5B6870 !important;
}

body.home .ms-trending-grid,
body.home .ms-filter-results-grid {
    grid-template-columns: repeat(4, minmax(250px, 1fr)) !important;
    gap: 26px !important;
}

body.home .ms-global-card,
body.home .monitor-card {
    border-radius: 22px !important;
    background: #FFFDF8 !important;
    border: 1px solid rgba(20, 45, 50, .11) !important;
    box-shadow: 0 16px 44px rgba(16, 35, 45, .08) !important;
    overflow: hidden !important;
}

body.home .ms-card-media {
    min-height: 178px !important;
    margin: 16px 16px 0 !important;
    border-radius: 16px !important;
}

body.home .ms-card-title,
body.home .ms-card-title a {
    color: #102027 !important;
    font-size: 17px !important;
    line-height: 1.25 !important;
}

body.home .ms-card-price {
    color: #FF5A45 !important;
    font-size: 22px !important;
}

body.home .ms-card-footer {
    background: linear-gradient(180deg, rgba(244, 247, 244, .42), rgba(255, 253, 248, .95)) !important;
}

body.home .ms-amazon-btn,
body.home .amazon-btn {
    min-height: 42px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #FFB020 0%, #FF9800 100%) !important;
    color: #102027 !important;
    box-shadow: 0 10px 22px rgba(255, 152, 0, .20) !important;
}

body.home .ms-shopcat-grid {
    grid-template-columns: repeat(8, minmax(128px, 1fr)) !important;
    gap: 18px !important;
}

body.home .ms-shopcat-inner {
    min-height: 180px !important;
    padding: 20px !important;
    border-radius: 20px !important;
    background: #FFFDF8 !important;
}

body.home .spotlight-row.table-header-row {
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%) !important;
}

body.home .spotlight-row > div,
body.home .spotlight-row span {
    color: #334155 !important;
}

body.home .spotlight-row h3,
body.home .spotlight-row .col-spec {
    color: #102027 !important;
}

body.home .spotlight-row .price,
body.home .spotlight-row .price span,
body.home .spotlight-row .trophy {
    color: #E5533D !important;
}

@media (max-width: 1280px) {
    #ms-hero .ms-hero-inner {
        grid-template-columns: minmax(450px, .9fr) minmax(560px, 1.1fr) !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(58px, 5.4vw, 86px) !important;
    }

    body.home .ms-trending-grid,
    body.home .ms-filter-results-grid {
        grid-template-columns: repeat(4, minmax(210px, 1fr)) !important;
    }
}

@media (max-width: 1024px) {
    body.home .ms-container,
    body.home .lc-inner,
    body.home .spotlight-header,
    body.home .spotlight-table,
    #ms-hero .ms-hero-inner {
        width: min(100% - 36px, 1500px) !important;
    }

    #ms-hero .ms-hero-inner {
        grid-template-columns: 1fr !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(360px, 58vw, 560px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 780px) !important;
        margin: 0 auto !important;
    }

    body.home .ms-trending-grid,
    body.home .ms-filter-results-grid,
    body.home .ms-shopcat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    body.home .ms-container,
    body.home .lc-inner,
    body.home .spotlight-header,
    body.home .spotlight-table,
    #ms-hero .ms-hero-inner {
        width: min(100% - 28px, 1500px) !important;
    }

    #ms-hero.ms-hero {
        min-height: auto !important;
        padding-top: calc(var(--nav-height, 70px) + 32px) !important;
        padding-bottom: 58px !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(46px, 14vw, 62px) !important;
    }

    #ms-hero .ms-hero-actions {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    #ms-hero .ms-hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        padding: 18px !important;
    }

    #ms-hero .ms-hero-visual {
        min-height: clamp(260px, 82vw, 390px) !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(124%, 560px) !important;
        margin-left: -8% !important;
    }

    #ms-filter.ms-filter-section,
    .ms-filter-section {
        margin-top: -22px !important;
    }

    body.home .ms-filter-card {
        padding: 22px !important;
    }

    body.home .ms-trending-grid,
    body.home .ms-filter-results-grid,
    body.home .ms-shopcat-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Scratch rebuild v2: interactive finder preview plus live trust hero, no images. */
body.home #ms-hero.ms-hero-v2,
#ms-hero.ms-hero-v2 {
    --hero-ink: #102027;
    --hero-muted: #526370;
    --hero-soft: #f7f3ec;
    --hero-card: rgba(255, 255, 255, .92);
    --hero-line: rgba(16, 32, 39, .11);
    --hero-coral: #0f766e;
    --hero-coral-2: #13a79a;
    --hero-teal: #0f766e;
    --hero-teal-2: #13a79a;
    --hero-amber: #ffb020;
    position: relative !important;
    isolation: isolate !important;
    overflow: clip !important;
    padding: clamp(84px, 8vw, 132px) 0 clamp(62px, 6.4vw, 104px) !important;
    background:
        radial-gradient(circle at 82% 12%, rgba(255, 100, 72, .14), transparent 32%),
        radial-gradient(circle at 62% 72%, rgba(15, 118, 110, .10), transparent 38%),
        linear-gradient(115deg, #fffdf8 0%, #f7f3ec 54%, #f2f8f4 100%) !important;
    color: var(--hero-ink) !important;
    border-bottom: 1px solid rgba(16, 32, 39, .08) !important;
}

body.home #ms-hero.ms-hero-v2::before,
#ms-hero.ms-hero-v2::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -2 !important;
    opacity: .55 !important;
    background-image: radial-gradient(circle, rgba(15, 118, 110, .13) 1px, transparent 1.35px) !important;
    background-size: 28px 28px !important;
    mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .62) 66%, transparent 100%) !important;
}

body.home #ms-hero.ms-hero-v2::after,
#ms-hero.ms-hero-v2::after {
    content: "" !important;
    position: absolute !important;
    width: min(760px, 44vw) !important;
    height: min(760px, 44vw) !important;
    right: max(-130px, -5vw) !important;
    top: 58px !important;
    z-index: -1 !important;
    border-radius: 999px !important;
    background:
        linear-gradient(135deg, rgba(255, 100, 72, .10), rgba(15, 118, 110, .10)),
        radial-gradient(circle at 42% 34%, rgba(255, 176, 32, .14), transparent 44%) !important;
    border: 1px solid rgba(16, 32, 39, .08) !important;
    filter: blur(.2px) !important;
}

body.home #ms-hero .ms-hero-v2__inner,
#ms-hero .ms-hero-v2__inner {
    width: min(100% - 72px, 1500px) !important;
    max-width: 1500px !important;
    margin-inline: auto !important;
    display: grid !important;
    grid-template-columns: minmax(0, 720px) minmax(620px, 1fr) !important;
    align-items: start !important;
    gap: clamp(34px, 3.6vw, 58px) !important;
}

body.home #ms-hero .ms-hero-v2__copy,
#ms-hero .ms-hero-v2__copy {
    min-width: 0 !important;
    max-width: 760px !important;
}

body.home #ms-hero .ms-hero-v2__eyebrow,
#ms-hero .ms-hero-v2__eyebrow {
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    margin: 0 0 22px !important;
    padding: 10px 16px !important;
    border-radius: 999px !important;
    background: rgba(255, 100, 72, .10) !important;
    border: 1px solid rgba(255, 100, 72, .18) !important;
    color: #e55643 !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    box-shadow: 0 10px 28px rgba(255, 100, 72, .08) !important;
}

body.home #ms-hero .ms-hero-v2__eyebrow span,
#ms-hero .ms-hero-v2__eyebrow span {
    width: 9px !important;
    height: 9px !important;
    border-radius: 999px !important;
    background: var(--hero-coral) !important;
    box-shadow: 0 0 0 7px rgba(255, 100, 72, .14) !important;
}

body.home #ms-hero .ms-hero-v2__title,
#ms-hero .ms-hero-v2__title {
    margin: 0 !important;
    max-width: 760px !important;
    color: var(--hero-ink) !important;
    font-size: clamp(56px, 4.15vw, 82px) !important;
    line-height: .96 !important;
    letter-spacing: 0 !important;
    font-weight: 950 !important;
    text-wrap: balance !important;
}

body.home #ms-hero .ms-hero-v2__title strong,
#ms-hero .ms-hero-v2__title strong {
    display: block !important;
    color: transparent !important;
    background: linear-gradient(100deg, #0f766e 0%, #138879 48%, #ff6448 118%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
}

body.home #ms-hero .ms-hero-v2__desc,
#ms-hero .ms-hero-v2__desc {
    max-width: 610px !important;
    margin: 26px 0 0 !important;
    color: #314350 !important;
    font-size: clamp(18px, 1.12vw, 22px) !important;
    line-height: 1.58 !important;
    font-weight: 650 !important;
}

body.home #ms-hero .ms-hero-v2__actions,
#ms-hero .ms-hero-v2__actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    margin-top: 34px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.home #ms-hero .ms-hero-v2__btn,
#ms-hero .ms-hero-v2__btn {
    min-height: 58px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 30px !important;
    border-radius: 16px !important;
    font-size: 16px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}

body.home #ms-hero .ms-hero-v2__btn--primary,
#ms-hero .ms-hero-v2__btn--primary {
    color: #fff !important;
    background: linear-gradient(135deg, var(--hero-coral), var(--hero-coral-2)) !important;
    box-shadow: 0 18px 36px rgba(255, 100, 72, .24) !important;
}

body.home #ms-hero .ms-hero-v2__btn--secondary,
#ms-hero .ms-hero-v2__btn--secondary {
    color: var(--hero-ink) !important;
    background: rgba(255, 255, 255, .92) !important;
    border: 1px solid rgba(16, 32, 39, .14) !important;
    box-shadow: 0 14px 30px rgba(16, 32, 39, .08) !important;
}

body.home #ms-hero .ms-hero-v2__btn:hover,
#ms-hero .ms-hero-v2__btn:hover {
    transform: translateY(-2px) !important;
}

body.home #ms-hero .ms-hero-v2__visual,
#ms-hero .ms-hero-v2__visual {
    position: relative !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.45fr) minmax(220px, .58fr) !important;
    align-items: stretch !important;
    gap: 18px !important;
}

body.home #ms-hero .ms-hero-v2__visual::before,
#ms-hero .ms-hero-v2__visual::before {
    content: "" !important;
    position: absolute !important;
    inset: -34px -30px -30px -42px !important;
    z-index: -1 !important;
    border-radius: 42px !important;
    background:
        linear-gradient(115deg, rgba(255, 255, 255, .62), rgba(255, 255, 255, .24)),
        radial-gradient(circle at 22% 22%, rgba(15, 118, 110, .13), transparent 34%),
        radial-gradient(circle at 86% 12%, rgba(255, 100, 72, .13), transparent 40%) !important;
    border: 1px solid rgba(16, 32, 39, .06) !important;
    box-shadow: 0 36px 100px rgba(16, 32, 39, .10) !important;
}

body.home #ms-hero .ms-hero-preview,
#ms-hero .ms-hero-preview {
    min-width: 0 !important;
    padding: 22px !important;
    border-radius: 30px !important;
    background: var(--hero-card) !important;
    border: 1px solid var(--hero-line) !important;
    box-shadow: 0 30px 80px rgba(16, 32, 39, .14) !important;
    backdrop-filter: blur(18px) !important;
}

body.home #ms-hero .ms-hero-preview__header,
#ms-hero .ms-hero-preview__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    padding-bottom: 18px !important;
    border-bottom: 1px solid rgba(16, 32, 39, .08) !important;
}

body.home #ms-hero .ms-hero-preview__header span,
#ms-hero .ms-hero-preview__header span {
    display: block !important;
    color: #e55643 !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
}

body.home #ms-hero .ms-hero-preview__header strong,
#ms-hero .ms-hero-preview__header strong {
    display: block !important;
    margin-top: 5px !important;
    color: var(--hero-teal) !important;
    font-size: 15px !important;
    font-weight: 950 !important;
}

body.home #ms-hero .ms-hero-preview__header a,
#ms-hero .ms-hero-preview__header a {
    flex: 0 0 auto !important;
    color: #fff !important;
    background: var(--hero-teal) !important;
    border-radius: 999px !important;
    padding: 10px 14px !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    box-shadow: 0 12px 26px rgba(15, 118, 110, .18) !important;
}

body.home #ms-hero .ms-hero-preview__filters,
#ms-hero .ms-hero-preview__filters {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 18px !important;
}

body.home #ms-hero .ms-hero-preview__filters span,
#ms-hero .ms-hero-preview__filters span,
body.home #ms-hero .ms-hero-preview__compare strong,
#ms-hero .ms-hero-preview__compare strong {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    border-radius: 999px !important;
    padding: 10px 12px !important;
    color: #253947 !important;
    background: #f7faf9 !important;
    border: 1px solid rgba(16, 32, 39, .10) !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 850 !important;
}

body.home #ms-hero .ms-hero-preview__body,
#ms-hero .ms-hero-preview__body {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    margin-top: 18px !important;
}

body.home #ms-hero .ms-hero-preview__cards,
#ms-hero .ms-hero-preview__cards {
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

body.home #ms-hero .ms-hero-monitor-card,
#ms-hero .ms-hero-monitor-card {
    min-width: 0 !important;
    padding: 14px !important;
    border-radius: 22px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(249, 252, 251, .94)) !important;
    border: 1px solid rgba(16, 32, 39, .09) !important;
    box-shadow: 0 16px 34px rgba(16, 32, 39, .08) !important;
}

body.home #ms-hero .ms-hero-monitor-card__screen,
#ms-hero .ms-hero-monitor-card__screen {
    position: relative !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    border-radius: 16px !important;
    background:
        linear-gradient(135deg, rgba(15, 118, 110, .88), rgba(41, 72, 108, .92) 48%, rgba(255, 100, 72, .80)),
        repeating-linear-gradient(0deg, transparent 0 13px, rgba(255, 255, 255, .12) 14px),
        repeating-linear-gradient(90deg, transparent 0 18px, rgba(255, 255, 255, .12) 19px) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35) !important;
}

body.home #ms-hero .ms-hero-monitor-card__screen::before,
#ms-hero .ms-hero-monitor-card__screen::before {
    content: "" !important;
    position: absolute !important;
    inset: 18% 14% 26% !important;
    border-radius: 14px !important;
    border: 1px solid rgba(255, 255, 255, .42) !important;
    background: rgba(255, 255, 255, .10) !important;
}

body.home #ms-hero .ms-hero-monitor-card__screen span,
#ms-hero .ms-hero-monitor-card__screen span {
    position: absolute !important;
    width: 44% !important;
    height: 4px !important;
    left: 28% !important;
    bottom: 18px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .56) !important;
}

body.home #ms-hero .ms-hero-monitor-card__screen img,
#ms-hero .ms-hero-monitor-card__screen img {
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    padding: 10px !important;
    background: rgba(255,255,255,.92) !important;
}

body.home #ms-hero .ms-hero-monitor-card strong,
#ms-hero .ms-hero-monitor-card strong {
    display: block !important;
    margin-top: 13px !important;
    color: var(--hero-ink) !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    font-weight: 950 !important;
}

body.home #ms-hero .ms-hero-monitor-card div > span,
#ms-hero .ms-hero-monitor-card div > span {
    display: block !important;
    margin-top: 3px !important;
    color: #647485 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

body.home #ms-hero .ms-hero-monitor-card p,
#ms-hero .ms-hero-monitor-card p {
    margin: 10px 0 0 !important;
    color: #465968 !important;
    font-size: 12px !important;
    line-height: 1.42 !important;
    font-weight: 800 !important;
}

body.home #ms-hero .ms-hero-monitor-card__meta,
#ms-hero .ms-hero-monitor-card__meta {
    display: flex !important;
    justify-content: space-between !important;
    gap: 8px !important;
    margin-top: 12px !important;
}

body.home #ms-hero .ms-hero-monitor-card__meta span,
#ms-hero .ms-hero-monitor-card__meta span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    padding: 7px 9px !important;
    border-radius: 999px !important;
    background: rgba(255, 100, 72, .09) !important;
    color: #e55643 !important;
    font-size: 11px !important;
    font-weight: 950 !important;
}

body.home #ms-hero .ms-hero-monitor-card__meta span:last-child,
#ms-hero .ms-hero-monitor-card__meta span:last-child {
    background: rgba(15, 118, 110, .10) !important;
    color: var(--hero-teal) !important;
}

body.home #ms-hero .ms-hero-preview__scores,
#ms-hero .ms-hero-preview__scores {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-content: stretch !important;
    gap: 12px !important;
}

body.home #ms-hero .ms-hero-preview__scores div,
#ms-hero .ms-hero-preview__scores div {
    min-width: 0 !important;
    padding: 14px !important;
    border-radius: 20px !important;
    background: linear-gradient(180deg, #ffffff, #f7fbfa) !important;
    border: 1px solid rgba(16, 32, 39, .09) !important;
    box-shadow: 0 12px 26px rgba(16, 32, 39, .06) !important;
}

body.home #ms-hero .ms-hero-preview__scores span,
#ms-hero .ms-hero-preview__scores span {
    display: block !important;
    color: #647485 !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    letter-spacing: .05em !important;
    text-transform: uppercase !important;
}

body.home #ms-hero .ms-hero-preview__scores strong,
#ms-hero .ms-hero-preview__scores strong {
    display: block !important;
    margin-top: 7px !important;
    color: var(--hero-ink) !important;
    font-size: 24px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
}

body.home #ms-hero .ms-hero-preview__scores em,
#ms-hero .ms-hero-preview__scores em {
    display: block !important;
    position: relative !important;
    overflow: hidden !important;
    height: 8px !important;
    margin-top: 12px !important;
    border-radius: 999px !important;
    background: rgba(16, 32, 39, .10) !important;
}

body.home #ms-hero .ms-hero-preview__scores em::before,
#ms-hero .ms-hero-preview__scores em::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 auto 0 0 !important;
    width: var(--score, 80%) !important;
    border-radius: inherit !important;
    background: linear-gradient(90deg, var(--hero-teal), var(--hero-amber), var(--hero-coral)) !important;
}

body.home #ms-hero .ms-hero-preview__compare,
#ms-hero .ms-hero-preview__compare {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 18px !important;
    padding-top: 18px !important;
    border-top: 1px solid rgba(16, 32, 39, .08) !important;
}

body.home #ms-hero .ms-hero-preview__compare > span,
#ms-hero .ms-hero-preview__compare > span {
    color: #647485 !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
}

body.home #ms-hero .ms-hero-preview__compare strong,
#ms-hero .ms-hero-preview__compare strong {
    background: rgba(15, 118, 110, .10) !important;
    border-color: rgba(15, 118, 110, .16) !important;
    color: var(--hero-teal) !important;
}

body.home #ms-hero .ms-hero-trust,
#ms-hero .ms-hero-trust {
    min-width: 0 !important;
    display: grid !important;
    grid-template-rows: repeat(3, auto) 1fr !important;
    gap: 14px !important;
}

body.home #ms-hero .ms-hero-trust__metric,
#ms-hero .ms-hero-trust__metric {
    min-width: 0 !important;
    padding: 18px !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, .88) !important;
    border: 1px solid rgba(16, 32, 39, .10) !important;
    box-shadow: 0 20px 48px rgba(16, 32, 39, .10) !important;
}

body.home #ms-hero .ms-hero-trust__metric strong,
#ms-hero .ms-hero-trust__metric strong {
    display: block !important;
    color: var(--hero-ink) !important;
    font-size: clamp(28px, 2.05vw, 40px) !important;
    line-height: 1 !important;
    font-weight: 950 !important;
}

body.home #ms-hero .ms-hero-trust__metric span,
#ms-hero .ms-hero-trust__metric span {
    display: block !important;
    margin-top: 8px !important;
    color: #5b6c78 !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    font-weight: 950 !important;
    letter-spacing: .05em !important;
    text-transform: uppercase !important;
}

body.home #ms-hero .ms-hero-trust__brands,
#ms-hero .ms-hero-trust__brands {
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    align-content: end !important;
    padding: 18px !important;
    border-radius: 24px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(245, 251, 249, .86)) !important;
    border: 1px solid rgba(15, 118, 110, .14) !important;
    box-shadow: 0 20px 48px rgba(16, 32, 39, .08) !important;
}

body.home #ms-hero .ms-hero-trust__brands span,
#ms-hero .ms-hero-trust__brands span {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 8px 10px !important;
    border-radius: 14px !important;
    background: #fff !important;
    border: 1px solid rgba(16, 32, 39, .09) !important;
    color: #263947 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    text-align: center !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    box-shadow: 0 10px 24px rgba(16, 32, 39, .06) !important;
}

@media (max-width: 1280px) {
    body.home #ms-hero .ms-hero-v2__inner,
    #ms-hero .ms-hero-v2__inner {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 44px !important;
    }

    body.home #ms-hero .ms-hero-v2__copy,
    #ms-hero .ms-hero-v2__copy {
        max-width: 820px !important;
    }
}

@media (max-width: 860px) {
    body.home #ms-hero.ms-hero-v2,
    #ms-hero.ms-hero-v2 {
        padding: 74px 0 58px !important;
    }

    body.home #ms-hero .ms-hero-v2__inner,
    #ms-hero .ms-hero-v2__inner {
        width: min(100% - 36px, 560px) !important;
    }

    body.home #ms-hero .ms-hero-v2__title,
    #ms-hero .ms-hero-v2__title {
        font-size: clamp(44px, 13vw, 62px) !important;
    }

    body.home #ms-hero .ms-hero-v2__desc,
    #ms-hero .ms-hero-v2__desc {
        font-size: 17px !important;
    }

    body.home #ms-hero .ms-hero-v2__visual,
    #ms-hero .ms-hero-v2__visual,
    body.home #ms-hero .ms-hero-preview__body,
    #ms-hero .ms-hero-preview__body {
        grid-template-columns: 1fr !important;
    }

    body.home #ms-hero .ms-hero-preview__filters,
    #ms-hero .ms-hero-preview__filters {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.home #ms-hero .ms-hero-trust,
    #ms-hero .ms-hero-trust {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-template-rows: auto auto !important;
    }

    body.home #ms-hero .ms-hero-trust__brands,
    #ms-hero .ms-hero-trust__brands {
        grid-column: 1 / -1 !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 560px) {
    body.home #ms-hero .ms-hero-v2__actions,
    #ms-hero .ms-hero-v2__actions,
    body.home #ms-hero .ms-hero-preview__cards,
    #ms-hero .ms-hero-preview__cards,
    body.home #ms-hero .ms-hero-preview__scores,
    #ms-hero .ms-hero-preview__scores,
    body.home #ms-hero .ms-hero-trust,
    #ms-hero .ms-hero-trust,
    body.home #ms-hero .ms-hero-trust__brands,
    #ms-hero .ms-hero-trust__brands {
        grid-template-columns: 1fr !important;
    }

    body.home #ms-hero .ms-hero-v2__actions,
    #ms-hero .ms-hero-v2__actions {
        display: grid !important;
    }

    body.home #ms-hero .ms-hero-v2__btn,
    #ms-hero .ms-hero-v2__btn {
        width: 100% !important;
    }

    body.home #ms-hero .ms-hero-preview,
    #ms-hero .ms-hero-preview {
        padding: 18px !important;
        border-radius: 24px !important;
    }

    body.home #ms-hero .ms-hero-preview__header,
    #ms-hero .ms-hero-preview__header {
        align-items: flex-start !important;
        flex-direction: column !important;
    }
}

/* Hero v2 cleanup: one unified premium surface, no stacked background blocks. */
body.home #ms-hero.ms-hero-v2,
#ms-hero.ms-hero-v2 {
    padding: clamp(72px, 7vw, 112px) 0 clamp(54px, 5vw, 84px) !important;
    background:
        radial-gradient(circle at 84% 18%, rgba(255, 100, 72, .11), transparent 30%),
        radial-gradient(circle at 55% 76%, rgba(15, 118, 110, .08), transparent 36%),
        linear-gradient(115deg, #fffdf8 0%, #faf7f0 52%, #f4faf6 100%) !important;
}

body.home #ms-hero.ms-hero-v2::after,
#ms-hero.ms-hero-v2::after,
body.home #ms-hero .ms-hero-v2__visual::before,
#ms-hero .ms-hero-v2__visual::before {
    display: none !important;
}

body.home #ms-hero .ms-hero-v2__inner,
#ms-hero .ms-hero-v2__inner {
    position: relative !important;
    padding: clamp(28px, 3vw, 44px) !important;
    border-radius: 38px !important;
    background:
        linear-gradient(115deg, rgba(255, 255, 255, .82), rgba(255, 253, 248, .62) 45%, rgba(246, 252, 249, .78)),
        radial-gradient(circle at 18% 18%, rgba(255, 100, 72, .06), transparent 38%),
        radial-gradient(circle at 72% 72%, rgba(15, 118, 110, .07), transparent 42%) !important;
    border: 1px solid rgba(16, 32, 39, .08) !important;
    box-shadow: 0 36px 110px rgba(16, 32, 39, .10), inset 0 1px 0 rgba(255, 255, 255, .88) !important;
}

body.home #ms-hero .ms-hero-v2__copy,
#ms-hero .ms-hero-v2__copy {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
}

body.home #ms-hero .ms-hero-v2__visual,
#ms-hero .ms-hero-v2__visual {
    align-items: stretch !important;
}

body.home #ms-hero .ms-hero-preview,
#ms-hero .ms-hero-preview {
    background: rgba(255, 255, 255, .96) !important;
    border-color: rgba(16, 32, 39, .10) !important;
    box-shadow: 0 18px 44px rgba(16, 32, 39, .10) !important;
}

body.home #ms-hero .ms-hero-trust__metric,
#ms-hero .ms-hero-trust__metric,
body.home #ms-hero .ms-hero-trust__brands,
#ms-hero .ms-hero-trust__brands {
    background: rgba(255, 255, 255, .92) !important;
    box-shadow: 0 16px 38px rgba(16, 32, 39, .08) !important;
}

@media (max-width: 860px) {
    body.home #ms-hero .ms-hero-v2__inner,
    #ms-hero .ms-hero-v2__inner {
        padding: 24px !important;
        border-radius: 28px !important;
    }
}

/* Hero left-side benefit details from the product promise strip. */
body.home #ms-hero .ms-hero-feature-strip,
#ms-hero .ms-hero-feature-strip {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px !important;
    margin-top: 42px !important;
    max-width: 720px !important;
}

body.home #ms-hero .ms-hero-feature,
#ms-hero .ms-hero-feature {
    min-width: 0 !important;
    padding: 18px 14px 16px !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .72) !important;
    border: 1px solid rgba(16, 32, 39, .08) !important;
    box-shadow: 0 14px 34px rgba(16, 32, 39, .06) !important;
    text-align: center !important;
}

body.home #ms-hero .ms-hero-feature__icon,
#ms-hero .ms-hero-feature__icon {
    width: 46px !important;
    height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 13px !important;
    border-radius: 16px !important;
    color: #7c3aed !important;
    background: linear-gradient(135deg, rgba(124, 58, 237, .14), rgba(15, 118, 110, .10)) !important;
}

body.home #ms-hero .ms-hero-feature:nth-child(2) .ms-hero-feature__icon,
#ms-hero .ms-hero-feature:nth-child(2) .ms-hero-feature__icon {
    color: #0f766e !important;
    background: linear-gradient(135deg, rgba(15, 118, 110, .14), rgba(255, 176, 32, .10)) !important;
}

body.home #ms-hero .ms-hero-feature:nth-child(3) .ms-hero-feature__icon,
#ms-hero .ms-hero-feature:nth-child(3) .ms-hero-feature__icon {
    color: #6d5dfc !important;
    background: linear-gradient(135deg, rgba(109, 93, 252, .14), rgba(238, 63, 134, .08)) !important;
}

body.home #ms-hero .ms-hero-feature:nth-child(4) .ms-hero-feature__icon,
#ms-hero .ms-hero-feature:nth-child(4) .ms-hero-feature__icon {
    color: #0f766e !important;
    background: linear-gradient(135deg, rgba(15, 118, 110, .12), rgba(19, 167, 154, .10)) !important;
}

body.home #ms-hero .ms-hero-feature__icon svg,
#ms-hero .ms-hero-feature__icon svg {
    width: 22px !important;
    height: 22px !important;
}

body.home #ms-hero .ms-hero-feature strong,
#ms-hero .ms-hero-feature strong {
    display: block !important;
    color: #102027 !important;
    font-size: 13px !important;
    line-height: 1.22 !important;
    font-weight: 950 !important;
}

body.home #ms-hero .ms-hero-feature small,
#ms-hero .ms-hero-feature small {
    display: block !important;
    margin-top: 10px !important;
    color: #526370 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    font-weight: 650 !important;
}

@media (max-width: 1280px) {
    body.home #ms-hero .ms-hero-feature-strip,
    #ms-hero .ms-hero-feature-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        max-width: 640px !important;
    }
}

@media (max-width: 560px) {
    body.home #ms-hero .ms-hero-feature-strip,
    #ms-hero .ms-hero-feature-strip {
        grid-template-columns: 1fr !important;
        margin-top: 28px !important;
    }

    body.home #ms-hero .ms-hero-feature,
    #ms-hero .ms-hero-feature {
        display: grid !important;
        grid-template-columns: 46px 1fr !important;
        column-gap: 14px !important;
        text-align: left !important;
        align-items: center !important;
    }

    body.home #ms-hero .ms-hero-feature__icon,
    #ms-hero .ms-hero-feature__icon {
        grid-row: span 2 !important;
        margin: 0 !important;
    }

    body.home #ms-hero .ms-hero-feature small,
    #ms-hero .ms-hero-feature small {
        margin-top: 4px !important;
    }
}

/* =============================================================
   FINAL CURRENT SECTION NAVIGATION STATE
   ============================================================= */

#ms-primary-nav .ms-nav-link,
#ms-primary-nav .menu-item > a {
    position: relative !important;
    border-radius: 999px !important;
    transition: color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

#ms-primary-nav .ms-nav-active > .ms-nav-link,
#ms-primary-nav .ms-nav-active > a,
#ms-primary-nav .current-menu-item > .ms-nav-link,
#ms-primary-nav .current-menu-item > a,
#ms-primary-nav .current-menu-parent > .ms-nav-link,
#ms-primary-nav .current-menu-parent > a,
#ms-primary-nav .current-menu-ancestor > .ms-nav-link,
#ms-primary-nav .current-menu-ancestor > a,
#ms-primary-nav a[aria-current="page"] {
    color: #0f766e !important;
    background: linear-gradient(135deg, rgba(15, 118, 110, .12), rgba(255, 107, 74, .11)) !important;
    box-shadow: inset 0 0 0 1px rgba(15, 118, 110, .16), 0 10px 24px rgba(15, 118, 110, .10) !important;
}

#ms-primary-nav .ms-nav-active > .ms-nav-link::after,
#ms-primary-nav .ms-nav-active > a::after,
#ms-primary-nav .current-menu-item > .ms-nav-link::after,
#ms-primary-nav .current-menu-item > a::after,
#ms-primary-nav .current-menu-parent > .ms-nav-link::after,
#ms-primary-nav .current-menu-parent > a::after,
#ms-primary-nav .current-menu-ancestor > .ms-nav-link::after,
#ms-primary-nav .current-menu-ancestor > a::after,
#ms-primary-nav a[aria-current="page"]::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 5px !important;
    width: 18px !important;
    height: 3px !important;
    border-radius: 999px !important;
    transform: translateX(-50%) !important;
    background: linear-gradient(90deg, #0f766e, #ff6b4a) !important;
}

#ms-primary-nav .ms-nav-active > .ms-nav-link:hover,
#ms-primary-nav .ms-nav-active > a:hover,
#ms-primary-nav .current-menu-item > .ms-nav-link:hover,
#ms-primary-nav .current-menu-item > a:hover,
#ms-primary-nav a[aria-current="page"]:hover {
    color: #0b6b60 !important;
    transform: translateY(-1px) !important;
}

@media (max-width: 1180px) {
    #ms-primary-nav .ms-nav-active > .ms-nav-link::after,
    #ms-primary-nav .ms-nav-active > a::after,
    #ms-primary-nav .current-menu-item > .ms-nav-link::after,
    #ms-primary-nav .current-menu-item > a::after,
    #ms-primary-nav a[aria-current="page"]::after {
        left: 18px !important;
        bottom: 10px !important;
        transform: none !important;
    }
}

/* Quick Match cards: keep placeholder art clean; title already appears below media. */
.ms-card-placeholder > strong,
body.home #monitors-results .ms-card-placeholder > strong {
    display: none !important;
}

body.home #monitors-results.ms-filter-results-grid {
    grid-template-columns: repeat(4, minmax(250px, 1fr)) !important;
}

/* =============================================================
   HOMEPAGE COMPARISON SPOTLIGHT FINAL POLISH
   ============================================================= */

body.home .comparison-spotlight-section {
    position: relative !important;
    width: 100% !important;
    padding: 88px 24px 106px !important;
    background:
        radial-gradient(circle at 16% 18%, rgba(255, 107, 74, .11), transparent 30%),
        radial-gradient(circle at 84% 24%, rgba(15, 118, 110, .12), transparent 34%),
        linear-gradient(135deg, #fff9f3 0%, #f8fbf7 46%, #f5f8ff 100%) !important;
    border-top: 1px solid rgba(20, 45, 50, .08) !important;
    border-bottom: 1px solid rgba(20, 45, 50, .08) !important;
}

body.home .comparison-spotlight-section::before {
    content: "" !important;
    position: absolute !important;
    inset: 36px 8% auto auto !important;
    width: 360px !important;
    height: 360px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, rgba(255, 107, 74, .10), rgba(15, 118, 110, .08)) !important;
    filter: blur(2px) !important;
    opacity: .75 !important;
    pointer-events: none !important;
}

body.home .spotlight-header {
    position: relative !important;
    z-index: 1 !important;
    width: min(1500px, 100%) !important;
    margin: 0 auto 26px !important;
    display: flex !important;
    align-items: end !important;
    justify-content: space-between !important;
    gap: 24px !important;
}

body.home .spotlight-titles h2 {
    margin: 0 0 10px !important;
    color: #102027 !important;
    background: none !important;
    -webkit-text-fill-color: #102027 !important;
    text-shadow: none !important;
    font-size: clamp(30px, 2.3vw, 42px) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    font-weight: 950 !important;
}

body.home .spotlight-titles h2::before {
    content: "Side-by-side intelligence" !important;
    display: block !important;
    width: max-content !important;
    margin: 0 0 12px !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    color: #0f766e !important;
    background: rgba(15, 118, 110, .10) !important;
    border: 1px solid rgba(15, 118, 110, .14) !important;
    font-size: 11px !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    letter-spacing: .9px !important;
    font-weight: 950 !important;
}

body.home .spotlight-titles p {
    max-width: 760px !important;
    margin: 0 !important;
    color: #536471 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    font-weight: 650 !important;
}

body.home .comparison-spotlight-section .btn-compare {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 48px !important;
    padding: 0 22px !important;
    border-radius: 14px !important;
    border: 0 !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #ff6b4a 0%, #ff4f7b 58%, #8b5cf6 100%) !important;
    box-shadow: 0 16px 34px rgba(255, 79, 123, .20) !important;
    text-decoration: none !important;
    font-weight: 950 !important;
}

body.home .spotlight-table {
    position: relative !important;
    z-index: 1 !important;
    width: min(1500px, 100%) !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    border-radius: 28px !important;
    background: rgba(255, 255, 255, .96) !important;
    border: 1px solid rgba(20, 45, 50, .10) !important;
    box-shadow: 0 28px 80px rgba(16, 35, 45, .12) !important;
}

body.home .spotlight-table--three .spotlight-row--three {
    display: grid !important;
    grid-template-columns: 190px repeat(3, minmax(180px, 1fr)) 230px !important;
    align-items: stretch !important;
    min-width: 1040px !important;
}

body.home .spotlight-row {
    border-bottom: 1px solid rgba(20, 45, 50, .08) !important;
    background: #ffffff !important;
}

body.home .spotlight-row:nth-child(even):not(.table-header-row) {
    background: #fffdf8 !important;
}

body.home .spotlight-row:hover:not(.table-header-row) {
    background: #f8fbf7 !important;
}

body.home .spotlight-row.table-header-row {
    min-height: 196px !important;
    background:
        radial-gradient(circle at 22% 0%, rgba(255, 107, 74, .10), transparent 34%),
        radial-gradient(circle at 76% 12%, rgba(15, 118, 110, .11), transparent 38%),
        linear-gradient(180deg, #ffffff 0%, #f8faf7 100%) !important;
}

body.home .spotlight-row > div {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px 18px !important;
    color: #243445 !important;
    border-right: 1px solid rgba(20, 45, 50, .07) !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
    text-align: center !important;
}

body.home .spotlight-row > div:last-child {
    border-right: 0 !important;
}

body.home .spotlight-row .col-spec {
    justify-content: flex-start !important;
    text-align: left !important;
    color: #526370 !important;
    text-transform: uppercase !important;
    letter-spacing: .7px !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    background: rgba(248, 251, 247, .72) !important;
}

body.home .spotlight-row.table-header-row .col-spec,
body.home .spotlight-row.table-header-row .col-better {
    align-items: flex-start !important;
    justify-content: center !important;
    flex-direction: column !important;
    color: #334155 !important;
}

body.home .spotlight-row.table-header-row .col-better::before {
    content: "Category winner" !important;
    display: block !important;
    margin-bottom: 8px !important;
    color: #0f766e !important;
    font-size: 11px !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    letter-spacing: .8px !important;
    font-weight: 950 !important;
}

body.home .spotlight-table--three .col-mon--header {
    flex-direction: column !important;
    gap: 10px !important;
    justify-content: center !important;
    padding: 22px 18px !important;
}

body.home .spotlight-monitor-img,
body.home .spotlight-monitor-placeholder {
    width: 132px !important;
    height: 82px !important;
    border-radius: 16px !important;
    object-fit: cover !important;
    background:
        radial-gradient(circle at 74% 20%, rgba(255, 107, 74, .16), transparent 32%),
        radial-gradient(circle at 24% 80%, rgba(15, 118, 110, .12), transparent 36%),
        linear-gradient(135deg, #f6fbff, #fff7f0) !important;
    border: 1px solid rgba(20, 45, 50, .11) !important;
    box-shadow: 0 12px 28px rgba(16, 35, 45, .08) !important;
}

body.home .spotlight-monitor-placeholder {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
}

body.home .spotlight-monitor-placeholder span {
    display: none !important;
}

body.home .spotlight-monitor-placeholder::before {
    content: "" !important;
    width: 74px !important;
    height: 42px !important;
    border-radius: 8px !important;
    background:
        linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px),
        linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
        linear-gradient(135deg, #1d2738, #101827) !important;
    background-size: 16px 16px, 16px 16px, auto !important;
    box-shadow: 0 14px 0 -8px #1d2738, 0 18px 0 -10px #1d2738 !important;
}

body.home .spotlight-table--three .col-mon h3 {
    margin: 4px auto 0 !important;
    max-width: 210px !important;
    color: #102027 !important;
    font-size: 15px !important;
    line-height: 1.25 !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
}

body.home .spotlight-row .price {
    margin: 0 !important;
    color: #ff5a45 !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    font-weight: 950 !important;
}

body.home .spotlight-row .price span {
    margin-left: 8px !important;
    color: #f59e0b !important;
    font-size: 12px !important;
    font-weight: 950 !important;
}

body.home .spotlight-row .col-mon.is-best {
    color: #0f766e !important;
    background: linear-gradient(180deg, rgba(15, 118, 110, .075), rgba(255, 253, 248, .64)) !important;
}

body.home .spotlight-row .check-icon {
    display: inline-grid !important;
    place-items: center !important;
    width: 19px !important;
    height: 19px !important;
    margin-left: 7px !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    background: #0f766e !important;
    font-size: 12px !important;
    line-height: 1 !important;
    box-shadow: 0 8px 16px rgba(15, 118, 110, .20) !important;
}

body.home .spotlight-row .col-better {
    color: #0f766e !important;
    background: linear-gradient(180deg, rgba(15, 118, 110, .06), rgba(255, 253, 248, .72)) !important;
    font-size: 13px !important;
    font-weight: 950 !important;
}

body.home .spotlight-row .trophy {
    justify-content: flex-start !important;
    text-align: left !important;
    color: #0f766e !important;
    line-height: 1.45 !important;
}

body.home .spotlight-row .score-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 118px !important;
    padding: 9px 13px !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #0f766e, #13a79a) !important;
    box-shadow: 0 10px 22px rgba(15, 118, 110, .18) !important;
    font-size: 12px !important;
    font-weight: 950 !important;
}

body.home .spotlight-row.table-footer-row {
    background: linear-gradient(180deg, #f7fbf8, #ffffff) !important;
}

@media (max-width: 1180px) {
    body.home .comparison-spotlight-section {
        padding: 70px 16px 86px !important;
    }

    body.home .spotlight-header {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    body.home .spotlight-table {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
}

@media (max-width: 640px) {
    body.home .spotlight-titles h2::before {
        width: auto !important;
    }

    body.home .spotlight-table--three .spotlight-row--three {
        grid-template-columns: 142px repeat(3, 170px) 180px !important;
        min-width: 832px !important;
    }

    body.home .spotlight-row > div {
        padding: 16px 12px !important;
        font-size: 13px !important;
    }

    body.home .spotlight-monitor-img,
    body.home .spotlight-monitor-placeholder {
        width: 110px !important;
        height: 70px !important;
    }
}

/* =============================================================
   HOMEPAGE LATEST COMPARISONS + GUIDES FINAL POLISH
   ============================================================= */

body.home .lc-section,
body.home .lgr-section {
    position: relative !important;
    width: 100% !important;
    padding: 72px 24px !important;
    background:
        radial-gradient(circle at 12% 12%, rgba(255, 107, 74, .08), transparent 30%),
        radial-gradient(circle at 86% 22%, rgba(15, 118, 110, .08), transparent 34%),
        linear-gradient(180deg, #fffdf8 0%, #f8fbf7 100%) !important;
    border-top: 1px solid rgba(20, 45, 50, .07) !important;
}

body.home .lgr-section {
    padding-top: 64px !important;
    background:
        radial-gradient(circle at 15% 18%, rgba(139, 92, 246, .08), transparent 30%),
        radial-gradient(circle at 84% 18%, rgba(255, 107, 74, .08), transparent 34%),
        linear-gradient(180deg, #f8fbf7 0%, #fffdf8 100%) !important;
}

body.home .lc-inner,
body.home .lgr-inner {
    width: min(1500px, 100%) !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

body.home .lc-header,
body.home .lgr-header {
    display: flex !important;
    align-items: end !important;
    justify-content: space-between !important;
    gap: 22px !important;
    margin: 0 0 28px !important;
}

body.home .lc-eyebrow,
body.home .lgr-eyebrow {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: max-content !important;
    margin: 0 0 14px !important;
    padding: 8px 13px !important;
    border-radius: 999px !important;
    color: #ff5a45 !important;
    background: rgba(255, 107, 74, .10) !important;
    border: 1px solid rgba(255, 107, 74, .16) !important;
    font-size: 12px !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    letter-spacing: .75px !important;
    font-weight: 950 !important;
}

body.home .lgr-eyebrow {
    color: #0f766e !important;
    background: rgba(15, 118, 110, .10) !important;
    border-color: rgba(15, 118, 110, .16) !important;
}

body.home .lc-title,
body.home .lgr-title {
    margin: 0 !important;
    color: #102027 !important;
    background: none !important;
    -webkit-text-fill-color: #102027 !important;
    text-shadow: none !important;
    font-size: clamp(30px, 2.15vw, 42px) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    font-weight: 950 !important;
}

body.home .lc-view-all,
body.home .lgr-view-all {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 124px !important;
    min-height: 46px !important;
    padding: 0 18px !important;
    border-radius: 14px !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #ff6b4a 0%, #ff4f7b 58%, #8b5cf6 100%) !important;
    border: 0 !important;
    box-shadow: 0 14px 30px rgba(255, 79, 123, .18) !important;
    text-decoration: none !important;
    font-size: 14px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    opacity: 1 !important;
}

body.home .lc-view-all:hover,
body.home .lgr-view-all:hover {
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 18px 38px rgba(255, 79, 123, .24) !important;
}

body.home .lc-grid,
body.home .lgr-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 360px)) !important;
    gap: 24px !important;
    align-items: stretch !important;
    justify-content: start !important;
}

body.home .lc-card,
body.home .lgr-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    min-height: 0 !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .96) !important;
    border: 1px solid rgba(20, 45, 50, .10) !important;
    box-shadow: 0 18px 52px rgba(16, 35, 45, .10) !important;
    color: #102027 !important;
    text-decoration: none !important;
    transform: none !important;
}

body.home .lc-card::before,
body.home .lgr-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto !important;
    height: 5px !important;
    background: linear-gradient(90deg, #ff6b4a, #ff4f7b, #0f766e) !important;
    opacity: .88 !important;
}

body.home .lc-card:hover,
body.home .lgr-card:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(15, 118, 110, .18) !important;
    box-shadow: 0 24px 70px rgba(16, 35, 45, .14) !important;
}

body.home .lc-card-monitors {
    min-height: 132px !important;
    padding: 24px 22px 16px !important;
    display: grid !important;
    grid-template-columns: 1fr auto 1fr !important;
    align-items: center !important;
    gap: 12px !important;
    background:
        radial-gradient(circle at 24% 20%, rgba(15, 118, 110, .11), transparent 34%),
        radial-gradient(circle at 80% 22%, rgba(139, 92, 246, .10), transparent 34%),
        linear-gradient(135deg, #f7fbf8, #fff8f1) !important;
}

body.home .lc-mon-thumb {
    display: grid !important;
    place-items: center !important;
    min-width: 0 !important;
}

body.home .lc-mon-thumb svg {
    width: 100% !important;
    max-width: 112px !important;
    height: auto !important;
    filter: drop-shadow(0 10px 18px rgba(16, 35, 45, .10)) !important;
}

body.home .lc-vs-mini {
    display: inline-grid !important;
    place-items: center !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #8b5cf6, #ff4f7b) !important;
    box-shadow: 0 12px 24px rgba(139, 92, 246, .24) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
}

body.home .lc-card-body,
body.home .lgr-card-body {
    padding: 22px 24px 24px !important;
    background: #ffffff !important;
}

body.home .lc-card-names {
    margin: 0 0 16px !important;
    color: #102027 !important;
    font-size: 17px !important;
    line-height: 1.35 !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
}

body.home .lc-card-names span {
    color: #ff5a45 !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    text-transform: uppercase !important;
}

body.home .lc-card-link {
    display: inline-flex !important;
    align-items: center !important;
    width: max-content !important;
    color: #0f766e !important;
    background: rgba(15, 118, 110, .08) !important;
    border: 1px solid rgba(15, 118, 110, .12) !important;
    border-radius: 999px !important;
    padding: 8px 12px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
}

body.home .lgr-thumb {
    position: relative !important;
    min-height: 190px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 72% 18%, rgba(255, 107, 74, .13), transparent 34%),
        radial-gradient(circle at 18% 72%, rgba(15, 118, 110, .11), transparent 36%),
        linear-gradient(135deg, #f7fbf8, #fff8f1) !important;
    border-bottom: 1px solid rgba(20, 45, 50, .08) !important;
}

body.home .lgr-thumb img {
    width: 100% !important;
    height: 210px !important;
    object-fit: cover !important;
    display: block !important;
}

body.home .lgr-thumb > div {
    width: 100% !important;
    height: 210px !important;
    display: grid !important;
    place-items: center !important;
    color: #536471 !important;
    background:
        linear-gradient(90deg, rgba(15, 118, 110, .06) 1px, transparent 1px),
        linear-gradient(rgba(255, 107, 74, .06) 1px, transparent 1px),
        linear-gradient(135deg, #f7fbf8, #fff8f1) !important;
    background-size: 22px 22px, 22px 22px, auto !important;
    font-weight: 850 !important;
}

body.home .lgr-tag {
    position: absolute !important;
    top: 16px !important;
    left: 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 24px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #ff6b4a, #ff4f7b) !important;
    box-shadow: 0 10px 22px rgba(255, 79, 123, .18) !important;
    font-size: 10px !important;
    line-height: 1 !important;
    letter-spacing: .55px !important;
    text-transform: uppercase !important;
    font-weight: 950 !important;
}

body.home .lgr-card-title {
    margin: 0 0 12px !important;
    color: #102027 !important;
    font-size: 19px !important;
    line-height: 1.25 !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
}

body.home .lgr-card-excerpt {
    margin: 0 0 18px !important;
    color: #536471 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 650 !important;
}

body.home .lgr-card-meta {
    display: flex !important;
    align-items: center !important;
    color: #0f766e !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: .45px !important;
}

@media (max-width: 900px) {
    body.home .lc-section,
    body.home .lgr-section {
        padding: 56px 16px !important;
    }

    body.home .lc-header,
    body.home .lgr-header {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    body.home .lc-grid,
    body.home .lgr-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Make sparse latest sections feel intentional instead of empty. */
body.home .lc-inner,
body.home .lgr-inner {
    width: min(1180px, 100%) !important;
}

body.home .lc-grid,
body.home .lgr-grid {
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)) !important;
}

@media (min-width: 760px) {
    body.home .lc-card,
    body.home .lgr-card {
        display: grid !important;
        grid-template-columns: minmax(260px, 38%) 1fr !important;
        align-items: stretch !important;
    }

    body.home .lc-card-monitors,
    body.home .lgr-thumb {
        min-height: 230px !important;
        height: 100% !important;
        border-right: 1px solid rgba(20, 45, 50, .08) !important;
        border-bottom: 0 !important;
    }

    body.home .lc-card-body,
    body.home .lgr-card-body {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        min-height: 230px !important;
        padding: 30px 34px !important;
    }

    body.home .lc-card-names,
    body.home .lgr-card-title {
        max-width: 620px !important;
        font-size: clamp(20px, 1.45vw, 28px) !important;
        line-height: 1.22 !important;
    }

    body.home .lgr-card-excerpt {
        max-width: 680px !important;
        font-size: 15px !important;
    }
}

@media (max-width: 759px) {
    body.home .lc-grid,
    body.home .lgr-grid {
        grid-template-columns: 1fr !important;
    }
}

/* =============================================================
   FINAL GREEN BUTTON SYSTEM + 4-CARD LATEST SECTIONS
   ============================================================= */

:root {
    --ms-green: #0f766e;
    --ms-green-dark: #0b5f58;
    --ms-green-soft: rgba(15, 118, 110, .10);
    --ms-green-border: rgba(15, 118, 110, .18);
    --ms-green-shadow: rgba(15, 118, 110, .22);
}

body.home .lc-inner,
body.home .lgr-inner {
    width: min(1500px, 100%) !important;
}

body.home .lc-grid,
body.home .lgr-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
    justify-content: stretch !important;
}

body.home .lc-card,
body.home .lgr-card {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

body.home .lc-card-monitors,
body.home .lgr-thumb {
    min-height: 172px !important;
    height: 172px !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(20, 45, 50, .08) !important;
}

body.home .lc-card-body,
body.home .lgr-card-body {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    min-height: 0 !important;
    padding: 22px 22px 24px !important;
}

body.home .lc-card-names,
body.home .lgr-card-title {
    max-width: none !important;
    color: #102027 !important;
    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 950 !important;
}

body.home .lgr-card-excerpt {
    max-width: none !important;
    font-size: 14px !important;
}

body.home .lc-card::before,
body.home .lgr-card::before {
    background: linear-gradient(90deg, #0f766e, #13a79a, #ffb020) !important;
}

.ms-btn-primary,
.ms-filter-submit,
.btn-compare,
.lc-view-all,
.lgr-view-all,
.ms-submit-btn,
.ms-button,
.button-primary,
.wp-block-button__link,
button[type="submit"],
input[type="submit"],
.ms-community-panel .ms-button,
.ms-brand-panel .ms-button,
.ecb-submit,
.ms-suggest-submit,
.ms-support-btn {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    border-color: rgba(15, 118, 110, .28) !important;
    box-shadow: 0 14px 30px rgba(15, 118, 110, .20) !important;
}

.ms-btn-primary:hover,
.ms-filter-submit:hover,
.btn-compare:hover,
.lc-view-all:hover,
.lgr-view-all:hover,
.ms-submit-btn:hover,
.ms-button:hover,
.button-primary:hover,
.wp-block-button__link:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.ms-community-panel .ms-button:hover,
.ms-brand-panel .ms-button:hover,
.ecb-submit:hover,
.ms-suggest-submit:hover,
.ms-support-btn:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0b5f58 0%, #0f766e 62%, #13a79a 100%) !important;
    border-color: rgba(15, 118, 110, .36) !important;
    box-shadow: 0 18px 38px rgba(15, 118, 110, .28) !important;
    transform: translateY(-2px) !important;
}

body.home .lc-view-all,
body.home .lgr-view-all,
body.home .comparison-spotlight-section .btn-compare {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    box-shadow: 0 16px 34px rgba(15, 118, 110, .22) !important;
}

body.home .lc-eyebrow,
body.home .lgr-eyebrow {
    color: #0f766e !important;
    background: rgba(15, 118, 110, .10) !important;
    border-color: rgba(15, 118, 110, .16) !important;
}

body.home .lc-vs-mini {
    background: linear-gradient(135deg, #0f766e, #13a79a) !important;
    box-shadow: 0 12px 24px rgba(15, 118, 110, .22) !important;
}

body.home .lgr-tag {
    background: linear-gradient(135deg, #0f766e, #13a79a) !important;
    box-shadow: 0 10px 22px rgba(15, 118, 110, .18) !important;
}

@media (max-width: 1180px) {
    body.home .lc-grid,
    body.home .lgr-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    body.home .lc-grid,
    body.home .lgr-grid {
        grid-template-columns: 1fr !important;
    }
}

/* =============================================================
   FINAL GREEN CTA CLEANUP
   Keeps every prominent site button inside the green brand family.
   ============================================================= */

.ms-hero-v2__btn--primary,
.ms-amazon-btn,
.ecb-btn,
.ms-btn-primary,
.ms-filter-submit,
.btn-compare,
.lc-view-all,
.lgr-view-all,
.ms-submit-btn,
.ms-button,
.button-primary,
.wp-block-button__link,
button[type="submit"],
input[type="submit"],
body.home a[style*="linear-gradient"] {
    background: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    border-color: rgba(15, 118, 110, .28) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(15, 118, 110, .18) !important;
}

.ms-hero-v2__btn--primary:hover,
.ms-amazon-btn:hover,
.ecb-btn:hover,
.ms-btn-primary:hover,
.ms-filter-submit:hover,
.btn-compare:hover,
.lc-view-all:hover,
.lgr-view-all:hover,
.ms-submit-btn:hover,
.ms-button:hover,
.button-primary:hover,
.wp-block-button__link:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
body.home a[style*="linear-gradient"]:hover {
    background: linear-gradient(135deg, #0b5f58 0%, #0f8f84 60%, #094f49 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 18px 38px rgba(15, 118, 110, .24) !important;
}

.ms-card-secondary,
.ms-card-compare,
.ms-hero-v2__btn--secondary {
    background: rgba(255, 255, 255, .94) !important;
    border: 1px solid rgba(15, 118, 110, .22) !important;
    color: #0f766e !important;
    box-shadow: 0 10px 22px rgba(15, 118, 110, .08) !important;
}

.ms-card-secondary:hover,
.ms-card-compare:hover,
.ms-hero-v2__btn--secondary:hover {
    background: rgba(240, 253, 250, .96) !important;
    border-color: rgba(15, 118, 110, .38) !important;
    color: #0b5f58 !important;
}

/* Strongest final pass for legacy high-specificity button rules. */
body.home .ms-hero-v2 .ms-hero-v2__btn.ms-hero-v2__btn--primary,
body.home .ms-card .ms-amazon-btn,
body.home .ms-monitor-card .ms-amazon-btn,
body.home .ms-card-actions .ms-amazon-btn,
body.home .ms-card-footer .ms-amazon-btn,
body.home a.ms-amazon-btn,
body.home .ecb-form .ecb-btn,
body.home a[style*="linear-gradient"] {
    background: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    background-image: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    background-color: #0f766e !important;
    border-color: rgba(15, 118, 110, .28) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(15, 118, 110, .18) !important;
}

body.home .ms-hero-v2 .ms-hero-v2__btn.ms-hero-v2__btn--primary:hover,
body.home .ms-card .ms-amazon-btn:hover,
body.home .ms-monitor-card .ms-amazon-btn:hover,
body.home .ms-card-actions .ms-amazon-btn:hover,
body.home .ms-card-footer .ms-amazon-btn:hover,
body.home a.ms-amazon-btn:hover,
body.home .ecb-form .ecb-btn:hover,
body.home a[style*="linear-gradient"]:hover {
    background: linear-gradient(135deg, #0b5f58 0%, #0f8f84 60%, #094f49 100%) !important;
    background-image: linear-gradient(135deg, #0b5f58 0%, #0f8f84 60%, #094f49 100%) !important;
    background-color: #0b5f58 !important;
    color: #ffffff !important;
    box-shadow: 0 18px 38px rgba(15, 118, 110, .24) !important;
}

/* =============================================================
   FINAL COMMUNITY SIGNUP + AMAZON BUTTON SYSTEM
   ============================================================= */

#join-community {
    scroll-margin-top: 110px;
}

body.home .ecb-section {
    padding: 78px 24px !important;
    background:
        radial-gradient(circle at 12% 8%, rgba(15, 118, 110, .08), transparent 30%),
        radial-gradient(circle at 82% 28%, rgba(255, 176, 32, .10), transparent 34%),
        linear-gradient(180deg, #f8fbf7 0%, #fffdf8 100%) !important;
    border-top: 1px solid rgba(15, 118, 110, .10) !important;
    border-bottom: 1px solid rgba(15, 118, 110, .10) !important;
}

body.home .ecb-inner {
    position: relative;
    display: grid !important;
    grid-template-columns: minmax(320px, 0.88fr) minmax(480px, 1.12fr) !important;
    gap: 34px !important;
    align-items: center !important;
    max-width: 1500px !important;
    padding: 34px !important;
    overflow: hidden !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(246, 252, 249, .92)),
        radial-gradient(circle at 0 0, rgba(15, 118, 110, .12), transparent 36%) !important;
    border: 1px solid rgba(15, 118, 110, .14) !important;
    border-radius: 24px !important;
    box-shadow: 0 24px 70px rgba(16, 35, 45, .12) !important;
}

body.home .ecb-inner::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 7px;
    background: linear-gradient(180deg, #0f766e, #13a79a, #ffb020);
}

body.home .ecb-left {
    position: relative;
    display: grid !important;
    grid-template-columns: 64px 1fr !important;
    gap: 18px !important;
    align-items: start !important;
}

body.home .ecb-icon {
    display: grid !important;
    place-items: center !important;
    width: 58px !important;
    height: 58px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, rgba(15, 118, 110, .12), rgba(19, 167, 154, .14)) !important;
    border: 1px solid rgba(15, 118, 110, .18) !important;
    color: #0f766e !important;
    box-shadow: 0 14px 34px rgba(15, 118, 110, .12) !important;
}

body.home .ecb-icon svg circle,
body.home .ecb-icon svg path {
    stroke: currentColor !important;
}

body.home .ecb-icon svg circle[fill] {
    fill: rgba(15, 118, 110, .18) !important;
}

body.home .ecb-eyebrow {
    display: inline-flex !important;
    width: max-content !important;
    margin: 0 0 10px !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    background: rgba(15, 118, 110, .10) !important;
    border: 1px solid rgba(15, 118, 110, .14) !important;
    color: #0f766e !important;
    font-size: 12px !important;
    letter-spacing: .9px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

body.home .ecb-heading {
    max-width: 640px !important;
    margin: 0 0 12px !important;
    color: #102027 !important;
    font-size: clamp(28px, 2.6vw, 42px) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

body.home .ecb-accent {
    color: #0f766e !important;
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
}

body.home .ecb-desc {
    max-width: 620px !important;
    margin: 0 !important;
    color: #475569 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}

body.home .ecb-right {
    position: relative !important;
    min-width: 0 !important;
}

body.home .ecb-form {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.home .ecb-fields {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    margin-bottom: 14px !important;
}

body.home .ecb-label {
    display: block !important;
    margin: 0 0 7px !important;
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .55px !important;
    text-transform: uppercase !important;
}

body.home .ecb-input {
    width: 100% !important;
    min-height: 48px !important;
    background: #ffffff !important;
    border: 1px solid rgba(15, 118, 110, .16) !important;
    border-radius: 14px !important;
    color: #102027 !important;
    box-shadow: 0 8px 20px rgba(16, 35, 45, .06) !important;
}

body.home .ecb-input:focus {
    border-color: rgba(15, 118, 110, .48) !important;
    box-shadow: 0 0 0 4px rgba(15, 118, 110, .10) !important;
}

body.home .ecb-btn {
    min-height: 54px !important;
    width: 100% !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    background-image: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 16px 34px rgba(15, 118, 110, .22) !important;
}

body.home .ecb-trust {
    display: flex !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: 8px 18px !important;
    margin-top: 12px !important;
    color: #5b6870 !important;
}

body.home .ecb-trust-item {
    color: #475569 !important;
    font-weight: 700 !important;
}

.ms-amazon-btn,
body.home .ms-card .ms-amazon-btn,
body.home .ms-monitor-card .ms-amazon-btn,
body.home .ms-card-actions .ms-amazon-btn,
body.home .ms-card-footer .ms-amazon-btn,
body.home a.ms-amazon-btn,
.cmp-btn-amazon,
.ms-card-amazon,
.amazon-btn,
.single-monitor a[href*="amazon."],
.single-monitor a[href*="amzn.to"],
.ms-global-card a[href*="amazon."],
.ms-global-card a[href*="amzn.to"],
a[href*="amazon."][rel*="sponsored"],
a[href*="amzn.to"][rel*="sponsored"] {
    background: linear-gradient(135deg, #ffb020 0%, #ff9800 100%) !important;
    background-image: linear-gradient(135deg, #ffb020 0%, #ff9800 100%) !important;
    background-color: #ffb020 !important;
    border-color: rgba(245, 158, 11, .58) !important;
    color: #102027 !important;
    box-shadow: 0 14px 30px rgba(245, 158, 11, .22) !important;
}

.ms-amazon-btn:hover,
body.home .ms-card .ms-amazon-btn:hover,
body.home .ms-monitor-card .ms-amazon-btn:hover,
body.home .ms-card-actions .ms-amazon-btn:hover,
body.home .ms-card-footer .ms-amazon-btn:hover,
body.home a.ms-amazon-btn:hover,
.cmp-btn-amazon:hover,
.ms-card-amazon:hover,
.amazon-btn:hover,
.single-monitor a[href*="amazon."]:hover,
.single-monitor a[href*="amzn.to"]:hover,
.ms-global-card a[href*="amazon."]:hover,
.ms-global-card a[href*="amzn.to"]:hover,
a[href*="amazon."][rel*="sponsored"]:hover,
a[href*="amzn.to"][rel*="sponsored"]:hover {
    background: linear-gradient(135deg, #f59e0b 0%, #f97316 100%) !important;
    background-image: linear-gradient(135deg, #f59e0b 0%, #f97316 100%) !important;
    color: #102027 !important;
    box-shadow: 0 18px 36px rgba(245, 158, 11, .28) !important;
}

@media (max-width: 980px) {
    body.home .ecb-inner {
        grid-template-columns: 1fr !important;
        padding: 26px !important;
    }

    body.home .ecb-fields {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 560px) {
    body.home .ecb-section {
        padding: 48px 14px !important;
    }

    body.home .ecb-inner {
        padding: 22px !important;
        border-radius: 18px !important;
    }

    body.home .ecb-left {
        grid-template-columns: 1fr !important;
    }
}

/* =============================================================
   FINAL HOME COMMUNITY / REQUEST / SUPPORT BLOCK POLISH
   ============================================================= */

body.home .ms-community-hub {
    padding: 86px 24px !important;
    background:
        radial-gradient(circle at 12% 20%, rgba(15, 118, 110, .08), transparent 30%),
        radial-gradient(circle at 86% 15%, rgba(255, 176, 32, .10), transparent 32%),
        radial-gradient(circle at 78% 82%, rgba(19, 167, 154, .08), transparent 34%),
        linear-gradient(180deg, #fffdf8 0%, #f7fbf8 100%) !important;
    border-top: 1px solid rgba(15, 118, 110, .10) !important;
    border-bottom: 1px solid rgba(15, 118, 110, .10) !important;
}

body.home .ms-community-hub > div {
    max-width: 1500px !important;
}

body.home .ms-community-duo {
    gap: 28px !important;
    align-items: stretch !important;
    margin-bottom: 28px !important;
}

body.home .ms-community-panel,
body.home .ms-brand-panel,
body.home .ms-suggest-cta-band,
body.home .ms-warranty-cta-band {
    position: relative !important;
    overflow: hidden !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .97), rgba(247, 251, 248, .94)) !important;
    border: 1px solid rgba(15, 118, 110, .14) !important;
    border-radius: 24px !important;
    box-shadow: 0 24px 70px rgba(16, 35, 45, .11) !important;
}

body.home .ms-community-panel {
    padding: 28px !important;
}

body.home .ms-community-panel::before,
body.home .ms-brand-panel::before,
body.home .ms-suggest-cta-band::before,
body.home .ms-warranty-cta-band::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto 0 !important;
    height: 6px !important;
    background: linear-gradient(90deg, #0f766e, #13a79a, #ffb020) !important;
}

body.home .ms-community-panel h2,
body.home .ms-brand-panel h2,
body.home .ms-suggest-cta-band h2,
body.home .ms-warranty-cta-band h3 {
    color: #102027 !important;
    letter-spacing: 0 !important;
}

body.home .ms-community-panel p,
body.home .ms-brand-panel p,
body.home .ms-suggest-cta-band p,
body.home .ms-warranty-cta-band p {
    color: #475569 !important;
}

body.home .ms-community-panel [style*="Live community queue"],
body.home .ms-brand-panel > span,
body.home .ms-suggest-cta-band span,
body.home .ms-warranty-cta-band span {
    color: #0f766e !important;
}

body.home .ms-community-panel a[href*="community-requests"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    background: rgba(15, 118, 110, .10) !important;
    border: 1px solid rgba(15, 118, 110, .18) !important;
    color: #0f766e !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

body.home .ms-community-tracker {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

body.home .ms-community-stat,
body.home .ms-community-meter,
body.home .ms-community-status-pill,
body.home .ms-brand-stat-grid > div {
    background: #f8fafc !important;
    border: 1px solid rgba(15, 118, 110, .13) !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 24px rgba(16, 35, 45, .055) !important;
}

body.home .ms-community-stat {
    padding: 16px !important;
}

body.home .ms-community-stat strong,
body.home .ms-community-status-pill strong,
body.home .ms-brand-stat-grid strong,
body.home .ms-community-meter-top strong {
    color: #102027 !important;
}

body.home .ms-community-stat span,
body.home .ms-community-status-pill span,
body.home .ms-brand-stat-grid span,
body.home .ms-community-meter-top span {
    color: #475569 !important;
}

body.home .ms-community-meter-track,
body.home .ms-req-meter-track {
    background: rgba(15, 118, 110, .12) !important;
}

body.home .ms-community-meter-track span,
body.home .ms-req-meter-track span {
    background: linear-gradient(90deg, #0f766e, #13a79a) !important;
}

body.home .ms-community-status-row {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin-top: 14px !important;
}

body.home .ms-community-status-pill {
    text-decoration: none !important;
    padding: 14px !important;
    min-height: 54px !important;
}

body.home .ms-brand-panel {
    padding: 28px !important;
}

body.home .ms-brand-panel .ms-brand-leaderboard-cta,
body.home .ms-suggest-cta-band > a,
body.home .ms-warranty-cta-band a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 50px !important;
    padding: 0 24px !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    background-image: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    color: #ffffff !important;
    border: 1px solid rgba(15, 118, 110, .26) !important;
    box-shadow: 0 16px 34px rgba(15, 118, 110, .18) !important;
    text-decoration: none !important;
    font-weight: 900 !important;
}

body.home .ms-brand-panel .ms-brand-leaderboard-cta {
    width: 100% !important;
}

body.home .ms-brand-panel .ms-brand-leaderboard-cta:hover,
body.home .ms-suggest-cta-band > a:hover,
body.home .ms-warranty-cta-band a:hover {
    background: linear-gradient(135deg, #0b5f58 0%, #0f8f84 60%, #094f49 100%) !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 20px 42px rgba(15, 118, 110, .24) !important;
}

body.home .ms-suggest-cta-band,
body.home .ms-warranty-cta-band {
    padding: 34px 38px !important;
    margin-bottom: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;
}

body.home .ms-suggest-cta-band {
    background:
        radial-gradient(circle at 94% 12%, rgba(15, 118, 110, .12), transparent 28%),
        linear-gradient(135deg, rgba(255, 255, 255, .97), rgba(248, 251, 247, .94)) !important;
}

body.home .ms-warranty-cta-band {
    background:
        radial-gradient(circle at 8% 20%, rgba(255, 176, 32, .13), transparent 30%),
        linear-gradient(135deg, rgba(255, 255, 255, .97), rgba(255, 251, 244, .94)) !important;
}

body.home .ms-warranty-cta-band > div:first-child,
body.home .ms-suggest-cta-band > div:first-child {
    max-width: 760px !important;
}

@media (max-width: 1120px) {
    body.home .ms-community-duo {
        grid-template-columns: 1fr !important;
    }

    body.home .ms-community-tracker {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    body.home .ms-community-hub {
        padding: 54px 14px !important;
    }

    body.home .ms-community-panel,
    body.home .ms-brand-panel,
    body.home .ms-suggest-cta-band,
    body.home .ms-warranty-cta-band {
        border-radius: 18px !important;
        padding: 22px !important;
    }

    body.home .ms-community-tracker,
    body.home .ms-community-status-row,
    body.home .ms-brand-stat-grid {
        grid-template-columns: 1fr !important;
    }

    body.home .ms-suggest-cta-band,
    body.home .ms-warranty-cta-band {
        align-items: stretch !important;
    }

    body.home .ms-suggest-cta-band > a,
    body.home .ms-warranty-cta-band a {
        width: 100% !important;
    }
}

/* =============================================================
   FINAL FIND MONITOR PAGE + GLOBAL JOIN COMMUNITY POLISH
   ============================================================= */

body.category-find-monitor,
body.category-find-monitor main,
body.category-find-monitor .find-monitor-main {
    background:
        radial-gradient(circle at 8% 10%, rgba(255, 176, 32, .08), transparent 28%),
        radial-gradient(circle at 92% 18%, rgba(15, 118, 110, .10), transparent 32%),
        linear-gradient(180deg, #fffdf8 0%, #f6f8f4 42%, #f4f7f4 100%) !important;
    color: #102027 !important;
}

body.category-find-monitor .page-header {
    padding: 76px 24px 54px !important;
    background:
        radial-gradient(circle at 75% 20%, rgba(15, 118, 110, .10), transparent 34%),
        radial-gradient(circle at 18% 12%, rgba(255, 107, 74, .10), transparent 30%),
        linear-gradient(180deg, #fffdf8 0%, #f6f4ef 100%) !important;
    border-bottom: 1px solid rgba(15, 118, 110, .10) !important;
}

body.category-find-monitor .page-header__inner {
    max-width: 1500px !important;
}

body.category-find-monitor .page-header h1 {
    color: #102027 !important;
    font-size: clamp(38px, 4vw, 64px) !important;
    letter-spacing: 0 !important;
}

body.category-find-monitor .page-header p {
    max-width: 720px !important;
    color: #334155 !important;
    font-weight: 700 !important;
}

body.category-find-monitor .find-monitor-main {
    padding: 44px 24px 72px !important;
}

body.category-find-monitor .find-monitor-layout {
    max-width: 1500px !important;
    display: grid !important;
    grid-template-columns: minmax(260px, 310px) minmax(0, 1fr) !important;
    gap: 34px !important;
    align-items: start !important;
}

body.category-find-monitor .amz-sidebar {
    position: sticky !important;
    top: 104px !important;
    max-width: none !important;
    width: 100% !important;
    max-height: calc(100vh - 122px) !important;
    padding: 22px !important;
    overflow: auto !important;
    background: rgba(255, 255, 255, .92) !important;
    border: 1px solid rgba(15, 118, 110, .13) !important;
    border-radius: 24px !important;
    box-shadow: 0 22px 60px rgba(16, 35, 45, .10) !important;
}

body.category-find-monitor .amz-sidebar::-webkit-scrollbar {
    width: 8px;
}

body.category-find-monitor .amz-sidebar::-webkit-scrollbar-thumb {
    background: rgba(15, 118, 110, .25);
    border-radius: 999px;
}

body.category-find-monitor .amz-filter-group {
    margin-bottom: 22px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid rgba(15, 118, 110, .10) !important;
}

body.category-find-monitor .amz-filter-group:last-child {
    border-bottom: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

body.category-find-monitor .amz-title {
    display: block !important;
    margin-bottom: 12px !important;
    color: #102027 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: .03em !important;
    text-transform: uppercase !important;
}

body.category-find-monitor .amz-inp,
body.category-find-monitor #ms-sort-by {
    background: #ffffff !important;
    border: 1px solid rgba(15, 118, 110, .18) !important;
    color: #102027 !important;
    border-radius: 12px !important;
    min-height: 42px !important;
    box-shadow: 0 8px 18px rgba(16, 35, 45, .045) !important;
}

body.category-find-monitor .amz-inp:focus,
body.category-find-monitor #ms-sort-by:focus {
    border-color: rgba(15, 118, 110, .55) !important;
    box-shadow: 0 0 0 4px rgba(15, 118, 110, .10) !important;
}

body.category-find-monitor .amz-filter-group button[type="submit"],
body.category-find-monitor .amz-go-btn {
    min-height: 42px !important;
    background: linear-gradient(135deg, #0f766e 0%, #13a79a 100%) !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 12px !important;
    font-weight: 900 !important;
    box-shadow: 0 12px 26px rgba(15, 118, 110, .18) !important;
}

body.category-find-monitor .amz-filter-group:first-child button[type="submit"] {
    min-width: 58px !important;
    font-size: 0 !important;
}

body.category-find-monitor .amz-filter-group:first-child button[type="submit"]::after {
    content: "Go" !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

body.category-find-monitor .preset-pill span {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 34px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    background: #f8fafc !important;
    border: 1px solid rgba(15, 118, 110, .16) !important;
    color: #334155 !important;
    font-weight: 800 !important;
}

body.category-find-monitor .preset-pill input:checked + span {
    background: rgba(15, 118, 110, .12) !important;
    border-color: rgba(15, 118, 110, .55) !important;
    color: #0f766e !important;
    box-shadow: inset 0 0 0 1px rgba(15, 118, 110, .16) !important;
}

body.category-find-monitor .amz-scroll-box {
    display: grid !important;
    gap: 8px !important;
}

body.category-find-monitor .amz-check,
body.category-find-monitor .amz-rate-label {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 34px !important;
    padding: 7px 9px !important;
    border-radius: 12px !important;
    color: #334155 !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    cursor: pointer !important;
    transition: background .18s ease, color .18s ease, transform .18s ease !important;
}

body.category-find-monitor .amz-check:hover,
body.category-find-monitor .amz-rate-label:hover {
    background: rgba(15, 118, 110, .07) !important;
    color: #102027 !important;
}

body.category-find-monitor .amz-check input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

body.category-find-monitor .amz-check .chk-box {
    position: relative !important;
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid rgba(15, 118, 110, .32) !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    box-shadow: inset 0 1px 2px rgba(16, 35, 45, .08) !important;
}

body.category-find-monitor .amz-check input[type="checkbox"]:checked + .chk-box {
    background: #0f766e !important;
    border-color: #0f766e !important;
    box-shadow: 0 7px 16px rgba(15, 118, 110, .18) !important;
}

body.category-find-monitor .amz-check input[type="checkbox"]:checked + .chk-box::after {
    content: "" !important;
    width: 8px !important;
    height: 4px !important;
    border-left: 2px solid #ffffff !important;
    border-bottom: 2px solid #ffffff !important;
    transform: rotate(-45deg) translate(1px, -1px) !important;
}

body.category-find-monitor .amz-check input[type="checkbox"]:focus-visible + .chk-box {
    outline: 3px solid rgba(15, 118, 110, .18) !important;
    outline-offset: 2px !important;
}

body.category-find-monitor .amz-rate-label input[type="radio"] {
    accent-color: #0f766e !important;
    width: 16px !important;
    height: 16px !important;
}

body.category-find-monitor .stars {
    color: #f59e0b !important;
    letter-spacing: .02em !important;
}

body.category-find-monitor .find-results-panel {
    min-width: 0 !important;
}

body.category-find-monitor .find-results-toolbar {
    border-radius: 18px !important;
    padding: 16px 18px !important;
    background: rgba(255, 255, 255, .94) !important;
    border: 1px solid rgba(15, 118, 110, .13) !important;
    box-shadow: 0 16px 38px rgba(16, 35, 45, .08) !important;
}

body.category-find-monitor #results-count {
    color: #475569 !important;
    font-size: 14px !important;
    font-weight: 850 !important;
}

body.category-find-monitor #results-count strong,
body.category-find-monitor #results-count b {
    color: #0f766e !important;
}

body.category-find-monitor #ms-engine-results {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
}

body.category-find-monitor #ms-engine-results > [style*="grid-column"] {
    border-color: rgba(15, 118, 110, .18) !important;
    background: rgba(255, 255, 255, .84) !important;
    color: #475569 !important;
    border-radius: 22px !important;
}

body.category-find-monitor .seo-content-wrapper {
    max-width: 1040px !important;
    background: rgba(255, 255, 255, .72) !important;
    border: 1px solid rgba(15, 118, 110, .10) !important;
    border-radius: 28px !important;
    padding: 46px !important;
    box-shadow: 0 22px 60px rgba(16, 35, 45, .08) !important;
}

body.category-find-monitor .seo-content-wrapper h2,
body.category-find-monitor .seo-content-wrapper h3,
body.category-find-monitor .seo-content-wrapper h4 {
    color: #102027 !important;
}

body.category-find-monitor .seo-content-wrapper article,
body.category-find-monitor .seo-content-wrapper p {
    color: #334155 !important;
}

body.category-find-monitor .faq-item {
    background: #ffffff !important;
    border: 1px solid rgba(15, 118, 110, .11) !important;
}

body.category-find-monitor .find-editorial-section {
    padding: 74px 24px 108px !important;
    background:
        radial-gradient(circle at 14% 4%, rgba(255, 107, 74, .07), transparent 28%),
        radial-gradient(circle at 92% 12%, rgba(15, 118, 110, .08), transparent 32%),
        linear-gradient(180deg, #f8fbff 0%, #f3f7fb 100%) !important;
    border-top: 1px solid rgba(15, 118, 110, .09) !important;
}

body.category-find-monitor .find-editorial-wrapper {
    max-width: 1060px !important;
    padding: 56px !important;
    background: rgba(255, 255, 255, .92) !important;
}

body.category-find-monitor .find-editorial-article {
    color: #334155 !important;
    font-size: 17px !important;
    line-height: 1.82 !important;
}

body.category-find-monitor .find-editorial-kicker {
    width: max-content !important;
    margin: 0 0 14px !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    background: rgba(15, 118, 110, .09) !important;
    border: 1px solid rgba(15, 118, 110, .15) !important;
    color: #0f766e !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

body.category-find-monitor .find-editorial-wrapper h1 {
    margin: 0 0 24px !important;
    color: #102027 !important;
    font-size: clamp(34px, 4vw, 58px) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.02em !important;
    max-width: 850px !important;
}

body.category-find-monitor .find-editorial-wrapper h2 {
    margin: 54px 0 18px !important;
    color: #102027 !important;
    font-size: clamp(26px, 2.5vw, 36px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.01em !important;
}

body.category-find-monitor .find-editorial-wrapper h3 {
    margin: 32px 0 12px !important;
    color: #0f766e !important;
    font-size: 21px !important;
}

body.category-find-monitor .find-editorial-wrapper p {
    margin: 0 0 22px !important;
    color: #334155 !important;
}

body.category-find-monitor .find-editorial-wrapper strong {
    color: #102027 !important;
}

body.category-find-monitor .find-editorial-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 22px 0 30px !important;
    padding: 0 !important;
    list-style: none !important;
}

body.category-find-monitor .find-editorial-list li {
    position: relative !important;
    padding: 14px 16px 14px 42px !important;
    background: #f8fbff !important;
    border: 1px solid rgba(15, 118, 110, .12) !important;
    border-radius: 14px !important;
    color: #334155 !important;
    box-shadow: 0 10px 28px rgba(16, 35, 45, .05) !important;
}

body.category-find-monitor .find-editorial-list li::before {
    content: "" !important;
    position: absolute !important;
    left: 16px !important;
    top: 21px !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #0f766e, #ff6b4a) !important;
}

body.category-find-monitor .find-editorial-faq {
    margin-top: 58px !important;
    padding-top: 38px !important;
    border-top: 1px solid rgba(15, 118, 110, .12) !important;
}

body.category-find-monitor .find-editorial-faq h2 {
    margin-top: 0 !important;
}

body.category-find-monitor .find-editorial-faq .faq-item {
    margin: 12px 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: 0 12px 34px rgba(16, 35, 45, .06) !important;
}

body.category-find-monitor .find-editorial-faq .faq-summary {
    padding: 18px 22px !important;
    color: #102027 !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    cursor: pointer !important;
}

body.category-find-monitor .find-editorial-faq .faq-content {
    padding: 0 22px 20px !important;
    color: #334155 !important;
    line-height: 1.75 !important;
}

.ecb-section--global {
    padding: 64px 24px !important;
    background:
        radial-gradient(circle at 10% 28%, rgba(15, 118, 110, .10), transparent 32%),
        radial-gradient(circle at 90% 20%, rgba(255, 176, 32, .13), transparent 30%),
        linear-gradient(135deg, #fffdf8 0%, #f7fbf8 52%, #fff7ed 100%) !important;
    border-top: 1px solid rgba(15, 118, 110, .12) !important;
    border-bottom: 1px solid rgba(15, 118, 110, .08) !important;
}

.ecb-section--global .ecb-inner {
    position: relative !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 36px 42px !important;
    display: grid !important;
    grid-template-columns: minmax(0, .95fr) minmax(520px, 1.15fr) !important;
    gap: 48px !important;
    align-items: center !important;
    background:
        radial-gradient(circle at 8% 10%, rgba(15, 118, 110, .10), transparent 34%),
        linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(247, 251, 248, .96)) !important;
    border: 1px solid rgba(15, 118, 110, .14) !important;
    border-radius: 28px !important;
    box-shadow: 0 26px 74px rgba(16, 35, 45, .12) !important;
    overflow: hidden !important;
}

.ecb-section--global .ecb-inner::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto 0 !important;
    height: 6px !important;
    background: linear-gradient(90deg, #0f766e, #13a79a, #ffb020) !important;
}

.ecb-section--global .ecb-left {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) !important;
    gap: 22px !important;
    align-items: center !important;
}

.ecb-section--global .ecb-icon {
    width: 64px !important;
    height: 64px !important;
    display: grid !important;
    place-items: center !important;
    margin: 0 !important;
    border-radius: 20px !important;
    background: rgba(15, 118, 110, .10) !important;
    border: 1px solid rgba(15, 118, 110, .18) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .74), 0 12px 24px rgba(15, 118, 110, .10) !important;
}

.ecb-section--global .ecb-icon svg {
    width: 42px !important;
    height: 42px !important;
}

.ecb-section--global .ecb-eyebrow {
    display: inline-flex !important;
    width: fit-content !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    background: rgba(15, 118, 110, .10) !important;
    border: 1px solid rgba(15, 118, 110, .16) !important;
    color: #0f766e !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: .08em !important;
}

.ecb-section--global .ecb-heading {
    margin: 12px 0 10px !important;
    color: #102027 !important;
    font-size: clamp(26px, 2.4vw, 38px) !important;
    line-height: 1.12 !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
}

.ecb-section--global .ecb-accent {
    color: #0f766e !important;
    background: none !important;
    -webkit-text-fill-color: #0f766e !important;
}

.ecb-section--global .ecb-desc {
    max-width: 520px !important;
    color: #475569 !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
}

.ecb-section--global .ecb-form {
    gap: 14px !important;
}

.ecb-section--global .ecb-fields {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

.ecb-section--global .ecb-label {
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.ecb-section--global .ecb-input {
    min-height: 48px !important;
    padding: 12px 15px !important;
    background: #ffffff !important;
    border: 1px solid rgba(15, 118, 110, .18) !important;
    border-radius: 14px !important;
    color: #102027 !important;
    font-size: 14px !important;
    box-shadow: 0 8px 18px rgba(16, 35, 45, .05) !important;
}

.ecb-section--global .ecb-input::placeholder {
    color: #94a3b8 !important;
}

.ecb-section--global .ecb-input:focus {
    border-color: rgba(15, 118, 110, .55) !important;
    box-shadow: 0 0 0 4px rgba(15, 118, 110, .10) !important;
}

.ecb-section--global .ecb-btn {
    min-height: 54px !important;
    width: 100% !important;
    border-radius: 15px !important;
    background: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    box-shadow: 0 18px 38px rgba(15, 118, 110, .20) !important;
}

.ecb-section--global .ecb-btn:hover {
    transform: translateY(-1px) !important;
    opacity: 1 !important;
    box-shadow: 0 24px 48px rgba(15, 118, 110, .26) !important;
}

.ecb-section--global .ecb-trust {
    justify-content: flex-start !important;
    gap: 14px 22px !important;
}

.ecb-section--global .ecb-trust-item {
    color: #475569 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.ecb-section--global .ecb-msg {
    margin-top: 10px !important;
    font-size: 13px !important;
    text-align: right !important;
    font-weight: 800 !important;
}

@media (max-width: 1020px) {
    .ecb-section--global .ecb-inner {
        grid-template-columns: 1fr !important;
        gap: 26px !important;
    }

    .ecb-section--global .ecb-fields {
        grid-template-columns: 1fr 1fr !important;
    }
}

@media (max-width: 640px) {
    .ecb-section--global {
        padding: 42px 14px !important;
    }

    .ecb-section--global .ecb-inner {
        padding: 28px 20px !important;
        border-radius: 22px !important;
    }

    .ecb-section--global .ecb-left {
        grid-template-columns: 1fr !important;
    }

    .ecb-section--global .ecb-fields {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 1180px) {
    body.category-find-monitor .find-monitor-layout {
        grid-template-columns: 1fr !important;
    }

    body.category-find-monitor .amz-sidebar {
        position: relative !important;
        top: auto !important;
        max-height: none !important;
    }

    body.category-find-monitor #ms-engine-results {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 820px) {
    body.category-find-monitor .find-monitor-main {
        padding: 28px 14px 56px !important;
    }

    body.category-find-monitor #ms-engine-results {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    body.category-find-monitor .seo-content-wrapper {
        padding: 24px !important;
        border-radius: 20px !important;
    }
}

@media (max-width: 560px) {
    body.category-find-monitor #ms-engine-results {
        grid-template-columns: 1fr !important;
    }

    body.category-find-monitor .find-results-toolbar {
        align-items: stretch !important;
    }

    body.category-find-monitor .find-results-toolbar > div {
        width: 100% !important;
    }
}

/* =============================================================
   FINAL FIND MONITOR PAGE REPAIR: CENTERED CONTENT + CLEAN FAQ
   ============================================================= */

body.category-find-monitor .find-monitor-main {
    padding: 56px 24px 88px !important;
    background:
        radial-gradient(circle at 8% 8%, rgba(255, 107, 74, .08), transparent 26%),
        radial-gradient(circle at 90% 8%, rgba(15, 118, 110, .10), transparent 30%),
        linear-gradient(180deg, #fffdf8 0%, #f5f8f6 100%) !important;
}

body.category-find-monitor .find-monitor-layout {
    width: min(1440px, calc(100vw - 48px)) !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 300px minmax(0, 1fr) !important;
    gap: 36px !important;
}

body.category-find-monitor .amz-sidebar {
    border-radius: 26px !important;
    background: rgba(255, 255, 255, .97) !important;
}

body.category-find-monitor .find-results-panel {
    width: 100% !important;
}

body.category-find-monitor .find-results-toolbar {
    margin-bottom: 24px !important;
    border-radius: 22px !important;
}

body.category-find-monitor #ms-engine-results {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 24px !important;
}

body.category-find-monitor .find-editorial-section {
    padding: 88px 24px 120px !important;
    background:
        radial-gradient(circle at 16% 12%, rgba(255, 107, 74, .07), transparent 28%),
        radial-gradient(circle at 82% 4%, rgba(15, 118, 110, .08), transparent 32%),
        linear-gradient(180deg, #f7fbff 0%, #f3f7fb 100%) !important;
}

body.category-find-monitor .find-editorial-wrapper,
body.category-find-monitor .seo-content-wrapper.find-editorial-wrapper {
    width: min(1120px, calc(100vw - 48px)) !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
    padding: clamp(30px, 5vw, 58px) !important;
    border-radius: 32px !important;
    background: rgba(255, 255, 255, .96) !important;
    border: 1px solid rgba(15, 118, 110, .12) !important;
    box-shadow: 0 28px 80px rgba(16, 35, 45, .10) !important;
}

body.category-find-monitor .find-editorial-wrapper h1 {
    max-width: 980px !important;
    font-size: clamp(34px, 4vw, 54px) !important;
}

body.category-find-monitor .find-editorial-article,
body.category-find-monitor .find-editorial-faq {
    max-width: 100% !important;
}

body.category-find-monitor .find-editorial-article p,
body.category-find-monitor .find-editorial-faq .faq-content p {
    max-width: 980px !important;
}

body.category-find-monitor .find-editorial-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body.category-find-monitor .find-usecase-table-wrap {
    width: 100% !important;
    margin: 24px 0 44px !important;
    overflow-x: auto !important;
    border: 1px solid rgba(15, 118, 110, .14) !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 22px 58px rgba(16, 35, 45, .08) !important;
}

body.category-find-monitor .find-usecase-table {
    width: 100% !important;
    min-width: 820px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    color: #334155 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
}

body.category-find-monitor .find-usecase-table thead th {
    padding: 18px 20px !important;
    background:
        linear-gradient(135deg, rgba(15, 118, 110, .10), rgba(255, 107, 74, .07)) !important;
    color: #102027 !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    text-align: left !important;
    border-bottom: 1px solid rgba(15, 118, 110, .14) !important;
}

body.category-find-monitor .find-usecase-table th,
body.category-find-monitor .find-usecase-table td {
    padding: 18px 20px !important;
    vertical-align: top !important;
    border-bottom: 1px solid rgba(15, 118, 110, .10) !important;
}

body.category-find-monitor .find-usecase-table tbody th {
    width: 24% !important;
    color: #0f766e !important;
    font-weight: 950 !important;
    text-align: left !important;
    background: rgba(15, 118, 110, .035) !important;
}

body.category-find-monitor .find-usecase-table tbody td:nth-child(2) {
    width: 42% !important;
}

body.category-find-monitor .find-usecase-table tbody td:nth-child(3) {
    width: 34% !important;
    color: #475569 !important;
}

body.category-find-monitor .find-usecase-table tbody tr:last-child th,
body.category-find-monitor .find-usecase-table tbody tr:last-child td {
    border-bottom: 0 !important;
}

body.category-find-monitor .find-usecase-table tbody tr:hover th,
body.category-find-monitor .find-usecase-table tbody tr:hover td {
    background-color: rgba(255, 253, 248, .92) !important;
}

body.category-find-monitor .find-editorial-faq .faq-item {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid rgba(15, 118, 110, .12) !important;
    border-radius: 18px !important;
}

body.category-find-monitor .find-editorial-faq .faq-summary {
    list-style: none !important;
    position: relative !important;
    padding: 20px 58px 20px 22px !important;
    color: #102027 !important;
}

body.category-find-monitor .find-editorial-faq .faq-summary::-webkit-details-marker,
body.category-find-monitor .find-editorial-faq .faq-summary::marker {
    display: none !important;
    content: "" !important;
}

body.category-find-monitor .find-editorial-faq .faq-summary::after {
    content: "+" !important;
    position: absolute !important;
    right: 20px !important;
    top: 50% !important;
    width: 28px !important;
    height: 28px !important;
    display: grid !important;
    place-items: center !important;
    transform: translateY(-50%) !important;
    border-radius: 999px !important;
    background: rgba(15, 118, 110, .10) !important;
    color: #0f766e !important;
    font-size: 20px !important;
    font-weight: 900 !important;
}

body.category-find-monitor .find-editorial-faq details[open] .faq-summary::after {
    content: "-" !important;
    background: #0f766e !important;
    color: #ffffff !important;
}

@media (max-width: 1180px) {
    body.category-find-monitor .find-monitor-layout {
        grid-template-columns: 1fr !important;
    }

    body.category-find-monitor .amz-sidebar {
        position: relative !important;
        top: auto !important;
        max-height: none !important;
    }

    body.category-find-monitor #ms-engine-results {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    body.category-find-monitor .find-monitor-layout,
    body.category-find-monitor .find-editorial-wrapper,
    body.category-find-monitor .seo-content-wrapper.find-editorial-wrapper {
        width: min(100%, calc(100vw - 28px)) !important;
    }

    body.category-find-monitor .find-monitor-main,
    body.category-find-monitor .find-editorial-section {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    body.category-find-monitor #ms-engine-results,
    body.category-find-monitor .find-editorial-list {
        grid-template-columns: 1fr !important;
    }
}


/* =============================================================
   MonitorSuggest safety repair v4 - readable inner pages + empty states
   Scoped to templates/archives so global header/homepage styling is untouched.
   ============================================================= */
.archive .page-header h1,
.archive .page-header p { color: #102027 !important; }
.archive main .glass-panel,
.archive main .glass-panel h3,
.archive main .glass-panel p { color: #102027 !important; }
.ms-empty, .ms-empty-state { color: #64748b; }
.page-template-page-refresh-rate main > div > h2,
.page-template-page-buying-guide main > div > h2,
.page-template-page-ppi-calculator main > div > h2 { color: #102027 !important; }
.page-template-page-refresh-rate main > div > p,
.page-template-page-buying-guide main > div > p,
.page-template-page-ppi-calculator main > div > p { color: #475569 !important; }
@media (max-width: 768px) {
  .ms-global-card { max-width: 100%; }
}

/* =============================================================
   V10 scoped UI polish: compact monitor feedback cards + wider header
   Notes: CSS-only update. No Finder/Compare/Currency/PHP logic changed.
   ============================================================= */

/* Slightly wider desktop header without changing menu logic. */
@media (min-width: 1181px) {
  .ms-header .ms-nav-container,
  #ms-header .ms-nav-container {
    max-width: min(1760px, calc(100vw - 44px)) !important;
    padding-left: clamp(22px, 2.1vw, 42px) !important;
    padding-right: clamp(22px, 2.1vw, 42px) !important;
  }
}

/* Keep product cards balanced after voting/rating controls were added. */
.ms-global-card {
  height: 100% !important;
}

.ms-global-card .ms-card-footer {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  align-items: stretch !important;
  padding: 14px 18px 18px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,253,248,.92)) !important;
  border-top: 1px solid rgba(20,45,50,.08) !important;
}

/* Card-context feedback: compact, no oversized white box. */
.ms-global-card .ms-monitor-feedback-card,
.ms-global-card .ms-monitor-feedback.ms-monitor-feedback-card {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  gap: 8px !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-vote-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 7px !important;
  width: 100% !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-vote-btn {
  min-width: 0 !important;
  width: 100% !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 7px 9px !important;
  gap: 5px !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(15,118,110,.14) !important;
  color: #1f2a44 !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-like-btn.is-selected,
.ms-global-card .ms-monitor-feedback-card .ms-like-btn.voted {
  background: rgba(16,185,129,.14) !important;
  border-color: rgba(16,185,129,.34) !important;
  color: #065f46 !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-dislike-btn.is-selected,
.ms-global-card .ms-monitor-feedback-card .ms-dislike-btn.voted {
  background: rgba(239,68,68,.11) !important;
  border-color: rgba(239,68,68,.30) !important;
  color: #991b1b !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-vote-icon {
  font-size: 12px !important;
  line-height: 1 !important;
}

.ms-global-card .ms-monitor-feedback-card .v-count {
  margin-left: auto !important;
  padding-left: 4px !important;
  font-variant-numeric: tabular-nums !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-user-star-rate {
  margin: 0 !important;
  padding: 8px 9px !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
  width: 100% !important;
  border: 1px solid rgba(15,118,110,.12) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.72) !important;
  overflow: hidden !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-rate-label {
  flex: 0 0 auto !important;
  margin: 0 4px 0 0 !important;
  color: #64748b !important;
  font-size: 10.5px !important;
  font-weight: 950 !important;
  letter-spacing: .02em !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-rate-star {
  flex: 0 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #cbd5e1 !important;
  font-size: 17px !important;
  line-height: 1 !important;
  min-width: 15px !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-rate-star:hover,
.ms-global-card .ms-monitor-feedback-card .ms-rate-star.is-selected {
  color: #f59e0b !important;
}

.ms-global-card .ms-monitor-feedback-card .ms-rating-count-note {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin-left: 5px !important;
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Hide long country sentence inside compact cards; country is still stored by the engine. */
.ms-global-card .ms-monitor-feedback-card .ms-feedback-country-note {
  display: none !important;
}

.ms-global-card .ms-card-footer .ms-amazon-btn {
  width: 100% !important;
  min-height: 42px !important;
  padding: 10px 14px !important;
  border-radius: 12px !important;
  justify-self: stretch !important;
}

@media (min-width: 1280px) {
  .ms-global-card .ms-card-footer {
    grid-template-columns: minmax(0, 1fr) minmax(120px, .72fr) !important;
    align-items: center !important;
  }

  .ms-global-card .ms-monitor-feedback-card {
    gap: 7px !important;
  }
}

@media (max-width: 720px) {
  .ms-global-card .ms-card-footer {
    grid-template-columns: 1fr !important;
  }
}

/* Global important note above footer */
.ms-global-important-note {
    padding: clamp(24px, 4vw, 48px) 0 clamp(18px, 3vw, 34px);
    background:
        radial-gradient(circle at 12% 15%, rgba(20, 184, 166, 0.12), transparent 34%),
        radial-gradient(circle at 88% 12%, rgba(168, 85, 247, 0.10), transparent 32%),
        linear-gradient(180deg, rgba(248, 250, 252, 0.24), rgba(255, 255, 255, 0.72));
}

.ms-global-important-note__card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 26px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(240, 253, 250, 0.78)),
        linear-gradient(90deg, rgba(13, 148, 136, 0.08), rgba(168, 85, 247, 0.08));
    box-shadow: 0 20px 55px rgba(15, 23, 42, 0.08);
    padding: clamp(20px, 3vw, 32px);
}

.ms-global-important-note__card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, #0f9f8f, #8b5cf6, #f59e0b);
}

.ms-global-important-note__label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(13, 148, 136, 0.10);
    color: #0f766e;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ms-global-important-note__label::before {
    content: "!";
    display: inline-grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #0f9f8f;
    color: #fff;
    font-size: 0.72rem;
    line-height: 1;
}

.ms-global-important-note__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(14px, 2vw, 20px);
}

.ms-global-important-note__item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: start;
    border: 1px solid rgba(15, 23, 42, 0.07);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.72);
    padding: 16px 18px;
}

.ms-global-important-note__num {
    display: inline-grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0f9f8f, #14b8a6);
    color: #fff;
    font-size: 0.86rem;
    font-weight: 900;
    box-shadow: 0 10px 22px rgba(15, 159, 143, 0.24);
}

.ms-global-important-note__item p {
    margin: 0;
    color: #475569;
    font-size: 0.95rem;
    line-height: 1.7;
}

@media (max-width: 768px) {
    .ms-global-important-note__grid {
        grid-template-columns: 1fr;
    }

    .ms-global-important-note__item {
        padding: 14px 15px;
    }
}


/* =============================================================
   v12 Footer legal links + editable legal pages
   Scoped additions only. Existing engines, cards and layouts are untouched.
   ============================================================= */
.ms-site-footer--legal-only {
    padding: 56px 0 28px !important;
    margin-top: 48px !important;
}

.ms-footer-legal-shell {
    display: grid;
    grid-template-columns: minmax(260px, 0.9fr) minmax(320px, 1.6fr);
    gap: 34px;
    align-items: start;
    padding-bottom: 28px;
    border-bottom: 1px solid rgba(15, 23, 42, .08);
}

.ms-footer-brand--legal {
    padding-right: 0 !important;
}

.ms-footer-legal-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.ms-footer-legal-nav a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 8px 13px;
    border-radius: 999px;
    border: 1px solid rgba(20, 184, 166, .18);
    background: rgba(255, 255, 255, .72);
    color: #475569 !important;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .04);
    transition: transform .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.ms-footer-legal-nav a:hover {
    color: #0f766e !important;
    border-color: rgba(20, 184, 166, .38);
    box-shadow: 0 14px 30px rgba(20, 184, 166, .10);
    transform: translateY(-1px);
}

.ms-legal-page {
    background:
        radial-gradient(circle at 6% 12%, rgba(20, 184, 166, .10), transparent 30%),
        radial-gradient(circle at 92% 18%, rgba(168, 85, 247, .10), transparent 28%),
        linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.ms-legal-hero {
    padding: 92px 0 34px;
}

.ms-legal-hero__inner {
    max-width: 1120px;
}

.ms-legal-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(20, 184, 166, .10);
    color: #0f766e;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .10em;
    text-transform: uppercase;
}

.ms-legal-hero h1 {
    margin: 0;
    color: #0f172a;
    font-size: clamp(38px, 5vw, 68px);
    line-height: .98;
    letter-spacing: -.055em;
}

.ms-legal-hero p {
    max-width: 700px;
    margin: 18px 0 0;
    color: #64748b;
    font-size: 17px;
    line-height: 1.7;
}

.ms-legal-wrap {
    padding: 24px 0 64px;
}

.ms-legal-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 28px;
    align-items: start;
}

.ms-legal-card,
.ms-legal-side-card {
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 28px;
    background: rgba(255, 255, 255, .86);
    box-shadow: 0 22px 60px rgba(15, 23, 42, .08);
    backdrop-filter: blur(12px);
}

.ms-legal-card {
    padding: clamp(26px, 4vw, 54px);
}

.ms-legal-content {
    color: #334155;
    font-size: 16px;
    line-height: 1.82;
}

.ms-legal-content .ms-legal-lead {
    margin-top: 0;
    padding: 22px 24px;
    border-left: 4px solid #14b8a6;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(20, 184, 166, .10), rgba(168, 85, 247, .07));
    color: #1e293b;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.7;
}

.ms-legal-content h2 {
    margin: 34px 0 12px;
    color: #0f172a;
    font-size: 23px;
    line-height: 1.25;
    letter-spacing: -.025em;
}

.ms-legal-content p {
    margin: 0 0 18px;
}

.ms-legal-content a,
.ms-legal-card a {
    color: #0f766e;
    font-weight: 700;
    text-decoration: none;
}

.ms-legal-content a:hover,
.ms-legal-card a:hover {
    text-decoration: underline;
}

.ms-legal-updated {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 12px;
    margin-top: 42px;
    padding-top: 22px;
    border-top: 1px solid rgba(15, 23, 42, .09);
    color: #64748b;
    font-size: 13px;
}

.ms-legal-sidebar {
    position: sticky;
    top: 92px;
    display: grid;
    gap: 18px;
}

.ms-legal-side-card {
    padding: 22px;
}

.ms-legal-side-card h2 {
    margin: 0 0 15px;
    color: #0f172a;
    font-size: 16px;
    letter-spacing: -.02em;
}

.ms-legal-side-card ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 9px;
}

.ms-legal-side-card li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    border-radius: 13px;
    background: #f8fafc;
    color: #334155;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

.ms-legal-side-card li a:hover {
    background: rgba(20, 184, 166, .10);
    color: #0f766e;
}

.ms-legal-side-card--note {
    background: linear-gradient(135deg, rgba(255, 247, 237, .92), rgba(240, 253, 250, .92));
}

.ms-legal-side-card--note p {
    margin: 0;
    color: #475569;
    font-size: 14px;
    line-height: 1.7;
}

@media (max-width: 980px) {
    .ms-footer-legal-shell,
    .ms-legal-layout {
        grid-template-columns: 1fr;
    }

    .ms-footer-legal-nav {
        justify-content: flex-start;
    }

    .ms-legal-sidebar {
        position: static;
    }
}

@media (max-width: 620px) {
    .ms-footer-legal-nav a {
        width: 100%;
        justify-content: center;
    }

    .ms-legal-hero {
        padding-top: 72px;
    }

    .ms-legal-card {
        border-radius: 22px;
    }
}

/* v13 backend sync polish: slightly larger header menu text and full footer nav */
@media (min-width: 1025px) {
    .ms-primary-nav > .ms-nav-list > .menu-item > a,
    .ms-primary-nav > .ms-nav-list > .ms-nav-item > a,
    #ms-primary-nav .ms-nav-link {
        font-size: 13.8px !important;
        letter-spacing: -0.01em;
    }
    .ms-primary-nav .sub-menu .menu-item a,
    .ms-primary-nav .sub-menu > .menu-item > a {
        font-size: 13px !important;
    }
}

.ms-site-footer--full-sync {
    background: #f8fafc !important;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    padding: 58px 0 26px !important;
    color: #334155 !important;
}

.ms-footer-sync-grid {
    display: grid;
    grid-template-columns: minmax(260px, 1.25fr) repeat(3, minmax(180px, 1fr));
    gap: 34px;
    align-items: start;
}

.ms-footer-brand--sync {
    max-width: 420px;
}

.ms-footer-brand--sync .ms-footer-logo,
.ms-site-footer--full-sync .ms-footer-logo {
    color: #102027 !important;
    margin: 0 0 14px;
    font-size: 24px;
    line-height: 1.1;
}

.ms-site-footer--full-sync .ms-footer-desc {
    color: #64748b !important;
    font-size: 14px;
    line-height: 1.75;
    margin: 0 0 18px;
}

.ms-footer-join {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 18px;
    border-radius: 999px;
    background: linear-gradient(135deg, #0f9b8e, #0b7f74);
    color: #fff !important;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 12px 26px rgba(15, 155, 142, 0.18);
}

.ms-footer-link-group {
    display: grid;
    gap: 10px;
}

.ms-footer-link-group h4 {
    margin: 0 0 10px;
    color: #102027 !important;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 900;
}

.ms-footer-link-group a {
    color: #475569 !important;
    text-decoration: none;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 650;
    transition: color .18s ease, transform .18s ease;
}

.ms-footer-link-group a:hover {
    color: #0f766e !important;
    transform: translateX(3px);
}

.ms-footer-bottom--sync {
    margin-top: 42px;
    padding-top: 22px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.ms-footer-bottom--sync p {
    margin: 0;
    color: #64748b !important;
    font-size: 13px;
}

@media (max-width: 980px) {
    .ms-footer-sync-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .ms-footer-brand--sync {
        grid-column: 1 / -1;
    }
}

@media (max-width: 640px) {
    .ms-footer-sync-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .ms-footer-bottom--sync {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* v14: country-wise marketplace buttons + admin-synced brand insights */
.ms-store-offer-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    min-width: 150px;
}
.ms-store-offer-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    border: 1px solid rgba(245, 158, 11, .35);
    border-radius: 12px;
    background: linear-gradient(135deg, #f59e0b, #fbbf24);
    color: #1f2937;
    text-decoration: none;
    font-weight: 900;
    padding: 10px 12px;
    line-height: 1.1;
    box-shadow: 0 10px 24px rgba(245, 158, 11, .18);
}
.ms-store-offer-btn span { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.ms-store-offer-btn strong { font-size: 12px; }
.ms-store-offer-btn:hover { transform: translateY(-1px); color: #111827; text-decoration: none; }
@media (max-width: 760px) {
    .ms-store-offer-list { width: 100%; }
    .ms-store-offer-btn { min-height: 42px; }
}

/* v15: bottom affiliate disclosure note */
.ms-footer-affiliate-disclaimer {
    margin-top: 18px;
    padding: 16px 18px;
    border-radius: 18px;
    border: 1px solid rgba(15, 118, 110, 0.14);
    background: linear-gradient(135deg, rgba(240, 253, 250, 0.92), rgba(255, 251, 235, 0.92));
    color: #475569 !important;
    font-size: 12.5px;
    line-height: 1.65;
    box-shadow: 0 12px 34px rgba(15, 23, 42, 0.05);
}
.ms-footer-affiliate-disclaimer strong {
    color: #0f766e !important;
    font-weight: 900;
}
@media (max-width: 640px) {
    .ms-footer-affiliate-disclaimer {
        font-size: 12px;
        padding: 14px;
        border-radius: 16px;
    }
}

/* === MonitorSuggest v16 Intelligence Layer === */
.ms-v16-template-wrap{background:linear-gradient(180deg,#f8fbff 0%,#ffffff 42%,#f7fafc 100%);}
.ms-v16-page{max-width:1240px;margin:0 auto;padding:42px 20px 64px;color:#0f172a;}
.ms-v16-hero{background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(238,251,247,.96));border:1px solid rgba(15,118,110,.13);box-shadow:0 18px 50px rgba(15,23,42,.08);border-radius:30px;padding:42px;margin:0 0 28px;}
.ms-v16-hero span,.ms-v16-section-head span{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:7px 12px;background:#ecfdf5;color:#047857;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.08em;}
.ms-v16-hero h1{font-size:clamp(32px,5vw,58px);line-height:1.02;margin:16px 0 14px;color:#0f172a;letter-spacing:-.04em;}
.ms-v16-hero p{max-width:860px;color:#475569;font-size:17px;line-height:1.75;margin:0;}
.ms-v16-metrics-grid,.ms-v16-country-columns,.ms-v16-alt-grid,.ms-v16-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:24px 0;}
.ms-v16-metrics-grid article,.ms-v16-panel,.ms-v16-alt-card,.ms-v16-review-box,.ms-v16-approved-reviews{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:24px;padding:24px;box-shadow:0 14px 36px rgba(15,23,42,.07);}
.ms-v16-metrics-grid article span,.ms-v16-alt-card span{color:#64748b;font-size:12px;text-transform:uppercase;font-weight:800;letter-spacing:.07em;}
.ms-v16-metrics-grid article strong{display:block;font-size:30px;color:#0f172a;margin:8px 0;}
.ms-v16-metrics-grid article p,.ms-v16-panel p,.ms-v16-alt-card p{color:#526173;line-height:1.65;margin:.4rem 0 0;}
.ms-v16-section-head{margin:18px 0 18px;}
.ms-v16-section-head h2{font-size:clamp(26px,3vw,38px);margin:12px 0 8px;color:#0f172a;letter-spacing:-.03em;}
.ms-v16-section-head p{color:#526173;max-width:840px;line-height:1.7;}
.ms-v16-table{width:100%;border-collapse:collapse;background:#fff;min-width:760px;}
.ms-v16-table th,.ms-v16-table td{padding:14px 16px;border-bottom:1px solid rgba(15,23,42,.08);text-align:left;color:#334155;}
.ms-v16-table th{background:#f8fafc;color:#0f172a;font-weight:800;}
.ms-v16-brand-table-wrap{overflow:auto;border-radius:18px;border:1px solid rgba(15,23,42,.08);}
.ms-v16-leader-list{display:grid;gap:10px;padding-left:22px;margin:14px 0 0;}
.ms-v16-leader-list li{padding:10px 0;border-bottom:1px solid rgba(15,23,42,.07);}
.ms-v16-leader-list a{font-weight:800;color:#0f172a;text-decoration:none;}
.ms-v16-leader-list span{display:block;color:#64748b;font-size:13px;margin-top:4px;}
.ms-mri-badge{display:flex;align-items:center;justify-content:space-between;gap:10px;border-radius:14px;padding:9px 12px;margin:10px 0;background:linear-gradient(135deg,#eef2ff,#ecfdf5);border:1px solid rgba(79,70,229,.12);color:#0f172a;font-size:12px;}
.ms-mri-badge span{font-weight:900;letter-spacing:.08em;color:#4f46e5;}
.ms-mri-badge strong{font-size:14px;color:#0f172a;}
.ms-v16-review-form{display:grid;gap:14px;margin-top:18px;}
.ms-v16-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;}
.ms-v16-review-form label{display:grid;gap:7px;font-weight:800;color:#0f172a;}
.ms-v16-review-form input,.ms-v16-review-form select,.ms-v16-review-form textarea{width:100%;border:1px solid rgba(15,23,42,.14);border-radius:14px;padding:12px 14px;background:#fff;color:#0f172a;font:inherit;}
.ms-v16-submit{border:0;border-radius:999px;padding:13px 18px;background:linear-gradient(135deg,#14b8a6,#22c55e);color:#fff;font-weight:900;cursor:pointer;justify-self:start;box-shadow:0 10px 24px rgba(20,184,166,.22);}
.ms-v16-form-note,.ms-v16-review-status{color:#64748b;font-size:13px;line-height:1.6;}
.ms-v16-review-list{display:grid;gap:14px;margin-top:14px;}
.ms-v16-review-card{background:#f8fafc;border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:16px;}
.ms-v16-review-card div{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;color:#64748b;font-size:13px;margin-bottom:8px;}
.ms-v16-review-card strong{color:#0f172a;}
.ms-v16-review-card p{margin:8px 0;color:#475569;line-height:1.6;}
.ms-empty-note{color:#64748b;background:#f8fafc;border:1px dashed rgba(15,23,42,.16);padding:16px;border-radius:16px;}
@media(max-width:680px){.ms-v16-page{padding:24px 14px 42px}.ms-v16-hero{padding:26px;border-radius:22px}.ms-v16-metrics-grid,.ms-v16-country-columns,.ms-v16-alt-grid{grid-template-columns:1fr}.ms-v16-submit{width:100%;}}

/* === MonitorSuggest v17 Country Automation + Trust Page Polish === */
.ms-v17-country-hero .ms-v17-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.ms-v17-country-hero .ms-v17-hero-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;border-radius:999px;background:linear-gradient(135deg,#0f766e,#14b8a6);color:#fff;text-decoration:none;font-weight:900;box-shadow:0 12px 26px rgba(20,184,166,.18)}
.ms-v17-country-hero .ms-v17-hero-actions a:nth-child(2){background:#fff;color:#0f766e;border:1px solid rgba(15,118,110,.18);box-shadow:none}
.ms-v17-automation-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin:24px 0}
.ms-v17-automation-strip article{background:linear-gradient(135deg,#fff,#f8fafc);border:1px solid rgba(15,23,42,.08);border-radius:22px;padding:20px;box-shadow:0 14px 34px rgba(15,23,42,.06)}
.ms-v17-automation-strip span{display:block;color:#64748b;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.07em}
.ms-v17-automation-strip strong{display:block;margin:8px 0 4px;color:#0f172a;font-size:34px;letter-spacing:-.04em}
.ms-v17-automation-strip p{margin:0;color:#526173;line-height:1.55;font-size:13px}
.ms-v17-panel{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:26px;padding:26px;margin:24px 0;box-shadow:0 14px 38px rgba(15,23,42,.07)}
.ms-v17-section-head span{display:inline-flex;align-items:center;border-radius:999px;padding:7px 12px;background:#ecfdf5;color:#047857;font-weight:900;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.ms-v17-section-head h2{font-size:clamp(24px,3vw,38px);letter-spacing:-.03em;line-height:1.12;margin:12px 0 8px;color:#0f172a}
.ms-v17-section-head p{max-width:900px;color:#526173;line-height:1.75;margin:0}
.ms-v17-store-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-top:18px}
.ms-v17-store-grid article{border:1px solid rgba(15,118,110,.12);background:linear-gradient(135deg,#f0fdfa,#fff);border-radius:18px;padding:16px}
.ms-v17-store-grid strong{display:block;color:#0f172a;font-size:16px}.ms-v17-store-grid span{display:block;color:#64748b;margin-top:4px;font-size:13px}
.ms-v17-copy-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:18px;margin-top:18px}
.ms-v17-copy-grid article,.ms-v17-admin-notes article{background:#f8fafc;border:1px solid rgba(15,23,42,.07);border-radius:20px;padding:20px}
.ms-v17-copy-grid h3,.ms-v17-admin-notes h3{margin:0 0 8px;color:#0f172a;font-size:18px;letter-spacing:-.02em}
.ms-v17-copy-grid p,.ms-v17-admin-notes p{margin:0;color:#475569;line-height:1.74}
.ms-v17-editor-note,.ms-v17-safe-note{margin:18px 0;padding:18px;border-radius:20px;background:linear-gradient(135deg,#fff7ed,#f0fdfa);border:1px solid rgba(245,158,11,.18);color:#475569;line-height:1.7}
.ms-v17-editor-note strong,.ms-v17-safe-note strong{color:#0f766e}.ms-v17-editor-note p{margin:.4rem 0 0}
.ms-v17-admin-notes{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-top:18px}
.ms-v17-faq-list{display:grid;gap:12px;margin-top:18px}.ms-v17-faq-list details{border:1px solid rgba(15,23,42,.08);border-radius:18px;background:#f8fafc;overflow:hidden}.ms-v17-faq-list summary{cursor:pointer;padding:16px 18px;font-weight:900;color:#0f172a}.ms-v17-faq-list p{padding:0 18px 18px;margin:0;color:#475569;line-height:1.7}.ms-v17-faq-list details[open]{background:#fff;box-shadow:0 12px 28px rgba(15,23,42,.06)}
.ms-v17-brand-performance .ms-v16-table th,.ms-v17-brand-performance .ms-v16-table td{white-space:nowrap}
@media(max-width:640px){.ms-v17-panel{padding:20px;border-radius:22px}.ms-v17-copy-grid{grid-template-columns:1fr}.ms-v17-country-hero .ms-v17-hero-actions a{width:100%}}

/* === MonitorSuggest v18: synced homepage hero + universal monitor card polish === */
#ms-hero.ms-hero-v2 {
    padding: 92px 0 74px !important;
    background:
        radial-gradient(circle at 12% 12%, rgba(255, 237, 213, .72), transparent 28%),
        radial-gradient(circle at 90% 20%, rgba(204, 251, 241, .74), transparent 34%),
        linear-gradient(180deg, #fffdf8 0%, #f9fffc 100%) !important;
}
#ms-hero .ms-hero-v2__inner {
    max-width: 1480px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(440px, .95fr) !important;
    gap: 34px !important;
    align-items: stretch !important;
    padding: 48px !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    border-radius: 34px !important;
    background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(245,253,250,.88)) !important;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .09) !important;
}
#ms-hero .ms-hero-v2__copy { align-self: center !important; }
#ms-hero .ms-hero-v2__title {
    max-width: 700px !important;
    font-size: clamp(44px, 5.2vw, 84px) !important;
    letter-spacing: -.055em !important;
}
#ms-hero .ms-hero-v2__desc {
    max-width: 650px !important;
    color: #334155 !important;
    font-size: clamp(17px, 1.4vw, 22px) !important;
    line-height: 1.55 !important;
    font-weight: 650 !important;
}
#ms-hero .ms-hero-feature-strip {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px !important;
    max-width: 760px !important;
}
#ms-hero .ms-hero-feature {
    min-height: 132px !important;
    padding: 18px 16px !important;
    border-radius: 20px !important;
    background: rgba(255,255,255,.88) !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    box-shadow: 0 12px 34px rgba(15, 23, 42, .06) !important;
}
#ms-hero .ms-hero-v2__visual {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 170px !important;
    gap: 18px !important;
    align-items: stretch !important;
}
#ms-hero .ms-hero-preview,
#ms-hero .ms-hero-trust {
    height: 100% !important;
    border-radius: 26px !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    background: rgba(255,255,255,.9) !important;
    box-shadow: 0 18px 50px rgba(15, 23, 42, .08) !important;
}
#ms-hero .ms-hero-preview__cards {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
}
#ms-hero .ms-hero-monitor-card {
    min-width: 0 !important;
    border-radius: 18px !important;
    background: linear-gradient(180deg, #fff, #f8fafc) !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .05) !important;
}
#ms-hero .ms-hero-monitor-card strong,
#ms-hero .ms-hero-monitor-card span,
#ms-hero .ms-hero-monitor-card p { overflow-wrap: anywhere !important; }
#ms-hero .ms-hero-preview__scores {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
}
#ms-hero .ms-hero-trust {
    display: grid !important;
    grid-template-rows: repeat(3, auto) 1fr !important;
    align-content: start !important;
    padding: 18px !important;
}
#ms-hero .ms-hero-trust__metric {
    border-radius: 18px !important;
    padding: 18px !important;
    background: #fff !important;
    border: 1px solid rgba(15, 23, 42, .06) !important;
}
#ms-hero .ms-hero-trust__metric strong {
    color: #0f172a !important;
    font-size: 34px !important;
    line-height: 1 !important;
}
#ms-hero .ms-hero-trust__metric span { color: #64748b !important; }
#ms-hero .ms-hero-trust__brands {
    align-self: end !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}
#ms-hero .ms-hero-trust__brands span {
    flex: 1 1 68px !important;
    min-width: 0 !important;
    text-align: center !important;
    border-radius: 999px !important;
    padding: 8px 10px !important;
    background: #fff !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.ms-monitor-grid .ms-global-card,
.ms-results-grid .ms-global-card,
.ms-trending-grid .ms-global-card,
.ms-section .ms-global-card,
.ms-global-card {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    overflow: hidden !important;
    border-radius: 24px !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    background: rgba(255,255,255,.94) !important;
    box-shadow: 0 18px 48px rgba(15, 23, 42, .08) !important;
}
.ms-global-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 28px 70px rgba(15, 23, 42, .12) !important;
}
.ms-global-card .ms-card-media {
    margin: 18px 18px 0 !important;
    min-height: 180px !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    border: 1px solid rgba(15, 23, 42, .10) !important;
    background: linear-gradient(135deg, #f8fffb, #fff7ed) !important;
}
.ms-global-card .ms-card-body {
    padding: 16px 18px 18px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    flex: 1 1 auto !important;
}
.ms-global-card .ms-card-title {
    margin: 0 !important;
    min-height: 46px !important;
    font-size: 18px !important;
    line-height: 1.26 !important;
    letter-spacing: -.02em !important;
}
.ms-global-card .ms-card-title a {
    color: #102027 !important;
    text-decoration: none !important;
}
.ms-global-card .ms-card-rating-row,
.ms-global-card .ms-card-specs,
.ms-global-card .ms-card-rating-breakdown,
.ms-global-card .ms-card-actions,
.ms-global-card .ms-card-footer {
    min-width: 0 !important;
}
.ms-global-card .ms-card-specs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
}
.ms-global-card .ms-card-specs span {
    max-width: 100% !important;
    border-radius: 999px !important;
    padding: 6px 10px !important;
    background: #eef8f7 !important;
    border: 1px solid rgba(15, 118, 110, .13) !important;
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}
.ms-global-card .ms-card-rating-breakdown {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
}
.ms-global-card .ms-card-rating-breakdown span {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    min-width: 0 !important;
    border-radius: 10px !important;
    padding: 7px 9px !important;
    background: #f7fbfa !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    color: #475569 !important;
    font-size: 11.5px !important;
    font-weight: 900 !important;
}
.ms-global-card .ms-card-rating-breakdown b { color: #0f766e !important; }
.ms-global-card .ms-card-price {
    color: #0f172a !important;
    font-size: 24px !important;
    font-weight: 950 !important;
    letter-spacing: -.03em !important;
}
.ms-global-card .ms-card-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: auto !important;
}
.ms-global-card .ms-card-secondary,
.ms-global-card .ms-card-compare {
    min-height: 42px !important;
    padding: 0 12px !important;
    border-radius: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
    font-size: 12.5px !important;
    font-weight: 900 !important;
}
.ms-global-card .ms-card-footer {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 12px 18px 18px !important;
    background: linear-gradient(180deg, rgba(248,250,252,.46), rgba(255,251,235,.42)) !important;
    border-top: 1px solid rgba(15, 23, 42, .07) !important;
}
.ms-global-card .ms-monitor-feedback-card,
.ms-global-card .ms-monitor-feedback.ms-monitor-feedback-card {
    width: 100% !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
.ms-global-card .ms-monitor-feedback-card .ms-vote-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin: 0 0 8px !important;
}
.ms-global-card .ms-monitor-feedback-card .ms-vote-btn {
    min-width: 0 !important;
    width: 100% !important;
    min-height: 34px !important;
    padding: 7px 8px !important;
    border-radius: 10px !important;
    justify-content: center !important;
    gap: 5px !important;
    font-size: 11.5px !important;
    line-height: 1 !important;
    background: #fff !important;
    color: #0f172a !important;
    border: 1px solid rgba(15, 23, 42, .10) !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .04) !important;
}
.ms-global-card .ms-monitor-feedback-card .ms-vote-btn.is-selected,
.ms-global-card .ms-monitor-feedback-card .ms-vote-btn.voted {
    background: #0f766e !important;
    border-color: #0f766e !important;
    color: #fff !important;
}
.ms-global-card .ms-monitor-feedback-card .ms-vote-icon { font-size: 13px !important; }
.ms-global-card .ms-monitor-feedback-card .v-count {
    min-width: 18px !important;
    padding: 2px 5px !important;
    border-radius: 999px !important;
    background: rgba(15, 23, 42, .06) !important;
    color: inherit !important;
    font-size: 11px !important;
}
.ms-global-card .ms-monitor-feedback-card .ms-user-star-rate {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
    margin: 0 !important;
    padding: 7px 9px !important;
    border-radius: 10px !important;
    background: #fff !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
}
.ms-global-card .ms-monitor-feedback-card .ms-rate-label {
    flex: 0 0 auto !important;
    margin: 0 3px 0 0 !important;
    color: #64748b !important;
    font-size: 10.5px !important;
    letter-spacing: .04em !important;
}
.ms-global-card .ms-monitor-feedback-card .ms-rate-star {
    padding: 0 !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 16px !important;
    line-height: 18px !important;
    color: #cbd5e1 !important;
}
.ms-global-card .ms-monitor-feedback-card .ms-rate-star:hover,
.ms-global-card .ms-monitor-feedback-card .ms-rate-star.is-selected { color: #f59e0b !important; }
.ms-global-card .ms-monitor-feedback-card .ms-rating-count-note {
    margin-left: auto !important;
    font-size: 11px !important;
    color: #64748b !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 110px !important;
}
.ms-global-card .ms-monitor-feedback-card .ms-feedback-country-note { display: none !important; }
.ms-global-card .ms-store-offer-list {
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    gap: 8px !important;
}
.ms-global-card .ms-store-offer-btn,
.ms-global-card .ms-card-footer .ms-amazon-btn,
.ms-global-card a.ms-amazon-btn,
.ms-global-card a[href*="amazon."],
.ms-global-card a[href*="amzn.to"] {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    border-radius: 12px !important;
    padding: 9px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    text-align: center !important;
    background: linear-gradient(135deg, #f59e0b, #fbbf24) !important;
    color: #111827 !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    box-shadow: 0 12px 24px rgba(245, 158, 11, .18) !important;
}
.ms-global-card .ms-card-footer .ms-amazon-btn span,
.ms-global-card .ms-card-footer .ms-amazon-btn strong,
.ms-global-card .ms-store-offer-btn span,
.ms-global-card .ms-store-offer-btn strong {
    display: inline !important;
    font-size: inherit !important;
    line-height: 1.1 !important;
}
.ms-global-card .ms-card-rating-row { gap: 4px !important; flex-wrap: wrap !important; }
.ms-global-card .ms-rating-value,
.ms-global-card .ms-rating-vote-total { font-size: 12px !important; }

@media (min-width: 1200px) {
    .ms-results-grid,
    .ms-trending-grid,
    .ms-monitor-grid {
        align-items: stretch !important;
    }
}
@media (max-width: 1180px) {
    #ms-hero .ms-hero-v2__inner { grid-template-columns: 1fr !important; padding: 34px !important; }
    #ms-hero .ms-hero-v2__visual { grid-template-columns: 1fr !important; }
    #ms-hero .ms-hero-trust { grid-template-columns: repeat(3, minmax(0,1fr)) !important; grid-template-rows: auto auto !important; }
    #ms-hero .ms-hero-trust__brands { grid-column: 1 / -1 !important; }
}
@media (max-width: 760px) {
    #ms-hero.ms-hero-v2 { padding: 42px 0 !important; }
    #ms-hero .ms-hero-v2__inner { padding: 22px !important; border-radius: 24px !important; }
    #ms-hero .ms-hero-feature-strip,
    #ms-hero .ms-hero-preview__cards,
    #ms-hero .ms-hero-preview__scores,
    #ms-hero .ms-hero-trust { grid-template-columns: 1fr !important; }
    #ms-hero .ms-hero-v2__actions { flex-direction: column !important; }
    #ms-hero .ms-hero-v2__btn { width: 100% !important; }
    .ms-global-card .ms-card-media { min-height: 150px !important; }
    .ms-global-card .ms-card-rating-breakdown { grid-template-columns: 1fr 1fr !important; }
}

/* v22: Community order, comparison editorial, and localized update note polish */
.ms-v22-compare-editorial,
.ms-v22-verdict-banner {
  background: #fff;
  border: 1px solid rgba(24,39,75,.08);
  border-radius: 22px;
  box-shadow: 0 18px 46px rgba(23,35,64,.06);
  padding: clamp(24px, 4vw, 46px);
  color: #475569;
}
.ms-v22-compare-editorial h2 {
  color: #102027;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.1;
  margin: 8px 0 16px;
  letter-spacing: -.03em;
}
.ms-v22-compare-editorial h3 {
  color: #102027;
  font-size: clamp(20px, 2.4vw, 27px);
  margin: 34px 0 12px;
}
.ms-v22-compare-editorial p {
  font-size: 16px;
  line-height: 1.85;
  margin: 0 0 18px;
}
.ms-v22-compare-kicker,
.ms-v22-verdict-banner span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #0f9f8f;
  background: rgba(15,159,143,.09);
  border: 1px solid rgba(15,159,143,.18);
  border-radius: 999px;
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.ms-v22-lead {
  color: #334155;
  font-size: 18px !important;
  max-width: 980px;
}
.ms-v22-summary-grid,
.ms-v22-winner-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 16px;
  margin: 28px 0;
}
.ms-v22-monitor-brief,
.ms-v22-winner-card {
  border: 1px solid rgba(24,39,75,.08);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(248,250,252,.98), rgba(236,253,245,.58));
  padding: 18px;
}
.ms-v22-monitor-brief h4,
.ms-v22-winner-card strong {
  display: block;
  color: #102027;
  font-size: 16px;
  font-weight: 900;
  margin: 0 0 8px;
}
.ms-v22-monitor-brief ul {
  margin: 12px 0 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.7;
}
.ms-v22-winner-card span {
  display: inline-flex;
  margin-bottom: 9px;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  color: #8b5cf6;
  letter-spacing: .06em;
}
.ms-v22-winner-card p {
  margin: 0;
  font-size: 13px !important;
  line-height: 1.65;
}
.ms-v22-disclaimer {
  color: #64748b !important;
  font-size: 13px !important;
  background: #f8fafc;
  border: 1px solid rgba(24,39,75,.08);
  border-radius: 14px;
  padding: 14px 16px;
}
.ms-v22-verdict-banner {
  text-align: center;
  background: linear-gradient(135deg, rgba(236,253,245,.96), rgba(250,245,255,.96));
}
.ms-v22-verdict-banner h2 {
  color: #102027;
  margin: 12px 0 10px;
  font-size: clamp(28px, 4vw, 40px);
}
.ms-v22-verdict-banner p {
  max-width: 820px;
  margin: 0 auto 12px;
  color: #475569;
  line-height: 1.75;
}
.ms-v22-faq-container .faq-content { line-height: 1.75; }
.ms-daily-update-note {
  background: linear-gradient(135deg, #f8fafc, #ecfeff 48%, #fff7ed);
  padding: 18px 20px 28px;
}
.ms-daily-update-note__card {
  max-width: 1120px;
  margin: 0 auto;
  border: 1px solid rgba(24,39,75,.08);
  border-radius: 18px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 12px 34px rgba(23,35,64,.06);
  padding: 18px 22px;
  display: grid;
  gap: 6px;
}
.ms-daily-update-note__card span {
  color: #0f9f8f;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.ms-daily-update-note__card strong {
  color: #102027;
  font-size: 16px;
}
.ms-daily-update-note__card p {
  margin: 0;
  color: #64748b;
  line-height: 1.65;
  font-size: 13px;
}
@media (max-width: 760px) {
  .ms-v22-compare-editorial,
  .ms-v22-verdict-banner { padding: 22px; }
  .ms-daily-update-note { padding-left: 14px; padding-right: 14px; }
}

/* v23: Compare page premium visual presentation polish (scoped) */
body.category-compare {
  background: #f7f9ff;
}
body.category-compare .site-header,
body.category-compare header.site-header {
  box-shadow: 0 12px 32px rgba(15, 23, 42, .055);
}
body.category-compare .ms-compare-hero.page-header {
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 8vw, 112px) 20px clamp(54px, 6vw, 82px) !important;
  background:
    radial-gradient(circle at 18% 8%, rgba(20, 184, 166, .14), transparent 30%),
    radial-gradient(circle at 82% 14%, rgba(168, 85, 247, .14), transparent 34%),
    linear-gradient(135deg, #fffaf5 0%, #f8fffd 46%, #fbf7ff 100%) !important;
  border-bottom: 1px solid rgba(15, 23, 42, .08) !important;
}
body.category-compare .ms-compare-hero.page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(15, 23, 42, .08) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity: .24;
  pointer-events: none;
}
body.category-compare .ms-compare-hero.page-header::after {
  content: '';
  position: absolute;
  width: 520px;
  height: 520px;
  right: -190px;
  top: -230px;
  border-radius: 999px;
  background: conic-gradient(from 180deg, rgba(168, 85, 247, .20), rgba(20, 184, 166, .13), rgba(251, 146, 60, .14), rgba(168, 85, 247, .20));
  filter: blur(5px);
  opacity: .8;
  pointer-events: none;
}
body.category-compare .ms-compare-hero .page-header__inner {
  position: relative;
  z-index: 1;
}
body.category-compare .ms-compare-hero h1 {
  letter-spacing: -.055em;
  font-size: clamp(42px, 5vw, 70px) !important;
  line-height: .98 !important;
  margin: 18px 0 18px !important;
}
body.category-compare .ms-compare-hero h1 span {
  background: linear-gradient(135deg, #14b8a6, #8b5cf6 58%, #fb7185);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
}
body.category-compare .ms-compare-hero p {
  color: #334155 !important;
  font-weight: 650;
  max-width: 820px !important;
}
body.category-compare .ms-compare-page {
  padding: clamp(34px, 5vw, 74px) 20px clamp(52px, 7vw, 100px) !important;
  min-height: auto !important;
  background:
    radial-gradient(circle at 0% 8%, rgba(255, 237, 213, .50), transparent 28%),
    radial-gradient(circle at 100% 4%, rgba(243, 232, 255, .55), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #f7f9ff 100%) !important;
}
body.category-compare .cmp-builder-wrapper {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(320px, .95fr) minmax(380px, 1.05fr);
  align-items: stretch;
  gap: clamp(20px, 3vw, 34px) !important;
  padding: clamp(18px, 3vw, 28px);
  margin-bottom: 28px !important;
  border-radius: 28px;
  background: rgba(255,255,255,.68);
  border: 1px solid rgba(15, 23, 42, .08);
  box-shadow: 0 24px 80px rgba(15, 23, 42, .075);
  backdrop-filter: blur(18px);
}
body.category-compare .cmp-builder-wrapper::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(20,184,166,.28), rgba(168,85,247,.22), rgba(251,146,60,.20));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
body.category-compare .cmp-left-panel,
body.category-compare .cmp-right-panel {
  min-width: 0;
  flex: unset !important;
}
body.category-compare #cmp-search-inp {
  height: 62px;
  border-radius: 18px !important;
  border: 1px solid rgba(15, 23, 42, .10) !important;
  box-shadow: 0 16px 42px rgba(15, 23, 42, .06) !important;
  font-weight: 750;
}
body.category-compare #cmp-search-results {
  border-radius: 20px;
  background: rgba(248, 250, 252, .70);
}
body.category-compare .cmp-right-panel {
  border-radius: 24px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  box-shadow: 0 18px 60px rgba(15,23,42,.075) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(168,85,247,.10), transparent 38%),
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,251,245,.95)) !important;
}
body.category-compare .cmp-action-btn {
  border-radius: 999px !important;
  padding: 8px 13px !important;
  background: #fff !important;
  box-shadow: 0 6px 14px rgba(15, 23, 42, .04);
  font-weight: 850 !important;
}
body.category-compare #run-compare-btn {
  border-radius: 16px !important;
  background: linear-gradient(135deg, #14b8a6, #8b5cf6) !important;
  box-shadow: 0 18px 40px rgba(139,92,246,.24) !important;
}
body.category-compare #run-compare-btn[style*="opacity:0.5"],
body.category-compare #run-compare-btn[style*="opacity: 0.5"] {
  filter: grayscale(.20);
}
body.category-compare .search-res-item,
body.category-compare .sel-item {
  border-radius: 16px !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .05);
}
body.category-compare .ms-compare-guidance {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 46px;
}
body.category-compare .ms-compare-guidance__item {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 12px;
  row-gap: 2px;
  padding: 17px 18px;
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, .08);
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 34px rgba(15, 23, 42, .055);
}
body.category-compare .ms-compare-guidance__item span {
  grid-row: span 2;
  width: 38px;
  height: 38px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #0f766e;
  font-size: 12px;
  font-weight: 950;
  background: linear-gradient(135deg, rgba(20,184,166,.16), rgba(168,85,247,.12));
}
body.category-compare .ms-compare-guidance__item strong {
  color: #102027;
  font-size: 14px;
  font-weight: 950;
}
body.category-compare .ms-compare-guidance__item p {
  color: #64748b;
  font-size: 12px;
  line-height: 1.55;
  margin: 0;
}
body.category-compare #compare-results-area {
  border-radius: 30px;
  padding: clamp(18px, 3vw, 30px);
  background: rgba(255,255,255,.74);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 28px 90px rgba(15,23,42,.08);
}
body.category-compare #sticky-comp-header,
body.category-compare #comp-table-body,
body.category-compare #winner-banner,
body.category-compare #dynamic-overview-area > * {
  border-radius: 20px !important;
}
body.category-compare #sticky-comp-header {
  top: 74px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  padding: 16px !important;
  box-shadow: 0 14px 36px rgba(15,23,42,.08) !important;
}
body.category-compare .comp-lbl {
  border-radius: 14px 0 0 14px;
  background: #f8fafc !important;
}
body.category-compare .comp-val {
  min-height: 58px;
  font-weight: 750;
}
body.category-compare .adv-card {
  border-radius: 22px !important;
  background: linear-gradient(145deg, #fff, #f8fafc) !important;
  box-shadow: 0 16px 42px rgba(15,23,42,.06) !important;
}
body.category-compare .ms-v22-compare-editorial,
body.category-compare .ms-v22-verdict-banner,
body.category-compare .seo-content-wrapper,
body.category-compare .ms-compare-static-guide .faq-container {
  border-radius: 28px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(20,184,166,.06), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(168,85,247,.07), transparent 34%),
    rgba(255,255,255,.92) !important;
  box-shadow: 0 26px 90px rgba(15,23,42,.075) !important;
}
body.category-compare .ms-compare-static-guide {
  background:
    linear-gradient(180deg, #f7f9ff 0%, #f8fafc 100%) !important;
  padding: clamp(56px, 7vw, 90px) 20px 70px !important;
}
body.category-compare .seo-content-wrapper {
  max-width: 1180px !important;
  padding: clamp(24px, 4vw, 54px);
}
body.category-compare .seo-content-wrapper > div:first-child {
  max-width: 850px;
  margin-left: auto;
  margin-right: auto;
}
body.category-compare .seo-content-wrapper h2 {
  font-size: clamp(30px, 4vw, 52px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.045em;
}
body.category-compare .seo-content-wrapper article {
  max-width: 920px;
  margin: 0 auto;
  color: #334155 !important;
  font-size: 17px !important;
}
body.category-compare .seo-content-wrapper article h3 {
  margin-top: 34px !important;
  padding: 18px 20px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  background: linear-gradient(135deg, rgba(20,184,166,.08), rgba(168,85,247,.06)) !important;
  box-shadow: 0 10px 26px rgba(15,23,42,.04);
}
body.category-compare .seo-content-wrapper article p {
  color: #475569 !important;
  line-height: 1.9 !important;
}
body.category-compare .faq-container,
body.category-compare .ms-v22-faq-container {
  background: rgba(255,255,255,.94) !important;
  border-radius: 22px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  box-shadow: 0 20px 58px rgba(15,23,42,.07) !important;
  padding: 10px 18px !important;
}
body.category-compare .faq-item {
  padding: 0 !important;
}
body.category-compare .faq-summary {
  padding: 18px 4px !important;
  font-weight: 900 !important;
}
body.category-compare .faq-content {
  padding: 0 4px 18px !important;
}
body.category-compare .ms-v22-winner-card,
body.category-compare .ms-v22-monitor-brief {
  box-shadow: 0 14px 34px rgba(15,23,42,.055);
  transition: transform .18s ease, box-shadow .18s ease;
}
body.category-compare .ms-v22-winner-card:hover,
body.category-compare .ms-v22-monitor-brief:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 46px rgba(15,23,42,.08);
}
@media (max-width: 980px) {
  body.category-compare .cmp-builder-wrapper {
    grid-template-columns: 1fr;
  }
  body.category-compare .ms-compare-guidance {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  body.category-compare .ms-compare-hero h1 {
    font-size: 40px !important;
  }
  body.category-compare .cmp-builder-wrapper {
    padding: 14px;
    border-radius: 22px;
  }
  body.category-compare #sticky-comp-header {
    top: 0 !important;
    overflow-x: auto;
  }
  body.category-compare .seo-content-wrapper {
    padding: 20px;
  }
  body.category-compare .seo-content-wrapper article {
    font-size: 15px !important;
  }
}

/* =============================================================
   v24: Compare Builder + Result Presentation Premium Upgrade
   ============================================================= */
body.category-compare .ms-compare-page > div,
body.category-compare .ms-compare-static-guide > div {
  max-width: 1380px !important;
}
body.category-compare .ms-v24-compare-shell {
  grid-template-columns: minmax(420px, 1.04fr) minmax(420px, .96fr) !important;
  gap: 26px !important;
  padding: clamp(24px, 3vw, 38px) !important;
  border-radius: 32px !important;
  background:
    radial-gradient(circle at 0 0, rgba(20,184,166,.12), transparent 30%),
    radial-gradient(circle at 100% 0, rgba(168,85,247,.10), transparent 32%),
    rgba(255,255,255,.88) !important;
  box-shadow: 0 30px 90px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.7) !important;
}
body.category-compare .ms-v24-compare-topbar {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  padding: 0 2px 10px;
}
body.category-compare .ms-v24-compare-topbar h2 {
  margin: 0;
  color: #0f172a;
  font-size: clamp(28px, 3vw, 44px);
  line-height: .95;
  letter-spacing: -.055em;
  font-weight: 950;
}
body.category-compare .ms-v24-compare-topbar p {
  margin: 8px 0 0;
  color: #64748b;
  font-size: 14px;
  font-weight: 750;
}
body.category-compare .ms-v24-topbar-note {
  max-width: 430px;
  color: #475569;
  font-size: 13px;
  line-height: 1.6;
  font-weight: 700;
  text-align: right;
}
body.category-compare .cmp-left-panel,
body.category-compare .cmp-right-panel {
  align-self: stretch;
}
body.category-compare .cmp-left-panel > div:first-child {
  margin-bottom: 14px !important;
}
body.category-compare #cmp-search-inp {
  height: 64px !important;
  padding-left: 24px !important;
  padding-right: 58px !important;
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(20,184,166,.22) !important;
  color: #0f172a !important;
  font-weight: 700 !important;
}
body.category-compare #cmp-search-inp::placeholder {
  color: #8a94a6;
  font-weight: 650;
}
body.category-compare #cmp-search-results {
  max-height: 520px !important;
  padding: 4px 10px 4px 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 13px !important;
  background: transparent !important;
}
body.category-compare .ms-v24-search-result {
  position: relative;
  display: grid !important;
  grid-template-columns: 82px 1fr auto;
  gap: 16px !important;
  align-items: center;
  min-height: 92px;
  padding: 15px 16px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(20,184,166,.22) !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(240,253,250,.72)) !important;
  box-shadow: 0 14px 36px rgba(15,23,42,.06) !important;
}
body.category-compare .ms-v24-search-result:hover {
  transform: translateY(-2px);
  border-color: rgba(20,184,166,.46) !important;
  background:
    radial-gradient(circle at 0 0, rgba(20,184,166,.10), transparent 42%),
    linear-gradient(135deg, #ffffff, #f0fdfa) !important;
  box-shadow: 0 20px 48px rgba(15,23,42,.085) !important;
}
body.category-compare .ms-v24-search-thumb,
body.category-compare .ms-v24-selected-thumb {
  background: linear-gradient(135deg, #ecfeff, #fff7ed);
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 18px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
body.category-compare .ms-v24-search-thumb { width: 82px; height: 66px; }
body.category-compare .ms-v24-search-thumb img,
body.category-compare .ms-v24-selected-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 6px;
}
body.category-compare .ms-v24-search-copy h4,
body.category-compare .ms-v24-selected-copy h4 {
  margin: 0 0 6px !important;
  color: #0f172a !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  font-weight: 950 !important;
}
body.category-compare .ms-v24-search-copy span,
body.category-compare .ms-v24-selected-copy span {
  display: block;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
  font-weight: 650;
}
body.category-compare .ms-v24-search-meta {
  display: grid;
  justify-items: end;
  gap: 10px;
}
body.category-compare .ms-v24-search-meta strong,
body.category-compare .ms-v24-selected-foot strong {
  min-width: 48px;
  min-height: 38px;
  padding: 0 10px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(139,92,246,.10);
  color: #7c3aed;
  font-size: 16px;
  font-weight: 950;
}
body.category-compare .ms-v24-search-meta button {
  border: 0;
  cursor: pointer;
  min-height: 36px;
  padding: 0 15px;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, #8b5cf6, #6d28d9);
  font-size: 13px;
  font-weight: 950;
  box-shadow: 0 12px 24px rgba(139,92,246,.24);
}
body.category-compare .cmp-right-panel {
  padding: 24px !important;
  background:
    radial-gradient(circle at 0 0, rgba(20,184,166,.11), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,251,245,.92)) !important;
}
body.category-compare .cmp-right-panel > div:first-child {
  align-items: center !important;
  padding-bottom: 16px !important;
}
body.category-compare .cmp-right-panel h3 {
  font-size: 17px !important;
  font-weight: 950 !important;
}
body.category-compare .cmp-action-btn {
  min-height: 42px !important;
  padding: 0 16px !important;
  border: 1px solid rgba(20,184,166,.24) !important;
  color: #0f766e !important;
  background: rgba(255,255,255,.90) !important;
}
body.category-compare .cmp-action-btn:hover {
  color: #fff !important;
  background: linear-gradient(135deg, #0f766e, #14b8a6) !important;
  border-color: transparent !important;
  transform: translateY(-1px);
}
body.category-compare #cmp-selected-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px !important;
  min-height: 185px !important;
}
body.category-compare .ms-v24-selected-card {
  position: relative;
  display: flex !important;
  flex-direction: column;
  justify-content: flex-start !important;
  min-height: 235px;
  padding: 14px !important;
  border-radius: 22px !important;
  border: 1px solid rgba(20,184,166,.20) !important;
  border-left: 1px solid rgba(20,184,166,.20) !important;
  background: linear-gradient(160deg, #ffffff 0%, #f8fffd 100%) !important;
  box-shadow: 0 16px 36px rgba(15,23,42,.065) !important;
}
body.category-compare .ms-v24-selected-card .remove-btn {
  position: absolute;
  top: -9px;
  right: -8px;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #ffffff !important;
  color: #64748b !important;
  border: 1px solid rgba(15,23,42,.12) !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.08);
  font-size: 17px;
  line-height: 1;
}
body.category-compare .ms-v24-selected-thumb {
  height: 74px;
  margin-bottom: 12px;
}
body.category-compare .ms-v24-selected-copy { flex: 1; }
body.category-compare .ms-v24-selected-copy h4 { font-size: 14px !important; }
body.category-compare .ms-v24-selected-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 12px;
}
body.category-compare .ms-v24-selected-foot strong {
  min-width: 42px;
  min-height: 32px;
  font-size: 13px;
}
body.category-compare .ms-v24-selected-foot em {
  color: #0f766e;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}
body.category-compare .ms-v24-store-chip {
  margin-top: 10px;
  min-height: 36px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(139,92,246,.10);
  color: #6d28d9 !important;
  text-decoration: none;
  font-size: 12px;
  font-weight: 950;
}
body.category-compare .ms-v24-empty-selected {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 178px;
  border-radius: 20px;
  border: 1px dashed rgba(20,184,166,.25);
  color: #64748b;
  font-weight: 800;
  text-align: center;
  background: rgba(248,250,252,.65);
}
body.category-compare .ms-v24-empty-selected span {
  margin-top: 5px;
  font-size: 12px;
  font-weight: 650;
}
body.category-compare #run-compare-btn {
  width: 100%;
  min-height: 58px;
  border-radius: 18px !important;
  background: linear-gradient(135deg, #14b8a6 0%, #06b6d4 100%) !important;
  color: #fff !important;
  font-weight: 950 !important;
  letter-spacing: -.01em;
}
body.category-compare .cmp-right-panel > div:last-child::after {
  content: 'Free to use. No signup required. Results are based on listed specifications and available site signals.';
  display: block;
  margin-top: 12px;
  text-align: left;
  color: #64748b;
  font-size: 12px;
  font-weight: 650;
}
body.category-compare #compare-results-area {
  overflow: hidden;
  margin-top: 44px;
  background:
    radial-gradient(circle at 0 0, rgba(20,184,166,.08), transparent 28%),
    radial-gradient(circle at 100% 0, rgba(139,92,246,.08), transparent 30%),
    rgba(255,255,255,.86) !important;
}
body.category-compare .cmp-results-wrapper {
  display: grid;
  gap: 34px;
}
body.category-compare .cmp-sticky-nav {
  position: sticky;
  top: 78px;
  z-index: 5;
  padding: 10px;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 14px 36px rgba(15,23,42,.08);
  backdrop-filter: blur(14px);
}
body.category-compare .cmp-sticky-nav ul {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}
body.category-compare .cmp-sticky-nav a {
  display: inline-flex;
  padding: 10px 14px;
  border-radius: 999px;
  color: #475569;
  font-size: 12px;
  font-weight: 950;
  text-decoration: none;
}
body.category-compare .cmp-sticky-nav a:hover {
  color: #0f766e;
  background: rgba(20,184,166,.10);
}
body.category-compare .cmp-hero-section,
body.category-compare .cmp-section,
body.category-compare .ms-v22-compare-editorial,
body.category-compare .ms-v22-verdict-banner {
  border-radius: 30px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  background:
    radial-gradient(circle at 0 0, rgba(20,184,166,.055), transparent 30%),
    rgba(255,255,255,.94) !important;
  box-shadow: 0 24px 70px rgba(15,23,42,.075) !important;
  padding: clamp(22px, 3vw, 38px) !important;
}
body.category-compare .cmp-section-title {
  color: #0f172a !important;
  font-size: clamp(24px, 2.6vw, 38px) !important;
  font-weight: 950 !important;
  letter-spacing: -.04em;
  margin: 0 0 22px !important;
}
body.category-compare .glass-panel,
body.category-compare .cmp-score-card,
body.category-compare .cmp-pc-card {
  border-radius: 24px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  background: linear-gradient(145deg, #ffffff, #f8fafc) !important;
  box-shadow: 0 18px 42px rgba(15,23,42,.065) !important;
}
body.category-compare .cmp-hero-card.is-winner {
  border-color: rgba(20,184,166,.42) !important;
  box-shadow: 0 24px 64px rgba(20,184,166,.14) !important;
}
body.category-compare .cmp-winner-badge {
  background: linear-gradient(135deg, #0f766e, #14b8a6) !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 8px 12px !important;
  font-size: 11px !important;
  font-weight: 950 !important;
}
body.category-compare .cmp-smart-table {
  width: 100%;
  border-collapse: separate !important;
  border-spacing: 0;
  overflow: hidden;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(15,23,42,.065);
}
body.category-compare .cmp-smart-table th {
  background: linear-gradient(135deg, #0f172a, #1e293b) !important;
  color: #fff !important;
  padding: 17px 18px !important;
  font-size: 13px !important;
  text-align: left;
}
body.category-compare .cmp-smart-table td {
  padding: 16px 18px !important;
  border-bottom: 1px solid rgba(15,23,42,.06) !important;
  color: #334155;
  font-weight: 700;
}
body.category-compare .cmp-smart-table tr:nth-child(even) td:not([colspan]) {
  background: #fbfdff;
}
body.category-compare .cmp-smart-table .ms-row-group td,
body.category-compare .cmp-smart-table .ms-row-group {
  background: linear-gradient(135deg, rgba(20,184,166,.10), rgba(139,92,246,.08)) !important;
  color: #0f766e !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  text-transform: uppercase;
  letter-spacing: .08em;
}
body.category-compare .ms-winner-cell,
body.category-compare .val-winner {
  background: rgba(20,184,166,.10) !important;
  color: #0f766e !important;
  font-weight: 950 !important;
}
body.category-compare .ms-loser-cell {
  background: rgba(248,250,252,.75) !important;
  color: #64748b !important;
}
body.category-compare .ms-v22-summary-grid,
body.category-compare .ms-v22-winner-grid {
  gap: 18px !important;
}
body.category-compare .ms-v22-winner-card {
  position: relative;
  overflow: hidden;
  padding: 22px !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 100% 0, rgba(139,92,246,.08), transparent 35%),
    linear-gradient(145deg, #ffffff, #f8fafc) !important;
}
body.category-compare .ms-v22-winner-card::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, #14b8a6, #8b5cf6);
}
body.category-compare .ms-v22-monitor-brief {
  border-radius: 24px !important;
  padding: 22px !important;
}
body.category-compare .ms-v22-compare-editorial h2,
body.category-compare .ms-v22-verdict-banner h2 {
  color: #0f172a !important;
  letter-spacing: -.04em;
}
body.category-compare .ms-v22-compare-editorial p,
body.category-compare .ms-v22-compare-editorial li,
body.category-compare .ms-v22-verdict-banner p {
  color: #475569 !important;
  line-height: 1.85 !important;
  font-size: 15.5px !important;
}
body.category-compare .seo-content-wrapper {
  border-radius: 34px !important;
  background:
    radial-gradient(circle at 0 0, rgba(20,184,166,.07), transparent 28%),
    radial-gradient(circle at 100% 0, rgba(139,92,246,.08), transparent 32%),
    #ffffff !important;
}
body.category-compare .seo-content-wrapper article h3 {
  display: flex;
  align-items: center;
  gap: 10px;
}
body.category-compare .seo-content-wrapper article h3::before {
  content: '';
  width: 11px;
  height: 11px;
  border-radius: 999px;
  background: linear-gradient(135deg, #14b8a6, #8b5cf6);
  flex: 0 0 auto;
}
@media (max-width: 1180px) {
  body.category-compare .ms-v24-compare-shell { grid-template-columns: 1fr !important; }
  body.category-compare #cmp-selected-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  body.category-compare .ms-v24-compare-topbar { flex-direction: column; }
  body.category-compare .ms-v24-topbar-note { text-align: left; }
  body.category-compare #cmp-selected-list { grid-template-columns: 1fr; }
  body.category-compare .ms-v24-search-result { grid-template-columns: 64px 1fr; }
  body.category-compare .ms-v24-search-meta { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; }
  body.category-compare .cmp-sticky-nav { border-radius: 20px; position: relative; top: auto; }
  body.category-compare .cmp-smart-table { min-width: 720px; }
  body.category-compare .cmp-table-container { overflow-x: auto; }
}

/* v25 SEO Automation helper styles */
a.ms-auto-link{color:#0f766e;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;font-weight:700}
a.ms-auto-link:hover{color:#7c3aed}


/* === MonitorSuggest v29: MRI terminology + platform messaging update === */
.ms-mri-badge--expanded{align-items:center;gap:12px;background:linear-gradient(135deg,#eef2ff 0%,#ecfdf5 55%,#fff7ed 100%);border:1px solid rgba(20,184,166,.22);box-shadow:0 8px 24px rgba(15,23,42,.06);}
.ms-mri-badge__label{display:flex!important;flex-direction:column;align-items:flex-start!important;gap:1px;font-weight:900;letter-spacing:.06em;color:#4f46e5;line-height:1.15;}
.ms-mri-badge__label abbr{text-decoration:none;color:#4f46e5;font-size:12px;}
.ms-mri-badge__label small{font-size:9px;letter-spacing:0;text-transform:none;color:#64748b;font-weight:800;}
.ms-mri-badge__score{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;}
.ms-mri-badge__score strong{font-size:14px;color:#0f172a;}
.ms-mri-badge__score small{font-size:10px;color:#64748b;font-weight:700;}
.ms-about-platform{max-width:1120px;margin:0 auto 70px;padding:0 20px;}
.ms-about-platform__intro{background:linear-gradient(135deg,#ffffff,#f8fafc 55%,#ecfeff);border:1px solid rgba(20,184,166,.16);box-shadow:0 22px 70px rgba(15,23,42,.08);border-radius:28px;padding:34px;margin-bottom:22px;}
.ms-about-kicker{display:inline-flex;align-items:center;gap:8px;background:#ecfdf5;color:#0f766e;border:1px solid rgba(20,184,166,.22);border-radius:999px;padding:7px 12px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px;}
.ms-about-platform h2{font-size:clamp(28px,4vw,44px);line-height:1.05;margin:0 0 16px;color:#0f172a;}
.ms-about-platform p{color:#475569;font-size:16px;line-height:1.8;margin:0 0 12px;}
.ms-about-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:22px 0;}
.ms-about-card{background:#fff;border:1px solid rgba(148,163,184,.22);border-radius:22px;padding:22px;box-shadow:0 14px 34px rgba(15,23,42,.06);}
.ms-about-card span{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:12px;background:linear-gradient(135deg,#7c3aed,#14b8a6);color:#fff;font-weight:900;font-size:12px;margin-bottom:14px;}
.ms-about-card h3{margin:0 0 8px;color:#0f172a;font-size:18px;}
.ms-about-card p{font-size:14px;line-height:1.65;margin:0;color:#64748b;}
.ms-about-process{background:#f8fafc;border:1px solid rgba(148,163,184,.22);border-radius:24px;padding:28px;margin-top:18px;}
.ms-about-process h2{font-size:28px;margin-bottom:14px;}
.ms-about-process ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none;}
.ms-about-process li{background:#fff;border:1px solid rgba(148,163,184,.18);border-radius:16px;padding:14px;color:#475569;line-height:1.6;}
.ms-about-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px;}
@media(max-width:900px){.ms-about-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.ms-about-process ul{grid-template-columns:1fr;}}
@media(max-width:560px){.ms-about-card-grid{grid-template-columns:1fr;}.ms-about-platform__intro{padding:24px;}.ms-mri-badge--expanded{align-items:flex-start;}.ms-mri-badge__score{align-items:flex-start;}}

/* v30 Authority + Discover Readiness */
.ms-authority-box {
    margin: 2rem 0 0;
    padding: clamp(1.25rem, 2vw, 1.75rem);
    border: 1px solid rgba(124, 58, 237, 0.14);
    border-radius: 24px;
    background:
        radial-gradient(circle at top left, rgba(124, 58, 237, 0.10), transparent 35%),
        linear-gradient(135deg, rgba(255,255,255,0.96), rgba(248,250,252,0.96));
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08);
    color: #111827;
}
.ms-authority-box__head span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .35rem .7rem;
    border-radius: 999px;
    background: rgba(16, 185, 129, .12);
    color: #047857;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
}
.ms-authority-box__head h2 {
    margin: .7rem 0 1rem;
    font-size: clamp(1.35rem, 2.3vw, 1.9rem);
    line-height: 1.15;
    color: #111827;
}
.ms-authority-box__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .9rem;
}
.ms-authority-box__grid > div {
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 18px;
    background: rgba(255,255,255,.86);
}
.ms-authority-box__grid strong {
    display: block;
    margin-bottom: .35rem;
    color: #4c1d95;
    font-size: .88rem;
    text-transform: uppercase;
    letter-spacing: .035em;
}
.ms-authority-box__grid p {
    margin: 0;
    color: #475569;
    font-size: .94rem;
    line-height: 1.55;
}
.ms-authority-box__grid a {
    color: #6d28d9;
    font-weight: 800;
    text-decoration: none;
}
.ms-authority-box__grid a:hover {
    text-decoration: underline;
}
@media (max-width: 980px) {
    .ms-authority-box__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .ms-authority-box__grid { grid-template-columns: 1fr; }
}

/* v31: same-page Join Community anchor behavior */
#join-community {
    scroll-margin-top: 120px;
}

.ms-footer-join[href="#join-community"],
#ms-join-community-btn[href="#join-community"] {
    cursor: pointer;
}


/* =========================================================
   v32 CTA BUTTON POLISH - REQUEST / SERVICE WORKFLOWS
   Scoped to Community Requests, Suggest, and After-sales pages.
   ========================================================= */
.ms-req-page .ms-request-sync-strip,
.ms-community-requests-v22 .ms-request-sync-strip,
.ms-aftersales-page .ms-aftersales-hero-actions {
    gap: 16px !important;
}

.ms-req-page .ms-request-sync-strip {
    align-items: stretch !important;
}

.ms-req-page .ms-request-sync-strip > div {
    min-height: 132px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
}

.ms-workflow-cta,
.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta,
.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta,
.ms-inline-action-link {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border: 0 !important;
    text-decoration: none !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #0f766e 0%, #10b9aa 52%, #7c3aed 100%) !important;
    box-shadow: 0 18px 38px rgba(15, 118, 110, .22), 0 8px 18px rgba(124, 58, 237, .14) !important;
    text-shadow: none !important;
    overflow: hidden !important;
    transform: translateZ(0) !important;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

.ms-workflow-cta::before,
.ms-inline-action-link::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: radial-gradient(circle at 22% 10%, rgba(255,255,255,.34), transparent 34%) !important;
    opacity: .95 !important;
    pointer-events: none !important;
}

.ms-workflow-cta span,
.ms-workflow-cta small,
.ms-inline-action-link {
    position: relative !important;
    z-index: 1 !important;
    color: #ffffff !important;
}

.ms-workflow-cta span {
    display: block !important;
    font-weight: 950 !important;
    line-height: 1.15 !important;
    letter-spacing: -.01em !important;
}

.ms-workflow-cta small {
    display: block !important;
    margin-top: 5px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    opacity: .86 !important;
}

.ms-workflow-cta:hover,
.ms-inline-action-link:hover {
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    filter: saturate(1.05) !important;
    box-shadow: 0 24px 48px rgba(15, 118, 110, .28), 0 12px 24px rgba(124, 58, 237, .18) !important;
}

.ms-workflow-cta:focus-visible,
.ms-inline-action-link:focus-visible {
    outline: 3px solid rgba(124, 58, 237, .28) !important;
    outline-offset: 3px !important;
}

.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta {
    min-height: 132px !important;
    min-width: 180px !important;
    flex-direction: column !important;
    border-radius: 18px !important;
    padding: 20px 18px !important;
    text-align: center !important;
    align-self: stretch !important;
}

.ms-community-requests-v22 .ms-request-sync-strip-compact > a.ms-workflow-cta {
    min-width: 172px !important;
}

.ms-aftersales-page .ms-aftersales-hero-actions {
    width: min(100%, 1120px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 16px 18px !important;
    border-radius: 22px !important;
    background: rgba(255,255,255,.78) !important;
    border: 1px solid rgba(24, 39, 75, .10) !important;
    box-shadow: 0 18px 48px rgba(23, 35, 64, .08) !important;
}

.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta {
    min-height: 54px !important;
    min-width: 230px !important;
    padding: 13px 28px !important;
    border-radius: 999px !important;
    flex-direction: column !important;
    text-align: center !important;
}

.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta span {
    font-size: 15px !important;
}

.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta small {
    font-size: 11px !important;
    margin-top: 2px !important;
}

.ms-aftersales-page .ms-aftersales-hero-actions > span {
    background: #ffffff !important;
    color: #203047 !important;
    border: 1px solid rgba(24, 39, 75, .10) !important;
    box-shadow: 0 10px 22px rgba(23, 35, 64, .06) !important;
    padding: 12px 18px !important;
    border-radius: 999px !important;
    font-weight: 900 !important;
}

.ms-inline-action-link,
.ms-section-head a.ms-inline-action-link {
    min-height: 34px !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

@media (max-width: 900px) {
    .ms-req-page .ms-request-sync-strip {
        grid-template-columns: 1fr !important;
    }

    .ms-req-page .ms-request-sync-strip > a.ms-workflow-cta,
    .ms-community-requests-v22 .ms-request-sync-strip-compact > a.ms-workflow-cta {
        min-height: 74px !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .ms-aftersales-page .ms-aftersales-hero-actions {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta,
    .ms-aftersales-page .ms-aftersales-hero-actions > span {
        width: 100% !important;
    }
}


/* =============================================================
   v33: Monitor Selection Guide CTA + Contact Page polish
   ============================================================= */
.ms-guide-hero-actions {
    margin-top: 30px !important;
    display: flex !important;
    gap: 14px !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
}
.ms-guide-cta {
    min-width: 170px !important;
    min-height: 52px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    padding: 14px 28px !important;
    font-weight: 950 !important;
    font-size: 15px !important;
    text-decoration: none !important;
    letter-spacing: -.01em !important;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}
.ms-guide-cta--primary {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0f766e 0%, #10b9aa 55%, #7c3aed 100%) !important;
    box-shadow: 0 18px 42px rgba(15, 118, 110, .24), 0 10px 22px rgba(124, 58, 237, .14) !important;
    border: 0 !important;
}
.ms-guide-cta--secondary {
    color: #102027 !important;
    background: rgba(255,255,255,.94) !important;
    border: 1px solid rgba(24,39,75,.12) !important;
    box-shadow: 0 12px 28px rgba(23,35,64,.08) !important;
}
.ms-guide-cta:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 22px 48px rgba(15, 118, 110, .24), 0 14px 30px rgba(23,35,64,.12) !important;
}
.ms-guide-cta:focus-visible {
    outline: 3px solid rgba(124,58,237,.25) !important;
    outline-offset: 4px !important;
}

.ms-contact-page {
    background: #f7f9ff;
}
.ms-contact-hero {
    padding: 86px 20px 62px;
    background: radial-gradient(circle at 22% 0%, rgba(16,185,170,.12), transparent 38%), radial-gradient(circle at 78% 8%, rgba(124,58,237,.10), transparent 36%), #fffdf8;
    border-bottom: 1px solid rgba(24,39,75,.08);
    text-align: center;
}
.ms-contact-hero__inner {
    max-width: 850px;
    margin: 0 auto;
}
.ms-contact-kicker {
    color: #0f766e;
    font-weight: 950;
    letter-spacing: 1.7px;
    text-transform: uppercase;
    font-size: 13px;
}
.ms-contact-hero h1 {
    color: #102027;
    font-size: clamp(36px, 5vw, 58px);
    line-height: 1.05;
    margin: 14px 0 16px;
    font-weight: 950;
}
.ms-contact-hero p {
    max-width: 740px;
    margin: 0 auto;
    color: #475569;
    font-size: 17px;
    line-height: 1.8;
    font-weight: 700;
}
.ms-contact-wrap {
    padding: 56px 20px 92px;
}
.ms-contact-layout {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 28px;
    align-items: start;
}
.ms-contact-content-card,
.ms-contact-side-card,
.ms-contact-form-card {
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(24,39,75,.10);
    border-radius: 24px;
    box-shadow: 0 22px 60px rgba(23,35,64,.08);
}
.ms-contact-content-card {
    padding: 28px;
}
.ms-contact-intro p {
    color: #475569;
    line-height: 1.8;
    font-size: 16px;
    margin: 0 0 12px;
}
.ms-contact-form-card {
    margin-top: 24px;
    padding: 24px;
}
.ms-contact-privacy-note,
.ms-contact-notice {
    border-radius: 16px;
    padding: 13px 16px;
    margin-bottom: 18px;
    font-size: 14px;
    line-height: 1.6;
}
.ms-contact-privacy-note {
    background: #ecfeff;
    border: 1px solid #bae6fd;
    color: #164e63;
}
.ms-contact-notice--success {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #065f46;
    font-weight: 800;
}
.ms-contact-notice--error {
    background: #fff1f2;
    border: 1px solid #fecdd3;
    color: #9f1239;
    font-weight: 800;
}
.ms-contact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.ms-contact-form label {
    display: grid;
    gap: 8px;
    color: #203047;
    font-weight: 900;
    font-size: 13px;
}
.ms-contact-form label span {
    color: #f43f5e;
}
.ms-contact-form input,
.ms-contact-form select,
.ms-contact-form textarea {
    width: 100%;
    border: 1px solid rgba(24,39,75,.14);
    border-radius: 14px;
    background: #ffffff;
    color: #102027;
    padding: 13px 14px;
    font: inherit;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}
.ms-contact-form input:focus,
.ms-contact-form select:focus,
.ms-contact-form textarea:focus {
    outline: 3px solid rgba(16,185,170,.18);
    border-color: #10b9aa;
}
.ms-contact-message {
    margin-top: 16px;
}
.ms-contact-submit {
    margin-top: 18px;
    min-height: 52px;
    width: 100%;
    border: 0;
    border-radius: 999px;
    color: #ffffff;
    background: linear-gradient(135deg, #0f766e, #10b9aa 58%, #7c3aed);
    font-weight: 950;
    cursor: pointer;
    box-shadow: 0 18px 42px rgba(15,118,110,.22);
}
.ms-contact-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 22px 48px rgba(15,118,110,.28);
}
.ms-hp-field {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
}
.ms-contact-side {
    display: grid;
    gap: 18px;
}
.ms-contact-side-card {
    padding: 22px;
}
.ms-contact-side-card h2 {
    margin: 0 0 12px;
    color: #102027;
    font-size: 18px;
    font-weight: 950;
}
.ms-contact-side-card ul {
    margin: 0;
    padding-left: 18px;
    color: #475569;
    line-height: 1.8;
    font-weight: 700;
}
.ms-contact-side-card--accent {
    background: linear-gradient(135deg, #ecfeff, #f5f3ff);
}
.ms-contact-side-card a {
    color: #0f766e;
    font-weight: 900;
}
.ms-legal-contact-card {
    margin-top: 28px;
    padding: 22px;
    border-radius: 20px;
    background: linear-gradient(135deg, #ecfeff, #f5f3ff);
    border: 1px solid rgba(16,185,170,.18);
}
.ms-legal-contact-card h2 {
    margin: 0 0 8px;
    color: #102027;
    font-size: 20px;
    font-weight: 950;
}
.ms-legal-contact-card p {
    margin: 0 0 14px;
    color: #475569;
    line-height: 1.7;
}
.ms-legal-contact-card a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 18px;
    border-radius: 999px;
    background: #0f766e;
    color: #ffffff !important;
    text-decoration: none;
    font-weight: 950;
}
@media (max-width: 900px) {
    .ms-contact-layout {
        grid-template-columns: 1fr;
    }
    .ms-contact-grid {
        grid-template-columns: 1fr;
    }
    .ms-guide-cta {
        width: 100% !important;
    }
}

/* v35: removed legacy guide redirect; Monitor Selection Guide is the only active guide URL. */


/* =============================================================
   v36: Unified CTA button polish for request/service workflow pages
   Matches the Join Community subscribe button color system.
   ============================================================= */
:root {
    --ms-subscribe-teal-gradient: linear-gradient(135deg, #0f766e 0%, #13a79a 58%, #0b5f58 100%);
    --ms-subscribe-teal-shadow: 0 18px 38px rgba(15, 118, 110, .22);
    --ms-subscribe-teal-shadow-hover: 0 24px 48px rgba(15, 118, 110, .28);
}

.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta,
.ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta,
.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta,
.ms-section-head a.ms-inline-action-link {
    background: var(--ms-subscribe-teal-gradient) !important;
    background-image: var(--ms-subscribe-teal-gradient) !important;
    color: #ffffff !important;
    border: 0 !important;
    text-decoration: none !important;
    box-shadow: var(--ms-subscribe-teal-shadow) !important;
    text-shadow: none !important;
}

.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta::before,
.ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta::before,
.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta::before,
.ms-section-head a.ms-inline-action-link::before {
    background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0) 55%) !important;
    opacity: .55 !important;
}

.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta:hover,
.ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta:hover,
.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta:hover,
.ms-section-head a.ms-inline-action-link:hover {
    background: linear-gradient(135deg, #0b5f58 0%, #0f8f84 58%, #094f49 100%) !important;
    color: #ffffff !important;
    box-shadow: var(--ms-subscribe-teal-shadow-hover) !important;
}

.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta span,
.ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta span,
.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta span,
.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta small,
.ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta small,
.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta small {
    background: transparent !important;
    color: #ffffff !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center !important;
}

.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta,
.ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta {
    min-width: 198px !important;
    min-height: 118px !important;
    padding: 16px 20px !important;
    border-radius: 16px !important;
    flex-direction: column !important;
    gap: 4px !important;
    white-space: normal !important;
}

.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta span,
.ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta span {
    display: block !important;
    font-size: 18px !important;
    line-height: 1.12 !important;
    font-weight: 950 !important;
    letter-spacing: -.01em !important;
    max-width: 150px !important;
}

.ms-req-page .ms-request-sync-strip > a.ms-workflow-cta small,
.ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta small {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    font-weight: 850 !important;
    color: rgba(255,255,255,.88) !important;
    opacity: 1 !important;
}

.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta {
    min-height: 54px !important;
    min-width: 238px !important;
    padding: 13px 26px !important;
    border-radius: 15px !important;
}

.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta span {
    font-size: 15px !important;
}

.ms-aftersales-page .ms-aftersales-hero-actions > a.ms-workflow-cta small {
    font-size: 11px !important;
    color: rgba(255,255,255,.88) !important;
}

.ms-section-head a.ms-inline-action-link {
    min-height: 36px !important;
    padding: 9px 16px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

@media (min-width: 901px) {
    .ms-req-page .ms-request-sync-strip,
    .ms-community-requests-v22 .ms-request-sync-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(198px, .55fr) !important;
    }
}

@media (max-width: 900px) {
    .ms-req-page .ms-request-sync-strip > a.ms-workflow-cta,
    .ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta {
        min-width: 0 !important;
        width: 100% !important;
        min-height: 74px !important;
        max-width: none !important;
    }

    .ms-req-page .ms-request-sync-strip > a.ms-workflow-cta span,
    .ms-community-requests-v22 .ms-request-sync-strip > a.ms-workflow-cta span {
        max-width: none !important;
    }
}


/* =============================================================
   V37 Free Tools Dropdown + Find Monitor Premium UI Sync
   Scoped CSS only. Keeps engines, routes, data, and AJAX intact.
   ============================================================= */

/* ---- Header Free Tools dropdown: reliable hover + click + keyboard ---- */
.ms-primary-nav > .ms-nav-list > .ms-nav-free-tools {
    position: relative !important;
}

.ms-primary-nav > .ms-nav-list > .ms-nav-free-tools > .ms-nav-parent-link,
.ms-primary-nav > .ms-nav-list > .ms-nav-free-tools > a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    cursor: pointer !important;
}

.ms-primary-nav > .ms-nav-list > .ms-nav-free-tools > .sub-menu {
    position: absolute !important;
    top: calc(100% + 12px) !important;
    left: 50% !important;
    right: auto !important;
    z-index: 999999 !important;
    min-width: 292px !important;
    max-width: 340px !important;
    padding: 10px !important;
    margin: 0 !important;
    list-style: none !important;
    border-radius: 18px !important;
    border: 1px solid rgba(15, 118, 110, .16) !important;
    background:
        radial-gradient(circle at 10% 0%, rgba(19,167,154,.12), transparent 28%),
        radial-gradient(circle at 100% 100%, rgba(124,58,237,.10), transparent 30%),
        rgba(255, 255, 255, .98) !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .16) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateX(-50%) translateY(10px) scale(.98) !important;
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease !important;
}

.ms-primary-nav > .ms-nav-list > .ms-nav-free-tools > .sub-menu::before {
    content: "" !important;
    position: absolute !important;
    top: -8px !important;
    left: 50% !important;
    width: 16px !important;
    height: 16px !important;
    transform: translateX(-50%) rotate(45deg) !important;
    background: rgba(255, 255, 255, .98) !important;
    border-left: 1px solid rgba(15, 118, 110, .14) !important;
    border-top: 1px solid rgba(15, 118, 110, .14) !important;
}

@media (min-width: 992px) {
    .ms-primary-nav > .ms-nav-list > .ms-nav-free-tools:hover > .sub-menu,
    .ms-primary-nav > .ms-nav-list > .ms-nav-free-tools:focus-within > .sub-menu,
    .ms-primary-nav > .ms-nav-list > .ms-nav-free-tools.ms-dropdown-open > .sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateX(-50%) translateY(0) scale(1) !important;
    }
}

.ms-primary-nav > .ms-nav-list > .ms-nav-free-tools > .sub-menu > .menu-item > a,
.ms-primary-nav .ms-nav-free-tools .sub-menu .menu-item a {
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 46px !important;
    padding: 10px 12px !important;
    border-radius: 13px !important;
    color: #102027 !important;
    font-size: 13.5px !important;
    font-weight: 900 !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
    white-space: normal !important;
    background: transparent !important;
}

.ms-primary-nav .ms-nav-free-tools .sub-menu .menu-item a::before {
    content: "" !important;
    width: 30px !important;
    height: 30px !important;
    display: block !important;
    border-radius: 10px !important;
    background:
        linear-gradient(135deg, rgba(15,118,110,.16), rgba(124,58,237,.12)),
        #f8fafc !important;
    border: 1px solid rgba(15,118,110,.14) !important;
}

.ms-primary-nav .ms-nav-free-tools .sub-menu .menu-item a:hover,
.ms-primary-nav .ms-nav-free-tools .sub-menu .menu-item a:focus-visible {
    color: #0f766e !important;
    background: rgba(15, 118, 110, .075) !important;
    padding-left: 12px !important;
    outline: none !important;
}

@media (max-width: 991px) {
    .ms-primary-nav > .ms-nav-list > .ms-nav-free-tools > .sub-menu {
        position: static !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-top: 8px !important;
        box-shadow: none !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        display: none !important;
        background: rgba(248, 250, 252, .92) !important;
    }
    .ms-primary-nav > .ms-nav-list > .ms-nav-free-tools.mobile-dropdown-open > .sub-menu {
        display: grid !important;
    }
    .ms-primary-nav > .ms-nav-list > .ms-nav-free-tools > .sub-menu::before {
        display: none !important;
    }
}

/* ---- Find Monitor page premium visual refresh ---- */
body.category-find-monitor .page-header {
    position: relative !important;
    overflow: hidden !important;
    padding: clamp(74px, 8vw, 116px) 24px clamp(48px, 6vw, 74px) !important;
    background:
        radial-gradient(circle at 18% 20%, rgba(255, 107, 74, .10), transparent 30%),
        radial-gradient(circle at 78% 18%, rgba(15, 118, 110, .12), transparent 32%),
        linear-gradient(180deg, #fffdf8 0%, #f7faf8 100%) !important;
    border-bottom: 1px solid rgba(15, 118, 110, .10) !important;
}

body.category-find-monitor .page-header::before {
    content: "LIVE MONITOR FINDER" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    margin: 0 auto 14px !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    background: rgba(15, 118, 110, .09) !important;
    border: 1px solid rgba(15, 118, 110, .16) !important;
    color: #0f766e !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    letter-spacing: .09em !important;
}

body.category-find-monitor .page-header__inner {
    position: relative !important;
    z-index: 1 !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    text-align: center !important;
}

body.category-find-monitor .page-header h1 {
    margin: 0 0 14px !important;
    color: #102027 !important;
    font-size: clamp(44px, 5.4vw, 78px) !important;
    line-height: .96 !important;
    letter-spacing: -.055em !important;
    font-weight: 950 !important;
}

body.category-find-monitor .page-header h1::after {
    content: "" !important;
    display: block !important;
    width: 90px !important;
    height: 4px !important;
    margin: 18px auto 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #0f766e, #13a79a, #7c3aed) !important;
}

body.category-find-monitor .page-header p {
    max-width: 760px !important;
    margin: 0 auto !important;
    color: #334155 !important;
    font-size: clamp(15px, 1.4vw, 18px) !important;
    line-height: 1.7 !important;
    font-weight: 750 !important;
}

body.category-find-monitor .find-monitor-main {
    padding: clamp(34px, 4.5vw, 64px) 24px 92px !important;
    background:
        radial-gradient(circle at 7% 10%, rgba(255, 107, 74, .07), transparent 27%),
        radial-gradient(circle at 94% 8%, rgba(15, 118, 110, .08), transparent 30%),
        linear-gradient(180deg, #fffdf8 0%, #f6fbf9 58%, #f7f8ff 100%) !important;
}

body.category-find-monitor .find-monitor-layout {
    width: min(1500px, calc(100vw - 48px)) !important;
    grid-template-columns: minmax(270px, 320px) minmax(0, 1fr) !important;
    gap: 34px !important;
}

body.category-find-monitor .amz-sidebar {
    top: 96px !important;
    padding: 24px !important;
    border-radius: 28px !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,253,252,.96)) !important;
    border: 1px solid rgba(15,118,110,.16) !important;
    box-shadow: 0 24px 70px rgba(15,23,42,.10) !important;
}

body.category-find-monitor .amz-sidebar::before {
    content: "Filter by real needs" !important;
    display: block !important;
    margin: 0 0 16px !important;
    padding: 11px 14px !important;
    border-radius: 16px !important;
    color: #0f766e !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    letter-spacing: .03em !important;
    background: rgba(15,118,110,.08) !important;
    border: 1px solid rgba(15,118,110,.12) !important;
}

body.category-find-monitor .amz-filter-group:first-child > div {
    gap: 0 !important;
}

body.category-find-monitor .amz-filter-group:first-child .amz-inp {
    border-radius: 14px 0 0 14px !important;
}

body.category-find-monitor .amz-filter-group button[type="submit"],
body.category-find-monitor .amz-go-btn {
    background: linear-gradient(135deg, #0f766e 0%, #13a79a 55%, #7c3aed 100%) !important;
    color: #ffffff !important;
    border-radius: 14px !important;
}

body.category-find-monitor .amz-filter-group:first-child button[type="submit"] {
    border-radius: 0 14px 14px 0 !important;
}

body.category-find-monitor .find-results-panel {
    position: relative !important;
}

body.category-find-monitor .find-results-toolbar {
    min-height: 72px !important;
    border-radius: 24px !important;
    padding: 18px 22px !important;
    background:
        radial-gradient(circle at 0% 0%, rgba(15,118,110,.10), transparent 34%),
        rgba(255,255,255,.96) !important;
    border: 1px solid rgba(15,118,110,.15) !important;
    box-shadow: 0 22px 58px rgba(15,23,42,.08) !important;
}

body.category-find-monitor #results-count {
    color: #334155 !important;
    font-size: 15px !important;
}

body.category-find-monitor #ms-sort-by {
    min-width: 180px !important;
    border-radius: 14px !important;
}

body.category-find-monitor #ms-engine-results {
    grid-template-columns: repeat(3, minmax(280px, 1fr)) !important;
    gap: 26px !important;
}

body.category-find-monitor #ms-engine-results .ms-global-card {
    border-radius: 28px !important;
    background: rgba(255,255,255,.97) !important;
    border: 1px solid rgba(15,118,110,.14) !important;
    box-shadow: 0 20px 58px rgba(15,23,42,.08) !important;
}

body.category-find-monitor #ms-engine-results .ms-global-card:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(15,118,110,.24) !important;
    box-shadow: 0 30px 86px rgba(15,23,42,.13) !important;
}

body.category-find-monitor #ms-engine-results .ms-card-media {
    min-height: 190px !important;
    border-radius: 22px !important;
    background:
        radial-gradient(circle at 70% 20%, rgba(255,107,74,.12), transparent 34%),
        linear-gradient(135deg, #f7fffb, #fff7ed) !important;
}

body.category-find-monitor #ms-engine-results .ms-card-footer {
    padding: 12px 18px 18px !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
}

body.category-find-monitor #ms-engine-results .ms-monitor-feedback-card .ms-vote-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body.category-find-monitor #ms-engine-results .ms-store-offer-btn,
body.category-find-monitor #ms-engine-results .ms-card-footer .ms-amazon-btn,
body.category-find-monitor #ms-engine-results a.ms-amazon-btn {
    min-height: 44px !important;
    border-radius: 14px !important;
}

body.category-find-monitor #ms-engine-results > [style*="grid-column"] {
    min-height: 220px !important;
    display: grid !important;
    place-items: center !important;
    border-style: dashed !important;
    border-radius: 28px !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(15,118,110,.10), transparent 34%),
        rgba(255,255,255,.78) !important;
}

@media (max-width: 1280px) {
    body.category-find-monitor #ms-engine-results {
        grid-template-columns: repeat(2, minmax(260px, 1fr)) !important;
    }
}

@media (max-width: 980px) {
    body.category-find-monitor .find-monitor-layout {
        grid-template-columns: 1fr !important;
    }
    body.category-find-monitor .amz-sidebar {
        position: relative !important;
        top: auto !important;
        max-height: none !important;
    }
}

@media (max-width: 680px) {
    body.category-find-monitor #ms-engine-results {
        grid-template-columns: 1fr !important;
    }
    body.category-find-monitor .find-results-toolbar {
        align-items: stretch !important;
    }
    body.category-find-monitor .find-results-toolbar > div:last-child,
    body.category-find-monitor .find-results-toolbar select {
        width: 100% !important;
    }
}


/* =============================================================
   V38 Free Tools Dropdown + Refresh Guide Cleanup
   Fixes desktop/mobile dropdown presentation and prevents active
   navigation styling from leaking into submenu rows.
   ============================================================= */

/* Desktop Free Tools: compact, right-aligned, premium panel */
@media (min-width: 992px) {
    #ms-primary-nav .ms-nav-free-tools {
        position: relative !important;
    }

    #ms-primary-nav .ms-nav-free-tools > .sub-menu {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 7px !important;
        position: absolute !important;
        top: calc(100% + 12px) !important;
        left: auto !important;
        right: 0 !important;
        width: min(330px, calc(100vw - 40px)) !important;
        min-width: 300px !important;
        max-width: 330px !important;
        margin: 0 !important;
        padding: 12px !important;
        list-style: none !important;
        border-radius: 22px !important;
        border: 1px solid rgba(15, 118, 110, .16) !important;
        background:
            radial-gradient(circle at 92% 12%, rgba(124,58,237,.10), transparent 34%),
            radial-gradient(circle at 10% 0%, rgba(15,167,154,.12), transparent 34%),
            rgba(255, 255, 255, .97) !important;
        box-shadow: 0 28px 80px rgba(15, 23, 42, .15) !important;
        backdrop-filter: blur(18px) !important;
        -webkit-backdrop-filter: blur(18px) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateY(10px) scale(.985) !important;
        transition: opacity .18s ease, visibility .18s ease, transform .18s ease !important;
        overflow: visible !important;
    }

    #ms-primary-nav .ms-nav-free-tools:hover > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools:focus-within > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools.ms-dropdown-open > .sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateY(0) scale(1) !important;
    }

    #ms-primary-nav .ms-nav-free-tools > .sub-menu::before {
        content: "" !important;
        position: absolute !important;
        top: -8px !important;
        right: 28px !important;
        left: auto !important;
        width: 16px !important;
        height: 16px !important;
        transform: rotate(45deg) !important;
        background: rgba(255,255,255,.97) !important;
        border-left: 1px solid rgba(15, 118, 110, .13) !important;
        border-top: 1px solid rgba(15, 118, 110, .13) !important;
    }
}

/* Submenu row reset: stop current-menu active pill/underline/large oval leakage */
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item.current-menu-item,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item.current-menu-parent,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item.current-menu-ancestor {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item.current-menu-item > a,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item.current-menu-parent > a,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item.current-menu-ancestor > a,
#ms-primary-nav .ms-nav-free-tools .sub-menu a[aria-current="page"] {
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 11px !important;
    width: 100% !important;
    min-height: 52px !important;
    padding: 11px 12px !important;
    border-radius: 15px !important;
    color: #102027 !important;
    background: rgba(248,250,252,.72) !important;
    border: 1px solid rgba(15,118,110,.09) !important;
    box-shadow: none !important;
    font-size: 13.5px !important;
    font-weight: 900 !important;
    line-height: 1.22 !important;
    text-decoration: none !important;
    white-space: normal !important;
    overflow: hidden !important;
}

#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item.current-menu-item > a,
#ms-primary-nav .ms-nav-free-tools .sub-menu a[aria-current="page"] {
    color: #0f766e !important;
    background: linear-gradient(135deg, rgba(15,118,110,.12), rgba(124,58,237,.08)) !important;
    border-color: rgba(15,118,110,.20) !important;
}

#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a::before {
    content: "" !important;
    width: 32px !important;
    height: 32px !important;
    display: block !important;
    border-radius: 11px !important;
    background: linear-gradient(135deg, rgba(15,118,110,.16), rgba(124,58,237,.12)), #f8fafc !important;
    border: 1px solid rgba(15,118,110,.14) !important;
    box-shadow: none !important;
}

#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a::after,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item.current-menu-item > a::after,
#ms-primary-nav .ms-nav-free-tools .sub-menu a[aria-current="page"]::after {
    display: none !important;
    content: none !important;
}

#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a:hover,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a:focus-visible {
    color: #0b6b60 !important;
    background: rgba(15,118,110,.10) !important;
    border-color: rgba(15,118,110,.22) !important;
    transform: none !important;
    outline: none !important;
}

/* Mobile drawer: make Free Tools a clean accordion list, not a floating card */
@media (max-width: 991px) {
    #ms-primary-nav .ms-nav-free-tools {
        width: 100% !important;
    }

    #ms-primary-nav .ms-nav-free-tools > .ms-nav-parent-link,
    #ms-primary-nav .ms-nav-free-tools > a {
        width: 100% !important;
        min-height: 48px !important;
        justify-content: space-between !important;
        padding: 12px 12px !important;
        border-radius: 16px !important;
        background: rgba(255,255,255,.70) !important;
        border: 1px solid rgba(15,118,110,.10) !important;
        color: #102027 !important;
        box-shadow: none !important;
    }

    #ms-primary-nav .ms-nav-free-tools > .sub-menu {
        position: static !important;
        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 8px 0 0 !important;
        padding: 8px !important;
        border-radius: 18px !important;
        border: 1px solid rgba(15,118,110,.14) !important;
        background: rgba(255,255,255,.82) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.70) !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        overflow: visible !important;
    }

    #ms-primary-nav .ms-nav-free-tools.mobile-dropdown-open > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools.mobile-open > .sub-menu {
        display: grid !important;
        gap: 7px !important;
    }

    #ms-primary-nav .ms-nav-free-tools > .sub-menu::before {
        display: none !important;
        content: none !important;
    }

    #ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a,
    #ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item.current-menu-item > a,
    #ms-primary-nav .ms-nav-free-tools .sub-menu a[aria-current="page"] {
        grid-template-columns: 28px minmax(0, 1fr) !important;
        min-height: 46px !important;
        padding: 9px 10px !important;
        font-size: 13.2px !important;
        line-height: 1.2 !important;
        border-radius: 13px !important;
        background: #ffffff !important;
    }

    #ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a::before {
        width: 26px !important;
        height: 26px !important;
        border-radius: 9px !important;
    }
}

/* Refresh Rate Guide: hide accidental raw colour-code text and improve cards */
.ms-refresh-page .ms-tool-guide .ms-editorial-grid .ms-editorial-card p {
    color: #475569 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
}

.ms-refresh-page .ms-tool-guide .ms-editorial-grid .ms-editorial-card p:only-child,
.ms-refresh-page .ms-tool-guide .ms-editorial-grid .ms-editorial-card p {
    word-break: normal !important;
}


/* =============================================================
   v39 Single Blog Reading UI + Index Tool polish
   ============================================================= */
.ms-single-hero {
  position: relative;
  padding: clamp(72px, 8vw, 132px) 20px clamp(48px, 6vw, 88px);
  background:
    radial-gradient(circle at 15% 10%, rgba(255, 116, 84, .10), transparent 35%),
    radial-gradient(circle at 85% 0%, rgba(0, 151, 136, .12), transparent 34%),
    linear-gradient(135deg, #fffaf3 0%, #f7fbf8 55%, #faf7ff 100%);
  border-bottom: 1px solid rgba(24, 39, 75, .08);
  overflow: hidden;
}
.ms-single-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(15, 23, 42, .05) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity: .32;
  pointer-events: none;
}
.ms-single-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 980px;
  margin: 0 auto;
  text-align: center;
}
.ms-single-kicker,
.ms-single-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #078676;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
}
.ms-single-kicker {
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(13, 148, 136, .08);
  border: 1px solid rgba(13, 148, 136, .16);
  margin-bottom: 18px;
}
.ms-single-hero h1 {
  max-width: 900px;
  margin: 0 auto 18px;
  color: #0f172a;
  font-size: clamp(34px, 5vw, 68px);
  line-height: .98;
  letter-spacing: -.05em;
  font-weight: 950;
}
.ms-single-excerpt {
  max-width: 760px;
  margin: 0 auto 24px;
  color: #475569;
  font-size: clamp(16px, 2vw, 20px);
  line-height: 1.7;
  font-weight: 650;
}
.ms-single-meta-row {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}
.ms-single-meta-row span {
  border: 1px solid rgba(15, 23, 42, .08);
  background: rgba(255, 255, 255, .74);
  box-shadow: 0 14px 38px rgba(15, 23, 42, .06);
  color: #334155;
  border-radius: 999px;
  padding: 10px 14px;
  font-size: 13px;
}
.ms-single-shell {
  background: linear-gradient(180deg, #f8fbff 0%, #f5f8ff 100%);
  padding: 46px 20px 74px;
}
.ms-single-layout {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 32px;
  align-items: start;
}
.ms-single-article,
.ms-single-sidebar-card,
.ms-related-card {
  background: rgba(255, 255, 255, .90);
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 28px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .08);
}
.ms-single-article {
  padding: clamp(18px, 3vw, 34px);
}
.ms-single-featured {
  margin: 0 0 24px;
  border-radius: 22px;
  overflow: hidden;
  background: #f1f5f9;
  border: 1px solid rgba(15, 23, 42, .08);
}
.ms-single-featured img {
  display: block;
  width: 100%;
  height: auto;
}
.ms-single-disclosure,
.ms-single-quick-answer {
  border-radius: 20px;
  padding: 18px 20px;
  margin: 0 0 24px;
  color: #334155;
  line-height: 1.7;
}
.ms-single-disclosure {
  background: linear-gradient(135deg, rgba(255, 247, 237, .92), rgba(236, 253, 245, .92));
  border: 1px solid rgba(245, 158, 11, .22);
}
.ms-single-quick-answer {
  background: linear-gradient(135deg, rgba(236, 253, 245, .95), rgba(239, 246, 255, .95));
  border: 1px solid rgba(13, 148, 136, .20);
}
.ms-single-quick-answer p {
  margin: 8px 0 0;
  color: #0f172a;
  font-size: 18px;
  line-height: 1.7;
  font-weight: 700;
}
.ms-single-content {
  color: #27364a;
  font-size: 18px;
  line-height: 1.85;
}
.ms-single-content h2,
.ms-single-content h3 {
  color: #0f172a;
  letter-spacing: -.03em;
  scroll-margin-top: 104px;
}
.ms-single-content h2 {
  font-size: clamp(28px, 3vw, 42px);
  margin: 44px 0 16px;
  padding-top: 10px;
}
.ms-single-content h3 {
  font-size: clamp(22px, 2vw, 28px);
  margin: 32px 0 12px;
}
.ms-single-content p { margin: 0 0 22px; }
.ms-single-content a { color: #078676; font-weight: 800; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.ms-single-content ul,
.ms-single-content ol { padding-left: 24px; margin: 0 0 24px; }
.ms-single-content li { margin: 8px 0; }
.ms-single-content blockquote {
  margin: 28px 0;
  padding: 22px 24px;
  border-radius: 20px;
  border-left: 4px solid #0d9488;
  background: #f8fafc;
  color: #334155;
}
.ms-single-content table {
  width: 100%;
  border-collapse: collapse;
  display: block;
  overflow-x: auto;
  margin: 28px 0;
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, .08);
  background: #fff;
}
.ms-single-content th,
.ms-single-content td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(15, 23, 42, .08);
  text-align: left;
  min-width: 160px;
}
.ms-single-content th { background: #f1f5f9; color: #0f172a; }
.ms-single-tags,
.ms-single-share {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 28px;
}
.ms-single-tags span { color: #64748b; font-weight: 900; }
.ms-single-tags a,
.ms-single-share a,
.ms-single-tools-card a {
  border-radius: 999px;
  padding: 10px 14px;
  text-decoration: none;
  font-weight: 900;
  font-size: 13px;
}
.ms-single-tags a { color: #0f766e; background: #ecfdf5; border: 1px solid rgba(13,148,136,.18); }
.ms-single-share a { color: #fff; background: linear-gradient(135deg, #0d9488, #14b8a6); box-shadow: 0 12px 28px rgba(13,148,136,.22); }
.ms-single-author-card {
  display: flex;
  gap: 18px;
  align-items: center;
  margin-top: 34px;
  padding: 22px;
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(248, 250, 252, .94), rgba(236, 253, 245, .80));
  border: 1px solid rgba(15, 23, 42, .08);
}
.ms-single-author-card img { width: 76px; height: 76px; border-radius: 22px; object-fit: cover; }
.ms-single-author-card h2 { margin: 4px 0 8px; color: #0f172a; font-size: 22px; }
.ms-single-author-card p { margin: 0; color: #475569; line-height: 1.7; }
.ms-single-sidebar { position: sticky; top: 96px; display: grid; gap: 18px; }
.ms-single-sidebar-card { padding: 22px; border-radius: 24px; }
.ms-single-sidebar-card h2 { margin: 0 0 16px; color: #0f172a; font-size: 18px; }
.ms-single-toc { list-style: none; margin: 0; padding: 0; }
.toc-link {
  display: block;
  padding: 10px 0;
  color: #475569;
  text-decoration: none;
  font-weight: 800;
  border-bottom: 1px dashed rgba(15,23,42,.10);
  line-height: 1.35;
}
.toc-link:hover { color: #0d9488; }
.toc-h3 { padding-left: 14px; font-size: 13px; color: #64748b; }
.ms-toc-empty { color: #64748b; font-style: italic; font-size: 13px; }
.ms-single-trust-card dl { margin: 0; display: grid; gap: 10px; }
.ms-single-trust-card div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(15,23,42,.08); }
.ms-single-trust-card dt { color: #64748b; font-weight: 800; }
.ms-single-trust-card dd { margin: 0; color: #0f172a; font-weight: 950; }
.ms-single-tools-card { display: grid; gap: 10px; }
.ms-single-tools-card a { display: block; color: #0f766e; background: #ecfdf5; border: 1px solid rgba(13,148,136,.18); }
.ms-related-posts {
  padding: 58px 20px 90px;
  background: linear-gradient(180deg, #f5f8ff, #ffffff);
  border-top: 1px solid rgba(15,23,42,.06);
}
.ms-related-inner { max-width: 1280px; margin: 0 auto; }
.ms-section-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.ms-section-heading-row h2 { margin: 4px 0 0; color: #0f172a; font-size: clamp(26px, 3vw, 40px); }
.ms-section-heading-row a { color: #0d9488; font-weight: 900; text-decoration: none; }
.ms-related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.ms-related-card { overflow: hidden; text-decoration: none; color: inherit; transition: transform .2s ease, box-shadow .2s ease; }
.ms-related-card:hover { transform: translateY(-4px); box-shadow: 0 26px 80px rgba(15,23,42,.12); }
.ms-related-card img { width: 100%; height: 190px; object-fit: cover; display: block; }
.ms-related-card div { padding: 20px; }
.ms-related-card span { color: #0d9488; font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.ms-related-card h3 { margin: 8px 0; color: #0f172a; font-size: 20px; line-height: 1.25; }
.ms-related-card p { margin: 0; color: #64748b; line-height: 1.65; }
.ms-muted { color: #64748b; }
@media (max-width: 1080px) {
  .ms-single-layout { grid-template-columns: 1fr; }
  .ms-single-sidebar { position: static; }
  .ms-related-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .ms-single-shell { padding: 24px 12px 52px; }
  .ms-single-article { border-radius: 22px; }
  .ms-single-author-card { align-items: flex-start; flex-direction: column; }
  .ms-section-heading-row { align-items: flex-start; flex-direction: column; }
}


/* =============================================================
   v42 FINAL UI + NAVIGATION STABILITY PASS
   Keeps live-server header/footer menus readable, complete and safe.
   ============================================================= */
.ms-header,
#ms-header {
    height: 70px !important;
    min-height: 70px !important;
    overflow: visible !important;
    background: rgba(255, 253, 248, 0.96) !important;
    border-bottom: 1px solid rgba(20, 45, 50, 0.10) !important;
    box-shadow: 0 10px 32px rgba(16, 35, 45, 0.08) !important;
    backdrop-filter: blur(18px) saturate(1.12) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.12) !important;
}

.admin-bar .ms-header,
.admin-bar #ms-header {
    top: 32px !important;
}

.ms-nav-container,
#ms-header .ms-nav-container {
    display: grid !important;
    grid-template-columns: minmax(158px, max-content) minmax(0, 1fr) max-content !important;
    align-items: center !important;
    gap: clamp(10px, 1vw, 18px) !important;
    width: 100% !important;
    max-width: min(100%, 1680px) !important;
    height: 70px !important;
    margin: 0 auto !important;
    padding: 0 clamp(14px, 1.8vw, 28px) !important;
    overflow: visible !important;
}

.ms-logo {
    grid-column: 1 !important;
    min-width: 0 !important;
    max-width: 190px !important;
    margin: 0 !important;
    color: #102027 !important;
}
.ms-logo-text {
    color: #102027 !important;
    font-weight: 950 !important;
    font-size: clamp(14px, 0.95vw, 16px) !important;
}

.ms-primary-nav,
#ms-primary-nav {
    grid-column: 2 !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
    transform: none !important;
}

.ms-primary-nav > .ms-nav-list,
#ms-primary-nav > .ms-nav-list {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: clamp(7px, 0.62vw, 13px) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.ms-primary-nav > .ms-nav-list > .menu-item,
#ms-primary-nav > .ms-nav-list > .menu-item {
    position: relative !important;
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.ms-primary-nav > .ms-nav-list > .menu-item > a,
#ms-primary-nav > .ms-nav-list > .menu-item > a,
#ms-primary-nav .ms-nav-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 36px !important;
    padding: 0 clamp(7px, 0.55vw, 11px) !important;
    border-radius: 999px !important;
    color: #12232e !important;
    background: transparent !important;
    font-size: clamp(12px, 0.76vw, 13.4px) !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: -0.015em !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    transition: color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.ms-primary-nav > .ms-nav-list > .menu-item > a:hover,
#ms-primary-nav > .ms-nav-list > .menu-item > a:hover,
#ms-primary-nav .ms-nav-link:hover {
    color: #0f766e !important;
    background: rgba(15, 118, 110, 0.08) !important;
    transform: translateY(-1px) !important;
}

#ms-primary-nav .current-menu-item > a,
#ms-primary-nav .current-menu-parent > a,
#ms-primary-nav .current-menu-ancestor > a,
#ms-primary-nav .ms-nav-active > a,
#ms-primary-nav a[aria-current="page"] {
    color: #0f766e !important;
    background: linear-gradient(135deg, rgba(15,118,110,.12), rgba(168,85,247,.10)) !important;
    box-shadow: inset 0 0 0 1px rgba(15,118,110,.13) !important;
}

.ms-primary-nav > .ms-nav-list > .menu-item-has-children > a::after,
#ms-primary-nav > .ms-nav-list > .menu-item-has-children > a::after {
    content: "" !important;
    position: static !important;
    display: inline-block !important;
    width: 6px !important;
    height: 6px !important;
    margin: -3px 0 0 5px !important;
    border: 0 !important;
    border-right: 1.6px solid currentColor !important;
    border-bottom: 1.6px solid currentColor !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: rotate(45deg) !important;
    opacity: .72 !important;
}

.ms-primary-nav > .ms-nav-list > .menu-item-has-children:hover > a::after,
.ms-primary-nav > .ms-nav-list > .menu-item-has-children:focus-within > a::after,
.ms-primary-nav > .ms-nav-list > .menu-item-has-children.ms-dropdown-open > a::after {
    transform: rotate(225deg) !important;
    margin-top: 3px !important;
}

.ms-primary-nav .sub-menu,
#ms-primary-nav .sub-menu {
    position: absolute !important;
    top: calc(100% + 12px) !important;
    left: 50% !important;
    z-index: 99999 !important;
    display: block !important;
    min-width: 250px !important;
    width: max-content !important;
    max-width: min(340px, 86vw) !important;
    margin: 0 !important;
    padding: 8px !important;
    list-style: none !important;
    background: #fffdf8 !important;
    border: 1px solid rgba(20, 45, 50, 0.12) !important;
    border-radius: 16px !important;
    box-shadow: 0 24px 58px rgba(16, 35, 45, 0.14) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateX(-50%) translateY(8px) !important;
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease !important;
}

.ms-primary-nav > .ms-nav-list > .menu-item-has-children:hover > .sub-menu,
.ms-primary-nav > .ms-nav-list > .menu-item-has-children:focus-within > .sub-menu,
.ms-primary-nav > .ms-nav-list > .menu-item-has-children.ms-dropdown-open > .sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(-50%) translateY(0) !important;
}

.ms-primary-nav .sub-menu .menu-item,
#ms-primary-nav .sub-menu .menu-item {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ms-primary-nav .sub-menu .menu-item > a,
#ms-primary-nav .sub-menu .menu-item > a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 38px !important;
    padding: 10px 12px !important;
    border-radius: 11px !important;
    color: #334155 !important;
    background: transparent !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.ms-primary-nav .sub-menu .menu-item > a:hover,
#ms-primary-nav .sub-menu .menu-item > a:hover {
    color: #0f766e !important;
    background: rgba(15, 118, 110, 0.08) !important;
    transform: none !important;
}

.ms-nav-actions {
    grid-column: 3 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    min-width: max-content !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

.ms-nav-actions .ms-icon-btn,
.ms-nav-actions .ms-btn,
.ms-nav-actions .rs-switcher,
.rs-switcher {
    flex: 0 0 auto !important;
}

.ms-nav-actions .ms-icon-btn {
    width: 36px !important;
    height: 36px !important;
    color: #102027 !important;
    background: #ffffff !important;
    border: 1px solid rgba(20, 45, 50, 0.12) !important;
}

.ms-nav-actions .ms-btn-outline {
    min-height: 36px !important;
    padding: 0 13px !important;
    color: #0f766e !important;
    background: rgba(255,255,255,.76) !important;
    border: 1px solid rgba(15,118,110,.22) !important;
    font-size: 12.5px !important;
    font-weight: 850 !important;
}

.rs-switcher,
.ms-nav-actions .rs-switcher {
    min-width: 118px !important;
    height: 36px !important;
    padding: 0 8px !important;
    background: rgba(255,255,255,.86) !important;
    border: 1px solid rgba(20, 45, 50, .12) !important;
    border-radius: 999px !important;
    box-shadow: 0 8px 20px rgba(16,35,45,.06) !important;
}

.rs-select {
    max-width: 92px !important;
    color: #102027 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.ms-hamburger {
    width: 40px !important;
    height: 40px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid rgba(20,45,50,.14) !important;
}
.ms-hamburger-bar {
    background: #102027 !important;
}

@media (min-width: 1440px) and (max-width: 1590px) {
    .ms-nav-container,
    #ms-header .ms-nav-container {
        grid-template-columns: minmax(150px, max-content) minmax(0, 1fr) max-content !important;
        gap: 8px !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    .ms-primary-nav > .ms-nav-list,
    #ms-primary-nav > .ms-nav-list {
        gap: 6px !important;
    }
    .ms-primary-nav > .ms-nav-list > .menu-item > a,
    #ms-primary-nav > .ms-nav-list > .menu-item > a,
    #ms-primary-nav .ms-nav-link {
        padding-left: 7px !important;
        padding-right: 7px !important;
        font-size: 12.2px !important;
    }
    .ms-nav-actions .ms-btn-outline {
        display: none !important;
    }
    .rs-switcher,
    .ms-nav-actions .rs-switcher {
        min-width: 104px !important;
    }
}

@media (max-width: 1439px) {
    .ms-header,
    #ms-header {
        height: 70px !important;
        min-height: 70px !important;
    }
    .ms-nav-container,
    #ms-header .ms-nav-container {
        display: flex !important;
        justify-content: space-between !important;
        height: 70px !important;
    }
    .ms-primary-nav,
    #ms-primary-nav {
        position: fixed !important;
        top: 70px !important;
        right: 0 !important;
        left: auto !important;
        bottom: 0 !important;
        display: none !important;
        width: min(360px, 88vw) !important;
        height: calc(100vh - 70px) !important;
        padding: 20px !important;
        background: rgba(255, 253, 248, 0.99) !important;
        border-left: 1px solid rgba(20, 45, 50, 0.12) !important;
        box-shadow: -22px 0 56px rgba(16,35,45,.13) !important;
        overflow-y: auto !important;
        transform: translateX(100%) !important;
        z-index: 1001 !important;
    }
    .admin-bar .ms-primary-nav,
    .admin-bar #ms-primary-nav {
        top: 102px !important;
        height: calc(100vh - 102px) !important;
    }
    .ms-primary-nav.is-open,
    #ms-primary-nav.is-open {
        display: block !important;
        transform: translateX(0) !important;
    }
    .ms-primary-nav > .ms-nav-list,
    #ms-primary-nav > .ms-nav-list {
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 5px !important;
    }
    .ms-primary-nav > .ms-nav-list > .menu-item,
    #ms-primary-nav > .ms-nav-list > .menu-item {
        display: block !important;
        width: 100% !important;
    }
    .ms-primary-nav > .ms-nav-list > .menu-item > a,
    #ms-primary-nav > .ms-nav-list > .menu-item > a,
    #ms-primary-nav .ms-nav-link {
        width: 100% !important;
        min-height: 44px !important;
        justify-content: space-between !important;
        padding: 0 13px !important;
        color: #102027 !important;
        font-size: 14px !important;
    }
    .ms-primary-nav .sub-menu,
    #ms-primary-nav .sub-menu {
        position: static !important;
        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 4px 0 10px !important;
        padding: 5px 0 5px 12px !important;
        background: transparent !important;
        border: 0 !important;
        border-left: 2px solid rgba(15,118,110,.22) !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
    }
    .ms-primary-nav .menu-item-has-children.mobile-dropdown-open > .sub-menu,
    #ms-primary-nav .menu-item-has-children.mobile-dropdown-open > .sub-menu {
        display: block !important;
    }
    .ms-primary-nav .sub-menu .menu-item > a,
    #ms-primary-nav .sub-menu .menu-item > a {
        min-height: 38px !important;
        padding: 0 12px !important;
        color: #475569 !important;
        font-size: 13px !important;
        white-space: normal !important;
    }
    .ms-hamburger {
        display: flex !important;
    }
    .ms-nav-actions .ms-icon-btn,
    .ms-nav-actions .ms-btn-outline {
        display: none !important;
    }
    .ms-mobile-overlay.is-visible {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}

@media (max-width: 782px) {
    .admin-bar .ms-header,
    .admin-bar #ms-header {
        top: 46px !important;
    }
    .admin-bar .ms-primary-nav,
    .admin-bar #ms-primary-nav {
        top: 116px !important;
        height: calc(100vh - 116px) !important;
    }
}

@media (max-width: 520px) {
    .ms-logo {
        max-width: 152px !important;
    }
    .ms-logo-text {
        max-width: 112px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    .rs-switcher,
    .ms-nav-actions .rs-switcher {
        min-width: 86px !important;
        width: 86px !important;
    }
    .rs-select {
        max-width: 58px !important;
    }
}

.ms-site-footer--full-sync {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    border-top: 1px solid rgba(15, 23, 42, 0.08) !important;
    color: #334155 !important;
}
.ms-footer-sync-grid {
    align-items: start !important;
}
.ms-footer-link-group a {
    overflow-wrap: anywhere !important;
}


/* =============================================================
   V43 STRICT SCREENSHOT HEADER LOCK
   Required order: Home, Find Monitor, Compare, Trending,
   Monitor Battles, Blog, Community Requests, Brands We Track,
   Warranty Claim, Suggest a Monitor or Brand, Free Tools.
   ============================================================= */
#ms-header.ms-header {
    height: 60px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    border-bottom: 1px solid rgba(22, 35, 61, 0.08) !important;
    box-shadow: 0 10px 30px rgba(23, 35, 64, 0.08) !important;
    overflow: visible !important;
}

#ms-header .ms-nav-container {
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr) max-content !important;
    align-items: center !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 1780px !important;
    height: 60px !important;
    margin: 0 auto !important;
    padding: 0 42px !important;
    background: transparent !important;
    overflow: visible !important;
}

#ms-header .ms-logo {
    grid-column: 1 !important;
    margin: 0 !important;
    gap: 8px !important;
    max-width: none !important;
    min-width: max-content !important;
    white-space: nowrap !important;
}

#ms-header .ms-logo-icon svg {
    width: 28px !important;
    height: 22px !important;
}

#ms-header .ms-logo-text {
    font-size: 17px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: -0.35px !important;
    color: #111827 !important;
}

#ms-header .ms-primary-nav {
    grid-column: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 60px !important;
    overflow: visible !important;
}

#ms-header .ms-primary-nav > .ms-nav-list,
#ms-header #ms-primary-menu.ms-nav-list {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: clamp(9px, 0.78vw, 15px) !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    overflow: visible !important;
}

#ms-header .ms-primary-nav > .ms-nav-list > .menu-item,
#ms-header #ms-primary-menu > .menu-item {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#ms-header .ms-primary-nav > .ms-nav-list > .menu-item > a,
#ms-header #ms-primary-menu > .menu-item > a,
#ms-header .ms-nav-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 34px !important;
    padding: 8px 0 !important;
    font-size: clamp(12px, 0.76vw, 14px) !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    letter-spacing: -0.18px !important;
    color: #111827 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    border-radius: 999px !important;
}

#ms-header .ms-primary-nav > .ms-nav-list > .current-menu-item > a,
#ms-header .ms-primary-nav > .ms-nav-list > .ms-nav-active > a,
#ms-header #ms-primary-menu > .current-menu-item > a,
#ms-header #ms-primary-menu > .ms-nav-active > a {
    color: #0f766e !important;
    background: rgba(20, 184, 166, 0.12) !important;
    box-shadow: inset 0 -2px 0 #f97316 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
}

#ms-header .ms-primary-nav > .ms-nav-list > .menu-item > a:hover,
#ms-header #ms-primary-menu > .menu-item > a:hover {
    color: #0f766e !important;
}

#ms-header .ms-primary-nav > .ms-nav-list > .menu-item-has-children > a::after,
#ms-header #ms-primary-menu > .menu-item-has-children > a::after {
    content: "" !important;
    display: inline-block !important;
    width: 6px !important;
    height: 6px !important;
    margin-left: 7px !important;
    border-right: 1.5px solid #fb7185 !important;
    border-bottom: 1.5px solid #fb7185 !important;
    transform: rotate(45deg) translateY(-1px) !important;
    opacity: 1 !important;
}

#ms-header .ms-primary-nav .sub-menu {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;
    left: auto !important;
    z-index: 99999 !important;
    min-width: 280px !important;
    width: max-content !important;
    max-width: 360px !important;
    margin: 0 !important;
    padding: 8px !important;
    list-style: none !important;
    background: #ffffff !important;
    border: 1px solid rgba(22, 35, 61, 0.10) !important;
    border-radius: 14px !important;
    box-shadow: 0 22px 60px rgba(15, 23, 42, 0.14) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(8px) !important;
    transition: opacity 0.18s ease, visibility 0.18s ease, transform 0.18s ease !important;
}

@media (min-width: 1541px) {
    #ms-header .ms-primary-nav > .ms-nav-list > .menu-item-has-children:hover > .sub-menu,
    #ms-header .ms-primary-nav > .ms-nav-list > .menu-item-has-children:focus-within > .sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateY(0) !important;
    }
}

#ms-header .ms-primary-nav .sub-menu .menu-item,
#ms-header .ms-primary-nav .sub-menu li {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#ms-header .ms-primary-nav .sub-menu .menu-item a,
#ms-header .ms-primary-nav .sub-menu li a {
    display: block !important;
    width: 100% !important;
    padding: 11px 14px !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    line-height: 1.25 !important;
    color: #111827 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    border-radius: 10px !important;
    background: transparent !important;
}

#ms-header .ms-primary-nav .sub-menu .menu-item a:hover,
#ms-header .ms-primary-nav .sub-menu li a:hover {
    color: #0f766e !important;
    background: rgba(20, 184, 166, 0.10) !important;
}

#ms-header .ms-nav-actions {
    grid-column: 3 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    min-width: max-content !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

#ms-header .ms-icon-btn {
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    color: #111827 !important;
    background: #ffffff !important;
    border: 1px solid rgba(22, 35, 61, 0.12) !important;
    box-shadow: 0 8px 20px rgba(23, 35, 64, 0.08) !important;
}

#ms-header .ms-btn-outline {
    height: 36px !important;
    padding: 0 14px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    color: #111827 !important;
    background: #ffffff !important;
    border: 1px solid rgba(22, 35, 61, 0.12) !important;
    box-shadow: 0 8px 20px rgba(23, 35, 64, 0.08) !important;
}

#ms-header .rs-switcher {
    height: 36px !important;
    min-width: 108px !important;
    max-width: 120px !important;
    padding: 0 10px !important;
    border-radius: 12px !important;
    color: #111827 !important;
    background: #ffffff !important;
    border: 1px solid rgba(22, 35, 61, 0.12) !important;
    box-shadow: 0 8px 20px rgba(23, 35, 64, 0.08) !important;
}

#ms-header .rs-select {
    font-size: 12.5px !important;
    font-weight: 800 !important;
    color: #7c3aed !important;
}

#ms-header .ms-hamburger {
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    border-radius: 12px !important;
}

@media (max-width: 1760px) and (min-width: 1541px) {
    #ms-header .ms-nav-container {
        gap: 12px !important;
        padding: 0 24px !important;
    }
    #ms-header .ms-primary-nav > .ms-nav-list,
    #ms-header #ms-primary-menu.ms-nav-list {
        gap: 9px !important;
    }
    #ms-header .ms-primary-nav > .ms-nav-list > .menu-item > a,
    #ms-header #ms-primary-menu > .menu-item > a,
    #ms-header .ms-nav-link {
        font-size: 12.2px !important;
        letter-spacing: -0.25px !important;
    }
    #ms-header .ms-logo-text {
        font-size: 16px !important;
    }
    #ms-header .ms-btn-outline {
        padding: 0 11px !important;
        font-size: 12px !important;
    }
    #ms-header .rs-switcher {
        min-width: 100px !important;
        max-width: 106px !important;
        padding: 0 8px !important;
    }
}

@media (max-width: 1640px) and (min-width: 1541px) {
    #ms-header .ms-nav-container {
        padding: 0 18px !important;
        gap: 10px !important;
    }
    #ms-header .ms-primary-nav > .ms-nav-list,
    #ms-header #ms-primary-menu.ms-nav-list {
        gap: 7px !important;
    }
    #ms-header .ms-btn-outline {
        display: none !important;
    }
}

@media (max-width: 1540px) {
    #ms-header .ms-nav-container {
        display: flex !important;
        justify-content: space-between !important;
        padding: 0 22px !important;
    }

    #ms-header .ms-primary-nav {
        position: fixed !important;
        top: 60px !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: min(380px, 88vw) !important;
        height: calc(100vh - 60px) !important;
        display: none !important;
        padding: 22px !important;
        background: rgba(255, 255, 255, 0.98) !important;
        border-left: 1px solid rgba(22, 35, 61, 0.10) !important;
        box-shadow: -24px 0 60px rgba(15, 23, 42, 0.14) !important;
        overflow-y: auto !important;
        transform: translateX(100%) !important;
        transition: transform 0.25s ease !important;
        z-index: 1001 !important;
    }

    #ms-header .ms-primary-nav.is-open {
        display: block !important;
        transform: translateX(0) !important;
    }

    #ms-header .ms-primary-nav > .ms-nav-list,
    #ms-header #ms-primary-menu.ms-nav-list {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 5px !important;
        width: 100% !important;
        max-width: none !important;
    }

    #ms-header .ms-primary-nav > .ms-nav-list > .menu-item,
    #ms-header #ms-primary-menu > .menu-item {
        width: 100% !important;
    }

    #ms-header .ms-primary-nav > .ms-nav-list > .menu-item > a,
    #ms-header #ms-primary-menu > .menu-item > a {
        width: 100% !important;
        justify-content: space-between !important;
        min-height: 42px !important;
        padding: 12px 12px !important;
        font-size: 14px !important;
        border-radius: 12px !important;
    }

    #ms-header .ms-primary-nav .sub-menu {
        position: static !important;
        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 4px 0 8px !important;
        padding: 4px 0 4px 12px !important;
        background: transparent !important;
        border: 0 !important;
        border-left: 2px solid rgba(20, 184, 166, 0.35) !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
    }

    #ms-header .ms-primary-nav .menu-item-has-children.mobile-open > .sub-menu,
    #ms-header .ms-primary-nav .menu-item-has-children.mobile-dropdown-open > .sub-menu {
        display: block !important;
    }

    #ms-header .ms-hamburger {
        display: flex !important;
    }

    #ms-header .ms-icon-btn,
    #ms-header .ms-btn-outline {
        display: none !important;
    }
}


/* =============================================================
   V44 BRAND LOGO + FAVICON IMPLEMENTATION
   ============================================================= */
#ms-header .ms-logo {
    width: 160px !important;
    max-width: 160px !important;
    min-width: 160px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    overflow: visible !important;
}

#ms-header .ms-logo-image {
    display: block !important;
    width: 160px !important;
    max-width: 160px !important;
    height: auto !important;
    aspect-ratio: 240 / 43 !important;
    object-fit: contain !important;
    object-position: left center !important;
    flex: 0 0 auto !important;
}

#ms-header .ms-logo-icon,
#ms-header .ms-logo-text {
    display: none !important;
}

@media (max-width: 1760px) and (min-width: 1541px) {
    #ms-header .ms-logo {
        width: 150px !important;
        max-width: 150px !important;
        min-width: 150px !important;
    }
    #ms-header .ms-logo-image {
        width: 150px !important;
        max-width: 150px !important;
    }
}

@media (max-width: 1640px) and (min-width: 1541px) {
    #ms-header .ms-logo {
        width: 142px !important;
        max-width: 142px !important;
        min-width: 142px !important;
    }
    #ms-header .ms-logo-image {
        width: 142px !important;
        max-width: 142px !important;
    }
}

@media (max-width: 768px) {
    #ms-header .ms-logo {
        width: 152px !important;
        max-width: 152px !important;
        min-width: 152px !important;
    }
    #ms-header .ms-logo-image {
        width: 152px !important;
        max-width: 152px !important;
    }
}

@media (max-width: 380px) {
    #ms-header .ms-logo {
        width: 138px !important;
        max-width: 138px !important;
        min-width: 138px !important;
    }
    #ms-header .ms-logo-image {
        width: 138px !important;
        max-width: 138px !important;
    }
}


/* V44 Footer brand logo image */
.ms-footer-logo-link {
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
    margin: 0 0 14px !important;
    max-width: 230px !important;
}

.ms-footer-logo-image {
    display: block !important;
    width: 220px !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.ms-footer-logo-link:hover {
    opacity: 0.9 !important;
}

@media (max-width: 768px) {
    .ms-footer-logo-link {
        max-width: 210px !important;
    }
    .ms-footer-logo-image {
        width: 205px !important;
    }
}

/* v45 AdSense readiness: cookie/privacy notice */
.ms-cookie-notice {
    position: fixed;
    left: 18px;
    right: 18px;
    bottom: 18px;
    z-index: 99999;
    max-width: 960px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border: 1px solid rgba(17, 24, 39, 0.10);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.18);
    backdrop-filter: blur(14px);
}
.ms-cookie-notice[hidden] { display: none !important; }
.ms-cookie-notice__body strong {
    display: block;
    color: #0f172a;
    font-weight: 800;
    margin-bottom: 2px;
}
.ms-cookie-notice__body p {
    margin: 0;
    color: #475569;
    font-size: 13px;
    line-height: 1.45;
}
.ms-cookie-notice__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.ms-cookie-notice__actions a {
    color: #0f766e;
    font-weight: 700;
    font-size: 13px;
    text-decoration: none;
}
.ms-cookie-notice__actions button {
    border: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, #0f172a, #14b8a6);
    color: #fff;
    cursor: pointer;
    font-weight: 800;
    padding: 9px 15px;
}
@media (max-width: 720px) {
    .ms-cookie-notice {
        align-items: flex-start;
        flex-direction: column;
        left: 12px;
        right: 12px;
        bottom: 12px;
    }
    .ms-cookie-notice__actions {
        flex-wrap: wrap;
    }
}

/* =============================================================
   V46 GLOBAL BUTTON COLOR UNIFICATION
   Request: all non-Amazon website buttons must match the homepage
   "Find Your Monitor" hero CTA. Amazon/retailer buttons stay yellow.
   ============================================================= */
:root {
    --ms-cta-green-1: #0f766e;
    --ms-cta-green-2: #13a79a;
    --ms-cta-green-3: #0b5f58;
    --ms-cta-green-hover-1: #0b5f58;
    --ms-cta-green-hover-2: #0f8f84;
    --ms-cta-green-hover-3: #094f49;
    --ms-cta-shadow: rgba(15, 118, 110, 0.22);
    --ms-cta-shadow-hover: rgba(15, 118, 110, 0.30);
    --ms-amazon-yellow-1: #ffb020;
    --ms-amazon-yellow-2: #ff9800;
    --ms-amazon-yellow-hover-1: #f59e0b;
    --ms-amazon-yellow-hover-2: #f97316;
}

/* Primary action buttons across templates, forms, finder, compare, legal pages and utility blocks. */
body :is(
    .ms-hero-v2__btn--primary,
    .ms-btn-primary,
    .ms-btn-secondary,
    .ms-btn-outline,
    .ms-filter-submit,
    .ms-submit-btn,
    .ms-button,
    .button-primary,
    .wp-block-button__link,
    .btn-compare,
    .ms-compare-btn,
    .ecb-btn,
    .dcc-btn,
    .dcc-btn--primary,
    .dcc-btn--secondary,
    .lc-btn,
    .lgr-btn,
    .lc-view-all,
    .lgr-view-all,
    .view-more-btn,
    .page-placeholder__btn,
    .ms-support-btn,
    .ms-community-btn,
    .fm-clear-btn,
    .ms-cookie-notice__actions button,
    button[type="submit"],
    input[type="submit"]
):not(.ms-icon-btn):not(.ms-hamburger):not(.ms-nav-link):not(.rs-switcher):not(.rs-select):not(.ms-amazon-btn):not(.amazon-btn):not(.cmp-btn-amazon):not(.ms-card-amazon) {
    background: linear-gradient(135deg, var(--ms-cta-green-1) 0%, var(--ms-cta-green-2) 58%, var(--ms-cta-green-3) 100%) !important;
    background-image: linear-gradient(135deg, var(--ms-cta-green-1) 0%, var(--ms-cta-green-2) 58%, var(--ms-cta-green-3) 100%) !important;
    background-color: var(--ms-cta-green-1) !important;
    border-color: rgba(15, 118, 110, 0.30) !important;
    color: #ffffff !important;
    text-shadow: none !important;
    box-shadow: 0 14px 30px var(--ms-cta-shadow) !important;
}

body :is(
    .ms-hero-v2__btn--primary,
    .ms-btn-primary,
    .ms-btn-secondary,
    .ms-btn-outline,
    .ms-filter-submit,
    .ms-submit-btn,
    .ms-button,
    .button-primary,
    .wp-block-button__link,
    .btn-compare,
    .ms-compare-btn,
    .ecb-btn,
    .dcc-btn,
    .dcc-btn--primary,
    .dcc-btn--secondary,
    .lc-btn,
    .lgr-btn,
    .lc-view-all,
    .lgr-view-all,
    .view-more-btn,
    .page-placeholder__btn,
    .ms-support-btn,
    .ms-community-btn,
    .fm-clear-btn,
    .ms-cookie-notice__actions button,
    button[type="submit"],
    input[type="submit"]
):not(.ms-icon-btn):not(.ms-hamburger):not(.ms-nav-link):not(.rs-switcher):not(.rs-select):not(.ms-amazon-btn):not(.amazon-btn):not(.cmp-btn-amazon):not(.ms-card-amazon):hover {
    background: linear-gradient(135deg, var(--ms-cta-green-hover-1) 0%, var(--ms-cta-green-hover-2) 60%, var(--ms-cta-green-hover-3) 100%) !important;
    background-image: linear-gradient(135deg, var(--ms-cta-green-hover-1) 0%, var(--ms-cta-green-hover-2) 60%, var(--ms-cta-green-hover-3) 100%) !important;
    background-color: var(--ms-cta-green-hover-1) !important;
    border-color: rgba(15, 118, 110, 0.42) !important;
    color: #ffffff !important;
    box-shadow: 0 18px 38px var(--ms-cta-shadow-hover) !important;
    transform: translateY(-1px);
}

/* Cookie popup polish: the OK button now exactly follows the main site CTA color system. */
.ms-cookie-notice__actions button[data-ms-cookie-accept] {
    min-width: 54px !important;
    height: 36px !important;
    padding: 0 17px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
}

.ms-cookie-notice__actions a:hover {
    color: var(--ms-cta-green-3) !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* v51 public SEO/UI polish: reduce header crowding and keep the cookie notice from hiding primary content. */
@media (min-width: 1181px) {
    #ms-header #ms-primary-menu > .ms-nav-home-link {
        display: none !important;
    }

    #ms-header .ms-nav-container {
        gap: clamp(18px, 1.4vw, 30px) !important;
    }

    #ms-header .ms-primary-nav > .ms-nav-list,
    #ms-header #ms-primary-menu.ms-nav-list {
        gap: clamp(10px, 0.72vw, 14px) !important;
    }
}

@media (min-width: 1541px) {
    #ms-header .ms-logo {
        padding-right: 8px !important;
    }
}

.ms-cookie-notice {
    max-width: min(860px, calc(100vw - 36px)) !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
}

.ms-cookie-notice__body p {
    max-width: 640px !important;
}

@media (max-width: 720px) {
    .ms-cookie-notice {
        left: 14px !important;
        right: 14px !important;
        bottom: 14px !important;
        gap: 10px !important;
        max-height: 34vh !important;
        overflow: auto !important;
        padding: 12px 14px !important;
    }

    .ms-cookie-notice__body p {
        font-size: 12.5px !important;
        line-height: 1.4 !important;
    }

    .ms-cookie-notice__actions {
        width: 100% !important;
        justify-content: space-between !important;
        gap: 8px !important;
    }
}

/* v52 Free Tools menu polish: clearer desktop panel and cleaner mobile accordion. */
#ms-header .ms-nav-free-tools > .ms-nav-parent-link,
#ms-header .ms-nav-free-tools > a {
    gap: 7px !important;
}

@media (min-width: 992px) {
    #ms-header .ms-nav-free-tools > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools > .sub-menu {
        width: min(380px, calc(100vw - 48px)) !important;
        min-width: 340px !important;
        max-width: 380px !important;
        gap: 8px !important;
        padding: 12px !important;
        border-radius: 18px !important;
        background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,250,.98)) !important;
        border-color: rgba(15,118,110,.14) !important;
        box-shadow: 0 22px 56px rgba(15,23,42,.16) !important;
    }

    #ms-header .ms-nav-free-tools > .sub-menu > .menu-item > a,
    #ms-primary-nav .ms-nav-free-tools > .sub-menu > .menu-item > a {
        grid-template-columns: 38px minmax(0, 1fr) !important;
        min-height: 58px !important;
        padding: 10px 12px !important;
        border-radius: 14px !important;
        background: #ffffff !important;
        border: 1px solid rgba(15,118,110,.10) !important;
        box-shadow: 0 8px 20px rgba(15,23,42,.05) !important;
        transition: background .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease !important;
    }

    #ms-header .ms-nav-free-tools > .sub-menu > .menu-item > a:hover,
    #ms-header .ms-nav-free-tools > .sub-menu > .menu-item > a:focus-visible,
    #ms-primary-nav .ms-nav-free-tools > .sub-menu > .menu-item > a:hover,
    #ms-primary-nav .ms-nav-free-tools > .sub-menu > .menu-item > a:focus-visible {
        background: #f4fffc !important;
        border-color: rgba(15,118,110,.24) !important;
        box-shadow: 0 14px 28px rgba(15,118,110,.12) !important;
        transform: translateY(-1px) !important;
    }
}

#ms-header .ms-nav-free-tools .sub-menu > .menu-item > a::before,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a::before {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #0f766e !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    background: linear-gradient(135deg, rgba(15,118,110,.12), rgba(20,184,166,.08)), #f8fafc !important;
}

#ms-header .ms-nav-free-tools .sub-menu > .menu-item:nth-child(1) > a::before,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item:nth-child(1) > a::before {
    content: "PPI" !important;
    font-size: 10px !important;
}

#ms-header .ms-nav-free-tools .sub-menu > .menu-item:nth-child(2) > a::before,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item:nth-child(2) > a::before {
    content: "Hz" !important;
    font-size: 12px !important;
}

#ms-header .ms-nav-free-tools .sub-menu > .menu-item:nth-child(3) > a::before,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item:nth-child(3) > a::before {
    content: "OLED" !important;
    font-size: 9px !important;
}

#ms-header .ms-nav-free-tools .sub-menu > .menu-item:nth-child(4) > a::before,
#ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item:nth-child(4) > a::before {
    content: "Guide" !important;
    font-size: 9px !important;
}

@media (max-width: 991px) {
    #ms-header .ms-nav-free-tools > .ms-nav-parent-link,
    #ms-header .ms-nav-free-tools > a,
    #ms-primary-nav .ms-nav-free-tools > .ms-nav-parent-link,
    #ms-primary-nav .ms-nav-free-tools > a {
        min-height: 50px !important;
        padding: 12px 14px !important;
        background: #ffffff !important;
        border-color: rgba(15,118,110,.16) !important;
        box-shadow: 0 8px 22px rgba(15,23,42,.05) !important;
    }

    #ms-header .ms-nav-free-tools > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools > .sub-menu {
        margin-top: 10px !important;
        padding: 9px !important;
        border-radius: 16px !important;
        background: #f8fcfb !important;
    }

    #ms-header .ms-nav-free-tools .sub-menu > .menu-item > a,
    #ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a {
        grid-template-columns: 34px minmax(0, 1fr) !important;
        min-height: 50px !important;
        padding: 10px 11px !important;
        border: 1px solid rgba(15,118,110,.10) !important;
        box-shadow: none !important;
    }
}

/* Keep secondary hero button consistent with the request instead of white/outline styling. */
body.home #ms-hero .ms-hero-v2__btn--secondary,
#ms-hero .ms-hero-v2__btn--secondary {
    background: linear-gradient(135deg, var(--ms-cta-green-1) 0%, var(--ms-cta-green-2) 58%, var(--ms-cta-green-3) 100%) !important;
    background-image: linear-gradient(135deg, var(--ms-cta-green-1) 0%, var(--ms-cta-green-2) 58%, var(--ms-cta-green-3) 100%) !important;
    color: #ffffff !important;
    border-color: rgba(15, 118, 110, 0.30) !important;
    box-shadow: 0 14px 30px var(--ms-cta-shadow) !important;
}

/* Amazon and Amazon-shortlink buttons must remain yellow, even when they also have generic button classes. */
body :is(
    .ms-amazon-btn,
    .amazon-btn,
    .cmp-btn-amazon,
    .ms-card-amazon,
    .single-monitor a[href*="amazon."],
    .single-monitor a[href*="amzn.to"],
    .ms-global-card a[href*="amazon."],
    .ms-global-card a[href*="amzn.to"],
    a[href*="amazon."][rel*="sponsored"],
    a[href*="amzn.to"][rel*="sponsored"],
    a[href*="amazon."].ms-btn,
    a[href*="amazon."].ms-button,
    a[href*="amazon."].button,
    a[href*="amzn.to"].ms-btn,
    a[href*="amzn.to"].ms-button,
    a[href*="amzn.to"].button
) {
    background: linear-gradient(135deg, var(--ms-amazon-yellow-1) 0%, var(--ms-amazon-yellow-2) 100%) !important;
    background-image: linear-gradient(135deg, var(--ms-amazon-yellow-1) 0%, var(--ms-amazon-yellow-2) 100%) !important;
    background-color: var(--ms-amazon-yellow-1) !important;
    border-color: rgba(245, 158, 11, 0.58) !important;
    color: #102027 !important;
    text-shadow: none !important;
    box-shadow: 0 14px 30px rgba(245, 158, 11, 0.22) !important;
}

body :is(
    .ms-amazon-btn,
    .amazon-btn,
    .cmp-btn-amazon,
    .ms-card-amazon,
    .single-monitor a[href*="amazon."],
    .single-monitor a[href*="amzn.to"],
    .ms-global-card a[href*="amazon."],
    .ms-global-card a[href*="amzn.to"],
    a[href*="amazon."][rel*="sponsored"],
    a[href*="amzn.to"][rel*="sponsored"],
    a[href*="amazon."].ms-btn,
    a[href*="amazon."].ms-button,
    a[href*="amazon."].button,
    a[href*="amzn.to"].ms-btn,
    a[href*="amzn.to"].ms-button,
    a[href*="amzn.to"].button
):hover {
    background: linear-gradient(135deg, var(--ms-amazon-yellow-hover-1) 0%, var(--ms-amazon-yellow-hover-2) 100%) !important;
    background-image: linear-gradient(135deg, var(--ms-amazon-yellow-hover-1) 0%, var(--ms-amazon-yellow-hover-2) 100%) !important;
    background-color: var(--ms-amazon-yellow-hover-1) !important;
    color: #102027 !important;
    box-shadow: 0 18px 36px rgba(245, 158, 11, 0.28) !important;
}



/* =============================================================
   V47 FIND MONITOR HERO CLEANUP
   Removes stray decorative overlays / ghost text behind the
   Find Monitor page heading and keeps the hero visually clean.
   ============================================================= */
body.category-find-monitor .page-header {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
    padding: clamp(74px, 8vw, 110px) 24px clamp(46px, 5vw, 68px) !important;
    background:
        radial-gradient(circle at 16% 18%, rgba(255, 107, 74, .08), transparent 28%),
        radial-gradient(circle at 84% 16%, rgba(15, 118, 110, .09), transparent 30%),
        linear-gradient(180deg, #fffdf8 0%, #f8fbf9 100%) !important;
}

body.category-find-monitor .page-header::before,
body.category-find-monitor .page-header::after,
body.category-find-monitor .page-header__inner::before,
body.category-find-monitor .page-header__inner::after,
body.category-find-monitor .page-header h1::before {
    content: none !important;
    display: none !important;
    background: none !important;
    box-shadow: none !important;
    filter: none !important;
}

body.category-find-monitor .page-header__inner {
    position: relative !important;
    z-index: 2 !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    text-align: center !important;
}

body.category-find-monitor .page-header h1 {
    position: relative !important;
    z-index: 2 !important;
    margin: 0 0 14px !important;
    color: #102027 !important;
    font-size: clamp(44px, 5vw, 74px) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.04em !important;
    font-weight: 950 !important;
    text-shadow: none !important;
}

body.category-find-monitor .page-header h1::after {
    content: "" !important;
    display: block !important;
    width: 96px !important;
    height: 4px !important;
    margin: 16px auto 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #0f766e 0%, #13a79a 55%, #7c3aed 100%) !important;
    box-shadow: none !important;
}

body.category-find-monitor .page-header p {
    position: relative !important;
    z-index: 2 !important;
    max-width: 760px !important;
    margin: 0 auto !important;
    color: #334155 !important;
    font-size: clamp(15px, 1.3vw, 18px) !important;
    line-height: 1.7 !important;
    font-weight: 700 !important;
    text-shadow: none !important;
}


/* =============================================================
   V50 HOMEPAGE HERO EMPTY-STATE POLISH
   Keeps the hero preview public-facing when no monitor posts exist.
   ============================================================= */
.ms-hero-monitor-card--fallback strong {
    color: #102027 !important;
    letter-spacing: -0.02em !important;
}
.ms-hero-monitor-card--fallback p {
    max-width: 230px !important;
    color: #334155 !important;
}
.ms-hero-monitor-card--fallback .ms-hero-monitor-card__meta span {
    white-space: nowrap !important;
}
.ms-hero-preview__scores strong {
    letter-spacing: -0.02em !important;
}
.ms-hero-trust__metric strong {
    overflow-wrap: anywhere !important;
}
@media (max-width: 1100px) {
    .ms-hero-monitor-card--fallback p {
        max-width: 100% !important;
    }
}

/* =============================================================
   V51 RESPONSIVE STABILITY LAYER
   Single source of truth for header breakpoints and mobile width.
   ============================================================= */
html,
body {
    max-width: 100% !important;
    overflow-x: clip !important;
}

body {
    overflow-x: hidden !important;
}

@media (min-width: 1181px) and (max-width: 1540px) {
    #ms-header .ms-nav-container {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: clamp(8px, 1vw, 14px) !important;
        padding: 0 clamp(16px, 1.8vw, 26px) !important;
    }

    #ms-header .ms-logo {
        flex: 0 0 clamp(132px, 10.4vw, 160px) !important;
        width: clamp(132px, 10.4vw, 160px) !important;
        min-width: clamp(132px, 10.4vw, 160px) !important;
        max-width: clamp(132px, 10.4vw, 160px) !important;
    }

    #ms-header .ms-logo-image {
        width: 100% !important;
        max-width: 100% !important;
    }

    #ms-header .ms-primary-nav {
        position: static !important;
        inset: auto !important;
        display: flex !important;
        flex: 1 1 auto !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        min-width: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: none !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        transition: none !important;
        z-index: auto !important;
    }

    #ms-header .ms-primary-nav > .ms-nav-list,
    #ms-header #ms-primary-menu.ms-nav-list {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        flex-wrap: nowrap !important;
        gap: clamp(3px, .55vw, 8px) !important;
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    #ms-header .ms-primary-nav > .ms-nav-list > .menu-item,
    #ms-header #ms-primary-menu > .menu-item {
        position: relative !important;
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 0 !important;
    }

    #ms-header .ms-primary-nav > .ms-nav-list > .menu-item > a,
    #ms-header #ms-primary-menu > .menu-item > a,
    #ms-header .ms-nav-link {
        justify-content: center !important;
        width: auto !important;
        min-height: 0 !important;
        padding: 9px clamp(3px, .46vw, 7px) !important;
        border-radius: 10px !important;
        border: 0 !important;
        font-size: clamp(10.4px, .74vw, 12.2px) !important;
        line-height: 1.12 !important;
        white-space: nowrap !important;
    }

    #ms-header .ms-primary-nav .sub-menu {
        position: absolute !important;
        top: calc(100% + 8px) !important;
        left: 50% !important;
        right: auto !important;
        bottom: auto !important;
        display: block !important;
        width: max-content !important;
        min-width: 220px !important;
        max-width: min(320px, calc(100vw - 36px)) !important;
        height: auto !important;
        margin: 0 !important;
        padding: 8px !important;
        overflow: visible !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transform: translate(-50%, 8px) !important;
        background: #ffffff !important;
        border: 1px solid rgba(22, 35, 61, 0.10) !important;
        border-radius: 14px !important;
        box-shadow: 0 20px 46px rgba(15, 23, 42, 0.14) !important;
    }

    #ms-header .ms-primary-nav .menu-item-has-children:hover > .sub-menu,
    #ms-header .ms-primary-nav .menu-item-has-children:focus-within > .sub-menu {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: translate(-50%, 0) !important;
    }

    #ms-header .ms-nav-actions {
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 8px !important;
        min-width: 0 !important;
    }

    #ms-header .ms-icon-btn,
    #ms-header .rs-switcher {
        display: inline-flex !important;
    }

    #ms-header .ms-btn-outline,
    #ms-header .ms-hamburger,
    #ms-header .ms-mobile-overlay {
        display: none !important;
    }
}

@media (min-width: 1360px) and (max-width: 1540px) {
    #ms-header .ms-btn-outline {
        display: inline-flex !important;
        padding: 0 10px !important;
        font-size: 12px !important;
    }
}

/* v53 mobile click emergency: keep the drawer overlay inert until the menu is open. */
@media (max-width: 1024px) {
    #ms-mobile-overlay,
    #ms-header .ms-mobile-overlay,
    .ms-mobile-overlay {
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    #ms-mobile-overlay.is-visible,
    #ms-header .ms-mobile-overlay.is-visible,
    .ms-mobile-overlay.is-visible {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
}

@media (max-width: 1180px) {
    #ms-header .ms-nav-container {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 clamp(14px, 4vw, 22px) !important;
        overflow: visible !important;
    }

    #ms-header .ms-primary-nav {
        position: fixed !important;
        top: var(--nav-height, 70px) !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        display: block !important;
        width: min(340px, calc(100vw - 24px)) !important;
        height: calc(100vh - var(--nav-height, 70px)) !important;
        max-width: calc(100vw - 24px) !important;
        padding: 20px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transform: translateX(105%) !important;
        transition: transform .25s ease, opacity .2s ease, visibility .2s ease !important;
        background: rgba(255, 255, 255, .98) !important;
        border-left: 1px solid rgba(22, 35, 61, .10) !important;
        box-shadow: -20px 0 48px rgba(15, 23, 42, .14) !important;
        z-index: 1001 !important;
    }

    #ms-header .ms-primary-nav.is-open {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: translateX(0) !important;
    }

    #ms-header .ms-primary-nav > .ms-nav-list,
    #ms-header #ms-primary-menu.ms-nav-list {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    #ms-header .ms-primary-nav > .ms-nav-list > .menu-item,
    #ms-header #ms-primary-menu > .menu-item,
    #ms-header .ms-primary-nav > .ms-nav-list > .menu-item > a,
    #ms-header #ms-primary-menu > .menu-item > a {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    #ms-header .ms-primary-nav .sub-menu {
        position: static !important;
        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        transform: none !important;
    }

    #ms-header .ms-primary-nav .menu-item-has-children.mobile-open > .sub-menu,
    #ms-header .ms-primary-nav .menu-item-has-children.mobile-dropdown-open > .sub-menu {
        display: block !important;
    }

    #ms-header .ms-hamburger {
        display: flex !important;
        flex: 0 0 38px !important;
    }

    #ms-header .ms-icon-btn,
    #ms-header .ms-btn-outline {
        display: none !important;
    }
}

@media (max-width: 767px) {
    *,
    *::before,
    *::after {
        min-width: 0;
    }

    .ms-container,
    .site-main,
    .content-area,
    .entry-content,
    body.home .ms-container,
    body.home .lc-inner,
    body.home .spotlight-header,
    body.home .spotlight-table,
    #ms-hero .ms-hero-inner,
    #ms-filter,
    .ms-filter-section,
    .ms-filter-card,
    .ms-filter-panel {
        width: min(100%, calc(100vw - 28px)) !important;
        max-width: calc(100vw - 28px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    #ms-hero.ms-hero {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #ms-hero .ms-hero-inner {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 28px !important;
    }

    #ms-hero .ms-hero-copy,
    #ms-hero .ms-hero-title,
    #ms-hero .ms-hero-desc {
        max-width: 100% !important;
    }

    #ms-hero .ms-hero-title {
        font-size: clamp(40px, 12vw, 56px) !important;
        overflow-wrap: anywhere !important;
    }

    #ms-hero .ms-hero-actions {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    #ms-hero .ms-hero-stats {
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    #ms-hero .ms-hero-visual {
        width: 100% !important;
        max-width: 100% !important;
        min-height: clamp(250px, 76vw, 380px) !important;
        overflow: hidden !important;
        transform: none !important;
    }

    #ms-hero .ms-hero-monitor-wrap {
        width: min(100%, 520px) !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
    }

    body.home .ms-trending-grid,
    body.home .ms-filter-results-grid,
    body.home .ms-shopcat-grid,
    .ms-trending-grid,
    .ms-filter-results-grid,
    #ms-engine-results,
    .lc-grid,
    .lgr-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    body.home .ms-global-card,
    body.home .monitor-card,
    .ms-global-card,
    .monitor-card,
    .ms-trend-card,
    .ms-shopcat-card,
    .lc-card,
    .lgr-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .ms-card-actions,
    .ms-card-footer {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .spotlight-table--three,
    body.home .spotlight-table {
        overflow-x: auto !important;
        overscroll-behavior-x: contain !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .spotlight-table--three .spotlight-row--three {
        width: max-content !important;
        min-width: 820px !important;
    }
}

@media (min-width: 768px) and (max-width: 1180px) {
    body.home .ms-trending-grid,
    body.home .ms-filter-results-grid,
    body.home .ms-shopcat-grid,
    .ms-trending-grid,
    .ms-filter-results-grid,
    #ms-engine-results,
    .lc-grid,
    .lgr-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    #ms-hero .ms-hero-inner {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    #ms-hero .ms-hero-visual {
        transform: none !important;
        overflow: hidden !important;
    }
}

/* v54 mobile presentation sweep: cards, tables, forms, and long text stay readable. */
@media (max-width: 767px) {
    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: clip !important;
    }

    .ms-container,
    .ms-wrap,
    .ms-section-inner,
    .entry-content,
    body main,
    body section {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .ms-section,
    body.home .ms-section,
    .comparison-spotlight-section {
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow-x: clip !important;
    }

    body.home .ms-trending-grid,
    body.home .ms-filter-results-grid,
    body.home .ms-shopcat-grid,
    .ms-trending-grid,
    .ms-filter-results-grid,
    #ms-engine-results,
    .ms-monitor-grid,
    .ms-results-grid,
    .lc-grid,
    .lgr-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: visible !important;
        transform: none !important;
    }

    body.home .ms-trending-grid > *,
    body.home .ms-filter-results-grid > *,
    .ms-trending-grid > *,
    .ms-filter-results-grid > *,
    #ms-engine-results > *,
    .ms-monitor-grid > *,
    .ms-results-grid > * {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        transform: none !important;
    }

    .ms-global-card,
    .ms-trend-card,
    .monitor-card,
    .product-card,
    .ms-card,
    .lc-card,
    .lgr-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
        transform: none !important;
    }

    .ms-global-card .ms-card-body,
    .ms-global-card .ms-card-footer,
    .ms-global-card .ms-card-actions,
    .ms-card-body,
    .ms-card-footer,
    .ms-card-actions {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .ms-card-rating-row,
    .ms-trend-rating-row,
    .ms-mri-badge,
    .ms-card-specs,
    .ms-card-rating-breakdown {
        flex-wrap: wrap !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .ms-mri-badge,
    .ms-mri-badge--expanded {
        align-items: flex-start !important;
        justify-content: space-between !important;
        gap: 8px !important;
    }

    .ms-mri-badge__label,
    .ms-mri-badge__score {
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-wrap: anywhere !important;
        white-space: normal !important;
    }

    .ms-card-title,
    .ms-trend-title,
    .ms-section-title,
    .ms-single-auto h1,
    .ms-hero-title,
    .ms-hero-v2__title {
        overflow-wrap: anywhere !important;
        word-break: normal !important;
        hyphens: auto !important;
        max-width: 100% !important;
    }

    .ms-section-header,
    .spotlight-header,
    .find-results-toolbar,
    .finder-toolbar,
    .results-toolbar,
    .ms-hero-actions,
    .ms-hero-v2__actions {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        width: 100% !important;
    }

    .ms-section-link,
    .btn-compare,
    .ms-btn,
    .ms-buy,
    .ms-compare,
    .ms-hero-v2__btn,
    .ms-card-secondary,
    .ms-card-compare,
    .ms-amazon-btn,
    .ms-store-offer-btn,
    button,
    input,
    select,
    textarea {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .ms-hero-v2__btn,
    .ms-btn,
    .btn-compare,
    .ms-buy,
    .ms-compare,
    .ms-section-link {
        width: 100% !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: normal !important;
    }

    table,
    .find-usecase-table,
    .ms-single-content table,
    .ms-table,
    .spec-table,
    .comparison-table,
    .ms-compare-table {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
    }

    table th,
    table td,
    .find-usecase-table th,
    .find-usecase-table td,
    .ms-table th,
    .ms-table td {
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 11px 10px !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    body.category-find-monitor .find-usecase-table,
    body.page-template-page-ppi-calculator main table,
    body.page-template-page-panel-guide main table {
        display: block !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
        background: transparent !important;
    }

    body.category-find-monitor .find-usecase-table thead,
    body.page-template-page-ppi-calculator main table thead,
    body.page-template-page-panel-guide main table thead {
        display: none !important;
    }

    body.category-find-monitor .find-usecase-table tbody,
    body.category-find-monitor .find-usecase-table tr,
    body.category-find-monitor .find-usecase-table th,
    body.category-find-monitor .find-usecase-table td,
    body.page-template-page-ppi-calculator main table tbody,
    body.page-template-page-ppi-calculator main table tr,
    body.page-template-page-ppi-calculator main table th,
    body.page-template-page-ppi-calculator main table td,
    body.page-template-page-panel-guide main table tbody,
    body.page-template-page-panel-guide main table tr,
    body.page-template-page-panel-guide main table th,
    body.page-template-page-panel-guide main table td {
        display: block !important;
        width: 100% !important;
    }

    body.category-find-monitor .find-usecase-table tr,
    body.page-template-page-ppi-calculator main table tr,
    body.page-template-page-panel-guide main table tr {
        margin: 0 0 12px !important;
        border: 1px solid rgba(15, 118, 110, .12) !important;
        border-radius: 8px !important;
        overflow: hidden !important;
        background: #ffffff !important;
    }

    body.category-find-monitor .find-usecase-table th,
    body.page-template-page-ppi-calculator main table th,
    body.page-template-page-panel-guide main table th {
        background: #f0fdfa !important;
        color: #0f766e !important;
        font-weight: 900 !important;
    }

    body.category-find-monitor .find-usecase-table td,
    body.page-template-page-ppi-calculator main table td,
    body.page-template-page-panel-guide main table td {
        border-top: 1px solid rgba(15, 23, 42, .08) !important;
        border-bottom: 0 !important;
    }

    .spotlight-table,
    .spotlight-table--three {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .spotlight-table--three .spotlight-row--three {
        width: max-content !important;
        min-width: 680px !important;
    }
}

@media (max-width: 420px) {
    .ms-wrap,
    .ms-container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .ms-global-card .ms-card-specs,
    .ms-trend-specs,
    .ms-card-rating-breakdown {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    }

    .spotlight-table--three .spotlight-row--three {
        min-width: 620px !important;
    }
}

/* v55 homepage sync: Quick Match swipes like Spotlight, category counts are real, hero cards use product images. */
@media (max-width: 767px) {
    body.home #ms-filter-results-section .ms-container {
        padding-right: 0 !important;
        overflow: visible !important;
    }

    body.home #monitors-results.ms-filter-results-grid {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: minmax(270px, 82vw) !important;
        grid-template-columns: none !important;
        gap: 14px !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        overscroll-behavior-x: contain !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 2px 14px 16px 0 !important;
        scrollbar-width: thin !important;
    }

    body.home #monitors-results.ms-filter-results-grid > li,
    body.home #monitors-results.ms-filter-results-grid > article,
    body.home #monitors-results.ms-filter-results-grid > * {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        scroll-snap-align: start !important;
    }

    body.home #monitors-results.ms-filter-results-grid .ms-global-card {
        height: 100% !important;
    }

    body.home #ms-filter-results-section .ms-results-count::after {
        content: " - swipe cards" !important;
        font-weight: 800 !important;
        color: #64748b !important;
    }

body.home #ms-shop-by-category .ms-shopcat-count {
        white-space: normal !important;
        text-align: center !important;
        line-height: 1.25 !important;
    }
}

/* v58 compare mobile polish: table first, readable row winners, compact generated content. */
body.category-compare #compare-results-area {
    scroll-margin-top: 96px !important;
}

body.category-compare #sticky-comp-header,
body.category-compare #comp-table-body {
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: thin !important;
}

body.category-compare #comp-table-body .comp-lbl {
    position: sticky !important;
    left: 0 !important;
    z-index: 3 !important;
}

body.category-compare .val-winner {
    background: linear-gradient(180deg, rgba(16,185,129,.16), rgba(16,185,129,.06)) !important;
    color: #047857 !important;
    font-weight: 950 !important;
    box-shadow: inset 0 0 0 1px rgba(16,185,129,.18) !important;
}

body.category-compare .win-icon {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-left: 8px !important;
    padding: 4px 8px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    background: rgba(5,150,105,.10) !important;
    border: 1px solid rgba(5,150,105,.18) !important;
    color: #047857 !important;
    white-space: nowrap !important;
}

body.category-compare .win-icon:not(:has(.win-text))::after {
    content: " Winner";
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

body.category-compare .win-icon .win-text {
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
}

@media (max-width: 767px) {
    body.category-compare .ms-compare-page,
    body.category-compare .seo-content-wrapper,
    body.category-compare .ms-compare-static-guide {
        max-width: 100% !important;
        overflow-x: clip !important;
    }

    body.category-compare #compare-results-area {
        padding: 14px !important;
        border-radius: 18px !important;
    }

    body.category-compare #sticky-comp-header.grid-2,
    body.category-compare #comp-table-body .comp-row.grid-2 {
        min-width: 540px !important;
        grid-template-columns: 112px minmax(190px,1fr) minmax(190px,1fr) !important;
    }

    body.category-compare #sticky-comp-header.grid-3,
    body.category-compare #comp-table-body .comp-row.grid-3 {
        min-width: 690px !important;
        grid-template-columns: 100px minmax(185px,1fr) minmax(185px,1fr) minmax(185px,1fr) !important;
    }

    body.category-compare #comp-table-body .comp-lbl,
    body.category-compare #comp-table-body .comp-val {
        padding: 12px 10px !important;
        font-size: 12px !important;
        line-height: 1.45 !important;
    }

    body.category-compare #comp-table-body .comp-val {
        align-content: center !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    body.category-compare .win-icon {
        margin-left: 0 !important;
        padding: 4px 7px !important;
    }

    body.category-compare #dynamic-overview-area,
    body.category-compare #reviews-grid,
    body.category-compare #dynamic-faq-area,
    body.category-compare #winner-banner {
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
    }

    body.category-compare #dynamic-overview-area > *,
    body.category-compare #winner-banner,
    body.category-compare #reviews-grid > *,
    body.category-compare #dynamic-faq-area > *,
    body.category-compare .ms-v22-compare-editorial,
    body.category-compare .ms-v22-verdict-banner {
        border-radius: 14px !important;
        padding: 18px !important;
    }

    body.category-compare .ms-v22-summary-grid,
    body.category-compare .ms-v22-winner-grid,
    body.category-compare #reviews-grid {
        display: grid !important;
        grid-template-columns: minmax(0,1fr) !important;
        gap: 12px !important;
    }

    body.category-compare #dynamic-overview-area h2,
    body.category-compare #dynamic-overview-area h3,
    body.category-compare #winner-banner h2,
    body.category-compare .ms-v22-compare-editorial h2,
    body.category-compare .ms-v22-verdict-banner h2 {
        font-size: 21px !important;
        line-height: 1.18 !important;
        letter-spacing: 0 !important;
    }

    body.category-compare #dynamic-overview-area p,
    body.category-compare #dynamic-overview-area li,
    body.category-compare #winner-banner p,
    body.category-compare #dynamic-faq-area p,
    body.category-compare #dynamic-faq-area li,
    body.category-compare .ms-v22-compare-editorial p,
    body.category-compare .ms-v22-compare-editorial li,
    body.category-compare .ms-v22-verdict-banner p {
        font-size: 14px !important;
        line-height: 1.7 !important;
    }
}

/* v60 header + compare repair: keep Home visible, make Free Tools a true mobile accordion, and scroll the compare header/body together. */
#ms-header #ms-primary-menu > .ms-nav-home-link,
#ms-header .ms-primary-nav > .ms-nav-list > .ms-nav-home-link,
#ms-primary-nav .ms-nav-home-link {
    display: flex !important;
}

body.category-compare .val-winner::after,
body.category-compare .win-icon::after,
body.category-compare .win-icon:not(:has(.win-text))::after {
    content: none !important;
    display: none !important;
}

body.category-compare .comp-scroll-wrap {
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: contain !important;
    scrollbar-width: thin !important;
}

body.category-compare .comp-scroll-wrap #sticky-comp-header,
body.category-compare .comp-scroll-wrap #comp-table-body {
    overflow: visible !important;
    min-width: 100% !important;
    width: max-content !important;
}

body.category-compare .comp-scroll-wrap #sticky-comp-header {
    margin-bottom: 20px !important;
}

body.category-compare .comp-scroll-wrap #comp-table-body {
    margin-top: 0 !important;
}

@media (max-width: 767px) {
    body.category-compare #compare-results-area {
        overflow-x: visible !important;
    }

    body.category-compare .comp-scroll-wrap {
        margin-left: -4px !important;
        margin-right: -4px !important;
        padding: 0 4px 12px !important;
    }

    body.category-compare #sticky-comp-header,
    body.category-compare #comp-table-body {
        max-width: none !important;
    }
}

@media (max-width: 1180px) {
    #ms-header .ms-primary-nav,
    #ms-primary-nav {
        overflow-x: hidden !important;
        overflow-y: auto !important;
        padding-top: 16px !important;
    }

    #ms-header .ms-nav-free-tools,
    #ms-primary-nav .ms-nav-free-tools {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: block !important;
        position: relative !important;
    }

    #ms-header .ms-nav-free-tools > .ms-nav-parent-link,
    #ms-header .ms-nav-free-tools > a,
    #ms-primary-nav .ms-nav-free-tools > .ms-nav-parent-link,
    #ms-primary-nav .ms-nav-free-tools > a {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        justify-content: space-between !important;
        white-space: normal !important;
    }

    #ms-header .ms-nav-free-tools > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools > .sub-menu {
        position: static !important;
        inset: auto !important;
        display: none !important;
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 8px 0 0 !important;
        padding: 8px !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        box-shadow: none !important;
        border: 1px solid rgba(15, 118, 110, .14) !important;
        border-left: 3px solid rgba(20, 184, 166, .35) !important;
        border-radius: 14px !important;
        background: #f8fcfb !important;
    }

    #ms-header .ms-nav-free-tools.mobile-dropdown-open > .sub-menu,
    #ms-header .ms-nav-free-tools.mobile-open > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools.mobile-dropdown-open > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools.mobile-open > .sub-menu {
        display: grid !important;
    }

    #ms-header .ms-nav-free-tools > .sub-menu::before,
    #ms-primary-nav .ms-nav-free-tools > .sub-menu::before {
        display: none !important;
    }

    #ms-header .ms-nav-free-tools .sub-menu > .menu-item,
    #ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    #ms-header .ms-nav-free-tools .sub-menu > .menu-item > a,
    #ms-primary-nav .ms-nav-free-tools .sub-menu > .menu-item > a {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: 34px minmax(0, 1fr) !important;
        align-items: center !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
        line-height: 1.25 !important;
    }
}

/* v64 final local source guard: this must stay after imported live CSS fragments. */
body.category-compare #compare-results-area[style*="display: block"],
body.category-compare #compare-results-area[style*="display:block"] {
    display: block !important;
}

body.category-compare #compare-results-area[style*="display: block"] .comp-scroll-wrap,
body.category-compare #compare-results-area[style*="display:block"] .comp-scroll-wrap {
    display: block !important;
    order: 1 !important;
}

body.category-compare #compare-results-area[style*="display: block"] #dynamic-overview-area,
body.category-compare #compare-results-area[style*="display:block"] #dynamic-overview-area {
    order: 2 !important;
}

body.category-compare #comp-table-body .val-winner::after,
body.category-compare #sticky-comp-header .val-winner::after,
body.category-compare .comp-val.val-winner::after,
body.category-compare .win-icon::after,
body.category-compare .win-icon:not(:has(.win-text))::after {
    content: none !important;
    display: none !important;
}

body.category-compare .win-icon {
    font-size: 0 !important;
}

body.category-compare .win-icon::before {
    content: "Winner" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
}

body.category-compare .win-icon .win-text {
    display: none !important;
}

#ms-header .ms-nav-free-tools > .sub-menu > .menu-item > a,
#ms-primary-nav .ms-nav-free-tools > .sub-menu > .menu-item > a,
#ms-header .ms-nav-free-tools .sub-menu a,
#ms-primary-nav .ms-nav-free-tools .sub-menu a {
    color: #102027 !important;
    -webkit-text-fill-color: #102027 !important;
    text-indent: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* v65 local mobile Free Tools guard: keep the accordion clickable and readable. */
@media (max-width: 991px) {
    #ms-header .ms-nav-free-tools.mobile-dropdown-open > .sub-menu,
    #ms-header .ms-nav-free-tools.mobile-open > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools.mobile-dropdown-open > .sub-menu,
    #ms-primary-nav .ms-nav-free-tools.mobile-open > .sub-menu {
        display: grid !important;
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 8px 0 0 !important;
        padding: 8px !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    #ms-header .ms-nav-free-tools.mobile-dropdown-open > .sub-menu > .menu-item,
    #ms-header .ms-nav-free-tools.mobile-open > .sub-menu > .menu-item,
    #ms-primary-nav .ms-nav-free-tools.mobile-dropdown-open > .sub-menu > .menu-item,
    #ms-primary-nav .ms-nav-free-tools.mobile-open > .sub-menu > .menu-item {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    #ms-header .ms-nav-free-tools.mobile-dropdown-open > .sub-menu > .menu-item > a,
    #ms-header .ms-nav-free-tools.mobile-open > .sub-menu > .menu-item > a,
    #ms-primary-nav .ms-nav-free-tools.mobile-dropdown-open > .sub-menu > .menu-item > a,
    #ms-primary-nav .ms-nav-free-tools.mobile-open > .sub-menu > .menu-item > a {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 44px !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        line-height: 1.25 !important;
    }

    #ms-header #ms-primary-nav.is-open .ms-nav-free-tools.mobile-dropdown-open ul.sub-menu,
    #ms-header #ms-primary-nav.is-open .ms-nav-free-tools.mobile-open ul.sub-menu,
    #ms-primary-nav.is-open .ms-nav-free-tools.mobile-dropdown-open ul.sub-menu,
    #ms-primary-nav.is-open .ms-nav-free-tools.mobile-open ul.sub-menu {
        display: grid !important;
        box-sizing: border-box !important;
        inline-size: 100% !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        left: auto !important;
        right: auto !important;
        margin-inline: 0 !important;
    }

    #ms-header #ms-primary-nav.is-open .ms-nav-free-tools.mobile-dropdown-open,
    #ms-header #ms-primary-nav.is-open .ms-nav-free-tools.mobile-open,
    #ms-primary-nav.is-open .ms-nav-free-tools.mobile-dropdown-open,
    #ms-primary-nav.is-open .ms-nav-free-tools.mobile-open {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
    }

    #ms-header #ms-primary-nav.is-open .ms-nav-free-tools.mobile-dropdown-open ul.sub-menu a,
    #ms-header #ms-primary-nav.is-open .ms-nav-free-tools.mobile-open ul.sub-menu a,
    #ms-primary-nav.is-open .ms-nav-free-tools.mobile-dropdown-open ul.sub-menu a,
    #ms-primary-nav.is-open .ms-nav-free-tools.mobile-open ul.sub-menu a {
        box-sizing: border-box !important;
        inline-size: 100% !important;
        width: 100% !important;
    }
}

/* v66 compare + FAQ final polish: single winner chip, stable table rows, synced FAQ accordions. */
body.category-compare .cmp-right-panel > div:first-child {
    align-items: flex-start !important;
    gap: 12px !important;
}

body.category-compare .cmp-right-panel > div:first-child > div:last-child {
    display: grid !important;
    grid-template-columns: repeat(4, max-content) !important;
    gap: 8px !important;
    align-items: center !important;
}

body.category-compare .cmp-action-btn {
    min-width: 0 !important;
    min-height: 40px !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(20, 184, 166, .26) !important;
    color: #0f766e !important;
    background: #ffffff !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .055) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
}

@media (max-width: 640px) {
    body.category-compare .cmp-right-panel {
        padding: 18px !important;
        border-radius: 22px !important;
    }

    body.category-compare .cmp-right-panel > div:first-child {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }

    body.category-compare .cmp-right-panel > div:first-child > div:last-child {
        width: 100% !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px !important;
    }

    body.category-compare .cmp-action-btn {
        width: 100% !important;
        min-height: 44px !important;
        padding: 8px 10px !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }
}

body.category-compare #compare-results-area .comp-scroll-wrap {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    padding-bottom: 14px !important;
}

body.category-compare #sticky-comp-header,
body.category-compare #comp-table-body,
body.category-compare #comp-table-body .comp-row {
    box-sizing: border-box !important;
}

body.category-compare #sticky-comp-header {
    position: relative !important;
    top: auto !important;
    inset-block-start: auto !important;
    z-index: 5 !important;
    margin-bottom: 0 !important;
    border-radius: 16px 16px 0 0 !important;
    border-bottom: 0 !important;
    overflow: hidden !important;
    background: #ffffff !important;
}

/* v67 compare desktop table overlap fix: keep generated header in normal flow. */
body.category-compare #compare-results-area #sticky-comp-header {
    top: auto !important;
    inset-block-start: auto !important;
    transform: none !important;
}

body.category-compare #comp-table-body {
    margin-top: 0 !important;
    border: 1px solid rgba(24,39,75,.08) !important;
    border-top: 0 !important;
    border-radius: 0 0 16px 16px !important;
    overflow: visible !important;
}

body.category-compare #comp-table-body .comp-row {
    min-height: 66px !important;
}

body.category-compare #comp-table-body .comp-row:first-child {
    margin-top: 0 !important;
}

body.category-compare #comp-table-body .comp-lbl {
    background: #f8fafc !important;
    z-index: 4 !important;
}

body.category-compare #comp-table-body .comp-val {
    gap: 8px !important;
    flex-wrap: wrap !important;
}

body.category-compare .win-icon,
body.category-compare #comp-table-body .win-icon,
body.category-compare .comp-val .win-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    margin-left: 6px !important;
    padding: 5px 9px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(16,185,129,.28) !important;
    background: rgba(209,250,229,.86) !important;
    color: #047857 !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

body.category-compare .win-icon::before,
body.category-compare .win-icon::after,
body.category-compare .val-winner::before,
body.category-compare .val-winner::after {
    content: none !important;
    display: none !important;
}

body.category-compare .win-icon .win-text {
    display: inline !important;
    font-size: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
}

body.category-compare .win-icon .win-cup {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: 4px !important;
    font-size: 11px !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

@media (max-width: 767px) {
    body.category-compare #sticky-comp-header.grid-2,
    body.category-compare #comp-table-body .comp-row.grid-2 {
        grid-template-columns: 112px repeat(2, minmax(178px, 1fr)) !important;
        min-width: 510px !important;
    }

    body.category-compare #sticky-comp-header.grid-3,
    body.category-compare #comp-table-body .comp-row.grid-3 {
        grid-template-columns: 104px repeat(3, minmax(176px, 1fr)) !important;
        min-width: 632px !important;
    }

    body.category-compare #comp-table-body .comp-lbl,
    body.category-compare #comp-table-body .comp-val {
        min-height: 62px !important;
        padding: 12px 10px !important;
    }
}

.faq-container,
.ms-v22-faq-container,
.ms-faq-accordion,
.cmp-faq-accordion,
.ms-v17-faq-list,
.ms-brand-faq,
.ms-aftersales-faq,
.ms-faq-block,
.ms-faq-section,
.find-editorial-faq {
    max-width: 920px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.faq-container,
.ms-v22-faq-container,
.ms-faq-accordion,
.cmp-faq-accordion,
.ms-v17-faq-list {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.faq-item,
.ms-faq-item,
.cmp-faq-item,
.ms-v17-faq-list details,
.ms-brand-faq details,
.ms-aftersales-faq details,
.ms-faq-block details,
.ms-faq-section details {
    border: 1px solid rgba(15, 23, 42, .09) !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdfc 100%) !important;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .055) !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
}

.faq-item[open],
.ms-faq-item[open],
.ms-v17-faq-list details[open],
.ms-brand-faq details[open],
.ms-aftersales-faq details[open],
.ms-faq-block details[open],
.ms-faq-section details[open] {
    border-color: rgba(20, 184, 166, .35) !important;
    box-shadow: 0 18px 42px rgba(20, 184, 166, .10) !important;
}

.faq-summary,
.ms-faq-question,
.ms-faq-block summary,
.ms-faq-section summary,
.ms-v17-faq-list summary,
.ms-brand-faq summary,
.ms-aftersales-faq summary {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 34px !important;
    align-items: center !important;
    gap: 14px !important;
    min-height: 58px !important;
    padding: 17px 18px !important;
    color: #102027 !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1.35 !important;
    list-style: none !important;
    cursor: pointer !important;
    overflow-wrap: anywhere !important;
}

.faq-summary::-webkit-details-marker,
.ms-faq-question::-webkit-details-marker,
.ms-faq-block summary::-webkit-details-marker,
.ms-faq-section summary::-webkit-details-marker,
.ms-v17-faq-list summary::-webkit-details-marker,
.ms-brand-faq summary::-webkit-details-marker,
.ms-aftersales-faq summary::-webkit-details-marker {
    display: none !important;
}

.faq-summary::after,
.ms-faq-question::after,
.ms-faq-block summary::after,
.ms-faq-section summary::after,
.ms-v17-faq-list summary::after,
.ms-brand-faq summary::after,
.ms-aftersales-faq summary::after {
    content: "+" !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(20, 184, 166, .12) !important;
    color: #0f766e !important;
    font-size: 20px !important;
    font-weight: 900 !important;
}

details[open] > .faq-summary::after,
.ms-faq-item[open] > .ms-faq-question::after,
.ms-faq-block details[open] > summary::after,
.ms-faq-section details[open] > summary::after,
.ms-v17-faq-list details[open] > summary::after,
.ms-brand-faq details[open] > summary::after,
.ms-aftersales-faq details[open] > summary::after {
    content: "-" !important;
    background: rgba(139, 92, 246, .12) !important;
    color: #7c3aed !important;
}

.faq-content,
.ms-faq-answer,
.cmp-faq-content,
.ms-v17-faq-list details > p,
.ms-brand-faq details > p,
.ms-aftersales-faq details > p,
.ms-faq-block details > p,
.ms-faq-section details > p {
    padding: 0 18px 18px !important;
    margin: 0 !important;
    color: #475569 !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}

@media (max-width: 640px) {
    .faq-container,
    .ms-v22-faq-container,
    .ms-faq-accordion,
    .cmp-faq-accordion,
    .ms-v17-faq-list,
    .ms-brand-faq,
    .ms-aftersales-faq,
    .ms-faq-block,
    .ms-faq-section,
    .find-editorial-faq {
        max-width: 100% !important;
        width: 100% !important;
        grid-template-columns: minmax(0, 1fr) !important;
        box-sizing: border-box !important;
    }

    body.category-compare .seo-content-wrapper > div:has(.faq-container),
    body.category-compare .ms-compare-static-guide .seo-content-wrapper > div:has(.faq-container) {
        padding: 18px !important;
        border-radius: 16px !important;
    }

    body.category-compare .faq-container {
        padding: 0 !important;
    }

    body.category-compare .faq-container .faq-item {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .faq-summary,
    .ms-faq-question,
    .ms-faq-block summary,
    .ms-faq-section summary,
    .ms-v17-faq-list summary,
    .ms-brand-faq summary,
    .ms-aftersales-faq summary {
        min-height: 54px !important;
        padding: 15px 14px !important;
        font-size: 14px !important;
        grid-template-columns: minmax(0, 1fr) 30px !important;
    }

    .faq-summary::after,
    .ms-faq-question::after,
    .ms-faq-block summary::after,
    .ms-faq-section summary::after,
    .ms-v17-faq-list summary::after,
    .ms-brand-faq summary::after,
    .ms-aftersales-faq summary::after {
        width: 30px !important;
        height: 30px !important;
    }
}

@keyframes dropFadeIn {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}