.my-intro-4-v1{--intro4-gap: 16px;--intro4-expand: 2;display:flex;gap:var(--intro4-gap);width:100%;list-style:none;margin:0;padding:0;aspect-ratio:calc((var(--intro4-cols, 4)*296 + (var(--intro4-cols, 4) - 1)*16)/473)}.my-intro-4-v1 .my-intro-4-v1__item{container-type:size;position:relative;flex:1 1 0;min-width:0;height:100%;border-radius:24px;overflow:hidden;cursor:pointer;transition:flex-grow .3s ease,flex-basis .3s ease}.my-intro-4-v1 .my-intro-4-v1__cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .3s ease}.my-intro-4-v1 .my-intro-4-v1__scrim{position:absolute;left:0;bottom:0;width:100%;height:32.3%;background:linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);pointer-events:none;transition:opacity .3s ease;z-index:1}.my-intro-4-v1 .my-intro-4-v1__panel{position:absolute;inset:0;background:linear-gradient(135deg, var(--intro4-bg-from, #902bd3), var(--intro4-bg-to, #cb44c0));opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:1}.my-intro-4-v1 .my-intro-4-v1__desc{flex:1 1 0;min-width:0;margin:0;color:#fff;font-size:15px;line-height:1.25;overflow-y:auto}.my-intro-4-v1 .my-intro-4-v1__desc::-webkit-scrollbar{display:none}@media screen and (max-width: 880px){.my-intro-4-v1 .my-intro-4-v1__desc{font-size:12px}}.my-intro-4-v1 .my-intro-4-v1__thumb{flex:none;width:37%;align-self:stretch;overflow:hidden}.my-intro-4-v1 .my-intro-4-v1__thumb img{display:block;width:100%;max-height:100%;object-fit:cover;border-radius:24px}@media screen and (max-width: 880px){.my-intro-4-v1 .my-intro-4-v1__thumb{width:98px}.my-intro-4-v1 .my-intro-4-v1__thumb img{border-radius:14px}}.my-intro-4-v1 .my-intro-4-v1__body{position:absolute;inset:24px;display:flex;flex-direction:column;justify-content:flex-end;z-index:2}@media screen and (max-width: 880px){.my-intro-4-v1 .my-intro-4-v1__body{inset:12px}}.my-intro-4-v1 .my-intro-4-v1__title{flex:none;margin:0;color:#fff;font-size:24px;font-weight:500;line-height:1.2}@media screen and (max-width: 880px){.my-intro-4-v1 .my-intro-4-v1__title{font-size:16px}}.my-intro-4-v1 .my-intro-4-v1__row{display:none;margin-top:12px;flex:1 1 0;min-height:0;gap:16px}@media screen and (max-width: 880px){.my-intro-4-v1 .my-intro-4-v1__row{margin-top:8px;gap:10px}}.my-intro-4-v1 .my-intro-4-v1__btn{position:absolute;right:24px;bottom:24px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:hsla(0,0%,100%,.15);border:2px solid #fff;opacity:0;pointer-events:none;transition:opacity .3s ease,background-color .3s ease;z-index:3}@media screen and (max-width: 880px){.my-intro-4-v1 .my-intro-4-v1__btn{right:12px;bottom:12px;width:30px;height:30px}}.my-intro-4-v1 .my-intro-4-v1__btn-arrow{width:20px;height:20px;color:#fff;transition:opacity .2s ease}@media screen and (max-width: 880px){.my-intro-4-v1 .my-intro-4-v1__btn-arrow{width:12px;height:12px}}.my-intro-4-v1 .my-intro-4-v1__btn::before{content:"";position:absolute;inset:0;border-radius:50%;background:#fff;opacity:0;transition:opacity .2s ease;-webkit-mask:linear-gradient(#000, #000),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M12 2 1 13' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M6 1H12C12.47 1 12.71 1 12.85 1.15 13 1.29 13 1.53 13 2V8' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px 20px no-repeat;-webkit-mask-composite:xor;mask:linear-gradient(#000, #000),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M12 2 1 13' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M6 1H12C12.47 1 12.71 1 12.85 1.15 13 1.29 13 1.53 13 2V8' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px 20px no-repeat;mask-composite:exclude}@media screen and (max-width: 880px){.my-intro-4-v1 .my-intro-4-v1__btn::before{-webkit-mask:linear-gradient(#000, #000),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M12 2 1 13' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M6 1H12C12.47 1 12.71 1 12.85 1.15 13 1.29 13 1.53 13 2V8' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px 12px no-repeat;mask:linear-gradient(#000, #000),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M12 2 1 13' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M6 1H12C12.47 1 12.71 1 12.85 1.15 13 1.29 13 1.53 13 2V8' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px 12px no-repeat}}@media(hover: hover){.my-intro-4-v1 .my-intro-4-v1__btn:hover{background:rgba(0,0,0,0)}.my-intro-4-v1 .my-intro-4-v1__btn:hover::before{opacity:1}.my-intro-4-v1 .my-intro-4-v1__btn:hover .my-intro-4-v1__btn-arrow{opacity:0}}.my-intro-4-v1 .my-intro-4-v1__item[s-active]{flex-grow:var(--intro4-expand)}.my-intro-4-v1 .my-intro-4-v1__item[s-active] .my-intro-4-v1__cover,.my-intro-4-v1 .my-intro-4-v1__item[s-active] .my-intro-4-v1__scrim{opacity:0}.my-intro-4-v1 .my-intro-4-v1__item[s-active] .my-intro-4-v1__panel{opacity:1}.my-intro-4-v1 .my-intro-4-v1__item[s-active] .my-intro-4-v1__body{justify-content:flex-start}.my-intro-4-v1 .my-intro-4-v1__item[s-active] .my-intro-4-v1__row{display:flex}.my-intro-4-v1 .my-intro-4-v1__item[s-active] .my-intro-4-v1__btn{opacity:1;pointer-events:auto}@media screen and (max-width: 880px){.my-intro-4-v1{--intro4-gap: 8px;--intro4-mh: 245px;flex-wrap:nowrap;aspect-ratio:auto;height:var(--intro4-mh);overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}.my-intro-4-v1 .my-intro-4-v1__item{flex:0 0 calc(var(--intro4-mh)*296/473);height:100%;border-radius:16px}.my-intro-4-v1 .my-intro-4-v1__item[s-active]{flex:0 0 325px}}