:root{
    --ink:#1f3a5f;          /* navy mürekkep */
    --ink-soft:#4a5a72;
    --ink-faint:#8792a3;
    --line:#e6e2dd;         /* sıcak nötr çizgi (mavi değil) */
    --line-strong:#1f3a5f;
    --paper:#fbfbf9;
    --wash:#fdf6f2;         /* çok soluk şeftali nefes (hero zemini, mavi yerine) */
    --sig:#3f74a8;          /* teknik mavi (sadece motor kartı skorlarında) */
    --accent:#ff8a70;       /* şeftali/mercan sıcak aksan (stitchu'nun kırmızı düğmesi) */
    --accent-deep:#e8623f;  /* koyu şeftali (hover) */
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:Helvetica,Arial,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;line-height:1.55;overflow-x:hidden;}
  .didot{font-family:'Didot','Bodoni 72',Georgia,serif;font-weight:400;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 48px;}

  /* ---- header (stitchu shell mantığı) ---- */
  header.top{max-width:1180px;margin:0 auto;padding:22px 48px;display:flex;align-items:center;justify-content:space-between;}
  .brandpatch{display:inline-block;padding:5px 13px;background:var(--ink);border:1px solid var(--ink);border-radius:2px;font-family:'Didot','Bodoni 72',Georgia,serif;font-size:21px;letter-spacing:.5px;line-height:1;color:#fff;text-decoration:none;}
  header.top nav{display:flex;align-items:center;gap:26px;}
  header.top nav a{font-size:13.5px;letter-spacing:.02em;color:var(--ink);text-decoration:none;}
  header.top nav a:hover{text-decoration:underline;text-underline-offset:3px;}
  header.top nav a.join{padding:8px 18px;background:var(--accent);color:#fff;border-radius:10px;font-weight:600;}
  header.top nav a.join:hover{background:var(--accent-deep);text-decoration:none;}

  /* ---- hero: sol=iddia+waitlist, sağ=öğrenen öneri çıktısı ---- */
  .hero{position:relative;background:var(--wash);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;}
  /* mavi deniz dokusu ÇOK soluk (artık boğmasın), zemin sıcak şeftali nefes */
  .hero::before{content:"";position:absolute;inset:0;z-index:0;opacity:.1;pointer-events:none;
    background:url('../assets/mib/sea-calm.jpg') center/cover no-repeat;}

  .hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.02fr 1.05fr;gap:48px;align-items:center;max-width:1180px;margin:0 auto;padding:64px 48px 80px;}

  /* gerçek asset serpme: kabuk/şişe/sürü/parşömen, az, döndürülmüş, tatlı (stitchu'da düğme saçması gibi) */
  .doodle{position:absolute;z-index:1;pointer-events:none;user-select:none;}
  .doodle.shell{top:12px;left:.5%;width:110px;transform:rotate(-9deg);opacity:1;filter:drop-shadow(0 8px 18px rgba(31,58,95,.14));}
  .doodle.bottle{bottom:8px;right:.5%;width:94px;transform:rotate(8deg);opacity:1;filter:drop-shadow(0 10px 20px rgba(31,58,95,.16));}
  .doodle.scroll{bottom:20px;left:1.5%;width:84px;transform:rotate(-5deg);opacity:.92;}
  .doodle.school{top:6px;right:33%;width:160px;opacity:.62;}
  .doodle.shell2{top:50%;right:1%;width:66px;transform:rotate(12deg);opacity:.85;}
  .doodle.fish{bottom:16%;left:30%;width:84px;transform:rotate(-4deg);opacity:.5;}

  .hero-copy h1{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:52px;line-height:1.12;font-weight:400;letter-spacing:-.01em;}
  .hero-copy h1 .soft{color:var(--ink-soft);}
  .hero-copy .lead{font-size:17px;line-height:1.62;color:var(--ink-soft);max-width:470px;margin-top:20px;}

  /* somut kanıt chip'leri (stitchu chip'leri gibi, sayı önde) */
  .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;}
  .chip{font-size:12.5px;color:var(--ink);border:1px solid var(--line-strong);border-radius:10px;padding:6px 14px;text-decoration:none;background:#fff;}
  .chip:hover{background:var(--accent);border-color:var(--accent);color:#fff;}

  .wl{margin-top:26px;max-width:440px;}
  .wl-row{display:flex;gap:8px;}
  .wl input{flex:1;font-size:14.5px;padding:13px 16px;border:1px solid var(--line-strong);border-radius:12px;background:#fff;color:var(--ink);outline:none;}
  .wl input:focus{box-shadow:inset 0 0 0 1px var(--ink);}
  .wl button{font-size:14.5px;padding:13px 24px;border:1px solid var(--accent-deep);border-radius:12px;background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap;position:relative;font-weight:600;}
  .wl button::after{content:"";position:absolute;inset:4px;border:1px dashed rgba(255,255,255,.6);border-radius:9px;pointer-events:none;}
  .wl button:hover{background:var(--accent-deep);}
  .wl button:disabled{opacity:.55;cursor:default;}
  .wl .msg{font-size:12.5px;color:var(--ink-soft);margin-top:10px;min-height:16px;}
  .wl .msg.ok{color:#1f6f4a;}
  .wl .msg.err{color:#a5342f;}

  /* ---- HERO KAHRAMANI: yazdıkça önerilerin değişmesi (gerçek çıktı, süs değil) ---- */
  .engine{background:#fff;border:1px solid var(--line-strong);border-radius:4px;box-shadow:0 20px 44px rgba(31,58,95,.12);overflow:hidden;}
  .engine .ehead{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line);}
  .engine .ehead .t{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);}
  .engine .ehead .v{font-size:11px;color:var(--sig);border:1px solid var(--line);border-radius:2px;padding:2px 7px;}
  .engine .cols{display:grid;grid-template-columns:1fr 1fr;}
  .engine .col{padding:16px 16px 18px;}
  .engine .col.before{border-right:1px solid var(--line);}
  .engine .clabel{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:12px;}
  .rec{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px dashed var(--line);}
  .rec:last-child{border-bottom:none;}
  .rec .nm{font-size:13.5px;color:var(--ink);flex:1;}
  /* çıplak ondalık YOK: uyum ok/etiketle sezdirilir */
  .rec .sc{font-size:11px;letter-spacing:.02em;color:var(--sig);border:1px solid var(--line);border-radius:2px;padding:1px 7px;white-space:nowrap;}
  .rec.gone{opacity:.5;}
  .rec.gone .nm{color:var(--ink-faint);}
  .rec.new .nm::before{content:"yeni  ";font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--sig);font-weight:700;}
  .rec.up .sc{border-color:var(--accent-deep);color:#fff;background:var(--accent);}
  /* KAHRAMAN CÜMLE: kullanıcının yazdığı, sistemin okuduğu şey — insani, büyük */
  .signal{grid-column:1 / -1;border-top:1px solid var(--line);padding:15px 16px 16px;background:var(--paper);}
  .signal .sl{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);}
  .signal .sh{font-size:15px;line-height:1.5;color:var(--ink);margin-top:6px;}
  .signal .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;}
  .signal .tags span{font-size:12.5px;color:var(--sig);border:1px solid var(--sig);border-radius:2px;padding:2px 9px;}
  /* gerçek mektup parçası: kağıt hissi */
  .snippet{grid-column:1 / -1;border-top:1px solid var(--line);padding:14px 18px 16px;background:#fff;}
  .snippet .sl{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:7px;}
  .snippet p{font-family:Georgia,serif;font-size:14px;line-height:1.6;color:var(--ink-soft);font-style:italic;}
  .ecap{font-size:11.5px;color:var(--ink-faint);margin-top:10px;text-align:center;}

  /* ---- bölüm köşe assetleri: sayfaya yayılmış, soluk, döndürülmüş (her bölümde 1-2, tıkışmadan) ---- */
  .sec{position:relative;overflow:hidden;}
  .deco{position:absolute;pointer-events:none;user-select:none;z-index:0;}
  .sec .wrap,.sec .why-inner,.sec .open-inner{position:relative;z-index:1;}
  /* nasıl çalışır köşe balığı */
  .deco.how-fish{top:30px;right:-8px;width:140px;transform:rotate(-8deg) scaleX(-1);opacity:.72;}
  /* neden farklı: kabuk sol alt, şişe sağ üst */
  .deco.why-shell{bottom:-14px;left:-16px;width:130px;transform:rotate(10deg);opacity:.85;filter:drop-shadow(0 10px 20px rgba(31,58,95,.1));}
  .deco.why-bottle{top:24px;right:2%;width:76px;transform:rotate(7deg);opacity:.8;}
  /* açık geliştirme (artık açık zemin): parşömen sol, şişe+kabuk sağ */
  .deco.open-scroll{bottom:16px;left:1%;width:104px;transform:rotate(-6deg);opacity:.9;}
  .deco.open-bottle{top:26px;right:1.5%;width:78px;transform:rotate(9deg);opacity:.85;}
  .deco.open-shell{bottom:-10px;right:6%;width:88px;transform:rotate(-11deg);opacity:.7;}
  /* kapanış: şişe + kabuk + balık, mektup dünyası kapanışı */
  .deco.close-bottle{top:0;left:6%;width:82px;transform:rotate(-8deg);opacity:.95;filter:drop-shadow(0 10px 18px rgba(31,58,95,.12));}
  .deco.close-shell{bottom:16px;right:7%;width:80px;transform:rotate(12deg);opacity:.75;}
  .deco.close-fish{top:20px;right:24%;width:96px;transform:rotate(-6deg) scaleX(-1);opacity:.5;}

  /* ---- nasıl çalışır: 3 adım, sade, ikon YOK (numaralı, stitchu tonu) ---- */
  .how{padding:80px 0;}
  .eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);}
  .how h2{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:32px;font-weight:400;margin-top:10px;max-width:620px;}
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:4px;margin-top:40px;overflow:hidden;}
  .step{background:#fff;padding:26px 24px;}
  .step .n{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:15px;color:var(--sig);font-variant-numeric:tabular-nums;}
  .step h3{font-size:18px;margin-top:8px;}
  .step p{font-size:14.5px;line-height:1.6;color:var(--ink-soft);margin-top:8px;}

  /* ---- neden farklı ---- */
  .why{background:var(--wash);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .why-inner{padding:72px 0;}
  .why h2{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:30px;font-weight:400;max-width:640px;}
  .why-list{margin-top:34px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:4px;overflow:hidden;}
  .why-item{background:#fff;padding:24px 24px;}
  .why-item h4{font-size:16px;}
  .why-item p{font-size:14.5px;line-height:1.58;color:var(--ink-soft);margin-top:7px;}

  /* ---- açık geliştirme (build-in-public + benchmark) — açık şeftali nefes, mavi blok kalktı ---- */
  .open{background:var(--wash);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .open-inner{padding:74px 0;}
  .open .eyebrow{color:var(--ink-faint);}
  .open h2{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:32px;font-weight:400;margin-top:10px;color:var(--ink);max-width:640px;}
  .open p.sub{font-size:15.5px;line-height:1.6;color:var(--ink-soft);max-width:600px;margin-top:14px;}
  .open-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:34px;}
  .ocard{background:#fff;border:1px solid var(--line);border-radius:10px;padding:24px;text-decoration:none;color:inherit;transition:border-color .16s,box-shadow .16s;}
  .ocard:hover{border-color:var(--accent);box-shadow:0 8px 22px rgba(255,138,112,.12);}
  .ocard h3{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:20px;font-weight:400;color:var(--ink);}
  .ocard p{font-size:14px;color:var(--ink-soft);margin-top:8px;}
  .ocard .go{font-size:12.5px;color:var(--accent-deep);margin-top:14px;display:inline-block;border-bottom:1px solid var(--accent);padding-bottom:1px;font-weight:600;}

  /* ---- kapanış ---- */
  .close{text-align:center;padding:82px 0 40px;}
  .close h2{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:38px;font-weight:400;letter-spacing:-.01em;}
  .close p{font-size:16px;color:var(--ink-soft);margin-top:12px;}
  .close .wl{margin:24px auto 0;}

  footer{border-top:1px solid var(--line);padding:26px 48px;display:flex;align-items:center;justify-content:space-between;max-width:1180px;margin:56px auto 0;}
  footer .fbrand{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:16px;}
  footer .flinks{display:flex;gap:20px;}
  footer a{color:var(--ink-faint);font-size:12.5px;text-decoration:none;}
  footer a:hover{color:var(--ink);}

  @media(max-width:900px){
    header.top,.wrap,footer{padding-left:20px;padding-right:20px;}
    header.top nav a:not(.join){display:none;}
    .hero-grid{grid-template-columns:1fr;padding:36px 20px 54px;gap:34px;}
    .hero-copy h1{font-size:38px;}
    .stamp{display:none;}
    .steps,.why-list,.open-cards{grid-template-columns:1fr;}
    .how h2,.why h2,.open h2,.close h2{font-size:26px;}
  }

/* ============ İç sayfa ortak: makale + benchmark (index kabuğuyla aynı dünya) ============ */
.page-head{max-width:820px;margin:0 auto;padding:60px 48px 8px;position:relative;}
.page-head .eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);}
.page-head h1{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:42px;line-height:1.1;font-weight:400;letter-spacing:-.01em;margin-top:12px;}
.page-head p.intro{font-size:17px;line-height:1.6;color:var(--ink-soft);margin-top:16px;max-width:600px;}

/* blog akışı */
.feed{max-width:760px;margin:0 auto;padding:26px 48px 90px;}
article.post{border-top:1px solid var(--line);padding:44px 0;}
article.post .meta{font-size:13px;color:var(--ink-faint);letter-spacing:.02em;}
article.post h2{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:27px;line-height:1.22;font-weight:400;margin-top:8px;}
article.post .body{margin-top:18px;}
article.post .body p{font-size:16px;color:#243449;margin-top:14px;line-height:1.7;}
article.post .body p:first-child{margin-top:0;}
article.post .body h3{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:19px;font-weight:400;margin-top:26px;}
article.post .pull{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:20px;color:var(--ink);border:1px solid var(--line);background:var(--paper);border-radius:5px;padding:20px 22px;margin:24px 0;}
.upcoming{border-top:1px solid var(--line);padding:44px 0 0;}
.upcoming h3{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);}
.upcoming ol{list-style:none;counter-reset:u;margin-top:22px;}
.upcoming li{counter-increment:u;font-size:17px;color:var(--ink-soft);padding:14px 0 14px 44px;position:relative;border-bottom:1px dashed var(--line);}
.upcoming li::before{content:counter(u,decimal-leading-zero);position:absolute;left:0;top:14px;font-family:'Didot','Bodoni 72',Georgia,serif;font-size:15px;color:var(--sig);}
.upcoming .tag{font-size:12px;color:var(--ink-faint);letter-spacing:.04em;margin-left:8px;}

/* benchmark */
.bench{max-width:820px;margin:0 auto;padding:0 48px;}
.banner{background:var(--wash);border:1px solid var(--line);border-radius:6px;padding:20px 24px;display:flex;gap:14px;align-items:flex-start;margin-top:34px;}
.banner .dot{width:9px;height:9px;border-radius:50%;background:var(--sig);margin-top:7px;flex:none;box-shadow:0 0 0 4px rgba(63,116,168,.16);}
.banner p{font-size:15px;color:#243449;line-height:1.6;}
.banner strong{font-weight:700;}
.sec-title{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:40px 0 20px;}
.metrics{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.metric{border:1px solid var(--line);border-radius:6px;padding:22px;background:#fff;}
.metric .name{font-size:16px;font-weight:700;}
.metric .val{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:30px;color:var(--ink);margin-top:10px;}
.metric .val.pending{color:var(--ink-faint);font-style:italic;font-size:22px;}
.metric .desc{font-size:14px;color:var(--ink-soft);margin-top:8px;line-height:1.6;}
.method{max-width:820px;margin:52px auto 0;padding:0 48px 90px;}
.method h2{font-family:'Didot','Bodoni 72',Georgia,serif;font-size:26px;font-weight:400;}
.method p{font-size:16px;color:#243449;margin-top:14px;line-height:1.7;}
.method table{width:100%;border-collapse:collapse;margin-top:24px;font-size:14px;}
.method th,.method td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);}
.method th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);background:var(--paper);}
.method td.v{font-weight:700;}
.method .src{font-size:13px;color:var(--ink-faint);margin-top:16px;}
.method .src a{color:var(--ink-soft);}

@media(max-width:900px){
  .page-head,.feed,.bench,.method{padding-left:22px;padding-right:22px;}
  .page-head h1{font-size:32px;}
  .metrics{grid-template-columns:1fr;}
}

/* ---- yumuşak scroll-beliriş: bölümler kayarken belirir (premium geçiş, sade) ---- */
@media (prefers-reduced-motion: no-preference){
  .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease;}
  .reveal.in{opacity:1;transform:none;}
}