.routines-section{padding-top:var(--mg-top-desktop);padding-bottom:var(--mg-bottom-desktop);background:var(--background)}.routines-section .routines-title{margin:0;font-size:var(--fs-desktop);margin-bottom:var(--mb-desktop)}.routines-section .routines-content-wrapper{display:grid;grid-template-columns:repeat(2,1fr);column-gap:18px;align-items:start}.routines-section .routines-content-wrapper>*{border-radius:20px;box-shadow:0 7px 12px -4px #00000038}.routines-section .routine-steps .routine-title,.routines-section .routine-tutorial .tutorial-title{margin:0 0 28px;font-family:var(--font-family-1);font-size:28px;color:var(--color);transition:color .7s ease-in-out}.routines-section .routine-vertical-line{display:block;position:absolute;top:0;bottom:0;left:23px;width:2px;background-color:var(--line-color);z-index:0;transition:background-color .3s ease-in-out .4s}.routines-section .routine-tutorial .use-steps,.routines-section .routine-steps ol{counter-reset:li;list-style-type:none;border-radius:8px;margin:20px 0;padding:0;position:relative}.routines-section .routine-steps ol li,.routines-section .routine-tutorial .use-steps li{color:var(--color);counter-increment:li;margin-bottom:24px;padding-left:64px;position:relative;display:flex;align-items:flex-start;transition:color .7s ease-in-out}.routines-section .routine-steps ol li .title,.routines-section .routine-tutorial .use-steps li .title{min-height:40px;font-size:18px;line-height:40px}.routines-section .routine-steps ol li:last-of-type,.routines-section .routine-tutorial .use-steps li:last-of-type{margin-bottom:0}.routines-section .routine-steps ol li:before,.routines-section .routine-tutorial .use-steps li:before{top:-4px;left:0;width:40px;min-width:40px;height:40px;min-height:40px;position:absolute;display:inline-block;box-sizing:content-box;margin-right:18px;border-radius:100%;background:var(--step-bg);border:4px solid var(--bg);font-weight:600;font-size:18px;line-height:40px;text-align:center;color:var(--step-text);content:counter(li);transition:border 0s ease-in-out .4s,background .3s ease-in-out .4s}.routines-section .routine-steps.noite{--color: #fff;--color-desc: rgba(255, 255, 255, .85);--bg: #36507a;--line-color: #fefefe;--border-color: #36507a;--step-bg: #47A9C6;--step-text: #183842;--active-step-bg: #183842}.routines-section .routine-steps.dia{--color: #1d1d1d;--color-desc: rgba(29, 29, 29, .85);--bg: #fffaf5;--line-color: #ececec;--border-color: #ccc;--step-bg: #47A9C6;--step-text: #183842;--active-step-bg: #183842}.routines-section .routine-steps{position:relative;color:var(--color);padding:28px;height:auto;min-height:0;max-height:none;transition:background-color .3s ease-in-out .4s,border .3s ease-in-out .4s}.routines-section .circle{display:block;position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;width:calc(100% + 4px);height:calc(100% + 4px);border-radius:20px;clip-path:circle(0% at 100% 0%);z-index:-1;transition:clip-path .7s ease-in-out}.routines-section .bg{display:block;position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;width:calc(100% + 4px);height:calc(100% + 4px);border-radius:20px;z-index:-2;background-color:var(--bg);transition:background-color .3s ease-in-out .4s}.routines-section .circle-dia{background-color:#fffaf5}.routines-section .circle-noite{background-color:#36507a}.routines-section .circle.grow{animation-name:circle-grow;animation-duration:.7s;animation-timing-function:ease-in-out}.routines-section .routine-toggle{position:absolute;top:28px;right:28px;display:inline-flex;align-items:center;gap:6px;padding:4px;border-radius:999px;background:#f9f5fe;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:3}.routines-section .routine-toggle-option{-webkit-appearance:none;appearance:none;border:0;background:transparent;border-radius:999px;min-height:40px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;color:#1d1d1d;transition:background-color .25s ease,color .25s ease,transform .25s ease}.routines-section .routine-toggle-option span{font-size:14px;font-weight:600;line-height:1}.routines-section .routine-toggle-option .icon{display:flex;align-items:center;justify-content:center}.routines-section .routine-toggle-option .icon path{stroke:currentColor}.routines-section .routine-toggle-option:hover{background:#ffffff73}.routines-section .routine-toggle-option.is-active{background:#47a9c6;color:#183842}.routines-section .routine-steps.noite .routine-toggle-option{color:#183842}.routines-section .routine-steps.noite .routine-toggle-option:hover{background:#ffffff1f}.routines-section .routine-steps.noite .routine-toggle-option.is-active{background:#47a9c6;color:#183842}.routines-section .routine-steps .routine{opacity:1;transition:opacity .7s ease-in-out}.routines-section .routine-steps.noite .routine-dia,.routines-section .routine-steps.dia .routine-noite{opacity:0;position:absolute;top:-99999px;left:-999999px;visibility:hidden;pointer-events:none}.routines-section .routine-steps ol li:before{background:#e6eff1;color:#183842;border:1.5px solid var(--active-step-bg)}.routines-section .routine-steps ol li.active:before{background:#47a9c6;color:#183842;border:1.5px solid var(--active-step-bg)}.routines-section .routine-steps ol li .desc{display:none;margin-top:4px;font-size:14px;line-height:1.4;color:var(--color-desc)}.routines-section .routine-steps ol li.active .desc{display:block}.routines-section .routine-tutorial{--bg: #47A9C6;--color: #e6eff1ff;--step-bg: #e6eff1ff;--step-text: #47A9C6;--line-color: #e6eff1ff;display:block;margin:0;width:100%;padding:28px;background:var(--bg);border-radius:20px;height:auto}@media(max-width:1200px){.routines-section{padding-top:var(--mg-bottom-mobile);padding-bottom:var(--mg-bottom-mobile)}}@media(max-width:1024px){.routines-section .routines-title{font-size:var(--fs-mobile);margin-bottom:var(--mb-mobile)}}@media(min-width:768px)and (max-width:1199px){.routines-section .routines-content-wrapper{grid-template-columns:repeat(2,1fr);column-gap:18px;row-gap:18px;align-items:start}.routines-section .routine-tutorial{grid-column:1 / span 2}}@media(max-width:767px){.routines-section{padding-top:var(--mg-top-mobile);padding-bottom:var(--mg-bottom-mobile)}.routines-section .routines-content-wrapper{grid-template-columns:1fr;row-gap:18px;align-items:start}.routines-section .routine-steps{min-height:auto;max-height:none}}@media(max-width:551px){.routines-section :is(.routine-steps,.routine-tutorial){padding:24px}.routines-section .routine-steps .routine-title,.routines-section .routine-tutorial .tutorial-title{margin:0 0 24px;font-family:var(--font-family-1);font-size:24px;color:var(--color);transition:color .7s ease-in-out}.routines-section .routine-steps ol li,.routines-section .routine-tutorial .use-steps li{padding-left:48px}.routines-section .routine-steps ol li:before,.routines-section .routine-tutorial .use-steps li:before{width:32px;min-width:32px;height:32px;min-height:32px;line-height:32px}.routines-section .routine-steps ol li .title,.routines-section .routine-tutorial .use-steps li .title{min-height:32px;font-size:16px;line-height:32px}.routines-section .routine-vertical-line{left:19px}.routines-section .routine-toggle{top:20px;right:20px}}@media(min-width:1025px){.routines-section .container-full{padding-left:var(--pd-fw);padding-right:var(--pd-fw)}}@keyframes circle-grow{0%{clip-path:circle(0% at 100% 0%)}to{clip-path:circle(150% at 100% 0%)}}.routines-section .routines-content-wrapper .routines-content-image{position:relative;align-self:stretch;overflow:hidden;height:100%}.routines-section .routines-content-wrapper .routines-content-image picture,.routines-section .routines-content-wrapper .routines-content-image .routine-image,.routines-section .routines-content-wrapper .routines-content-image img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center}
/*# sourceMappingURL=/cdn/shop/t/7/compiled_assets/styles.css.map */