/*
Theme Name: Freelance Portfolio
Theme URI: https://www.titanthemes.net/products/free-portfolio-wordpress-theme
Author: Titan Themes
Author URI: https://www.titanthemes.net/
Description: The Freelance Portfolio theme is a versatile and dynamic solution for showcasing work in an elegant and professional manner, designed for freelancers, artists, designers, photographers, content creators, illustrators, architects, videographers, writers, developers, marketers, and creative professionals. This theme provides the perfect platform to build a creative portfolio website, personal portfolio, or digital portfolio that highlights skills, achievements, and projects. Whether you’re showcasing graphic design projects, photography collections, branding portfolios, fashion portfolios, art portfolios, web design projects, makeup artistry, or creative writing, the theme ensures your work is presented in a visually stunning and organized layout. With responsive portfolio design, customizable portfolio templates, portfolio galleries, and interactive elements, it allows users to create unique presentations for personal branding portfolios, resume portfolios, and professional portfolios. Minimalist layouts, clean typography, and animated sections enhance visual appeal, while portfolio management tools simplify organization. The theme also includes a blog section for tutorials, case studies, or insights, and integrates seamlessly with the Contact Form 7 plugin for client communication, lead generation, and collaboration opportunities. Ideal for building a strong online presence, it supports creatives in personal brand growth, client acquisition, and professional recognition across industries.
Requires at least: 6.1
Tested up to: 6.8
Requires PHP: 7.2
Version: 2.5
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/old-licenses/gpl-2.0.html
Text Domain: freelance-portfolio
Tags: grid-layout, one-column,  two-columns, left-sidebar, right-sidebar, wide-blocks, block-patterns, custom-background, custom-colors, custom-menu, custom-logo, editor-style, block-styles, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, style-variations, theme-options, threaded-comments, translation-ready,, blog, photography, e-commerce
*/

.menu-box{
  margin-top: 0 !important;
  padding: 12px 0;
}
.wp-site-blocks{
	padding: 0 !important;
}
.product-main img {
  width: 100%;
}
.banner-main{
  position: relative;
}
.slider-banner {
  gap: 40px;
}
.home .main-header {
  position: absolute;
  width: 100%;
  z-index: 2;
  background: transparent !important;
}
.slide-img {
  position: absolute;
  right: 0px;
  bottom: 6%;
}
.slider-img img{
  width: 100%;
  height: 575px;
}
.counter-box {
  border-radius: 10px;
}
.is-head-menu li a:hover {
  text-decoration: none;
}
.is-head-menu li a:hover:after {
  content: "";
  width: 45px;
  height: 2px;
  background: var(--wp--preset--gradient--primary-gradient) !important;
  position: absolute;
  top: -31px;
  left: 0px;
}
.counter-box {
  position: relative;
  z-index: 1;
  transition: 0.3s ease-in-out;
}
.theme-btn a{
  position: relative;
  z-index: 1;
  transition: 0.3s ease-in-out;
}
.theme-btn a:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 3px; /* Border width */
  background: var(--wp--preset--gradient--primary-gradient) !important;
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out; /* For Safari */
  mask-composite: exclude; /* For other browsers */
  z-index: -1;
}
.counter-box:hover::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 10px; /* Match the border-radius */
  padding: 3px; /* Border width */
  background: var(--wp--preset--gradient--primary-gradient) !important;
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out; /* For Safari */
  mask-composite: exclude; /* For other browsers */
  z-index: -1;
}
.slider-banner{
  gap:0px !important;
}
.counter-box:hover {
  background: transparent; /* Transparent to show the gradient border */
}
.counter-box h3 ,.is-head-menu li a:hover span{
  background: var(--wp--preset--gradient--primary-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  display: inline-block;
}
.counter-box:hover h3{
  color: #fff !important;
  -webkit-text-fill-color:#fff;
  background: transparent !important;
}
.slider-short-heading {
  position: absolute;
  bottom: 0px;
  left: 10%;
  text-align: center;
  opacity: 20%;
}
.counter-box{
  text-align: center;
}
.counter-box:hover h3{
  color: #fff !important;
}
.slider-content {
  padding-left: 45px;
}
.slide-img img.wp-image-66 {
  z-index: 1;
  position: relative;
}
.slide-img {
  position: absolute;
  right: -45px;
  z-index: 2;
  bottom: 6%;
}
.short-heading {
  display: inline-block;
}
footer.wp-block-template-part {
  margin-top: 0;
}
@media screen and (max-width: 375px) {
  .main-header .wp-block-columns.is-layout-flex.wp-container-core-columns-is-layout-1.wp-block-columns-is-layout-flex{
    max-width: 100%;
  }
}

@media screen and (min-width: 320px) and (max-width: 600px) {
  .main-header nav span {
    color: #000;
  }
}
@media screen and (max-width: 781px) {
  .slide-img {
    left: 0px;
    right: 0px;
    position: relative;
  }
  .banner-content{
    justify-content: center !important;
    min-height: 300px !important;
    padding: 0px 20px !important;
    text-align: center !important;
  }
  .slider-short-heading {
    position: relative;
    bottom: 0px;
    left: 0px;
    text-align: center;
    opacity: 100%;
  }
}

@media screen and (min-width: 320px) and (max-width: 800px) {
	.header-area .wp-container-core-buttons-layout-1.wp-container-core-buttons-layout-1 {
		justify-content: center;
	}
  .home .main-header{
    position: relative;
    background: #191919 !important;
  }
  .single-image figure{
    width: 100% !important;
  }
  .main-header{
    text-align: center;
  }
  .slide-btn{
    justify-content: center !important;
  }
  .about-text-box,.about-image-box {
    text-align: center;
  }
  .product-main {
    max-width: 90% !important;
  }
  .slider-banner{
    text-align: center;
  }
  .main-header nav{
    justify-content: center !important;
  }
  .banner-content h2 {
    text-align: center !important;
    font-size: 21px !important;
  }
  
  .about-right {
    text-align: center;
    padding: 0px 10px
  }
  .logo-box {
    justify-content: center;
    display: flex;
  }
  .menu-box {
    justify-content: center;
    display: flex;
  }
  .slider-content {
    padding: 20px 14px;
  }
  .admin-bar .wp-block-navigation__responsive-container-close {
    color: #000;
    top:15px;
  }
  .slider-banner {
    gap: 20px;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container{
    justify-content: center !important;
  }
  .slider-content{
    text-align: center;
  }
	.homepage-header{
    position: static;
    width: 100%;
    text-align: center;
  	}
	.homepage-header .wp-header-search-social{
		justify-content: center;
	}
}
@media screen and (min-width: 782px) and (max-width: 800px) {
  .slide-img img {
        width: 60%;
    }
}
@media screen and (min-width: 702px) and (max-width: 800px) {
  .slider-short-heading {
    font-size: 45px !important;
  }
  .slide-img {
    right: -79px;
    bottom: 14%;
  }
  .banner-content{
    min-height: 500px !important;
  }
  .slider-img img{
    height: 500px;
  }
}
@media screen and (min-width: 801px) and (max-width: 1020px) {
  .home .main-header {
    position: relative;
    background: #191919 !important;
  }
  .slider-img img {
    height: 500px;
  }
  .slide-img {
    bottom: 15%;
  }
  .footer-widgets{
    max-width: 90% !important;
  }
  .product-main{
    max-width: 90% !important;
  }
  .banner-content h2{
    font-size: 26px !important;
  }
  .banner-content {
    padding: 0px 70px !important;
  }
  .banner-main{
    flex-basis: 50% !important;
  }
  .slider-img img{
    height: 500px !important;
  }
  .banner-content{
    min-height: 500px !important;
  }
  .logo-box{
    flex-basis: 30% !important;
  }
  .menu-box{
    flex-basis: 70% !important;
  }
  .header-box{
    gap:10px !important;
  }
  .empty-box{
    flex-basis: 0% !important;
  }
}
@media screen and (min-width: 1021px) and (max-width: 1200px) {
  .slider-img img{
    height: 500px;
  }
  .product-main{
    max-width: 80% !important;
  }
  .banner-content{
    min-height: 500px !important;
  }
  .slide-img{
    bottom: 15%;
  }
}
@media screen and (min-width: 782px) and (max-width: 1520px) {
  .counter-box {
    padding-right: 10px !important;
    padding-left: 10px !important;
  }
  .product-main{
    max-width: 80% !important;
  }
  .slide-img {
    bottom: 15%;
  }
  .counter-box h3 {
    font-size: 30px !important;
    line-height: 40px;
  }
  .about-right h3{

  }
}

.wc-block-mini-cart.wp-block-woocommerce-mini-cart,.wp-block-woocommerce-customer-account {
    display: none;
}

/*back to top*/
.wp-block-button.scroll-to-top .wp-block-button__link.wp-element-button {
  width: 40px;
  height: 40px;
  position: fixed;
  right: 25px;
  bottom: 25px;
  display: inline-block;
  z-index: 1;
  text-indent: -5000px;
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.089);
  display: none;
  padding: 0;
  margin-top: 0;
}

.wp-block-button.scroll-to-top .wp-block-button__link.wp-element-button:after {
  content: "";
  width: 40px;
  height: 40px;
  background-color: #fff;
  -webkit-mask-image: url(assets/images/up-arrow.svg);
  mask-image: url(assets/images/up-arrow.svg);
  mask-repeat: no-repeat;
  mask-position: center center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  position: absolute;
  display: inline-block;
  left: 0;
  top: 0;
}

/* Blog Section */
.news-section .news-box .wp-block-post-excerpt__excerpt{
  color: #000000;
}
.news-heading-box .news-small-title{
  width: max-content;
}
.news-section .news-heading-box{
  gap: 0;
}
.news-section .news-box .wp-block-post:hover .wp-block-post-title a{
  color: var(--wp--preset--color--primary);
}
.news-section .news-heading-box{
  gap: 0;
}
.recent-btn a {
  background: var(--wp--preset--color--primary);
  padding: 10px 12px;
  border-radius: 5px;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
}
.recent-btn a:hover{
  background: #000;
}