.portfolio-info{background-color:#000;padding-block:80px 50px}.portfolio-info .content h2{color:#fff;width:100%;max-width:882px;margin-bottom:8px;font-size:48px;line-height:77px}.portfolio-info .content p{color:#fff;width:100%;max-width:790px;font-size:24px;font-weight:500;line-height:32px}@media (max-width:1200px){.portfolio-info{padding-bottom:40px}.portfolio-info .content p{font-size:20px;line-height:26px}}@media (max-width:992px){.portfolio-info{padding-block:55px 30px}.portfolio-info .content h2{font-size:45px;line-height:52px}.portfolio-info .content p{font-size:18px;line-height:24px}}@media (max-width:768px){.portfolio-info{padding-block:40px 20px}.portfolio-info .content h2{font-size:32px;line-height:36px}.portfolio-info .content p{font-size:14px;line-height:20px}}@media (max-width:576px){.portfolio-info{padding-top:25px}.portfolio-info .content h2{font-size:28px}}@media (max-width:480px){.portfolio-info .content h2{font-size:24px}}
.portfolio-tabs{background-color:#000;padding-bottom:80px}.portfolio-tabs .tabs{justify-content:start;align-items:center;gap:20px;margin-bottom:50px;display:flex}.portfolio-tabs .tabs button{font-size:20px;font-family:var(--ff-secondary);text-transform:capitalize;color:#cfcfcf;cursor:pointer;border:2px solid #cfcfcf;border-radius:50px;padding:14px 38px;font-weight:500;line-height:29px;transition:all .3s}.portfolio-tabs .tabs button:hover,.portfolio-tabs .tabs button.active{color:#000;background-color:#cfcfcf}.portfolio-tabs .wrapper{grid-template-columns:repeat(4,1fr);gap:17px;display:grid}.portfolio-tabs .wrapper>:first-child{grid-area:1/1/3/2;height:406px}.portfolio-tabs .wrapper>:nth-child(2){grid-area:1/2/3/3;height:406px}.portfolio-tabs .wrapper>:nth-child(3){grid-area:1/3/2/4;height:233px}.portfolio-tabs .wrapper>:nth-child(4){grid-area:1/4/2/5;height:233px}.portfolio-tabs .wrapper>:nth-child(5){grid-area:3/1/4/2;height:233px}.portfolio-tabs .wrapper>:nth-child(6){grid-area:3/2/4/3;height:233px}.portfolio-tabs .wrapper>:nth-child(7){grid-area:2/3/4/4;height:411px}.portfolio-tabs .wrapper>:nth-child(8){grid-area:2/4/4/5;height:411px}.portfolio-tabs .wrapper>:nth-child(9){grid-area:4/1/5/2;height:233px}.portfolio-tabs .wrapper>:nth-child(10){grid-area:4/2/5/3;height:233px}.portfolio-tabs .wrapper>:nth-child(11){grid-area:4/3/5/4;height:233px}.portfolio-tabs .wrapper>:nth-child(12){grid-area:4/4/5/5;height:233px}.portfolio-tabs .portfolio-box{z-index:1;border-radius:18px;position:relative;overflow:hidden}.portfolio-tabs .portfolio-box:after{content:"";background-color:#0000004d;width:100%;height:100%;position:absolute;top:0;left:0}.portfolio-tabs .portfolio-img{height:100%;position:relative;overflow:hidden}.portfolio-tabs .portfolio-img img,.portfolio-tabs .portfolio-img video,.portfolio-tabs .portfolio-img .portfolio-video-iframe{object-fit:cover;width:100%;height:100%;transition:all .3s ease-in}.portfolio-tabs .portfolio-img .portfolio-video-iframe{pointer-events:none;border:none;position:absolute;inset:0}.portfolio-tabs .portfolio-img video{display:block}.portfolio-tabs .portfolio-box:hover img{transform:scale(1.1)}.portfolio-tabs .text{color:#fff;z-index:1;position:absolute;bottom:25px;left:25px}.portfolio-tabs .text strong{font-size:22px;font-family:var(--ff-secondary);color:#fff;font-weight:700;line-height:31px;display:block}.portfolio-tabs .text span{color:#fff;line-height:29px}.portfolio-tabs .play-btn{z-index:1;cursor:pointer;background-color:#fff;border-radius:50%;justify-content:center;align-items:center;width:59px;height:59px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hero-modal{z-index:50;scrollbar-width:thin;background:#000000bf;justify-content:center;align-items:center;padding:30px 24px;display:flex;position:fixed;inset:0;overflow-y:auto}.hero-modal__content{aspect-ratio:16/9;background:#000;border-radius:18px;width:min(960px,100%);position:relative;overflow:hidden;box-shadow:0 28px 70px #00000080}.hero-modal iframe{border:none;width:100%;height:100%}.hero-modal__close{width:38px;height:38px;font:caption;color:#fff;cursor:pointer;z-index:10;pointer-events:auto;background:#0009;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:1.2rem;transition:background .2s;display:flex;position:absolute;top:12px;right:12px;font-size:24px!important}.hero-modal__close:hover{background:#000000d9}@media (max-width:1200px){.portfolio-tabs .tabs{gap:14px;margin-bottom:40px}.portfolio-tabs .tabs button{padding:12px 32px}.portfolio-tabs .text{bottom:15px;left:15px}.portfolio-tabs .text strong{font-size:20px;line-height:24px}.portfolio-tabs .text span{line-height:24px}}@media (max-width:992px){.portfolio-tabs{padding-bottom:55px}.portfolio-tabs .tabs{margin-bottom:30px}.portfolio-tabs .tabs button{padding:8px 26px;font-size:18px}.portfolio-tabs .wrapper{grid-template-columns:repeat(3,1fr)}.portfolio-tabs .play-btn{width:44px;height:44px}.portfolio-tabs .wrapper>*{grid-area:unset!important;height:auto!important}.portfolio-tabs .text strong{font-size:18px;line-height:22px}.portfolio-tabs .text span{font-size:14px;line-height:20px}}@media (max-width:768px){.portfolio-tabs{padding-bottom:40px}.portfolio-tabs .tabs{gap:10px;margin-bottom:20px}.portfolio-tabs .tabs button{padding:6px 22px;font-size:16px}.portfolio-tabs .wrapper{grid-template-columns:repeat(2,1fr)}.hero-modal{padding:12px}.hero-modal__content{border-radius:10px}}@media (max-width:576px){.portfolio-tabs{padding-bottom:25px}.portfolio-tabs .tabs button{padding:4px 18px;font-size:14px}.hero-modal__content{border-radius:5px}.hero-modal__close{width:25px;height:25px;font-size:18px!important}}@media (max-width:480px){.portfolio-tabs .tabs{white-space:nowrap;scrollbar-width:thin;gap:8px;overflow-x:auto}.portfolio-tabs .tabs button{padding:4px 14px}.portfolio-tabs .wrapper{gap:10px}}@media (max-width:420px){.portfolio-tabs .wrapper{grid-template-columns:1fr}}
