/* V9: a considered product pair, with one icon language and layered product scenes. */
.detail-icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.detail-grid{gap:22px;--detail-bg:#f5f6f8;--detail-text:#222936;--detail-muted:#7d8797;--detail-edge:#dfe4ed;--detail-glass:#ffffffeb;--detail-blue:#4d70dd}
.experience-grid .detail-panel{position:relative;display:flex;flex-direction:column;height:auto;min-height:475px;padding:26px 28px 19px;border:1px solid var(--detail-edge);background:var(--detail-bg);border-radius:24px;box-shadow:0 3px 4px #18213002,0 12px 32px #18213004;overflow:hidden;isolation:isolate;color:var(--detail-text);transition:border-color .3s,box-shadow .3s}
.detail-panel:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 85% 80%,#b9cafa20,transparent 65%);pointer-events:none;z-index:-1}
.detail-panel.card-panel:before{background:radial-gradient(ellipse at 70% 72%,#bcb2da25,transparent 65%)}
.detail-panel:hover{border-color:#aab8d2;box-shadow:0 16px 40px #1529500b}
.feature-top{display:flex;align-items:center;gap:10px;position:relative;z-index:2}
.feature-badge{display:flex;align-items:center;gap:9px;font:600 9px Manrope,Arial,sans-serif;letter-spacing:.06em}
.feature-badge>.detail-icon{width:34px;height:34px;padding:8px;box-sizing:border-box;border-radius:11px;color:#4d6bc7;background:linear-gradient(140deg,#fff,#dce5fb);box-shadow:0 2px 7px #304e8620,inset 0 1px 0 white}
.card-panel .feature-badge>.detail-icon{background:linear-gradient(140deg,#fff,#e4e0ee);color:#746688}
.feature-number{margin-left:auto;font:500 8px Manrope,Arial,sans-serif;color:var(--detail-muted);letter-spacing:.08em}
.feature-link{width:31px;height:31px;margin-left:3px;display:grid;place-items:center;border:1px solid var(--detail-edge);border-radius:50%;color:var(--detail-text);transition:background .2s,translate .2s}
.feature-link>.detail-icon{width:16px;height:16px}.feature-link:hover{background:var(--detail-glass);translate:2px -2px}
.feature-intro{position:relative;z-index:2;margin-top:22px;display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.feature-intro h3{font-weight:500;font-size:28px;letter-spacing:-.045em;line-height:1.25;margin:0;color:var(--detail-text)}
.feature-intro h3>span{color:var(--detail-muted)}
.feature-intro p{font-size:10px;line-height:1.85;color:var(--detail-muted);margin:0 0 3px;max-width:200px}
.feature-scene{height:240px;position:relative;margin:17px -28px 0;isolation:isolate;overflow:hidden}
.scene-grid{position:absolute;inset:0;background-image:linear-gradient(var(--detail-edge) 1px,transparent 1px),linear-gradient(90deg,var(--detail-edge) 1px,transparent 1px);background-size:32px 32px;opacity:.23;mask-image:radial-gradient(ellipse,#000,transparent 70%);transform:perspective(400px) rotateX(35deg)}
.scene-orb{position:absolute;border:1px solid var(--detail-edge);border-radius:50%;pointer-events:none}.orb-a{width:245px;height:245px;left:calc(50% - 120px);top:5px}.orb-b{width:325px;height:325px;left:calc(50% - 160px);top:-35px;opacity:.6}
.asset-console{width:310px;position:absolute;top:24px;left:calc(50% - 155px);padding:17px 19px 14px;border:1px solid #fff;border-radius:18px;background:var(--detail-glass);box-shadow:0 18px 35px #24385614,inset 0 1px 0 white;transform:rotate(-4deg);backdrop-filter:blur(12px);animation:consoleFloat 7s ease-in-out infinite}
.console-heading{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:500}.console-heading>img{width:23px;height:23px;border-radius:7px}.console-heading>.detail-icon{margin-left:auto;width:16px;height:16px;color:var(--detail-muted)}
.console-balance{display:flex;align-items:baseline;gap:8px;margin-top:10px}.console-balance>span{font-size:25px;font-family:Manrope,Arial;letter-spacing:2px;line-height:1}.console-balance>small{font-size:8px;color:var(--detail-muted)}
.asset-selector{display:flex;gap:7px;margin-top:15px}.asset-choice{flex:1;border:1px solid transparent;background:transparent;border-radius:10px;padding:8px 2px 6px;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;color:var(--detail-muted);transition:background .35s,border-color .35s,translate .35s;cursor:pointer}
.asset-choice img{width:27px;height:27px;transition:scale .35s;filter:drop-shadow(0 3px 3px #27386113)}.asset-choice span{font-size:8px;font-family:Manrope,Arial;font-weight:600}.asset-choice i{height:2px;width:12px;border-radius:3px;background:transparent;transition:background .3s}
.asset-choice.is-selected{background:#eaf0ff;border-color:#dce5fc;translate:0 -3px;color:#395bb3}.asset-choice.is-selected img{scale:1.08}.asset-choice.is-selected i{background:#6c8be6}.asset-choice:hover{background:#edf1f8}.asset-choice:focus-visible,.feature-link:focus-visible{outline:2px solid #6386e6;outline-offset:3px}
.console-actions{display:flex;justify-content:center;gap:30px;border-top:1px solid var(--detail-edge);padding-top:10px;margin-top:8px}.console-actions>span{display:flex;align-items:center;gap:5px;color:var(--detail-muted)}.console-actions .detail-icon{width:13px;height:13px}.console-actions small{font-size:7px}
.asset-peek{position:absolute;right:22px;bottom:12px;display:flex;align-items:center;gap:9px;background:var(--detail-glass);border:1px solid var(--detail-edge);border-radius:13px;box-shadow:0 7px 18px #27344e10;padding:10px 12px;min-width:142px;transform:rotate(3deg);animation:peekFloat 6s ease-in-out infinite;z-index:3;backdrop-filter:blur(12px)}
.asset-peek>img{width:28px;height:28px}.asset-peek b{font-size:10px;font-weight:600}.asset-peek small{display:block;font:7px Manrope,Arial;color:var(--detail-muted);margin-top:3px}.asset-peek>span{margin-left:auto;color:#879dcb}.asset-peek .detail-icon{width:15px;height:15px}
.scene-star{position:absolute;color:#8299c5;animation:detailTwinkle 4s ease-in-out infinite;pointer-events:none}.scene-star .detail-icon{width:18px;height:18px;stroke-width:1.2}.star-a{left:15%;top:31px}.star-b{right:13%;bottom:40px;animation-delay:-2s}.star-b .detail-icon{width:11px;height:11px}
.scene-orbit{position:absolute;inset:0;border-radius:50%;width:340px;height:210px;left:calc(50% - 170px);top:20px;pointer-events:none;transform:rotate(-18deg)}.scene-orbit i{position:absolute;width:5px;height:5px;border-radius:50%;background:#a4b8e4;box-shadow:0 0 12px #8ba6e6aa;offset-path:ellipse(50% 50% at 50% 50%);animation:detailOrbit 14s linear infinite}
.feature-footer{margin-top:17px;padding-top:14px;border-top:1px solid var(--detail-edge);display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative;z-index:2;font-size:9px;color:var(--detail-muted)}.feature-footer>span{display:flex;align-items:center;gap:7px}.feature-footer .detail-icon{width:14px;height:14px}.feature-footer>small{font-size:7px;color:var(--detail-muted);opacity:.7}
.card-stage{position:absolute;left:50%;top:49%;width:350px;height:221px;transform:translate(-50%,-50%) rotate(-12deg) scale(.81);z-index:2;animation:detailCardFloat 7s ease-in-out infinite;will-change:translate}
.detail-panel .card-stage .secondary-card{position:relative;width:350px;height:221px;inset:auto;scale:1;transform:none;animation:none;translate:none;box-shadow:0 18px 32px #1b203737,inset 1px 1px 0 #ffffff70;border-radius:17px}
.card-plinth{position:absolute;width:285px;height:35px;left:calc(50% - 142px);bottom:17px;border-radius:50%;background:#5f658a1a;filter:blur(10px);animation:plinthBreathe 7s ease-in-out infinite}
.card-orbit{position:absolute;width:390px;height:130px;left:calc(50% - 195px);top:65px;border:1px solid var(--detail-edge);border-radius:50%;transform:rotate(-18deg);pointer-events:none}.orbit-back{opacity:.85}.orbit-front{border-color:transparent transparent #a8b2cb50;z-index:3}
.card-contact-badge{position:absolute;top:9px;left:32px;display:flex;gap:7px;align-items:center;color:var(--detail-muted);font:6px Manrope,Arial;letter-spacing:.1em;transform:rotate(-4deg)}.card-contact-badge .detail-icon{width:16px;height:16px}
.gift-peek{display:flex;align-items:center;gap:9px;position:absolute;right:20px;bottom:6px;z-index:4;background:var(--detail-glass);backdrop-filter:blur(10px);border:1px solid var(--detail-edge);border-radius:12px;padding:10px 13px;box-shadow:0 7px 18px #27344e10;transform:rotate(3deg);animation:peekFloat 6s ease-in-out infinite;animation-delay:-2s}.gift-icon{color:#8f7c9b;background:#f0edf5;width:32px;height:32px;display:grid;place-items:center;border-radius:10px}.gift-icon .detail-icon{width:20px;height:20px}.gift-peek b{font:700 18px Manrope,Arial;letter-spacing:-.04em}.gift-peek b small{font-size:8px;font-weight:500;letter-spacing:0}.gift-peek div>span{display:block;font-size:7px;margin-top:3px;color:var(--detail-muted)}
@keyframes consoleFloat{0%,100%{translate:0 2px}50%{translate:0 -5px}}@keyframes peekFloat{0%,100%{translate:0 2px}50%{translate:0 -5px}}@keyframes detailCardFloat{0%,100%{translate:0 3px;rotate:0deg}50%{translate:0 -7px;rotate:2deg}}@keyframes detailOrbit{to{offset-distance:100%}}@keyframes detailTwinkle{0%,100%{opacity:.35;scale:.8;rotate:0deg}50%{opacity:1;scale:1.1;rotate:35deg}}@keyframes plinthBreathe{0%,100%{scale:1;opacity:1}50%{scale:.9;opacity:.65}}
@media(prefers-color-scheme:dark){.detail-grid{--detail-bg:#1a1f29;--detail-text:#ecf0f7;--detail-muted:#9caac0;--detail-edge:#333e51;--detail-glass:#252e3aeb}.detail-panel:before{background:radial-gradient(ellipse at 85% 80%,#435e9528,transparent 65%)}.detail-panel.card-panel:before{background:radial-gradient(ellipse at 70% 72%,#78668a28,transparent 65%)}.feature-badge>.detail-icon{background:linear-gradient(140deg,#354768,#24324b);color:#c3d3ff;box-shadow:0 2px 7px #0002,inset 0 1px 0 #ffffff15}.card-panel .feature-badge>.detail-icon{background:linear-gradient(140deg,#494152,#2e2b3a);color:#d2c7e0}.asset-console{border-color:#47536b;box-shadow:0 18px 35px #050c172e,inset 0 1px 0 #ffffff15}.asset-choice.is-selected{background:#364766;border-color:#4b6287;color:#d9e5ff}.asset-choice:hover{background:#344056}.gift-icon{background:#3c3448;color:#c5b5d6}.card-plinth{background:#02070c66}}
@media(max-width:1100px){.feature-intro{display:block}.feature-intro p{margin-top:12px;max-width:none}.feature-intro p br{display:none}.feature-intro h3{font-size:27px}.experience-grid .detail-panel{padding:23px 23px 18px}.feature-scene{margin-left:-23px;margin-right:-23px;height:230px}.feature-number{display:none}.feature-link{margin-left:auto}.asset-console{scale:.9;transform-origin:top center}.asset-peek{right:15px;bottom:13px}.card-stage{transform:translate(-50%,-50%) rotate(-12deg) scale(.73)}.feature-footer{font-size:8px}.card-contact-badge{left:24px}}
@media(max-width:760px){.detail-grid{gap:18px}.experience-grid .detail-panel{min-height:0;padding:22px 22px 17px;border-radius:22px}.feature-badge{font-size:8px}.feature-badge>.detail-icon{width:32px;height:32px}.feature-number{display:block;font-size:7px;margin-left:auto}.feature-link{margin-left:3px}.feature-intro{margin-top:19px}.feature-intro h3{font-size:28px}.feature-intro p{font-size:10px;margin-top:12px;max-width:none}.feature-scene{height:226px;margin:14px -22px 0}.asset-console{scale:.87;top:16px}.asset-peek{right:17px;bottom:9px;min-width:130px;padding:8px 10px}.asset-peek b{font-size:9px}.card-stage{top:48%;transform:translate(-50%,-50%) rotate(-12deg) scale(.7)}.gift-peek{right:17px;bottom:8px;padding:8px 10px}.gift-peek b{font-size:17px}.card-contact-badge{left:23px;top:3px}.feature-footer{margin-top:12px;padding-top:13px;font-size:8px}.feature-footer>small{font-size:6px}.scene-star.star-a{left:9%;top:18px}.scene-star.star-b{right:7%;bottom:55px}}
@media(max-width:360px){.feature-badge{font-size:7px}.feature-number{display:none}.feature-link{margin-left:auto}.asset-console{scale:.79}.feature-scene{height:213px}.card-stage{transform:translate(-50%,-50%) rotate(-12deg) scale(.63)}.gift-peek{right:12px;bottom:6px}.feature-intro h3{font-size:25px}}
@media(prefers-reduced-motion:reduce){.detail-panel *,.detail-panel *:before,.detail-panel *:after{animation:none!important;transition:none!important}}
@media(max-width:760px){.wallet-scene{height:240px}.asset-console{top:28px}}
@media(max-width:360px){.wallet-scene{height:225px}}