.demo-page{--demo-paper:var(--card);--demo-tail:#979994;padding:clamp(28px,3.6vw,52px) 0 0}[data-theme=dark] .demo-page{--demo-paper:var(--card);--demo-tail:#969994}.demo-frame{max-width:1280px;margin-inline:auto;padding-inline:32px}.demo-heading{margin-bottom:clamp(30px,3.6vw,48px)}.demo-heading h1{letter-spacing:-.055em;text-wrap:initial;font-size:clamp(40px,5.2vw,74px);font-weight:500;line-height:1.03}.demo-heading h1 span{color:var(--demo-tail)}.demo-heading p{color:var(--ink2);margin-top:20px;font-size:clamp(17px,1.4vw,20px);line-height:1.5}.demo-inline-link{color:var(--ink);text-underline-offset:4px;text-decoration:underline}.demo-guided{background:var(--demo-paper);border-radius:24px;grid-template-columns:.84fr 1.16fr;min-height:460px;display:grid;position:relative;overflow:hidden}.demo-guided-copy{z-index:1;align-self:center;padding:44px 48px;position:relative}.demo-guided h2{letter-spacing:-.04em;text-wrap:initial;font-size:clamp(26px,2.6vw,34px);font-weight:500;line-height:1.12}.demo-description{max-width:33ch;color:var(--ink2);margin-top:16px;font-size:16px;line-height:1.55}.demo-guided .customer-form{background:0 0;border-radius:0;margin-top:28px;padding:0}.demo-guided .customer-form-grid{grid-template-columns:1fr;gap:10px;display:grid}.demo-field-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.demo-guided .customer-field{border:1px solid color-mix(in srgb,var(--ink) 12%,transparent);background:color-mix(in srgb,var(--card) 65%,transparent);color:var(--ink);border-radius:999px;min-height:48px;margin:0;padding:13px 20px;line-height:1.4}.demo-guided .customer-form>.mt-6{margin-top:10px}.demo-guided .customer-submit{justify-content:center;width:100%;min-height:48px;font-size:15px;font-weight:500}.demo-guided .customer-submit:hover:not(:disabled){background:color-mix(in srgb,var(--ink) 85%,var(--ground))}.demo-guided .customer-submit:disabled{cursor:wait}.demo-guided .customer-confirmation{background:0 0;margin-top:26px;padding:0}.demo-guided .customer-confirmation h2{font-size:27px}.demo-guided .customer-confirmation p{font-size:15px}.demo-form-note{color:var(--ink3);margin-top:14px;font-size:11px;line-height:1.6}.demo-form-note a{text-underline-offset:2px;margin-left:4px;text-decoration:underline}.demo-preview{min-width:0;color:var(--ink2);isolation:isolate;background:#e6e6e3;align-items:center;display:flex;position:relative}.demo-preview:before{content:"";z-index:-1;background-image:linear-gradient(#1614100b 1px,#0000 1px),linear-gradient(90deg,#1614100b 1px,#0000 1px);background-size:48px 48px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(135deg,#000,#0000 70%);mask-image:linear-gradient(135deg,#000,#0000 70%)}.demo-preview-label{z-index:1;letter-spacing:-.015em;font-size:13px;position:absolute;top:24px;left:32px}.demo-preview-frame{pointer-events:none;border:0;width:100%;height:100%;display:block;position:absolute;inset:0}[data-theme=dark] .demo-preview{color:var(--ink2);background:#1b1e1b}[data-theme=dark] .demo-preview:before{background-image:linear-gradient(#ffffff0b 1px,#0000 1px),linear-gradient(90deg,#ffffff0b 1px,#0000 1px)}.demo-options{grid-template-columns:1fr 1fr;gap:32px;margin-top:36px;display:grid}.demo-option{min-width:0;color:var(--ink);text-align:left;cursor:pointer;background:0 0;border:0;padding:0;display:block}.demo-option-visual{aspect-ratio:1.75;isolation:isolate;border-radius:20px;width:100%;display:block;position:relative;overflow:hidden}.demo-visual-eyebrow{z-index:2;letter-spacing:-.015em;font-size:13px;position:absolute;top:24px;left:26px}.demo-tour-visual{color:#f1f1ef;background:#161410}.demo-tour-statement{letter-spacing:-.045em;font-size:clamp(25px,2.65vw,36px);font-weight:500;line-height:1.06;position:absolute;top:27px;left:30px}.demo-tour-crop{aspect-ratio:1.6;width:92%;transition:transform .4s var(--ease-content);background:#eceee9;border:1px solid #ffffff29;border-radius:10px;position:absolute;top:39%;left:8%;overflow:hidden;box-shadow:0 12px 30px #0003}.demo-tour-preview{pointer-events:none;border:0;width:100%;height:100%;display:block}.demo-option:hover .demo-tour-crop{transform:translateY(-4px)}.demo-play{color:#161410;width:50px;height:50px;transition:background .2s,scale .3s var(--ease-content);background:#f1f1ef;border-radius:50%;place-items:center;display:grid;position:absolute;top:30px;right:30px;box-shadow:0 3px 12px #0001}.demo-play svg{width:18px;height:18px;margin-left:3px}.demo-option:hover .demo-play{background:#fff;scale:1.06}.demo-feature-visual{color:var(--ink);background:#dce8df}.demo-feature-mark{width:64%;height:110%;stroke:var(--ink);stroke-width:1px;opacity:.14;position:absolute;bottom:-27%;right:-12%;transform:rotate(-14deg)}.demo-feature-statement{letter-spacing:-.055em;font-size:clamp(34px,4.4vw,58px);font-weight:500;line-height:1.04;position:absolute;top:29%;left:30px}.demo-feature-statement>span{color:var(--ink2)}.demo-feature-index{border-top:1px solid color-mix(in srgb,var(--ink) 15%,transparent);padding-top:13px;font-size:12px;display:block;position:absolute;bottom:24px;left:30px;right:30px}[data-theme=dark] .demo-feature-visual{color:var(--ink);background:#24362b}[data-theme=dark] .demo-feature-statement>span{color:var(--ink2)}[data-theme=dark] .demo-feature-index{border-color:#c1d2c329}.demo-option-heading{justify-content:space-between;align-items:center;gap:16px;padding-top:20px;display:flex}.demo-option-heading h2,.demo-option-title{letter-spacing:-.035em;font-size:clamp(22px,2.1vw,27px);font-weight:500;line-height:1.2}.demo-option-heading svg,.demo-start svg{flex:none;width:20px;height:20px}.demo-option>p,.demo-option-description{color:var(--ink2);margin-top:8px;font-size:15px;line-height:1.5;display:block}.demo-option:hover .demo-option-heading h2,.demo-option:hover .demo-option-title{text-underline-offset:5px;text-decoration:underline;text-decoration-thickness:1px}.demo-start{flex-wrap:wrap;justify-content:center;gap:10px 18px;padding:58px 0 32px;font-size:14px;display:flex}.demo-start p{color:var(--ink3)}.demo-start a{align-items:center;gap:8px;font-weight:500;display:inline-flex}.demo-start a:hover{text-underline-offset:4px;text-decoration:underline}.demo-player{border:1px solid var(--hair2);background:var(--ground);width:min(1100px,100% - 40px,160dvh - 390.4px);max-height:calc(100dvh - 24px);color:var(--ink);border-radius:18px;margin:auto;padding:0;position:fixed;inset:0;overflow:auto;box-shadow:0 24px 100px #0006}.demo-player::backdrop{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#161410b8}html:has(.demo-player[open]){overflow:hidden}.demo-player-top{justify-content:space-between;align-items:center;gap:20px;padding:12px 18px 12px 24px;display:flex}.demo-player-top h2{letter-spacing:-.025em;font-size:16px;font-weight:500}.demo-player-close{background:color-mix(in srgb,var(--ink) 7%,transparent);cursor:pointer;border-radius:50%;place-items:center;width:36px;height:36px;display:grid}.demo-player-close svg{width:18px;height:18px}.demo-player-screen{aspect-ratio:1.6;border:1px solid var(--hair2);background:var(--ground);border-radius:8px;margin-inline:12px;position:relative;overflow:hidden}.demo-tour-frame{pointer-events:none;border:0;width:100%;height:100%;display:block}.demo-player-controls{padding:16px 24px 20px}.demo-player-transport{align-items:center;gap:14px;display:flex}.demo-player-transport button{background:var(--ink);width:30px;height:30px;color:var(--ground);cursor:pointer;border-radius:50%;flex:none;place-items:center;display:grid}.demo-player-transport svg{width:16px;height:16px}.demo-player-transport input{min-width:0;height:20px;accent-color:var(--ink);cursor:pointer;flex:1}.demo-player-transport button:disabled,.demo-player-transport input:disabled{opacity:.4;cursor:wait}.demo-player-time{color:var(--ink3);font-variant-numeric:tabular-nums;flex:none;font-size:11px}.demo-chapters{gap:8px;margin-top:14px;display:flex}.demo-chapters button{border:1px solid var(--hair2);color:var(--ink2);cursor:pointer;border-radius:99px;justify-content:center;align-items:center;gap:8px;padding:8px 14px;font-size:12px;display:inline-flex}.demo-chapters button span{opacity:.65;font-size:10px}.demo-chapters button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--ground)}.demo-player-caption a{text-underline-offset:3px;text-decoration:underline}.demo-player-caption{color:var(--ink3);margin-top:12px;font-size:12px;line-height:1.5}@media (max-width:1100px){.demo-guided{grid-template-columns:.9fr 1.1fr;min-height:430px}.demo-guided-copy{padding:36px}.demo-guided h2{font-size:29px}.demo-preview-label{left:24px}.demo-options{gap:24px}}@media (max-width:860px){.demo-guided{grid-template-columns:1fr}.demo-guided-copy{padding:36px 40px}.demo-description{max-width:38ch}.demo-guided .customer-form{max-width:360px}.demo-preview{aspect-ratio:1.5;min-height:350px}.demo-preview-label{top:24px;left:32px}.demo-visual-eyebrow{font-size:11px;top:18px;left:20px}.demo-tour-statement{font-size:23px;top:20px;left:22px}.demo-play{width:40px;height:40px;top:22px;right:20px}.demo-tour-crop{top:42%}.demo-feature-statement{font-size:34px;left:22px}.demo-feature-index{padding-top:10px;font-size:10px;bottom:18px;left:22px;right:22px}}@media (max-width:600px){.demo-frame{padding-inline:16px}.demo-heading h1{font-size:clamp(38px,9.7vw,48px)}.demo-heading p{max-width:31ch;margin-top:18px}.demo-guided{border-radius:20px}.demo-guided-copy{padding:28px 24px 30px}.demo-guided h2{font-size:28px}.demo-description{font-size:15px}.demo-guided .customer-form{margin-top:22px}.demo-preview{aspect-ratio:1.2;min-height:300px}.demo-preview-label{font-size:12px;top:22px;left:24px}.demo-options{grid-template-columns:1fr;gap:28px;margin-top:24px}.demo-option-visual{aspect-ratio:1.55}.demo-visual-eyebrow{font-size:12px;top:22px;left:24px}.demo-tour-statement{font-size:28px;top:24px;left:24px}.demo-play{width:44px;height:44px;top:26px;right:24px}.demo-tour-crop{top:43%}.demo-feature-statement{font-size:44px;top:30%;left:24px}.demo-feature-index{font-size:11px;bottom:22px;left:24px;right:24px}.demo-option-heading{padding-top:16px}.demo-option>p,.demo-option-description{font-size:14px}.demo-start{padding:40px 0 16px}.demo-player{border-radius:12px;width:calc(100% - 20px)}.demo-player-top{padding-left:16px}.demo-player-screen{border-radius:5px;margin-inline:6px}.demo-player-controls{padding:14px 16px 18px}.demo-chapters{gap:5px}.demo-chapters button{flex:1;gap:4px;padding:8px 6px;font-size:11px}.demo-chapters button span{font-size:9px}}@media (prefers-reduced-motion:reduce){.demo-tour-crop,.demo-play{transition:none}.demo-option:hover .demo-tour-crop{transform:none}.demo-option:hover .demo-play{scale:1}}
