.real-product{padding:0 0 6.75rem;background:var(--fog)}
.interface-container{width:min(1500px,calc(100% - 3rem));margin:0 auto}
.real-product .product-explorer{scroll-margin-top:6.2rem;border:1px solid var(--line);border-radius:1.35rem;background:#fff;overflow:hidden;transition:border-color .3s,box-shadow .3s}
.real-product .product-explorer[open]{border-color:#d6ddec;box-shadow:0 30px 80px rgba(15,23,42,.08)}
.product-explorer>summary{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.35rem 1.5rem;cursor:pointer;list-style:none}
.product-explorer>summary::-webkit-details-marker{display:none}
.interface-summary-copy{display:grid;gap:.28rem}
.product-explorer .interface-summary-copy .eyebrow{color:var(--blue);font-size:.62rem}
.interface-summary-copy strong{color:var(--ink);font:800 clamp(1rem,1.5vw,1.18rem) var(--display)}
.interface-summary-copy small{color:var(--soft);font-size:.75rem}
.interface-summary-action{display:flex;align-items:center;gap:.8rem;flex:none;color:var(--ink);font-size:.73rem;font-weight:800}
.product-explorer .interface-summary-action span{color:var(--ink);font-size:.73rem}
.real-product .interface-summary-action i{display:grid;width:2.35rem;height:2.35rem;place-items:center;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--blue);font-style:normal;font-size:1rem;transition:transform .25s,background .25s,color .25s,border-color .25s}
.product-explorer[open] .interface-summary-action i{transform:rotate(45deg);border-color:var(--blue);background:var(--blue);color:#fff}
.product-explorer[open]>summary{border-bottom:1px solid var(--line)}
.interface-explorer{padding:1.25rem clamp(1.25rem,2.5vw,2.25rem) clamp(1.5rem,3vw,2.5rem)}
.interface-tabs{display:flex;gap:.45rem;overflow-x:auto;padding:.15rem 0 .85rem;scrollbar-width:thin;scrollbar-color:#cbd3e5 transparent}
.interface-tab{flex:none;padding:.65rem .9rem;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--soft);font-size:.72rem;font-weight:800;cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s}
.interface-tab:hover{border-color:#aebcf4;color:var(--blue)}
.interface-tab[aria-selected="true"]{border-color:var(--navy);background:var(--navy);color:#fff}
.interface-tab:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.interface-panels{padding-top:.75rem}
.interface-panel{display:grid;grid-template-columns:minmax(0,2.35fr) minmax(18rem,.65fr);gap:clamp(2rem,4vw,4rem);align-items:center;animation:interfaceEnter .38s cubic-bezier(.2,.8,.2,1)}
.interface-panel[hidden]{display:none}
@keyframes interfaceEnter{from{opacity:.25;transform:translateY(8px)}to{opacity:1;transform:none}}
.interface-frame{margin:0;min-width:0;overflow:hidden;border:1px solid #d9dfeb;border-radius:1.15rem;background:#f7f8fb;box-shadow:0 24px 60px rgba(15,23,42,.10)}
.interface-frame-bar{display:flex;align-items:center;gap:.75rem;height:2.45rem;padding:0 .9rem;border-bottom:1px solid #e2e6ee;background:#fff}
.interface-frame-dots{display:flex;gap:.3rem}
.interface-frame-dots i{width:.42rem;height:.42rem;border-radius:50%;background:#d7dce6}
.interface-frame-dots i:first-child{background:#ff7c73}.interface-frame-dots i:nth-child(2){background:#f7c95c}.interface-frame-dots i:last-child{background:#58c886}
.interface-frame-bar span:last-child{overflow:hidden;color:#8a94a6;font-size:.62rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.interface-frame img{display:block;width:100%;height:auto;aspect-ratio:1600/786;object-fit:contain;background:#fff}
.interface-frame figcaption{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.72rem .9rem;color:#7b8699;font-size:.65rem;font-weight:700}
.interface-frame figcaption span:first-child{color:#344156}
.interface-panel-copy{align-self:center}
.interface-meta{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.2rem;padding-bottom:1rem;border-bottom:1px solid var(--line);color:var(--soft);font:700 .62rem var(--mono);letter-spacing:.08em;text-transform:uppercase}
.interface-meta span:first-child{color:var(--blue)}
.interface-panel-copy .eyebrow{font-size:.64rem}
.interface-panel-copy h3{margin-top:.8rem;color:var(--ink);font:800 clamp(1.75rem,2.8vw,2.55rem)/1.06 var(--display);letter-spacing:-.04em}
.interface-description{margin-top:1rem;color:var(--soft);font-size:.88rem}
.interface-points{display:grid;gap:.65rem;margin-top:1.25rem}
.interface-points li{display:flex;gap:.65rem;color:#3d485b;font-size:.75rem;font-weight:700}
.interface-points li::before{content:"";width:.42rem;height:.42rem;margin-top:.36rem;flex:none;border-radius:50%;background:var(--blue)}
.interface-cta{display:inline-flex;margin-top:1.45rem;color:var(--blue);font-size:.76rem;font-weight:800}
.interface-cta:hover{text-decoration:underline;text-underline-offset:3px}
.interface-controls{display:flex;align-items:center;gap:.55rem;margin-top:1.5rem;padding-top:1.2rem;border-top:1px solid var(--line)}
.interface-control{display:inline-flex;min-height:2.65rem;align-items:center;justify-content:center;padding:.65rem .9rem;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font-size:.7rem;font-weight:800;cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.interface-control:hover:not(:disabled){border-color:var(--blue);color:var(--blue)}
.interface-control.next{margin-left:auto;border-color:var(--blue);background:var(--blue);color:#fff}
.interface-control.next:hover:not(:disabled){background:#123bd1;color:#fff}
.interface-control:disabled{cursor:not-allowed;opacity:.35}
@media(max-width:1180px){.interface-panel{grid-template-columns:1fr;gap:1.8rem}.interface-panel-copy{max-width:48rem}.interface-frame{width:100%}}
@media(max-width:640px){.interface-container{width:min(100% - 2rem,1500px)}.product-explorer>summary{align-items:flex-start;gap:1rem;padding:1.15rem}.interface-summary-copy small{max-width:19rem}.interface-summary-action span{display:none}.interface-explorer{padding:.8rem .8rem 1.25rem}.interface-tabs{margin:0 -.8rem;padding:.1rem .8rem .75rem}.interface-frame{border-radius:.8rem}.interface-frame-bar{height:2rem;padding:0 .65rem}.interface-frame figcaption{align-items:flex-start;flex-direction:column;gap:.2rem}.interface-panel-copy{padding:.35rem .25rem 0}.interface-panel-copy h3{font-size:clamp(1.65rem,8vw,2.15rem)}.interface-description{font-size:.82rem}.interface-controls{gap:.4rem}.interface-control{flex:1;padding:.62rem .7rem}.interface-control.next{margin-left:0}}
@media(prefers-reduced-motion:reduce){.interface-panel{animation:none}.product-explorer,.interface-summary-action i,.interface-tab,.interface-control{transition:none!important}}