/*
Theme Name: Yekta-v2
Theme URI: https://wordpress.org/themes/twentyseventeen/
Author: Amir Mohammad
Author URI: https://amsanei.github.io/
Description: This is a wordpress Theme
Version: 1.0
License: GNU General Public License v1 or later
Text Domain: YektaBarOmid
Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/*==============
Css Indexing
=================
* Base Css
=================*/

/*==============
Base Css
================*/

@font-face {
    font-family: "XYekan";
    src: url(assets/fonts/XYekan.ttf);
  }
  @font-face {
    font-family: "BYekan";
    src: url(assets/fonts/BYekan.ttf);
  }
  @font-face {
    font-family: "lalezar";
    src: url(assets/fonts/lalezar.ttf);
  }
  @font-face {
    font-family: "shekasteh";
    src: url(assets/fonts/DimaShekasteh.ttf);
  }
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  
  body {
    width: 100%;
    height: 100vh;
    font-family: "XYekan", "BYekan";
    scroll-behavior: smooth;
    font-size: 18px;
    background-color: #efefef;
  }
  body ul {
    padding: 0;
    margin: 0;
  }
  body li {
    list-style: none;
  }
  body a {
    text-decoration: none;
    transition: all ease-in-out 0.4s;
  }
  
  .main-header {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
  }
  .main-header video {
    width: 100%;
    position: absolute;
  }
  .main-header .header-black-cover {
    width: 100%;
    height: 100vh;
    background-color: rgba(34, 34, 34, 0.6);
    z-index: 120;
    position: absolute;
  }
  .main-header .header-img {
    background: url(assets/images/02-top-content.jpg) no-repeat center center/cover;
    z-index: 110;
    position: absolute;
    width: 100%;
    height: 100%;
  }
  .main-header .top-menu {
    position: relative;
    z-index: 90000;
    width: 100%;
  }
  .main-header .top-menu .top-menu-navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 2.5rem;
    background-color: rgba(223, 223, 223, 0.6);
    padding: 0 1rem;
    border-radius: 1rem;
    box-shadow: 2px 6px 10px 1px rgba(34, 34, 34, 0.4);
  }
  .main-header .top-menu .top-menu-navbar .navbar-toggler {
    border: none;
    outline: none;
    transition: all linear 0.4s;
  }
  .main-header .top-menu .top-menu-navbar .navbar-toggler:focus {
    border: none;
    outline: none;
    box-shadow: none;
  }
  .main-header .top-menu .top-menu-navbar .navbar-toggler:focus-visible {
    transform: rotate(90deg);
  }
  .main-header .top-menu .top-menu-navbar .navbar-toggler .navbar-toggler-icon {
    color: rgba(239, 239, 239, 0.7) !important;
  }
  .main-header .top-menu .top-menu-navbar ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1.3rem;
  }
  .main-header .top-menu .top-menu-navbar ul li a {
    color: #efefef;
    display: inline-block;
  }
  .main-header .top-menu .top-menu-navbar ul li a:hover {
    color: #8a2be2;
    transform: translateY(-2px);
  }
  .main-header .top-menu .top-menu-navbar a {
    color: #efefef;
  }
  .main-header .top-menu .top-menu-navbar a i {
    vertical-align: -4px;
  }
  .main-header .top-menu .top-menu-navbar a:hover {
    color: #8a2be2;
  }
  .main-header .search-box-holder {
    position: relative;
    z-index: 900;
  }
  .main-header .search-box-holder .search-box-wrrap {
    background-color: rgba(223, 223, 223, 0.3);
    width: 450px;
    height: 3.3rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 2px 6px 10px 1px rgba(34, 34, 34, 0.2);
  }
  .main-header .search-box-holder .search-box-wrrap input {
    background-color: transparent;
    width: 88%;
    outline: none;
    border: none;
    box-shadow: none;
    padding: 0.75rem;
    color: #efefef;
  }
  .main-header .search-box-holder .search-box-wrrap input::placeholder {
    color: rgba(239, 239, 239, 0.7);
  }
  .main-header .search-box-holder .search-box-wrrap .btn-search {
    border: none;
    outline: none;
    height: 100%;
    width: 11%;
    background-color: rgba(228, 43, 18, 0.6);
    color: #efefef;
    font-weight: 600;
    transition: all linear 0.4s;
  }
  .main-header .search-box-holder .search-box-wrrap .btn-search i {
    vertical-align: -12px;
    transition: all linear 0.75s;
    display: inline-block;
  }
  .main-header .search-box-holder .search-box-wrrap .btn-search:hover {
    width: 12%;
    background-color: #f43118;
  }
  .main-header .search-box-holder .search-box-wrrap .btn-search:hover i {
    transform: translateX(3px);
  }
  .main-header .poet-holder {
    position: relative;
    z-index: 150;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 5.5rem;
  }
  .main-header .poet-holder .poet {
    color: #efefef;
    font-family: "shekasteh";
    font-size: 45px;
  }
  
  .main-header-content {
    width: 100%;
    height: 17%;
  }
  .main-header-content .top-menu-contact .top-menu-navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 2.5rem;
    background-color: rgba(34, 34, 34, 0.8);
    padding: 0 1rem;
    border-radius: 1rem;
    box-shadow: 2px 6px 10px 1px rgba(34, 34, 34, 0.4);
  }
  .main-header-content .top-menu-contact .top-menu-navbar .navbar-toggler {
    border: none;
    outline: none;
    transition: all linear 0.4s;
  }
  .main-header-content .top-menu-contact .top-menu-navbar .navbar-toggler:focus {
    border: none;
    outline: none;
    box-shadow: none;
  }
  .main-header-content .top-menu-contact .top-menu-navbar .navbar-toggler:focus-visible {
    transform: rotate(90deg);
  }
  .main-header-content .top-menu-contact .top-menu-navbar .navbar-toggler .navbar-toggler-icon {
    color: rgba(239, 239, 239, 0.7) !important;
  }
  .main-header-content .top-menu-contact .top-menu-navbar ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1.4rem;
  }
  .main-header-content .top-menu-contact .top-menu-navbar ul li a {
    color: #efefef;
    display: inline-block;
  }
  .main-header-content .top-menu-contact .top-menu-navbar ul li a:hover {
    color: #f43118;
    transform: translateY(-2px);
  }
  .main-header-content .top-menu-contact .top-menu-navbar a {
    color: #efefef;
    padding: 1rem 0;
  }
  .main-header-content .top-menu-contact .top-menu-navbar a i {
    vertical-align: -4px;
  }
  .main-header-content .top-menu-contact .top-menu-navbar a:hover {
    color: #f43118;
  }
  
  .about-us-holder .about-us-wrrap {
    margin: 4rem 0;
  }
  .about-us-holder .about-us-wrrap .content-title {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5rem;
  }
  .about-us-holder .about-us-wrrap .content-title .title-text {
    font-family: "lalezar";
    padding: 0;
    margin: 0;
    font-size: 30px;
  }
  .about-us-holder .about-us-wrrap .content-title .title-line {
    background-color: #f43118;
    width: 6px;
    height: 40px;
    border-radius: 3px;
  }
  .about-us-holder .about-us-wrrap .content-holder {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 3rem;
    padding: 1rem;
    box-shadow: 0 0 10px 2px rgba(34, 34, 34, 0.2);
    border-radius: 1rem;
  }
  .about-us-holder .about-us-wrrap .content-holder .content-img-holder img {
    border-radius: 1rem;
  }
  .about-us-holder .about-us-wrrap .content-holder .content-text-holder h1 {
    font-size: 24px;
    font-family: "lalezar";
    margin: 1rem 0;
    color: #666666;
  }
  .about-us-holder .about-us-wrrap .content-holder .content-text-holder .content-text {
    text-align: justify;
  }
  .about-us-holder .about-us-wrrap .content-holder .franchice-holder .franchice-title-holder {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5rem;
  }
  .about-us-holder .about-us-wrrap .content-holder .franchice-holder .franchice-title-holder .title-line {
    background-color: #2e448d;
    width: 6px;
    height: 40px;
    border-radius: 3px;
  }
  
  .bottom-content-img-holder {
    min-height: 400px;
  }
  
  .carousel-slider-holder {
    height: 500px;
    border-radius: 4rem;
    overflow: hidden;
    margin-bottom: 2rem;
    padding: 0;
    box-shadow: 0 15px 15px 0 rgba(34, 34, 34, 0.5);
  }
  .carousel-slider-holder .carousel {
    width: 100%;
    height: 100%;
  }
  .carousel-slider-holder .carousel .carousel-indicators {
    transition: all linear 0.5s;
    border-radius: 3px;
  }
  .carousel-slider-holder .carousel .carousel-indicators li {
    background-color: #f43118;
    width: 1rem;
    transition: all linear 0.5s;
  }
  .carousel-slider-holder .carousel .carousel-indicators .active {
    width: 2rem;
  }
  .carousel-slider-holder .carousel .carousel-inner {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .carousel-slider-holder .carousel .carousel-inner .carousel-item {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .carousel-slider-holder .carousel .carousel-inner .carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 1rem;
  }
  .carousel-slider-holder .carousel button span {
    border-radius: 25%;
    padding: 1.4rem;
    background-color: rgba(244, 49, 24, 0.6);
    display: inline-block;
  }
  .carousel-slider-holder .carousel button span:hover {
    transform: rotate(360deg);
  }
  
  .contact-us-holder {
    height: auto;
    padding: 3rem 0;
  }
  .contact-us-holder .row {
    height: 35%;
    margin-top: 4rem;
  }
  .contact-us-holder .row .map-holder {
    height: 100%;
    box-shadow: 0 0 8px 2px rgba(34, 34, 34, 0.3);
    border-radius: 1rem;
    overflow: hidden;
  }
  .contact-us-holder .row .map-holder iframe {
    width: 100%;
    height: 100%;
  }
  .contact-us-holder .row .address {
    text-align: justify;
    margin-bottom: 2rem;
  }
  .contact-us-holder .contact-us-form-holder {
    margin-top: 2.5rem;
    width: 100%;
    height: auto;
  }
  .contact-us-holder .contact-us-form-holder .form-title {
    text-align: center;
    background-color: #f43118;
    padding: 1.2rem 0;
    border-radius: 1rem;
    box-shadow: 0 0 8px 2px rgba(34, 34, 34, 0.5);
    font-family: "lalezar";
    font-size: 30px;
    color: #efefef;
  }
  .contact-us-holder .contact-us-form-holder form {
    margin-top: 0.25rem;
    width: 100%;
    height: auto;
  }
  .contact-us-holder .contact-us-form-holder form .row {
    width: 100%;
    height: 100%;
  }
  .contact-us-holder .contact-us-form-holder form .row section {
    padding-left: 0;
    margin-left: 0;
  }
  .contact-us-holder .contact-us-form-holder form .row label {
    width: 100%;
    margin-bottom: 1rem;
  }
  .contact-us-holder .contact-us-form-holder form .row label input {
    width: 100%;
    background-color: transparent;
    border: 2px solid rgba(34, 34, 34, 0.7);
    padding: 0.25rem 1rem;
    border-radius: 0.5rem;
    transition: all linear 0.3s;
    color: #efefef;
  }
  .contact-us-holder .contact-us-form-holder form .row label input::placeholder {
    transition: all linear 0.3s;
  }
  .contact-us-holder .contact-us-form-holder form .row label input:focus {
    background-color: #2e448d;
    border-color: #2e448d;
    outline: none;
  }
  .contact-us-holder .contact-us-form-holder form .row label input:focus::placeholder {
    color: rgba(239, 239, 239, 0.7);
  }
  .contact-us-holder .contact-us-form-holder form .row textarea {
    width: 100%;
    height: auto;
    resize: none;
    background-color: transparent;
    border: 2px solid rgba(34, 34, 34, 0.7);
    border-radius: 1rem;
    padding: 1rem;
    transition: all linear 0.3s;
  }
  .contact-us-holder .contact-us-form-holder form .row textarea::placeholder {
    transition: all linear 0.3s;
  }
  .contact-us-holder .contact-us-form-holder form .row textarea:focus {
    background-color: #2e448d;
    border-color: #2e448d;
    outline: none;
  }
  .contact-us-holder .contact-us-form-holder form .row textarea:focus::placeholder {
    color: rgba(239, 239, 239, 0.7);
  }
  .contact-us-holder .contact-us-form-holder form .form-btn-holder {
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .contact-us-holder .contact-us-form-holder form .form-btn-holder .form-btn-submit {
    border: none;
    background-color: #f43118;
    color: #dfdfdf;
    padding: 0.5rem 4rem;
    border-radius: 0.5rem;
    transition: all linear 0.4s;
  }
  .contact-us-holder .contact-us-form-holder form .form-btn-holder .form-btn-submit:hover {
    padding: 0.5rem 6.5rem;
  }
  
  .main-footer-holder {
    background: url(assets/images/Pattern.png) no-repeat center center/cover, linear-gradient(260deg, #f43118, #2e448d);
    width: 100%;
    height: 300px;
    margin-top: 5rem;
  }
  .main-footer-holder .container .row .top-footer-holder {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 4rem 0;
  }
  .main-footer-holder .container .row .top-footer-holder .social-media-holder {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1rem;
  }
  .main-footer-holder .container .row .top-footer-holder .social-media-holder .social-title-holder {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1rem;
  }
  .main-footer-holder .container .row .top-footer-holder .social-media-holder .social-title-holder .title-line {
    background-color: #dfdfdf;
    width: 6px;
    height: 40px;
    border-radius: 3px;
  }
  .main-footer-holder .container .row .top-footer-holder .social-media-holder .social-title-holder .social-title {
    font-family: "lalezar";
    font-size: 20px;
    color: #efefef;
    padding: 0;
    margin: 0;
  }
  .main-footer-holder .container .row .top-footer-holder .social-media-holder .social-icon-holder {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 3rem;
    margin-top: 2rem;
  }
  .main-footer-holder .container .row .top-footer-holder .social-media-holder .social-icon-holder li a {
    font-size: 30px;
    color: #dfdfdf;
    display: inline-block;
  }
  .main-footer-holder .container .row .top-footer-holder .social-media-holder .social-icon-holder li a i {
    vertical-align: 20px;
  }
  .main-footer-holder .container .row .top-footer-holder .social-media-holder .social-icon-holder li:hover a {
    color: #efefef;
    transform: translateY(-6px) scale(110%);
    text-shadow: 2px 2px 7px rgba(34, 34, 34, 0.6);
  }
  .main-footer-holder .container .row .top-footer-holder .e-namad-holder {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .main-footer-holder .copy-right-designer-holder {
    padding: 1rem 0;
    background-color: #efefef;
  }
  .main-footer-holder .copy-right-designer-holder .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .main-footer-holder .copy-right-designer-holder .container .copy-right-holder {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5rem;
    color: rgba(34, 34, 34, 0.8);
  }
  .main-footer-holder .copy-right-designer-holder .container .copy-right-holder p {
    padding: 0;
    margin-bottom: 7px;
  }
  .main-footer-holder .copy-right-designer-holder .container .designer-holder {
    color: rgba(34, 34, 34, 0.3);
    font-size: 16px;
  }
  .main-footer-holder .copy-right-designer-holder .container .designer-holder a {
    color: rgba(34, 34, 34, 0.5);
    font-weight: normal;
  }/*# sourceMappingURL=style.css.map */



  :root {
    --primary-color: #f43118;
    --secondary-color: #2e448d;
    --background-color: #efefef;
    --text-color: #333;
    --white: #ffffff;
}



.hero {
    text-align: center;
    padding: 4rem 0;
}

.hero h1 {
    font-size: 2.5rem;
    color: var(--secondary-color);
}

.hero p {
    font-size: 1.2rem;
    margin-bottom: 2rem;
}

.cta-buttons {
    display: flex;
    justify-content: center;
    gap: 1rem;
}

.btn {
    display: inline-flex;
    align-items: center;
    padding: 0.75rem 1.5rem;
    border-radius: 9999px;
    font-weight: bold;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.btn i {
    margin-right: 0.5rem;
}

.btn-primary {
    background-color: var(--primary-color);
    color: var(--white);
}

.btn-primary:hover {
    background-color: #d62b14;
}

.btn-secondary {
    background-color: var(--secondary-color);
    color: var(--white);
}

.btn-secondary:hover {
    background-color: #243a7a;
}

.screenshots, .features {
    text-align: center;
}

.screenshot-grid, .feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin-top: 2rem;
}

.feature-grid {
  grid-template-columns: repeat(2, 1fr);
  margin-bottom: 64px;
}

.screenshot-item, .feature-item {
    background-color: var(--white);
    border-radius: 8px;
    padding: 1.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.screenshot-item img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 1rem;
}

.download {
    background-color: var(--secondary-color);
    color: var(--white);
    text-align: center;
    padding: 4rem 0;
    border-radius: 8px;
}

.jux {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.screenshot-grid img{
  width: 100%;
  max-height: 718px;
  object-fit: contain;
}

.ccontainer {
  padding-inline: 112px;
}

.acontainer {
  display: flex;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 32px auto 0;
  padding: 20px;
}

.bcontainer {
  display: flex;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 32px auto 0;
  padding: 20px;
  background-color: white;
}

.info-column, .form-column {
  flex: 1;
  padding: 20px;
  min-width: 300px;
}
.info-column {
  background-color: #2c3e50;
  color: #ecf0f1;
}
.form-column {
  background-color: #ffffff;
}
h1, h2 {
  margin-bottom: 20px;
}
ul {
  padding-left: 20px;
}
form {
  display: flex;
  flex-direction: column;
}
label {
  margin-bottom: 5px;
  font-weight: bold;
}
input[type="text"],
input[type="mobile"],
select,
textarea {
  width: 100%;
  padding: 8px;
  margin-bottom: 15px;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-sizing: border-box;
}
textarea {
  height: 100px;
  resize: vertical;
}
button {
  background-color: #3498db;
  color: #ffffff;
  padding: 10px 15px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 16px;
  align-self: flex-start;
}
button:hover {
  background-color: #2980b9;
}
@media (max-width: 768px) {
  .acontainer {
      flex-direction: column;
  }
  .info-column, .form-column {
      min-width: 100%;
  }
	
.screenshot-grid {
    grid-template-columns: repeat(1, 1fr);
	}
	
	.feature-grid {
  grid-template-columns: repeat(1, 1fr);

}
	
	.ccontainer {
		 padding-inline: 16px
	}
}