/* Wine Stock on iPhone 18 Pro Max, plus an unfolding Duo interface study. */
.app-devices{display:grid;justify-items:end;gap:9px}
.device-switch{display:flex;padding:4px;border:1px solid var(--line);border-radius:30px;gap:4px;background:var(--vault)}
.device-switch button{font:500 .8rem/1.25 var(--body);padding:10px 16px;border:0;border-radius:24px;background:transparent;color:var(--muted);cursor:pointer;white-space:nowrap}
.device-switch button[aria-pressed="true"]{background:var(--champagne);color:var(--night)}
.device-switch button:focus-visible{outline:2px solid var(--label);outline-offset:3px}
.app-platforms{font-size:.8rem;color:var(--muted);margin-top:8px}
.duo-demo{width:min(1180px,100%);margin:auto;display:grid;justify-items:center;gap:14px;perspective:2600px;--open:0;--widgets:0;--shadow:1;--yaw:180deg;--dx:-25%}
.duo-device{position:relative;width:min(760px,calc((100svh - var(--hdr) - 300px)*1.397));aspect-ratio:164.6/117.8;transform-style:preserve-3d;transform:translateX(var(--dx)) rotateX(calc(6deg * (1 - var(--open))));will-change:transform}
.duo-half{position:absolute;inset:0;width:50%;box-sizing:border-box;border:6px solid #222529;background:#0f1219;transform-style:preserve-3d;box-shadow:0 0 0 1px #777b80,0 20px 50px -18px #000}
.duo-right{left:50%;border-radius:calc(28px * (1 - var(--open))) 28px 28px calc(28px * (1 - var(--open)));border-left:1px solid #26292b;overflow:hidden}
.duo-left{border-radius:28px 0 0 28px;border-right:1px solid #26292b;transform-origin:100% 50%;transform:rotateY(var(--yaw))}
.duo-inner,.duo-cover{position:absolute;inset:0;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.duo-left .duo-inner{border-radius:21px 0 0 21px}
.duo-cover{transform:rotateY(180deg);border-radius:22px;background:#11151b;display:flex;flex-direction:column;padding:8% 7%;box-sizing:border-box}
.duo-left{background:transparent;box-shadow:none;border:0}
.duo-left .duo-inner{inset:0;border:6px solid #222529;border-right:1px solid #26292b;box-shadow:0 0 0 1px #777b80;border-radius:28px 0 0 28px}
.duo-cover{inset:0;border:6px solid #222529;box-shadow:0 0 0 1px #777b80;border-radius:28px}
.duo-island{width:28%;height:3%;min-height:10px;background:#030405;border-radius:30px;align-self:center;margin-bottom:10%}
.duo-cover-head{display:flex;align-items:center;gap:8px;font-size:clamp(9px,1.4vw,16px);font-weight:600;color:#f1e8da}
.duo-cover-head img{width:25px;height:25px}
.duo-cover h3{font-family:var(--body);font-size:clamp(20px,3.4vw,38px);margin-top:9%}
.duo-cover small{font-size:clamp(8px,1.2vw,13px);color:#b4b0aa;margin-top:3%}
.duo-cover-photo{flex:1;min-height:0;margin:8% 0;border-radius:12px;overflow:hidden;position:relative}
.duo-cover-photo img{width:100%;height:100%;object-fit:cover}
.duo-cover-foot{background:#cdb789;color:#181117;text-align:center;padding:5%;border-radius:12px;font-size:clamp(9px,1.3vw,15px);font-weight:600}
.duo-photo{position:absolute;inset:0;width:200%;height:100%;max-width:none;object-fit:cover;object-position:center}
.duo-right .duo-photo{left:-100%}
.duo-map-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,12,17,.85),transparent 40%,rgba(9,12,17,.8))}
.duo-room-heading{position:absolute;inset:8% 9% auto;color:#f1e8da}
.duo-room-heading b{display:block;font-size:clamp(14px,2.4vw,28px);font-weight:500;line-height:1.2}
.duo-room-heading span{display:block;font-size:clamp(8px,1.1vw,13px);color:#d0b789;margin-top:6px}
.duo-room-note{position:absolute;inset:auto 8% 8%;padding:5%;border:1px solid rgba(208,183,137,.35);border-radius:12px;background:rgba(14,19,25,.9);font-size:clamp(8px,1.15vw,14px);opacity:var(--widgets);transform:translateY(calc(20px * (1 - var(--widgets))));color:#ddd5c7}
.duo-widgets{position:absolute;inset:0;padding:8% 7% 5%;box-sizing:border-box;background:#10151b;opacity:var(--widgets);transform:translateY(calc(35px * (1 - var(--widgets))));display:flex;flex-direction:column;gap:5%;font-size:clamp(9px,1.2vw,14px)}
.duo-widgets header{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#f1e8da;font-weight:600;font-size:clamp(12px,1.7vw,20px)}
.duo-widgets header img{width:24px;height:24px}
.duo-tabs{display:flex;gap:6px}
.duo-tabs button{font:inherit;border:1px solid #39414c;border-radius:14px;color:#c9c5bc;padding:5px 8px;background:transparent;cursor:pointer}
.duo-tabs button[aria-pressed="true"]{background:#cdb789;border-color:#cdb789;color:#171116}
.duo-tabs button:focus-visible,.duo-action:focus-visible{outline:2px solid #f1e8da;outline-offset:2px}
.duo-wine{min-height:0;flex:1;display:grid;grid-template-columns:.7fr 1fr;gap:8%;align-items:center;background:#181f29;border-radius:13px;padding:7%}
.duo-wine img{width:100%;height:100%;object-fit:contain;min-height:0;max-height:180px;border-radius:8px}
.duo-wine b{display:block;color:#f3ede3;font-size:clamp(12px,1.7vw,20px);line-height:1.2;font-weight:500}
.duo-wine p{font-size:inherit;color:#c4b7a4;margin-top:8px;line-height:1.5}
.duo-mini{display:grid;grid-template-columns:1fr 1fr;gap:5%}
.duo-mini div{border-top:1px solid #3c4149;padding-top:8%;line-height:1.4;color:#aba6a0}
.duo-mini b{display:block;color:#ede5d8;font-weight:500}
.duo-action{font:inherit;font-weight:500;border:0;border-radius:12px;background:#cdb789;color:#19121a;padding:5%;cursor:pointer}
.duo-fold-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.02),rgba(0,0,0,.68));opacity:var(--shadow);backface-visibility:hidden}
.duo-hinge{position:absolute;top:1%;bottom:1%;left:50%;width:1px;background:rgba(0,0,0,.6);pointer-events:none;opacity:calc(.3 * var(--open))}
.duo-caption{min-height:24px;color:var(--champagne);font-size:var(--step--1);text-align:center;padding-inline:16px}
.duo-concept{font-size:.72rem;color:var(--muted);text-align:center;padding-inline:16px}
.app-scene.is-duo{--pin:220vh!important}
.app-scene.is-duo .app-count{visibility:hidden}
@media(max-width:700px){.app-head{align-items:flex-start;flex-wrap:wrap;gap:12px}.app-devices{justify-items:start;width:100%}.app-devices .app-count{display:none}.device-switch{max-width:100%}.device-switch button{font-size:.72rem;padding:9px 12px}.duo-device{width:min(88vw,calc((100svh - var(--hdr) - 260px)*1.397))}.duo-demo{gap:14px}.duo-half{border-width:4px}.duo-right{border-left-width:1px;border-radius:0 18px 18px 0}.duo-left{border-right-width:1px;border-radius:18px 0 0 18px}.duo-left .duo-inner{border-radius:14px 0 0 14px}.duo-cover{border-radius:14px}.duo-cover-head img,.duo-widgets header img{width:16px;height:16px}.duo-cover-photo{border-radius:7px}.duo-wine{border-radius:7px}.duo-tabs{gap:3px}.duo-tabs button{padding:4px 5px}.duo-action{border-radius:7px}.duo-room-note{border-radius:7px}.duo-widgets{gap:4%}}
@media(max-height:650px) and (min-width:701px){.duo-device{width:450px}.duo-demo{gap:8px}}
@media(max-width:700px){.duo-right{border-radius:calc(18px * (1 - var(--open))) 18px 18px calc(18px * (1 - var(--open)))}.duo-left{border:0}.duo-left .duo-inner{border-width:4px;border-right-width:1px;border-radius:18px 0 0 18px}.duo-cover{border-width:4px;border-radius:18px}}
@media(max-width:480px){.duo-widgets{padding:10px;gap:7px}.duo-widgets header,.duo-tabs,.duo-mini,.duo-action{flex-shrink:0}.duo-widgets header{font-size:11px}.duo-wine{min-height:78px;padding:7px;gap:7%;box-sizing:border-box}.duo-wine img{max-height:70px}.duo-wine b{font-size:11px;line-height:1.15}.duo-wine p{font-size:8px;line-height:1.3;margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.duo-mini{font-size:8px}.duo-action{padding:7px;min-height:28px}.duo-tabs button{font-size:8px;padding:4px 5px}}