.color-page { width:100%; overflow-x:hidden; background:#fff; color:var(--blue); }
.color-section { padding:clamp(68px,9vw,120px) 0; }
.color-eyebrow { margin:0 0 22px; color:var(--label); font-size:14px; font-weight:800; letter-spacing:.17em; }
.color-eyebrow--light { color:#b9dfce; }
.color-section h2,
.color-cta h2 { margin:0; color:var(--blue); font-size:clamp(28px,4.8vw,46px); line-height:1.04; letter-spacing:-.045em; font-weight:700; }
.color-intro { padding-bottom:90px; }
.color-intro__grid {overflow:hidden; }
.color-intro__grid>div:last-child { padding-top:35px; }
.color-intro__grid>div:last-child p { color:var(--muted); font-size:16px; line-height:1.82; margin-bottom: 10px;}
.color-section__head { display:grid; grid-template-columns:0.9fr 1.1fr; gap:5vw; align-items:end; margin-bottom:40px; }
.color-section__head>div>span { display:block; margin-bottom:24px; color:var(--label); font-size:16px; font-weight:800; letter-spacing:.15em; }
.color-section__head>p,.color-section__head>div>p {  margin:0; color:var(--muted); font-size:16px; line-height:1.75; }

.library { background:#f4f7f5; }
.library__layout { display:grid; grid-template-columns:410px 1fr; min-height:600px; border:1px solid #dbe2de; background:#fff; }
.library__tabs { display:flex; flex-direction:column; border-right:1px solid #dbe2de; }
.library-tab { flex:1; display:grid; grid-template-columns:38px 1fr; align-items:center; padding:20px 24px; border:0; border-bottom:1px solid #e1e6e3; background:#fff; color:#4f556f; text-align:left; font-weight:700; transition:.3s cubic-bezier(.16,1,.3,1); }
.library-tab:last-child { border-bottom:0; }
.library-tab span { color:#a3aaa6; font-size:11px; }
.library-tab:hover,.library-tab.is-active { padding-left:30px; color:#fff; background:var(--blue); }
.library-tab.is-active span,.library-tab:hover span { color:#9fd4ba; }
.library__display { display:flex; flex-direction:column; min-width:0; }
.library-panel { height:100%; display:flex; flex-direction:column; }
.library-panel[hidden] { display:none; }
.library-panel.is-active .library__swatches span { animation:swatchRise .55s cubic-bezier(.16,1,.3,1) both; }
.library-panel.is-active .library__swatches span:nth-child(2) { animation-delay:.05s; }
.library-panel.is-active .library__swatches span:nth-child(3) { animation-delay:.1s; }
.library-panel.is-active .library__swatches span:nth-child(4) { animation-delay:.15s; }
.library-panel.is-active .library__swatches span:nth-child(5) { animation-delay:.2s; }
.library-panel.is-active .library__caption { animation:captionIn .55s .12s cubic-bezier(.16,1,.3,1) both; }
.library__swatches { flex:1; display:grid; grid-template-columns:repeat(5,1fr); min-height:470px; overflow:hidden; }
.library__swatches span { background:var(--swatch); transform-origin:bottom; transition:background .55s,transform .55s cubic-bezier(.16,1,.3,1); }
.library__swatches span:nth-child(1) { --swatch:#f4f0e7; }
.library__swatches span:nth-child(2) { --swatch:#e8dfd0; }
.library__swatches span:nth-child(3) { --swatch:#d6cbbb; }
.library__swatches span:nth-child(4) { --swatch:#c4b5a2; }
.library__swatches span:nth-child(5) { --swatch:#a99b89; }
.library__swatches span:hover { transform:scaleY(1.035); }
.library__caption { display:grid; grid-template-columns:1.3fr .7fr; gap:35px; align-items:end; padding:30px 34px; }
.library__caption small { color:var(--label); font-size:10px; font-weight:800; letter-spacing:.14em; }
.library__caption h3 { margin:8px 0 0; font-size:25px; font-weight:800; }
.library__caption p { margin:0; color:var(--muted); font-size:18px; line-height:1.5; }
.library__note {  margin:28px 0 ; color:var(--muted);font-size:13px; line-height:1.6; }
.library-across{overflow: hidden;}
.library-across .library-across__tiips{color: var(--blue);font-size: 18px;line-height: 1.5;}
.library-across .lib-across__list{display: flex;align-items: center;gap: 12px;flex-wrap: wrap;}
.library-across .lib-across__list .lib-across__item{padding: 6px 16px;border-radius: 999px;border:1px solid var(--blue);font-size: 14px;cursor: pointer;}
.library-across .lib-across__list .lib-across__item:hover{background-color: var(--blue);transform: translateY(-3px);color:#ffffff;}

.matching__grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #dfe4e1; border-left:1px solid #dfe4e1; }
.match-panel {display:flex; flex-direction:column; padding:38px; border-right:1px solid #dfe4e1; border-bottom:1px solid #dfe4e1; transition:.35s cubic-bezier(.16,1,.3,1); }
.match-panel:hover { transform:translateY(-6px); box-shadow:0 22px 48px rgba(32,38,79,.08); }
.match-panel__mark { width:100px; height:100px; display:grid; place-items:center; margin-bottom:35px;}
.match-panel>span { color:var(--label); font-size:14px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.match-panel h3 { margin:12px 0 18px; font-size:26px; font-weight:800; }
.match-panel p { color:var(--muted); line-height:1.65; }
.match-panel ul,.service-step ul { margin:auto 0 0; padding:25px 0 0; border-top:1px solid #e2e6e4; list-style:none; }
.match-panel li,.service-step li { position:relative; padding:5px 0 5px 18px; color:#5f657d; font-size:14px; }
.match-panel li:before,.service-step li:before { content:""; position:absolute; left:0; top:12px; width:5px; height:5px; border-radius:50%; background:var(--green); }
.match-panel--pantone { background:#f7f8f7; }
.match-panel--custom { color:#fff; background:#173e30; }
.match-panel--custom .match-panel__mark { border-color:rgba(255,255,255,.3); color:#fff; }
.match-panel--custom>span { color:#a8d8bf; }
.match-panel--custom h3 { color:#fff; }
.match-panel--custom p,.match-panel--custom li { color:rgba(255,255,255,.68); }
.match-panel--custom ul { border-color:rgba(255,255,255,.18); }
.matching__benefits { display:grid; grid-template-columns:repeat(4,1fr); margin-top:28px; border-top:1px solid #dfe4e1; border-bottom:1px solid #dfe4e1; }
.matching__benefits span { padding:20px; border-right:1px solid #dfe4e1; color:#646a81; text-align:center; font-size:12px; font-weight:700; }
.matching__benefits span:last-child { border-right:0; }

.service { overflow:hidden; color:#fff; background:var(--blue); }
.service .color-section__head h2 { color:#fff; }
.service .color-section__head>div>span { color:#9ed7ba; }
.service .color-section__head p { color:rgba(255,255,255,.66); }
.service .color-section__head>div:last-child p+p { margin-top:16px; }
.service__steps { margin-top:20px; border-top:1px solid rgba(255,255,255,.2); }
.service-stage { display:grid; grid-template-columns:150px 1fr; border-bottom:1px solid rgba(255,255,255,.2); }
.service-stage__rail { position:relative; display:flex; flex-direction:column; padding:42px 30px 0 0; border-right:1px solid rgba(255,255,255,.2); }
.service-stage__rail>span { color:#9ed7ba; font-size:12px; font-weight:700; letter-spacing:.17em; }
.service-stage__rail strong { margin-top:10px; color:#fff; font-size:56px; line-height:1; letter-spacing:-.05em; font-weight:300; }
.service-stage__rail i { position:absolute; left:17px; top:130px; bottom:-1px; width:1px; background:rgba(255,255,255,.18); }
.service-stage__rail i:before { content:""; position:absolute; left:-5px; top:0; width:11px; height:11px; border:2px solid var(--blue); border-radius:50%; background:var(--red); box-shadow:0 0 0 1px rgba(255,255,255,.35); }
.service-stage__body { padding:42px 0 70px 60px; }
.service-stage__body>header { display:flex; justify-content:space-between; gap:30px; align-items:end; margin-bottom:20px; }
.service-stage__body header small { color:#9ed7ba; font-size:12px; font-weight:700; letter-spacing:.14em; }
.service-stage__body h3 { margin:10px 0 0; color:#fff; font-size:clamp(29px,3vw,43px); font-weight:800; letter-spacing:-.03em; }
.service-stage__body header>b { color:#fff; font-size:42px; line-height:1; white-space:nowrap; }
.service-stage__body header>b small { color:rgba(255,255,255,.5); font-size:12px; letter-spacing:0; }
.service-stage__lead { max-width:930px; margin:0 0 40px; color:rgba(255,255,255,.7); font-size:16px; line-height:1.75; }
.service-stage__columns { display:grid; grid-template-columns:.7fr 1.3fr; gap:65px; }
.service-stage__columns section { padding-top:22px; border-top:1px solid rgba(255,255,255,.2); }
.service-stage h4 { margin:0 0 18px; color:#fff; font-size:15px; font-weight:800; }
.service-stage ul { display:grid; grid-template-columns:1fr 1fr; gap:9px 25px; margin:0; padding:0; list-style:none; }
.service-stage li { position:relative; padding-left:16px; color:rgba(255,255,255,.65); font-size:13px; line-height:1.5; }
.service-stage li:before { content:""; position:absolute; left:0; top:7px; width:5px; height:5px; border-radius:50%; background:var(--green); }
.service-stage dl { margin:0; }
.service-stage dl>div { display:grid; grid-template-columns:150px 1fr; gap:20px; padding:11px 0; border-bottom:1px solid rgba(255,255,255,.12); }
.service-stage dt { color:#fff; font-size:13px; }
.service-stage dd { margin:0; color:rgba(255,255,255,.6); font-size:13px; line-height:1.5; }
.service-stage__quality { display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid rgba(255,255,255,.2); border-left:1px solid rgba(255,255,255,.2); }
.service-stage__quality section { min-height:255px; padding:24px; border-right:1px solid rgba(255,255,255,.2); border-bottom:1px solid rgba(255,255,255,.2); transition:.3s cubic-bezier(.16,1,.3,1); }
.service-stage__quality section:hover { background:rgba(255,255,255,.06); }
.service-stage__quality span { color:var(--red); font-size:14px; font-weight:800; }
.service-stage__quality h4 { margin-top:15px; line-height:1.4;font-size: 18px; }
.service-stage__quality p { margin:0; color:rgba(255,255,255,.6); font-size:14px; line-height:1.6; }

.control { background:#f5f7f6; }
.control__intro { display:grid; grid-template-columns:.7fr 1.3fr; gap:8vw; align-items:start; margin-bottom:75px; }
.control__list { margin:0 0 0 23%; padding:0; list-style:none; border-top:1px solid #d6ddda; }
.control__list li { display:grid; grid-template-columns:70px .8fr 1.2fr; gap:30px; padding:27px 0; border-bottom:1px solid #d6ddda; }
.control__list li>span { color:var(--red); font-size:11px; font-weight:800; }
.control__list h3 { margin:0; font-size:20px; font-weight:800; }
.control__list p { margin:0; color:var(--muted); font-size:14px; line-height:1.6; }

.projects__services { display:grid; grid-template-columns:repeat(3,1fr); margin-bottom:60px; border-top:1px solid #dce2df; }
.projects__services article { min-height:280px; padding:28px 32px 30px 0; border-right:1px solid #dce2df; border-bottom:1px solid #dce2df; }
.projects__services article:not(:first-child) { padding-left:32px; }
.projects__services span { color:var(--red); font-size:11px; font-weight:800; }
.projects__services h3 { margin:30px 0 15px; font-size:24px; font-weight:800; }
.projects__services p { margin:0; color:var(--muted); line-height:1.65; }
.regions { display:grid; grid-template-columns:.72fr 1.28fr; gap:8vw; }
.regions__head h3 { max-width:390px; margin:0; font-size:38px; line-height:1.12; font-weight:800; }
.regions__table { border-top:1px solid #dce2df; }
.projects__closing { max-width:900px; margin:70px 0 0 auto; padding-left:35px; border-left:3px solid var(--green); color:var(--muted); font-size:17px; line-height:1.75; }
.region-row { display:grid; grid-template-columns:150px 1fr 160px; gap:25px; align-items:center; padding:23px 0; border-bottom:1px solid #dce2df; }
.region-row strong { font-size:15px; }
.region-row p { margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
.region-swatches { display:flex; justify-content:flex-end; }
.region-swatches i { width:38px; height:38px; display:block; margin-left:-5px; border:2px solid #fff; border-radius:50%; background:var(--c); }

.color-search { background:#f2f2f2; }
.color-search__toolbar { display:grid; grid-template-columns:minmax(320px,.8fr) 1.2fr; gap:45px; align-items:end; padding:32px; border:1px solid #d8dcda; background:#fff; }
.color-search__field>span { display:block; margin-bottom:10px; color:var(--blue); font-size:12px; font-weight:800; }
.color-search__field>div { position:relative; }
.color-search__field input { width:100%; height:54px; padding:0 50px 0 18px; border:1px solid #cdd2cf; outline:0; color:var(--blue); background:#fafafa; font:inherit; transition:.25s; }
.color-search__field input:focus { border-color:var(--green); box-shadow:inset 0 -2px var(--green); }
.color-search__field button { position:absolute; right:0; top:0; width:50px; height:54px; border:0; background:transparent; color:#969b98; font-size:22px; }
.color-search__filters { display:flex; flex-wrap:wrap; gap:8px; }
.color-search__filters button { min-height:42px; padding:8px 15px; border:1px solid #d5dad7; background:#fff; color:#60667c; font-size:12px; font-weight:700; transition:.25s; }
.color-search__filters button:hover,.color-search__filters button.is-active { border-color:var(--blue); color:#fff; background:var(--blue); }
.color-search__filters button:active { transform:scale(.97); }
.color-family-filter { display:grid; grid-template-columns:180px minmax(0,1fr) 80px; gap:24px; align-items:center; padding:18px max(40px,calc((100vw - var(--container))/2 + 20px)); border:1px solid #d6dbd8; border-bottom:0; background:#fff; }
.color-family-filter__label span { display:block; margin-bottom:3px; color:var(--label); font-size:10px; font-weight:800; letter-spacing:.14em; }
.color-family-filter__label p { margin:0; color:#8a908d; font-size:11px; }
.color-family-filter .color-search__filters { flex-wrap:nowrap; min-width:0; overflow-x:auto; scrollbar-width:none; }
.color-family-filter .color-search__filters::-webkit-scrollbar { display:none; }
.color-family-filter .color-search__filters button { position:relative; flex:0 0 auto; }
.color-family-filter .color-search__filters button.is-active:before{ border-color:rgba(255,255,255,.72); }
.color-family-filter__result { color:var(--red); text-align:right; font-size:12px; font-weight:800; white-space:nowrap; }
.color-search__meta { display:flex; justify-content:space-between; align-items:center; padding:25px 0 15px; color:#858b88; font-size:12px; }
.color-search__meta p { margin:0; }
.color-search__meta strong { color:var(--red); font-size:16px; }
.color-search__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.color-chip { min-width:0; padding:0; border:1px solid #dfe3e1; background:#fff; text-align:left; overflow:hidden; transition:.35s cubic-bezier(.16,1,.3,1); }
.color-chip[hidden] { display:none; }
.color-chip:hover { transform:translateY(-5px); border-color:#c5cbc8; box-shadow:0 16px 32px rgba(32,38,79,.09); }
.color-chip:active { transform:translateY(-2px) scale(.99); }
.color-chip>i { display:block; height:165px; background:var(--chip); transition:transform .55s cubic-bezier(.16,1,.3,1); }
.color-chip:hover>i { transform:scale(1.035); }
.color-chip>span { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:17px; }
.color-chip b { overflow:hidden; color:var(--blue); font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.color-chip small { color:#8a908d; font-size:11px; font-weight:800; letter-spacing:.06em; }
.color-search__empty { padding:80px 20px; border:1px solid #dfe3e1; background:#fff; text-align:center; }
.color-search__empty strong { font-size:24px; }
.color-search__empty p { color:var(--muted); }
.color-search__empty button { border:0; border-bottom:1px solid var(--blue); color:var(--blue); background:transparent; font-weight:700; }
.color-search__pagination { display:flex; justify-content:center; align-items:center; gap:8px; margin-top:38px; }
.color-search__pagination button { width:44px; height:44px; border:1px solid #d2d7d4; background:#fff; color:var(--blue); font-size:13px; font-weight:800; transition:.25s; }
.color-search__pagination button:hover,.color-search__pagination button.is-active { border-color:var(--blue); color:#fff; background:var(--blue); }
.color-search__pagination button:disabled { opacity:.35; pointer-events:none; }
.color-page-numbers { display:flex; gap:8px; }
.color-detail { width:min(860px,calc(100vw - 40px)); max-width:none; padding:0; border:0; color:var(--blue); background:#fff; box-shadow:0 28px 90px rgba(20,30,25,.25); }
.color-detail::backdrop { background:rgba(15,24,20,.66); backdrop-filter:blur(4px); }
.color-detail[open] { display:grid; grid-template-columns:1.05fr .95fr; animation:dialogIn .4s cubic-bezier(.16,1,.3,1); }
.color-detail__sample { min-height:500px; background:var(--detail-color,#ddd); }
.color-detail__content { display:flex; flex-direction:column; justify-content:center; padding:48px; }
.color-detail__content>span { color:var(--label); font-size:10px; font-weight:800; letter-spacing:.15em; }
.color-detail__content h3 { margin:14px 0 6px; font-size:36px; font-weight:800; }
.color-detail__content>strong { color:var(--red); font-size:15px; letter-spacing:.08em; }
.color-detail__content p { margin:30px 0; color:var(--muted); font-size:14px; line-height:1.65; }
.color-detail__copy { align-self:flex-start; margin-bottom:12px; padding:0 0 6px; border:0; border-bottom:1px solid var(--blue); color:var(--blue); background:transparent; font-size:13px; font-weight:800; }
.color-detail__close { position:absolute; right:16px; top:12px; width:40px; height:40px; border:0; background:rgba(255,255,255,.82); color:var(--blue); font-size:25px; }

.color-compare { min-height:94px; display:grid; grid-template-columns:150px 1fr auto; gap:24px; align-items:center; padding:15px 0; border:1px solid #d6dbd8; border-bottom:0; background:#fff; padding-right:max(40px,calc((100vw - var(--container))/2 + 20px)); padding-left:max(40px,calc((100vw - var(--container))/2 + 20px)); }
.color-compare>strong { color:var(--blue); font-size:16px; }
.color-compare__list { min-width:0; display:flex; gap:8px; align-items:stretch; overflow-x:auto; }
.color-compare__list>p { margin:auto 0; color:#979d99; font-size:12px; }
.color-compare__item { position:relative; flex:0 0 120px; height:50px; overflow:hidden; background:var(--compare); }
.color-compare__item>button:first-child { width:100%; height:100%;display: flex; align-items:center; padding:8px 26px 8px 8px; border:0; color:#20264f; background:transparent; text-align:left; }
.color-compare__item span { overflow:hidden; font-size:12px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.color-compare__remove { position:absolute; right:3px; top:3px; width:22px; height:22px; border:0; color:#fff; background:rgba(32,38,79,.72); line-height:1; }
.color-compare__clear { padding:7px 0; border:0; border-bottom:1px solid #939997; color:#666d69; background:transparent; font-size:14px; font-weight:600; }
.color-browser { display:grid;min-height:650px; background:var(--active-color); transition:background .55s cubic-bezier(.16,1,.3,1); grid-template-columns:minmax(390px,25%) minmax(0,68%); height:calc(100dvh - 84px);padding:25px 0;overflow: hidden;}
.color-browser__preview { display:flex;color:#20264f;position:relative; color:#191b19; background:var(--active-color); padding:clamp(42px,5vw,68px); flex-direction: column;gap:42px; }
.color-browser__top>strong { display:block;font-size:clamp(36px,4.8vw,56px); line-height:1.05; letter-spacing:.02em; }
.color-browser__top>small { display:block; margin-top:14px; font-size:16px; font-weight:800; letter-spacing:.08em; }
.color-browser__values { display:flex; width:90px; flex-direction:column; gap:0; padding:0; border-top:0; }
.color-browser__values div { display:flex;  gap:7px;  justify-content:space-between; align-items:flex-start; padding:12px 0 8px; border-bottom:1px solid rgba(32,38,79,.28); }
.color-browser__values strong { font-size:25px; line-height:1; }
.color-browser__values span { font-size:11px; font-weight:800;position:relative; top:-7px; }
.color-browser .color-chip { position:relative; border:0; background:transparent; box-shadow:none; height:68px; overflow:hidden; border:0;}
.color-browser .color-chip>i { position:absolute; inset:0; height:auto; background:var(--chip); }
.color-browser .color-chip b { max-width:100%; font-size:12px; line-height:1.15; white-space:normal;}
.color-browser .color-chip:hover,.color-browser .color-chip.is-selected { z-index:1; transform:none; outline:3px solid #fff; outline-offset:-3px; }
.color-browser .color-chip:hover:after,.color-browser .color-chip.is-selected:after { color:#fff; background:var(--blue); }
.color-browser__top { display:flex;align-items:flex-start; }
.color-browser__top>small { margin:0; color:#252825; font-size:clamp(20px,2vw,31px); line-height:1.15; letter-spacing:.02em; writing-mode:vertical-rl; text-orientation:mixed; }
.color-browser .color-search__grid {display:grid; grid-template-columns:repeat(4,1fr); align-content:start; gap:10px; padding:0 50px 0 25px; border:0; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#777 transparent; }
.color-browser .color-chip>span { inset:12px 0; justify-content:flex-start; align-items:center; padding:5px; color:#fff; background:transparent; text-align:center; text-shadow:0 1px 2px rgba(28,30,28,.24); position:absolute;  display:flex; margin-left: 10%; }
.color-browser .color-chip:before { content:none; }
.color-browser .color-chip:after { content:"+"; position:absolute; top:50%;right:5%; width:38px; height:38px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.8); border-radius:50%; color:#fff; background:rgba(32,38,79,.82); font-size:22px; opacity:0; transform:translateY(-50%) scale(.82); transition:opacity .28s cubic-bezier(.16,1,.3,1),transform .28s cubic-bezier(.16,1,.3,1); }
.color-browser .color-chip:hover:after { opacity:1; transform:translate(-50%,-50%) scale(1); }
.color-browser .color-chip.is-selected:after { content:""; left:auto; top:10px; right:10px; width:8px; height:8px; border:0; background:#fff; opacity:1; transform:none; }
.color-search { padding: clamp(48px,9vw,68px) 0 0; }
.color-search>.container-xl { width:100%; max-width:none; padding-right:0; padding-left:0; }
.color-search .color-section__head { width:min(calc(100% - 80px),var(--container)); margin-right:auto; margin-left:auto; }
.color-cta { padding:clamp(100px,10vw,160px) 0; color:#fff; background:#173e30; }
.color-cta h2 { color:#fff; }
.color-cta .container-xl>p:not(.color-eyebrow) { max-width:560px; margin:28px 0 32px; color:rgba(255,255,255,.7); font-size:17px; }
.color-intro,.matching,.projects { background:#fff; }
.library,.service { background:#f2f2f2; }
.service { color:var(--blue); }
.service .color-section__head h2,.service-stage__body h3,.service-stage h4 { color:var(--blue); }
.service .color-section__head>div>span,.service-stage__rail>span,.service-stage__body header small { color:var(--label); }
.service .color-section__head p,.service-stage__lead { color:#686d78; }
.service__steps,.service-stage { border-color:#d4d7d6; }
.service-stage__rail { border-color:#d4d7d6; }
.service-stage__rail strong { color:var(--blue); }
.service-stage__rail i { background:#cdd1cf; }
.service-stage__rail i:before { border-color:#f2f2f2; }
.service-stage__body header>b { color:var(--blue); }
.service-stage__body header>b small { color:#777c86; }
.service-stage__columns section,.service-stage dl>div { border-color:#d4d7d6; }
.service-stage li,.service-stage dd { color:#686d78; }
.service-stage dt { color:var(--blue); }
.service-stage__quality { border-color:#d1d5d3; }
.service-stage__quality section { border-color:#d1d5d3; background:#fff; }
.service-stage__quality section:nth-child(even) { background:#f7f7f7; }
.service-stage__quality section:hover { background:#eaf4ef; }
.service-stage__quality p { color:#686d78; }
.color-cta { color:var(--blue); background:#f2f2f2; border-top:1px solid #ddd; }
.color-cta .color-eyebrow--light { color:var(--label); }
.color-cta h2 { color:var(--blue); }
.color-cta .container-xl>p:not(.color-eyebrow) { color:#686d78; }

.motion-ready .motion-reveal { opacity:0; transform:translateY(34px); transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1); }
.motion-ready .motion-reveal.motion-visible { opacity:1; transform:none; }
.motion-ready .motion-reveal--left { transform:translateX(-34px); }
.motion-ready .motion-reveal--right { transform:translateX(34px); }
.motion-ready .motion-reveal--scale { transform:scale(.965); }
.motion-ready .motion-reveal.motion-visible.motion-reveal--left,.motion-ready .motion-reveal.motion-visible.motion-reveal--right { transform:translateX(0); }
.motion-ready .motion-reveal.motion-visible.motion-reveal--scale { transform:scale(1); }
.motion-ready .motion-stagger>* { opacity:0; transform:translateY(22px); transition:opacity .65s cubic-bezier(.16,1,.3,1),transform .65s cubic-bezier(.16,1,.3,1); transition-delay:calc(var(--motion-index,0) * 75ms); }
.motion-ready .motion-stagger.motion-visible>* { opacity:1; transform:none; }

@keyframes colorBars { to { transform:translateY(calc(var(--shift) - 6%)); } }
@keyframes marquee { to { transform:translateX(-50%); } }
@keyframes heroContentIn { to { opacity:1; transform:none; } }
@keyframes swatchRise { from { opacity:.25; transform:scaleY(.72); } to { opacity:1; transform:scaleY(1); } }
@keyframes captionIn { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
@media(max-width:991.98px) {
    .color-intro__grid,.color-section__head,.control__intro,.regions { grid-template-columns:1fr; }
    .library__layout { grid-template-columns:330px 1fr; }
    .matching__grid { grid-template-columns:1fr 1fr; }
    .match-panel--custom { grid-column:span 2; }
    .control__list { margin-left:0; }
    .projects__services { grid-template-columns:1fr 1fr; }
    .projects__services article:last-child { grid-column:span 2; }
    .color-search__toolbar { grid-template-columns:1fr; }
    .color-search__grid { grid-template-columns:repeat(3,1fr); }
    .color-browser { grid-template-columns:1fr; }
    .color-browser .color-search__grid { grid-template-columns:repeat(6,1fr); border-left:0; border-top:1px solid rgba(255,255,255,.4); }
    .color-browser { grid-template-columns:1fr; min-height:0; }
    .color-browser .color-chip { min-height:138px; }
    .color-family-filter { grid-template-columns:150px minmax(0,1fr); }
    .color-family-filter__result { grid-column:1; grid-row:2; text-align:left; }
    .color-family-filter .color-search__filters { grid-column:2; grid-row:1 / 3; }
}
@media(max-width:767.98px) {
  .color-section .container-xl,.color-cta .container-xl { padding-left:20px; padding-right:20px; }
  .color-search>.container-xl { padding-right:0; padding-left:0; }
  .color-search .color-section__head { width:auto; margin-right:20px; margin-left:20px; }
  .color-intro__grid>div:last-child { padding-top:0; }
  .color-section__head { gap:28px; margin-bottom:46px; }
  .library__layout { display:block; }
  .library__tabs { display:grid; grid-template-columns:1fr 1fr; border-right:0; }
  .library-tab { min-height:82px; padding:15px; border-right:1px solid #e1e6e3; font-size:12px; }
  .library-tab:hover,.library-tab.is-active { padding-left:18px; }
  .library__swatches { min-height:300px; }
  .library__caption { grid-template-columns:1fr; padding:24px; }
  .matching__grid { grid-template-columns:1fr; }
  .match-panel,.match-panel--custom { grid-column:auto; min-height:540px; padding:30px; }
  .match-panel__mark { margin-bottom:42px; }
  .matching__benefits { grid-template-columns:1fr 1fr; }
  .matching__benefits span:nth-child(2) { border-right:0; }
  .service-stage { grid-template-columns:74px 1fr; }
  .service-stage__rail { padding:30px 15px 0 0; }
  .service-stage__rail strong { font-size:42px; }
  .service-stage__rail i { left:9px; top:95px; }
  .service-stage__body { padding:32px 0 55px 24px; }
  .service-stage__body>header { display:block; }
  .service-stage__body header>b { display:block; margin-top:22px; font-size:34px; }
  .service-stage__columns { grid-template-columns:1fr; gap:35px; }
  .service-stage ul { grid-template-columns:1fr; }
  .service-stage dl>div { grid-template-columns:1fr; gap:5px; }
  .service-stage__quality { grid-template-columns:1fr; }
  .service-stage__quality section { min-height:0; padding:22px; }
  .service-stage__quality h4 { margin-top:25px; }
  .control__list li { grid-template-columns:42px 1fr; gap:16px; }
  .control__list p { grid-column:2; }
  .projects__services { grid-template-columns:1fr; margin-bottom:75px; }
  .projects__services article,.projects__services article:last-child { grid-column:auto; padding:25px 0; }
  .projects__services h3 { margin-top:35px; }
  .region-row { grid-template-columns:110px 1fr; }
  .region-swatches { grid-column:1 / -1; justify-content:flex-start; }
  .color-search__toolbar { padding:22px; gap:25px; }
  .color-search__grid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .color-chip>i { height:125px; }
  .color-chip>span { display:block; padding:13px; }
  .color-chip b,.color-chip small { display:block; }
  .color-chip small { margin-top:4px; }
  .color-search__meta>span { display:none; }
  .color-detail[open] { display:block; }
  .color-detail__sample { min-height:280px; }
  .color-detail__content { padding:32px 25px; }
  .color-compare { grid-template-columns:1fr auto; gap:12px; }
  .color-compare>strong { grid-column:1; }
  .color-compare__list { grid-column:1 / -1; grid-row:2; }
  .color-compare__clear { grid-column:2; grid-row:1; }
  .color-browser__preview {padding:24px; }
  .color-browser__values { gap:25px; }
  .color-browser__values strong { font-size:28px; }
  .color-browser .color-search__grid { grid-template-columns:repeat(4,1fr); gap:6px; padding:0 12px; }
  .color-browser .color-chip { min-height:128px; }
  .color-compare { padding-right:20px; padding-left:20px; }
  .color-browser__top { gap:35px; min-height:58%; }
  .color-browser__top>strong { font-size:40px; }
  .color-family-filter { display:block; padding:18px 20px; }
  .color-family-filter__label { margin-bottom:14px; }
  .color-family-filter .color-search__filters { margin-right:-20px; padding-right:20px; }
  .color-family-filter__result { display:block; margin-top:12px; text-align:left; }
}
@media(prefers-reduced-motion:reduce) {
  .color-hero__canvas span,.color-hero__inner>*,
  .library-panel.is-active .library__swatches span,
  .library-panel.is-active .library__caption { animation:none; opacity:1; transform:none; }
  .motion-ready .motion-reveal,.motion-ready .motion-stagger>* { opacity:1; transform:none; transition:none; }
}