/* Global */

h1, .entry-title, .footer-subscribe h3, .widget_categories ul li, .widget_recent_entries ul li a, .widget_pages ul li, .widget_nav_menu ul li, .widget_archive ul li, .widget_most_recommended_posts ul li a, .widget_calendar table caption, .tptn_title, .nav-single a, .widget_recent_comments ul li, .widget_product_categories ul li, .widget_meta ul li, .widget_rss ul a.rsswidget {
  font-family: 'Plus Jakarta Sans';
}

/* Right Icons */
.aside-sidebar-studio-inizio {
    padding: 1rem 0;
}

.sticky-contact-icons {
    position: fixed;
    top: 150px;
    right: 0;
    z-index: 9999;
    cursor: pointer;
    transition: all ease .3s;
    padding: 1rem 0;
}

.aside-sidebar-studio-inizio .side-content{
    overflow: hidden;
    border-radius: 25px 0 0 25px;
}

.aside-sidebar-studio-inizio .side-content li {
    position: relative;
    right: 0;
    display: block;
    margin: 4px 0;
    margin-left: auto;
    padding: 10px;
    width: 65px;
    border-radius: 50px 0 0 50px;
    background: #000;
    cursor: pointer;
    -webkit-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s;
}

.aside-sidebar-studio-inizio .side-content li .iconBox {
    position: relative;
    display: block;
    padding-left: 55px;
    height: 45px;
    line-height: 45px;
}

.aside-sidebar-studio-inizio .side-content .iconBox>svg {
    position: absolute;
    top: 0;
    left: 0;
    padding: 10px;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: #fff;
    fill: #000;
}

.aside-sidebar-studio-inizio .side-content .iconBox .icon-label {
    margin: 2px 0;
    color: #fff;
    font-size: 1rem;
}

.aside-sidebar-studio-inizio .side-content li:hover{
    width: 150px;
}

/* Form submit buttons */
.studio-contact-submit-btn,
.submit-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
}

.spinner {
  font-size: 1em;
  display: inline-block;
}




/* Header section */

/* Main menu container */
.project-menu-container {
position: relative;
}

/* Styling for the main menu item */
.project-menu-item {
position: relative;
cursor: pointer;
background: #fff;
border-radius: 8px;
z-index: 10;
}

/* Submenu container */
.project-submenu-container {
position: absolute;
top: 70px; 
left: -50%;
background: #fff;
border-radius: 8px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
display: none;
width: 300px;
z-index: 1000; 
overflow: hidden;
/* padding: 0 10px; */
}

.project-submenu-container a{
width: 100%;
padding: 0 !important;
margin: 0 !important;
color: #555;
border-bottom: 1px solid #f0f0f0 !important;
cursor: pointer;
transition: color 0.3s, background-color 0.3s;
line-height: 50px !important;
line-height: 0;
}

.project-submenu-container a:hover {
color: #000;
background-color: #f9f9f9;
}

.project-submenu-container a span.link-text{
background-color: #fff !important;
background: #fff !important;
}

.project-submenu-container a:hover span.link-text{
background-color: #f9f9f9 !important;
background: #f9f9f9 !important;
}


.qodef-m-title {
  font-size: 70px !important;
}

.faqs-section .qodef-qi-animated-text, .recent-projects-section .qodef-qi-animated-text, .process-section .qodef-qi-animated-text{
  text-align: left !important;
}

/* Hero Slider */

.elementor-12885 .elementor-element.elementor-element-285d89a .bdt-omatic-slider .bdt-title{
  line-height: 6rem !important;
}

.bdt-navigation-wrap {
  display: none !important;
}



/* Style pagination dots */
.swiper-pagination-bullet {
  background: #ffffff !important;
  opacity: 0.6 !important;
  width: 15px !important;
  height: 15px !important;
  margin: 0 4px;
  transition: 0.3s;
  z-index: 999999;
  cursor: pointer;
}

.swiper-pagination-bullet-active {
  background: #ffffff !important;
  opacity: 1 !important;
}


.bdt-omatic-slider .swiper-carousel {
  margin: 0 !important;
}

.main-title{
  font-size: 2rem;
  font-weight: 500;
  line-height: 2.5rem;
  width: 80%;
  margin: auto;
}

.title-bold{
  font-weight: 700;
}

/* About us Section */

.studio_about{
  background-color: #000;
  color: #fff !important;
  font-size: 1.5rem !important;
  padding: 15px 10px;
  text-transform: capitalize !important;
}

/* .elementor-heading-title{
  font-size: 1.3rem !important;
} */

.studio_about_title{
  font-size: 3.5rem !important;
  margin-bottom: 5px;
  /* text-align: center; */
}

/* .elementor-12885 .elementor-element.elementor-element-e60c924 .elementor-heading-title
{
    text-align: left !important;
}
*/

/* 

.studio_about_subtitle{
  text-align: center;
}

*/

.elementor-12885 .elementor-element.elementor-element-4ec1903 {
--padding-bottom: 50px !important; 
}

/* Service Section */
.elementor-12885 .elementor-element.elementor-element-90417f2 {
--padding-top: 0 !important;
--padding-bottom: 50px !important;
}

.elementor-12885 .elementor-element.elementor-element-f4e6530 .qodef-m-items {
  padding: 10% 3% 10% 4% !important;
}

.elementor-12885 .elementor-element.elementor-element-4ced66a {
 --margin-top: 50px !important; 
}

/* FAQ */
.faqs-section {
  padding: 50px 0;
}

.faq-container {
  display: flex;
  justify-content: space-between;
  margin: 50px;
  max-width: 1200px;
  margin: 0 auto;
  gap: 80px;
}

.faq-left {
  width: 50%;
}

.faq-right {
  width: 50%;
}

.elementor-12885 .elementor-element.elementor-element-3fe2dda .qodef-qi-button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: fit-content;
  gap: 10px;
}

.subtitle {
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  color: #00000073;
  margin-bottom: 10px;
  gap: 10px;
}

.subtitle-divider {
  height: 2px;
  width: 30px;
  background-color: #00000073;
}


.faq-item {
  border-bottom: 1px solid #ccc;
  padding: 15px 0;
  width: 100%;
}

.faq-question {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  font-size: 18px;
  font-weight: 600;
  width: 100%;
  font-weight: 600;
}

.faq-answer {
  width: 100%;
  display: none;
  padding: 10px 0;
  font-size: 16px;
  color: #555;
  width: 100%;
}

.faq-item.active .faq-answer {
  display: block;
}

.faq-item i {
  font-size: 18px;
}

.faq-item.active i {
  content: "\f078";
}

.faq-item i.fa-chevron-up {
  content: "\f077";
}

/* projects */

.recent-projects-section {
  padding: 50px 0;
  background-color: #F5EFE6;
  margin: auto;
  width: 100%;
}

.recent-projects-section .max-width{
  width: 1180px;
  margin: auto;
}

.main-heading {
  font-size: 30px;
  color: #222;
  margin-bottom: 40px;
  font-weight: bold;
}

/* Tabs Navigation */
.tabs {
  display: flex;
  justify-content: left;
  margin: 30px 0;
}

.tab-link {
  background-color: #fff;
  border: none;
  padding: 10px 20px;
  margin: 0 5px;
  cursor: pointer;
  font-size: 16px;
  color: #333;
  border-radius: 20px;
  transition: background-color 0.3s;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  text-transform: capitalize;
}

.tab-link:hover {
  background-color: #000;
  color: #fff;
}

.tab-link.active {
  background-color: #000;
  color: #fff;
}

/* Projects Grid */
.projects-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  justify-content: center;
}

.project-item {
  background-color: #fff;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  text-align: center;
  overflow: hidden;
}

.projects-grid .project-item .img-zoom {
  height: 500px !important;
  border-radius: 10px;
  overflow: hidden;
}

.project-item .img-zoom img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
  cursor: pointer;
}

.project-item:hover img {
  transform: scale(1.08);
}

.project-item h3 {
  margin-top: 20px;
  font-size: 20px;
  font-weight: 700;
  color: #222;
}

.recent-projects-section .elementor-element.elementor-element-a51d9a8.elementor-widget__width-auto.elementor-widget.elementor-widget-qi_addons_for_elementor_button {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.recent-projects-section .projects-grid .studio-project-title a {
color: #000 !important;
}

.recent-projects-section .projects-grid .studio-project-title a:hover {
color: #c60035 !important;
}

.elementor-12885 .elementor-element.elementor-element-a51d9a8 .qodef-qi-button:hover{
  color: #fff !important;
}

.elementor-12885 .elementor-element.elementor-element-a51d9a8 > .elementor-widget-container {
    margin: 0 !important;
}

.studio-project-button{
  margin-top: 30px;
}

.project-item .qodef-qi-button.qodef-size--small {
    padding: 5px 20px !important;
}


/* Process Section */
.process-section {
max-width: 1180px;
margin: auto;
display: flex;
justify-content: space-between;
text-align: center;
padding: 50px 0;
}

.process-section .process-heading{
width: 30%;
}

.process-section .process-content{
width: 50%;
display: flex;
flex-direction: column;
justify-content: center;
gap: 10px;
}

.process-section .process-content p.elementor-heading-title.elementor-size-default {
font-weight: 400 !important;
font-size: 18px !important;
}

.process-section .process-content .elementor-element.elementor-element-ed61e17.elementor-widget__width-auto.elementor-widget.elementor-widget-qi_addons_for_elementor_button{
display: flex !important;
justify-content: right !important;
}

.process-section .process-content .elementor-12885 .elementor-element.elementor-element-ed61e17 > .elementor-widget-container{
margin: 0 !important; 
}

.elementor-12885 .elementor-element.elementor-element-ed61e17.elementor-element {
--align-self: auto !important;
}

/* Steps Section */
.steps {
max-width: 1180px;
margin: auto;
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
margin-top: 50px;
}

.steps::before {
content: '';
position: absolute;
top: 55px;
left: 5%;
right: 5%;
height: 1px;
width: 80%;
margin: auto;
background: #000;
z-index: 0;
}

.step {
width: 22%;
text-align: center;
z-index: 1;
position: relative;
}

.step .circle {
width: 100px;
height: 100px;
background: #dbcabc;
border-radius: 50%;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}

.step .circle span {
position: absolute;
top: 0;
right: -5px;
background: #000;
color: #fff;
width: 28px;
height: 28px;
font-size: 14px;
font-weight: 700;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}

.step img {
width: 100px;
height: 70px !important;
object-fit: contain;
}

.step h3 {
margin-top: 20px;
font-size: 18px;
font-weight: 500;
}

.step p {
font-size: 14px;
color: #666;
margin-top: 10px;
line-height: 1.6;
}


/* Footer */

footer {
width: 1180px;
margin: 0 auto;
padding: 80px 0 50px 0;
}

.form-header {
margin-bottom: 50px;
display: flex;
justify-content: space-between;
}

.form-header h4 {
font-size: 14px;
color: #999;
text-transform: uppercase;
letter-spacing: 1px;
margin-bottom: 10px;
}

.form-header h1 {
font-size: 42px;
font-weight: 700;
margin-bottom: 10px;
line-height: 0;
}

.form-header p {
font-size: 16px;
font-weight: bold;
text-align: right;
color: #555;
line-height: 1.5;
}

/* Form Section */
.form {
margin: 80px 0 40px 0 !important;
}

.form .form-row{
display: flex;
gap: 15px;
margin-bottom: 15px;
}

.form input,
.form textarea {
width: 100%;
padding: 5px;
border: 1px solid #ddd;
font-size: 16px;
font-family: 'Poppins', sans-serif;
outline: none;
transition: all 0.3s ease;
border-left: 0;
border-right: 0;
border-top: 0;
}

.form textarea {
grid-column: span 4;
resize: none;
}

.form input:focus,
.form textarea:focus {
border-color: #333;
}

.form button {
grid-column: span 4;
padding: 15px;
font-size: 16px;
font-weight: 600;
color: #fff !important;
background-color: #000;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
}

.button.is-primary, .button.is-primary:after, html .elementor-button, .elementor-button.elementor-size-xs, .elementor-button.elementor-size-sm, .elementor-button.elementor-size-md, .elementor-button.elementor-size-lg, .elementor-button.elementor-size-xl, html .ekit-wid-con .elementskit-btn, html .ekit-wid-con .ekit_creative_button{
border-radius: 5px !important;
}

.form button:hover {
background-color: #444;
}

.footer-bottom{
display: flex;
justify-content: space-between;
}

/* Contact Info Section */
.contact-info {
margin-top: 50px;
}

.contact-info .contact-heading{
font-weight: 600;
}

.contact-info .address{
line-height: 25px;
}

.contact-info p {
font-size: 16px;
margin-bottom: 0;
}

.contact-info a {
color: red;
text-decoration: none;
}

.contact-info a:hover {
text-decoration: underline;
}

/* Footer Links */
.footer {
margin-top: 50px;
display: flex;
flex-direction: column;
align-items: end;
gap: 10px;
font-size: 14px;
}

.footer a {
color: #333;
font-weight: 600;
text-decoration: none;
}

.footer a:hover {
text-decoration: underline;
}


/* About Us page */
.about_us_small_heading{
font-size: 16px !important;
}

/* passion, Philosophy */
.elementor-12964 .elementor-element.elementor-element-f533972 .qodef-qi-typeout-text .qodef-m-text {
color: #000000;
font-size: 70px !important;
font-weight: 800;
letter-spacing: -0.04em;
}

.qodef-m-title .qodef-e-word {
font-size: 50px !important;
}

/* Team */

.elementor-12964 .elementor-element.elementor-element-174e196b {
--padding-top: 0 !important;
}

.team_name{
font-size: 19px !important;
}


/* end about us */

/* Service Page */

/* Hero Section */
.Studio-service-hero-section {
position: relative;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
color: white;
}

/* Overlay */
.Studio-service-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
}

/* Content Styling */
.Studio-service-hero-content {
position: relative;
padding: 20px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

.Studio-service-title {
font-size: 50px;
/* font-family: 'Playfair Display', serif; */
font-weight: 700;
line-height: 1.2;
color: #fff;
}

.Studio-service-sub-text {
font-size: 18px;
margin-top: 10px;
width: 60%;
text-align: center;
}

.Studio-service-highlight {
text-decoration: underline;
}

/* Buttons */
.Studio-service-buttons {
margin-top: 20px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 20px;
}

.Studio-service-btn {
text-decoration: none;
font-size: 16px;
font-weight: 600;
min-width: 250px;
min-height: 50px;
border-radius: 5px;
transition: all 0.3s ease;
}

.Studio-service-primary-btn {
background: #000000;
color: white;
display: flex;
justify-content: center;
align-items: center;
}

.Studio-service-primary-btn:hover {
background: #fff;
color: #000;
}

.Studio-service-secondary-btn {
background: white;
color: #000;
display: flex;
align-items: center;
justify-content: center;
width: fit-content;
}

.Studio-service-secondary-btn .Studio-service-icon {
margin-left: 8px;
}

.Studio-service-secondary-btn:hover {
background: #000;
color: #fff;
}

.Studio-service-icon {
  font-size: 30px !important;
  color: #000;
  margin-bottom: 0 !important; 
}

.Studio-service-secondary-btn:hover .Studio-service-icon{
  color: #fff;
}

/* Service steps */

/* first & third section */

/* Container */
.studio-service-first-container {
  width: 100%;
  max-width: 1180px;
  margin: auto; 
  padding: 50px 0 0 0;
  text-align: center;
}

/* Content Layout */
.studio-service-first-content {
  display: flex;
  align-items: center;
  gap: 40px;
}

/* Image */
.studio-service-first-image img {
  width: 500px;
  border-radius: 10px !important;
}

/* Text Section */
.studio-service-first-text {
  text-align: left;
  max-width: 500px;
  padding-left: 80px;
}

/* Step Number */
.studio-service-first-step {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: bold;
  font-size: 20px;
  padding-bottom: 30px;
}

.studio-service-first-step-number {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 35px;
  height: 35px;
  min-width: 35px;
  min-height: 35px;
  background: #000;
  color: white;
  font-size: 18px;
  font-weight: bold;
  border-radius: 50%;
}

.studio-service-first-step-title{
  line-height: 25px;
}

/* Paragraph */
.studio-service-first-text p {
  font-size: 16px;
  color: #444;
  line-height: 1.6;
}

/* Second section */

/* Container */
.studio-service-two-container {
  padding: 50px 0;
  margin: auto;
  text-align: left;
}

/* Step Section */
.studio-service-two-step {
  display: flex;
  justify-content: left;
  align-items: center;
  gap: 10px;
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 15px;
}

.studio-service-two-step-number {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 35px;
  height: 35px;
  background: #000;
  color: white;
  font-size: 18px;
  font-weight: bold;
  border-radius: 50%;
}

/* Step Title */
.studio-service-two-step-title {
  font-size: 20px;
  font-weight: bold;
}

/* Description */
.studio-service-two-description {
  font-size: 16px;
  color: #444;
  line-height: 1.6;
  margin-bottom: 50px;
}

/* Images Section */
.studio-service-two-images {
  display: flex;
  justify-content: center;
  gap: 15px;
  flex-wrap: wrap;
}

.studio-service-two-images img {
  max-height: 500px;
  object-fit: cover;
  object-position: bottom center;
  width: 100%;
  max-width: 320px;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}


/* Recieve section */

/* Main Container */

.studio-service-receive-parent-container{
  background-color: #f6f6f6;
}

.studio-service-receive-container {
  max-width: 1180px;
  margin: 50px auto;
  width: 100%;
  padding: 50px 0;
  text-align: center;
}

/* Title */
.studio-service-receive-title {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 30px;
}

/* Grid Layout */
.studio-service-receive-grid {
  display: flex;
  justify-content: center;
  align-items: start;
  flex-wrap: wrap;
  gap: 15px;
}

/* Grid Items */
.studio-service-receive-item {
  width: 18%;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
}

.studio-service-receive-item img {
  width: 100%;
  max-width: 170px !important;
  height: 170px !important;
  object-fit: cover;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.studio-service-receive-item p {
  font-size: 16px;
  color: #444;
  margin-top: 10px;
}

/* Fourth & Fifth steps section */
.studio-service-fourth-container, .studio-service-fifth-container{
  width: 100%;
  max-width: 1180px;
  margin: auto;
}

.studio-service-fifth-image{
  padding-top: 20px;
}

.studio-service-fifth-image img{
  max-height: 500px !important;
  width: 100%;
  object-fit: cover;
  border-radius: 10px !important;
}


/* Compare section */

.Studio-service-table-container {
width: 100%;
max-width: 1180px;
margin: auto;
overflow-x: auto; /* Enables horizontal scrolling */
-webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
border-radius: 10px;
margin-top: 20px;
}

/* Table Styling */
.Studio-service-comparison-table {
width: 100%;
min-width: 600px;
border-collapse: collapse;
background-color: white;
overflow: hidden;
border: none !important;
}

/* Header Styling */
.Studio-service-comparison-table thead tr {
background-color: #f5f5f5;
border-bottom: none !important;
}

/* Table Cells */
.Studio-service-comparison-table th:not(:first-child), 
.Studio-service-comparison-table td:not(:first-child) {
/* padding: 12px; */
text-align: center;
border: 1px solid #ddd;
border-top: 0;
border-right: 0;
white-space: nowrap; /* Prevents text from wrapping */
}

.Studio-service-comparison-table th:not(:last-child), 
.Studio-service-comparison-table td:not(:last-child) {
/* padding: 12px; */
text-align: center;
border: 1px solid #ddd;
border-top: 0;
border-left: 0;
white-space: nowrap; /* Prevents text from wrapping */
}

table{
margin: 0 !important;
background-color: transparent !important;
}

/* FontAwesome Icons */
.check-icon {
color: #000; /* Gold Check */
font-size: 18px;
}

.cross-icon {
color: #d9534f; /* Red Cross */
font-size: 18px;
}

/* Feaures section */

/* Overall Container */
.Studio-service-container {
width: 100%;
max-width: 1180px;
display: flex;
justify-content: space-between;
gap: 20px;
margin: 80px auto;
flex-wrap: wrap;
}

/* Service Box */
.Studio-service-box {
flex: 1;
min-width: 280px;
max-width: 350px;
padding: 20px;
text-align: center;
border: 1px solid #ddd; /* Light gray border */
border-radius: 10px;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
background: white;
}

/* Icon Styling */
.Studio-service-icon {
font-size: 40px;
color: #000; /* Gold color */
margin-bottom: 10px;
}

/* Headings */
.Studio-service-box h3 {
font-size: 20px;
color: #333;
margin-bottom: 10px;
font-weight: 600;
}

/* Description */
.Studio-service-box p {
font-size: 16px;
color: #666;
line-height: 1.5;
}

/* FAQs Section */

/* Accordion Container */
.studio-service-accordion {
width: 100%;
max-width: 1180px;
margin: 20px auto auto auto;
background: #fff;
border-radius: 8px;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

/* Accordion Item */
.studio-service-accordion-item {
border-bottom: 1px solid #ddd;
}

/* Accordion Button */
.studio-service-accordion-header {
width: 100%;
color: #322;
background: white;
border: none;
outline: none;
text-align: left;
padding: 15px 20px;
font-size: 18px;
font-weight: 600;
text-transform: capitalize;
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
transition: background 0.3s ease;
}

/* Hover Effect */
.studio-service-accordion-header:hover {
background: #f0f0f0;
}

/* Accordion Content (Initially Hidden) */
.studio-service-accordion-content {
display: none;
padding: 15px 20px;
font-size: 16px;
color: #444;
background: #fff;
}

/* Active Accordion */
.studio-service-accordion-item.active .studio-service-accordion-content {
display: block;
}

.studio-service-accordion-item.active .studio-service-accordion-header i {
transform: rotate(180deg);
}

/* Icon Styling */
.studio-service-accordion-header i {
transition: transform 0.3s ease;
}


/* End service page */

/* Project page */

/* Projects */
.site-main {
padding: 0 !important;
}

.project-section .subtitle {
justify-content: center;
margin-bottom: -20px;
}

.project-section .qodef-qi-animated-text, .process-section .qodef-qi-animated-text {
text-align: center !important;
}

/* projects & single project */

a.studio-project-btn{
  font-size: 18px;
  color: #000;
  transition: all 0.25s ease-in-out;
}

a.studio-project-btn:hover
{
    background-color: #000 !important;
    border-color: #000 !important;
}

a.studio-project-btn:hover .qodef-m-text {
    color: #fff;
}

a.studio-project-btn .qodef-m-icon{
  margin-left: 0 !important;
}

a.studio-project-btn:hover .qodef-m-icon {
    color: #fff;
}

a.studio-project-btn .qodef-m-icon svg {
  width: 28px;
  height: 28px;
}


/* Project Single Page */

.elementor-10456 .elementor-element.elementor-element-16ce3830{
--padding-top: 50px !important;
--padding-bottom: 0 !important;
}

.elementor-10456 .elementor-element.elementor-element-5a5eb2cf {
--padding-top: 40px !important;
--padding-bottom: 40px !important;
}


.elementor-10456 .elementor-element.elementor-element-7966ea08 {
--padding-bottom: 50px !important;
}

/* New Project Single page */

/* project overviw section */

.single-project-hero {
  padding: 50px 0;
  max-width: 1180px;
  margin: auto;
}
.single-project-hero .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.hero-text {
  max-width: 50%;
  padding: 0 50px 0 0;
}

span.qodef-e-word.commercial-heading {
    font-size: 48px !important;
}

.subtitle {
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  color: #668170;
  margin-bottom: 10px;
  gap: 10px;
}
.subtitle-divider {
  height: 2px;
  width: 30px;
  background-color: #668170;
}
.hero-text h1 {
  font-size: 48px;
  line-height: 2rem;
  color: #000;
  margin-bottom: 20px;
}

.qodef-m-title .sinlge-project-subheading{
  font-size: 30px !important;
  line-height: 20px !important;
}

.hero-text p {
  font-size: 17px;
  line-height: 24px;
  color: #000c;
  margin-bottom: 30px;
}

.elementor-heading-title.elementor-size-default.studio-project-2nd-para{
  margin-top: -20px;
}

.project-link a {
  text-decoration: underline !important;
}

.project-link a:hover{
  color: #c60035 !important;
}

.hero-buttons {
  display: flex;
  gap: 15px;
  margin-bottom: 30px;
}
.cta-button,
.more-project-button {
  font-family: "Jost", sans-serif;
  text-transform: capitalize;
  padding: 12px 33px;
  border: none;
  border-radius: 5px;
  font-size: 18px;
  font-weight: 500;
  color: #000000;
  cursor: pointer;
  transition: background-color 0.3s ease;
  background-color: transparent;
  border: 2px solid #111;
}

.cta-button a{
  color: #000;
}

.more-project-button a{
  color: #fff;
}

.cta-button:hover a{
  color: #fff;
}

.more-project-button:hover a{
  color: #000;
}

.cta-button:hover {
  background-color: #000;
  color: #fff;
}
.more-project-button {
  background-color: #000;
  border: 2px solid #000;
  color: #fff;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.more-project-button:hover {
  background-color: transparent;
  color: #000;
}
.hero-stats {
  display: flex;
  gap: 20px;
}
.stat-item {
  font-size: 16px;
  color: #333;
}
.divider {
  width: 1px;
  height: 50px;
  background-color: #ccc;
}
.hero-slider {
  max-width: 50%;
  position: relative;
}
.slider-container {
  width: 100%;
  overflow: hidden;
}
.slider-wrapper {
  display: flex;
  transition: transform 0.4s ease;
  will-change: transform;
}
.slider-card {
  flex: 0 0 100%;      /* always fills the entire width */
  max-width: 100%;
  box-sizing: border-box;
  background-color: #fff;
  border: 1px solid #668170;
  border-radius: 10px;
  padding: 10px;
  /* REMOVE margin-right! */
  text-align: center;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.slider-card .img-zoom {
  width: 100%;
  height: 300px;
  object-fit: cover;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
}

.slider-card img {
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  transition: transform 0.5s ease-in-out;
}
.slider-card .img-zoom:hover img {
  transform: scale(1.08);
}
.slider-card .card-content {
  display: flex;
  justify-content: space-between;
  align-items: start;
}
.slider-card .card-content h3 {
  padding: 10px 0;
  margin: 0;
}
.button-wrapper {
  padding-top: 10px;
}
.button-icon {
  background-color: #000;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.button-wrapper a {
  text-decoration: none;
  color: #fff;
}
.button-wrapper:hover .button-icon {
  background-color: #000;
}
.button-icon i.icon {
  transform: rotate(-45deg);
}
.slider-controls {
  position: absolute;
  bottom: -40px;
  display: flex;
  padding-left: 10px;
  gap: 10px;
}
.slider-controls button {
  background-color: #000;
  color: white;
  border: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  cursor: pointer;
}
.slider-controls button:hover {
  background-color: #000;
}

/* before and after section */

.before-after-section {
  border-top: 1px solid #d4d1d1;
  padding: 50px 0;
  text-align: center;
}

.before-after-section .max-width {
    width: 1180px;
    margin: auto;
}

.before-after-heading{
  margin-bottom: 20px;
}

img-comparison-slider {
  max-width: 90%;
  width: 100%;
  margin: 0 auto;
  --divider-width: 3px;
  --divider-color: #fff;
  --default-handle-width: 56px;
  --default-handle-color: #fff;
  --default-handle-opacity: 0.9;
  --label-background: rgba(32,32,32,0.85);
  --label-color: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 28px rgba(0,0,0,0.15);
  position: relative;
}

/* Overlay label styles using ::part(label) for both desktop and mobile */
img-comparison-slider::part(label) {
  font-family: 'Jost', 'Plus Jakarta Sans', sans-serif;
  font-size: 1.08rem;
  font-weight: 700;
  text-shadow: 0 2px 8px rgba(0,0,0,0.25);
  color: #fff !important;
  background: #e74c3c !important;  /* Change to your desired color, red here as emphasis */
  border-radius: 20px;
  padding: 7px 20px;
  position: absolute;
  bottom: 18px;
  left: 18px;
  letter-spacing: 1.2px;
  z-index: 2;
  opacity: 0.95;
  pointer-events: none;
}

img-comparison-slider::part(label-second) {
  left: unset;
  right: 18px;
  /* color: #fff !important; */
  background: #27ae60 !important; /* Use a different color for the 'After' label if desired */
}




/* Related projects */

.projects-grid.related-project-grid {
  padding-top: 20px !important;
}



/* Contact Page */

.elementor-12937 .elementor-element.elementor-element-f5c71a5 {
padding-bottom: 0 !important;
}

.studio-contact-header {
  background-image: url(./wp-content/uploads/assests/contact\ us.webp);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.studio-contact-header-content{
  height: 70vh;
  max-width: 1180px;
  margin: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.studio-contact-header-content h1 {
  color: #fff;
  font-size: 32px;
}

.studio-contact-header-content p {
  color: #fff;
  font-size: 18px;
  margin-top: -20px;
}

/* Second Section (Two Columns) */
.studio-contact-container {
  display: flex;
  max-width: 1180px;
  width: 100%;
  margin: 50px auto;
  gap: 30px;
  padding: 0;
}

/* Left Section (Next Steps) */
.studio-contact-info {
  width: 40%;
  padding-right: 20px;
}

.studio-contact-info .qodef-qi-animated-text .qodef-m-title {
  overflow: hidden;
  line-height: 3rem;
}

.studio-contact-info h2 {
  font-size: 24px;
  margin-bottom: 10px;
}

.studio-contact-info p {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 20px;
}

.studio-contact-info .studio-contact-info-desc{
  margin-bottom: 50px;
}

/* Steps Container */
.studio-contact-steps {
  position: relative;
}

/* Vertical Line (Perfectly Centered) */
.studio-contact-steps::before {
  content: "";
  position: absolute;
  left: 25px;
  top: 5px;
  width: 2px;
  height: 300px;
  background: #f75555;
}

/* Step Item */
.studio-contact-step {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  margin-bottom: 30px;
  position: relative;
}

/* Step Icon (Instead of Number) */
.studio-contact-step-icon {
  width: 60px; /* Adjust size as needed */
  height: 60px;
  min-width: 60px;
  min-height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: white; /* Background for better visibility */
  border: 2px solid #f75555;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 2;
}

.studio-contact-step-icon-3 img{
  min-width: 45px !important;
  min-height: 45px !important;
  width: 45px !important;
  height: 45px !important;
}

/* Step Icon Image */
.studio-contact-step-icon img {
  min-width: 50px;
  min-height: 50px;
  width: 50px;
  height: 50px;
  object-fit: contain;
}

/* Step Content */
.studio-contact-step-content h3 {
  margin: 0;
  font-size: 18px;
  font-weight: bold;
  color: #1d1d1d;
}

.studio-contact-step-content p {
  font-size: 15px;
  color: #666;
  margin-top: 5px;
  line-height: 1.5;
  font-weight: 400;
}



/* Right Section (Contact Form) */
.studio-contact-form {
  width: 60%;
  background: white;
  padding: 40px 40px 0 40px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  margin-top: -150px;
}

/* Form Header */
.studio-contact-form-header {
  display: flex;
  align-items: start;
  gap: 15px;
  margin-bottom: 30px;
}

.studio-contact-form-header img {
  width: 60px;
  height: 60px;
}

.studio-contact-form-header p {
  font-size: 18px;
}

/* Form Inputs */
.studio-contact-form-group {
  display: flex;
  gap: 10px;
  margin-bottom: 15px;
}

input,
textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 14px;
}

textarea {
  min-height: 100px;
  resize: none;
}

.studio-contact-form .input-text, textarea, select{
  font-size: 15px !important;
  border-radius: 5px !important;
}

.studio-contact-optional-label{
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 10px !important;
}

/* services option check box */

.studio-contact-services {
  margin-bottom: 25px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.studio-contact-services-label {
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 0;
  grid-column: span 2;
}

.studio-contact-services label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 14px;
  padding: 12px 15px;
  border: 1.5px solid #ccc;
  border-radius: 8px;
  background-color: #f9f9f9;
  cursor: pointer;
  transition: all 0.2s ease;
  user-select: none;
}

.studio-contact-services input[type="checkbox"] {
  accent-color: #1d1d1d; /* Customize checkbox color */
}

.studio-contact-services label:hover {
  border-color: #1d1d1d;
  background-color: #f1f5ff;
}

/* Hide by default */
.studio-contact-other-textarea {
  display: none;
  margin-top: -10px;
  animation: fadeIn 0.3s ease-in-out forwards;
}

/* Textarea styling */
.studio-contact-other-textarea textarea {
  width: 100%;
  padding: 10px;
  font-size: 14px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-family: inherit;
  resize: none;
  min-height: 100px;
}

/* Simple fade-in animation */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* File Upload */
/* .studio-contact-file-upload {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f8f9fb;
  border: 2px dashed #ccc;
  padding: 15px;
  text-align: center;
  margin-bottom: 20px;
  cursor: pointer;
} */

/* .studio-contact-file-upload img{
  width: 50px;
  height: 50px;
}

.studio-contact-file-upload p{
  margin: 0 !important;
  font-size: 18px;
} */

/* Submit Button */
button.studio-contact-submit-btn {
  width: 100%;
  background: linear-gradient(to right, #0c0c0c, #282829);
  color: #fff !important;
  border: none;
  padding: 12px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 5px;
}

button:hover {
  opacity: 0.9;
}

/* Footer */
.studio-contact-footer {
  font-size: 15px;
  text-align: center;
  margin-top: 15px;
}



/* Responsive Design */

/* large screen */
@media (min-width: 768px) {

/* Header */
/* Show submenu on hover */
.project-menu-item:hover .project-submenu-container {
display: flex;
flex-direction: column;
gap: 0;
}

.elementor-12885 .elementor-element.elementor-element-0a2cb0a {
    --content-width: 100% !important;
}

.site-main {
  padding: 0 !important;
}

.elementor-10456 .elementor-element.elementor-element-57900cf1 {
--content-width: 100% !important;
}

.hideOnLargeScreen{
display: none;
}

/* Home page */

/* Sliders */

.hideonlarge{
  display: none;
}

/* service section */

.elementor-12885 .elementor-element.elementor-element-f4e6530 .qodef-e-title{
    font-size: 40px !important;
}

/* Process  Section*/
.studio-process-container{
  padding-top: 50px;
}


/* Contact us */
.studio-contact-services {
  grid-template-columns: 1fr 1fr;
}

/* All projects page */

/* Tabs Navigation */
.studioAllProjects .tabs {
  justify-content: center !important;
}


/* project Single page */

span.qodef-e-word.commercial-heading {
    font-size: 48px !important;
}




}

/* mobile */
@media (max-width: 768px) {

/* Header */

.project-submenu-container {
  top: 50px;
  left: 0;
  width: 90%;
}

.project-submenu-container a{
  padding-left: 20px !important;
}

.qodef-m-title {
  font-size: 40px !important;
}

/* Slider */
.elementor-12885 .elementor-element.elementor-element-285d89a .bdt-omatic-slider .bdt-title{
  line-height: 3rem !important;
  font-size: 2.5rem !important;
}

.hideonphone{
  display: none;
}


/* about */

.main-title {
font-size: 1.4rem;
font-weight: 500;
line-height: 2rem;
width: 100%;
margin: auto;
}

.elementor-12885 .elementor-element.elementor-element-e60c924 .elementor-heading-title{
  text-align: center;
}

.elementor-12885 .elementor-element.elementor-element-f6ff315
{
--align-items: flex-center !important;
}

.studio_about {
font-size: 1.2rem !important;
}

.elementor-12885 .elementor-element.elementor-element-5fd07af .qodef-qi-animated-text .qodef-m-title {
font-size: 30px !important;
}

.elementor-12885 .elementor-element.elementor-element-3b63700 .elementor-heading-title
{
text-align: center !important;
}

.elementor-12885 .elementor-element.elementor-element-90f0243.elementor-element {
--align-self: center !important;
}

/* projects */

.recent-projects-section {
  margin: 0 !important;
  padding: 40px 20px;
}

.recent-projects-section .max-width {
  width: 100%;
  margin: 0;
}

.projects-grid {
grid-template-columns: repeat(1, 1fr);
}

.projects-grid .project-item .img-zoom {
height: 300px !important;
}

.tabs-wrapper {
overflow-x: auto;
display: flex;
-webkit-overflow-scrolling: touch;
scrollbar-width: none; 
}

.tabs-wrapper::-webkit-scrollbar {
display: none; 
}

.tabs {
display: flex;
gap: 10px;
width: max-content; 
}

.tab-link {
flex-shrink: 0;
white-space: nowrap; 
}


/* Faqs */

.faqs-section {
padding: 50px 20px;
width: 100%;
}

.faq-container {
flex-direction: column-reverse;
width: 100%;
margin: 0;
gap: 20px;
}

.faq-left, .faq-right {
width: 100%;
}


/* Process */

.process-section {
max-width: 100%;
margin: 0;
display: flex;
flex-direction: column;
justify-content: space-between;
text-align: center;
padding: 50px 20px;
}

.process-section .process-heading {
width: 100%;
}

.process-section .process-content {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
gap: 10px;
}

.elementor-12885 .elementor-element.elementor-element-855f032 .qodef-qi-animated-text {
text-align: center !important;
margin-top: 10px;
}

.process-section .process-content .elementor-element.elementor-element-ed61e17.elementor-widget__width-auto.elementor-widget.elementor-widget-qi_addons_for_elementor_button {
display: flex !important;
justify-content: center !important;
}

.steps {
width: 100%;
margin: 0;
flex-direction: column;
padding: 0 20px;
}

.step {
width: 100%;
}

.steps::before {
content: '';
position: absolute;
height: 0px;
}

/* footer */
footer {
width: 100%;
margin: 0;
padding: 80px 20px;
}

.form-header {
flex-direction: column;
margin-bottom: 10px;
}

.form-header h1 {
  line-height: 30px;
  margin: 0 0 20px 0;
  font-size: 30px;
  font-weight: 700;
}

.form-header p {
text-align: left;
}

.form .form-row {
flex-direction: column;
}  

.form {
  margin: 0 0 30px 0 !important;
  grid-template-columns: 1fr;
}

.footer-bottom {
 flex-direction: column;
}

.contact-info {
margin-top: 20px;
}

.contact-info .contact-heading {
font-size: 1.5rem;
}

.footer {
flex-direction: row;
flex-wrap: wrap;
}


/* about us */
.about_us_small_heading{
font-size: 16px !important;
}

.qodef-m-title .qodef-e-word {
font-size: 30px !important;
line-height: 2.3rem;
}

.elementor-12964 .elementor-element.elementor-element-f533972 .qodef-qi-typeout-text .qodef-m-text {
color: #000000;
font-size: 30px !important;
font-weight: 800;
letter-spacing: -0.04em;
}

.team_name{
font-size: 18px !important;
}

/* End about us */

/* Service page */

/* hero section */
.Studio-service-hero-section{
  height: 80vh;
  background: url('./wp-content/uploads/assests/After\ 2.jpg') no-repeat center center/cover;
}

#myVideo{
  display: none;
}


.Studio-service-title {
font-size: 30px;
}

.Studio-service-sub-text {
font-size: 16px;
width: 100%;
}

/* Service steps */

/* First section */

.studio-service-first-content {
  flex-direction: column-reverse;
  padding-left: 5%;
  padding-right: 5%;
}

.studio-service-first-container .elementor-element.elementor-element-0badb9a.elementor-widget.elementor-widget-qi_addons_for_elementor_animated_text.animated.fadeIn {
  padding-left: 5%;
  padding-right: 5%;
}

.studio-service-first-text {
  padding-left: 0;
}

.studio-service-first-step {
  justify-content: center;
  padding-bottom: 10px;
}

.studio-service-first-text p {
  text-align: center;
}

/* Second Section */

.studio-service-two-container{
  padding-left: 5%;
  padding-right: 5%;
}

.studio-service-two-step{
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.studio-service-two-description{
  text-align: center;
}

/* Recieve section */

.studio-service-receive-container {
  padding-left: 5%;
  padding-right: 5%;
}

.studio-service-receive-grid {
  flex-direction: column;
  align-items: center;
}

.studio-service-receive-item {
  width: 100%;
}

.studio-service-receive-item img {
  max-width: 120px;
}

/* Fourth steps section */
.studio-service-fourth-container, .studio-service-fifth-container{
  padding-left: 5%;
  padding-right: 5%;
}

.studio-service-fifth-image img{
  height: 100% !important;
}


/* Compare section */

.Studio-service-table-container {
overflow-x: auto;
}

/* features on service */

.Studio-service-container {
flex-direction: column;
align-items: center;
margin: 50px auto;
padding-left: 5%;
padding-right: 5%;
}

/* Faqs */
/* .elementor-12991 .elementor-element.elementor-element-011a5fa {
  --margin-top: 0 !important;
  --margin-bottom: 0 !important;
} */


/* End Service page */

/* Single project page */

.hideOnMobile{
display: none !important;
}

.elementor-10456 .elementor-element.elementor-element-2403b711 .elementor-divider {
padding-block-start: 25px !important;
}

.elementor-10456 .elementor-element.elementor-element-7f402dcd .qodef-e-text {
font-size: 16px;
padding: 20px 0px 0px 0px !important;
}

.qodef-qi-testimonials-slider.qodef-item-layout--side-with-image .qodef-e-content {
width: 95% !important;
}

.elementor-10456 .elementor-element.elementor-element-7966ea08 {
--padding-bottom: 0 !important;
}

/* New Single Project page*/


  /* Hero Section */

  /* .single-project-hero {
    padding: 40px 20px;
  } */

  .single-project-hero .container {
    flex-direction: column;
  }

  .hero-text {
    max-width: 100%;
    padding: 0;
  }

  .hero-text h1 {
    font-size: 2rem;
    line-height: 2rem;
  }

  .qodef-m-title .sinlge-project-subheading{
    font-size: 20px !important;
  }

  .hero-text p{
    margin-top: -10px;
  }

  .hero-stats {
    gap: 10px;
  }

  .stat-item {
    font-size: 15px;
  }

  .hero-slider {
    max-width: 100%;
  }

  .slider-wrapper {
    padding: 20px 0 1px 0;
  }

  .slider-card {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .slider-card .img-zoom {
    height: 180px;
}

/* left side buttons */

.cta-button,
.more-project-button {
  padding: 12px 20px;
}

/* Before after section */

.before-after-section {
  margin-top: 50px;
}

.before-after-section .max-width{
  width: 100%;
}


/* Contact page */

.studio-contact-header-content{
  height: 50vh;
  padding-left: 5%;
  padding-right: 5%;
  justify-content: start;
  padding-top: 70px;
}

.studio-contact-container {
  flex-direction: column-reverse;
  padding-left: 5%;
  padding-right: 5%;
}

.studio-contact-info, .studio-contact-form {
  width: 100%;
}

.studio-contact-container{
  margin: 50px auto auto auto;
}

.studio-contact-info .studio-contact-info-desc{
  margin-bottom: 30px;
}

.studio-contact-form-group {
  flex-direction: column;
}

.studio-contact-form{
  padding: 20px 20px 0 20px;
}

.studio-contact-form-header{
  flex-direction: column;
  margin-bottom: 10px;
}

.studio-contact-optional-label{
  margin-top: 10px !important;
}

.studio-contact-file-upload p{
  font-size: 16px;
}

}