.vh-bezel{
  --vh-cerceve-zemin:#1C1029;
  --vh-odak:var(--hardal);
  --vh-yaricap:14px;
}
.hero{overflow:clip}
.vh-bezel{background:var(--murekkep);padding:0 10px 10px;border-radius:24px;box-shadow:0 30px 60px rgba(43,27,61,.3);scroll-margin-top:84px}
.vh-bezel-ust{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 .6rem;color:#fff;font-family:"IBM Plex Mono",monospace;font-size:.8rem}
.vh-bezel-etiket{display:inline-flex;align-items:center;gap:.5rem}
.vh-bezel-ust .led{width:10px;height:10px;border-radius:50%;background:#3DDC84;box-shadow:0 0 12px #3DDC84;animation:led 1.4s ease-in-out infinite}
.vh-bezel :focus-visible{outline:3px solid var(--vh-odak);outline-offset:2px}
.vh-cerceve{position:relative;aspect-ratio:16/9;background:var(--vh-cerceve-zemin);border-radius:var(--vh-yaricap);overflow:hidden}
.vh-cerceve iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.yt-kutu{position:relative;container-type:inline-size;
  --yt-birincil:var(--vurgu-dolgu);
  --yt-birincil-hover:var(--vurgu-koyu);
  --yt-odak:var(--hardal);
  --yt-zemin:rgba(28,16,41,.9)}
.yt-devam,.yt-son{position:absolute;inset:0;z-index:2;display:none}
.yt-kutu[data-durum="duraklatildi"] .yt-devam,.yt-kutu[data-durum="bitti"] .yt-son{display:flex}
.yt-devam{flex-direction:column;align-items:center;justify-content:center;gap:.9rem;width:100%;margin:0;padding:0;border:0;color:#fff;cursor:pointer;
  background:var(--yt-zemin);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.yt-daire{width:88px;height:88px;border-radius:50%;background:var(--yt-birincil);display:grid;place-items:center;box-shadow:0 14px 34px rgba(214,61,14,.45);transition:transform .2s,background .2s}
.yt-daire i{font-size:2.8rem;margin-left:6px;line-height:1}
.yt-devam:hover .yt-daire,.yt-devam:focus-visible .yt-daire{transform:scale(1.06);background:var(--yt-birincil-hover)}
.yt-devam:focus-visible{outline:none}
.yt-devam:focus-visible .yt-daire{outline:3px solid var(--yt-odak);outline-offset:6px}
.yt-yazi{font-family:"IBM Plex Mono",monospace;font-weight:600;font-size:.95rem;background:rgba(28,16,41,.78);border-radius:999px;padding:.4rem .95rem}
.yt-son{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.4rem;padding:1.5rem;color:#fff;
  background:var(--yt-zemin);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.yt-son h3{margin:0;color:#fff;font-family:"Fraunces",Georgia,serif;font-weight:800;line-height:1.1;letter-spacing:-.01em;font-size:clamp(1.35rem,2.6vw,2.2rem)}
.yt-son p{margin:0;color:rgba(255,255,255,.75);font-size:1rem;line-height:1.5;max-width:30rem}
.yt-son-dugmeler{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;margin-top:.9rem}
.yt-btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:44px;padding:.6rem 1.15rem;border-radius:12px;border:2px solid transparent;
  font-family:"IBM Plex Mono",monospace;font-weight:600;font-size:.9rem;text-decoration:none;cursor:pointer;transition:background .15s,color .15s}
.yt-btn-vurgu{background:var(--yt-birincil);color:#fff}
.yt-btn-vurgu:hover{background:var(--yt-birincil-hover);color:#fff}
.yt-btn-cerceve{background:transparent;color:#fff;border-color:rgba(255,255,255,.7)}
.yt-btn-cerceve:hover{background:#fff;color:var(--murekkep)}
.yt-son :focus-visible{outline:3px solid var(--yt-odak);outline-offset:2px}
@container (max-width:520px){
  .yt-daire{width:70px;height:70px}
  .yt-daire i{font-size:2.2rem}
  .yt-yazi{font-size:.8rem}
  .yt-son{padding:1rem}
  .yt-son h3{font-size:1.2rem}
  .yt-son p{display:none}
  .yt-son-dugmeler{margin-top:.5rem}
  .yt-btn{padding:.5rem .85rem;font-size:.8rem}
}
@media (prefers-reduced-motion:reduce){
  .vh-bezel-ust .led{animation:none}
  .yt-daire,.yt-btn{transition:none}
}
