.favourite-colours{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px 20px}.colour-card{min-width:0}.colour-sample{height:170px;border-radius:16px;background:var(--colour);display:block;position:relative;border:1px solid #17283b10;overflow:hidden;transition:transform .25s,box-shadow .25s}.colour-sample:hover{transform:translateY(-3px);box-shadow:0 5px 15px #20282a12}.colour-pick{position:absolute;top:12px;left:12px;border-radius:99px;padding:5px 9px;color:#213d51;background:#ffffffe8;font-size:9px;line-height:1.5}.sample-open{position:absolute;bottom:12px;right:12px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:#ffffffd9;border-radius:50%;font-size:18px;color:#20374b}.colour-card-body{padding:15px 1px 0}.colour-card h3{font-size:18px;letter-spacing:-.02em;line-height:1.3;margin:0 0 4px}.colour-code{font-size:10px;letter-spacing:.06em;color:#7e8788;display:block;min-height:17px}.colour-preview-link{font-size:11px;display:block;margin-top:7px;text-decoration:underline;text-underline-offset:4px;color:var(--navy)}.colour-search-heading{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:22px}.colour-search-heading p:not(.eyebrow){font-size:16px;margin-bottom:0}.colour-search-label{display:block;font-size:13px;max-width:700px}.colour-search-label input{margin-top:10px;height:58px;background:#fbfcf9;padding-inline:18px;font-size:16px}.colour-filters{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}.colour-filters button{border:1px solid #c9d0cb;border-radius:99px;min-height:42px;padding:10px 16px;background:transparent;font-size:12px;color:var(--ink)}.colour-filters button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}.colour-result-count{font-size:12px;margin:24px 0}.colour-library-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 22px}.colour-library-grid .colour-sample{height:195px}.colour-card[hidden]{display:none}.colour-library-grid .colour-card h3{font-size:20px}.colour-load-more{text-align:center;margin-top:40px}.colour-load-more button[hidden]{display:none}.colour-scope{max-width:620px;text-align:center;font-size:12px;line-height:1.7;margin:28px auto 0}.colour-empty{border-block:1px solid #c9d0cb;padding:40px 0;text-align:center}.colour-empty[hidden]{display:none}.colour-empty h3{font-size:27px}.colour-empty p{font-size:14px}.colour-empty a{text-decoration:underline}.colour-references{border-top:1px solid #d6dcd6;margin-top:48px;padding-top:20px;font-size:13px;color:var(--muted)}.colour-references summary{cursor:pointer;padding:5px 0}.colour-references p{font-size:12px;max-width:800px;margin-top:18px}.colour-references>div{display:flex;gap:10px 18px;flex-wrap:wrap}.colour-references a{font-size:10px;text-decoration:underline;text-underline-offset:3px}.studio-catalogue-link{text-align:right;margin-bottom:24px}.studio-catalogue-link .text-link{font-size:13px}
@media(max-width:1050px){.favourite-colours{gap:25px 15px}.colour-sample{height:145px}.colour-card h3{font-size:17px}.colour-library-grid .colour-sample{height:170px}.colour-library-grid .colour-card h3{font-size:18px}}
@media(max-width:750px){.favourite-colours{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 15px}.colour-library-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:27px 15px}.colour-search-heading{display:block}.colour-search-heading .button{margin-top:22px}.colour-library-grid .colour-sample{height:145px}}
@media(max-width:620px){.favourite-colours,.colour-library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 15px}.colour-sample,.colour-library-grid .colour-sample{height:155px;border-radius:13px}.colour-card h3,.colour-library-grid .colour-card h3{font-size:18px}.colour-pick{top:10px;left:10px;font-size:8px;padding:5px 8px}.colour-search-heading h2{font-size:39px}.colour-search-heading p:not(.eyebrow){font-size:14px}.colour-search-label{font-size:12px}.colour-search-label input{font-size:16px;height:54px;white-space:nowrap}.colour-filters{gap:7px}.colour-filters button{font-size:10px;padding:9px 12px;min-height:39px}.colour-result-count{font-size:11px}.colour-scope{font-size:11px}.colour-preview-link{font-size:11px}.colour-references{margin-top:34px}.studio-catalogue-link{text-align:left;margin-top:-18px}}

.mobile-colour-jump{display:none}