/* V15: quatro etapas em perspectiva com abertura individual para frente. */
.experience.wrap{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;gap:20px;min-height:0;margin-top:-64px;padding:clamp(27px,3.6vw,52px) clamp(21px,4.2vw,58px) 37px;border:1px solid #ffffff30;border-radius:24px;background:linear-gradient(90deg,#04070bf5,#06090deb 44%,#07090dcc),url('img/tour-oficina.webp') center/cover;box-shadow:0 25px 70px #0007,inset 0 1px #fff2;isolation:isolate;overflow:visible}
.experience-copy{position:relative;z-index:1;max-width:100%}
.experience-copy h2{font-size:clamp(34px,4.25vw,61px);line-height:1.045;max-width:940px;margin:18px 0 15px;letter-spacing:-.058em;font-weight:850}
.experience-copy h2 span{color:#f32242}
.experience-copy p{font-size:clamp(13px,1.1vw,16px);line-height:1.56;max-width:630px;margin:0}
.experience-copy .btn-outline{display:none}
.experience-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:clamp(12px,1.7vw,25px);padding:16px 7px 48px;position:relative;perspective:1100px;isolation:isolate}
.experience-steps .step{--angle:0deg;--raise:0px;--ztilt:0deg;display:grid;grid-template-columns:37px minmax(0,1fr);grid-template-rows:auto auto auto;align-items:center;position:relative;overflow:visible;z-index:1;background:transparent;padding:0;border:0;text-align:left;border-radius:15px;color:#fff;min-width:0;cursor:pointer;transform:translateZ(0);-webkit-tap-highlight-color:transparent}
.experience-steps .step:nth-child(1){--angle:20deg;--raise:6px;--ztilt:-1.6deg}
.experience-steps .step:nth-child(2){--angle:12deg;--raise:0px;--ztilt:1.6deg}
.experience-steps .step:nth-child(3){--angle:-12deg;--raise:0px;--ztilt:-1.6deg}
.experience-steps .step:nth-child(4){--angle:-20deg;--raise:6px;--ztilt:1.6deg}
.experience-steps .step img{grid-column:1/-1;grid-row:1;width:100%;height:auto;aspect-ratio:1.43;object-fit:cover;border:1px solid #ffffff99;border-radius:16px;background:#17191c;filter:brightness(.93) saturate(1.05);backface-visibility:hidden;transform:perspective(1000px) rotateY(var(--angle)) rotateZ(var(--ztilt)) translateY(var(--raise)) scale(.94);transition:transform .48s cubic-bezier(.2,.7,.2,1),box-shadow .48s,filter .48s,border-color .48s;box-shadow:12px 20px 22px #0008;will-change:transform}
.experience-steps .step:after{content:"";position:absolute;left:17px;top:calc((100% - 54px)*.71);width:1px;height:21px;transform:rotate(13deg);transform-origin:top;background:#ef1d3d;opacity:.8;pointer-events:none}
.experience-steps .step-num{grid-column:1;grid-row:2/4;width:33px;height:33px;display:grid;place-items:center;margin:21px 0 0;border:2px solid #ed2341;border-radius:50%;background:#06090d;color:#fff;font-weight:750;font-size:14px;box-shadow:0 0 0 4px #090c10b3}
.experience-steps .step strong{grid-column:2;grid-row:2;font-size:clamp(12px,1.07vw,15px);line-height:1.25;margin:20px 0 3px 11px;font-weight:800;white-space:normal;color:#f9fafb}
.experience-steps .step small{grid-column:2;grid-row:3;margin:0 0 0 11px;color:#c0c4cd;font-size:clamp(10px,.86vw,12px);line-height:1.35;white-space:normal;overflow:visible;text-overflow:clip}
.experience-steps .step-track{bottom:8px;height:1px;left:20px;right:20px;width:auto;background:linear-gradient(90deg,transparent,#f52b46 12%,#f52b46 88%,transparent);opacity:.65;pointer-events:none}
.experience-steps .step-track>span{display:none}
@media(hover:hover) and (pointer:fine){.experience-steps .step:hover{z-index:5}.experience-steps .step:hover img{transform:perspective(1000px) rotateY(0) rotateZ(0) translateY(-8px) scale(1.055);filter:brightness(1.05);border-color:#ff3651;box-shadow:0 29px 44px #000b,0 0 0 1px #f12a46a6}.experience-steps .step:hover .step-num{background:#ef1d3d}}
.experience-steps .step.is-facing{z-index:5}
.experience-steps .step.is-facing img,.experience-steps .step:focus-visible img{transform:perspective(1000px) rotateY(0) rotateZ(0) translateY(-8px) scale(1.035);filter:brightness(1.06);border-color:#ff3b58;box-shadow:0 26px 43px #000a,0 0 0 1px #ff3b58}
.experience-steps .step.is-facing .step-num{background:#e91d3b}
.experience-steps .step:focus-visible{outline:2px solid #fff;outline-offset:8px}
.experience-steps .step:focus:not(:focus-visible){outline:none}
@media(max-width:800px){.experience.wrap{margin-top:-83px;gap:15px;padding:29px 26px 30px}.experience-copy h2{font-size:clamp(31px,5.9vw,48px)}.experience-steps{gap:14px;padding:15px 0 37px}.experience-steps .step img{aspect-ratio:1.3}.experience-steps .step-num{width:28px;height:28px;font-size:12px}.experience-steps .step strong{font-size:11px;margin-left:5px}.experience-steps .step small{font-size:10px;margin-left:5px}.experience-steps .step{grid-template-columns:31px 1fr}.experience-steps .step:after{left:15px}}
@media(max-width:620px){.experience.wrap{padding:26px 18px 24px;gap:12px;border-radius:20px}.experience-copy h2{font-size:clamp(30px,8vw,38px);line-height:1.1;letter-spacing:-.04em}.experience-copy p{font-size:12px;max-width:500px}.experience-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 13px;padding:12px 1px 15px}.experience-steps .step img{aspect-ratio:1.45;border-radius:11px;transform:perspective(740px) rotateY(var(--angle)) rotateZ(var(--ztilt)) translateY(2px) scale(.96)}.experience-steps .step:nth-child(1){--angle:9deg}.experience-steps .step:nth-child(2){--angle:-9deg}.experience-steps .step:nth-child(3){--angle:9deg}.experience-steps .step:nth-child(4){--angle:-9deg}.experience-steps .step:after{display:none}.experience-steps .step-num{margin-top:11px;width:26px;height:26px;font-size:11px}.experience-steps .step strong{margin-top:12px;font-size:11px}.experience-steps .step small{font-size:10px}.experience-steps .step-track{display:none}}
@media(prefers-reduced-motion:reduce){.experience-steps .step img{transition:none!important;will-change:auto}}