.smocket-demo{grid-template-columns:.8fr 1.2fr;align-items:center;gap:65px;padding:20px 0 95px;display:grid}.demo-intro>p:not(.eyebrow):not(.demo-note){max-width:345px;font-size:16px;line-height:1.7}.demo-intro h2{margin-top:17px}.scent-picker{margin-top:28px}.demo-intro .choices label{padding:11px 13px;font-size:11px}.demo-intro .pill{margin:0 13px 0 0}.demo-reset{color:var(--green);cursor:pointer;background:0 0;border:0;padding:15px 0;font-size:11px;text-decoration:underline}.demo-reset:disabled{opacity:.45;cursor:default}.demo-note{color:#4c6254;max-width:335px;font-size:10px;line-height:1.7}.demo-player{--bloom:#d16b83;background:#f5e7cd;border:1px solid #1c40312d;border-radius:22px;overflow:hidden}.demo-player[data-scent=lavender]{--bloom:#8972a5}.demo-topline{letter-spacing:.7px;background:#eadbc0;justify-content:space-between;gap:10px;padding:18px 20px;font-size:8px;font-weight:800;display:flex}.demo-topline span:last-child{opacity:.75}.demo-scene{padding-top:94px;position:relative;overflow:hidden}.demo-scene .sofa-scene{width:100%;height:auto;display:block;position:relative;bottom:auto;left:auto}.demo-bubble{border:1px solid var(--green);z-index:3;text-align:center;overflow-wrap:break-word;background:#fffaf0;border-radius:18px;width:43%;padding:13px 15px;font-size:13px;line-height:1.45;position:absolute;top:18px;box-shadow:2px 3px #1c403110}.demo-bubble:after{content:"";border-right:1px solid var(--green);border-bottom:1px solid var(--green);background:#fffaf0;width:10px;height:10px;position:absolute;bottom:-6px;left:50%;transform:rotate(45deg)}.bubble-first{left:5%}.bubble-second{right:4%}.demo-bubble{min-height:84px}.bubble-label{letter-spacing:.7px;color:#657064;margin-bottom:7px;font-size:8px;font-weight:700;line-height:1.3;display:block}.rear-effects{opacity:0;pointer-events:none}.demo-player[data-performer=man] .effects-man,.demo-player[data-performer=woman] .effects-woman{opacity:1}.pocket-caption{letter-spacing:.6px;fill:#704d3b;font:700 8px Arial,sans-serif}.rear-air,.scent-stream,.rear-flower{opacity:0}.demo-player[data-phase=breeze] .rear-air{stroke-dasharray:45;animation:1.4s ease-in-out both rear-breeze}.demo-player:is([data-phase=bloom],[data-phase=reaction]) .scent-stream{opacity:.65;stroke-dasharray:200;animation:1s ease-out both rear-scent}.demo-player:is([data-phase=bloom],[data-phase=reaction]) .rear-flower{opacity:1}.demo-player:is([data-phase=bloom],[data-phase=reaction]) .rear-flower text{transform-box:fill-box;transform-origin:50%;animation:.65s ease-out both rear-bloom}.rear-flower.flower-1 text{animation-delay:.12s!important}.rear-flower.flower-2 text{animation-delay:.24s!important}.rear-flower.flower-3 text{animation-delay:.36s!important}.rear-flower.flower-4 text{animation-delay:.48s!important}.demo-steps{border-top:1px solid #1c40312b;grid-template-columns:repeat(3,1fr);gap:12px;margin:0;padding:20px 15px 16px;list-style:none;display:grid}.demo-steps li{opacity:.45;font-size:10px;line-height:1.6}.demo-steps li>span{letter-spacing:1px;margin-bottom:4px;font-size:9px;font-weight:800;display:block}.demo-player[data-phase=breeze] [data-step=breeze],.demo-player[data-phase=bloom] [data-step=bloom],.demo-player[data-phase=reaction] .demo-steps li{opacity:1}.demo-status{background:#fff4df;min-height:88px;margin:0;padding:16px 20px;font-size:11px;line-height:1.6}@keyframes rear-breeze{0%{stroke-dashoffset:45px;opacity:0}25%{opacity:1}80%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-45px;opacity:0}}@keyframes rear-scent{0%{stroke-dashoffset:200px}to{stroke-dashoffset:0}}@keyframes rear-bloom{0%{opacity:0;transform:scale(.2)}to{opacity:1;transform:scale(1)}}.smocket-comics{padding:85px 0 30px}.comics-heading{justify-content:space-between;align-items:end;gap:30px;margin-bottom:28px;display:flex}.comics-heading h2{margin-bottom:0}.comics-heading>p{font-family:Georgia,serif;font-size:19px;font-style:italic;line-height:1.6}.comic-grid{grid-template-columns:1fr 1fr;gap:25px;display:grid}.comic-grid figure{background:#ffeddd;border:1px solid #1c403140;border-radius:18px;margin:0;overflow:hidden}.comic-grid figure:nth-child(2){background:#e2e7d3}.comic-grid img{aspect-ratio:1;object-fit:contain;background:#fff9ef;width:100%;height:auto;display:block}.comic-grid figcaption{padding:24px 25px 27px}.comic-grid figcaption span{letter-spacing:1.1px;margin-bottom:11px;font-size:9px;font-weight:700;display:block}.comic-grid figcaption strong{letter-spacing:-1px;font-size:25px}.smocket-comics .section-note{line-height:1.6}.comic-grid a:focus-visible{outline-offset:-5px}@media (width<=950px){.smocket-demo{grid-template-columns:1fr 1.1fr;gap:35px}.demo-bubble{padding:10px;font-size:11px}.demo-steps{gap:8px;padding-inline:12px}.demo-steps li{font-size:9px}.demo-topline{letter-spacing:.4px;padding-inline:15px;font-size:7px}.demo-status{padding-inline:15px}.demo-intro .choices{gap:8px}.demo-intro .choices label{font-size:10px}.demo-intro h2{font-size:45px}.comic-grid figcaption strong{font-size:21px}}@media (width<=700px){.smocket-demo{grid-template-columns:1fr;gap:25px;padding-bottom:65px}.demo-intro h2{font-size:47px}.demo-intro>p:not(.eyebrow):not(.demo-note){max-width:none;font-size:15px}.demo-note{max-width:none}.demo-scene{padding-top:106px}.demo-bubble{padding:11px 9px;font-size:11px;top:16px}.demo-topline{padding:15px 12px;font-size:7px}.demo-status{min-height:104px}.demo-steps{padding:17px 13px}.demo-steps li{font-size:9px}.smocket-comics{padding-top:60px}.comics-heading{margin-bottom:25px;display:block}.comics-heading h2{font-size:42px}.comics-heading>p{margin-top:22px;font-size:16px}.comic-grid{grid-template-columns:1fr;gap:22px}.comic-grid figcaption{padding:22px}.comic-grid figcaption strong{font-size:25px}}@media (prefers-reduced-motion:reduce){.demo-player *{transition:none!important;animation:none!important}.demo-player[data-phase=breeze] .rear-air{opacity:1;stroke-dasharray:none}.demo-player:is([data-phase=bloom],[data-phase=reaction]) .rear-flower text{opacity:1;transform:none}}
