.experience-showcase{padding-top:var(--section-padding-top, 60px);padding-bottom:var(--section-padding-bottom, 60px);background-color:var(--section-bg-color, #ffffff);width:100%}.experience-showcase__container{max-width:1200px;margin:0 auto;padding:0 20px;width:100%}.experience-showcase__header{text-align:center;margin-bottom:var(--header-margin-bottom, 40px)}.experience-showcase__heading{color:var(--header-color, #1a1a1a);font-size:var(--header-font-size-mobile, 28px);font-weight:var(--header-font-weight, 600);margin:0 0 12px;line-height:1.2}.experience-showcase__subheading{color:var(--subheader-color, #666666);font-size:var(--subheader-font-size-mobile, 16px);margin:0;line-height:1.5}.experience-showcase__tabs-wrapper{display:none}.experience-showcase__cards{display:flex;flex-direction:column;gap:var(--card-gap, 16px)}.experience-showcase__card{background:var(--card-bg-color, #f9f9f9);border:var(--card-border-width, 1px) solid var(--card-border-color, #e0e0e0);border-radius:var(--card-border-radius, 12px);overflow:hidden;transition:background-color .2s ease,box-shadow .2s ease,border-color .2s ease}.experience-showcase__card:hover{background:var(--card-hover-bg, #f5f5f5)}.experience-showcase__card.is-expanded{border-left:3px solid var(--mobile-active-accent, #1a1a1a)}.experience-showcase__trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--card-padding, 20px);background:transparent;border:none;cursor:pointer;text-align:left}.experience-showcase__trigger-content{flex:1;min-width:0}.experience-showcase__title{color:var(--title-color, #1a1a1a);font-size:var(--title-font-size-mobile, 18px);font-weight:var(--title-font-weight, 600);margin:0;line-height:1.3}.experience-showcase__preview{color:var(--preview-color, #888888);font-size:var(--preview-font-size-mobile, 14px);margin:6px 0 0;line-height:1.4}.experience-showcase__toggle{flex-shrink:0;width:var(--toggle-size, 24px);height:var(--toggle-size, 24px);color:var(--toggle-color, #666666);transition:transform .3s ease;margin-left:12px}.experience-showcase__toggle svg{width:100%;height:100%}.experience-showcase__card.is-expanded .experience-showcase__toggle:not(.experience-showcase__toggle--plus-minus){transform:rotate(180deg)}.experience-showcase__toggle-vertical{transition:transform .3s ease,opacity .3s ease;transform-origin:center}.experience-showcase__card.is-expanded .experience-showcase__toggle-vertical{transform:rotate(90deg);opacity:0}.experience-showcase__content{height:0;overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1)}.experience-showcase__content-inner{padding:0 var(--card-padding, 20px) var(--card-padding, 20px);display:flex;flex-direction:column;gap:20px}.experience-showcase__text{display:flex;flex-direction:column;gap:16px}.experience-showcase__description{color:var(--description-color, #444444);font-size:var(--description-font-size-mobile, 15px);line-height:1.6}.experience-showcase__description p{margin:0 0 12px}.experience-showcase__description p:last-child{margin-bottom:0}.experience-showcase__image-wrapper{width:var(--image-width-mobile, 100%);margin:0 auto}.experience-showcase__image{width:100%;height:auto;max-height:var(--image-max-height, 400px);border-radius:var(--image-border-radius, 8px);display:block}.experience-showcase__cta{display:inline-flex;align-items:center;gap:8px;font-size:var(--link-font-size, 15px);font-weight:var(--link-font-weight, 500);text-decoration:none;transition:color .2s ease,background-color .2s ease,transform .2s ease;margin-top:8px}.experience-showcase__cta--button{background:var(--button-bg, #1a1a1a);color:var(--button-text-color, #ffffff);padding:var(--button-padding-y, 12px) var(--button-padding-x, 24px);border-radius:var(--button-border-radius, 6px)}.experience-showcase__cta--button:hover{background:var(--button-hover-bg, #333333)}.experience-showcase__cta--text{color:var(--link-color, #0066cc);padding:0;background:transparent}.experience-showcase__cta--text:hover{color:var(--link-hover-color, #004499)}.experience-showcase__cta--text svg{transition:transform .2s ease}.experience-showcase__cta--text:hover svg{transform:translate(4px)}.experience-showcase__phone-frame{position:relative;width:100%;max-width:200px;aspect-ratio:9 / 19.5;background:#2c2218;border-radius:2.5rem;padding:8px;box-shadow:0 8px 30px #0000002e,0 2px 8px #0000001a,inset 0 0 0 1px #ffffff1a,inset 0 1px #ffffff14}.experience-showcase__phone-notch{position:absolute;top:12px;left:50%;transform:translate(-50%);width:80px;height:22px;background:#2c2218;border-radius:20px;z-index:2}.experience-showcase__phone-screen{width:100%;height:100%;border-radius:2.1rem;overflow:hidden;background:#000}.experience-showcase__phone-screen img{width:100%;height:100%;object-fit:cover;display:block}.experience-showcase__image-wrapper--phone-frame{display:flex;justify-content:center;align-items:center;padding:1rem 0;width:100%}.experience-showcase__image-wrapper--phone-frame .experience-showcase__phone-frame{max-width:200px}.experience-showcase__browser-frame{background:#2c2218;border-radius:14px;overflow:hidden;box-shadow:0 8px 30px #00000024,0 2px 8px #00000014,inset 0 0 0 1px #ffffff14}.experience-showcase__browser-chrome{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#3a3028}.experience-showcase__browser-dots{display:flex;gap:6px;flex-shrink:0}.experience-showcase__browser-dots span{width:10px;height:10px;border-radius:50%}.experience-showcase__browser-dots span:nth-child(1){background:#ff5f57}.experience-showcase__browser-dots span:nth-child(2){background:#ffbd2e}.experience-showcase__browser-dots span:nth-child(3){background:#28c840}.experience-showcase__browser-url-bar{flex:1;display:flex;align-items:center;gap:6px;background:#ffffff14;border-radius:8px;padding:6px 12px;font-size:11px;color:#ffffff80;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;max-width:260px}.experience-showcase__browser-url-bar svg{flex-shrink:0;opacity:.5;stroke:currentColor}.experience-showcase__browser-screen{width:100%;overflow:hidden;background:#fff}.experience-showcase__browser-screen img{width:100%;height:auto;display:block;max-height:var(--image-max-height, 400px);object-fit:cover}.experience-showcase__image-wrapper--browser-frame{width:100%}.experience-showcase__content-inner{display:flex;flex-direction:column}.experience-showcase__card--image-top .experience-showcase__image-wrapper,.experience-showcase__card--image-top .experience-showcase__image-wrapper--phone-frame,.experience-showcase__card--image-top .experience-showcase__image-wrapper--browser-frame{order:-1}.experience-showcase__cards--stacked .experience-showcase__trigger{cursor:default}.experience-showcase__cards--stacked .experience-showcase__toggle{display:none}.experience-showcase__cards--stacked .experience-showcase__content{height:auto!important;overflow:visible}.experience-showcase__cards--stacked .experience-showcase__card{border-left-width:var(--card-border-width, 1px)}.experience-showcase__cards--stacked .experience-showcase__card.is-expanded{border-left:var(--card-border-width, 1px) solid var(--card-border-color, #e0e0e0)}@media screen and (min-width:990px){.experience-showcase__heading{font-size:var(--header-font-size-desktop, 40px)}.experience-showcase__subheading{font-size:var(--subheader-font-size-desktop, 18px)}.experience-showcase__cards{display:none!important}.experience-showcase__tabs-wrapper{display:flex!important;gap:40px;align-items:flex-start;width:100%}.experience-showcase__tabs-wrapper--right{flex-direction:row-reverse}.experience-showcase__tabs-wrapper--right .experience-showcase__tab{border-left:none;border-right:3px solid transparent;text-align:right}.experience-showcase__tabs-wrapper--right .experience-showcase__tab.is-active{border-left-color:transparent;border-right-color:var(--tab-indicator-color, #1a1a1a)}.experience-showcase__tab-list{flex:0 0 var(--tab-list-width, 35%);max-width:var(--tab-list-width, 35%);min-width:250px;display:flex;flex-direction:column;gap:0;position:sticky;top:20px;align-self:flex-start}.experience-showcase__tab{display:block;width:100%;padding:20px 24px;background:transparent;border:none;border-left:3px solid transparent;cursor:pointer;text-align:left;opacity:var(--tab-inactive-opacity, .5);transition:opacity .3s ease,border-color .3s ease;position:relative}.experience-showcase__tab:hover{opacity:.8}.experience-showcase__tab.is-active{opacity:1;border-left-color:var(--tab-indicator-color, #1a1a1a)}.experience-showcase__tab-title{color:var(--title-color, #1a1a1a);font-size:var(--title-font-size-desktop, 20px);font-weight:var(--title-font-weight, 600);margin:0 0 4px;line-height:1.3}.experience-showcase__tab-preview{color:var(--preview-color, #888888);font-size:var(--preview-font-size-desktop, 15px);margin:0;line-height:1.4}.experience-showcase__tab-progress{position:absolute;bottom:0;left:0;height:2px;width:0;background:var(--tab-indicator-color, #1a1a1a);opacity:0;transition:none}.experience-showcase__tab-progress.is-animating{opacity:1;width:100%;animation:tabProgressFill var(--rotation-interval, 5s) linear forwards}@keyframes tabProgressFill{0%{width:0}to{width:100%}}.experience-showcase__tab-panels{flex:0 0 var(--tab-panel-width, 60%);max-width:var(--tab-panel-width, 60%);min-width:300px;position:relative;overflow:hidden;contain:content}.experience-showcase__tab-panel{position:absolute;top:0;left:0;width:100%;opacity:0;transform:translateY(8px);pointer-events:none;visibility:hidden;transition:opacity .4s ease,transform .4s ease,visibility 0s .4s;will-change:opacity,transform}.experience-showcase__tab-panel.is-active{position:relative;opacity:1;transform:translateY(0);pointer-events:auto;visibility:visible;transition:opacity .4s ease,transform .4s ease,visibility 0s 0s}.experience-showcase__panel-content{display:flex;flex-direction:column;gap:24px}.experience-showcase__panel-text{display:flex;flex-direction:column;gap:16px}.experience-showcase__panel-image{width:100%;height:var(--desktop-image-area-height, 400px);display:flex;align-items:center;justify-content:center;overflow:hidden}.experience-showcase__panel-image img{width:100%;height:100%;border-radius:var(--image-border-radius, 8px);display:block;object-fit:cover}.experience-showcase__panel-image a{display:block;width:100%;height:100%;transition:transform .3s ease}.experience-showcase__panel-image a:hover{transform:scale(1.02)}.experience-showcase__description{font-size:var(--description-font-size-desktop, 16px)}.experience-showcase__panel-image--phone-frame{background:radial-gradient(ellipse at center,rgba(0,0,0,.06) 0%,rgba(0,0,0,.02) 70%,transparent 100%);border-radius:var(--image-border-radius, 8px);padding:2rem 0;position:relative}.experience-showcase__panel-image--phone-frame:after{content:"";position:absolute;bottom:1.5rem;left:50%;transform:translate(-50%);width:140px;height:12px;background:radial-gradient(ellipse,rgba(0,0,0,.12) 0%,transparent 70%);border-radius:50%}.experience-showcase__panel-image--phone-frame .experience-showcase__phone-frame{max-width:260px;position:relative;z-index:1}.experience-showcase__panel-image--browser-frame{background:transparent;border-radius:0;overflow:visible;height:auto}.experience-showcase__panel-image--browser-frame .experience-showcase__browser-frame{width:100%}.experience-showcase__panel-image--browser-frame .experience-showcase__browser-screen img{max-height:var(--desktop-image-area-height, 400px)}}@media screen and (min-width:1200px){.experience-showcase__container{padding:0 40px}.experience-showcase__tabs-wrapper{gap:60px}.experience-showcase__tab{padding:24px 28px}}.experience-showcase__trigger:focus-visible{outline:2px solid var(--title-color, #1a1a1a);outline-offset:2px}.experience-showcase__tab:focus-visible{outline:2px solid var(--title-color, #1a1a1a);outline-offset:2px}.experience-showcase__cta:focus-visible{outline:2px solid var(--link-color, #0066cc);outline-offset:2px}@media(prefers-reduced-motion:reduce){.experience-showcase__content,.experience-showcase__toggle,.experience-showcase__tab,.experience-showcase__tab-panel,.experience-showcase__cta--text svg,.experience-showcase__panel-image a,.experience-showcase__tab-progress{transition:none}.experience-showcase__tab-panel.is-active{animation:none}.experience-showcase__tab-progress.is-animating{animation:none;width:100%}}
/*# sourceMappingURL=/cdn/shop/t/48/assets/section-experience-showcase.css.map */
