/* Tema D "Birleşik": Fraunces başlıklar + Manrope gövde, krem zemin, antrasit başlık, turkuaz vurgu.
   Eski görünüme dönmek için adrese ?tema=eski ekleyin (geri almak için ?tema=d). */
html.td{--serif:'Fraunces',Georgia,serif}
html.td body{font-family:'Manrope',system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
html.td header h1,html.td .hero h2,html.td .card h2,html.td .card h3,html.td .plan h4,html.td .brandline{font-family:var(--serif)}
html.td header h1{font-weight:800;letter-spacing:-.3px}
html.td .hero h2{font-weight:800;letter-spacing:-1px;line-height:1.05}
html.td .hero h2 em{font-style:italic;font-weight:500}
html.td .pprice b,html.td .dcard b.dleft,html.td .dcard .dleft{font-family:var(--serif);font-weight:800}
html.td button{border-radius:99px;font-weight:700}
html.td button.small{border-radius:99px}
html.td #topTabs{border-radius:99px}
html.td #topTabs button{border-radius:99px}
html.td button.addc{border-radius:99px}
html.td .tag{border-radius:99px}
html.td .plan.hl{border-radius:20px}
html.td .plan{border-radius:20px}
@media (prefers-color-scheme:light){
  html.td{--bg:#f6f4ee;--line:#ddd8cb;--mute:#5b6572}
  html.td header{background:#1f2933;border-bottom:3px solid #14b8a6}
  html.td .hero{background:#1f2933}
  html.td .slogan{background:#fff}
}
/* Daha belirgin ikinci tur */
html.td h2,html.td .pgtitle{font-family:var(--serif);font-weight:800;letter-spacing:-.6px}
html.td .pgtitle{font-size:34px;line-height:1.1}
html.td .dtile{border-radius:14px}
html.td .dtile b{font-family:var(--serif);font-size:28px;font-weight:800}
html.td .hitem{border-radius:18px;padding:14px}
html.td .hitem:hover{box-shadow:0 10px 28px rgba(16,24,40,.12)}
html.td .slogan{border-radius:18px;font-family:var(--serif);font-size:17px}
html.td .slogan small{font-family:'Manrope',system-ui,sans-serif}
html.td .card{border-radius:20px}
html.td input,html.td select,html.td textarea{border-radius:14px}
html.td .dcard{border-radius:18px}
html.td .dcard .dtm,html.td .dcard b{font-family:var(--serif)}
@media (prefers-color-scheme:light){
  html.td{--bg:#f1eee4}
  html.td .card,html.td .hitem,html.td .dcard,html.td .plan{background:#fffdf8}
  html.td .dtile{background:#e1f3ee}
}

/* ===== Üçüncü tur: şablondaki (Web D) düzene yaklaştırma ===== */
html.td body{background:var(--bg);background-image:none}
/* Giriş yapmamış görünüm: sol büyük başlık, sağda giriş kartı */
html.td main:has(#hero:not(.hidden)){max-width:1120px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);column-gap:48px;align-items:center;padding:40px 24px}
html.td main:has(#hero:not(.hidden)) #landing,html.td main:has(#hero:not(.hidden)) #app{grid-column:1/-1}
@media (max-width:860px){html.td main:has(#hero:not(.hidden)){display:block;padding:20px 16px}}
html.td .hero{background:transparent;color:var(--ink);box-shadow:none;border:0;padding:0;overflow:visible}
html.td .hero:after{display:none}
html.td .hero .kicker{display:inline-block;color:var(--ink);font-size:12px;letter-spacing:1.4px;border:1.5px solid var(--ink);border-radius:99px;padding:6px 14px;margin-bottom:18px}
html.td .hero h2{font-size:clamp(40px,7vw,68px);line-height:1;letter-spacing:-2px;margin:0 0 18px;color:var(--ink)}
html.td .hero h2 em{background:none;color:#0f766e;-webkit-text-fill-color:#0f766e;font-style:italic;font-weight:500}
html.td .hero p{font-size:19px;line-height:1.6;color:#475569;opacity:1;max-width:480px}
html.td .hero .chips span{background:transparent;color:var(--ink);border:1.5px solid #cbd5e1;font-weight:600}
html.td #auth{box-shadow:0 8px 30px rgba(15,23,42,.10);border-radius:22px;padding:24px}
/* Numaralı adımlar */
html.td .steps{counter-reset:st;gap:24px}
html.td .step{background:transparent;border:0;border-top:3px solid #14b8a6;border-radius:0;box-shadow:none;padding:16px 0 0}
html.td .step:hover,html.td .feat:hover{transform:none}
html.td .num{counter-increment:st;width:auto;height:auto;background:none;border-radius:0;justify-content:flex-start;font-size:0;color:transparent}
html.td .num:before{content:"0" counter(st);font-family:var(--serif);font-size:44px;font-weight:800;color:#b45309;line-height:1}
html.td .step h4{font-family:'Manrope',system-ui,sans-serif;font-weight:800;font-size:19px;margin:6px 0 6px}
html.td .sec{font-family:var(--serif);font-size:30px;font-weight:800;letter-spacing:-.6px;margin:44px 4px 16px}
html.td .feat{border-radius:20px}
/* Fiyat: koyu bant */
html.td #landing #pricingBox{background:#1f2933;border-radius:26px;padding:30px}
html.td #landing #pricingBox .plan{background:transparent;color:#fff;border:1px solid #5b6572;box-shadow:none;border-radius:20px}
html.td #landing #pricingBox .plan .pprice small,html.td #landing #pricingBox .plan .psave,html.td #landing #pricingBox .pnote,html.td #landing #pricingBox .plan li{color:#d6dde4}
html.td #landing #pricingBox .plan h4{color:#fff}
html.td #landing #pricingBox .plan.hl{background:#14b8a6;color:#0b2a27;border-color:#14b8a6}
html.td #landing #pricingBox .plan.hl h4,html.td #landing #pricingBox .plan.hl .pprice small,html.td #landing #pricingBox .plan.hl .psave,html.td #landing #pricingBox .plan.hl li{color:#0b2a27}
html.td #landing #pricingBox .plan.hl li:before{background:rgba(11,42,39,.18)}html.td #landing #pricingBox .plan.hl li:after{border-color:#0b2a27}
html.td #landing #pricingBox .plan.hl button{background:#1f2933;color:#fff}
html.td #landing #pricingBox .plan .pprice b{font-family:var(--serif);font-size:40px}
html.td .cta{border-radius:26px;background:#14b8a6;color:#0b2a27;padding:30px}
html.td .cta h3{font-family:var(--serif);font-size:30px;letter-spacing:-.6px}
html.td .cta button{background:#1f2933;color:#fff}
html.td .faq{border-radius:14px}
/* Uygulama içi: telefon şablonu */
html.td header h1 small{color:#5eead4;opacity:1}
html.td #topTabs{background:#fffdf8}
html.td .slogan{background:#fffdf8}
html.td button.mrow,html.td button.mrow:not(.ghost){border-radius:0}
html.td .hs b{font-family:var(--serif);font-weight:800}

/* Giriş ekranı: giriş kartı yukarıda, altında uygulama indirme kartı */
html.td main:has(#hero:not(.hidden)){align-items:start}
html.td main:has(#hero:not(.hidden)) #hero{grid-column:1;grid-row:1/3}
html.td main:has(#hero:not(.hidden)) #auth{grid-column:2;grid-row:1;align-self:start;margin-top:0}
html.td main:has(#hero:not(.hidden)) #appDl{grid-column:2;grid-row:2;align-self:start;margin-top:16px}
html.td main:not(:has(#hero:not(.hidden))) #appDl{display:none}
@media (max-width:860px){html.td main:has(#hero:not(.hidden)) #appDl{margin-top:12px}}
