.beauty-ingredient-spotlight{position:relative;width:100%;overflow:hidden}.beauty-ingredient-spotlight__inner{max-width:1400px;margin:0 auto;padding:0 40px}.beauty-ingredient-spotlight__header{text-align:center;margin-bottom:60px}.beauty-ingredient-spotlight__title{font-family:PFGrandGothikExtended,sans-serif;margin:0 0 16px;letter-spacing:-.5px}.beauty-ingredient-spotlight__subtitle{font-family:Acumin Variable Concept,sans-serif;max-width:700px;margin:0 auto}.beauty-ingredient-spotlight__grid{display:grid;gap:32px}.beauty-ingredient-spotlight__card{position:relative;background-color:#fff;overflow:hidden;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);border:1px solid #e0e0e0}.beauty-ingredient-spotlight__card:hover{transform:translateY(-8px);box-shadow:0 12px 32px #0000001f}.beauty-ingredient-spotlight__image-wrapper{position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;background-color:#f5f5f5}.beauty-ingredient-spotlight__image{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.4,0,.2,1)}.beauty-ingredient-spotlight__card:hover .beauty-ingredient-spotlight__image{transform:scale(1.08)}.beauty-ingredient-spotlight__placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#f0f0f0}.beauty-ingredient-spotlight__placeholder svg{width:60px;height:60px;opacity:.3}.beauty-ingredient-spotlight__overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.4) 60%,transparent 100%);padding:24px;transform:translateY(0);transition:all .4s cubic-bezier(.4,0,.2,1)}.beauty-ingredient-spotlight__card:hover .beauty-ingredient-spotlight__overlay{background:linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.6) 80%,transparent 100%)}.beauty-ingredient-spotlight__content{position:relative;z-index:2}.beauty-ingredient-spotlight__name{font-family:PFGrandGothikExtended,sans-serif;font-size:24px;line-height:1.2;font-weight:400;color:#fff;margin:0 0 8px;letter-spacing:-.3px}.beauty-ingredient-spotlight__tag{font-family:Acumin Variable Concept,sans-serif;font-size:12px;line-height:1.4;color:#ccc;text-transform:uppercase;letter-spacing:1px;margin:0 0 12px}.beauty-ingredient-spotlight__description{font-family:Acumin Variable Concept,sans-serif;font-size:14px;line-height:1.6;color:#fff;margin:0;opacity:0;max-height:0;overflow:hidden;transition:all .4s cubic-bezier(.4,0,.2,1)}.beauty-ingredient-spotlight__card:hover .beauty-ingredient-spotlight__description{opacity:1;max-height:200px;margin-top:12px}.beauty-ingredient-spotlight__percentage{position:absolute;top:16px;right:16px;background-color:#000000bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-family:PFGrandGothikExtended,sans-serif;font-size:18px;padding:8px 16px;border-radius:4px;z-index:3}@media screen and (min-width:991px){.beauty-ingredient-spotlight__grid[data-columns="2"]{grid-template-columns:repeat(2,1fr)}.beauty-ingredient-spotlight__grid[data-columns="3"]{grid-template-columns:repeat(3,1fr)}.beauty-ingredient-spotlight__grid[data-columns="4"]{grid-template-columns:repeat(4,1fr)}}@media screen and (max-width:990px){.beauty-ingredient-spotlight__inner{padding:0 24px}.beauty-ingredient-spotlight__header{margin-bottom:40px}.beauty-ingredient-spotlight__grid{grid-template-columns:repeat(2,1fr);gap:24px}.beauty-ingredient-spotlight__overlay{padding:20px}.beauty-ingredient-spotlight__name{font-size:20px}.beauty-ingredient-spotlight__tag{font-size:11px}.beauty-ingredient-spotlight__description{font-size:13px}}@media screen and (max-width:749px){.beauty-ingredient-spotlight__inner{padding:0 16px}.beauty-ingredient-spotlight__header{margin-bottom:32px}.beauty-ingredient-spotlight__grid{grid-template-columns:1fr;gap:20px}.beauty-ingredient-spotlight__overlay{padding:16px}.beauty-ingredient-spotlight__name{font-size:18px}.beauty-ingredient-spotlight__tag{font-size:10px}.beauty-ingredient-spotlight__description{font-size:12px}.beauty-ingredient-spotlight__percentage{font-size:16px;padding:6px 12px;top:12px;right:12px}.beauty-ingredient-spotlight__description{opacity:1;max-height:none;margin-top:12px}}.beauty-ingredient-spotlight__card:focus{outline:2px solid currentColor;outline-offset:4px}.beauty-ingredient-spotlight__card:focus:not(:focus-visible){outline:none}
/*# sourceMappingURL=/cdn/shop/t/3/assets/beauty-ingredient-spotlight.css.map */