.aoctant-how{--aoctant-how-fg: var(--color-foreground, #262323);--aoctant-how-muted: rgba(38, 35, 35, .62);--aoctant-how-gutter: 20px;--aoctant-how-gap: 12px;color:var(--aoctant-how-fg)}.aoctant-how *,.aoctant-how *:before,.aoctant-how *:after{box-sizing:border-box}@media screen and (min-width:1024px){.aoctant-how{--aoctant-how-gutter: 36px;--aoctant-how-gap: 16px}}.aoctant-how__container{width:100%;max-width:calc(80rem + (var(--aoctant-how-gutter) * 2));margin-inline:auto;padding-inline:var(--aoctant-how-gutter);padding-block:var(--aoctant-how-padding-top, 96px) var(--aoctant-how-padding-bottom, 96px)}.aoctant-how__top{display:flex;flex-direction:column;gap:24px;margin-top:clamp(24px,3vw,40px)}@media screen and (min-width:990px){.aoctant-how__top{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:48px}}.aoctant-how__heading{margin:0 0 .3em;font-family:var(--font-heading--family);font-size:clamp(32px,3.368vw,64px);font-weight:var(--font-heading--weight, 500);line-height:var(--line-height--heading-tight, 1.15);letter-spacing:var(--letter-spacing--heading-tight, -.03em);text-wrap:balance}.aoctant-how__text{max-width:34rem;margin:0;font-size:var(--font-size--paragraph, 1rem);line-height:1.5}.aoctant-how__strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--aoctant-how-gap);margin:0;padding:0;list-style:none}.aoctant-how__frame--3{grid-column:1 / -1}@media screen and (min-width:750px){.aoctant-how__strip{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.778fr)}.aoctant-how__frame--3{grid-column:auto}}.aoctant-how__figure{display:flex;flex-direction:column;gap:10px;margin:0}.aoctant-how__media{position:relative;overflow:hidden;aspect-ratio:1 / 1}.aoctant-how__media:not(.aoctant-mat__surface){border-radius:var(--aoctant-radius-card, 12px);background-color:#2623230a}.aoctant-how__frame--3 .aoctant-how__media{aspect-ratio:16 / 9}.aoctant-how .aoctant-how__media img{display:block;width:100%;height:100%;object-fit:cover}.aoctant-how__focus{position:absolute;left:var(--aoctant-how-focus-x, 52%);top:var(--aoctant-how-focus-y, 40%);width:var(--aoctant-how-focus-size, 18%);height:var(--aoctant-how-focus-height, var(--aoctant-how-focus-size, 18%));border:2px solid rgba(255,255,255,.92);border-radius:3px;pointer-events:none}.aoctant-how__caption{font-size:var(--font-size--sm, .9375rem);font-weight:500;line-height:1.35}.aoctant-how__form{display:flex;flex-direction:column;gap:10px;width:100%}@media screen and (min-width:750px){.aoctant-how__form{flex-direction:row;align-items:stretch}}@media screen and (min-width:990px){.aoctant-how__form{flex:0 1 40rem}}.aoctant-how__field{position:relative;flex:1;min-width:0}.aoctant-how .aoctant-how__input{width:100%;height:58px;padding:22px 16px 8px;font-family:var(--font-body--family);font-size:max(16px,var(--font-size--paragraph, 1rem));color:var(--aoctant-how-fg);background-color:#2623230a;border:0;border-radius:var(--aoctant-radius-control, 6px);box-shadow:none;outline:none;-webkit-appearance:none;appearance:none;transition:background-color .5s cubic-bezier(.3,1,.3,1)}.aoctant-how .aoctant-how__input::placeholder{color:transparent}.aoctant-how .aoctant-how__input:hover,.aoctant-how .aoctant-how__input:focus{background-color:#26232312}.aoctant-how .aoctant-how__input:focus-visible{outline:1px solid rgba(38,35,35,.3);outline-offset:1px}.aoctant-how .aoctant-how__label{position:absolute;top:50%;left:16px;max-width:calc(100% - 32px);overflow:hidden;font-size:var(--font-size--paragraph, 1rem);color:var(--aoctant-how-muted);white-space:nowrap;text-overflow:ellipsis;pointer-events:none;transform:translateY(-50%);transform-origin:left top;transition:top .5s cubic-bezier(.3,1,.3,1),transform .5s cubic-bezier(.3,1,.3,1)}.aoctant-how .aoctant-how__input:focus~.aoctant-how__label,.aoctant-how .aoctant-how__input:not(:placeholder-shown)~.aoctant-how__label{top:7px;transform:translateY(0) scale(.72)}.aoctant-how .aoctant-how__button{min-height:58px;padding-inline:28px;white-space:nowrap}@media(prefers-reduced-motion:reduce){.aoctant-how .aoctant-how__input,.aoctant-how .aoctant-how__label{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/10/assets/aoctant-how-it-works.css.map */
