.features{position:relative;isolation:isolate}
.features .section-heading h2{font-size:clamp(2.3rem,4vw,3.5rem);text-shadow:0 4px 30px #0009}
.feature-tabs{gap:10px;border-bottom:1px solid #d5b87535;padding-bottom:14px}
.feature-tabs button{padding:12px 22px;background:#0813179c;border:1px solid #b6a06c35;border-radius:3px;transition:background .3s,border-color .3s,box-shadow .3s}
.feature-tabs button[aria-selected=true]{background:linear-gradient(130deg,#98722a48,#13272ba8);border-color:#e4bd6d;box-shadow:inset 0 0 24px #d8a54a12,0 8px 24px #0004}
.feature-display{position:relative;gap:34px;grid-template-columns:285px minmax(0,1fr);align-items:center;padding-block:25px 30px}
.feature-display:before{content:'';position:absolute;inset:-25px -35px -40px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 65% 70%,#51b8bd20,transparent 65%),linear-gradient(90deg,#081319aa,transparent 70%);border-radius:40%;filter:blur(20px)}
.feature-artifact{width:240px;height:170px;position:relative;margin-bottom:18px}
.feature-artifact:before{content:'';position:absolute;inset:20% -5% -2%;background:radial-gradient(ellipse,#efb45f35,transparent 68%);filter:blur(8px)}
.feature-artifact .capability-visual{width:240px;height:155px;transform:scale(1.25);transform-origin:50% 70%;filter:drop-shadow(0 15px 14px #0009)}
.feature-detail h3{font-size:2rem;color:#f3e3be;text-shadow:0 4px 20px #0009}
.feature-detail li{border-left:1px solid #ba8f404a;padding-left:15px;margin-block:10px}
.feature-detail li:before{content:''}
.feature-detail .detail-note{display:block;border-top:1px solid #a8a07c30;padding-top:13px}
.gallery-scene{position:absolute;inset:-35px -20px -35px;pointer-events:none;z-index:-1;overflow:hidden}
.gallery-scene:after{content:'';position:absolute;inset:40% 0 0;background:radial-gradient(ellipse at 60% 60%,#69d4d526,transparent 64%);filter:blur(18px)}
.gallery-scene img{position:absolute;right:4%;top:8%;height:88%;width:65%;object-fit:contain;opacity:.16;filter:drop-shadow(0 0 28px #dab46866);transform:rotate(-12deg)}
.gallery-scene img[hidden]{display:none}
.features .screen-area{position:relative;overflow:visible;isolation:isolate;perspective:1400px}
.features .screenshot-button{filter:drop-shadow(0 24px 22px #000b) drop-shadow(0 0 24px #53c5cf18);transform:rotateY(-2deg);transition:transform .6s,filter .6s}
.features .screenshot-button:hover{transform:rotateY(0);filter:drop-shadow(0 28px 24px #000b) drop-shadow(0 0 28px #c9a65625)}
.features .zoom-label{background:#14140ddd;border:1px solid #d0a45466;padding:7px 16px;color:#f4d194}
.gallery-switching .feature-detail{animation:gallery-copy-in .65s cubic-bezier(.2,1,.3,1) both}
.gallery-switching .gallery-scene img:not([hidden]){animation:gallery-art-in .85s ease-out both}
.gallery-visible .feature-artifact{animation:gallery-idle 6s ease-in-out infinite}
@keyframes gallery-copy-in{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:translateX(0)}}
@keyframes gallery-art-in{from{opacity:0;transform:rotate(-18deg) scale(.88)}to{opacity:.16;transform:rotate(-12deg) scale(1)}}
@keyframes gallery-idle{50%{transform:translateY(-7px)}}
.motion-off .gallery-visible .feature-artifact,.motion-off .gallery-switching .feature-detail,.motion-off .gallery-switching .gallery-scene img,.fx-paused .feature-artifact{animation:none}
@media(max-width:1000px){.feature-display{grid-template-columns:250px minmax(0,1fr);gap:20px}.feature-tabs button{padding:11px 14px}}
@media(max-width:800px){.feature-display{grid-template-columns:1fr;padding-block:10px;gap:20px}.feature-artifact{float:right;width:175px;height:125px;margin:0 0 10px 10px}.feature-artifact .capability-visual{width:175px;height:115px;transform:scale(1.08)}.feature-detail h3{font-size:1.6rem}.feature-tabs{gap:6px;overflow-x:auto}.feature-tabs button{padding:10px 12px;font-size:.85rem}.gallery-scene{inset:-15px 0}.features .screenshot-button{transform:none}.features .section-heading h2{font-size:2.2rem}}
@media(prefers-reduced-motion:reduce){.gallery-visible .feature-artifact,.gallery-switching .feature-detail,.gallery-switching .gallery-scene img{animation:none}.features .screenshot-button{transform:none;transition:none}}
@media(max-width:800px){.feature-display:before{inset:-20px 0 -25px}.feature-display{min-width:0}.feature-tabs{max-width:100%}}
.gallery-handover{display:flex;align-items:center;gap:24px;margin-top:24px;padding-top:16px;border-top:1px solid #bd9c5830}
.gallery-handover>img{width:240px;height:auto;box-shadow:0 12px 25px #0007}
.gallery-handover>div{flex:1;min-width:0}.gallery-handover .feature-label{font-size:.65rem;letter-spacing:.12em}.gallery-handover p{font-family:var(--serif);font-size:1.1rem;color:#e5c88e;margin:5px 0 10px;line-height:1.6}
.gallery-handover i{display:block;height:2px;background:linear-gradient(90deg,#e3bb6b,transparent);transform-origin:left}
.gallery-switching .gallery-handover i{animation:handover-line .8s ease-out both}
@keyframes handover-line{from{transform:scaleX(.05);opacity:.3}to{transform:scaleX(1);opacity:1}}
@media(max-width:800px){.feature-artifact{width:150px;overflow:hidden}.feature-artifact .capability-visual{width:150px;transform:none}.gallery-handover{gap:14px}.gallery-handover>img{width:46%}.gallery-handover p{font-size:.85rem}.gallery-handover .feature-label{font-size:.55rem}}
.motion-off .gallery-handover i{animation:none}
@media(prefers-reduced-motion:reduce){.gallery-handover i{animation:none!important}}
