/* ── TAZQ 2.0 SİTESİ (2026-11-01) ─────────────────────────────────────────────
     Uygulamanın 2.0 kimliği: gece zemini + "mürekkep aura" + malzemeli TAZQ yazısı.
     Hero ve odak bölümü koyu (uygulamanın açılışı ve odak ekranı gibi), içerik
     bölümleri sistemin temasına uyar (açık/koyu). Eski sayfa: brand-archive/2026-11-01/site. */
  :root{
    --bg:#F5F5F7; --card:#FFFFFF; --line:rgba(15,18,30,.08); --line-2:rgba(15,18,30,.05);
    --ink:#0E1220; --muted:#545B6B; --faint:#9AA0AE;
    --primary:#2F6BFF; --primary-soft:rgba(47,107,255,.10);
    --night:#04060E; --night-2:#0A0E1C; --silver:#E7EAF2;
    --aura-1:rgba(64,92,255,.42); --aura-2:rgba(126,87,255,.32); --aura-3:rgba(45,200,190,.16);
    --emerald:#10B981; --amber:#F59E0B; --rose:#F43F5E; --violet:#8B5CF6; --teal:#14B8A6;
    --r-lg:28px; --r-md:18px; --r-sm:12px;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#05070F; --card:#0C1120; --line:rgba(231,234,242,.09); --line-2:rgba(231,234,242,.05);
      --ink:#EEF0F6; --muted:#A3AABA; --faint:#6B7384; --primary:#6E95FF; --primary-soft:rgba(110,149,255,.12);
    }
  }
  *{box-sizing:border-box; margin:0; padding:0}
  html{scroll-behavior:smooth}
  body{background:var(--bg); color:var(--ink);
    font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    -webkit-font-smoothing:antialiased; overflow-x:hidden; line-height:1.6}
  a{color:inherit; text-decoration:none}
  img{max-width:100%}
  .wrap{max-width:1120px; margin:0 auto; padding:0 20px}
  .eyebrow{font-weight:700; letter-spacing:.18em; font-size:12px; text-transform:uppercase; color:var(--primary)}
  .h2{font-size:clamp(28px,4vw,44px); font-weight:800; letter-spacing:-.035em; line-height:1.08; margin-top:12px; text-wrap:balance}
  .lede{color:var(--muted); font-size:clamp(15.5px,1.6vw,18px); margin-top:14px; max-width:56ch; text-wrap:pretty}
  section{padding:112px 0 0}
  @media(max-width:720px){ section{padding:80px 0 0} }

  /* Mağaza düğmeleri */
  .badges{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
  .badge{display:inline-flex; align-items:center; gap:10px; height:52px; padding:0 18px; border-radius:14px;
    background:#fff; color:#000; transition:transform .15s, box-shadow .15s; box-shadow:0 10px 30px rgba(0,0,0,.25)}
  a.badge:hover{transform:translateY(-2px)}
  .badge .txt{display:flex; flex-direction:column; line-height:1; text-align:left}
  .badge .sub{font-size:9.5px; letter-spacing:.3px; opacity:.75}
  .badge .main{font-size:18px; font-weight:700; margin-top:2px}
  .badge.soon{background:rgba(255,255,255,.08); color:#fff; box-shadow:none; border:1px solid rgba(255,255,255,.16); position:relative}
  .badge.soon .ribbon{position:absolute; top:-9px; right:-8px; background:var(--emerald); color:#fff; font-size:9px; font-weight:800; letter-spacing:.4px; padding:3px 8px; border-radius:999px}

  /* ── NAV ── */
  nav{position:fixed; top:0; left:0; right:0; z-index:50; transition:background .25s, border-color .25s; border-bottom:1px solid transparent}
  nav.solid{background:rgba(5,8,18,.94); border-color:rgba(255,255,255,.06)}
  .nav-in{max-width:1120px; margin:0 auto; padding:14px 20px; display:flex; align-items:center; justify-content:space-between; gap:16px}
  .nav-brand img{height:26px; width:auto; display:block}
  .nav-brand{transition:opacity .25s} nav:not(.solid) .nav-brand{opacity:0; pointer-events:none}
  .nav-right{display:flex; align-items:center; gap:24px}
  .nav-links{display:flex; gap:26px}
  .nav-links a{color:rgba(231,234,242,.7); font-weight:600; font-size:14px; transition:color .15s}
  .nav-links a:hover{color:#fff}
  .lang{display:flex; background:rgba(255,255,255,.08); border-radius:999px; padding:3px}
  .lang button{border:0; background:transparent; color:rgba(231,234,242,.7); font-weight:700; font-size:12px; padding:6px 11px; border-radius:999px; cursor:pointer; font-family:inherit}
  .lang button.on{background:rgba(255,255,255,.92); color:#04060E}
  @media(max-width:760px){ .nav-links{display:none} }

  /* ── HERO (gece + aura) ── */
  .hero{position:relative; background:var(--night); color:var(--silver); overflow:hidden; padding:128px 0 0; isolation:isolate}
  .hero::before{content:""; position:absolute; inset:-20% -10% 0; z-index:-2;
    background:
      radial-gradient(40% 36% at 22% 22%, var(--aura-1), transparent 70%),
      radial-gradient(36% 32% at 80% 30%, var(--aura-2), transparent 70%),
      radial-gradient(44% 30% at 55% 78%, var(--aura-3), transparent 72%);
    filter:blur(10px); animation:aura 18s ease-in-out infinite alternate}
  .hero::after{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
    background-image:radial-gradient(rgba(255,255,255,.07) 1px, transparent 1px); background-size:22px 22px;
    -webkit-mask-image:linear-gradient(to bottom, #000 0%, transparent 75%); mask-image:linear-gradient(to bottom, #000 0%, transparent 75%)}
  @keyframes aura{to{transform:translate3d(2%, -3%, 0) scale(1.06)}}
  /* ── GİRİŞ: İPEK KUŞAK (2026-11-02) — uygulamanın açılış ekranıyla aynı dil: iki ipek kuşak çizilerek gelir,
     sonra yavaşça dalgalanır; başlık bulanıktan netleşerek yükselir. Eski düz aura + soluk geçiş demode kalmıştı. */
  .silk{position:absolute; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none; overflow:visible}
  @keyframes rise{from{opacity:0; transform:translateY(18px); filter:blur(10px)} to{opacity:1; transform:none; filter:none}}
  .hero-mark{animation:rise .9s .05s both}
  .hero .ver{animation:rise .8s .2s both}
  .hero h1{animation:rise 1s .35s both}
  .hero h1 .soft{display:inline-block; animation:rise 1s .7s both}
  .hero .lead{animation:rise .9s .9s both}
  .hero .badges,.hero .trust{animation:rise .9s 1.05s both}
  .hero-phone{animation:rise 1.2s .6s both}
  @media (prefers-reduced-motion: reduce){
    .hero::before{animation:none}
    .hero-mark,.hero .ver,.hero h1,.hero h1 .soft,.hero .lead,.hero .badges,.hero .trust,.hero-phone{animation:none}
  }
  .hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center}
  .hero-mark{height:clamp(44px,6vw,64px); width:auto; display:block; filter:drop-shadow(0 8px 30px rgba(120,140,255,.25))}
  .ver{display:inline-flex; align-items:center; gap:8px; margin-top:26px; padding:6px 12px 6px 6px; border-radius:999px;
    background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); font-size:13px; font-weight:600; color:rgba(231,234,242,.85)}
  .ver b{background:#fff; color:#04060E; border-radius:999px; padding:2px 9px; font-size:11.5px; font-weight:800}
  .hero h1{font-size:clamp(38px,6vw,68px); font-weight:800; letter-spacing:-.045em; line-height:1.0; margin-top:18px; color:#fff; text-wrap:balance}
  .hero h1 .soft{color:rgba(231,234,242,.55)}
  .hero .lead{color:rgba(231,234,242,.72); font-size:clamp(16px,1.7vw,19px); margin-top:20px; max-width:46ch}
  .hero .badges{margin-top:30px}
  .trust{display:flex; gap:10px 18px; flex-wrap:wrap; margin-top:24px; font-size:13px; font-weight:600; color:rgba(231,234,242,.6)}
  .trust span{display:inline-flex; align-items:center; gap:7px}
  .trust svg{opacity:.85}
  .hero-phone{display:flex; flex-direction:column; align-items:center; gap:16px}
  .hero-fade{height:120px; background:linear-gradient(to bottom, transparent, var(--bg)); margin-top:-40px; position:relative}
  @media(max-width:900px){
    .hero{padding-top:108px; text-align:center}
    .hero-grid{grid-template-columns:1fr; gap:44px}
    .hero-mark{margin:0 auto} .hero .lead{margin-left:auto; margin-right:auto}
    .hero .badges,.trust{justify-content:center}
  }

  /* ── TELEFON MAKETİ ── */
  .phone{width:296px; aspect-ratio:296/612; border-radius:50px; background:#05070D; padding:11px; position:relative;
    box-shadow:0 0 0 1px rgba(255,255,255,.10), 0 50px 120px -20px rgba(40,60,200,.45), 0 30px 60px -30px rgba(0,0,0,.8)}
  .phone .dyn{position:absolute; top:22px; left:50%; transform:translateX(-50%); width:92px; height:27px; border-radius:16px; background:#05070D; z-index:9}
  .stack{width:100%; height:100%; border-radius:39px; overflow:hidden; position:relative; background:#F5F5F7; isolation:isolate; transform:translateZ(0)}
  .statusbar{position:absolute; top:11px; left:0; right:0; height:28px; display:flex; justify-content:space-between; z-index:8; pointer-events:none; --sb:#0E1220}
  .stack.dark{background:#05070D}
  .stack.dark .statusbar{--sb:#F5F5F7}
  .sb-ear{flex:0 0 88px; display:flex; align-items:center; justify-content:center}
  .sb-time{font-size:11.5px; font-weight:800; color:var(--sb)}
  .sb-ind{display:flex; gap:5px; align-items:center}
  .homebar{position:absolute; bottom:7px; left:50%; transform:translateX(-50%); width:100px; height:4px; border-radius:999px; background:#0E1220; opacity:.25; z-index:8}
  .stack.dark .homebar{background:#fff; opacity:.5}
  .screen{position:absolute; inset:0; opacity:0; transform:translateY(8px); transition:opacity .5s ease, transform .5s ease;
    display:flex; flex-direction:column; gap:10px; padding:50px 14px 20px; pointer-events:none; color:#0E1220}
  .screen.active{opacity:1; transform:none}
  .m-card{background:#fff; border-radius:18px; border:1px solid rgba(15,18,30,.06); box-shadow:0 2px 8px rgba(15,18,30,.04)}
  .m-lbl{font-size:9px; font-weight:800; letter-spacing:1.3px; color:#9AA0AE; text-transform:uppercase}
  .m-head{display:flex; align-items:center; justify-content:space-between; padding:2px 2px 0}
  .m-head img{height:15px; width:auto}
  .m-greet{font-size:16px; font-weight:800; letter-spacing:-.4px; padding:0 2px}
  .m-sub{font-size:10.5px; color:#545B6B; font-weight:600; padding:0 2px; margin-top:-8px}
  /* üç halka (TodayRings) */
  .rings{display:flex; align-items:center; gap:14px; padding:14px}
  .rings svg{flex:none}
  .rings .rc{transition:stroke-dashoffset 1s cubic-bezier(.22,1,.36,1)}
  .r-meta{display:flex; flex-direction:column; gap:7px; flex:1}
  .r-row{display:flex; align-items:center; gap:7px; font-size:10.5px; font-weight:700}
  .r-row i{width:7px; height:7px; border-radius:50%}
  .r-row span{margin-left:auto; color:#545B6B; font-weight:600}
  .t-row{display:flex; align-items:center; gap:10px; padding:10px 12px; border-top:1px solid rgba(15,18,30,.05)}
  .t-row:first-child{border-top:0}
  .chk{width:18px; height:18px; border-radius:50%; border:2px solid #CDD1DA; flex:none; display:flex; align-items:center; justify-content:center; transition:.3s}
  .chk svg{opacity:0; transition:.3s}
  .t-row.done .chk{background:var(--emerald); border-color:var(--emerald)}
  .t-row.done .chk svg{opacity:1}
  .tt{flex:1; font-size:11.5px; font-weight:600; transition:.3s}
  .t-row.done .tt{color:#9AA0AE; text-decoration:line-through}
  .tm{font-size:9.5px; font-weight:700; color:#545B6B; background:#F1F2F6; border-radius:999px; padding:2px 7px}
  .zen{display:flex; align-items:center; gap:9px; padding:10px 10px 10px 11px}
  .zen .zi{width:26px; height:26px; border-radius:50%; background:rgba(20,184,166,.14); display:flex; align-items:center; justify-content:center; flex:none}
  .zen .zt{flex:1; font-size:10.5px; font-weight:700; line-height:1.3}
  .zen .zt small{display:block; font-size:9px; color:#9AA0AE; font-weight:600}
  .zen .zb{font-size:9.5px; font-weight:700; color:#fff; background:var(--teal); border-radius:999px; padding:5px 9px}
  /* yaz gitsin sahnesi */
  .cap-box{padding:14px; font-size:13px; font-weight:600; min-height:72px; line-height:1.45}
  .cap-box .caret{display:inline-block; width:2px; height:15px; background:var(--primary); vertical-align:-2px; margin-left:1px; animation:blink 1s steps(1) infinite}
  @keyframes blink{50%{opacity:0}}
  .parsed{display:flex; flex-direction:column; gap:8px}
  .p-item{display:flex; align-items:center; gap:9px; padding:10px 12px; opacity:0; transform:translateY(6px); transition:.4s}
  .p-item.in{opacity:1; transform:none}
  .p-item .pt{flex:1; font-size:11.5px; font-weight:700}
  .chip{font-size:9.5px; font-weight:700; border-radius:999px; padding:3px 8px}
  /* odak (koyu) */
  .scr-focus{background:radial-gradient(60% 40% at 25% 18%, rgba(79,70,229,.55), transparent 70%), radial-gradient(55% 38% at 85% 30%, rgba(45,212,191,.25), transparent 70%), radial-gradient(70% 50% at 50% 105%, rgba(124,58,237,.45), transparent 70%), #05070D; color:#fff; align-items:center}
  .f-lbl{font-size:10px; font-weight:800; letter-spacing:2px; color:rgba(255,255,255,.6); margin-top:6px}
  .f-ring{position:relative; width:176px; height:176px; margin:22px 0 14px}
  .f-ring svg{transform:rotate(-90deg)}
  .f-time{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:40px; font-weight:800; letter-spacing:-1.5px; font-variant-numeric:tabular-nums; text-shadow:0 0 24px rgba(150,180,255,.45)}
  .f-task{font-size:12.5px; font-weight:700}
  .f-sounds{display:grid; grid-template-columns:repeat(3,1fr); gap:7px; width:100%; margin-top:16px}
  .snd{border-radius:12px; padding:8px 4px; text-align:center; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); font-size:9.5px; font-weight:700; color:rgba(255,255,255,.75)}
  .snd svg{display:block; margin:0 auto 4px}
  .snd.on{background:rgba(110,149,255,.22); border-color:rgba(140,170,255,.55); color:#fff}
  .snd.on svg{animation:sway 1.6s ease-in-out infinite}
  @keyframes sway{50%{transform:translateY(-2px)}}
  .f-breath{margin-top:auto; display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); font-size:10.5px; font-weight:700}
  .f-breath i{width:9px; height:9px; border-radius:50%; background:#8FE3D5; animation:breath 4s ease-in-out infinite}
  @keyframes breath{50%{transform:scale(1.7); opacity:.6}}
  /* modlar */
  .mode{padding:12px 13px}
  .mode-h{display:flex; align-items:center; gap:10px}
  .mode-ic{width:34px; height:34px; border-radius:11px; display:flex; align-items:center; justify-content:center; flex:none}
  .mode-n{flex:1; font-size:12px; font-weight:800}
  .mode-n small{display:block; font-size:9.5px; color:#545B6B; font-weight:600; margin-top:1px}
  .mode-d{text-align:right; font-size:15px; font-weight:800; line-height:1}
  .mode-d small{display:block; font-size:8.5px; color:#9AA0AE; font-weight:700; margin-top:3px}
  .mode-bar{height:5px; border-radius:3px; background:#ECEDF2; margin-top:10px; overflow:hidden}
  .mode-bar span{display:block; height:100%; width:0; border-radius:3px; transition:width .9s cubic-bezier(.2,.7,.2,1)}
  .dots{display:flex; gap:7px}
  .dot{width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.25); transition:.3s; border:0; cursor:pointer; padding:0}
  .dot.on{width:22px; border-radius:4px; background:#fff}
  .mockcap{text-align:center; min-height:52px; max-width:300px; opacity:0; transform:translateY(6px); transition:.45s}
  .mockcap.in{opacity:1; transform:none}
  .mc-t{font-size:15px; font-weight:800; color:#fff}
  .mc-d{font-size:13px; color:rgba(231,234,242,.65); margin-top:2px}


  /* ── MAKET v2 (2026-11-02): uygulamanın GÜNCEL Bugün ve Odak ekranları (kullanıcı: "eski güncellemede kaldı") ── */
  .home2{gap:7px; padding:44px 11px 0; background:#F2F3F6}
  .h2-top{display:flex; align-items:center; justify-content:space-between; padding:0 2px}
  .h2-top img{height:13px}
  .av{width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; color:#fff;
    background:conic-gradient(from 200deg, #6E8BFF, #A78BFA, #5EEAD4, #6E8BFF); box-shadow:0 0 0 2px #fff, 0 0 0 3.5px #2B5BCE}
  .inb{position:relative; width:26px; height:26px; border-radius:50%; background:#fff; border:1px solid rgba(15,18,30,.08); display:flex; align-items:center; justify-content:center}
  .inb i{position:absolute; top:-3px; right:-3px; min-width:13px; height:13px; border-radius:7px; background:#2B5BCE; color:#fff; font-size:8px; font-weight:800; font-style:normal; display:flex; align-items:center; justify-content:center; border:1.5px solid #F2F3F6}
  .dash{padding:10px 11px; display:flex; flex-direction:column; gap:6px}
  .dash-h{display:flex; justify-content:space-between; font-size:8.5px; font-weight:700; letter-spacing:1.1px; color:#7A808E}
  .dash-h b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; color:#1C1F2A; letter-spacing:.5px}
  .dash-mode{display:flex; align-items:center; gap:5px; font-size:10.5px; padding-bottom:8px; border-bottom:1px solid rgba(15,18,30,.07)}
  .dash-mode span{color:#7A808E; font-weight:600} .dash-mode em{margin-left:auto; font-style:normal; color:#7A808E; font-weight:600}
  .dash-sent{font-size:13px; font-weight:700; line-height:1.55; letter-spacing:-.2px; color:#1C1F2A}
  .dash-sent mark{background:rgba(43,91,206,.10); color:#2B5BCE; border-radius:7px; padding:1px 5px; display:inline-block; opacity:0; transform:scale(.8); transition:opacity .35s, transform .45s cubic-bezier(.34,1.56,.64,1)}
  .dash-sent mark.in{opacity:1; transform:none}
  .dash-mom{display:flex; align-items:center; gap:9px; padding-top:8px; border-top:1px solid rgba(15,18,30,.07)}
  .orb{width:18px; height:18px; border-radius:50%; background:radial-gradient(circle at 35% 30%, #fff, #8FA6FF 45%, #3B5BDB); box-shadow:0 0 10px rgba(80,110,255,.45); animation:orb 3.2s ease-in-out infinite}
  @keyframes orb{50%{transform:scale(1.12); box-shadow:0 0 16px rgba(80,110,255,.6)}}
  .mom-n b{display:block; font-size:16px; font-weight:800; line-height:1; font-variant-numeric:tabular-nums}
  .mom-n small{font-size:7.5px; font-weight:800; letter-spacing:1.2px; color:#7A808E}
  .bars{margin-left:auto; display:flex; align-items:flex-end; gap:3px; height:22px}
  .bars i{width:9px; border-radius:2px; background:#C9CDD8; height:calc(var(--h) * 100%); transform-origin:bottom; transform:scaleY(0); transition:transform .6s cubic-bezier(.22,1,.36,1)}
  .bars i.now{background:#2B5BCE} .bars.in i{transform:scaleY(1)}
  .lbl-row{display:flex; justify-content:space-between; align-items:center}
  .lbl-row b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10.5px}
  .hab{padding:8px 11px; display:flex; flex-direction:column; gap:6px}
  .hab-row{display:flex; gap:16px}
  .h-it{display:flex; flex-direction:column; align-items:center; gap:3px}
  .h-it small{font-size:8.5px; font-weight:700; color:#545B6B}
  .hb{position:relative; width:46px; height:46px; transform:scale(.85); margin:-3px}
  .hb .hi{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:16px}
  .hb .hr{transition:stroke-dashoffset 1s cubic-bezier(.22,1,.36,1)}
  .h-it.pop .hb{animation:pop .5s cubic-bezier(.34,1.56,.64,1)}
  @keyframes pop{50%{transform:scale(1.14)}}
  .tasks2{padding:10px 12px 4px}
  .star{display:flex; align-items:center; gap:4px; font-size:8px; font-weight:800; letter-spacing:1px; color:#C2410C; margin-top:6px}
  .t2{display:flex; align-items:center; gap:8px; padding:7px 0; border-top:1px solid rgba(15,18,30,.05)}
  .t2.st{border-top:0}
  .t2 .chk{width:16px; height:16px}
  .t2.st .chk{border-color:#A78BFA}
  .t2.done .chk{background:var(--emerald); border-color:var(--emerald)} .t2.done .chk svg{opacity:1}
  .t2.done .tt{color:#9AA0AE; text-decoration:line-through}
  .t2 .tt{font-size:11px}
  .go{margin-right:44px; font-size:9px; font-weight:800; color:#fff; background:#2B5BCE; border-radius:999px; padding:4px 8px; white-space:nowrap}
  .fab{position:absolute; right:14px; bottom:68px; z-index:3; width:38px; height:38px; border-radius:50%; background:#2B5BCE; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 18px -6px rgba(43,91,206,.6)}
  .tabbar{position:absolute; left:10px; right:10px; bottom:14px; height:44px; border-radius:22px; background:rgba(255,255,255,.92); backdrop-filter:blur(12px);
    box-shadow:0 6px 20px -8px rgba(15,18,30,.25), 0 0 0 1px rgba(15,18,30,.05); display:flex; align-items:center; justify-content:space-around; padding:0 4px}
  .tb{display:flex; flex-direction:column; align-items:center; gap:1px; color:#6B7180; padding:4px 6px; border-radius:14px}
  .tb small{font-size:7px; font-weight:700}
  .tb.on{color:#2B5BCE; background:rgba(43,91,206,.10)}
  /* odak v2 */
  .f2{padding:46px 14px 18px; gap:8px}
  .f2-top{display:flex; justify-content:space-between; align-items:center; width:100%}
  .f2-top .ic{width:24px; height:24px; border-radius:50%; background:rgba(255,255,255,.10); display:flex; align-items:center; justify-content:center; font-size:10px; color:rgba(255,255,255,.8)}
  .f2-line{min-height:30px; text-align:center; font-size:10.5px; font-weight:600; line-height:1.4; color:rgba(255,255,255,.75); max-width:220px; transition:opacity .4s, transform .4s, filter .4s}
  .f2-line.out{opacity:0; transform:translateY(-4px); filter:blur(4px)}
  .f2 .f-ring{width:186px; height:186px; margin:4px 0 6px}
  .f2 #fprog{filter:drop-shadow(0 0 8px rgba(140,170,255,.55))}
  .f2-row{display:flex; align-items:center; justify-content:center; gap:22px; margin-top:8px}
  .slot{display:flex; flex-direction:column; align-items:center; gap:3px; font-size:8.5px; font-weight:700; color:rgba(255,255,255,.7)}
  .sc{width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.14); display:flex; align-items:center; justify-content:center}
  .sc .br{width:10px; height:10px; border-radius:50%; background:#8FE3D5; animation:breath 4s ease-in-out infinite}
  .start{width:54px; height:54px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 6px rgba(255,255,255,.10), 0 10px 30px -8px rgba(140,170,255,.7)}
  .f2 .f-sounds{margin-top:auto}
  .f2 .snd{padding:7px 4px}

  /* ── MAKET v3 (2026-11-08): uygulamanın gerçek ekranlarından ── */
  .phone{width:304px; aspect-ratio:304/640; border-radius:54px; padding:10px; background:linear-gradient(145deg,#3A3E48 0%,#16181F 18%,#0A0B10 55%,#23262E 100%);
    box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.14), inset 0 0 0 4px #05060A, 0 48px 90px -28px rgba(0,4,20,.85), 0 18px 40px -18px rgba(30,50,140,.45)}
  .phone::before{content:""; position:absolute; left:-2.5px; top:128px; width:3px; height:30px; border-radius:2px 0 0 2px; background:#2A2D35; box-shadow:0 52px 0 #2A2D35, 0 118px 0 #2A2D35}
  .phone::after{content:""; position:absolute; right:-2.5px; top:176px; width:3px; height:86px; border-radius:0 2px 2px 0; background:#2A2D35}
  .phone .dyn{top:21px; width:88px; height:26px; background:#000}
  .stack{border-radius:44px; background:#F2F3F6}
  .stack.dark{background:#060A18}
  .statusbar{top:13px}
  .sb-time{font-weight:700; font-size:12.5px; letter-spacing:-.1px}
  .screen.home2{gap:9px; padding:52px 12px 0}
  .h2-top{position:relative; padding:0 1px}
  .h2-top img{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); height:14px}
  .h2-top .av{width:30px; height:30px; font-size:12px; background:#1B2A55; color:#C9D3EC; box-shadow:0 0 0 1.5px #2B5BCE}
  .h2-top .inb{width:30px; height:30px; margin-left:auto; color:#1C1F2A; background:transparent; border:0}
  .dash{padding:13px 14px 12px; gap:10px; border-radius:20px; border:0}
  .dash-h{align-items:center}
  .dash-h .dt{position:relative; padding-bottom:4px}
  .dash-h .dt::after{content:""; position:absolute; left:0; bottom:0; width:24px; height:2px; border-radius:1px; background:#B5622A}
  .dash-main{display:flex; align-items:center; gap:12px}
  .flower{flex:none}
  .pt{fill:#E3E5EB; transition:fill .4s}
  .pt.on{fill:#2B5BCE}
  .dash-sent{font-size:14.5px; line-height:1.62; letter-spacing:-.25px}
  .dash-sent mark{padding:1px 6px}
  .dash-mom{padding-top:10px}
  .mom-n b{color:#2B5BCE; font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
  .hab-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:7px}
  .ht{background:#fff; border-radius:16px; padding:10px 9px 9px; display:flex; flex-direction:column; align-items:flex-start; gap:6px; box-shadow:0 1px 6px rgba(15,18,30,.04)}
  .ht b{font-size:11px; font-weight:700; color:#1C1F2A; line-height:1.2}
  .hc{width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--c); box-shadow:inset 0 0 0 2.2px color-mix(in srgb,var(--c) 26%,transparent); transition:background .35s,color .35s,box-shadow .35s}
  .ht.done .hc{background:var(--c); color:#fff; box-shadow:none}
  .ht.done b{color:#7A808E}
  .ht.pop .hc{animation:pop .5s cubic-bezier(.34,1.56,.64,1)}
  .trail{display:flex; gap:3px}
  .trail i{width:5px; height:5px; border-radius:50%; background:#E0E2E9}
  .trail i.d{background:var(--c)}
  .trail i.today{background:#C6CAD4}
  .ht.done .trail i.today{background:var(--c)}
  .tasks2{padding:12px 14px 4px; border-radius:20px; border:0}
  .t2{gap:10px; padding:9px 0}
  .t2 .chk{width:19px; height:19px; background:transparent}
  .t2 .tt{font-size:12px; color:#1C1F2A}
  .t2.st{border-top:0}
  .t2.st .chk,.chk.p-h{border-color:#B3261E}
  .chk.p-m{border-color:#B5622A}
  .fab{right:12px; bottom:74px; width:46px; height:46px; background:#2B5BCE}
  .tabbar{left:12px; right:12px; bottom:18px; height:52px; border-radius:26px; padding:0 6px; background:#fff; backdrop-filter:none}
  .tb{flex:1; padding:3px 0 2px; gap:1px; border-radius:0; color:#5C6270; background:transparent!important}
  .tb svg{padding:2px 12px; width:42px; height:22px; border-radius:11px; box-sizing:border-box}
  .tb small{font-size:8.5px}
  .tb.on{color:#2B5BCE}
  .tb.on svg{background:rgba(43,91,206,.12)}
  .screen.cap3{background:#F2F3F6; gap:10px; padding:60px 14px 26px}
  .cap3 .m-greet{font-size:21px; letter-spacing:-.5px}
  .cap3 .m-sub{font-size:11.5px; margin-top:-6px}
  .cap3 .cap-box{min-height:88px; border:0; border-radius:18px}
  .cap3 .p-item{border:0; padding:11px 12px; border-radius:14px; flex-wrap:wrap}
  .cap-l{margin-top:4px; padding:0 2px}
  .cap-cta{margin-top:auto; background:#2B5BCE; color:#fff; font-size:13px; font-weight:700; text-align:center; border-radius:16px; padding:13px}
  .screen.f3{background:#060A18; color:#fff; align-items:center; gap:0; padding:54px 14px 26px}
  .f3-top{width:100%; display:flex; align-items:center; justify-content:space-between}
  .sq{width:34px; height:34px; border-radius:12px; background:rgba(255,255,255,.07); display:flex; align-items:center; justify-content:center; color:#E7EAF2}
  .f3-pill{display:inline-flex; align-items:center; gap:5px; height:26px; padding:0 12px; border-radius:13px; background:rgba(140,207,179,.13); color:#8CCFB3; font-size:9.5px; font-weight:800; letter-spacing:1.4px}
  .f3-today{margin-top:14px; font-size:11.5px; font-weight:600; color:rgba(231,234,242,.72)}
  .f3-ring{position:relative; width:236px; height:236px; margin-top:14px; flex:none}
  .f3-ring img{position:absolute; left:12px; top:12px; width:212px; height:212px; border-radius:50%; display:block}
  .f3-ring svg{position:absolute; inset:0; overflow:visible; transform:none}
  .f3-ring #fprog{filter:none}
  .f3 .f-time{font-size:50px; font-weight:300; letter-spacing:-.5px; text-shadow:0 2px 14px rgba(3,10,30,.55)}
  .f3-task{display:flex; align-items:center; gap:7px; margin-top:18px; font-size:12px; font-weight:600; color:#E7EAF2}
  .f3 .f2-row{gap:30px; margin-top:18px}
  .f3 .sc{width:44px; height:44px; background:transparent; border-color:rgba(255,255,255,.16)}
  .f3 .sc .br{background:#8FE3D5}
  .f3 .slot{font-size:9.5px; gap:5px}
  .f3 .start{width:60px; height:60px; background:#8CCFB3; box-shadow:0 10px 26px -10px rgba(140,207,179,.7); margin-bottom:15px}
  .f3-snd{display:inline-flex; align-items:center; gap:6px; margin-top:14px; height:30px; padding:0 13px; border-radius:15px; background:rgba(255,255,255,.07); font-size:10.5px; font-weight:600; color:#E7EAF2}
  .screen.modes3{background:#F2F3F6; gap:14px; padding:54px 12px 0}
  .nav3{display:flex; align-items:center; justify-content:space-between; color:#1C1F2A; height:30px; padding:0 4px}
  .nav3 b{font-size:14.5px; font-weight:700} .nav3 i{width:17px}
  .goal-list{border:0; border-radius:20px; overflow:hidden}
  .goal-list .mode{display:block; width:auto; max-width:none; flex:none; padding:13px; border-top:1px solid rgba(15,18,30,.06)}
  .goal-list .mode:first-child{border-top:0}
  .stack:not(.dark) .homebar{background:#0E1220; opacity:.32}

  /* ── NEDEN TAZQ (karşılaştırma) ── */
  .diff{margin-top:40px; background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden}
  .diff table{width:100%; border-collapse:collapse; font-size:15px}
  .diff th,.diff td{padding:16px 18px; text-align:left; vertical-align:top; border-top:1px solid var(--line-2)}
  .diff thead th{border-top:0; font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
  .diff thead th:nth-child(2){color:var(--primary)}
  .diff tbody th{font-weight:700; width:38%}
  .diff td.yes{font-weight:600}
  .diff td.yes::before{content:"✓"; color:var(--primary); font-weight:800; margin-right:8px}
  .diff td.no{color:var(--muted)}
  @media(max-width:720px){
    .diff table,.diff tbody,.diff tr{display:block} .diff thead{display:none}
    .diff tr{padding:14px 16px; border-top:1px solid var(--line-2)} .diff tr:first-child{border-top:0}
    .diff th,.diff td{display:block; padding:2px 0; border:0; width:auto}
    .diff td.no{font-size:13.5px}
  }

  /* ── BENTO ÖZELLİKLER ── */
  .sec-head{max-width:720px}
  .sec-head.center{text-align:center; margin:0 auto}
  .sec-head.center .lede{margin-left:auto; margin-right:auto}
  .bento{display:grid; grid-template-columns:repeat(6,1fr); gap:16px; margin-top:48px}
  .b{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:28px; position:relative; overflow:hidden}
  .b h3{font-size:20px; font-weight:800; letter-spacing:-.02em; line-height:1.25}
  .b p{color:var(--muted); font-size:14.5px; margin-top:8px; text-wrap:pretty}
  .b .ic{width:42px; height:42px; border-radius:13px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; background:var(--primary-soft)}
  .b-6{grid-column:span 6} .b-4{grid-column:span 4} .b-3{grid-column:span 3} .b-2{grid-column:span 2}
  @media(max-width:900px){ .b-4,.b-3,.b-2{grid-column:span 6} }
  /* Yaz gitsin kartı */
  .type-demo{display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:center}
  @media(max-width:760px){ .type-demo{grid-template-columns:1fr} }
  .td-in{background:var(--bg); border:1px solid var(--line); border-radius:var(--r-md); padding:16px 18px; font-size:16px; font-weight:600; min-height:58px}
  .td-in .caret{display:inline-block; width:2px; height:18px; background:var(--primary); vertical-align:-3px; margin-left:1px; animation:blink 1s steps(1) infinite}
  .td-out{display:flex; flex-direction:column; gap:8px; margin-top:12px}
  .td-row{display:flex; align-items:center; gap:10px; background:var(--bg); border:1px solid var(--line-2); border-radius:14px; padding:11px 14px; opacity:0; transform:translateY(6px); transition:.4s}
  .td-row.in{opacity:1; transform:none}
  .td-row b{flex:1; font-size:14px; font-weight:700}
  .td-row .chip{font-size:11px; padding:4px 9px}
  .modes-list{display:flex; flex-wrap:wrap; gap:8px; margin-top:18px}
  .mchip{display:inline-flex; align-items:center; gap:7px; padding:7px 12px; border-radius:999px; border:1px solid var(--line); font-size:13px; font-weight:600; color:var(--ink); background:var(--bg)}
  .mchip i{width:8px; height:8px; border-radius:50%}
  .stat-big{font-size:clamp(40px,5vw,56px); font-weight:800; letter-spacing:-.04em; line-height:1; margin-top:6px}
  .stat-big small{font-size:16px; color:var(--muted); font-weight:600; letter-spacing:0; margin-left:6px}

  /* ── ODAK BÖLÜMÜ (koyu) ── */
  .focus-band{margin-top:112px; background:var(--night); color:var(--silver); position:relative; overflow:hidden; isolation:isolate; padding:104px 0}
  .focus-band::before{content:""; position:absolute; inset:0; z-index:-1;
    background:radial-gradient(40% 50% at 15% 40%, rgba(79,70,229,.35), transparent 70%), radial-gradient(40% 50% at 90% 70%, rgba(45,212,191,.18), transparent 70%)}
  .focus-band .eyebrow{color:#9DB4FF}
  .focus-band .h2{color:#fff}
  .focus-band .lede{color:rgba(231,234,242,.7)}
  .snd-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; margin-top:44px}
  .sg{border-radius:20px; padding:18px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); transition:background .2s, border-color .2s}
  .sg:hover{background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.16)}
  .sg b{display:block; margin-top:12px; font-size:15px; color:#fff}
  .sg span{font-size:12.5px; color:rgba(231,234,242,.55)}
  .focus-points{display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:56px; padding-top:36px; border-top:1px solid rgba(255,255,255,.08)}
  .focus-points h3{font-size:17px; color:#fff; font-weight:800}
  .focus-points p{font-size:14px; color:rgba(231,234,242,.6); margin-top:6px}
  @media(max-width:760px){ .focus-points{grid-template-columns:1fr} }

  /* ── ADIMLAR ── */
  .steps{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:44px; counter-reset:s}
  .step{border-top:2px solid var(--ink); padding-top:20px}
  .step .n{font-size:13px; font-weight:800; color:var(--faint); letter-spacing:.1em}
  .step h3{font-size:20px; font-weight:800; letter-spacing:-.02em; margin-top:8px}
  .step p{color:var(--muted); font-size:14.5px; margin-top:6px}
  @media(max-width:760px){ .steps{grid-template-columns:1fr; gap:28px} }

  /* ── GİZLİLİK ŞERİDİ ── */
  .privacy{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:44px}
  .pv{padding:22px; border-radius:var(--r-md); background:var(--card); border:1px solid var(--line)}
  .pv b{display:block; font-size:15.5px; margin-top:12px}
  .pv span{font-size:13.5px; color:var(--muted)}
  @media(max-width:900px){ .privacy{grid-template-columns:repeat(2,1fr)} }
  @media(max-width:520px){ .privacy{grid-template-columns:1fr} }

  /* ── SSS ── */
  .faq{max-width:760px; margin:40px auto 0; display:flex; flex-direction:column}
  details{border-bottom:1px solid var(--line); padding:20px 2px}
  summary{font-weight:700; font-size:16px; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px}
  summary::-webkit-details-marker{display:none}
  summary::after{content:""; width:10px; height:10px; border-right:2px solid var(--faint); border-bottom:2px solid var(--faint); transform:rotate(45deg) translate(-2px,-2px); transition:transform .2s; flex:none}
  details[open] summary::after{transform:rotate(-135deg)}
  details p{color:var(--muted); font-size:14.5px; margin-top:10px; max-width:64ch}
  details p a{color:var(--primary); font-weight:700}

  /* ── CTA ── */
  .cta{margin:112px 20px 0; border-radius:36px; background:var(--night); color:var(--silver); text-align:center; padding:84px 24px; position:relative; overflow:hidden; isolation:isolate}
  .cta::before{content:""; position:absolute; inset:0; z-index:-1;
    background:radial-gradient(50% 60% at 30% 0%, var(--aura-1), transparent 70%), radial-gradient(50% 60% at 75% 100%, var(--aura-2), transparent 70%)}
  .cta img{height:52px; width:auto; margin:0 auto 26px; display:block}
  .cta h2{font-size:clamp(28px,4.4vw,48px); font-weight:800; letter-spacing:-.04em; color:#fff; line-height:1.08}
  .cta p{color:rgba(231,234,242,.7); max-width:44ch; margin:14px auto 30px; font-size:17px}
  .cta .badges{justify-content:center}

  /* ── FOOTER ── */
  footer{padding:72px 0 36px}
  .foot-in{display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr 1fr; gap:32px}
  .foot-brand img{height:22px; width:auto; display:block}
  .wm-dark{display:none}
  @media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .wm-light{display:none} :root:not([data-theme="light"]) .wm-dark{display:block} }
  .foot-brand p{color:var(--muted); font-size:13.5px; margin-top:14px; max-width:30ch}
  .foot-col h4{font-size:11.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--faint); margin-bottom:12px}
  .foot-col a{display:block; color:var(--muted); font-weight:600; font-size:14px; padding:4px 0}
  .foot-col a:hover{color:var(--ink)}
  .foot-bottom{margin-top:48px; padding-top:22px; border-top:1px solid var(--line); display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; color:var(--faint); font-size:13px}
  @media(max-width:900px){ .foot-in{grid-template-columns:1fr 1fr} .foot-brand{grid-column:1/-1} }

  /* Görünüme girerken yumuşak beliriş */
  .hero-grid>*,.bento>*,.type-demo>*,.foot-in>*{min-width:0}
  .badges{max-width:100%}
  .rv{opacity:0; transform:translateY(14px); transition:opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1)}
  .rv.in{opacity:1; transform:none}
  @media (prefers-reduced-motion: reduce){ .rv{opacity:1; transform:none; transition:none} }