.brand-kit-link{--brand-kit-cream:243 239 230;--brand-kit-ease:cubic-bezier(.22, 1, .36, 1);--brand-kit-spring:cubic-bezier(.34, 1.36, .64, 1);background-color:rgb(var(--brand-kit-cream) / .09);height:48px;color:rgb(var(--brand-kit-cream) / .9);letter-spacing:-.02em;transition:background-color .4s var(--brand-kit-ease), color .4s var(--brand-kit-ease);border-radius:9999px;align-items:center;gap:8px;padding-inline:20px;font-size:16px;font-weight:500;line-height:1.25;display:inline-flex;position:relative}.brand-kit-link:hover{background-color:rgb(var(--brand-kit-cream) / .15);color:rgb(var(--brand-kit-cream))}.brand-kit-link:focus-visible{box-shadow:0 0 0 2px rgb(var(--brand-kit-cream) / .5);outline:none}.brand-kit-icon{width:17px;height:17px;display:grid;position:relative}.brand-kit-icon>svg{width:17px;height:17px;transition:opacity .6s var(--brand-kit-ease), transform .7s var(--brand-kit-spring);grid-area:1/1}.brand-kit-icon>svg[data-active=false]{opacity:0;transform:scale(.4)rotate(-45deg)}.brand-kit-labels{transition:width .7s var(--brand-kit-spring);display:grid;overflow:hidden}.brand-kit-labels>span{white-space:nowrap;transition:opacity .6s var(--brand-kit-ease), transform .7s var(--brand-kit-ease), filter .6s var(--brand-kit-ease);grid-area:1/1;justify-self:start}.brand-kit-labels>span[data-state=before]{opacity:0;filter:blur(3px);transform:translateY(10px)}.brand-kit-labels>span[data-state=after]{opacity:0;filter:blur(3px);transform:translateY(-10px)}.brand-kit-sparkles{pointer-events:none;position:absolute;inset:50% auto auto 50%}.brand-kit-sparkle{width:var(--size);height:var(--size);margin:calc(var(--size) / -2) 0 0 calc(var(--size) / -2);color:rgb(var(--brand-kit-cream));opacity:0;animation:brand-kit-sparkle 1.1s var(--brand-kit-ease) var(--delay) forwards;position:absolute}@keyframes brand-kit-sparkle{0%{opacity:0;transform:translate(0)scale(0)rotate(0)}25%{opacity:1;transform:translate(calc(var(--dx) * .45), calc(var(--dy) * .45)) scale(1) rotate(45deg)}to{opacity:0;transform:translate(var(--dx), var(--dy)) scale(.2) rotate(120deg)}}@media (prefers-reduced-motion:reduce){.brand-kit-link,.brand-kit-icon>svg,.brand-kit-labels,.brand-kit-labels>span{transition:none}.brand-kit-sparkles{display:none}}
.brand-palette-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:36px 20px;padding-top:8px;display:grid}.brand-swatch{grid-column:span 5;min-width:0}.brand-swatch[data-color=ruby]{grid-column:span 7}.brand-swatch:is([data-color=off-white],[data-color=cream],[data-color=black]){grid-column:span 4}.brand-swatch-button{text-align:left;cursor:pointer;flex-direction:column;width:100%;height:100%;display:flex}.brand-swatch-color{align-items:flex-end;width:100%;min-height:260px;padding:28px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff14}.brand-swatch:is([data-color=off-white],[data-color=cream],[data-color=black]) .brand-swatch-color{min-height:180px}.brand-swatch-hex{font:13px var(--font-body);opacity:.8;position:absolute;top:24px;left:28px}.brand-swatch-name{font:400 clamp(42px, 5vw, 72px)/1 var(--font-display);letter-spacing:-.05em;transition:transform .4s var(--ease-out-quint)}.brand-swatch:is([data-color=off-white],[data-color=cream],[data-color=black]) .brand-swatch-name{font-size:clamp(28px,3.5vw,48px)}.brand-swatch-copy{opacity:.65;border-radius:50%;place-items:center;width:30px;height:30px;transition:opacity .2s;display:grid;position:absolute;top:20px;right:24px}.brand-swatch-button:hover .brand-swatch-copy,.brand-swatch-button:focus-visible .brand-swatch-copy{opacity:1}.brand-swatch-button:hover .brand-swatch-name{transform:translate(4px)}.brand-swatch-button:focus-visible{outline-offset:5px;outline:2px solid #f9f5f0}.brand-swatch-details{flex-direction:column;gap:8px;padding:18px 0 0;display:flex}.brand-swatch-role{color:#f3efe6d9;justify-content:space-between;gap:12px;font-size:14px;display:flex}.brand-swatch-status{font-size:12px}.brand-swatch-note{color:#f3efe699;max-width:48ch;font-size:13px;line-height:1.6}.brand-swatch-print{color:#f3efe666;font-size:11px;line-height:1.5}@media (max-width:639px){.brand-palette-grid{grid-template-columns:minmax(0,1fr);gap:28px}.brand-swatch,.brand-swatch:is([data-color=ruby],[data-color=off-white],[data-color=cream],[data-color=black]){grid-column:auto}.brand-swatch-color{min-height:220px;padding:24px}.brand-swatch-hex{left:24px}}@media (prefers-reduced-motion:reduce){.brand-swatch-name,.brand-swatch-copy{transition:none}.brand-swatch-button:hover .brand-swatch-name{transform:none}}