:root{
  --bg:#f7fbf9;
  --surface:#ffffff;
  --surface-soft:#effaf5;
  --text:#172235;
  --muted:#6d788a;
  --line:#e5ece9;
  --green:#159b68;
  --green-dark:#08754e;
  --green-soft:#e4f7ee;
  --blue:#3b82f6;
  --orange:#f59e0b;
  --purple:#8b5cf6;
  --shadow:0 18px 50px rgba(23,34,53,.08);
  --radius:20px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,Segoe UI,Arial,sans-serif;
  color:var(--text);
  background:var(--bg);
  overflow-x:hidden;
}
a{color:inherit}
button,input{font:inherit}

.container{width:92vw;max-width:none;margin:0 auto}

/* Header: masaüstünde kenarlara yapışmasın, ekran genişledikçe akışkan kalsın */
.header .nav{
  width:calc(100% - clamp(32px,6vw,120px));
  margin:0 auto;
}

/* Üst duyuru */
.announcement{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  padding:9px 48px 9px 18px;
  background:#dff7eb;
  color:#146746;
  font-size:13px;
  font-weight:650;
  position:relative;
}
.announcement button{
  position:absolute;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  width:25px;
  height:25px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#4c7867;
  cursor:pointer;
  font-size:20px;
  line-height:1;
}
.announcement button:hover{background:rgba(8,117,78,.08)}

/* Header */
.header{
  position:relative;
  z-index:20;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--line);
}
.nav{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:26px;
}
.brand{
  text-decoration:none;
  display:flex;
  flex-direction:column;
  min-width:max-content;
}
.brand-main{
  font-size:25px;
  line-height:1;
  font-weight:850;
  letter-spacing:-1.2px;
}
.brand-main strong{color:var(--green)}
.brand-sub{
  margin-top:4px;
  color:#8791a1;
  font-size:10px;
  font-weight:650;
  letter-spacing:.25px;
}
.menu{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  flex:1;
}
.menu a{
  padding:10px 11px;
  border-radius:10px;
  color:#5e697b;
  text-decoration:none;
  font-size:13px;
  font-weight:650;
  transition:.2s ease;
}
.menu a:hover{
  color:var(--green);
  background:#f0faf6;
}
.menu a.active{
  color:var(--green);
  background:#eaf8f2;
}
.nav-actions{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:max-content;
}
.btn{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 17px;
  border-radius:11px;
  text-decoration:none;
  font-size:13px;
  font-weight:750;
  border:1px solid transparent;
  cursor:pointer;
  transition:.2s ease;
}
.btn-outline{
  background:#fff;
  color:#315047;
  border-color:#d6e2de;
}
.btn-outline:hover{
  border-color:#9ecdbb;
  background:#f6fcf9;
}
.btn-primary{
  color:#fff;
  background:linear-gradient(135deg,#159b68,#0b8054);
  box-shadow:0 9px 22px rgba(21,155,104,.18);
}
.btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 28px rgba(21,155,104,.24);
}
.btn-large{
  min-height:50px;
  padding:0 22px;
  border-radius:13px;
}
.mobile-menu{
  display:none;
  width:42px;
  height:42px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  color:#536173;
}

/* Kullanıcı menüsü */
.user-menu{position:relative}
.user-button{
  border:1px solid #d7e2df;
  background:#fff;
  border-radius:10px;
  min-height:42px;
  padding:5px 10px 5px 6px;
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  color:#10213d;
}
.user-avatar{
  width:31px;height:31px;border-radius:50%;
  background:#e3f7ef;color:#07855c;
  display:grid;place-items:center;
  font-size:12px;font-weight:800;
}
.user-welcome{
  font-size:12px;font-weight:700;
  max-width:170px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;
}
.user-arrow{font-size:16px;color:#71829b}
.user-dropdown{
  display:none;
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  min-width:170px;
  background:#fff;
  border:1px solid #dfe8e5;
  border-radius:11px;
  padding:7px;
  box-shadow:0 15px 35px rgba(13,27,42,.12);
  z-index:50;
}
.user-menu.open .user-dropdown{display:block}
.user-dropdown a,.user-dropdown button{
  display:block;width:100%;
  border:0;background:none;
  text-align:left;
  padding:10px 11px;
  border-radius:7px;
  color:#243753;
  font-size:13px;
  text-decoration:none;
  cursor:pointer;
}
.user-dropdown a:hover,.user-dropdown button:hover{
  background:#f1faf7;color:#07855c;
}
.user-dropdown form{margin:0}

/* Hero */
.hero{
  position:relative;
  overflow:hidden;
  padding:78px 0 72px;
  background:
    radial-gradient(circle at 83% 18%,rgba(55,196,139,.13),transparent 29%),
    radial-gradient(circle at 18% 70%,rgba(88,173,255,.08),transparent 27%),
    linear-gradient(180deg,#f4fbf8 0%,#f8fcfb 100%);
}
.hero:before{
  content:"";
  position:absolute;
  width:430px;height:430px;
  border-radius:50%;
  right:-160px;top:-150px;
  border:65px solid rgba(21,155,104,.045);
  pointer-events:none;
}
.hero:after{
  content:"";
  position:absolute;
  width:220px;height:220px;
  left:-110px;bottom:-100px;
  border-radius:50%;
  background:rgba(59,130,246,.035);
  pointer-events:none;
}
.hero-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(470px,.95fr);
  align-items:center;
  gap:65px;
}
.hero-copy{max-width:610px}
.eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:#e8f8f1;
  color:#13865d;
  font-size:11px;
  font-weight:800;
  letter-spacing:.15px;
}
.eyebrow:before{
  content:"";
  width:7px;height:7px;
  margin-right:8px;
  border-radius:50%;
  background:#21b77b;
  box-shadow:0 0 0 4px rgba(33,183,123,.1);
}
.hero h1{
  margin:20px 0 0;
  font-size:clamp(45px,5.2vw,72px);
  line-height:1.02;
  letter-spacing:-3.4px;
  font-weight:850;
  color:#172235;
}
.hero h1 span{color:var(--green)}
.hero-copy>p{
  margin:22px 0 0;
  max-width:570px;
  color:#687488;
  font-size:16px;
  line-height:1.75;
  font-weight:500;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:11px;
  margin-top:29px;
}
.trust-list{
  display:flex;
  flex-wrap:wrap;
  gap:17px;
  margin-top:25px;
  color:#657184;
  font-size:12px;
  font-weight:650;
}
.trust-list span{white-space:nowrap}
.trust-list span:first-letter{color:#159b68}

/* Performans kartı */
.performance-card{
  position:relative;
  background:rgba(255,255,255,.94);
  border:1px solid #e1ebe7;
  border-radius:25px;
  padding:27px;
  box-shadow:0 28px 70px rgba(31,52,45,.11);
}
.performance-card:before{
  content:"";
  position:absolute;
  width:120px;height:120px;
  border-radius:50%;
  right:-45px;top:-45px;
  background:#e6f7ef;
  z-index:-1;
}
.card-title{
  margin-bottom:24px;
  color:#25354d;
  font-size:16px;
  font-weight:800;
}
.performance-main{
  display:grid;
  grid-template-columns:165px 1fr;
  align-items:center;
  gap:28px;
}
.score-ring{
  width:158px;
  height:158px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:conic-gradient(var(--green) 0 var(--score),#e8f0ed var(--score) 360deg);
  transform:rotate(-90deg);
}
.score-center{
  width:116px;
  height:116px;
  border-radius:50%;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  transform:rotate(90deg);
  box-shadow:inset 0 0 0 1px #edf2ef;
}
.score-center strong{
  color:#172235;
  font-size:29px;
  letter-spacing:-1px;
}
.score-center span{
  margin-top:4px;
  color:#7b8798;
  font-size:10px;
  font-weight:650;
}
.bars{display:grid;gap:15px}
.bar-row>div:first-child{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:7px;
}
.bar-row span{
  color:#586579;
  font-size:11px;
  font-weight:650;
}
.bar-row b{
  color:#283950;
  font-size:11px;
  font-weight:800;
}
.bar-track{
  height:8px;
  overflow:hidden;
  border-radius:999px;
  background:#edf2ef;
}
.bar-track i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#21ae79,#62d1a4);
}
.bar-row:nth-child(2) .bar-track i{background:linear-gradient(90deg,#4d91f5,#77b0ff)}
.bar-row:nth-child(3) .bar-track i{background:linear-gradient(90deg,#f2ae29,#ffd16e)}
.bar-row:nth-child(4) .bar-track i{background:linear-gradient(90deg,#ef6e65,#f4a39d)}
.mini-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:11px;
  margin-top:24px;
}
.mini{
  min-height:84px;
  padding:14px;
  border:1px solid #e8eeeb;
  background:#fbfdfc;
  border-radius:15px;
}
.mini strong{
  display:block;
  color:#172235;
  font-size:22px;
  line-height:1;
  letter-spacing:-.7px;
}
.mini span{
  display:block;
  margin-top:9px;
  color:#8791a1;
  font-size:10px;
  font-weight:650;
}

/* İstatistikler */
.stats-section{
  position:relative;
  z-index:2;
  margin-top:-24px;
}
.stats-card{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  background:#fff;
  border:1px solid #e3ebe8;
  border-radius:18px;
  box-shadow:var(--shadow);
  overflow:hidden;
}
.stat{
  min-height:102px;
  padding:22px 17px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  border-right:1px solid #edf1ef;
}
.stat:last-child{border-right:0}
.stat strong{
  color:#162237;
  font-size:22px;
  font-weight:850;
  letter-spacing:-.6px;
}
.stat span{
  margin-top:7px;
  color:#818b9b;
  font-size:11px;
  font-weight:650;
}

/* Özellikler */
.features-section{
  padding:92px 0 100px;
  background:#fff;
}
.section-heading{
  max-width:720px;
  margin:0 auto 42px;
  text-align:center;
}
.section-heading .eyebrow{margin-bottom:16px}
.section-heading h2{
  margin:0;
  color:#172235;
  font-size:clamp(32px,4vw,48px);
  line-height:1.08;
  letter-spacing:-2px;
}
.section-heading p{
  margin:15px auto 0;
  color:#7a8596;
  font-size:15px;
  line-height:1.7;
}
.features-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:17px;
}
.feature{
  min-height:235px;
  padding:25px;
  border:1px solid #e6ecea;
  border-radius:21px;
  background:#fff;
  box-shadow:0 12px 35px rgba(29,48,43,.045);
  transition:.22s ease;
}
.feature:hover{
  transform:translateY(-5px);
  box-shadow:0 20px 45px rgba(29,48,43,.09);
}
.feature:nth-child(1){background:#f1fbf6}
.feature:nth-child(2){background:#f3f8ff}
.feature:nth-child(3){background:#f7f4ff}
.feature:nth-child(4){background:#fff7ed}
.feature-icon{
  width:52px;height:52px;
  display:grid;
  place-items:center;
  margin-bottom:20px;
  border-radius:16px;
  background:#dff6eb;
  color:#119365;
  font-size:23px;
  font-weight:800;
}
.feature:nth-child(2) .feature-icon{background:#e5efff;color:#3d82ea}
.feature:nth-child(3) .feature-icon{background:#eee7ff;color:#8158e8}
.feature:nth-child(4) .feature-icon{background:#ffebd5;color:#ed9417}
.feature h3{
  margin:0 0 10px;
  color:#24334a;
  font-size:17px;
  font-weight:800;
}
.feature p{
  margin:0;
  color:#7b8697;
  font-size:13px;
  line-height:1.7;
  font-weight:500;
}

/* Footer */
.footer{
  border-top:1px solid #e5ebe9;
  background:#f7faf9;
}
.footer-inner{
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  color:#8a94a2;
  font-size:11px;
  font-weight:650;
}

/* Responsive */
@media(max-width:1050px){
  .menu{gap:0}
  .menu a{padding-left:8px;padding-right:8px;font-size:12px}
  .hero-grid{grid-template-columns:1fr;gap:45px}
  .hero-copy{max-width:760px}
  .performance-card{width:min(680px,100%);margin:0 auto}
  .features-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:800px){
  .container{width:calc(100% - 28px);max-width:none}
  .header .nav{width:calc(100% - 28px);margin:0 auto}
  .nav{min-height:68px}
  .menu{
    display:none;
    position:absolute;
    left:14px;right:14px;
    top:calc(100% + 8px);
    padding:8px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    box-shadow:0 18px 40px rgba(20,35,30,.1);
    flex-direction:column;
    align-items:stretch;
  }
  .menu.open{display:flex}
  .menu a{text-align:left}
  .nav-actions{margin-left:auto}
  .mobile-menu{display:block}
  .hero{padding:55px 0 65px}
  .hero h1{letter-spacing:-2.5px}
  .stats-card{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2n){border-right:0}
  .stat:nth-child(n+3){border-top:1px solid #edf1ef}
}
@media(max-width:600px){
  .announcement{font-size:11px;padding-right:45px;text-align:center}
  .brand-main{font-size:22px}
  .user-welcome{display:none}
  .nav-actions .btn{display:none}
  .hero h1{font-size:42px}
  .hero-copy>p{font-size:14px}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%}
  .trust-list{gap:10px 13px}
  .performance-card{padding:18px}
  .performance-main{grid-template-columns:1fr}
  .score-ring{margin:0 auto}
  .mini-grid{grid-template-columns:1fr}
  .stats-section{margin-top:-18px}
  .stats-card{grid-template-columns:1fr 1fr}
  .stat{min-height:86px;padding:16px 8px}
  .stat strong{font-size:18px}
  .features-section{padding:65px 0 75px}
  .features-grid{grid-template-columns:1fr}
  .section-heading h2{font-size:34px}
  .footer-inner{min-height:70px}
}