@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital@1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Imperial+Script&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');


header{font-family:'EB Garamond',serif;}
body,p{font-family:'Inter',sans-serif;}
:root{
    --brand: #244393;
    --soft: #e8f7f8;
    --dark: #222;
    --light: #f9f9f9;
    --font-primary: 'Inter', sans-serif;
    --font-serif: 'EB Garamond', serif;
    --font-accent: 'Playfair Display', serif;
    --font-imperial: 'Imperial Script', cursive;
    --font-poppins: 'Poppins' sans-serif;
    --font-roboto: 'Roboto' sans-serif;
}
body { margin:0;padding:0;color:#363636;background:url("../_img/sitebg.jpg") no-repeat left top;  font-family:var(--font-serif);}
body::before {content: "";position: fixed;top: 0; left: 0;width: 100%; height: 100%;background: url("../_img/sitebg.jpg") no-repeat center center;background-size: cover;    filter: contrast(0.2) brightness(1.6);z-index: -1;}
.nav {position: relative;display: flex;justify-content: center;align-items: center;flex-direction: row;height: 100px;width: 100%;border-bottom: 2px solid rgba(170, 169, 169, 0.8);}
.container{ margin: 0 2rem 0 2rem;padding: 0.5rem 1rem 0 1rem;width: 90%;font-family:var(--font-serif);color:var(--brand);}
.site-header{ position: relative;display: flex;align-items: center;}
.site-nav { position:relative;display: flex;justify-content: space-between;align-items: center;width: 85%;height: 50px;padding: 20px;margin: 0 4rem 0 10rem;}
.header-menu { display: flex;justify-content: space-evenly;align-items: center;padding: 10px;height: 40px;font-size: 170%;font-family: var(--font-serif);font-weight: bold;font-style: normal;text-decoration: none;}
.header-menu a{margin: 10px;font-family:var(--font-serif);color:var(--brand);text-decoration: none;cursor: pointer;transition:.4s;}
.header-menu a:hover{color: #2058f3;text-decoration: none;cursor: pointer;transition:.4s;}
.header-lang { display: flex;justify-content: space-between;align-items: center;padding: 10px;width: 20%;height: 40px;}
.header-lang a {width: 100%;margin: 10px;cursor: pointer;transition:.4s;text-decoration: none;}
.hamburger {display: none;background: none;border: none;font-size: 3rem;color: var(--brand);cursor: pointer;margin-right: auto;}


.footer-contact { display: flex;justify-content: center;align-items: center;flex-direction: column;width: 100%;height: 100px;margin: 10px;padding: 10px;font-size: 120%;font-style: normal;font-weight: 900;color: #0d0d0d;}
.footer-contact span:first-of-type { margin-bottom:25px;font-weight: 900;font-family: var(--font-primary);letter-spacing: 0.6em;}
.footer-contact span:last-of-type { font-weight: 500;font-family: var(--font-primary);letter-spacing: 0.6em;}

.site-main{ display: flex;justify-content: center;align-items: center;flex-direction: column;}
.site-main img { width: 30%;margin: -85px 10px;}
.site-main h1:first-of-type  { line-height: 160px;color: #161616;font-family: var(--font-imperial);font-size: 13em;font-style: normal;font-weight: 400;font-family: var(--font-imperial); }
.site-main h1:last-of-type { line-height: 111px;font-size: 4rem;letter-spacing: 0em;font-style: italic;font-weight: 800;color: #363636; }
.site-main-buttons { display: flex;justify-content: space-between;align-items: center;width: 50%;font-size: 2rem;font-weight: 700;font-family: var(--font-primary);}
.site-main-buttons a{ display: flex;justify-content: center;align-items: center;width: 80%;height: 40px;margin: 0 30px;border-radius: 12px;font-size: 1rem;background-color: var(--brand);color:var(--light) !important;text-decoration: none !important; text-transform: uppercase;cursor: pointer;transition: .4s;}
.site-main-buttons a:hover{ background-color: var(--light);color:var(--brand) !important;text-decoration: none !important;cursor: pointer;transition: .4s;}

.site-contact{ display: flex;justify-content: center;align-items: center;flex-direction: column;}
.site-contact img{ width: 30%;margin: -85px 10px;}
.contact { display: flex;justify-content: space-between;align-items: center;width: 90%;padding: 10px;margin: 10px;}
.contact-map {border: 5px solid var(--brand);width: 50%;}
.contact-map-frame{ width: 100% !important;height: 520px;}
.contact-infos{display: flex;justify-content: flex-start;align-items: center;flex-direction: column;width: 40%;font-family: "Roboto", sans-serif;}
.contact-infos article {}
.contact-infos section { display: flex;justify-content: flex-start;align-items: center;font-size: 1.2rem;font-weight: 600;font-family: "Roboto", sans-serif;color: #161616;}
.contact-infos section a{display: flex;justify-content: flex-start;align-items: center;width: 100%}
.contact-infos section img{width: 15%;margin: 20px;filter: brightness(0.1);}
.contact-infos section span{width: 50%;}
.contact-socialmedia{ display: flex;justify-content: center;align-items: center;width: 50%;}
.contact-socialmedia a{display: flex;justify-content: center;align-items: center;width: 100%;margin: 5px 0;}
.contact-socialmedia a img{ margin: unset;width: 50%;border-radius: 25px;}

.site-corporate{ display: flex;justify-content: center;align-items: center;flex-direction: column;}
.site-corporate img{width: 20%;margin: -60px 10px;}
.corporate { display: flex;justify-content: space-between;align-items: center;width: 90%;padding: 10px;margin: 10px;}
.corporate-img {border: 10px solid var(--brand);width: 50%;}
.corporate-img img{ margin: unset; width: 100%;}
.corporate-infos {display: flex;justify-content: flex-start;align-items: center;flex-direction: column;width: 40%;padding: 30px;margin-left: auto;font-size: 1.3rem;font-weight: 600;font-family: "Roboto", sans-serif;color: #161616;}
.corporate-infos h2 {display: flex; justify-content: flex-start; align-items: center;margin-right: auto; font-size: 2rem;font-weight: 600;font-family: "Roboto", sans-serif;color: #161616;text-transform: uppercase;}
.corporate-infos p {margin: 10px 0;}
.corporate-infos-lisans {display: flex;justify-content: flex-start;align-items: center;width: 100%;height: 50px;margin-right: auto;margin-top: 20px;gap: 12px;}
.corporate-infos-lisans img {width: 90px;height: 60px;object-fit: contain;opacity: 0.8;margin: 0;}
.corporate-detail {  display: flex;justify-content: center;align-items: center;flex-direction: column;width: 120%;font-size: 1.3rem;font-weight: 600;font-family: "Roboto", sans-serif;color: #161616;background-color: #f9f9f9}
.corporate-detail h2 {margin: 10px 0 0 0; color: #161616;}
.corporate-services { display: flex;justify-content: center;align-items: center;width: calc(100% - 20%);padding: 10px;margin: 10px; font-size: 1.3rem;font-weight: 600;font-family: "Roboto", sans-serif;color: #161616;}
.service-item {display: flex;justify-content: center;align-items: center;flex-direction: column;}
.service-item h3 { display: flex;justify-content: center !important;align-items: center;width: 70%;height: 55px;overflow: hidden;font-size: 1.5rem;color: #161616;margin: 10px;}
.service-item p{ display: flex;justify-content: flex-start;align-items: center;margin: 10px;padding: 10px 0px;font-size: 1rem;font-weight: 400;font-family: none;}
.service-item a { display: flex;justify-content: center;align-items: center;width: 90%;height: 40px;margin-right: 20px;background-color: var(--brand);border: 1px solid var(--brand);border-radius: 20px;color: #f9f9f9;text-decoration: none !important;cursor: pointer;transition: .4s;}
.service-item a:hover{background-color: var(--light);color:var(--brand) !important;}

.site-references{ display: flex;justify-content: center;align-items: center;flex-direction: column;}
.site-references img{width: 20%;margin: -60px 10px;}
.references { display: flex;justify-content: space-between;align-items: center; flex-direction: column;width: 100%;padding: 10px;margin: 10px;}
.references h2{color: #161616;text-transform: uppercase;}
.references-items { display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;gap: 5px;width: 100%;margin: 10px;padding: 15px;background-color: rgba(249, 249, 249, 0.4);}
.references-item {width: 17%;}
.references-item img{overflow: hidden; margin: 5px;width: unset;}

.site-projects{ display: flex;justify-content: center;align-items: center;flex-direction: column;}
.site-projects img{width: 20%;margin: -60px 10px;}
.projects { display: flex;justify-content: space-between;align-items: center; flex-direction: column;width: 100%;padding: 10px;margin: 10px;}
.projects h2{color: #161616;text-transform: uppercase;}
.projects-items { display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;gap: 5px;width: 100%;margin: 10px;padding: 15px;background-color: rgba(249, 249, 249, 0.2);}
.projects-item {width: 33%;}
.projects-item video{width: 360px;height: 420px;margin: 5px;overflow: hidden; }

.site-products{ display: flex;justify-content: center;align-items: center;flex-direction: column;}
.site-products img{width: 20%;margin: -60px 10px;}
.products { display: flex;justify-content: space-between;align-items: center; flex-direction: column;width: 100%;padding: 10px;margin: 10px;}
.products h2{color: #161616;text-transform: uppercase;}
.products-items{ display: flex;justify-content: space-around;align-items: center;flex-wrap: wrap;gap: 10px;padding: 40px;margin: 15px;}
.products-item{display: flex;justify-content: center;align-items: center;flex-direction: column;flex: 1;margin: 10px;}
.products-item img{overflow: hidden; margin: 5px;width: unset; }
.products-title {display: flex;justify-content: center;align-items: center;flex-direction: column;margin-bottom: 1.5rem;text-align: center;}
.products-title .top {font-family: 'Poppins', Arial, sans-serif;font-weight: 800; /* ExtraBold */font-size: 1.8rem;color: #4979e9; /* Mavi tonu */letter-spacing: 0.01em;text-transform: uppercase;line-height: 1.1;}
.products-title .bottom {font-family: 'Playfair Display', 'Times New Roman', serif;font-weight: 500;font-size: 1.1rem;color: #222;letter-spacing: 0.13em; /* Harf arası geniş */text-transform: uppercase;margin-top: 0.2em;}



.site-products-detail{ display: flex;justify-content: center;align-items: center;flex-direction: column;}
.site-products-detail img{width: 20%;margin: -60px 10px;}
.products-detail { display: flex;justify-content: space-between;align-items: center;width: 90%;padding: 10px;margin: 10px;}
.products-detail-img{ width:40%; margin-right: 100px; background-color: rgba(249,249,249,0.5);}
.products-detail-img .products-title{ height:100px;margin-bottom:unset;background-color: rgba(249,249,249,0.7);}
.products-detail-img img{overflow: hidden; margin: unset;width: unset;z-index: 99; }
.products-detail-infos { display: flex;justify-content: flex-start;align-items: center;flex-direction: column;width: 60%;margin-left: auto;font-size: 1rem;font-weight: 600;font-family: "Roboto", sans-serif;letter-spacing: -0.5px;color: #161616;}
.products-detail-infos p {margin: 10px 0;}
.product-subitems {display: flex;justify-content: center;align-items: center;flex-direction: column;gap: 15px;}
.product-subitem { display: flex;justify-content: space-between;align-items: center;width: 90%;font-size: 2rem;font-weight: 700;font-family: var(--font-primary);}
.product-subitem h3 { display: flex;justify-content: center;align-items: center;width: 120%;height: 50px;border-radius: 12px;font-size: 1rem;background-color: var(--brand);color: var(--light) !important;text-decoration: none !important;text-transform: uppercase;}
.product-subitem a {display: flex;justify-content: center;align-items: center;width: 90px;height: 50px;margin: 0 10px;border-radius: 12px;font-size: 1rem;background-color: var(--brand);color: var(--light) !important;text-decoration: none !important;text-transform: uppercase;cursor: pointer;transition: .4s;}
.product-subitem a:hover{ background-color: var(--light);color:var(--brand) !important;text-decoration: none !important;cursor: pointer;transition: .4s;}

@media(max-width:1920px) {
    .products-item{ margin: 60px; }
}
@media(max-width:768px){
        body::before {filter: contrast(0.2) brightness(1.6);background-position: center center;}
        .container {width: 100%;margin: 0;padding: 1rem;}
        .site-nav { width:unset;height: 100%;padding: unset;margin: unset;}
        .hamburger {display: flex;justify-content: flex-start;align-items: center;}
        .header-menu {display: none;flex-direction: column;padding: 1rem;width: 100%;text-align: center;}
        .header-menu.active {position: fixed;top: 72px;left: -0;display: inline-flex;justify-content: flex-start;align-items: flex-start;width: 50%;background-color:rgba(249,249,249,0.5);height: 100%;z-index: 99;}
        .header-lang { justify-content: flex-end;width: unset;margin-left: auto;}
        .header-lang a{width: 15%;}

        .site-footer { margin-top: 80px;}
        .footer-contact {font-size: 100%;}

        .site-main img{ width: 40%;margin: 55px 10px;}
        .site-main h1:first-of-type{ font-size: 3rem;line-height: unset;}
        .site-main h1:last-of-type{line-height: unset; font-size: unset;}
        .site-main-buttons{width: 100%;font-size: unset;margin-top: 25px;}
        .site-main-buttons a{width: 100%;height: 40px;margin: 0px 10px;border-radius: 7px;font-size: 90%;}

        .site-contact img{ width: 40%;margin: -45px 10px;}
        .contact {flex-direction:column;flex:1;margin: 45px 0;}
        .contact-map{width: 100%;}
        .contact-map-frame{ width: 100% !important;height: 360px;}
        .contact-infos article {display: flex;justify-content: flex-start;align-items: center;flex-wrap: wrap;}
        .contact-infos section {font-size: 1rem;}
        .contact-infos section img {width: 15%;margin: 15px;}
        .contact-infos section span {width: 80%;}
        .contact-socialmedia {width: 85%;}

        .site-corporate img{ width: 40%;margin: -45px 10px;}
        .corporate {flex-direction:column;flex:1;margin: 45px 0;}
        .corporate-img{width: 100%;}
        .corporate-img img{margin: unset;width: 100%;}
        .corporate-infos{ width: 100%;padding: 15px;}
        .corporate-infos-lisans{flex-wrap: wrap;height: 100%;}
        .corporate-infos-lisans img{margin: unset;width: unset;}
        .corporate-detail {width: unset;}
        .corporate-detail h2{font-size: 2.4rem;}
        .corporate-services{flex-direction: column;padding:unset;margin: unset;width: unset;}

        .site-references img{ width: 40%;margin: -45px 10px;}
        .references h2{margin:15px;font-size: 2.4rem;}
        .references-item {width: 47%;}
        .references-item img{width: unset;margin: unset;}


        .site-projects img{ width: 40%;margin: -45px 10px;}
        .projects-items { flex-wrap: unset; flex-direction: column;width: unset;}
        .projects h2{margin:15px;font-size: 2.4rem;}
        .projects-item {width: unset;}

        .site-products img{ width: 40%;margin: -45px 10px;}
        .products-item{width: unset;}
        .products-item img{overflow: hidden; margin: 5px;width: unset; }

        .site-corporate img{ width: 40%;margin: -45px 10px;}
        .corporate {flex-direction:column;flex:1;margin: 45px 0;}
        .corporate-img{width: 100%;}
        .corporate-img img{margin: unset;width: 100%;}
        .corporate-infos{ width: 100%;padding: 15px;}
        .corporate-infos-lisans{flex-wrap: wrap;height: 100%;}
        .corporate-infos-lisans img{margin: unset;width: unset;}
        .corporate-detail {width: unset;}
        .corporate-detail h2{font-size: 2.4rem;}
        .corporate-services{flex-direction: column;padding:unset;margin: unset;width: unset;}

        .site-products-detail img{width: 40%;margin: -45px 10px;}
        .products-detail {flex-direction:column;flex:1;margin: 45px 0;}
        .products-detail-img{width: 100%; margin: unset;}
        .products-detail-img img{margin: unset;width: 100%; }
        .products-detail-infos-prods .products-title{ display: none;}
        .products-detail-infos {  width: 100%;padding: 15px;}
        .products-detail-infos p { margin: 30px 0; }
        .product-subitem {width: 100%;}
        .product-subitem h3 {text-align: center;}

}


