/* Siyah-beyaz, modern, sade */
:root{
  --bg: #ffffff;
  --fg: #000000;
  --muted: #666;
  --accent-border: #000;
  --radius: 14px;
  --maxw: 780px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px;
}

/* Ana container */
.container{
  width:100%;
  max-width:var(--maxw);
  text-align:center;
  border-radius:18px;
  padding:48px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
  border: 1px solid rgba(0,0,0,0.06);
}

/* Üst marka */
.brand{
  display:flex;
  align-items:center;
  gap:14px;
  justify-content:center;
  margin-bottom:28px;
}

.logo{
  width:64px;
  height:64px;
  border-radius:12px;
  background:var(--fg);
  color:var(--bg);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:30px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
}

.brand-text{
  display:flex;
  flex-direction:column;
  line-height:1;
  text-align:left;
}

.company{
  font-weight:700;
  font-size:16px;
}

.subtitle{
  font-size:12px;
  color:var(--muted);
}

/* Hero */
.hero-title{
  font-size:40px;
  margin:6px 0;
  letter-spacing:-0.02em;
}

.hero-desc{
  margin:0 0 22px 0;
  color:var(--muted);
}

/* Buton */
.cta{
  display:inline-block;
  text-decoration:none;
  padding:14px 28px;
  border-radius:12px;
  border:2px solid var(--accent-border);
  font-weight:600;
  letter-spacing:0.02em;
  transition: transform .14s ease, background .14s ease, color .14s ease;
  background:var(--bg);
  color:var(--fg);
  box-shadow:none;
}

.cta:hover{
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
}

/* Küçük yazılar */
.small{
  margin-top:16px;
  font-size:12px;
  color:var(--muted);
}

/* Footer */
.foot{
  margin-top:28px;
  font-size:12px;
  color:var(--muted);
}

/* Responsive */
@media (max-width:520px){
  .container{padding:28px}
  .hero-title{font-size:28px}
  .logo{width:52px;height:52px;font-size:24px}
}