.shades{--shades-pad:max(clamp(20px,4vw,56px), calc((100vw - 1440px)/2) );--shade-accent:var(--red);overflow-x:clip;background:var(--bg);font-variant-emoji:text}.shades :is(h1,h2){color:var(--red)}.shades-hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,96px);align-items:center;padding:clamp(48px,7vw,112px) var(--shades-pad) clamp(40px,5vw,80px)}.shades-hero__title{font-size:clamp(48px,7vw,116px);line-height:.98;letter-spacing:-.02em;margin:10px 0 28px}.shades-hero__lead{font-family:var(--f-display)!important;font-size:clamp(22px,2.2vw,32px);line-height:1.3;color:var(--red);max-width:24ch;margin-bottom:20px;text-wrap:balance}.shades-hero__text{max-width:56ch;font-size:16px;line-height:1.75;color:var(--ink)}.shades-hero__text+.shades-hero__text{margin-top:.9em}.shades-hero__lineup{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(8px,1vw,16px);align-items:end}.shades-hero__lineup li:nth-child(2n){transform:translateY(-28px)}.shades-hero__lineup a{display:block;color:var(--red)}.shades-hero__lineup img{width:100%;aspect-ratio:3/4;object-fit:cover;background:var(--caramel);transition:transform .35s ease}.shades-hero__lineup span{display:block;margin-top:10px;font-size:10px;font-weight:600;letter-spacing:.14em;line-height:1.4;text-transform:uppercase}@media(hover:hover){.shades-hero__lineup a:hover img{transform:translateY(-6px)}}.shades.is-animated .shades-hero__lineup li:nth-child(2n)[data-reveal]{transform:translateY(0)}.shades.is-animated .shades-hero__lineup li:nth-child(2n)[data-reveal].is-in{transform:translateY(-28px)}.shades-bar{position:sticky;top:0;z-index:20;background:var(--bg);border-block:1px solid var(--line)}.shades-bar ol{display:flex;gap:4px;padding:8px var(--shades-pad);overflow-x:auto;scrollbar-width:none}.shades-bar ol::-webkit-scrollbar{display:none}.shades-bar li{flex:0 0 auto}.shades-bar a{display:flex;align-items:center;gap:10px;min-height:44px;padding:4px 16px 4px 4px;border:1px solid transparent;border-radius:999px;color:var(--ink-2);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;transition:color .15s ease-out,border-color .15s ease-out,background-color .15s ease-out}.shades-bar img{width:36px;height:36px;border-radius:50%;object-fit:cover;background:var(--caramel)}.shades-bar a:hover{color:var(--red)}.shades-bar a[aria-current]{color:var(--ink-inv);background:var(--red);border-color:var(--red)}.shades-chapter{scroll-margin-top:60px;padding-top:clamp(64px,8vw,136px)}.shades-chapter__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,112px);align-items:start;padding-inline:var(--shades-pad)}.shades-chapter:nth-of-type(2n) .shades-chapter__media{order:-1}.shades-chapter__copy{max-width:600px}.shades-chapter:nth-of-type(odd) .shades-chapter__copy{justify-self:end}.shades-chapter__title{font-size:clamp(44px,6vw,96px);line-height:1;letter-spacing:-.02em;margin:8px 0 24px}.shades-chapter__lead{font-family:var(--f-display)!important;font-size:clamp(22px,2.1vw,30px);line-height:1.3;color:var(--red);margin-bottom:24px;text-wrap:balance}.shades-p{font-size:16px;line-height:1.8;color:var(--ink)}.shades-p+.shades-p{margin-top:1em}.shades-pair{color:var(--red);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.shades-pair:hover{color:var(--scarlet)}.shades-chapter__buy{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-top:var(--s10);padding-top:var(--s8);border-top:1px solid var(--line)}.shades-chapter__actions{display:flex;flex-wrap:wrap;gap:12px}.shades-chapter__media{position:sticky;top:84px;padding-bottom:12%}.shades-chapter__model{margin:0;aspect-ratio:4/5;overflow:hidden;background:var(--caramel)}.shades-chapter__model img{width:100%;height:100%;object-fit:cover}.shades-chapter__product{position:absolute;right:-4%;bottom:0;width:36%;border:6px solid var(--bg);background:var(--caramel);box-shadow:var(--shadow-overlay)}.shades-chapter:nth-of-type(2n) .shades-chapter__product{right:auto;left:-4%}.shades-chapter__product img{width:100%;aspect-ratio:3/4;object-fit:cover}.shades-chapter__media:not(:has(.shades-chapter__model)){padding-bottom:0}.shades-chapter__media:not(:has(.shades-chapter__model)) .shades-chapter__product{position:static;display:block;width:min(100%,420px);border:0;box-shadow:none}.shades-mantra{min-height:115svh;margin-top:clamp(56px,7vw,112px)}.shades-mantra__pin{position:sticky;top:60px;display:grid;place-items:center;min-height:calc(100svh - 60px);padding:var(--s16) var(--shades-pad);background:var(--shade-accent);color:var(--caramel);text-align:center}.shades-mantra__pin{isolation:isolate;overflow:hidden}.shades-mantra__smudge{position:absolute;left:50%;top:50%;z-index:-1;width:min(78vw,760px);height:auto;max-width:none;transform:translate(-50%,-50%) rotate(-8deg);opacity:.42;pointer-events:none}.shades-mantra__line{font-family:var(--f-display)!important;font-size:clamp(36px,5.4vw,88px);line-height:1.04;letter-spacing:-.02em}.shades-mantra__line span{display:block}.shades-mantra__line span:last-child{color:var(--ink-inv)}@supports (animation-timeline:view()){.shades.is-animated .shades-mantra__pin{animation:shades-mantra-in linear both;animation-timeline:view();animation-range:entry 0% entry 100%}@keyframes shades-mantra-in{0%{clip-path:inset(14% 8%)}to{clip-path:inset(0)}}}.shades-formula{position:relative;isolation:isolate;background:var(--coffee);color:var(--caramel)}.shades-formula:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:var(--shades-pattern) 0 0/520px;opacity:.1;pointer-events:none}.shades-formula__stamp{display:block;width:clamp(96px,9vw,140px);height:auto;margin:0 auto var(--s8);pointer-events:none}.shades.is-animated .shades-formula__stamp{animation:shades-spin 40s linear infinite}@keyframes shades-spin{to{transform:rotate(360deg)}}.shades-formula__inner{max-width:calc(1100px + var(--shades-pad) * 2);margin:0 auto;padding:clamp(72px,9vw,152px) var(--shades-pad) clamp(56px,6vw,96px)}.shades .shades-formula__eyebrow{color:var(--caramel)}.shades .shades-formula__title{font-size:clamp(40px,5.6vw,88px);line-height:1.02;letter-spacing:-.02em;color:var(--ink-inv);margin:8px 0 var(--s10);max-width:14ch}.shades-formula__copy{columns:2;column-gap:clamp(32px,5vw,80px);font-size:16px;line-height:1.8}.shades-formula__copy p{break-inside:avoid;margin-bottom:1em}.shades-recap{margin-top:var(--s16);border-top:1px solid var(--line-dark)}.shades-recap a{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,4fr) minmax(0,5fr);gap:8px 24px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line-dark);color:var(--caramel);transition:color .15s ease-out,padding-left .25s ease}.shades-recap a:hover{color:var(--ink-inv);padding-left:12px}.shades-recap__name{font-family:var(--f-display);font-size:clamp(22px,2.4vw,34px);line-height:1.1;color:var(--ink-inv)}.shades-recap__filter{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}.shades-recap__words{font-family:var(--f-display);font-size:clamp(18px,1.6vw,22px);text-align:right}.shades-formula__links{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin-top:var(--s12)}.shades .shades-formula__advice{color:var(--caramel);border-color:var(--caramel)}.shades-strap{overflow:hidden;border-top:1px solid var(--line-dark);padding-block:22px}.shades-strap__track{display:flex;width:max-content;font-family:var(--f-display)!important;font-size:clamp(20px,2.2vw,32px);letter-spacing:.04em;white-space:nowrap;color:var(--caramel)}.shades-strap__track span{padding-right:3em}.shades.is-animated .shades-strap__track{animation:shades-strap 38s linear infinite}@keyframes shades-strap{to{transform:translate(-50%)}}.shades:not(.is-animated) .shades-strap__track{width:auto;white-space:normal;justify-content:center;text-align:center;padding-inline:var(--shades-pad)}.shades:not(.is-animated) .shades-strap__track span[aria-hidden]{display:none}.shades:not(.is-animated) .shades-strap__track span{padding-right:0}.shades-plain{max-width:calc(760px + var(--shades-pad) * 2);margin:0 auto;padding:var(--s20) var(--shades-pad)}@media(max-width:999px){.shades-hero{grid-template-columns:1fr;align-items:start}.shades-hero__lineup{gap:6px}.shades-hero__lineup li:nth-child(2n),.shades.is-animated .shades-hero__lineup li:nth-child(2n)[data-reveal].is-in{transform:translateY(-14px)}.shades-hero__lineup span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.shades-chapter__grid{grid-template-columns:1fr}.shades-chapter .shades-chapter__media{order:-1;position:relative;top:auto}.shades-chapter:nth-of-type(odd) .shades-chapter__copy{justify-self:start}.shades-chapter__product,.shades-chapter:nth-of-type(2n) .shades-chapter__product{right:0;left:auto;width:34%}.shades-chapter__actions .btn{flex:1 1 auto}.shades-formula__copy{columns:1}.shades-recap a{grid-template-columns:1fr}.shades-recap__words{text-align:left}.shades-mantra{min-height:105svh}}@media(prefers-reduced-motion:reduce){.shades-mantra{min-height:0}.shades-mantra__pin{position:relative;min-height:0;padding-block:var(--s24)}.shades-hero__lineup img,.shades-recap a{transition:none}}.no-js .shades-mantra{min-height:0}.no-js .shades-mantra__pin{position:relative;min-height:50svh}
/*# sourceMappingURL=/cdn/shop/t/25/assets/five-shades.css.map */
