.color-experience{display:grid;grid-template-columns:minmax(240px, .8fr) 1.7fr;gap:45px;margin-top:45px;align-items:start}.sample-panel{position:sticky;top:25px;background:#efeee6;color:#203b2e;padding:18px}.sample-large{aspect-ratio:1.15;background:#79766a;display:flex;flex-direction:column;justify-content:space-between;padding:22px;transition:background-color .35s;color:#fff;text-shadow:0 1px 5px #0008;position:relative;overflow:hidden}.sample-large:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,#ffffff1c,transparent 45%,#00000014);border:1px solid #ffffff20}.sample-large>span{font-size:10px;letter-spacing:2px;z-index:1}.sample-large>span:last-child{align-self:flex-end;font-family:monospace;font-size:14px}.sample-info{padding:25px 6px 15px}.sample-kicker{font-size:8px;letter-spacing:2px;color:#6f7d68;margin-bottom:9px}.sample-info h3{font-size:29px;letter-spacing:-1px;margin-bottom:6px}.sample-info>p:last-child{font-size:11px;color:#78836f;margin:0}.sample-actions{display:flex;gap:7px;margin-bottom:10px}.sample-actions button{flex:1;background:none;color:#2b4836;border:1px solid #b6bdac;font:inherit;font-size:10px;padding:12px 5px;cursor:pointer}.sample-actions button:hover{background:#dedfd2}.color-cta{width:100%;font-size:11px;min-width:0;padding:16px}.sample-panel #color-status{font-size:10px;min-height:15px;margin:12px 5px 0;color:#66785c}.filters{display:flex;flex-wrap:wrap;gap:7px}.filters button{font:inherit;font-size:10px;border:1px solid #546b59;border-radius:25px;background:transparent;color:#d1dfcb;padding:10px 14px;cursor:pointer;transition:background .15s}.filters button:hover{background:#324d3b}.filters button.active{background:#d9aa59;color:#172d24;border-color:#d9aa59}.color-search{display:block;font-size:9px;letter-spacing:1px;color:#abbca3;margin-top:23px}.color-search input{display:block;width:100%;margin-top:8px;background:#ffffff07;border:1px solid #4c6551;padding:13px 15px;font:inherit;font-size:13px;letter-spacing:0;color:#fff;border-radius:0}.color-search input::placeholder{color:#a1b09b}.color-count{font-size:10px;color:#9faf96;margin:20px 0 15px}.swatch-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px 12px;max-height:650px;overflow:auto;padding:4px 6px 12px 4px;scrollbar-color:#668262 #203a2b}.swatch{position:relative;appearance:none;background:none;border:0;color:#e7ebdf;padding:0;text-align:left;cursor:pointer;font:inherit;min-width:0}.swatch-color{display:block;aspect-ratio:1;border:1px solid #ffffff18;transition:transform .18s,box-shadow .18s;background:var(--shade)}.swatch:hover .swatch-color{transform:translateY(-3px);box-shadow:0 5px 15px #0004}.swatch[aria-pressed=true] .swatch-color{outline:2px solid #deb76e;outline-offset:3px}.swatch-name{display:block;font-size:10px;line-height:1.4;margin-top:10px}.swatch-code{display:block;font-size:8px;letter-spacing:.6px;color:#96a78d;margin-top:3px}.swatch-saved{position:absolute;right:7px;top:5px;color:#fff;text-shadow:0 1px 4px #000;font-size:15px}.color-note{margin-top:30px!important}.color-cta:hover{text-decoration:none}#contact-color{border-left:2px solid #d9aa59;padding:12px 17px;background:#ffffff08;max-width:600px;font-size:13px;color:#dee8d8}#empty-colors{font-size:13px;line-height:1.7;padding:20px 0;color:#bbc9b1}@media(max-width:1000px){.color-experience{gap:25px;grid-template-columns: .85fr 1.3fr}.swatch-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:700px){.color-experience{grid-template-columns:1fr;margin-top:30px}.sample-panel{position:static;display:grid;grid-template-columns:105px 1fr;gap:10px 15px;padding:14px}.sample-large{aspect-ratio:1;grid-row:1/3;padding:10px}.sample-large>span{font-size:6px;letter-spacing:1px}.sample-large>span:last-child{font-size:10px}.sample-info{padding:5px 0}.sample-info h3{font-size:23px}.sample-kicker{font-size:7px;margin-bottom:6px}.sample-actions{margin:0}.sample-actions button{font-size:9px;padding:8px 3px}.color-cta{grid-column:1/-1}.sample-panel #color-status{grid-column:1/-1;margin:0;min-height:12px}.swatch-grid{max-height:520px;grid-template-columns:repeat(4,minmax(0,1fr))}.filters button{padding:10px 12px}.swatch-name{font-size:10px}}@media(prefers-reduced-motion:reduce){.sample-large,.swatch-color,.filters button{transition:none}}
