.creatine-problem-hero{background-color:#1a1a1a;color:#fff;overflow:hidden}.creatine-problem-hero__inner{position:relative;width:100%;min-height:540px;isolation:isolate;overflow:hidden}.creatine-problem-hero__bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.creatine-problem-hero__image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.creatine-problem-hero__overlay{display:block!important;position:absolute;top:0;right:0;bottom:0;left:0;background-color:#1a1a1a57}.creatine-problem-hero__gradient{display:block!important;position:absolute;bottom:0;left:0;right:0;height:60%;background:linear-gradient(to top,#1a1a1a,#1a1a1a00)}.creatine-problem-hero__content{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:space-between;min-height:540px;padding-top:32px;padding-bottom:32px;box-sizing:border-box;gap:32px}.creatine-problem-hero__content--bottom-left{justify-content:flex-end;gap:16px}.creatine-problem-hero__content--bottom-left .creatine-problem-hero__heading{margin-top:0;margin-bottom:auto}.creatine-problem-hero__content--bottom-left .creatine-problem-hero__quote{text-align:left;margin:0}.creatine-problem-hero__heading{margin:0;font-weight:700;font-size:32px;line-height:1.1;letter-spacing:-.6px;color:#fff;max-width:100%;text-align:left}.creatine-problem-hero__cards{list-style:none;margin:0 -16px 0 0;padding:0 16px 0 0;display:flex;gap:12px}.creatine-problem-hero__card{display:flex;flex-direction:column;gap:16px;align-items:flex-start;padding:16px;border-radius:12px;background:linear-gradient(to top,#454545,#45454529);backdrop-filter:blur(13.3px);-webkit-backdrop-filter:blur(13.3px);flex:1 1 0;min-width:0;align-self:stretch}.creatine-problem-hero__card-icon{display:inline-flex;align-items:center;justify-content:center;background:#fff;border-radius:999px;padding:10px;width:44px;height:44px;flex:0 0 auto;box-sizing:border-box;color:#1a1a1a}.creatine-problem-hero__icon-img{width:24px;height:24px;display:block;object-fit:contain}.creatine-problem-hero__card-icon svg.creatine-problem-hero__icon-img{color:#1a1a1a}.creatine-problem-hero__card-text{margin:0;font-weight:500;font-size:14px;line-height:22px;letter-spacing:.07px;color:#fff}.creatine-problem-hero__quote{margin:0 auto;font-weight:700;font-style:italic;font-size:16px;line-height:22px;letter-spacing:.07px;color:#dbd8d4;text-align:center;max-width:600px}@media screen and (min-width:990px){.creatine-problem-hero__inner{min-height:925px}.creatine-problem-hero__content{min-height:925px;gap:0;padding-top:var(--space-section)}.creatine-problem-hero__heading{font-size:56px;letter-spacing:-1px;max-width:664px}.creatine-problem-hero__cards{flex-direction:row;gap:16px;margin-top:auto;margin-bottom:24px}.creatine-problem-hero__card{padding:24px;gap:24px;align-items:flex-start;height:206px;align-self:auto}.creatine-problem-hero__card-icon{width:52px;height:52px;padding:12px}.creatine-problem-hero__icon-img{width:28px;height:28px}.creatine-problem-hero__card-text{font-size:16px}.creatine-problem-hero__quote{font-size:16px;line-height:22px;margin-top:40px;max-width:800px}.creatine-problem-hero__content--bottom-left .creatine-problem-hero__quote{max-width:100%}}@media screen and (max-width:1299px){creatine-problem-hero__content{gap:0}.creatine-problem-hero__cards{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;margin-top:auto}.creatine-problem-hero__cards::-webkit-scrollbar{display:none}.creatine-problem-hero__card{min-width:180px;padding:20px}}@media screen and (max-width:749px){.creatine-problem-hero__heading br{display:none}.creatine-problem-hero--bottom-left .creatine-problem-hero__inner{aspect-ratio:375/775}.creatine-problem-hero--bottom-left .creatine-problem-hero__heading{text-align:center}.creatine-problem-hero--bottom-left .creatine-problem-hero__content{height:100%}.creatine-problem-hero--bottom-left .creatine-problem-hero__quote{text-align:center;margin-top:2.4rem;padding-top:2.4rem;border-top:1px dashed rgba(255,255,255,.18)}.creatine-problem-hero--bottom-left .creatine-problem-hero__overlay,.creatine-problem-hero--bottom-left .creatine-problem-hero__gradient{display:none!important}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/ux-creatine-problem-hero.css.map */