@media (max-width: 1440px)
{
    .ripple {width: 100px;height: 100px;}
}


/*---------- Global Contents ----------*/
@font-face {
    font-family: 'Avenir';
    src: url('../fonts/Avenir.otf');
}

@font-face {
    font-family: 'LibraBold'; /* Buraya bir isim verin */
    src: url('../fonts/LibraSerifModern-Bold.otf'); /* .ttf dosyasının yolunu ekleyin */
}

@font-face {
    font-family: 'Libra'; /* Buraya bir isim verin */
    src: url('../fonts/LibraSerifModern-Regular.otf'); /* .ttf dosyasının yolunu ekleyin */
}

:root {
    --dark-color: #1d1e1c !important;
    --grey-color: #f9f9f9 !important;
    --text-color: #222 !important;
    --dark-grey-color: #444 !important;
    --white-color: #ffffff !important;
    --primary-color: #f88c2c !important;
    --secondary-color: #003e98 !important;
    --border-color: #dee2e6 !important;
    --bg-color: #042245 !important;

    --primary-font: 'Inter Tight' !important;
    --secondary-font: 'Libra' !important;
}

/* 1600×900 */
@media (max-width: 1600px) {
  h1 { font-size: 2.75rem; }
  h2 { font-size: 2rem; }
  h3 { font-size: 1.625rem; }
  h4 { font-size: 1.375rem; }
  h5 { font-size: 1.125rem; }
  h6 { font-size: 1rem; }
  p  { font-size: 1.0625rem; }
}

/* 1440×900 */
@media (max-width: 1440px) {
  h1 { font-size: 2.5rem; }
  h2 { font-size: 1.875rem; }
  h3 { font-size: 1.5rem; }
  h4 { font-size: 1.25rem; }
  h5 { font-size: 1.0625rem; }
  h6 { font-size: 0.95rem; }
  p  { font-size: 1rem; }
}

/* 1200×900 */
@media (max-width: 1200px) {
  h1 { font-size: 2.25rem; }
  h2 { font-size: 1.75rem; }
  h3 { font-size: 1.375rem; }
  h4 { font-size: 1.125rem; }
  h5 { font-size: 1rem; }
  h6 { font-size: 0.9rem; }
  p  { font-size: 0.95rem; }
}

/* Tablet (768–1024px) */
@media (max-width: 1024px) {
  h1 { font-size: 2rem; }
  h2 { font-size: 1.5rem; }
  h3 { font-size: 1.25rem; }
  h4 { font-size: 1.0625rem; }
  h5 { font-size: 0.95rem; }
  h6 { font-size: 0.85rem; }
  p  { font-size: 0.9rem; }
}

/* Mobile (≤767px) */
@media (max-width: 767px) {
  h1 { font-size: 1.75rem; }
  h2 { font-size: 1.375rem; }
  h3 { font-size: 1.125rem; }
  h4 { font-size: 1rem; }
  h5 { font-size: 0.875rem; }
  h6 { font-size: 0.8rem; }
  p  { font-size: 0.85rem; }
}

/*---------- Global Contents ----------*/
@media (max-width: 1440px)
{
    .home-section .section-text {font-size: 40px; margin: 0px;}
    .home-section .section-content {margin-top: 75px;}
}

@media (max-width: 1200px)
{
    .home-section {padding: 75px 0;}
    .home-section .section-content {margin-top: 50px;}
}

@media (max-width: 1024px)
{
    .no-pad {display: none !important;}
    .only-pad {display: flex !important;}

    .resp-section {
        position: relative;
        display: flex;
        justify-content: flex-end;
    }
    .resp-menu-btn {
        position: absolute;
        top: -22px;
        right: -80px;
        display: flex;
        flex-direction: column;
        height: 45px;
        justify-content: space-between;
        background: var(--white-color);
        padding: 10px;
        border-radius: 5px;
    }

    .resp-menu-btn .line {
        width: 40px;
        height: 3px;
        background: var(--secondary-color);
        position: relative;
        transition: all .3s;
    }

    .resp-menu-btn.active .line:nth-child(1) {
        transform: rotate(-45deg);
        top: 6px;
        background: var(--primary-color);
    }

    .resp-menu-btn.active .line:nth-child(2) {
        display: none;
    }

    .resp-menu-btn.active .line:nth-child(3) {
        transform: rotate(45deg);
        bottom: 6px;
        background: var(--primary-color);
    }

    .modal-backdrop {top: 109px;}

    #respMenuModal {
        top: 109px;
        height: calc(100vh - 109px);
    }

    #respMenuModal .modal-body {
        display: flex;
        flex-direction: column;
        font-family: var(--primary-font);
    }

    #respMenuModal .modal-body .menu-items {
        margin: 50px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #respMenuModal .modal-body .menu-items .menu-item {
        font-size: 24px;
        margin: 4px 0;
        text-align: center;
    }

    #respMenuModal .modal-body .menu-items .menu-item a {
        padding: 10px 20px;
        border-radius: 8px;
        color: var(--dark-color);
        font-weight: 600;
    }

    #respMenuModal .modal-body .menu-items .menu-item.active a {
        background: var(--primary-color);
        color: var(--white-color);
    }

    #respMenuModal .modal-body .menu-items .card {
        border-color: var(--primary-color);
        margin: 10px 0 0;
        text-align: left;
        min-width: 350px;
    }

    #respMenuModal #collapseMenu .card {text-align: center;}

    #respMenuModal .modal-body .menu-items .card .sub-menu-item a {
        font-weight: 400 !important;
    }

    #respMenuModal .modal-body .menu-items .menu-item .sub-menu-2 {margin-left: 25px}
    #respMenuModal .modal-body .menu-items .menu-item .sub-menu-2 a {color: var(--primary-color);font-weight: 400 !important;}
    #respMenuModal .modal-body .menu-items .menu-item .sub-menu-3 {margin-left: 25px}
    #respMenuModal .modal-body .menu-items .menu-item .sub-menu-3 a {color: var(--secondary-color);font-weight: 400;}

    #respMenuModal .modal-body .menu-items .menu-item.active .sub-menu-item a {
        background: transparent;
        color: var(--dark-color);
    }

    #respMenuModal .modal-body .menu-items .menu-item.active .sub-menu-item.active a {
        color: var(--primary-color);
    }

    #respMenuModal .modal-body .sm {
        margin: 50px;
        display: flex;
        justify-content: center;
    }

    #respMenuModal .modal-body .sm .item {
        margin: 15px;
        font-size: 24px;
        border: 1px solid var(--primary-color);
        width: 60px;
        height: 60px;
        text-align: center;
        line-height: 60px;
        border-radius: 30px;
        background: var(--primary-color);
        color: var(--white-color);
    }

    #respMenuModal .language {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    #respMenuModal .language .options {
        display: flex;
    }

    #respMenuModal .language .options p {
        margin: 0 2px;
    }

    #respMenuModal .language .options p a {
        padding: 10px;
        font-size: 16px;
        font-weight: bold;
        color: var(--dark-color);
    }

    #respMenuModal .language .options p a.active {
        background: var(--secondary-color);
        color: var(--white-color);
        border-radius: 5px;
    }

}

@media (max-width: 500px)
{
    .resp-menu-btn {height: 40px;top: -20px;}
    .resp-menu-btn .line {width: 30px;height: 2px;}
    .modal-backdrop {top: 99px;}
    #respMenuModal {top: 99px;height: calc(100vh - 99px);}
    #respMenuModal .modal-body .menu-items {margin: 20px;}
    #respMenuModal .modal-body .menu-items .card {padding: 0;width: 350px;}
    #respMenuModal .modal-body .menu-items .menu-item {margin: 0;}
    #respMenuModal .modal-body .menu-items a {font-size: 14px; }
    #respMenuModal .modal-body .menu-items .card .sub-menu-item a {padding-top: 0}
    #respMenuModal .language .options p a {padding: 8px;font-size: 14px;}
    .home-section .section-text {padding: 0;}
}


/*---------- Menu Section ----------*/
@media (max-width: 1600px)
{
    .menu-section {height: 100px;padding: 0 120px;}
    .menu-section .section .logo {left: -120px;width: 330px;height: 100px;}
    .menu-section .section .logo img {width: 90px;}
}

@media (max-width: 1440px)
{
    .menu-section {height: 90px;padding: 0 100px;}
    .menu-section .section .logo {left: -100px;width: 280px;height: 90px;}
    .menu-section .section .logo img {width: 80px;}
    .menu-section .section .menu-items .menu-item {font-size: 14px;}
    .menu-section .section .menu-items .menu-item .sub-menu .sub-menu-item {margin: 5px 0;}
    .menu-section .section .menu-items .menu-item .sub-menu a {font-size: 12px;}
    .menu-section .section .language .options p a {font-size: 14px;}
}

@media (max-width: 820px)
{
    .menu-section .section .logo {width: 200px;}
}

@media (max-width: 500px)
{
    .menu-section .section .logo {left: -100px;height: 90px;width: 120px}
}

/*---------- Home Header Section ----------*/
@media (max-width: 1600px)
{
    .header-section .slider .slide .slide-data {top: 45%;transform: translateY(-20%);left: 120px;}
    .header-section .header-content {height: 100px;}
    .header-section .header-content .content-right {width: 330px;height: 100px;}
    .header-section .header-content .content-right button {padding: 17px 20px;}
    .header-section .header-content .content-left {padding-left: 120px;}
}

@media (max-width: 1440px)
{
    .header-section .header-content {height: 90px;}
    .header-section .slider .slide .slide-data {top: 50%;transform: translateY(0);left: 120px;}
    .header-section .slider .slide .slide-data .title {font-size: 12px;}
    .header-section .slider .slide .slide-data .text {font-size: 50px;line-height: 50px;}
    .header-section .header-content .content-right {width: 280px;height: 90px;}
    .header-section .header-content .content-right button {padding: 13px 20px;font-size: 14px;}
    .header-section .header-content .content-left {padding-left: 120px;font-size: 14px}
}

@media (max-width: 1024px)
{
    .header-section .slider .slide .slide-data {width: 100%; top: 45%;}
    .header-section .header-content .content-right {width: 280px;height: 90px;}
    .header-section .header-content .content-right button {padding: 13px 20px;font-size: 14px;}
    .header-section .header-content .content-left {padding-left: 40px;font-size: 14px}
}

@media (max-width: 820px)
{
    .header-section .slider .slide .slide-data {width: 100%; top: 45%;left: 0;}
    .header-section .slider .slide .slide-data .title,
    .header-section .slider .slide .slide-data .text {width: 70%;text-align: center;margin: auto;}
    .header-section .header-content .content-right {width: 200px;height: 90px;}
    .header-section .header-content .content-right .page-button a {padding: 20px 15px;font-size: 12px;}
    .header-section .header-content .content-left {padding-left: 30px;font-size: 12px}
    .header-section .header-content .content-left .text {display:flex;}
    .header-section .header-content .content-left .text i {margin: 2px 10px 0 0;}
}

@media (max-width: 500px)
{
    .header-section {height: calc(100vh - 20px);width: calc(100vw - 20px);margin-top: 10px;margin-left: 10px;}
    .header-section .slider .slide {height: calc(100vh - 20px);width: calc(100vw - 20px);}
    .header-section .slider .slide .slide-data {width: 100%; top: 40%;left: 0;}
    .header-section .slider .slide .slide-data .title {font-size: 10px;}
    .header-section .slider .slide .slide-data .text {font-size: 24px;line-height: 28px;}
    .header-section .slider .slide .slide-data .title,
    .header-section .slider .slide .slide-data .text {width: 70%;text-align: center;margin: auto;}
    .header-section .header-content .content-right {width: 120px;height: 90px;}
    .header-section .header-content .content-right .page-button a {padding: 25px 13px;font-size: 10px;}
    .header-section .header-content .content-left {width: calc(100% - 120px); display: flex; flex-direction: column;padding-left: 10px;font-size: 11px}
    .header-section .header-content .content-left .text  {margin: 0 0 3px 0;}
}


/*---------- Home Services Section ----------*/
@media (max-width: 1440px)
{
    .home-section.services-section .section-content .item .item-data .data .title {font-size: 20px;}
}
@media (max-width: 1200px)
{
    .home-section.services-section .section-content .item .item-data {padding: 25px;}
    .home-section.services-section .section-content .item .item-data .data .title {font-size: 24px;}
}

@media (max-width: 820px)
{
    .home-section.services-section .section-content .item .item-data .data .title {font-size: 16px;}
}

@media (max-width: 500px)
{
    .home-section.services-section {padding-bottom: 20px;}
    .home-section.services-section .section-content .item .item-data .data .title {font-size: 20px;}
}

/*---------- Home About Section ----------*/
@media (max-width: 1600px)
{
    .about-section {padding-bottom: 375px !important;}
    .about-section .extra-area {width: 76%;bottom: -315px;left: 12%;}
}

@media (max-width: 1440px)
{
    .about-section {padding-bottom: 375px !important;}
    .about-section .extra-area {width: 76%;bottom: -275px;left: 12%;padding: 30px}
    .about-section .section-content .title {font-size: 18px;}
    .about-section .section-content .text {font-size: 14px;}
    .about-section .extra-area .video .ripple-container .play-button {width: 80px;height: 80px;}
    .about-section .extra-area .video .ripple-container i {font-size: 30px;}
    .about-section .extra-area .content p,
    .about-section .extra-area .content li {font-size: 14px;}
    .about-section .extra-area .content .box {padding: 30px;}
    .about-section .extra-area .content .box .text {font-size: 18px;padding-right: 30px;}
}

@media (max-width: 1200px)
{
    .about-section {padding-bottom: 350px !important;}
    .about-section .section-content .row > div {padding: 0 30px;}
    .about-section .extra-area {width: 90%;bottom: -270px;left: 5%;padding: 20px}
    .about-section .extra-area .content .box .text {font-size: 15px;padding-right: 30px;}
}

@media (max-width: 1024px)
{
    .about-section {padding-bottom: 250px !important;}
    .about-section .section-content .row > div {margin-bottom: 50px;}
}

@media (max-width: 820px)
{
    .about-section {padding-bottom: 250px !important;}
    .about-section .section-content .row > div {margin-bottom: 50px;}
    .about-section .extra-area {width: 90%;bottom: -600px;left: 5%;padding: 30px;}
    .about-section .extra-area .video {margin-bottom: 30px;}
    .about-section .extra-area .content .box {margin-top: 30px;}
    .about-section .extra-area .video img {aspect-ratio: 2/1;object-fit: cover;}
}

@media (max-width: 500px)
{
    .about-section {width: calc(100vw - 20px);margin-top: 10px;margin-left: 10px;padding-bottom: 200px !important;}
    .about-section .section-content .row > div {text-align: center;}
    .about-section .extra-area {width: 94%;bottom: -550px;left: 3%;padding: 10px;}
    .about-section .extra-area .content .box {flex-direction: column;}
    .about-section .extra-area .content .box .item {display: flex; flex-direction: row; margin-bottom: 20px;}
    .about-section .extra-area .content .box .item:last-child {margin-bottom: 0px;}
    .about-section .extra-area .content .box i {font-size: 25px;margin-bottom: 0;margin-right: 20px;}
    .about-section .extra-area .video img {aspect-ratio: 3/2;}
    .about-section .extra-area .video .ripple-container .play-button {width: 50px;height:50px;}
    .about-section .extra-area .video .ripple-container i {font-size: 20px;}
    .ripple {width: 80px;height: 80px;}
}

/*---------- Home Blog Section ----------*/
@media (max-width: 1440px)
{
    .blog-section {margin-top: 400px !important;}
}

@media (max-width: 1200px)
{
    .blog-section .blog-data .title {font-size: 18px;margin: 20px 0 15px;}
    .blog-section .blog-data .text {font-size: 15px;}
    .blog-section .blog-data .url {margin: 20px 0 0;}
    .blog-section .blog-data .url a {font-size: 15px;}
}

@media (max-width: 1024px)
{
    .slick-dots {bottom: -60px;}
}

@media (max-width: 820px)
{
    .blog-section {margin-top: 700px !important;}
}

@media (max-width: 500px)
{
    .blog-section {margin-top: 570px !important;padding-left: 0;padding-right: 0;}
    .home-section.blog-section .section-content {margin-top: 30px;padding: 0;}
    .blog-section .blog-slider .slide {padding: 0 10px;}
}

/*---------- Home references Section ----------*/
@media (max-width: 1440px)
{
    .references-section .ref-slider {padding: 30px 0 0;}
    .references-section .ref-slider .slide img {width: 120px;}
}

/*---------- Footer ----------*/
@media (max-width: 1440px)
{
    .footer .footer-top {padding-bottom: 60px;}
    .footer .footer-top .text {font-size: 36px;width: 50%;}
}

@media (max-width: 1200px)
{
    .footer {padding: 60px 20px;}
    .footer .footer-top {padding-bottom: 50px;}
    .footer .footer-top .text {font-size: 30px;width: 50%;}
    .footer .footer-bottom {padding: 60px 20px;}
    .footer .footer-bottom .logo {width: 80px;}
    .footer .footer-bottom .text {font-size: 14px;margin: 40px 80px 40px 0;}
    .footer .footer-bottom .sm .item {width: 40px;height: 40px;border-radius: 20px;}
    .footer .footer-bottom .sm .item a {font-size: 16px;width: 40px;height: 40px;}
    .footer .footer-bottom .title {font-size: 18px;}
    .footer .footer-bottom ul li {font-size: 14px;}
    .footer .footer-bottom ul li i {margin: 0 10px 0 0;}
    .footer .footer-bottom .contact-data {font-size: 14px;}
    .footer .copyright {padding-top: 50px;font-size: 14px;}
}

@media (max-width: 820px)
{
    .footer .footer-top {padding-bottom: 50px;}
    .footer .footer-top .text {font-size: 20px;width: 50%;}
    .footer .footer-bottom .row > div:first-child {text-align: center;margin-bottom: 50px}
    .footer .footer-bottom .logo {margin: auto;}
    .footer .footer-bottom .text {width: 100%;padding: 0 20px;}
    .footer .footer-bottom .sm {justify-content: center;}
    .footer .copyright {justify-content: center;}
}

@media (max-width: 500px)
{
    .footer {padding: 50px 10px;width: calc(100vw - 20px);margin-bottom: 10px;margin-left: 10px;}
    .footer .footer-top {flex-direction: column;}
    .footer .footer-top {padding-bottom: 50px;}
    .footer .footer-top .text {font-size: 18px;width: 100%;text-align: center;margin-bottom: 40px}
    .footer .footer-bottom .row > div {text-align: center;margin-bottom: 50px;}
    .footer .footer-bottom .row > div:last-child {margin-bottom: 0px;}
    .footer .footer-bottom ul li i {display: none;}
    .footer .footer-bottom .contact-data {flex-direction: column;}
    .footer .footer-bottom .contact-data i {margin: 0;}
    .footer .copyright p,
    .footer .copyright i {font-size: 13px !important}
}

/*---------- Page Global Contents  ----------*/
@media (max-width: 1600px)
{
    .page-header-section .header-content .header-title {margin-top: 100px;}
}

@media (max-width: 1440px)
{
    .page-header-section .header-content .header-title {margin-top: 90px;}
    .page-content-section .faq .accordion-body {padding: 20px;font-size: 16px;}
}

@media (max-width: 1200px)
{
    .page-header-section .header-content {padding: 0 5%;}
    .page-content-section {padding: 80px 10px;}
    .page-content-section .item.logo {margin-bottom: 20px;}
    .page-content-section .item.logo img {width: 150px;}
    .page-content-section .faq .accordion-button {font-size: 15px;}
    .page-content-section .faq .accordion-body {font-size: 15px;}
}

@media (max-width: 820px)
{
    .page-header-section {aspect-ratio: 2/1}
}

@media (max-width: 500px)
{
    .page-header-section {width: calc(100vw - 20px);aspect-ratio: 1 / 1;margin-top: 10px;margin-left: 10px;}
}

/*---------- PAGE - About Us   ----------*/
@media (max-width: 1440px)
{
    .about-page .page-content-section .content .item i {font-size: 40px;margin: 0 15px 0 0;}
}

@media (max-width: 820px)
{
    .page-content-section .grid-img {margin-bottom: 50px;}
    .about-page .mission-vision .content {padding: 0; margin-bottom: 15px}
    .about-page .mission-vision .image {margin: 40px 0;aspect-ratio: 2/1;object-fit: cover;}
}

@media (max-width: 500px)
{
    .about-page .page-content-section {padding: 50px 0;}
    .about-page .page-content-section .section-text.inner-page-title {padding: 0 10px;}
    .page-content-section .grid-img .top .image {padding: 0 0 5px 0;}
    .page-content-section .grid-img .bottom .image:last-child {padding: 0 0 0 5px;}
    .about-page .mission-vision .section-text {padding: 30px 20px;}
    .about-page .mission-vision .image {aspect-ratio: 3/2;}
}

/*---------- PAGE - Projects & Services   ----------*/
@media (max-width: 1200px)
{
    .projects-section nav {margin-bottom: 30px;}
    .projects-section .project-info,
    .services-section .project-info {top: 20px;}
    .projects-section .project-info .p-content,
    .services-section .project-info .p-content {padding: 30px 20px 10px;}
}

@media (max-width: 820px)
{
    .projects-section .project-info,
    .services-section .project-info {position: relative; margin-top: 50px;}
    .services-section .project-info .p-content .data {flex-direction: column; justify-content: center;text-align: center}
    .services-section .project-info .p-content .data .icon {margin: 0;}
    .services-section .section-content .item .item-data {padding: 20px;}
    .services-section .section-content .item .item-data .data .title {font-size: 18px}
}

@media (max-width: 500px)
{
    .projects-section .page-content-section,
    .services-section .page-content-section {padding: 50px 0;}
    .services-section .section-content .item .item-data .data .title {font-size: 22px;}
    .projects-section nav .nav-tabs button {margin: 0 10px;}
    .projects-section nav .nav-tabs button:after {right: -14px;}
}

/*---------- PAGE - Blog   ----------*/
@media (max-width: 500px)
{
    .blog-section .page-content-section {padding: 50px 0;}
    .page-header-section .header-content .breadcrumbs {display:inline-table}
    .page-header-section .header-content .breadcrumbs p {float: left; margin: 0 2px;}
}

/*---------- PAGE - Contact   ----------*/
@media (max-width: 1024px)
{
    .contact-area .area-image  {aspect-ratio: 3/4}
}

@media (max-width: 820px)
{
    .contact-area {margin-top: 50px;flex-direction: row;}
    .contact-area .area-image {margin-right: 15px;}
    .contact-area .area-data {margin-left: 15px;padding: 30px; display: flex; flex-direction: column;justify-content: space-evenly;}
}

@media (max-width: 500px)
{
    .contact-page .page-content-section {padding: 50px 0;}
    .form-area {padding: 40px 20px;}
    .contact-area {margin-top: 50px;flex-direction: column;}
    .contact-area .area-image {margin-right: 0px;}
    .contact-area .area-data {margin-left: 0px;padding: 20px;margin-bottom: 50px;}
    .map-area {aspect-ratio: 1 / 1;}
}

/*---------- PAGE - Coming Soon ----------*/
@media (max-width: 1600px)
{
    .coming-soon .logo {width: 180px;height: 180px;}
    .coming-soon .content .text p {font-size: 22px;}
    .coming-soon .content .text h1 {font-size: 120px;}
    .coming-soon .sm div {margin: 20px;}
    .coming-soon .sm a {font-size: 20px;}
}

@media (max-width: 1440px)
{
    .coming-soon .content .text p {font-size: 20px;}
    .coming-soon .content .text h1 {font-size: 110px;}
}

@media (max-width: 1200px)
{
    .coming-soon .content .text p {font-size: 18px;}
    .coming-soon .content .text h1 {font-size: 90px;}
    .coming-soon .sm div {margin: 20px;}
    .coming-soon .sm a {font-size: 20px;}
}

@media (max-width: 1024px)
{
    .coming-soon .content img {width: 50%;left: 25%;}
}

@media (max-width: 820px)
{
    .coming-soon .content img {width: 60%;left: 20%;}
    .coming-soon .content .text p {font-size: 18px;}
    .coming-soon .content .text h1 {font-size: 80px;width: 500px;}
}

@media (max-width: 500px)
{
    .coming-soon .logo {
        width: 120px;
        height: 120px;
        left: 50%;
        transform: translateX(-50%);
    }
    .coming-soon .content img {width: 80%;left: 10%;}
    .coming-soon .content .text p {font-size: 12px;}
    .coming-soon .content .text h1 {font-size: 55px;width: 300px;}
    .coming-soon .sm {
        bottom: 30px;
        display: flex;
        left: 50%;
        transform: translateX(-50%);
        right: unset;
    }
}