/* Demo videoları: /demo/ ve /demo/<slug>/ — ortak.css + ozellik.css üstüne, önek dm- */

/* liste hero */
.dm-hero{padding-bottom:48px}
.dm-hero .wrap{grid-template-columns:minmax(0,1fr)}
.dm-hero .wrap > div{max-width:760px}
.dm-hero .eylem{margin-bottom:0}

.dm-bolum{padding:40px 0 88px}
.dm-suzgec{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.dm-cip{font:600 14px/1 "Figtree",system-ui,sans-serif;color:var(--ink-2);background:#fff;border:1px solid var(--cizgi);border-radius:999px;padding:10px 14px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:border-color .2s,background .2s,color .2s}
.dm-cip span{font-size:12px;font-weight:700;color:var(--soluk-2);background:var(--zemin-2);border-radius:999px;padding:3px 7px}
.dm-cip:hover{border-color:#CFC6FB}
.dm-cip[aria-pressed="true"]{background:var(--indigo);border-color:var(--indigo);color:#fff}
.dm-cip[aria-pressed="true"] span{background:rgba(255,255,255,.18);color:#fff}
.dm-bos{color:var(--soluk);margin:8px 0 0}

/* kart */
.dm-izgara{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.dm-kart{display:flex;flex-direction:column;background:#fff;border:1px solid var(--cizgi);border-radius:16px;overflow:hidden;transition:box-shadow .2s,transform .2s,border-color .2s}
.dm-kart:hover{box-shadow:var(--golge);transform:translateY(-2px);border-color:#CFC6FB}
.dm-kart[hidden]{display:none}
.dm-kapak{display:block;background:var(--zemin-2);border-bottom:1px solid var(--cizgi)}
.dm-kapak img{width:100%;height:auto;aspect-ratio:1200/918;object-fit:cover}
.dm-kart-ic{display:flex;flex-direction:column;gap:8px;padding:20px 22px 22px;flex:1}
.dm-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:13px;font-weight:600;color:var(--indigo)}
.dm-sure{display:inline-flex;align-items:center;gap:5px;color:var(--soluk-2);font-weight:500}
.dm-sure svg{width:14px;height:14px}
.dm-kart b{font-size:19px;line-height:1.3;letter-spacing:-.01em;color:var(--ink)}
.dm-kisa{font-size:15px;line-height:1.6;color:var(--soluk)}
.dm-kart .link-ok{margin-top:auto;padding-top:6px}
.dm-kart:hover b{color:var(--indigo)}

.dm-videosuz .oz-ilgili{grid-template-columns:repeat(3,minmax(0,1fr))}

/* detay üst */
.dm-ust{padding:48px 0 32px;background:linear-gradient(180deg,#fff 0%,var(--zemin-2) 100%)}
.dm-rozetler{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.dm-rozet{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;padding:6px 12px;border-radius:999px;background:var(--indigo-acik);color:var(--indigo-koyu)}
.dm-rozet svg{width:15px;height:15px}
a.dm-rozet:hover{background:#E4DCFD}
.dm-rozet.gri{background:#fff;border:1px solid var(--cizgi);color:var(--soluk)}
.dm-ust h1{font:800 clamp(30px,4vw,48px)/1.1 "Figtree";letter-spacing:-.03em;margin:0 0 16px;max-width:22em}
.dm-ust .giris{font-size:18px;color:var(--soluk);margin:0;max-width:40em}

/* oynatıcı */
.dm-oynatici-bolum{padding:8px 0 0;background:linear-gradient(180deg,var(--zemin-2) 0 50%,#fff 50% 100%)}
.dm-oynatici{max-width:1000px;margin:0 auto;border-radius:16px;overflow:hidden;background:var(--ink);border:1px solid var(--cizgi);box-shadow:var(--golge-buyuk)}
.dm-oynatici video{display:block;width:100%;height:auto;aspect-ratio:1280/800;background:var(--ink)}
.dm-video-alt{max-width:1000px;margin:12px auto 0;display:flex;flex-wrap:wrap;gap:6px 20px;font-size:13.5px;color:var(--soluk-2)}
.dm-video-alt span{display:inline-flex;align-items:center;gap:6px}
.dm-video-alt svg{width:15px;height:15px}
.dm-video-alt a{text-decoration:underline;text-underline-offset:3px}
.dm-video-alt a:hover{color:var(--indigo)}

/* adımlar + neden */
.dm-icerik{padding:64px 0 88px}
.dm-icerik-izgara{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:56px;max-width:1048px}
.dm-icerik h2{font:800 clamp(22px,2.4vw,28px)/1.2 "Figtree";letter-spacing:-.02em;margin:0 0 20px}
.dm-adimlar{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.dm-adimlar li{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:14px;align-items:start}
.dm-no{width:32px;height:32px;border-radius:50%;background:var(--indigo-acik);color:var(--indigo);font-size:13.5px;font-weight:700;display:grid;place-items:center}
.dm-adimlar p{margin:4px 0 0;font-size:15.5px;line-height:1.6;color:var(--ink-2)}
.dm-zaman{font:600 13px/1 "Figtree",system-ui,sans-serif;color:var(--indigo);background:#fff;border:1px solid var(--cizgi);border-radius:8px;padding:7px 9px;cursor:pointer;margin-top:1px}
.dm-zaman:hover{border-color:var(--indigo)}
.dm-neden{margin:0;font-size:15.5px;line-height:1.7;color:var(--soluk)}
.dm-not{margin:16px 0 0;padding:12px 16px;border-left:3px solid var(--indigo-acik);background:var(--zemin-2);border-radius:0 10px 10px 0;font-size:13.5px;line-height:1.6;color:var(--soluk)}
.dm-oz-kartlar{display:flex;flex-direction:column;gap:10px;margin-top:24px}
.dm-oz-kart{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:center;background:#fff;border:1px solid var(--cizgi);border-radius:14px;padding:16px 18px;transition:box-shadow .2s,border-color .2s}
.dm-oz-kart:hover{box-shadow:var(--golge);border-color:#CFC6FB}
.dm-oz-kart .ikon{width:44px;height:44px;border-radius:11px;background:var(--indigo-acik);color:var(--indigo);display:grid;place-items:center}
.dm-oz-kart .ikon svg{width:21px;height:21px}
.dm-oz-kart small{display:block;font-size:12.5px;font-weight:600;color:var(--indigo)}
.dm-oz-kart b{display:block;font-size:16px}
.dm-oz-kart span > span{display:block;font-size:14px;color:var(--soluk);line-height:1.45}
.dm-blog{display:inline-block;margin-top:18px}

/* diğer videolar */
.dm-diger{background:var(--zemin-2)}
.dm-bas-satir{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:24px}
.dm-bas-satir h2{margin:0;font:800 clamp(22px,2.4vw,28px)/1.2 "Figtree";letter-spacing:-.02em}
.dm-diger-bos{display:flex;justify-content:space-between;align-items:center;gap:24px 40px;flex-wrap:wrap;background:#fff;border:1px solid var(--cizgi);border-radius:16px;padding:28px 32px}
.dm-diger-bos h2{margin:0 0 6px;font:800 22px/1.25 "Figtree";letter-spacing:-.02em}
.dm-diger-bos p{margin:0;color:var(--soluk);max-width:40em}
.dm-diger-bos .eylem{display:flex;gap:10px;flex-wrap:wrap}

@media (max-width:1060px){
  .dm-izgara,.dm-videosuz .oz-ilgili{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dm-icerik-izgara{grid-template-columns:minmax(0,1fr);gap:44px}
}
@media (max-width:640px){
  .dm-izgara,.dm-videosuz .oz-ilgili{grid-template-columns:minmax(0,1fr)}
  .dm-ust{padding:32px 0 24px}
  .dm-ust .giris{font-size:16.5px}
  .dm-icerik{padding:44px 0 64px}
  .dm-oynatici{border-radius:12px}
  .dm-diger-bos{padding:22px 20px}
  .oz-iz{flex-wrap:wrap}
}