/* home-v5-59-product-preview — canonical shared component */
.product{background:linear-gradient(180deg,#fff 0%,#f8f8fb 100%)}
.product .section-head.product-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.64fr);gap:36px;align-items:end;max-width:none}
.product .section-head.product-head .lead{max-width:560px;justify-self:end}
.product-stage{margin-top:48px;display:grid;grid-template-columns:310px minmax(0,1fr);gap:28px;align-items:start}
.cap-tabs{display:flex;flex-direction:column;gap:10px;position:sticky;top:104px}
.cap-tab{border:1px solid var(--line);border-radius:16px;background:#fff;padding:17px 18px;text-align:left;cursor:pointer;transition:border-color .2s var(--ease),box-shadow .2s var(--ease),transform .2s var(--ease),background .2s var(--ease)}
.cap-tab[aria-selected="true"]{border-color:rgba(139,105,253,.34);box-shadow:0 12px 30px rgba(23,21,43,.075);transform:translateX(4px);background:linear-gradient(115deg,#fff,#fbf9ff)}
.cap-tab .cap-kicker{font-size:.66rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--purple)}
.cap-tab strong{display:block;margin-top:5px;font-size:.98rem;line-height:1.28}.cap-tab small{display:block;color:var(--muted);margin-top:5px;line-height:1.4;font-size:.78rem}
.product-experience{min-width:0}.experience-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.65fr);gap:30px;align-items:end;margin-bottom:18px}
.experience-copy h3{font-family:Comfortaa,Inter,sans-serif;font-size:clamp(1.35rem,1.8vw,1.75rem);line-height:1.16;letter-spacing:-.025em;margin:0;color:var(--ink)}
.experience-copy p{margin:0;color:var(--muted);line-height:1.55;font-size:.92rem}
.product-viewer{background:#fff;border:1px solid #e9e6ee;border-radius:22px;padding:14px;box-shadow:0 22px 58px rgba(23,21,43,.10)}
.viewer-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:5px 4px 13px}
.viewer-meta{min-width:0}.viewer-meta strong{display:block;font-size:.9rem;color:var(--ink)}.viewer-meta span{display:block;margin-top:3px;color:var(--muted);font-size:.76rem;line-height:1.35}
.viewer-controls{display:flex;align-items:center;gap:8px;flex:0 0 auto}.viewer-counter{min-width:42px;text-align:center;font-size:.72rem;font-weight:760;color:var(--ink2,var(--ink-2))}
.viewer-nav{width:34px;height:34px;border-radius:999px;border:1px solid #e1dde7;background:#fff;color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.viewer-nav:hover:not(:disabled){background:#f7f5fa;border-color:#d2cbdc;transform:translateY(-1px)}.viewer-nav:disabled{opacity:.28;cursor:default}
.viewer-nav svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.viewer-frame{position:relative;width:fit-content;max-width:100%;margin-inline:auto;border:8px solid #17171a;border-radius:15px;overflow:hidden;background:#17171a;box-shadow:0 18px 44px rgba(23,21,43,.14);touch-action:pan-y;line-height:0;transition:width .24s var(--ease),height .24s var(--ease),box-shadow .2s ease}
.viewer-open{position:relative;display:block;width:fit-content;max-width:100%;padding:0;border:0;background:#fff;cursor:zoom-in;line-height:0;text-align:initial}
.viewer-frame img{display:block;width:auto;max-width:100%;height:auto;max-height:min(68vh,720px);object-fit:contain;background:#fff;opacity:1;transition:opacity .18s ease,transform .22s var(--ease)}
.viewer-frame.is-changing img{opacity:.28;transform:scale(.995)}
.viewer-zoom-hint{position:absolute;right:12px;bottom:12px;z-index:3;display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;background:rgba(20,19,24,.78);color:#fff;font-size:.64rem;font-weight:720;letter-spacing:.01em;opacity:0;transform:translateY(4px);transition:opacity .18s ease,transform .18s ease;pointer-events:none;backdrop-filter:blur(4px)}
.viewer-open:hover .viewer-zoom-hint,.viewer-open:focus-visible .viewer-zoom-hint{opacity:1;transform:none}
.viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 4px 2px}.viewer-caption{min-width:0}.viewer-caption strong{display:block;font-size:.82rem}.viewer-caption span{display:block;margin-top:3px;color:var(--muted);font-size:.74rem;line-height:1.4}
.viewer-dots{display:flex;align-items:center;gap:6px;flex:0 0 auto}.viewer-dot{width:8px;height:8px;padding:0;border-radius:50%;border:0;background:#d9d4e0;cursor:pointer}.viewer-dot[aria-current="true"]{width:20px;border-radius:999px;background:linear-gradient(90deg,var(--green),var(--purple))}
.product-disclaimer{margin:10px 4px 0;color:#8a8490;font-size:.66rem;line-height:1.45}

/* modal */
.product-modal[hidden]{display:none}.product-modal{--modal-gutter:clamp(16px,3vw,36px);position:fixed;inset:0;width:100%;height:100%;height:100dvh;z-index:1200;display:grid;place-items:center;padding:var(--modal-gutter);overflow:hidden;overscroll-behavior:none;opacity:0;transition:opacity .24s cubic-bezier(.22,.61,.36,1)}
.product-modal.is-open{opacity:1}.product-modal-backdrop{position:absolute;inset:0;background:rgba(14,13,18,.78);backdrop-filter:blur(8px);opacity:0;transition:opacity .24s ease}.product-modal.is-open .product-modal-backdrop{opacity:1}
.product-modal-dialog{position:relative;z-index:1;width:min(100%,1500px);height:100%;min-height:0;box-sizing:border-box;padding-top:48px;display:grid;grid-template-rows:minmax(0,1fr) auto;align-items:stretch;gap:12px;opacity:0;transform:translateY(12px) scale(.975);transition:opacity .22s ease,transform .28s cubic-bezier(.22,.61,.36,1)}
.product-modal.is-open .product-modal-dialog{opacity:1;transform:translateY(0) scale(1)}
.product-modal-close{position:absolute;right:0;top:0;z-index:4;width:40px;height:40px;border-radius:999px;border:1px solid rgba(255,255,255,.36);background:rgba(20,19,24,.76);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(6px)}
.product-modal-close svg,.product-modal-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.product-modal-content{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;overflow:hidden;touch-action:none;overscroll-behavior:contain;user-select:none}
.product-modal-media{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;max-width:100%;max-height:100%;overflow:hidden;opacity:1;transition:opacity .2s ease,transform .26s cubic-bezier(.22,.61,.36,1)}
.product-modal-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:8;width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.5);background:rgba(20,19,24,.86);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 26px rgba(0,0,0,.28)}
.product-modal-nav.prev{left:clamp(4px,1vw,12px)}.product-modal-nav.next{right:clamp(4px,1vw,12px)}
.product-modal-image-frame{display:inline-flex;align-items:center;justify-content:center;width:fit-content;height:fit-content;max-width:100%;max-height:100%;box-sizing:border-box;border:9px solid #111114;border-radius:16px;overflow:hidden;background:#111114;box-shadow:0 30px 90px rgba(0,0,0,.45);line-height:0}
.product-modal-image-frame img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 150px);object-fit:contain;background:#fff}
.product-modal-meta{align-self:end;justify-self:center;width:min(100%,1280px);box-sizing:border-box;padding:0 2px;color:#fff;text-align:left}.product-modal-meta strong{display:block;font-size:.9rem}.product-modal-meta span{display:block;margin-top:4px;color:rgba(255,255,255,.72);font-size:.76rem;line-height:1.45}
.product-modal-open{overflow:hidden!important;overscroll-behavior:none}

@media(max-width:980px){.product .section-head.product-head{grid-template-columns:1fr;align-items:start}.product .section-head.product-head .lead{justify-self:start}.product-stage{grid-template-columns:1fr;gap:20px}.cap-tabs{position:static;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.cap-tab[aria-selected="true"]{transform:none}.experience-copy{grid-template-columns:1fr;gap:8px}}
@media(max-width:720px){.cap-tabs{display:flex;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:2px 2px 8px}.cap-tabs::-webkit-scrollbar{display:none}.cap-tab{flex:0 0 78%;scroll-snap-align:start}.product-viewer{padding:9px;border-radius:18px}.viewer-toolbar{align-items:flex-start}.viewer-meta span{display:none}.viewer-frame{border-width:6px;border-radius:11px}.viewer-frame img{max-height:60vh}.viewer-zoom-hint{display:none}.viewer-footer{align-items:flex-start}.viewer-caption span{font-size:.7rem}.product-disclaimer{font-size:.62rem}.viewer-nav{width:32px;height:32px}.product-modal{--modal-gutter:14px}.product-modal-dialog{padding-top:44px;gap:9px}.product-modal-close{width:36px;height:36px}.product-modal-nav{width:42px;height:42px}.product-modal-image-frame{border-width:6px;border-radius:12px}.product-modal-meta{width:100%}}
@media(prefers-reduced-motion:reduce){.cap-tab,.viewer-frame,.viewer-frame img,.viewer-nav,.viewer-zoom-hint,.product-modal,.product-modal-backdrop,.product-modal-dialog,.product-modal-media{transition:none!important}.viewer-frame.is-changing img{opacity:1!important;transform:none!important}}