.use-bg{background:var(--cream)}.use-box{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--s-6);align-items:start}.use-box:has(.use-viz-video){grid-template-columns:1.15fr .85fr;grid-template-rows:auto 1fr;align-items:stretch}.use-box:has(.use-viz-video) .use-viz--flat{grid-column:1;grid-row:1}.use-box:has(.use-viz-video) .use-points{grid-column:1;grid-row:2;align-self:start}.use-box:has(.use-viz-video) .use-viz-video{grid-column:2;grid-row:1 / -1;margin:0;height:auto;min-height:0;aspect-ratio:auto;align-self:stretch}.use-ritual-grid{display:grid;grid-template-columns:var(--split-cols);gap:var(--split-gap);align-items:center}.use-ritual-grid__text{min-width:0}.use-ritual-grid__text .section-head{margin-bottom:var(--head-gap)}.use-ritual-grid .use-viz-video{margin:0;aspect-ratio:var(--split-media-ratio);border-radius:var(--r-lg)}.use-ritual{margin:var(--s-3) 0 0;max-width:30em;font-size:var(--fs-body-s);line-height:1.55;color:var(--ink-2)}.use-box{padding:var(--s-6);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}.use-viz{position:relative;display:flex;flex-direction:column;align-items:center;padding:var(--s-4);background:linear-gradient(180deg,var(--blush),var(--cream));border-radius:var(--r-md)}.use-viz-points{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-2) var(--s-3);width:100%;max-width:360px;margin:0;padding:var(--s-2) 0;list-style:none}.use-viz-point{display:flex;align-items:center;gap:14px;min-height:56px;padding:0 var(--s-2);border-radius:var(--r-sm);background:var(--paper);border:1px solid var(--line);font-family:var(--font-display);font-style:normal;font-size:var(--fs-d5);line-height:1.2;color:var(--ink-2)}.use-viz-point-dot{position:relative;flex:none;width:26px;height:26px;display:grid;place-items:center}.use-viz-point-dot .use-pulse-ring,.use-viz-point-dot .use-pulse-dot{position:absolute}@media(max-width:560px){.use-viz-points{grid-template-columns:1fr}}.use-viz-image-wrap{position:relative;width:100%;max-width:280px}.use-viz-image{display:block;width:100%;height:auto;border-radius:var(--r-sm)}.use-pulse{position:absolute;width:44px;height:44px;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;-webkit-tap-highlight-color:transparent}.use-pulse-dot{width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--paper);transition:transform var(--dur) var(--ease-out)}.use-pulse-ring{position:absolute;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--accent);opacity:.35}@media(prefers-reduced-motion:no-preference){.use-pulse-ring{animation:use-pulse-breathe 2.4s ease-in-out infinite}@keyframes use-pulse-breathe{0%,to{transform:scale(.85);opacity:.35}50%{transform:scale(1.15);opacity:.15}}}.use-pulse-tip{position:absolute;bottom:calc(100% - 6px);left:50%;transform:translate(-50%,6px);min-width:150px;max-width:220px;padding:12px 16px;background:var(--brown);color:var(--on-dark);border-radius:var(--r-sm);box-shadow:var(--shadow-md);text-align:center;pointer-events:none;opacity:0;visibility:hidden;z-index:5;transition:opacity var(--dur) var(--ease-out),transform var(--dur) var(--ease-out),visibility 0s linear var(--dur)}.use-pulse-tip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:var(--ink)}.use-pulse--start .use-pulse-tip{left:0;transform:translate(-12px,6px)}.use-pulse--start .use-pulse-tip:after{left:22px}.use-pulse--end .use-pulse-tip{left:auto;right:0;transform:translate(12px,6px)}.use-pulse--end .use-pulse-tip:after{left:auto;right:16px;transform:none}.use-pulse-tip-t{font-family:var(--font-display);font-style:normal;font-weight:400;font-size:var(--fs-small);line-height:1.2;color:var(--on-dark);margin-bottom:4px;font-family:var(--font-text);font-weight:500}.use-pulse-tip-b{font-size:var(--fs-caption);line-height:1.5;color:var(--on-dark-mute)}.use-pulse:hover .use-pulse-dot,.use-pulse:focus-visible .use-pulse-dot,.use-pulse.is-open .use-pulse-dot{transform:scale(1.3)}.use-pulse:hover .use-pulse-tip,.use-pulse:focus-visible .use-pulse-tip,.use-pulse.is-open .use-pulse-tip{opacity:1;visibility:visible;transform:translate(-50%);transition-delay:0s}.use-pulse--start:hover .use-pulse-tip,.use-pulse--start:focus-visible .use-pulse-tip,.use-pulse--start.is-open .use-pulse-tip{transform:translate(-12px)}.use-pulse--end:hover .use-pulse-tip,.use-pulse--end:focus-visible .use-pulse-tip,.use-pulse--end.is-open .use-pulse-tip{transform:translate(12px)}.use-viz-cap{margin-top:var(--s-3);text-align:center}.use-viz-l{margin:0 0 var(--s-1);font-family:var(--font-display);font-style:normal;font-weight:400;font-size:var(--fs-d3);line-height:1.15;letter-spacing:var(--track-display);color:var(--ink-2)}.use-viz-s{margin:0 auto;max-width:24em;font-size:var(--fs-caption);line-height:1.5;color:var(--mute)}.use-viz--flat{align-items:flex-start;padding:0;background:none;border-radius:0}.use-viz--flat .use-viz-cap{margin:0 0 var(--s-3);text-align:left}.use-viz--flat .use-viz-s{margin:0}.use-viz-pills{display:flex;flex-wrap:wrap;gap:var(--s-1);width:100%;margin:0;padding:0;list-style:none}.use-viz-video{position:relative;width:100%;margin-top:var(--s-3);aspect-ratio:var(--viz-video-ratio, 4 / 5);border-radius:var(--r-md);overflow:hidden;background:var(--ink)}.use-viz-video .use-viz-video__media,.use-viz-video video,.use-viz-video iframe{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%;object-fit:cover;border:0}.use-viz-pills .pill{font-family:var(--font-text);white-space:nowrap}@media(max-width:700px){.use-viz--flat{padding:0}}.use-points{list-style:none;margin:0;padding:0;display:grid;grid-auto-rows:1fr}.use-pt{display:flex;gap:var(--s-3);align-items:flex-start;padding:var(--s-2) 0;border-top:1px solid var(--line)}.use-pt:first-child{border-top:none}.use-pt:last-child{padding-bottom:0}.use-pt-n{flex:0 0 40px;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:var(--blush);color:var(--ink-3);font-family:var(--font-display);font-style:normal;font-weight:400;font-size:var(--fs-small);line-height:1;font-family:var(--font-text);font-weight:500}.use-pt-body{min-width:0}.use-pt-t{margin:0 0 var(--s-1);font-family:var(--font-display);font-style:normal;font-weight:400;font-size:var(--fs-d5);line-height:1.25;letter-spacing:var(--track-display);color:var(--ink-2)}.use-pt-b{margin:0;font-size:var(--fs-body-s);line-height:var(--lh-text);color:var(--mute)}.use-duration{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-5);margin:var(--s-4) 0 0;padding:var(--s-4) var(--s-6);background:var(--brown);color:var(--on-dark);border-radius:var(--r-md)}.ud-item{display:flex;flex-direction:column;justify-content:center;margin:0}.ud-item+.ud-item{padding-left:var(--s-5);border-left:1px solid var(--line-dark-strong)}.ud-l{margin:0 0 var(--s-1);font-family:var(--font-text);font-size:var(--fs-label);font-weight:500;line-height:1.3;letter-spacing:.12em;text-transform:uppercase;color:var(--on-dark-mute)}.ud-v{margin:0;font-family:var(--font-display);font-weight:400;font-size:var(--fs-d3);line-height:1.1;letter-spacing:var(--track-display);color:var(--on-dark)}.ud-v em{font-style:italic;font-weight:400;color:var(--accent-soft)}@media(max-width:900px){.use-box:has(.use-viz-video){grid-template-columns:1fr;grid-template-rows:auto}.use-box:has(.use-viz-video) .use-viz--flat,.use-box:has(.use-viz-video) .use-points,.use-box:has(.use-viz-video) .use-viz-video{grid-column:1;grid-row:auto}.use-box:has(.use-viz-video) .use-viz-video{order:2;height:auto;min-height:0;aspect-ratio:4 / 5}.use-box:has(.use-viz-video) .use-points{order:3}.use-ritual-grid{grid-template-columns:1fr}.use-ritual-grid .use-viz-video{max-width:var(--split-media-max)}.use-box{grid-template-columns:1fr;gap:var(--s-4);padding:var(--s-4)}}@media(max-width:700px){.use-box{padding:var(--s-3)}.use-viz:not(.use-viz--flat){padding:var(--s-3)}.use-duration{grid-template-columns:1fr;gap:0;padding:var(--s-1) var(--s-3)}.ud-item{padding:var(--s-2) 0}.ud-item+.ud-item{padding-left:0;border-left:none;border-top:1px solid var(--line-dark-strong)}.ud-v{font-size:var(--fs-d3)}}
/*# sourceMappingURL=/cdn/shop/t/21/assets/section-sirense-how-to-use.css.map */