.cmv-page{width:100%;margin:0;padding:0;box-sizing:border-box}.cmv-detail{--cmv-color:#777;margin:0;padding:0;box-sizing:border-box;width:100%}.cmv-hero{background:var(--cmv-color);padding:0;margin:0}.cmv-inner{background:#fff;max-width:950px;margin-inline:auto;margin-block:0;padding:0;border-radius:14px;text-align:center}.cmv-inner h1{margin:0;font-size:clamp(26px,3vw,44px)}.cmv-explore{display:inline-block;margin-top:0;font-weight:600}.cmv-pills{--cmv-pad-top:14px;--cmv-pad-right:18px;--cmv-pad-bottom:14px;--cmv-pad-left:18px;display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}.cmv-cmyk{grid-template-columns:repeat(4,minmax(0,1fr))}.cmv-hex{grid-template-columns:1fr;justify-items:center}.cmv-pill{display:block;min-width:0;width:100%;padding:var(--cmv-pad-top) var(--cmv-pad-right) var(--cmv-pad-bottom) var(--cmv-pad-left);border:1px solid #d6d6d6;border-radius:9px;background:#f5f5f5;color:#222;text-align:center;font:inherit;font-size:inherit;font-weight:600;cursor:pointer;transition:background-color .2s}.cmv-hex .cmv-pill{width:auto;font-size:2em;padding:calc(2 * var(--cmv-pad-top)) calc(2 * var(--cmv-pad-right)) calc(2 * var(--cmv-pad-bottom)) calc(2 * var(--cmv-pad-left))}.cmv-hero-pills{font-size:clamp(20px,3vw,36px);--cmv-pad-top:20px;--cmv-pad-right:20px;--cmv-pad-bottom:20px;--cmv-pad-left:20px}.cmv-pill-label{font-weight:700}.cmv-pill.cmv-copied{background:#d9f5e1!important}.cmv-other{max-width:none;width:100%;box-sizing:border-box;margin:0;padding:0;display:flex;flex-direction:column;gap:0}.cmv-other h3{font-size:24px;margin:0}.cmv-other h3 a{text-decoration:none}.cmv-interstitial{max-width:none;width:100%;box-sizing:border-box;margin:0;padding:0}.cmv-directory{max-width:none;width:100%;box-sizing:border-box;margin:0;padding:0}.cmv-directory h1{margin:0;padding:0}.cmv-list-section{margin:0;padding:0}.cmv-list{list-style:disc;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 22px;margin:0;padding:0;list-style:none}.cmv-list li{min-width:0}.cmv-list li a{display:flex;align-items:center;gap:11px;text-decoration:none;min-width:0}.cmv-swatch{display:inline-block;width:20px;height:auto;min-width:0;aspect-ratio:1;border:1px solid #bbb;border-radius:3px;flex-shrink:0}.cmv-list a:hover{text-decoration:underline}@media(max-width:1024px){.cmv-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:767px){.cmv-list{grid-template-columns:1fr}.cmv-pills,.cmv-cmyk{grid-template-columns:repeat(2,minmax(0,1fr))}.cmv-hex{grid-template-columns:1fr}.cmv-hero-pills{font-size:21px;--cmv-pad-top:14px;--cmv-pad-right:14px;--cmv-pad-bottom:14px;--cmv-pad-left:14px}}

/* HEX is always 2x its section typography and padding; borders/radii remain unchanged. */

/* Typography lives on the Elementor-controlled pill grid. Every non-HEX pill
   inherits all typography attributes; HEX has exactly twice the inherited font size. */
.cmv-detail .cmv-pills .cmv-pill{font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit;line-height:inherit;letter-spacing:inherit;text-transform:inherit;text-decoration:inherit}
.cmv-detail .cmv-pills.cmv-hex .cmv-pill{font-size:2em}
.cmv-other .cmv-pills{font-size:18px}
/* SEO paragraphs are first in the DOM for indexing and accessibility,
   but laid out after all other content on screen. */
.cmv-detail{display:flex;flex-direction:column}
.cmv-detail>.cmv-seo-copy{order:10;align-self:center;max-width:none;width:100%;margin:0;padding:0;box-sizing:border-box}
.cmv-seo-copy p{margin:0;padding:0;line-height:1.65}

/* Closest-color pages: SEO prose is intentionally first in the DOM, last visually. */
.cmv-closest-detail{display:flex;flex-direction:column;container-type:inline-size;width:100%;margin:0;padding:0;box-sizing:border-box}
.cmv-closest-detail>.cmv-closest-page-title{order:0;display:block;box-sizing:border-box;width:100%;margin:0;padding:0;text-align:center;font-size:clamp(20px,2vw,27px);font-weight:600;line-height:1.3}
.cmv-closest-detail>.cmv-closest-seo{order:10;align-self:center;width:100%;max-width:none;margin:0;padding:0;box-sizing:border-box}
.cmv-closest-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;--cmv-label-gap:12px;min-height:340px;margin:0;padding:0;box-sizing:border-box}
.cmv-closest-panel{min-width:0;min-height:340px;display:flex;align-items:center;padding:0;box-sizing:border-box}
.cmv-closest-source{background:var(--cmv-left);justify-content:flex-end}
.cmv-closest-target{background:var(--cmv-right);justify-content:flex-start}
.cmv-closest-name{box-sizing:border-box;width:min(100%,320px);min-height:84px;display:flex;align-items:center;justify-content:center;text-align:center;background:#fff;color:#222;border-radius:9px;padding:0;font-size:clamp(18px,2vw,30px);font-weight:700;overflow-wrap:anywhere;box-shadow:0 2px 10px #0002}
.cmv-closest-name a{color:inherit;text-decoration:none}
.cmv-closest-source .cmv-closest-name{margin-right:var(--cmv-label-gap)}
.cmv-closest-target .cmv-closest-name{margin-left:var(--cmv-label-gap)}
.cmv-closest-group{max-width:none;width:100%;box-sizing:border-box;margin:0;padding:0}
.cmv-closest-list{padding:0;margin:0;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cmv-closest-list li a{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.cmv-closest-list li a:hover{text-decoration:underline}
.cmv-closest-swatch{display:inline-block;flex:none;width:32px;aspect-ratio:1;border:1px solid #999;border-radius:3px}
@media(max-width:767px){.cmv-closest-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.cmv-closest-list{grid-template-columns:1fr}}

/* Neutral structural spacing baseline. No invisible gutter is imposed by this plugin.
   Elementor widget spacing controls override these zero defaults when configured. */
.cmv-page :is(.cmv-detail,.cmv-directory,.cmv-closest-detail),
.cmv-detail :is(.cmv-hero,.cmv-other,.cmv-interstitial,.cmv-seo-copy,.cmv-other-group),
.cmv-directory :is(.cmv-list-section,.cmv-list,.cmv-list li),
.cmv-closest-detail :is(.cmv-closest-compare,.cmv-closest-group,.cmv-closest-list,.cmv-closest-list li,.cmv-closest-seo){box-sizing:border-box}
:where(.cmv-directory h1,.cmv-directory h2,.cmv-directory h3,.cmv-closest-group h2){margin:0;padding:0}
:where(.cmv-directory .cmv-list-section,.cmv-directory .cmv-list,.cmv-closest-detail .cmv-closest-group,.cmv-closest-detail .cmv-closest-list){margin:0;padding:0}
.cmv-directory .cmv-list li,.cmv-closest-list li{margin:0;padding:0;list-style:none}

/* Footer Index: zero structural gutters. Keep bullet and swatch rows the same height. */
.cmv-footer-index,.cmv-footer-section,.cmv-footer-heading,.cmv-footer-list,.cmv-footer-list li{padding:0;margin:0;box-sizing:border-box}
.cmv-footer-list{--cmv-footer-swatch-size:16px;display:flex;flex-direction:column;gap:0;list-style:none}
.cmv-footer-list li[hidden]{display:none!important}
.cmv-footer-list a{display:flex;align-items:center;column-gap:9px;min-height:max(24px,var(--cmv-footer-swatch-size));color:inherit;text-decoration:none!important}
.cmv-footer-list a:hover,.cmv-footer-heading a:hover{text-decoration:none!important}
.cmv-footer-heading a,.cmv-footer-heading a:visited,.cmv-footer-heading a:hover,.cmv-footer-heading a:focus{color:inherit!important;text-decoration:none!important}
.cmv-footer-swatch,.cmv-footer-bullet{box-sizing:border-box;display:inline-flex;flex:0 0 var(--cmv-footer-swatch-size);width:var(--cmv-footer-swatch-size);height:var(--cmv-footer-swatch-size);align-items:center;justify-content:center}
.cmv-footer-swatch{border:1px solid #b7b7b7;border-radius:2px;aspect-ratio:1}
.cmv-footer-bullet{font-size:1em;line-height:1}