.formula-matrix{display:block;padding-top:var(--fm-pt-mobile, 64px);padding-bottom:var(--fm-pb-mobile, 0);color:var(--neutral-1000);--formula-matrix-card-transition-duration: .3s;--formula-matrix-card-transition-easing: ease-in-out}.formula-matrix__inner{display:flex;flex-direction:column;align-items:center;gap:15px}.formula-matrix__header{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;max-width:660px;text-align:center}.formula-matrix__header .section-header{width:100%}.formula-matrix__header .section-header .text-block{display:none}.formula-matrix__mobile-description{margin:0;width:100%;color:var(--neutral-800);text-align:center}.formula-matrix__body{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%}.formula-matrix__visual{position:relative;width:100%;aspect-ratio:1;overflow:visible}.formula-matrix__visual-bg,.formula-matrix__visual-glow,.formula-matrix__visual-product{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.formula-matrix__visual-bg-image{width:100%;height:100%;object-fit:contain}.formula-matrix__visual-glow{top:18%;left:50%;width:58%;height:64%;border-radius:131px;background:var(--blue-600);opacity:.3;filter:blur(79px);transform:translate(-50%)}.formula-matrix__visual-product{display:flex;align-items:center;justify-content:center}.formula-matrix__product-image{width:102%;height:102%;object-fit:contain}.formula-matrix__connector{display:none}.formula-matrix__cards{display:flex;flex-direction:column;gap:12px;width:100%}.formula-matrix-card{border:1px solid var(--neutral-200);border-radius:20px;background:var(--neutral-0);overflow:hidden;transition:background-color var(--formula-matrix-card-transition-duration) var(--formula-matrix-card-transition-easing),border-color var(--formula-matrix-card-transition-duration) var(--formula-matrix-card-transition-easing),color var(--formula-matrix-card-transition-duration) var(--formula-matrix-card-transition-easing)}.formula-matrix-card__summary{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px;padding-block-end:12px;list-style:none;cursor:pointer}.formula-matrix-card__summary::-webkit-details-marker{display:none}.formula-matrix-card__header{display:flex;flex:1;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}.formula-matrix-card__badge{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:6px 12px;border-radius:30px;background:var(--blue-1000);color:var(--neutral-0);transition:background-color var(--formula-matrix-card-transition-duration) var(--formula-matrix-card-transition-easing),color var(--formula-matrix-card-transition-duration) var(--formula-matrix-card-transition-easing)}@media screen and (max-width:749px){.formula-matrix-card__badge-label{font-size:14px;line-height:1.43}}.formula-matrix-card__badge-icon{display:inline-flex;width:20px;height:20px;flex-shrink:0}.formula-matrix-card__badge-icon svg{display:block;width:100%;height:100%}.formula-matrix-card__title{margin:0;color:var(--neutral-1000);transition:color var(--formula-matrix-card-transition-duration) var(--formula-matrix-card-transition-easing)}.formula-matrix-card__toggle{display:inline-flex;width:24px;height:32px;align-items:center;justify-content:center;flex-shrink:0;color:var(--neutral-1000)}.formula-matrix-card__toggle-icon{display:none;width:24px;height:24px}.formula-matrix-card__toggle-icon svg{display:block;width:100%;height:100%}.formula-matrix-card:not([open]) .formula-matrix-card__toggle-icon--plus{display:block}.formula-matrix-card[open] .formula-matrix-card__toggle-icon--minus{display:block}.formula-matrix-card__body{padding:0 16px 16px}.formula-matrix-card__description{margin:0;color:var(--neutral-800);transition:color var(--formula-matrix-card-transition-duration) var(--formula-matrix-card-transition-easing)}.formula-matrix-card__description p{margin:0}@media screen and (max-width:949px){.formula-matrix__visual{width:100%;max-width:500px;margin-inline:auto}.formula-matrix-card__title{font-size:18px;font-weight:var(--font-weight-semibold)}.formula-matrix-card__description{font-size:16px}.formula-matrix-card[open]{border-color:var(--neutral-200);background:var(--blue-1000);color:var(--neutral-0)}.formula-matrix-card[open] .formula-matrix-card__title,.formula-matrix-card[open] .formula-matrix-card__toggle{color:var(--neutral-0)}.formula-matrix-card[open] .formula-matrix-card__badge{background:var(--yellow-900);color:var(--blue-1000)}.formula-matrix-card[open] .formula-matrix-card__description{color:var(--neutral-0-80)}}.formula-matrix__cta{display:flex;width:100%;justify-content:center}.formula-matrix__cta .group--vertical{align-items:center;width:100%}@media screen and (max-width:467px){.formula-matrix__cta .button-block{width:100%}}.formula-matrix__cta .text-block{color:var(--neutral-800);text-align:center}@media screen and (min-width:750px){.formula-matrix{padding-top:var(--fm-pt-desktop, 64px);padding-bottom:var(--fm-pb-desktop, 64px)}.formula-matrix__inner{gap:40px}.formula-matrix__header{gap:16px;max-width:100%;padding-inline:40px}.formula-matrix__header .section-header .text-block{display:block;max-width:660px}.formula-matrix__mobile-description{display:none}}@media screen and (min-width:950px){.formula-matrix__body{position:relative;display:grid;grid-template-columns:minmax(280px,600px) 40px minmax(320px,670px);align-items:stretch;gap:0 30px;max-width:100%;width:100%}.formula-matrix__visual{position:relative;z-index:1;grid-column:1;grid-row:1;max-width:600px;width:100%;justify-self:start}.formula-matrix__visual-glow{top:18%;width:63%;height:64%;filter:blur(132px)}.formula-matrix__connector{display:block;position:relative;z-index:1;grid-column:1 / 3;grid-row:1;align-self:stretch;min-height:360px;pointer-events:none}.formula-matrix__connector-trunk{position:absolute;top:32px;bottom:32px;right:0;width:1px;border-left:1px dashed var(--neutral-200);border-radius:1px}.formula-matrix__connector-track{position:absolute;top:0;right:0;bottom:0;left:0}.formula-matrix__connector-trunk-segment{position:absolute;top:var(--fm-trunk-top, 0px);right:0;width:1px;height:var(--fm-trunk-height, 0px);background:var(--yellow-1000);opacity:0;transform:scaleY(var(--fm-trunk-scale, 0));transform-origin:var(--fm-trunk-origin, top) center;will-change:transform,opacity;transition:transform var(--formula-matrix-card-transition-duration) var(--formula-matrix-card-transition-easing),opacity var(--formula-matrix-card-transition-duration) var(--formula-matrix-card-transition-easing)}.formula-matrix__connector-trunk-segment--live{opacity:1;background:linear-gradient(180deg,color-mix(in srgb,var(--yellow-1000) 20%,var(--neutral-200)) 0%,var(--yellow-900) 35%,var(--yellow-1000) 50%,var(--yellow-900) 65%,color-mix(in srgb,var(--yellow-1000) 20%,var(--neutral-200)) 100%);background-size:100% 300%;animation:formula-matrix-connector-trunk-flow 2.2s ease-in-out infinite}.formula-matrix__connector-branch{position:absolute;right:-35px;display:flex;flex-direction:row;align-items:center;transform:translateY(-50%)}.formula-matrix__connector-line{position:relative;display:block;height:1px;background:var(--neutral-200);flex-shrink:0;overflow:hidden}.formula-matrix__connector-line:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .3s ease-in-out;pointer-events:none}.formula-matrix__connector-line--to-image{width:50px}.formula-matrix__connector-line--right{width:30px}.formula-matrix__connector-dot{position:relative;z-index:1;width:10px;height:10px;border:1.5px solid var(--neutral-0);border-radius:12px;background:var(--blue-1000);box-shadow:0 0 0 1px var(--neutral-0);flex-shrink:0;transition:background-color .3s ease-in-out}.formula-matrix__connector-branch--live .formula-matrix__connector-line--right:after{opacity:1;background:linear-gradient(90deg,color-mix(in srgb,var(--yellow-1000) 25%,var(--neutral-200)) 0%,var(--yellow-900) 30%,var(--yellow-1000) 50%,var(--yellow-900) 70%,color-mix(in srgb,var(--yellow-1000) 25%,var(--neutral-200)) 100%);background-size:280% 100%;animation:formula-matrix-connector-line-flow-to-card 2s ease-in-out infinite}.formula-matrix__connector-branch--live .formula-matrix__connector-dot,.formula-matrix__connector-branch--live-junction .formula-matrix__connector-dot{background:var(--yellow-1000);animation:formula-matrix-connector-dot-pulse 2s ease-in-out infinite}.formula-matrix__connector-branch--live-image .formula-matrix__connector-line--to-image:after{opacity:1;background:linear-gradient(90deg,color-mix(in srgb,var(--yellow-1000) 25%,var(--neutral-200)) 0%,var(--yellow-900) 30%,var(--yellow-1000) 50%,var(--yellow-900) 70%,color-mix(in srgb,var(--yellow-1000) 25%,var(--neutral-200)) 100%);background-size:280% 100%;animation:formula-matrix-connector-line-flow-to-image 2s ease-in-out infinite}.formula-matrix__cards{position:relative;z-index:1;grid-column:3;grid-row:1;gap:20px;max-width:670px}.formula-matrix-card{border-radius:24px}.formula-matrix-card__summary{padding:32px;padding-block-end:12px;cursor:default}.formula-matrix-card__header{flex-direction:row;align-items:flex-start;gap:12px}.formula-matrix-card__badge{order:2;margin-left:auto;min-height:36px;flex-shrink:0;background:var(--blue-1000);color:var(--neutral-0)}.formula-matrix-card[open] .formula-matrix-card__badge{background:var(--blue-1000);color:var(--neutral-0)}.formula-matrix-card[open]:hover .formula-matrix-card__badge,.formula-matrix-card--active .formula-matrix-card__badge,.formula-matrix-card:focus-within .formula-matrix-card__badge{background:var(--yellow-900);color:var(--blue-1000)}.formula-matrix-card__title{order:1;flex:1;font-size:var(--font-headline-h4);font-weight:var(--font-weight-medium);line-height:var(--line-height-headline-h4)}.formula-matrix-card__toggle{display:none}.formula-matrix-card__body{padding:0 32px 32px}.formula-matrix-card__description{font-size:var(--font-body-l);line-height:var(--line-height-body-l)}.formula-matrix-card[open] .formula-matrix-card__body{display:block}.formula-matrix-card[open]:hover,.formula-matrix-card--active{border-color:var(--neutral-200);background:var(--blue-1000);color:var(--neutral-0)}.formula-matrix-card[open]:hover .formula-matrix-card__title,.formula-matrix-card--active .formula-matrix-card__title{color:var(--neutral-0)}.formula-matrix-card[open]:hover .formula-matrix-card__description,.formula-matrix-card--active .formula-matrix-card__description{color:var(--neutral-0-80)}}.formula-matrix-card:focus-visible,.formula-matrix-card__summary:focus-visible,.formula-matrix__connector-dot:focus-visible{outline:2px solid var(--blue-800);outline-offset:2px}.formula-matrix-card__summary:focus:not(:focus-visible){outline:none}@media(forced-colors:active){.formula-matrix-card:focus-visible,.formula-matrix-card__summary:focus-visible{outline:2px solid transparent}}@keyframes formula-matrix-connector-line-flow-to-card{0%{background-position:100% 0}to{background-position:0% 0}}@keyframes formula-matrix-connector-line-flow-to-image{0%{background-position:0% 0}to{background-position:100% 0}}@keyframes formula-matrix-connector-trunk-flow{0%{background-position:0 100%}to{background-position:0 0%}}@keyframes formula-matrix-connector-dot-pulse{0%,to{box-shadow:0 0 0 1px var(--neutral-0),0 0 color-mix(in srgb,var(--yellow-1000) 0%,transparent)}50%{box-shadow:0 0 0 1px var(--neutral-0),0 0 10px 3px color-mix(in srgb,var(--yellow-1000) 55%,transparent)}}@media(prefers-reduced-motion:reduce){.formula-matrix-card,.formula-matrix-card__badge,.formula-matrix-card__title,.formula-matrix-card__description,.formula-matrix__connector-trunk-segment,.formula-matrix__connector-line,.formula-matrix__connector-line:after,.formula-matrix__connector-dot{transition:none}.formula-matrix__connector-trunk-segment--live,.formula-matrix__connector-branch--live .formula-matrix__connector-line--right:after,.formula-matrix__connector-branch--live-image .formula-matrix__connector-line--to-image:after,.formula-matrix__connector-branch--live .formula-matrix__connector-dot,.formula-matrix__connector-branch--live-junction .formula-matrix__connector-dot{animation:none;background:var(--yellow-1000);opacity:1}.formula-matrix__connector-branch--live .formula-matrix__connector-dot,.formula-matrix__connector-branch--live-junction .formula-matrix__connector-dot{box-shadow:0 0 0 1px var(--neutral-0)}}
/*# sourceMappingURL=/cdn/shop/t/27/assets/section-formula-matrix.css.map */