:root{
  --bg:#f4f6f8;
  --accent:#1f2f46;
  --accent-soft:rgba(31,47,70,0.08);
  --accent-border:rgba(31,47,70,0.28);
  --text:#0b0f14;
  --muted:#243447;
  --bg-opacity:0.08;
  --bg-contrast:1.02;
  --bg-brightness:1.02;
  --header-opacity:0.92;
  --header-blur:10px;
  --header-border-opacity:0.08;
  --header-height:82px;
}

*{box-sizing:border-box}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:Inter,sans-serif;
  background:linear-gradient(180deg,#f7f8fa,#eef2f5);
  color:#000000;
  position:relative;
}

.container{width:90%;max-width:1200px;margin:auto}

section{
  padding:56px 0;
  border-bottom:1px solid rgba(255,255,255,0.05);
}

h1{
  font-size:44px;
  line-height:1.15;
  margin:0 0 14px;
  color:#000000;
  font-weight:800;
  letter-spacing:-0.4px;
}

h2{
  font-size:24px;
  line-height:1.25;
  margin:0 0 14px;
  font-weight:700;
  color:#000000;
  letter-spacing:-0.2px;
}

h3{
  margin:0 0 8px;
  font-size:18px;
  line-height:1.3;
  color:#000000;
  font-weight:700;
}

p{
  color:#000000;
  line-height:1.7;
  margin:0 0 12px;
  font-size:15px;
  font-weight:400;
}

img{
  max-width:100%;
  display:block;
}

#hero,
#hakkimizda,
#cozum-ozet,
#cozum-gruplari,
#urun-gruplari,
#puu-yaklasim,
#iletisim{
  scroll-margin-top:82px;
}

.lang-current{
  color:var(--accent);
  background:rgba(31,47,70,0.10);
  padding:4px 8px;
  border-radius:6px;
  font-weight:800;
}

.lang-switch{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  line-height:1;
  white-space:nowrap;
}

.lang-switch a{
  color:#243447;
  opacity:0.9;
  padding:2px 4px;
  border:none;
  border-radius:0;
  background:none;
  transition:color 0.2s ease, opacity 0.2s ease, filter 0.2s ease;
}

.lang-switch a:hover{
  color:var(--accent);
  opacity:1;
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:4px;
  filter:brightness(1.12) contrast(1.12);
  background:none;
  border:none;
}

.lang-switch a + span::before,
.lang-switch span + a::before{
  content:"|";
  margin:0 6px;
  color:#4a5a6a;
  font-size:11px;
  font-weight:400;
}

.uygulama-card p{
  margin:0;
  font-size:13px;
  line-height:1.45;
}

.card h3{
  color:var(--accent);
  font-size:16px;
  font-weight:700;
  margin-bottom:6px;
}

.solution-card{
  text-decoration:none;
  overflow:hidden;
  transition:transform 0.25s ease, box-shadow 0.25s ease;
}

.solution-img-wrap{
  width:100%;
  height:180px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  background:#fff;
  padding:10px;
  border-radius:6px;
  overflow:hidden;
}

.solution-img{
  width:100%;
  height:180px;
  object-fit:contain;
  object-position:top center;
  background:#fff;
  padding:10px;
  display:block;
}

.solution-text{
  margin-bottom:14px;
  flex-grow:1;
}

.solution-text h3{
  margin:0 0 8px;
  color:var(--accent);
  font-size:18px;
  font-weight:700;
}

.solution-text p{
  margin:0;
  color:#000000;
  font-size:14px;
  line-height:1.65;
}

.card p{
  font-size:13.5px;
  line-height:1.55;
  color:#000000;
}

.grid{
  display:grid;
  gap:20px;
  align-items:stretch;
}

.grid > *{
  height:100%;
}

.grid-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.card{
  padding:20px;
  border-radius:14px;
  background:transparent;
  border:1.5px solid var(--accent);
  box-shadow:none;
  transition:background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  height:100%;
}

.card:hover{
  transform:translateY(-2px);
  background:var(--accent);
  border-color:var(--accent);
  box-shadow:none;
}

.card.passive{
  cursor:pointer;
}

.card:hover h3,
.card:hover p{
  color:#ffffff !important;
}

.btn{
  display:inline-block;
  margin-top:20px;
  padding:14px 24px;
  border-radius:30px;
  background:linear-gradient(135deg,#2c3e5a,#1f2f46);
  color:#ffffff;
  font-weight:700;
  text-decoration:none;
  border:none;
  cursor:pointer;
}

.badge{
  display:inline-block;
  padding:6px 12px;
  border-radius:20px;
  background:rgba(31,47,70,0.10);
  font-size:12px;
  margin-bottom:15px;
}

.small-line{
  margin-top:20px;
  font-size:14px;
  color:var(--accent);
}

.form-field{
  width:100%;
  margin-top:10px;
  padding:12px 14px;
  border-radius:10px;
  border:1px solid rgba(36,52,71,0.12);
  background:#ffffff;
  color:#1e2a38;
  box-sizing:border-box;
}

textarea.form-field{
  min-height:120px;
  resize:vertical;
}

.form-field.error{
  border-color:#ff4d4f;
  box-shadow:0 0 0 2px rgba(255,77,79,0.12);
}

.form-field.success{
  border-color:var(--accent);
}

.logo-wrap{
  margin-bottom:20px;
}

.logo-wrap img{
  height:60px;
  width:auto;
  display:block;
}

.bg-layer{
  position:fixed;
  inset:0;
  pointer-events:none;
  background-size:95%;
  background-repeat:no-repeat;
  background-position:center;
  background-attachment:fixed;
  opacity:0;
  transition:opacity 1s ease;
  mix-blend-mode:multiply;
  filter:contrast(var(--bg-contrast)) brightness(var(--bg-brightness));
}

.bg-layer.active{
  opacity:var(--bg-opacity);
}

.header{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:1000;
  background:rgba(247,248,250,0.92);
  backdrop-filter:blur(var(--header-blur));
  border-bottom:1px solid rgba(30,42,56,var(--header-border-opacity));
  transition:transform 0.28s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.header.scrolled{
  background:rgba(247,248,250,0.96);
  backdrop-filter:blur(14px);
  box-shadow:0 8px 24px rgba(30,42,56,0.10);
}

.header.header-hidden{
  transform:translateY(-100%);
}

.nav{
  width:92%;
  max-width:1240px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding:10px 0;
}

.menu-toggle{
  display:none;
  background:transparent;
  border:none;
  padding:0;
  cursor:pointer;
  width:34px;
  height:26px;
  flex-direction:column;
  justify-content:space-between;
  align-items:center;
  margin-left:auto;
  z-index:1201;
}

.menu-toggle span{
  display:block;
  width:100%;
  height:3px;
  border-radius:2px;
  background:var(--accent);
}

.logo{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px;
  height:100%;
  white-space:nowrap;
}

.logo img{
  height:64px;
  width:auto;
  display:block;
}

.logo img:hover{
  filter:contrast(1.35) brightness(1.08);
}

.logo-images{
  position:relative;
  width:fit-content;
  height:64px;
  overflow:visible;
}

.logo-images img{
  height:64px;
  width:auto;
  display:block;
  transition:opacity 0.25s ease;
}

.logo-default{
  opacity:1;
}

.logo-scrolled{
  position:absolute;
  top:0;
  left:0;
  opacity:0;
  pointer-events:none;
  transform:scale(1.5);
  transform-origin:left center;
}

.header.scrolled .logo-default{
  opacity:0;
}

.header.scrolled .logo-scrolled{
  opacity:1;
}

.logo-subtitle{
  font-size:12px;
  line-height:1.2;
  color:#2b3b4f;
  font-weight:500;
  letter-spacing:0.3px;
}

.logo-subline{
  font-size:12px;
  line-height:1.2;
  color:var(--accent);
  font-weight:600;
  letter-spacing:0.2px;
}

.nav-links{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
  min-width:0;
}

.nav-links a{
  color:#000000;
  text-decoration:none;
  font-size:15px;
  font-weight:600;
  letter-spacing:0.1px;
  line-height:1.1;
  transition:color 0.2s ease, opacity 0.2s ease, filter 0.2s ease, text-decoration-color 0.2s ease, text-shadow 0.2s ease;
  opacity:1;
  padding:7px 6px;
  border:none;
  border-radius:0;
  background:none;
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

#urunlerMenu > a,
#cozumlerMenu > a{
  font-weight:600;
}

.nav-item{
  position:relative;
  display:flex;
  align-items:center;
}

.nav-item > a{
  color:#000000;
  text-decoration:none;
  font-size:15px;
  font-weight:600;
  letter-spacing:0.1px;
  line-height:1.1;
  transition:color 0.2s ease, opacity 0.2s ease, filter 0.2s ease, text-decoration-color 0.2s ease, text-shadow 0.2s ease;
  opacity:1;
  padding:7px 6px;
  border:none;
  border-radius:0;
  background:none;
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.nav-item > a:hover{
  color:var(--accent);
  font-weight:600;
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:4px;
  opacity:1;
  filter:brightness(1.08) contrast(1.08);
  text-shadow:0 0 0.2px var(--accent), 0 0 3px rgba(31,47,70,0.10);
}

.dropdown-menu{
  position:absolute;
  top:100%;
  left:0;
  min-width:260px;
  padding-top:10px;
  padding-bottom:10px;
  background:rgba(255,255,255,0.98);
  border:1px solid rgba(31,47,70,0.22);
  border-radius:12px;
  box-shadow:0 18px 40px rgba(30,42,56,0.10);
  outline:1px solid rgba(31,47,70,0.32);
  display:none !important;
  flex-direction:column;
  z-index:1200;
}

.dropdown-menu a{
  padding:10px 16px;
  color:#2c3e50;
  text-decoration:none;
  font-size:14px;
  font-weight:500;
  white-space:nowrap;
  border:1px solid transparent;
  border-radius:8px;
  margin:2px 8px;
  transition:color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
  display:block;
  text-align:left;
}

.dropdown-menu a:hover{
  background:var(--accent-soft);
  border-color:var(--accent-border);
  color:var(--accent);
}

@media (hover:hover){
  .nav-item:hover .dropdown-menu{
    display:flex !important;
  }
}

.nav-links a:hover{
  color:var(--accent);
  font-weight:600;
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:5px;
  opacity:1;
  filter:brightness(1.08) contrast(1.08);
  text-shadow:0 0 0.2px var(--accent), 0 0 3px rgba(31,47,70,0.10);
}

.nav-links a.active{
  color:var(--accent);
  opacity:1;
  font-weight:700;
  text-decoration:underline;
  text-decoration-thickness:2.5px;
  text-underline-offset:5px;
  background:none;
  border:none;
  filter:brightness(1.12) contrast(1.10);
  text-shadow:0 0 0.25px var(--accent), 0 0 4px rgba(31,47,70,0.12);
}

#urunlerMenu > a.active,
#cozumlerMenu > a.active{
  font-weight:700;
}

.nav-links a.nav-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 16px;
  border-radius:999px;
  background-color:var(--accent) !important;
  border:1px solid var(--accent) !important;
  color:#ffffff !important;
  font-weight:700;
  text-decoration:none !important;
  white-space:nowrap;
  box-shadow:0 4px 12px rgba(31,47,70,0.18);
  transition:transform 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease;
}

.nav-links a.nav-cta:hover{
  background-color:var(--accent) !important;
  border-color:var(--accent) !important;
  color:#ffffff !important;
  text-decoration:none !important;
  transform:translateY(-1px);
  filter:brightness(1.08) contrast(1.08);
  box-shadow:0 8px 20px rgba(31,47,70,0.28);
}

.hero{
  position:relative;
  overflow:hidden;
  margin-top:var(--header-height);
  margin-bottom:10px;
  padding-bottom:20px;
}

.hero h1,
.hero h2,
.hero p{
  text-align:left;
}

.hero p{
  margin:0 0 12px;
}

.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size:40px 40px;
  opacity:0.1;
  pointer-events:none;
}

.hero-image{
  position:relative;
  width:80%;
  margin:20px auto 0;
  border-radius:12px;
  overflow:hidden;
  border:1px solid rgba(36,52,71,0.08);
  aspect-ratio:16/9;
  min-height:auto;
  background:#ffffff;
  transform:none;
}

.hero-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:top center;
  display:block;
}

.hero-blueprint{
  position:absolute;
  inset:0;
  opacity:0.45;
  filter:grayscale(1) contrast(120%) brightness(1.15);
  transition:opacity 4s ease 0.3s;
}

.hero-real{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity 4s ease 0.6s;
}

.hero-image.loaded .hero-real{
  opacity:1;
}

.hero-image.loaded .hero-blueprint{
  opacity:0;
}

.contact-block{
  margin-top:30px;
  max-width:760px;
  background:transparent;
  border:1.5px solid var(--accent);
  border-radius:14px;
  padding:18px;
  box-shadow:none;
  transition:background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.contact-map iframe{
  height:260px;
}

.contact-block:hover{
  background:var(--accent);
  border-color:var(--accent);
}

.contact-block:hover p,
.contact-block:hover a,
.contact-block:hover h2,
.contact-block:hover h3{
  color:#ffffff !important;
}

.contact-block p{
  margin:0 0 8px;
  color:#000000;
  line-height:1.7;
  font-size:15px;
  font-weight:400;
}

.contact-block a{
  color:#000000;
  text-decoration:none;
}

.contact-block a:hover{
  color:var(--text);
}

.contact-map{
  margin-top:14px;
  max-width:760px;
  border:1.5px solid var(--accent);
  border-radius:12px;
  overflow:hidden;
}

.contact-block:hover .contact-map{
  border-color:#ffffff;
}

#urun-gruplari{
  padding-top:20px;
}

#puu-yaklasim{
  padding-top:20px;
}

.partner-logo-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
  align-items:center;
  margin:0 0 28px 0;
}

.partner-logo{
  width:100%;
  max-height:90px;
  object-fit:contain;
  display:block;
  background:#ffffff;
  padding:12px;
  border:1.5px solid var(--accent);
  border-radius:12px;
}

.site-footer{
  margin-top:40px;
  border-top:1px solid rgba(31,47,70,0.14);
  background:rgba(255,255,255,0.30);
  backdrop-filter:blur(6px);
}

.footer-inner{
  width:90%;
  max-width:1200px;
  margin:auto;
  padding:26px 0 22px;
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr;
  gap:28px;
  align-items:start;
}

.footer-brand{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.footer-brand-title{
  margin:0;
  font-size:18px;
  font-weight:700;
  color:var(--accent);
  line-height:1.3;
}

.footer-brand-text{
  margin:0;
  font-size:14px;
  line-height:1.7;
  color:#1e2a38;
}

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

.footer-title{
  margin:0 0 2px;
  font-size:15px;
  font-weight:700;
  color:var(--accent);
}

.footer-line{
  margin:0;
  font-size:14px;
  line-height:1.7;
  color:#1e2a38;
}

.footer-line a{
  color:#1e2a38;
  text-decoration:none;
}

.footer-line a:hover{
  color:var(--accent);
  text-decoration:underline;
  text-underline-offset:4px;
}

.footer-bottom{
  width:90%;
  max-width:1200px;
  margin:auto;
  padding:14px 0 22px;
  border-top:1px solid rgba(31,47,70,0.10);
  font-size:13px;
  line-height:1.6;
  color:#445466;
}

@media (max-width: 768px){
  h1{font-size:34px}
  h2{font-size:22px}
  section{padding:44px 0}

  .header{
    min-height:var(--header-height);
  }

  #hero,
  #hakkimizda,
  #cozum-ozet,
  #cozum-gruplari,
  #urun-gruplari,
  #puu-yaklasim,
  #iletisim{
    scroll-margin-top:96px;
  }

  .nav{
    position:relative;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px 0;
    flex-wrap:nowrap;
  }

  .logo-scrolled{
    transform:scale(1.25);
  }

  .logo{
    max-width:calc(100% - 50px);
    min-width:0;
    align-items:flex-start;
  }

  .logo img{
    height:52px;
    filter:contrast(1.25) brightness(1.05);
  }

  .logo-images{
    height:52px;
  }

  .logo-images img{
    filter:contrast(1.25) brightness(1.05);
    height:52px;
  }

  .logo-subtitle,
  .logo-subline{
    display:none;
  }

  .nav-links{
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background:rgba(247,248,250,0.98);
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:16px;
    padding:20px 16px;
    display:none !important;
    z-index:1100;
    border-top:1px solid rgba(36,52,71,0.08);
    box-sizing:border-box;
  }

  .nav-links.active{
    display:flex !important;
  }

  .menu-toggle{
    display:flex !important;
    position:relative;
    z-index:1301;
    flex-shrink:0;
    width:34px;
    height:26px;
    margin-left:auto;
  }

  .nav-links a,
  .nav-item > a{
  font-size:15px;
  text-align:center;
  white-space:normal;
  word-break:break-word;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  width:auto;
  min-width:180px;
  line-height:1.25;
  padding-top:8px;
  padding-bottom:8px;
 }

  .dropdown-menu{
    position:static;
    min-width:auto;
    width:100%;
    box-shadow:none;
    border:none;
    border-radius:0;
    background:transparent;
    padding-top:6px;
    padding-bottom:0;
  }

  .dropdown-menu a{
    text-align:left;
    white-space:normal;
    word-break:break-word;
  }

 .lang-switch{
  border-left:none;
  padding-left:0;
  margin-left:0;
  margin-top:4px;
  width:auto;
  justify-content:center;
  }

  .lang-switch .lang-current,
  .lang-switch a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:auto !important;
  width:auto !important;
  padding:2px 6px;
  }

  .lang-switch a + span::before,
  .lang-switch span + a::before{
  margin:0 4px;
  }

  .hero{
    margin-top:90px;
  }

  .grid-2{
    grid-template-columns:1fr;
  }
  .site-footer{
    margin-top:28px;
  }

  .footer-inner{
    grid-template-columns:1fr;
    gap:18px;
    padding:22px 0 18px;
  }

  .footer-brand-title,
  .footer-title,
  .footer-brand-text,
  .footer-line,
  .footer-bottom{
    text-align:left;
  }
}