.trg-colour-v2{--offwhite: #f7f4ec;--border-2: #c2bdb0;--border-strong: #a8a398;background:var(--offwhite);padding:clamp(56px,6vw,88px) 0;border-bottom:1px solid var(--border)}.trg-colour-v2__container{max-width:1760px;margin:0 auto;padding:0 clamp(20px,3vw,40px)}.trg-colour-v2__header{display:flex;justify-content:space-between;align-items:last baseline;margin-bottom:36px;gap:24px;flex-wrap:wrap}.trg-colour-v2__eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;color:var(--green);text-transform:uppercase}.trg-colour-v2__eyebrow:before{content:"";display:inline-block;width:18px;height:2px;background:var(--green-line)}.trg-colour-v2__heading{font-family:var(--f-display);font-size:clamp(32px,3.4vw,46px);font-weight:400;margin:6px 0 0;letter-spacing:-.01em;max-width:22ch;line-height:1.05;color:var(--ink)}.trg-colour-v2__heading p{margin:0}.trg-colour-v2__heading em{color:var(--green);font-style:italic}.trg-colour-v2__right{font-family:var(--f-mono);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;max-width:32ch;text-align:right}.trg-colour-v2__right p{margin:0}.trg-colour-v2__layout{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(0,1.6fr);gap:clamp(24px,3vw,56px);align-items:start}.trg-colour-v2__matrix-box{position:sticky;top:88px}.trg-colour-v2__matrix-label{font-family:var(--f-mono);font-size:10px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;margin-bottom:12px}.trg-colour-v2__matrix{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}.trg-colour-v2__swatch{aspect-ratio:1 / 1;border-radius:3px;cursor:pointer;position:relative;transition:transform .16s ease,box-shadow .16s ease;outline:1px solid rgba(0,0,0,.04)}.trg-colour-v2__swatch:hover{transform:scale(1.12);z-index:4;box-shadow:0 4px 16px #0000002e}.trg-colour-v2__swatch.is-active{transform:scale(1.18);z-index:5;box-shadow:0 0 0 2px var(--offwhite),0 0 0 3px var(--ink),0 6px 20px #0003}.trg-colour-v2__matrix-meta{margin-top:22px;padding-top:18px;border-top:1px solid var(--border-2);display:flex;flex-direction:column;gap:8px}.trg-colour-v2__row{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--f-mono);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.trg-colour-v2__row .trg-colour-v2__v{color:var(--ink);font-family:var(--f-display);font-size:18px;letter-spacing:-.005em}.trg-colour-v2__current{font-family:var(--f-display);font-size:clamp(28px,2.6vw,38px);color:var(--ink);margin:6px 0 0}.trg-colour-v2__current em{color:var(--green);font-style:italic}.trg-colour-v2__cta{margin-top:14px;display:inline-flex;align-items:center;font-family:var(--f-mono);font-size:11px;min-height:44px;letter-spacing:.06em;color:var(--green);text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--green-line);padding-bottom:2px;align-self:flex-start}.trg-colour-v2__cta:hover{border-bottom-color:var(--green)}.trg-colour-v2__wall{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.trg-colour-v2__w-tile{aspect-ratio:4 / 5;border-radius:4px;overflow:hidden;position:relative;background:var(--surface, #fbfaf7);box-shadow:inset 0 0 0 1px #302d270d;transition:opacity .2s ease,transform .2s ease,box-shadow .2s ease;text-decoration:none;color:inherit;display:block}.trg-colour-v2__w-tile:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px #302d2714,0 14px 28px #302d271a}.trg-colour-v2__w-img{position:absolute;top:0;right:0;bottom:0;left:0;transition:transform .6s ease;background:var(--trg-pcard-media-bg, #f7f6f1);display:flex;align-items:center;justify-content:center;overflow:hidden}.trg-colour-v2__w-img:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 32%,rgba(255,255,255,.32) 0 16%,transparent 40%),linear-gradient(145deg,#f7f4ec57,#f7f4ec0f 46%,#231f191a);opacity:.82;pointer-events:none}.trg-colour-v2__w-tile.is-loading .trg-colour-v2__w-img:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.26) 42%,transparent 72%);transform:translate(-100%);animation:trg-colour-v2-sheen 1.4s ease-in-out infinite;pointer-events:none}.trg-colour-v2__w-tile:hover .trg-colour-v2__w-img{transform:scale(1.05)}.trg-colour-v2__w-img img{width:100%;height:100%;display:block;object-fit:contain;object-position:center;color:transparent;opacity:0;position:relative;z-index:1;transition:opacity .26s ease}.trg-colour-v2__w-tile.is-loaded .trg-colour-v2__w-img img{opacity:1}.trg-colour-v2__w-tile.is-image-missing .trg-colour-v2__w-img img{display:none}.trg-colour-v2__w-tile:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.5) 0%,transparent 50%);pointer-events:none}.trg-colour-v2__w-tile.is-loading:after{background:linear-gradient(to top,rgba(38,34,28,.16) 0%,transparent 48%)}.trg-colour-v2__w-lab{position:absolute;left:10px;right:10px;bottom:10px;z-index:2;color:#fff;opacity:1;transform:translateY(0);transition:opacity .18s ease,transform .18s ease}.trg-colour-v2__w-tile.is-loading .trg-colour-v2__w-lab{opacity:0;transform:translateY(4px)}.trg-colour-v2__w-name{font-family:var(--f-display);font-size:13px;line-height:1.05}.trg-colour-v2__w-meta{font-family:var(--f-mono);font-size:9px;letter-spacing:.06em;opacity:.85;margin-top:2px}.trg-colour-v2__w-dot{position:absolute;top:8px;right:8px;z-index:2;width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.85);box-shadow:0 1px 4px #0000004d}@keyframes trg-colour-v2-sheen{0%{transform:translate(-100%)}55%,to{transform:translate(100%)}}@media(prefers-reduced-motion:reduce){.trg-colour-v2__w-tile,.trg-colour-v2__w-img,.trg-colour-v2__w-img img,.trg-colour-v2__w-lab{transition:none}.trg-colour-v2__w-tile.is-loading .trg-colour-v2__w-img:after{animation:none}}@media(max-width:1100px){.trg-colour-v2__layout{grid-template-columns:1fr}.trg-colour-v2__matrix-box{position:static}.trg-colour-v2__wall{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.trg-colour-v2__wall{grid-template-columns:repeat(2,1fr)}.trg-colour-v2__right{text-align:left}}
/*# sourceMappingURL=/cdn/shop/t/51/assets/trg-colour-guide-homepage-v2-20260530.css.map */