.swatch{margin-bottom:16px}.swatch__preview{align-items:center;border-radius:4px;display:flex;height:7rem;justify-content:center}.swatch__preview--border{box-shadow:0 0 0 1px #e6ebf8 inset}.swatch__detail{display:grid;grid-template-areas:"title" "description" "details";grid-template-columns:1fr}.swatch__button{opacity:0;transition:.3s ease}.swatch:hover .swatch__button,.swatch .swatch__button:focus{opacity:1}.swatch__title{font-size:1.375rem;font-weight:600;line-height:1.2;color:#242d48;align-self:flex-end;text-align:left}.swatch h3{margin:16px 0 8px}@media screen and (min-width: 0)and (max-width: 599px){.swatch h3{margin:8px 0}}.swatch__code{display:inline-block;line-height:1;margin:8px 0;white-space:nowrap}.swatch__hex{font-size:.75rem;font-weight:500;text-transform:uppercase;color:#485478}.swatch__reference{font-size:.75rem;font-weight:500;text-transform:uppercase;color:#485478;align-items:center;align-self:flex-end;display:flex;grid-area:description}.swatch__meta{display:grid;grid-area:details;grid-gap:8px;grid-template-rows:auto auto auto;text-align:left}.swatch ul{padding:16px 0}@media screen and (min-width: 0)and (max-width: 599px){.swatch ul{padding:0}}.swatch__meta-item{font-feature-settings:"tnum" on;font-variant:tabular-nums;font-size:.875rem;font-weight:600;line-height:1.2;color:#242d48;letter-spacing:.5px;text-transform:uppercase;list-style:none}.swatch__meta-badge{background:#e6ebf8;border:0;margin-right:8px}.swatch__definition-list{align-items:baseline;display:inline-flex}.swatch__definition-description{font-feature-settings:"tnum" on;font-variant:tabular-nums;font-size:.875rem;line-height:1.2;color:#242d48;display:inline-flex;font-weight:600;margin-right:8px}.swatch__definition-term{font-size:.75rem;font-weight:500;text-transform:uppercase;color:#485478;display:inline-flex;margin-right:2px}.swatch--detailed{display:grid;grid-gap:16px;grid-template-columns:auto 1fr;margin:0}.swatch--detailed .swatch__title{font-size:1.25rem;font-weight:600;line-height:1.2;color:#242d48}.swatch--detailed .swatch__preview{height:3rem;width:3rem}.swatch--detailed .swatch__detail{grid-template-areas:"title details" "description details";grid-template-columns:1fr 2fr;padding:0}.swatch--detailed .swatch__meta{align-items:center;grid-column-gap:24px;grid-template-columns:1fr 1fr;grid-template-rows:1fr;justify-content:flex-start;padding:0}.color-palette__palette-title{font-size:1.25rem;font-weight:600;line-height:1.2;color:#242d48;margin-bottom:24px}.color-palette ol{list-style:none}.color-palette__palette{display:grid;grid-gap:24px;grid-template-columns:1fr 1fr 1fr}@media screen and (min-width: 0)and (max-width: 599px){.color-palette__palette{grid-template-columns:1fr}}.color-palette--stacked .color-palette__palette{max-width:800px;display:grid;grid-gap:16px;grid-template-columns:1fr;list-style:none;margin-bottom:40px}.color-palette--stacked .color-palette__palette h3{margin:0}.color-palette figure>figcaption{margin-bottom:8px}figure.swatch{margin:0}