:root{
    /* Brand */
   --brand1:#f1ff10;   /* sarı */
  --brand2:#ff991a;   /* turuncu */
  --brandGradient: linear-gradient(90deg, var(--brand1), var(--brand2));
  --brandGlow: 0 0 24px rgba(255,153,26,.55); /* isteğe bağlı: turuncu ışıma */
  
    /* Nötr palet */
    --text-100:#eef1f7;
    --text-400:#aeb4c0;
    --surface-900:#0b0b10;
    --surface-800:#101020;
    --surface-700:#12121b;
    --line-700:#27283d;
    --line-650:#2b2b45;
  }
  .wow-page{
  --bg: var(--surface-900);
  --card:#121219cc;
  --glass:#ffffff12;
  --text: var(--text-100);
  --muted: var(--text-400);
  --ring: conic-gradient(from 180deg at 50% 50%, var(--brand1), var(--brand2), var(--brand1));
  --shadow: 0 10px 30px rgba(0,0,0,.45);
  --radius:18px;
}
/* küçük iyileştirme: brand gradyanı gereken yerlerde */
.hero-underline, .chip.active, .badge, .btnx:hover { background: var(--brandGradient); }

  .hero-kicker, .hero-underline, .play-btn { background: var(--brandGradient); }

    .wow-page{background: radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%) , var(--bg); color:var(--text); font-family:"Inter",system-ui,Segoe UI,Arial;}
    /* HERO */
    .page-hero{
      position:relative; min-height:64vh; display:grid; place-items:center; overflow:hidden;
      background: url("../image/belgerimiz-backround.png") center/cover no-repeat fixed;
      isolation:isolate;
    }
    .page-hero::before{ /* gradient cam overlay */
      content:""; position:absolute; inset:0; z-index:0;
      background:linear-gradient(180deg, rgba(11,11,16,.55), rgba(11,11,16,.85));
      backdrop-filter:saturate(130%) blur(2px);
    }
    .hero-inner{position:relative; z-index:1; text-align:center; padding:6rem 1rem;}
    .hero-kicker{
      display:inline-block; padding:.4rem .9rem; font-size:.85rem; letter-spacing:.1em;
      background:linear-gradient(90deg, var(--brand1), var(--brand2)); color:#0b0b10; border-radius:999px; font-weight:800;
      text-transform:uppercase; box-shadow:var(--shadow);
    }
    .hero-title{
      font-size: clamp(2.2rem, 4vw + 1rem, 4.2rem);
      margin:1rem 0 .5rem; font-weight:900; line-height:1.05;
      background:linear-gradient(90deg, #fff, #cde6ff 40%, #fff);
      -webkit-background-clip:text; background-clip:text; color:transparent;
      text-shadow: 0 6px 30px rgba(69,240,255,.15);
    }
    .hero-underline{
      width:140px; height:6px; margin:.8rem auto 0; border-radius:999px;
      background:linear-gradient(90deg, var(--brand1), var(--brand2));
      box-shadow:0 0 24px rgba(69,240,255,.55);
      animation:pulse 2.2s ease-in-out infinite;
    }
    @keyframes pulse{0%,100%{transform:scaleX(.9)}50%{transform:scaleX(1)}}
    .meteor{
      position:absolute; width:420px; aspect-ratio:1/1; border-radius:50%;
      background:radial-gradient(closest-side, #ffffff0d, transparent 70%);
      filter: blur(40px);
      animation: float 12s ease-in-out infinite;
    }
    .meteor.m1{top:-80px; left:-120px}
    .meteor.m2{bottom:-160px; right:-120px; animation-delay:-4s}
    @keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(16px)}}
  
    /* Breadcrumb - cam şerit */
    .breadcrumb-glass{
      position:relative; z-index:2; margin-top:-32px;
    }
    .breadcrumb-bar{
      display:flex; gap:.6rem; align-items:center; justify-content:center;
      width:min(980px, 92%); margin:0 auto; padding:.7rem 1rem;
      color:var(--muted); background:linear-gradient(180deg, #ffffff14, #ffffff08);
      border:1px solid #ffffff22; border-radius:999px; backdrop-filter: blur(8px) saturate(130%);
      box-shadow:var(--shadow);
    }
    .breadcrumb-bar a{color:#e6e9ef; text-decoration:none}
    .breadcrumb-sep{opacity:.5}
  
    /* Toolbar (arama + filtre etiketleri) */
    .tool-wrap{
      width:min(1200px, 92%); margin:2.2rem auto 0; display:flex; gap:.8rem; flex-wrap:wrap; align-items:center; justify-content:space-between;
    }
    .search{
      flex:1 1 320px; display:flex; align-items:center; gap:.6rem; padding:.7rem 1rem; border-radius:999px;
      background:#0f0f17; border:1px solid #24243a;
    }
    .search input{
      flex:1; background:transparent; border:0; outline:0; color:var(--text); font-size:.98rem;
    }
    .chips{display:flex; gap:.5rem; flex-wrap:wrap}
    .chip{
      border:1px solid #2b2b45; background:#101020; color:#cfd6e3; padding:.5rem .9rem; border-radius:999px; font-size:.88rem; cursor:pointer;
      transition:.25s transform, .25s background, .25s border;
    }
    .chip.active, .chip:hover{border-color:transparent; background:linear-gradient(90deg, var(--brand1), var(--brand2)); color:#0b0b10; transform:translateY(-2px)}
  
    /* Grid */
    .grid{
      width:min(1200px, 92%); margin:1.8rem auto 4rem;
      display:grid; gap:1.1rem;
      grid-template-columns: repeat(auto-fill, minmax(260px,1fr));
    }
    .cardx{
      position:relative; overflow:hidden; border-radius:var(--radius); background:linear-gradient(180deg, #171725, #12121b);
      border:1px solid #24243a; box-shadow: var(--shadow);
      transform-style:preserve-3d; transition: .35s transform, .35s box-shadow, .35s border-color;
    }
    .cardx:hover{transform:translateY(-4px); border-color:#35355a; box-shadow:0 20px 40px rgba(0,0,0,.55)}
    .shine{position:absolute; inset: -120%; background: radial-gradient(650px 250px at var(--mx,50%) var(--my,50%), #ffffff18, transparent 40%); pointer-events:none; mix-blend-mode: screen;}
    .thumb{
      height:220px; background:#0c0c14; display:block; overflow:hidden;
    }
    .thumb img{
      width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.02); transition:transform .5s ease;
    }
    .cardx:hover .thumb img{transform:scale(1.07)}
    .badge{
      position:absolute; top:12px; left:12px; z-index:2; font-weight:700; letter-spacing:.02em;
      background:linear-gradient(90deg, var(--brand1), var(--brand2)); color:#0b0b10; padding:.35rem .7rem; border-radius:999px; font-size:.75rem; box-shadow:var(--shadow);
    }
    .bodyx{padding:14px 14px 16px}
    .title{
      font-size:1rem; font-weight:800; letter-spacing:.2px; margin:4px 0 2px;
      background:linear-gradient(90deg, #fff, #e6faff); -webkit-background-clip:text; background-clip:text; color:transparent;
    }
    .muted{color:var(--muted); font-size:.9rem}
    .cta{
      margin-top:.9rem; display:flex; gap:.5rem; flex-wrap:wrap;
    }
    .btnx{
      display:inline-flex; align-items:center; gap:.45rem; border:1px solid #2d2d49; background:#0e0e18; color:#dfe6f3;
      padding:.55rem .9rem; border-radius:999px; font-size:.9rem; text-decoration:none; transition:.25s transform,.25s border,.25s background;
    }
    .btnx:hover{transform:translateY(-2px); border-color:transparent; background:linear-gradient(90deg, var(--brand1), var(--brand2)); color:#0b0b10}
    .reveal{opacity:0; transform: translateY(12px); transition: .6s ease; }
    .reveal.on{opacity:1; transform:none;}
    @media (max-width: 640px){
      .hero-title{font-size: clamp(2rem, 7vw, 3rem)}
      .thumb{height:200px}
    }

    /* ABOUT PAGE */
.about-page{
    background: radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%), var(--bg);
    color:var(--text);
    font-family:"Inter",system-ui;
  }
  
  /* HERO */
  .about-hero{
    position:relative; min-height:64vh; display:grid; place-items:center; overflow:hidden;
    background:url('../image/hakkimizda-backround.png') center/cover no-repeat fixed;
    isolation:isolate;
  }
  .about-hero::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(11,11,16,.55), rgba(11,11,16,.85));
    backdrop-filter:saturate(130%) blur(2px);
  }
  .hero-inner{position:relative; z-index:1; text-align:center; padding:6rem 1rem;}
  .hero-kicker{
    display:inline-block; padding:.45rem .9rem; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase;
    background:var(--brandGradient); color:#0b0b10; border-radius:999px; font-weight:900; box-shadow:var(--shadow);
  }
  .hero-title{
    font-size:clamp(2.2rem,4vw + 1rem,4.2rem); margin:1rem 0 .5rem; font-weight:900; line-height:1.05;
    background:linear-gradient(90deg,#fff,#cde6ff 40%,#fff); -webkit-background-clip:text; background-clip:text; color:transparent;
    text-shadow:0 6px 30px rgba(69,240,255,.15);
  }
  .hero-underline{
    width:140px;height:6px;margin:.8rem auto 0;border-radius:999px;
    background:var(--brandGradient); box-shadow:0 0 24px rgba(69,240,255,.55); animation:pulse 2.2s ease-in-out infinite;
  }
  @keyframes pulse{0%,100%{transform:scaleX(.9)}50%{transform:scaleX(1)}}
  
  /* Breadcrumb */
  .breadcrumb-glass{position:relative; margin-top:-32px;}
  .breadcrumb-bar{
    display:flex; gap:.6rem; align-items:center; justify-content:center;
    width:min(980px,92%); margin:0 auto; padding:.7rem 1rem; color:var(--muted);
    background:linear-gradient(180deg,#ffffff14,#ffffff08); border:1px solid #ffffff22; border-radius:999px;
    backdrop-filter: blur(8px) saturate(130%); box-shadow:var(--shadow);
  }
  .breadcrumb-bar a{color:#e6e9ef; text-decoration:none}
  .breadcrumb-sep{opacity:.5}
  
  /* CONTENT */
  .about-wrap{width:min(1200px,92%); margin:2.4rem auto 4rem;}
  .about-grid{
    display:grid;
    grid-template-columns: 1.05fr 1.25fr;
    gap:1.4rem;
    align-items:start;           /* ← uzamayı engeller */
  }
  @media (max-width: 992px){ .about-grid{grid-template-columns:1fr;} }
  
  /* LEFT: Video column */
  .video-card{
    align-self:center;           /* sağ panel uzun olsa da ortala */
    background:transparent;      /* dış kutu görünmesin */
    border:0;
    box-shadow:none;
    padding:0;
  }
  
  /* YouTube lite card */
  .yt-card{
    position:relative; aspect-ratio:16/9;
    border-radius:var(--radius); overflow:hidden;
    background:#0f0f17; border:1px solid var(--stroke); box-shadow:var(--shadow); isolation:isolate;
  
    /* yatay ortalama + max genişlik */
    width:100%;
    max-width:720px;
    margin:0 auto;
  }
  @supports not (aspect-ratio:16/9){
    .yt-card{height:0; padding-top:56.25%}
    .yt-card>*{position:absolute; inset:0}
  }
  .yt-thumb{
    width:100%; height:100%; object-fit:cover; display:block;
    transform:scale(1.02); transition:transform .6s ease;
  }
  .yt-card:hover .yt-thumb{transform:scale(1.06)}
  .yt-play{
    position:absolute; inset:auto auto 14px 14px;
    display:flex; align-items:center; gap:.55rem;
    padding:.6rem .9rem; border-radius:999px; border:0; cursor:pointer;
    background:var(--brandGradient); color:#0b0b10; font-weight:800; box-shadow:var(--shadow); z-index:3;
  }
  .yt-iframe{position:absolute; inset:0; width:100%; height:100%; border:0; display:none; z-index:2;}
  .yt-iframe.is-live{display:block}
  .yt-shine{
    position:absolute; inset:-30%;
    background:radial-gradient(650px 250px at var(--mx,30%) var(--my,20%), #ffffff18, transparent 40%);
    mix-blend-mode:screen; pointer-events:none; z-index:1;
  }
  
  /* RIGHT: Text panel */
  .text-panel{
    border-radius:var(--radius); background:linear-gradient(180deg,#171725,#12121b);
    border:1px solid var(--stroke); box-shadow:var(--shadow);
    padding:1.4rem 1.2rem 1.6rem 1.2rem;
  }
  .text-panel .lead{font-size:1.05rem; color:#eaf2ff; line-height:1.75}
  .text-panel p{color:#cbd4e3; margin:.7rem 0}
  .highlights{display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:.8rem; margin-top:1rem}
  .tag{
    display:flex; align-items:center; gap:.6rem; padding:.6rem .8rem; border-radius:14px; background:#101020; border:1px solid #2b2b45; color:#dfe6f3; font-size:.92rem;
  }
  .tag svg{opacity:.9}
  
  /* Mini stats */
  .stats{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.8rem; margin-top:1rem}
  .stat{ text-align:center; padding:.9rem; border-radius:14px; background:#0f0f17; border:1px solid #24243a; }
  .stat b{font-size:1.2rem}
  .stat small{display:block; color:#aeb4c0}
  
  /* Reveal */
  .reveal{opacity:0; transform:translateY(12px); transition:.6s ease;}
  .reveal.on{opacity:1; transform:none;}

  /* POLİTİKALAR CSS */
  /* Sayfa kapsayıcısı – global palette'ten beslenir */
.policy-page{
    --bg: var(--surface-900, #0b0b10);
    --text: var(--text-100, #eef1f7);
    --muted: var(--text-400, #aeb4c0);
    --stroke: var(--line-700, #27283d);
    --radius: 18px;
    --shadow: 0 10px 30px rgba(0,0,0,.45);
    color:var(--text);
    background: radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%), var(--bg);
    font-family:"Inter",system-ui,Segoe UI;
  }
  
  /* HERO */
  .policy-hero{
    position:relative; min-height:60vh; display:grid; place-items:center; overflow:hidden;
    background:url('../image/politikalar-backround.png') center/cover no-repeat fixed; isolation:isolate;
  }
  .policy-hero::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(11,11,16,.55), rgba(11,11,16,.85));
    backdrop-filter:saturate(130%) blur(2px);
  }
  .hero-inner{position:relative; z-index:1; text-align:center; padding:5.5rem 1rem;}
  .hero-kicker{
    display:inline-block; padding:.45rem .9rem; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase;
    background:var(--brandGradient); color:#0b0b10; border-radius:999px; font-weight:900; box-shadow:var(--shadow);
  }
  .hero-title{
    font-size:clamp(2.2rem,4vw + 1rem,4.1rem); margin:1rem 0 .5rem; font-weight:900; line-height:1.05;
    background:linear-gradient(90deg,#fff,#cde6ff 40%,#fff); -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .hero-underline{width:140px;height:6px;margin:.8rem auto 0;border-radius:999px;background:var(--brandGradient); box-shadow:0 0 24px rgba(69,240,255,.4);}
  
  /* Breadcrumb (glass) */
  .breadcrumb-glass{position:relative; margin-top:-28px;}
  .breadcrumb-bar{
    display:flex; gap:.6rem; align-items:center; justify-content:center;
    width:min(980px,92%); margin:0 auto; padding:.7rem 1rem; color:var(--muted);
    background:linear-gradient(180deg,#ffffff14,#ffffff08); border:1px solid #ffffff22; border-radius:999px;
    backdrop-filter: blur(8px) saturate(130%); box-shadow:var(--shadow);
  }
  .breadcrumb-bar a{color:#e6e9ef; text-decoration:none}
  .breadcrumb-sep{opacity:.5}
  
  /* Toolbar (kategori chipleri) */
  .policy-tools{width:min(1200px,92%); margin:2rem auto 0; display:flex; justify-content:center; flex-wrap:wrap; gap:.6rem;}
  .chip{
    border:1px solid #2b2b45; background:#101020; color:#cfd6e3; padding:.5rem .9rem; border-radius:999px; font-size:.9rem; cursor:pointer;
    transition:.25s transform, .25s background, .25s border;
  }
  .chip.active, .chip:hover{border-color:transparent; background:var(--brandGradient); color:#0b0b10; transform:translateY(-2px)}
  
  /* Grid + Kartlar */
  .policy-wrap{width:min(1200px,92%); margin:1.6rem auto 4rem;}
  .policy-grid{display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:1rem;}
  @media (max-width: 992px){ .policy-grid{grid-template-columns:1fr 1fr;} }
  @media (max-width: 640px){ .policy-grid{grid-template-columns:1fr;} }
  
  .pcard{
    border-radius:var(--radius);
    background:linear-gradient(180deg,#171725,#12121b);
    border:1px solid var(--stroke);
    box-shadow:var(--shadow);
    padding:1.1rem 1rem 1.1rem 1rem;
    position:relative;
    overflow:hidden;
  }
  .pcard::after{ /* üst kenara gradient ince hat */
    content:""; position:absolute; inset:0 0 auto 0; height:3px; background:var(--brandGradient); opacity:.9;
  }
  .phead{display:flex; align-items:center; gap:.6rem; margin-bottom:.6rem;}
  .pill{
    display:inline-flex; align-items:center; gap:.5rem; font-weight:800; padding:.45rem .75rem; border-radius:999px;
    background:linear-gradient(180deg, #ffffff10, #ffffff06); border:1px solid #ffffff25; color:#eaf2ff;
  }
  .pill svg{opacity:.9}
  .pdesc{color:var(--muted); margin:.15rem 0 .4rem; font-size:.95rem}
  
  /* Liste – modern madde işaretleri */
  .plist{list-style:none; padding-left:0; margin:0;}
  .plist li{
    position:relative; padding-left:1.35rem; margin:.45rem 0; color:#cbd4e3; line-height:1.6;
  }
  .plist li::before{
    content:""; position:absolute; left:0; top:.55rem; width:.75rem; height:.75rem; border-radius:999px;
    background:var(--brandGradient); box-shadow:0 0 12px rgba(255,153,26,.45);
  }
  /* REFERANSLAR */
  /* Reveal */
.reveal{opacity:0; transform:translateY(12px); transition:.6s ease;}
.reveal.on{opacity:1; transform:none;}

/* PAGE */
.refs-page{
  --bg: var(--surface-900, #0b0b10);
  --text: var(--text-100, #eef1f7);
  --muted: var(--text-400, #aeb4c0);
  --stroke: var(--line-700, #27283d);
  --radius: 18px;
  --shadow: 0 10px 30px rgba(0,0,0,.45);
  color:var(--text);
  background: radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%), var(--bg);
  font-family:"Inter",system-ui,Segoe UI;
}

/* HERO */
.refs-hero{
  position:relative; min-height:56vh; display:grid; place-items:center; overflow:hidden;
  background:url('../image/referanlar-backround.png') center/cover no-repeat fixed; /* dosya yolun buysa korudum */
  isolation:isolate;
}
.refs-hero::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(11,11,16,.55),rgba(11,11,16,.9));
  backdrop-filter:saturate(130%) blur(2px);
}
.hero-inner{position:relative; z-index:1; text-align:center; padding:5.5rem 1rem;}
.hero-kicker{
  display:inline-block; padding:.45rem .9rem; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase;
  background:var(--brandGradient); color:#0b0b10; border-radius:999px; font-weight:900; box-shadow:var(--shadow);
}
.hero-title{
  font-size:clamp(2.2rem,4vw + 1rem,4rem); margin:1rem 0 .5rem; font-weight:900; line-height:1.05;
  background:linear-gradient(90deg,#fff,#cde6ff 40%,#fff); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-underline{width:140px;height:6px;margin:.8rem auto 0;border-radius:999px;background:var(--brandGradient); box-shadow:0 0 24px rgba(255,153,26,.45);}

/* Breadcrumb */
.breadcrumb-glass{position:relative; margin-top:-28px;}
.breadcrumb-bar{
  display:flex; gap:.6rem; align-items:center; justify-content:center;
  width:min(980px,92%); margin:0 auto; padding:.7rem 1rem; color:var(--muted);
  background:linear-gradient(180deg,#ffffff14,#ffffff08); border:1px solid #ffffff22; border-radius:999px;
  backdrop-filter: blur(8px) saturate(130%); box-shadow:var(--shadow);
}
.breadcrumb-bar a{color:#e6e9ef; text-decoration:none}
.breadcrumb-sep{opacity:.5}

/* TOOLS (search + chips) — sticky glass bar */
.refs-tools{
  width:min(1200px,92%); margin:2rem auto 0;
  display:flex; gap:.7rem; flex-wrap:wrap; align-items:center; justify-content:center;

  position:sticky; top:86px; z-index:6;
  padding:.6rem .75rem; border-radius:14px;
  background:linear-gradient(180deg,#ffffff12,#ffffff08);
  border:1px solid #ffffff22;
  backdrop-filter: blur(8px) saturate(130%);
  box-shadow:var(--shadow);
}
.search{
  flex:1 1 420px; display:flex; align-items:center; gap:.6rem; padding:.7rem 1rem; border-radius:999px;
  background:#0f0f17; border:1px solid #2b2b45; box-shadow:var(--shadow);
}
.search input{all:unset; flex:1; color:#eaf2ff;}
.search input::placeholder{color:#9aa3b2; opacity:.9}
.chips{display:flex; gap:.5rem; flex-wrap:wrap; justify-content:center}
.chip{
  border:1px solid #2b2b45; background:#101020; color:#cfd6e3; padding:.5rem .9rem; border-radius:999px; font-size:.9rem; cursor:pointer;
  transition:.25s transform,.25s background,.25s border;
}
.chip.active, .chip:hover{border-color:transparent; background:var(--brandGradient); color:#0b0b10; transform:translateY(-2px)}
.chip.active{ box-shadow:0 0 0 2px rgba(255,255,255,.06) inset; }

/* GRID */
.refs-wrap{width:min(1200px,92%); margin:1.6rem auto 4rem;}
.logo-grid{display:grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap:1rem;}
@media (max-width:1100px){ .logo-grid{grid-template-columns: repeat(4,1fr);} }
@media (max-width:820px){ .logo-grid{grid-template-columns: repeat(3,1fr);} }
@media (max-width:560px){
  .logo-grid{grid-template-columns: repeat(2,1fr);}
  .refs-tools{ top:72px; } /* mobil navbar daha kısa ise */
}

/* CARD */
.logo-card{
  position:relative; aspect-ratio:1/1; /* kare */
  display:grid; place-items:center; overflow:hidden; isolation:isolate; text-decoration:none;
  border-radius:14px;
  background: radial-gradient(140% 120% at 30% 0%, #151523 0%, #111119 60%);
  border:1px solid #26263c;
  box-shadow: 0 8px 22px rgba(0,0,0,.32);
}
.logo-card::after{
  content:""; position:absolute; inset:-1px; border-radius:16px; padding:1px;
  background: var(--brandGradient);
  -webkit-mask:linear-gradient(#0000,#000) content-box, linear-gradient(#000,#000);
          mask:linear-gradient(#0000,#000) content-box, linear-gradient(#000,#000);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity:0; transition:.3s opacity;
}
.logo-card:hover::after{opacity:.55;}

.logo-img{
  max-width: 80%; max-height: 72%; object-fit:contain;
  filter: grayscale(55%) contrast(1.05) brightness(.98);
  opacity:.94; transform:scale(.985);
  transition:.28s filter,.28s opacity,.35s transform;
}
.logo-card:hover .logo-img{
  filter: grayscale(0%) contrast(1.05) brightness(1.02);
  opacity:1; transform:scale(1.06);
}

.logo-name{
  position:absolute; bottom:10px; left:12px; right:12px; text-align:center;
  font-size:.78rem; color:#9fb0c9; letter-spacing:.2px; opacity:0; transform:translateY(6px);
  transition:.25s opacity,.25s transform;
}
.logo-card:hover .logo-name{opacity:.85; transform:none;}

/* EKATALOG CSS */
/* ===== E-KATALOG ===== */
.ekat-page {
  --bg: #0b0b10;
  --text: #eef1f7;
  --muted: #aeb4c0;
  --stroke: #27283d;
  --radius: 18px;
  --shadow: 0 10px 30px rgba(0,0,0,.45);
  color: var(--text);
  background: radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%), var(--bg);
  font-family: "Inter", system-ui, Segoe UI;
}

/* HERO */
.ekat-hero {
  position: relative;
  min-height: 56vh;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: url('../image/katalog-backround.png') center/cover no-repeat fixed;
  isolation: isolate;
}
.ekat-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(11,11,16,.55), rgba(11,11,16,.9));
  backdrop-filter: saturate(130%) blur(2px);
}
.hero-inner {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 5.5rem 1rem;
}
.hero-kicker {
  display: inline-block;
  padding: .45rem .9rem;
  font-size: .85rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  background: var(--brandGradient);
  color: #0b0b10;
  border-radius: 999px;
  font-weight: 900;
  box-shadow: var(--shadow);
}
.hero-title {
  font-size: clamp(2.2rem,4vw + 1rem,4rem);
  margin: 1rem 0 .5rem;
  font-weight: 900;
  line-height: 1.05;
  background: linear-gradient(90deg,#fff,#cde6ff 40%,#fff);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-underline {
  width: 140px;
  height: 6px;
  margin: .8rem auto 0;
  border-radius: 999px;
  background: var(--brandGradient);
  box-shadow: 0 0 24px rgba(255,153,26,.45);
}

/* Breadcrumb */
.breadcrumb-glass { margin-top: -28px; position: relative; }
.breadcrumb-bar {
  display: flex;
  gap: .6rem;
  align-items: center;
  justify-content: center;
  width: min(980px, 92%);
  margin: 0 auto;
  padding: .7rem 1rem;
  color: var(--muted);
  background: linear-gradient(180deg, #ffffff14, #ffffff08);
  border: 1px solid #ffffff22;
  border-radius: 999px;
  backdrop-filter: blur(8px) saturate(130%);
  box-shadow: var(--shadow);
}
.breadcrumb-bar a {
  color: #e6e9ef;
  text-decoration: none;
}
.breadcrumb-sep { opacity: .5; }

/* Content */
.ekat-wrap {
  width: min(1200px, 92%);
  margin: 2.2rem auto 4rem;
}
.ekat-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  margin-bottom: 1rem;
  color: #cfd6e3;
}
.pill {
  background: linear-gradient(180deg,#ffffff12,#ffffff08);
  border: 1px solid #ffffff22;
  padding: .45rem .75rem;
  border-radius: 999px;
  font-weight: 800;
}

/* === Grid === */
.ekat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 1.2rem;
}
@media (max-width: 992px) {
  .ekat-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .ekat-grid { grid-template-columns: 1fr; }
}

/* PDF Card */
.pdf-card {
  position: relative;
  display: grid;
  grid-template-rows: auto auto;
  border-radius: 16px;
  overflow: hidden;
  isolation: isolate;
  background: radial-gradient(140% 120% at 30% 0%, #151523 0%, #111119 60%);
  border: 1px solid #26263c;
  box-shadow: 0 8px 22px rgba(0,0,0,.35);
  color: #eaf2ff;
}
.pdf-thumb {
  position: relative;
  aspect-ratio: 3 / 4;
  display: block;
  width: 100%;
  overflow: hidden;
}
.pdf-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.02);
  transition: transform .55s ease, filter .35s ease;
  filter: saturate(1.02) contrast(1.02);
}
.pdf-card:hover .pdf-thumb img { transform: scale(1.06); }
.pdf-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #0000 55%, #0b0b10 95%);
  opacity: .3;
  transition: .3s ease;
}
.pdf-card:hover .pdf-thumb::after { opacity: .45; }

.pdf-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  padding: .35rem .6rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
  background: var(--brandGradient);
  color: #0b0b10;
  box-shadow: var(--shadow);
}
.pdf-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #0000 55%, #0b0b10 95%);
  opacity: .4;
  transition: opacity .35s ease;
}
.pdf-card:hover .pdf-overlay { opacity: .55; }

.pdf-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  padding: .8rem .9rem;
  border-top: 1px solid #202036;
  background: linear-gradient(180deg, #111119 0%, #0b0b10 100%) !important;
}
.pdf-title {
  font-weight: 800;
  color: #ffffff;
  letter-spacing: .2px;
  font-size: 1.05rem;
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}
.pdf-actions {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
}

/* Button */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .5rem .9rem;
  border-radius: 999px;
  font-weight: 800;
  line-height: 1.1;
  text-transform: none;
  letter-spacing: normal;
  border: 1px solid #2b2b45;
  background: #101020;
  color: #dfe6f3;
  cursor: pointer;
  text-decoration: none;
  transition: .25s background, .25s border, .25s transform;
}
.btn:hover {
  background: var(--brandGradient);
  color: #0b0b10;
  border-color: transparent;
  transform: translateY(-1px);
}
.btn:focus-visible {
  outline: 2px solid #ffffff33;
  outline-offset: 2px;
}
.btn svg {
  flex: 0 0 18px;
}

/* CTA: English Catalog */
.cta-banner {
  margin-top: 1.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.eng-catalog-card,
.eng-catalog-card:link,
.eng-catalog-card:visited {
  display: flex;
  align-items: center;
  gap: .8rem;
  width: min(1200px, 92%);
  padding: 1rem 1.2rem;
  background: linear-gradient(180deg, #ffffff18, #ffffff0d) !important;
  border: 1px solid #ffffff26 !important;
  border-radius: 16px;
  color: #eaf2ff !important;
  text-decoration: none !important;
}
.eng-catalog-icon {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: var(--brandGradient);
  color: #0b0b10;
  box-shadow: var(--shadow);
}
.eng-catalog-title {
  color: #ffffff !important;
  font-weight: 900;
  letter-spacing: .2px;
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}
.eng-catalog-sub {
  color: #cfd6e3 !important;
  opacity: 1 !important;
}

/* Reveal */
.reveal {
  opacity: 0;
  transform: translateY(12px);
  transition: .6s ease;
}
.reveal.on {
  opacity: 1;
  transform: none;
}

/* Modal */
.pdf-modal {
  position: fixed;
  inset: 0;
  background: #000a;
  display: none;
  place-items: center;
  z-index: 9999;
  padding: 1rem;
}
.pdf-modal.open { display: grid; }
.modal-inner {
  width: min(1100px, 92%);
  aspect-ratio: 16 / 10;
  background: #000;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #222;
  box-shadow: 0 20px 50px rgba(0,0,0,.6);
}
.modal-iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #111;
  color: #fff;
  border: 1px solid #333;
  cursor: pointer;
}
  /* İK SAYFASI CSS */
  .hr-page{
    --bg: var(--surface-900, #0b0b10);
    --text: var(--text-100, #eef1f7);
    --muted: var(--text-400, #aeb4c0);
    --stroke: var(--line-700, #27283d);
    --radius: 18px;
    --shadow: 0 10px 30px rgba(0,0,0,.45);
    color:var(--text);
    background: radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%), var(--bg);
    font-family:"Inter",system-ui,Segoe UI;
  }
  /* HERO */
  .hr-hero{position:relative; min-height:56vh; display:grid; place-items:center; overflow:hidden; background:url('../image/ik-backround.png') center/cover no-repeat fixed; isolation:isolate;}
  .hr-hero::before{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(11,11,16,.55),rgba(11,11,16,.9)); backdrop-filter:saturate(130%) blur(2px);}
  .hero-inner{position:relative; z-index:1; text-align:center; padding:5.5rem 1rem;}
  .hero-kicker{display:inline-block; padding:.45rem .9rem; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase; background:var(--brandGradient); color:#0b0b10; border-radius:999px; font-weight:900; box-shadow:var(--shadow);}
  .hero-title{font-size:clamp(2.2rem,4vw + 1rem,4rem); margin:1rem 0 .5rem; font-weight:900; line-height:1.05; background:linear-gradient(90deg,#fff,#cde6ff 40%,#fff); -webkit-background-clip:text; background-clip:text; color:transparent;}
  .hero-underline{width:140px;height:6px;margin:.8rem auto 0;border-radius:999px;background:var(--brandGradient); box-shadow:0 0 24px rgba(255,153,26,.45);}
  /* BREADCRUMB */
  .breadcrumb-glass{position:relative; margin-top:-28px;}
  .breadcrumb-bar{display:flex; gap:.6rem; align-items:center; justify-content:center; width:min(980px,92%); margin:0 auto; padding:.7rem 1rem; color:var(--muted); background:linear-gradient(180deg,#ffffff14,#ffffff08); border:1px solid #ffffff22; border-radius:999px; backdrop-filter: blur(8px) saturate(130%); box-shadow:var(--shadow);}
  .breadcrumb-bar a{color:#e6e9ef; text-decoration:none}
  .breadcrumb-sep{opacity:.5}
  
  /* LAYOUT */
  .hr-wrap{width:min(1100px,92%); margin:2.2rem auto 4rem; display:grid; grid-template-columns: 1fr 1.15fr; gap:1.2rem; align-items:start;}
  @media (max-width:1024px){ .hr-wrap{grid-template-columns:1fr;} }
  
  /* INFO (sol) – daha kompakt ve ortalı */
  .info-card{
    align-self:center; width:min(520px,100%); min-height:260px;
    display:flex; flex-direction:column; justify-content:center; gap:.8rem;
    border-radius:var(--radius); background:linear-gradient(180deg,#171725,#12121b);
    border:1px solid var(--stroke); box-shadow:var(--shadow); padding:1.1rem 1rem;
  }
  .info-title{font-weight:900; font-size:1.15rem; color:#eaf2ff;}
  .badges{display:flex; flex-wrap:wrap; gap:.5rem; margin:.2rem 0 .2rem}
  .badge{display:inline-flex; align-items:center; gap:.45rem; padding:.45rem .7rem; border-radius:999px; border:1px solid #2b2b45; background:#101020; color:#dfe6f3; font-weight:800; font-size:.88rem;}
  .badge svg{opacity:.9}
  .hint{font-size:.9rem; color:#9aa3b2}
  
  /* FORM (sağ) */
  .hr-form{border-radius:var(--radius); background:linear-gradient(180deg,#171725,#12121b); border:1px solid var(--stroke); box-shadow:var(--shadow); padding:1.2rem 1.1rem;}
  .hr-form h2{font-weight:900; margin:0 0 .6rem; color:#eaf2ff;}
  
  /* İlerleme çubuğu */
  .progress{height:10px; border-radius:999px; background:#25253a; overflow:hidden; position:relative; margin:.1rem 0 .9rem;}
  .progress-fill{height:100%; width:0%; background:var(--brandGradient); box-shadow:0 0 20px rgba(255,153,26,.35) inset; transition:width .45s ease;}
  .progress-hint{display:flex; justify-content:space-between; font-size:.86rem; color:#cfd6e3; margin:-.4rem 0 .4rem;}
  
  /* Inputs */
  .form-grid{display:grid; grid-template-columns:1fr 1fr; gap:.8rem;}
  @media (max-width:720px){ .form-grid{grid-template-columns:1fr;} }
  .field{display:flex; flex-direction:column; gap:.35rem;}
  .field label{font-size:.9rem; color:#cfd6e3;}
  .input, .textarea{border-radius:12px; border:1px solid #2b2b45; background:#0f0f17; color:#eaf2ff; padding:.7rem .9rem; outline:none; transition:border .2s, box-shadow .2s;}
  .input:focus, .textarea:focus{border-color:transparent; box-shadow:0 0 0 2px #ffffff22;}
  .input.invalid, .textarea.invalid{border-color:#ff4d4d;}
  
  /* File drop */
  .drop{display:flex; align-items:center; gap:.8rem; padding:.9rem; border-radius:14px; border:1px dashed #2b2b45; background:#0f0f17; color:#cfd6e3; cursor:pointer;}
  .drop:hover{border-color:#3a3a58}
  .drop .icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--brandGradient); color:#0b0b10; font-weight:900;}
  #cvInput{display:none}
  
  /* Footer */
  .actions{display:flex; align-items:center; justify-content:space-between; gap:.8rem; margin-top:.6rem; flex-wrap:wrap;}
  .btn-submit{display:inline-flex; align-items:center; gap:.5rem; padding:.65rem 1.2rem; border-radius:999px; font-weight:900; background:var(--brandGradient); color:#0b0b10; border:0; cursor:pointer; box-shadow:var(--shadow);}
  .btn-submit[disabled]{opacity:.7; cursor:not-allowed}
  
  /* Toast */
  .toast{position:fixed; right:16px; bottom:16px; padding:.75rem 1rem; border-radius:12px; background:#101020; border:1px solid #2b2b45; color:#eaf2ff; box-shadow:var(--shadow); transform:translateY(20px); opacity:0; pointer-events:none; transition:.3s;}
  .toast.show{transform:none; opacity:1}


  /* SIK SORULAN SORULAR  */
  .faq-page{
    --bg: var(--surface-900, #0b0b10);
    --text: var(--text-100, #eef1f7);
    --muted: var(--text-400, #aeb4c0);
    --stroke: var(--line-700, #27283d);
    --radius: 18px;
    --shadow: 0 10px 30px rgba(0,0,0,.45);
    color:var(--text);
    background: radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%), var(--bg);
    font-family:"Inter",system-ui,Segoe UI;
  }
  
  /* Shell */
  .faq-wrap{width:min(1100px,92%); margin:2.2rem auto 4rem; display:grid; gap:1rem;}
  /* Tools */
  .faq-tools{
    display:flex; gap:.7rem; align-items:center; flex-wrap:wrap; justify-content:center;
  }
  .faq-search{
    flex:1 1 520px; display:flex; align-items:center; gap:.6rem; padding:.75rem 1rem;
    border-radius:999px; background:#0f0f17; border:1px solid #2b2b45; box-shadow:var(--shadow);
  }
  .faq-search input{all:unset; flex:1; color:#eaf2ff; font-size:1rem;}
  .faq-actions{display:flex; gap:.5rem; flex-wrap:wrap;}
  .faq-btn{
    border:1px solid #2b2b45; background:#101020; color:#dfe6f3; padding:.55rem .95rem;
    border-radius:999px; font-weight:800; cursor:pointer; transition:.25s;
  }
  .faq-btn:hover{background:var(--brandGradient); color:#0b0b10; border-color:transparent; transform:translateY(-1px)}
  
  /* Grid */
  .faq-grid{display:grid; gap:.9rem;}
  
  /* Item (details/summary = erişilebilir) */
  .faq{
    position:relative; border-radius:16px; overflow:hidden;
    background:linear-gradient(180deg,#171725,#12121b); border:1px solid var(--stroke); box-shadow:var(--shadow);
  }
  .faq::before{
    content:""; position:absolute; inset:-1px; border-radius:18px; padding:1px;
    background:conic-gradient(from var(--angle,0deg), transparent 0 30%, var(--brandGradient) 40% 60%, transparent 70% 100%);
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
            mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude; opacity:.65; pointer-events:none;
    animation:spin 8s linear infinite;
  }
  @keyframes spin{to{--angle:360deg}}
  
  .faq summary{
    list-style:none; cursor:pointer; outline:none; user-select:none;
    padding:1rem 1rem 1rem 1.1rem; display:flex; gap:.8rem; align-items:flex-start;
  }
  .faq summary::-webkit-details-marker{display:none}
  .faq .q{
    font-weight:900; font-size:1.05rem; letter-spacing:.2px;
    background:linear-gradient(90deg,#fff,#e6f6ff 40%,#fff);
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .chev{margin-left:auto; transition:.25s transform; opacity:.9}
  details[open] .chev{transform:rotate(180deg)}
  
  .faq .a{
    padding:0 1.1rem 1rem 1.1rem; color:#cbd4e3; line-height:1.7;
    animation:reveal .35s ease;
  }
  @keyframes reveal{from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none}}
  
  .tag-row{display:flex; gap:.4rem; flex-wrap:wrap; margin-top:.3rem}
  .tag{
    font-size:.75rem; padding:.25rem .5rem; border-radius:999px;
    border:1px solid #2b2b45; color:#9fb0c9; background:#0f1020;
  }
  
  /* Empty state (ara sonuç yoksa) */
  .faq-empty{display:none; text-align:center; color:#aeb4c0; padding:1.2rem}
  .faq-empty.on{display:block}
  
  /* Reveal on scroll */
  .reveal{opacity:0; transform:translateY(10px); transition:.6s ease}
  .reveal.on{opacity:1; transform:none}

  /* ---------- MÜŞTERİ GÖRÜŞLERİ (TEMREN) ---------- */
.reviews-page{
    --bg: var(--surface-900, #0b0b10);
    --text: var(--text-100, #eef1f7);
    --muted: var(--text-400, #aeb4c0);
    --stroke: var(--line-700, #27283d);
    --radius: 20px;
    --shadow: 0 12px 30px rgba(0,0,0,.45);
  
    /* Marka renkleri (global değil, sayfa özel) */
    --brand1: #f1ff10;
    --brand2: #ff991a;
    --brandGradient: linear-gradient(90deg, var(--brand1), var(--brand2));
  
    color: var(--text);
    background:
      radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%),
      var(--bg);
    font-family: "Inter", system-ui, Segoe UI, Roboto, Arial, sans-serif;
  }
  
  /* ---------- HERO ---------- */
  .reviews-hero{
    position:relative; min-height:56vh; display:grid; place-items:center; overflow:hidden;
    background:url('../image/musteri-gorusleri.png') center/cover no-repeat fixed; isolation:isolate;
  }
  .reviews-hero::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(11,11,16,.55), rgba(11,11,16,.9));
    backdrop-filter:saturate(130%) blur(2px);
  }
  .hero-inner{position:relative; z-index:1; text-align:center; padding:5.5rem 1rem;}
  .hero-kicker{
    display:inline-block; padding:.45rem .9rem; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase;
    background:var(--brandGradient); color:#0b0b10; border-radius:999px; font-weight:900; box-shadow:var(--shadow);
  }
  .hero-title{
    font-size:clamp(2.2rem,4vw + 1rem,4rem); margin:1rem 0 .5rem; font-weight:900; line-height:1.05;
    background:linear-gradient(90deg,#fff,#cde6ff 40%,#fff); -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .hero-underline{
    width:140px; height:6px; margin:.8rem auto 0; border-radius:999px;
    background:var(--brandGradient); box-shadow:0 0 24px rgba(255,153,26,.45);
  }
  
  /* ---------- BREADCRUMB (glass) ---------- */
  .breadcrumb-glass{position:relative; margin-top:-28px;}
  .breadcrumb-bar{
    display:flex; gap:.6rem; align-items:center; justify-content:center;
    width:min(980px,92%); margin:0 auto; padding:.7rem 1rem; color:var(--muted);
    background:linear-gradient(180deg,#ffffff14,#ffffff08); border:1px solid #ffffff22; border-radius:999px;
    backdrop-filter: blur(8px) saturate(130%); box-shadow:var(--shadow);
  }
  .breadcrumb-bar a{color:#e6e9ef; text-decoration:none}
  .breadcrumb-sep{opacity:.5}
  
  /* ---------- TOOLS (Search + Filter Chips) ---------- */
  .rev-wrap{width:min(1200px,92%); margin:2.2rem auto 4rem; display:grid; gap:1rem;}
  .rev-tools{display:flex; align-items:center; gap:.7rem; flex-wrap:wrap; justify-content:center;}
  .rev-search{
    flex:1 1 520px; display:flex; align-items:center; gap:.6rem; padding:.75rem 1rem;
    border-radius:999px; background:#0f0f17; border:1px solid #2b2b45; box-shadow:var(--shadow);
    transition:.25s box-shadow, .25s border-color;
  }
  .rev-search:focus-within{
    box-shadow:0 0 0 2px rgba(255,153,26,.35), 0 12px 28px rgba(0,0,0,.35);
    border-color:transparent;
  }
  .rev-search input{all:unset; flex:1; color:#eaf2ff; font-size:1rem;}
  .chips{display:flex; gap:.5rem; flex-wrap:wrap; justify-content:center}
  .chip{
    border:1px solid #2b2b45; background:#101020; color:#cfd6e3; padding:.5rem .9rem; border-radius:999px; font-size:.9rem; cursor:pointer;
    transition:.25s transform,.25s background,.25s border;
  }
  .chip.active,.chip:hover{
    border-color:transparent; background:var(--brandGradient); color:#0b0b10; transform:translateY(-2px)
  }
  
  /* ---------- GRID ---------- */
  .rev-grid{display:grid; grid-template-columns:1fr 1fr; gap:1.2rem;}
  @media (max-width: 980px){ .rev-grid{grid-template-columns:1fr;} }
  
  /* ---------- CARD ---------- */
  .rev-card{
    position:relative; border-radius:var(--radius); overflow:hidden; isolation:isolate;
    background:linear-gradient(180deg,#171725,#12121b); border:1px solid var(--stroke); box-shadow:var(--shadow);
    display:grid; grid-template-columns:260px 1fr; gap:0;
  }
  @media (max-width: 640px){ .rev-card{grid-template-columns:1fr;} }
  
  /* Parlak hareketli kenar ve sol marka şeridi */
  .rev-card::before{
    content:""; position:absolute; inset:-1px; border-radius:calc(var(--radius) + 2px); padding:1px;
    background:conic-gradient(from var(--angle,0deg), transparent 0 30%, var(--brandGradient) 40% 60%, transparent 70% 100%);
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
            mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude; opacity:.35; pointer-events:none; animation:spin 12s linear infinite;
  }
  .rev-card::after{
    content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background:var(--brandGradient); opacity:.95;
  }
  @keyframes spin{to{--angle:360deg}}
  
  /* Sol panel */
  .rev-left{
    padding:1.1rem; border-right:1px solid #202036; display:flex; flex-direction:column; align-items:center; text-align:center; gap:.45rem;
    background:linear-gradient(180deg,#151525,#101018);
  }
  @media (max-width: 640px){ .rev-left{border-right:0; border-bottom:1px solid #202036;} }
  
  .avatar{
    width:82px; height:82px; border-radius:999px; object-fit:cover; border:2px solid #2b2b45;
    box-shadow:0 0 0 4px #0b0b10, 0 0 0 6px rgba(255,153,26,.35), 0 10px 20px rgba(0,0,0,.45);
  }
  .rev-name{font-weight:900; color:#eaf2ff;}
  .rev-role{font-size:.9rem; color:#9fb0c9; line-height:1.35}
  .badge{
    display:inline-flex; align-items:center; gap:.45rem; padding:.35rem .7rem; border-radius:999px;
    background:var(--brandGradient); color:#0b0b10; font-weight:900; font-size:.8rem; box-shadow:var(--shadow);
  }
  
  /* Sağ içerik */
  .rev-right{padding:1rem; display:grid; gap:.7rem; align-content:start}
  
  /* ---------- Lite YouTube ---------- */
  .yt-card{
    position:relative; aspect-ratio:16/9; border-radius:12px; overflow:hidden;
    background:#0f0f17 center/cover no-repeat; border:1px solid #26263c;
    transition:.25s box-shadow, .25s transform;
  }
  .yt-card:hover{
    box-shadow:0 0 0 2px rgba(255,153,26,.35), 0 12px 28px rgba(0,0,0,.35);
    transform:translateY(-2px);
  }
  .yt-shine{position:absolute; inset:-30%; background:radial-gradient(650px 250px at var(--mx,30%) var(--my,20%), #ffffff18, transparent 40%); mix-blend-mode:screen; pointer-events:none; z-index:1;}
  .yt-play{
    position:absolute; inset:auto auto 12px 12px; display:inline-flex; align-items:center; gap:.5rem;
    padding:.55rem .9rem; border-radius:999px; background:var(--brandGradient); color:#0b0b10; font-weight:900; border:0; cursor:pointer; z-index:2;
  }
  .yt-iframe{position:absolute; inset:0; width:100%; height:100%; border:0; display:none; z-index:2;}
  .yt-iframe.is-live{display:block}
  
  /* ---------- Quote ---------- */
  .quote{
    position:relative; padding:.95rem 1rem .95rem 3.1rem; border-radius:14px;
    background:linear-gradient(180deg,#0f0f17,#0c0c14); border:1px solid #202036; color:#dfe6f3; line-height:1.65;
  }
  .quote::before{
    content:"“"; position:absolute; left:.8rem; top:.15rem; font-size:2.6rem; line-height:1; color:#9fb0c9; opacity:.5;
  }
  .quote::after{
    content:""; position:absolute; left:0; top:0; bottom:0; width:3px; border-radius:3px 0 0 3px; background:var(--brandGradient); opacity:.95;
  }
  .meta{font-size:.85rem; color:#aeb4c0}
  
  /* ---------- Reveal ---------- */
  .reveal{opacity:0; transform:translateY(12px); transition:.6s ease;}
  .reveal.on{opacity:1; transform:none}
  
  /* ---------- Empty ---------- */
  .rev-empty{display:none; text-align:center; color:#aeb4c0; padding:1rem}
  .rev-empty.on{display:block}
  
    /* BANKA CSS  */
/* ================== TEMREN — BANKA (DARK) ================== */
/* Hepsi .bank-page altında; :root yok. */
.bank-page{
  --bg:#0b0b10;
  --text:#eef1f7;
  --muted:#aeb4c0;
  --stroke:#27283d;
  --radius:18px;
  --shadow:0 12px 30px rgba(0,0,0,.45);
  --brand1:#f1ff10;
  --brand2:#ff991a;
  --brandGradient:linear-gradient(90deg,var(--brand1),var(--brand2));
  color:var(--text);
  background:
    radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%),
    var(--bg);
  font-family:"Inter",system-ui,Segoe UI,Roboto,Arial,sans-serif;
}
.bank-page .bg-light{background:transparent!important}

/* ---------- HERO ---------- */
.bank-hero{
  position:relative; min-height:56vh; display:grid; place-items:center; overflow:hidden;
  background:url('../image/bank-backround.png') center/cover no-repeat fixed; isolation:isolate;
}
.bank-hero::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(11,11,16,.55), rgba(11,11,16,.9));
  backdrop-filter:saturate(130%) blur(2px);
}
.hero-inner{position:relative; text-align:center; z-index:1; padding:5.5rem 1rem;}
.hero-kicker{
  display:inline-block; padding:.45rem .9rem; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase;
  background:var(--brandGradient); color:#0b0b10; border-radius:999px; font-weight:900; box-shadow:var(--shadow);
}
.hero-title{
  margin:1rem 0 .5rem; font-weight:900; line-height:1.05;
  font-size:clamp(2.2rem,4vw + 1rem,4rem);
  background:linear-gradient(90deg,#fff,#cde6ff 40%,#fff);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-underline{width:140px;height:6px;border-radius:999px;background:var(--brandGradient);box-shadow:0 0 24px rgba(255,153,26,.45)}

/* ---------- Breadcrumb (glass) ---------- */
.breadcrumb-glass{position:relative; margin-top:-28px;}
.breadcrumb-bar{
  display:flex; gap:.6rem; align-items:center; justify-content:center;
  width:min(980px,92%); margin:0 auto; padding:.7rem 1rem; color:var(--muted);
  background:linear-gradient(180deg,#ffffff14,#ffffff08); border:1px solid #ffffff22; border-radius:999px;
  backdrop-filter: blur(8px) saturate(130%); box-shadow:var(--shadow);
}
.breadcrumb-bar a{color:#e6e9ef; text-decoration:none}
.breadcrumb-sep{opacity:.5}

/* ---------- CONTENT GRID ---------- */
.bank-section{padding:2.2rem 0 4rem}
.bank-grid{
  width:min(1320px,96%);                      /* daha ferah */
  margin:0 auto;
  display:grid; gap:1.2rem;
  grid-template-columns:repeat(auto-fit,minmax(360px,1fr)); /* kartlar büyüdü */
}

/* ---------- CARD ---------- */
.bank-card{
  position:relative; border-radius:16px; overflow:hidden; isolation:isolate;
  background:linear-gradient(180deg,#171725,#12121b);
  border:1px solid var(--stroke);
  box-shadow:0 12px 28px rgba(0,0,0,.38);
  transition:.25s transform, .25s box-shadow;
}
.bank-card::before{
  content:""; position:absolute; inset:-1px; border-radius:18px; padding:1px;
  background:conic-gradient(from var(--angle,0deg), transparent 0 30%, var(--brandGradient) 40% 60%, transparent 70% 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:.35; pointer-events:none; animation:spin 12s linear infinite;
}
@keyframes spin{to{--angle:360deg}}
.bank-card:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 36px rgba(0,0,0,.48), 0 0 0 2px rgba(255,153,26,.22);
}

/* ---------- HEAD ---------- */
.bank-head{
  display:flex; align-items:center; gap:.9rem; padding:1rem 1rem .85rem;
  border-bottom:1px solid #202036;
  background:linear-gradient(180deg,#151525,#111119);
  min-width:0;
}
.bank-logo{
  flex:0 0 48px; width:48px; height:48px; object-fit:contain; border-radius:10px;
  background:#0f0f17; border:1px solid #23233a; padding:.4rem;
  filter:grayscale(10%); transition:.25s filter,.25s transform;
}
.bank-card:hover .bank-logo{filter:none; transform:scale(1.03)}
.bank-title{
  margin:0; flex:1 1 auto; min-width:0;
  color:#eaf2ff; font-weight:900; letter-spacing:.1px; line-height:1.15;
  font-size:clamp(1.45rem,1.1vw + 1.05rem,2rem);
  white-space:normal; word-break:break-word; hyphens:auto;
}
.bank-title small{color:#9fb0c9; font-weight:800; margin-left:.35rem; font-size:.95rem}

/* ---------- BODY ---------- */
.bank-info{padding:1rem 1.2rem 1.25rem;}
.bank-info .row{
  display:grid; grid-template-columns:120px 1fr; align-items:center;
  gap:.65rem; padding:.55rem 0; border-bottom:1px dashed #23233a;
}
.bank-info .row:last-child{border-bottom:0}
.k{color:#aeb4c0; font-weight:800; text-transform:uppercase; font-size:.82rem; letter-spacing:.04em}
.v{color:#eaf2ff; display:flex; gap:.5rem; align-items:center; flex-wrap:wrap}

/* ---------- IBAN satırını ORTALA ---------- */
/* Eğer HTML'e .iban sınıfı eklemek istersen: <div class="row iban"> ... */
.bank-info .row.iban,
.bank-info .row:first-child{
  grid-template-columns:1fr;       /* tek kolona düşür */
  justify-items:center;
  text-align:center;
  padding-top:.7rem;
  padding-bottom:.8rem;
}
.bank-info .row.iban .k,
.bank-info .row:first-child .k{
  order:-1;                         /* etiketi üstte tut */
  margin-bottom:.35rem;
  letter-spacing:.06em;
}
.bank-info .row.iban .v,
.bank-info .row:first-child .v{
  justify-content:center;           /* IBAN + Kopyala ortada */
  gap:.65rem;
}

/* ---------- IBAN kapsülü + Kopyala ---------- */
.copy-text{
  display:inline-block; padding:.44rem .72rem; border-radius:10px;
  background:#0f0f17; border:1px solid #26263c; line-height:1;
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size:.95rem;
  max-width:100%;
  white-space:nowrap; overflow-x:auto;      /* taşarsa yatay kaydır */
}
.copy-btn{
  display:inline-flex; align-items:center; gap:.45rem; padding:.5rem .82rem;
  border-radius:999px; border:1px solid #2b2b45; background:#101020; color:#dfe6f3; cursor:pointer;
  font-weight:900; font-size:.87rem; transition:.25s background,.25s border,.25s transform;
}
.copy-btn:hover{ background:var(--brandGradient); color:#0b0b10; border-color:transparent; transform:translateY(-1px); }

/* ---------- Reveal ---------- */
.reveal{opacity:0; transform:translateY(12px); transition:.6s ease;}
.reveal.on{opacity:1; transform:none}

/* ---------- Toast ---------- */
.copy-toast{
  position:fixed; left:50%; bottom:26px; transform:translateX(-50%) translateY(20px);
  background:linear-gradient(180deg,#ffffff14,#ffffff10);
  border:1px solid #ffffff22; color:#eaf2ff;
  padding:.55rem .9rem; border-radius:999px; backdrop-filter: blur(8px) saturate(130%);
  box-shadow:0 10px 26px rgba(0,0,0,.45);
  opacity:0; pointer-events:none; transition:.35s opacity,.35s transform; z-index:9999;
}
.copy-toast.on{opacity:1; transform:translateX(-50%) translateY(0)}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .bank-grid{ width:min(1200px,94%) }
}
@media (max-width:520px){
  .bank-grid{ grid-template-columns:1fr }
  .bank-info .row{grid-template-columns:1fr}
  .k{margin-bottom:.25rem}
}

/* Inline açık gri/beyaz verilen bölümleri de nötrle */
.bank-page [style*="background:#fff"],
.bank-page [style*="background: #fff"],
.bank-page [style*="background-color:#fff"],
.bank-page [style*="background-color: #fff"],
.bank-page [style*="#f8f8f8"]{
  background:transparent !important;
}

/* Genel section’lar beyazsa kapat; hero ayrı zaten kendi arkaplanını veriyor */
.bank-page section{
  background:transparent;
}

/* ======================= ÜRETİM EKİPMANLARI — DARK ======================= */
/* Hepsi .equip-page altında yaşayacak; arka plan zorla siyah. */
html, body { background:#0b0b10; } /* güvenli varsayılan */
body.equip-page{
  --bg:#0b0b10;
  --text:#eef1f7;
  --muted:#aeb4c0;
  --stroke:#27283d;
  --radius:18px;
  --shadow:0 12px 30px rgba(0,0,0,.45);
  --brand1:#f1ff10;
  --brand2:#ff991a;
  --brandGradient:linear-gradient(90deg,var(--brand1),var(--brand2));

  color:var(--text);
  background:
    radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%),
    var(--bg) !important;

  font-family:"Inter",system-ui,Segoe UI,Roboto,Arial,sans-serif;
}

/* Bootstrap/diğer kalıntıları nötrle */
.equip-page .bg-white,
.equip-page .bg-light,
.equip-page section,
.equip-page .container{ background:transparent !important; }

/* ======================= HERO ======================= */
.equip-hero{
  position:relative; min-height:56vh; display:grid; place-items:center; overflow:hidden;
  background:url('../image/uretim-backround.png') center/cover no-repeat fixed; isolation:isolate;
}
.equip-hero::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(11,11,16,.55),rgba(11,11,16,.9));
  backdrop-filter:saturate(130%) blur(2px);
}
.hero-inner{position:relative; z-index:1; text-align:center; padding:5.5rem 1rem;}
.hero-kicker{
  display:inline-block; padding:.45rem .9rem; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase;
  background:var(--brandGradient); color:#0b0b10; border-radius:999px; font-weight:900; box-shadow:var(--shadow);
}
.hero-title{
  font-size:clamp(2.2rem,4vw + 1rem,4rem); margin:1rem 0 .5rem; font-weight:900; line-height:1.05;
  background:linear-gradient(90deg,#fff,#cde6ff 40%,#fff); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-underline{width:140px;height:6px;margin:.8rem auto 0;border-radius:999px;background:var(--brandGradient); box-shadow:0 0 24px rgba(255,153,26,.45)}

/* ======================= BREADCRUMB (glass) ======================= */
.breadcrumb-glass{position:relative; margin-top:-28px;}
.breadcrumb-bar{
  display:flex; gap:.6rem; align-items:center; justify-content:center;
  width:min(980px,92%); margin:0 auto; padding:.7rem 1rem; color:var(--muted);
  background:linear-gradient(180deg,#ffffff14,#ffffff08); border:1px solid #ffffff22; border-radius:999px;
  backdrop-filter: blur(8px) saturate(130%); box-shadow:var(--shadow);
}
.breadcrumb-bar .crumb{color:#e6e9ef; text-decoration:none}
.breadcrumb-bar .crumb.current{color:#cfd6e3}
.breadcrumb-sep{opacity:.5}

/* ======================= GRID ======================= */
.equip-wrap{width:min(1320px,96%); margin:2.2rem auto 4rem;}
.equip-grid{
  display:grid; gap:1.1rem;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
}

/* ======================= CARD ======================= */
.pro-card{position:relative; display:block; text-decoration:none; color:inherit; -webkit-tap-highlight-color:transparent;}
.pro-card-inner{
  position:relative; border-radius:16px; overflow:hidden; isolation:isolate;
  background:linear-gradient(180deg,#171725,#12121b);
  border:1px solid var(--stroke);
  box-shadow:0 12px 28px rgba(0,0,0,.38);
  transition:transform .25s ease, box-shadow .25s ease;
}
.pro-card-inner::before{
  content:""; position:absolute; inset:-1px; border-radius:18px; padding:1px;
  background:conic-gradient(from var(--angle,0deg), transparent 0 30%, var(--brandGradient) 40% 60%, transparent 70% 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:.45; pointer-events:none; animation:spin 10s linear infinite;
}
@keyframes spin{to{--angle:360deg}}
.pro-card:hover .pro-card-inner{
  box-shadow:0 16px 36px rgba(0,0,0,.48), 0 0 0 2px rgba(255,153,26,.22);
}

/* ——— Medya ——— */
.pro-media{position:relative; height:clamp(240px, 30vw, 340px); overflow:hidden;}
.pro-media img{
  width:100%; height:100%; object-fit:cover;
  transform:scale(1.02); transition:transform .65s ease;
  filter:saturate(104%) contrast(1.02);
}
.pro-card:hover .pro-media img{ transform:scale(1.06); }
.shine{
  position:absolute; inset:-30%;
  background:radial-gradient(650px 250px at var(--mx,30%) var(--my,20%), #ffffff18, transparent 40%);
  mix-blend-mode:screen; pointer-events:none; z-index:1;
}

/* ——— Alt başlık / rozetler ——— */
.pro-bottom{
  position:relative; z-index:2; display:flex; flex-direction:column; gap:.6rem;
  padding:.85rem .9rem 1rem;
  background:linear-gradient(180deg, #0000 0%, #0b0b10 95%);
  border-top:1px solid #0000; margin-top:-3.2rem;
}
.pro-bottom h3{
  margin:0; color:#fff; font-weight:900; font-size:1.1rem;
  text-shadow:0 2px 12px rgba(0,0,0,.45);
}
.tags{display:flex; gap:.4rem; flex-wrap:wrap}
.tag{
  font-size:.75rem; font-weight:800; color:#0b0b10;
  background:var(--brandGradient); border-radius:999px; padding:.25rem .55rem; box-shadow:var(--shadow);
}

/* ——— Reveal panel (slide-up) — Yazılar DÖNMEZ ——— */
.pro-reveal{
  position:absolute; left:8px; right:8px; bottom:8px; z-index:3;
  transform:translateY(110%);
  transition:transform .4s cubic-bezier(.2,.7,.2,1);
  background:linear-gradient(180deg,#0f0f17,#0c0c14);
  border:1px solid #202036; border-radius:14px; padding:.9rem;
  box-shadow:0 16px 36px rgba(0,0,0,.55);
}
.pro-card:hover .pro-reveal,
.pro-card.open  .pro-reveal{ transform:translateY(0); }
.pro-reveal p{color:#cfd6e3; margin:0 0 .8rem; line-height:1.55;}
.pro-cta{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.55rem .9rem; border-radius:999px;
  background:var(--brandGradient); color:#0b0b10; font-weight:900;
}

/* =======================   ======================= */
 
.pro-card .pro-card-inner,
.pro-card .pro-face,
.pro-card .pro-front,
.pro-card .pro-back{
  transform:none !important;
  backface-visibility:visible !important;
  transform-style:flat !important;
  perspective:none !important;
}

/* Eski .pro-back varsa, onu da reveal gibi davranmaya zorla */
.pro-card .pro-back{
  position:absolute; left:8px; right:8px; bottom:8px; z-index:3;
  transform:translateY(110%) !important;
  background:linear-gradient(180deg,#0f0f17,#0c0c14);
  border:1px solid #202036; border-radius:14px; padding:.9rem;
  box-shadow:0 16px 36px rgba(0,0,0,.55);
}
.pro-card:hover .pro-back,
.pro-card.open  .pro-back{ transform:translateY(0) !important; }

/* ======================= Reveal-on-scroll ======================= */
.reveal{opacity:0; transform:translateY(12px); transition:.6s ease;}
.reveal.on{opacity:1; transform:none}

/* ======================= Responsive ======================= */
@media (max-width:640px){ .equip-grid{grid-template-columns:1fr 1fr} }
@media (max-width:460px){ .equip-grid{grid-template-columns:1fr} }

/* =================== YAPI / İNŞAAT — DARK THEME =================== */
.yapi-page{
  --bg:#0b0b10;
  --text:#eef1f7;
  --muted:#aeb4c0;
  --stroke:#27283d;
  --r:18px;
  --shadow:0 12px 30px rgba(0,0,0,.45);
  --b1:#f1ff10;
  --b2:#ff991a;
  --grad:linear-gradient(90deg,var(--b1),var(--b2));
  color:var(--text);
  background:
    radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%),
    var(--bg);
  font-family:"Inter",system-ui,Segoe UI,Roboto,Arial,sans-serif;
}

/* Arka planı kesin siyah tut (bootstrap vb. beyazları nötrle) */
html:has(body.yapi-page){ background:#0b0b10!important; }
body.yapi-page{
  background:
    radial-gradient(1200px 600px at 10% -10%, #1a1a26 0%, transparent 60%),
    #0b0b10 !important;
}
.yapi-page .bg-light,
.yapi-page .bg-white,
.yapi-page section,
.yapi-page .container{ background:transparent!important; }

.yapi-shell{ width:min(1200px,92%); margin:0 auto; }

/* ------------------------------ HERO ------------------------------ */
.yapi-hero{
  position:relative; min-height:72vh;
  display:grid; place-items:center; overflow:hidden; isolation:isolate;
}
.yapi-hero__video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; filter:contrast(1.02) saturate(106%) brightness(.9);
}
.yapi-hero__overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg,#0b0b10aa 0%,#0b0b10ee 70%,#0b0b10ff 100%);
}
.yapi-hero__glow{
  position:absolute; inset:-40%;
  background:radial-gradient(600px 260px at var(--mx,70%) var(--my,20%), #ffffff18, transparent 40%);
  mix-blend-mode:screen; pointer-events:none;
}
.yapi-hero__inner{ position:relative; z-index:2; text-align:center; padding:4.5rem 1rem; }
.yapi-hero .kicker{
  display:inline-block; padding:.5rem .9rem; border-radius:999px;
  background:var(--grad); color:#0b0b10; font-weight:900; letter-spacing:.1em;
  text-transform:uppercase; font-size:.85rem; box-shadow:var(--shadow);
}
.yapi-hero .title{
  margin:1rem 0 .35rem; font-weight:900; line-height:1.05;
  font-size:clamp(2.6rem,4vw + 1rem,4.6rem);
  background:linear-gradient(90deg,#fff,#cde6ff 40%,#fff);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.yapi-hero .lede{ max-width:820px; margin:.2rem auto 1rem; color:#cfd6e3; font-size:1.05rem; }

.chip-row{ display:flex; gap:.5rem; flex-wrap:wrap; justify-content:center; margin:.2rem 0 1.1rem; }
.chip{
  padding:.4rem .7rem; border-radius:999px; background:#0f0f17;
  border:1px solid #26263c; color:#eaf2ff; font-weight:800; font-size:.85rem;
}
.btn-grad{
  display:inline-flex; align-items:center; gap:.55rem; padding:.65rem 1.1rem;
  border-radius:999px; background:var(--grad); color:#0b0b10; font-weight:900; text-decoration:none;
  transition:transform .15s ease;
}
.btn-grad:hover{ transform:translateY(-1px); }
.yapi-hero__cut{
  position:absolute; left:0; right:0; bottom:-1px; height:120px;
  background:linear-gradient(180deg, #0b0b10 20%, #0b0b10 100%);
  clip-path:polygon(0 0,100% 40%,100% 100%,0 100%);
}

/* --------------------------- BREADCRUMB --------------------------- */
.yapi-bc{ margin-top:-36px; margin-bottom:.8rem; }
.yapi-bc__bar{
  display:flex; gap:.6rem; align-items:center; justify-content:center; color:var(--muted);
  background:linear-gradient(180deg,#ffffff14,#ffffff08); border:1px solid #ffffff22; border-radius:999px;
  backdrop-filter: blur(8px) saturate(130%); box-shadow:var(--shadow); padding:.7rem 1rem;
}
.yapi-bc__bar a{ color:#e6e9ef; text-decoration:none; }
.yapi-bc__bar .sep{ opacity:.5; }
.yapi-bc__bar .current{ color:#cfd6e3; }

/* ----------------------------- ABOUT ----------------------------- */
.yapi-about{ padding:1.6rem 0 1rem; }
.about-grid{ display:grid; gap:1rem; grid-template-columns:1.25fr .75fr; }
.h-xl{ font-size:1.6rem; font-weight:900; margin:0 0 .6rem; }
.about-left p{ color:#d7deec; line-height:1.7; }
.badges{ display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.8rem; }
.pill{
  display:inline-flex; align-items:center; gap:.45rem; padding:.45rem .7rem;
  border-radius:999px; font-weight:900; background:#0f0f17; border:1px solid #26263c;
}
.pill.grad{ background:var(--grad); color:#0b0b10; border:0; }
.about-right{ display:grid; gap:.8rem; align-content:flex-start; }
.stat-card{
  border-radius:16px; border:1px solid var(--stroke);
  background:linear-gradient(180deg,#171725,#12121b);
  box-shadow:var(--shadow); padding:1rem; text-align:center;
}
.stat-card .num{ font-weight:900; font-size:1.8rem; color:#fff; }
.stat-card .lbl{ color:#aeb4c0; }

/* ------------------------- EXPERTISE CARDS ------------------------ */
.yapi-expertise{ padding:1.2rem 0 2.2rem; }
.h-lg{ font-size:1.25rem; font-weight:900; margin:0 0 .9rem; color:#fff; }
.card-grid{ display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.card{
  position:relative; border-radius:16px; border:1px solid var(--stroke);
  background:linear-gradient(180deg,#171725,#12121b); box-shadow:var(--shadow);
  padding:1rem; overflow:hidden;
}
.card::after{
  content:""; position:absolute; inset:-1px; border-radius:18px; padding:1px;
  background:conic-gradient(from var(--angle,0deg), transparent 0 35%, var(--grad) 45% 60%, transparent 70% 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; opacity:.35; pointer-events:none; animation:spin 12s linear infinite;
}
@keyframes spin{ to{ --angle:360deg; } }
.card__head{ display:flex; align-items:center; gap:.6rem; margin-bottom:.4rem; }
.card__head h4{ margin:0; font-weight:900; color:#fff; font-size:1.03rem; }
.ic{ width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:var(--grad); color:#0b0b10; }
.list{ list-style:none; margin:.35rem 0 0; padding-left:0; }
.list li{
  position:relative; padding-left:1.2rem; color:#cfd6e3; margin:.35rem 0;
}
.list li::before{
  content:""; position:absolute; left:0; top:.55rem; width:.55rem; height:.55rem;
  border-radius:50%; background:var(--grad); box-shadow:0 0 10px rgba(255,153,26,.35);
}
.tilt{ transform-style:preserve-3d; transition:transform .25s ease; }

/* ------------------------- STEPS / TIMELINE ----------------------- */
.yapi-steps{ padding:.6rem 0 2.2rem; }
.stepper{ list-style:none; padding-left:0; margin:.2rem 0 0; border-left:2px dashed #23233a; }
.stepper li{
  display:grid; grid-template-columns:22px 1fr; gap:.7rem; padding:.5rem 0 .5rem 0;
}
.stepper .dot{
  width:12px; height:12px; border-radius:999px; margin-left:-7px;
  background:var(--grad); box-shadow:0 0 12px rgba(255,153,26,.35);
}
.stepper b{ color:#fff; }

/* ----------------------- CASES / MOSAIC GRID ---------------------- */
.yapi-cases{ padding:.6rem 0 2.2rem; }
.mosaic{ display:grid; gap:.8rem; grid-template-columns:repeat(6,1fr); }

/* Kutu boyu GARANTİ: aspect-ratio + min-height */
.tile{
  position:relative; display:block; border-radius:14px; overflow:hidden;
  border:1px solid #23233a; background:#0f0f17;
  aspect-ratio:4/3;           /* default oran */
  min-height:180px;           /* görsel yoksa bile düşmesin */
  box-shadow:0 10px 24px rgba(0,0,0,.35);
}
.tile.wide{ grid-column:span 3; aspect-ratio:16/9; }
.tile.tall{ grid-row:span 2; aspect-ratio:3/4; }

/* Görsel kapsayıcıyı tamamen doldursun */
.tile img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; transform:scale(1.02); transition:transform .6s ease;
}
.tile:hover img{ transform:scale(1.07); }

/* Resim yüklenmezse gradient fallback için .noimg ekleyebilirsin (JS ile) */
.tile.noimg{ background:linear-gradient(135deg,#171725,#101018); }

/* Etiket */
.tile__tag{
  position:absolute; left:.6rem; bottom:.6rem; padding:.35rem .6rem;
  border-radius:999px; background:var(--grad); color:#0b0b10; font-weight:900; font-size:.85rem;
}

/* ---------------------------- WHY + CTA --------------------------- */
.yapi-why{ padding:.2rem 0 3rem; }
.why-grid{ display:grid; gap:1rem; grid-template-columns:1fr 1fr; }
.why-card,.cta-card{
  border-radius:16px; border:1px solid var(--stroke);
  background:linear-gradient(180deg,#171725,#12121b);
  box-shadow:var(--shadow); padding:1rem;
}
.cta-card h4{ margin:0 0 .35rem; font-weight:900; color:#fff; }

/* ----------------------------- REVEAL ----------------------------- */
.reveal{ opacity:0; transform:translateY(12px); transition:.6s ease; }
.reveal.on{ opacity:1; transform:none; }

/* --------------------------- RESPONSIVE --------------------------- */
@media (max-width:980px){
  .about-grid{ grid-template-columns:1fr; }
  .mosaic{ grid-template-columns:repeat(3,1fr); }
  .tile.wide{ grid-column:span 3; }
}
@media (max-width:560px){
  .mosaic{ grid-template-columns:1fr 1fr; }
  .tile.wide{ grid-column:span 2; }
  .why-grid{ grid-template-columns:1fr; }
}

/* Hareket hassasiyeti olan kullanıcılar için animasyonları azalt */
@media (prefers-reduced-motion: reduce){
  .reveal, .tile img, .card::after, .btn-grad, .tilt { transition:none !important; animation:none !important; }
}

 /* ====== PLT-18 Modern Styles ====== */

/* Header hero */
.page-header {
  position: relative;
  min-height: 52vh;
  display: grid;
  place-items: center;
  color: #fff;
  overflow: hidden;
}
.page-header::before{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(1200px 600px at 20% 10%, rgba(69,240,255,.35), transparent 40%),
              linear-gradient(to bottom, rgba(0,0,0,.45), rgba(0,0,0,.55));
  pointer-events:none;
}
.page-header .ph-title{
  backdrop-filter: blur(6px) saturate(120%);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 16px;
  padding: 18px 24px;
  box-shadow: 0 10px 40px rgba(0,0,0,.35);
}

/* Breadcrumb */
.breadcrumb-section{ background:#f6f7fb; }
.breadcrumb a{ opacity:.85; }
.breadcrumb a:hover{ opacity:1; transform: translateY(-1px); }

/* Product intro */
.product-intro{
  --card-bg: rgba(15,20,30,.4);
  display:grid; gap:28px;
  grid-template-columns: 1.1fr 2fr;
  align-items:center;
}
@media (max-width: 992px){ .product-intro{ grid-template-columns: 1fr; } }

.product-intro .icon-card{
  border-radius: 20px;
  padding: 26px;
  background: linear-gradient(135deg, rgba(226,90,255,.15), rgba(69,240,255,.12));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 10px 40px rgba(0,0,0,.25) inset, 0 8px 24px rgba(0,0,0,.15);
  text-align:center;
}
.product-intro .icon-card img{ width:min(260px,70%); height:auto; display:block; margin:0 auto 10px; }
.product-intro .icon-card h3{ margin:10px 0 0; color:#660000; }

.product-intro .content h2{
  font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem);
  letter-spacing:.4px; margin:0 0 8px;
}
.product-intro .content p{ color:#1e2430; line-height:1.7; margin:.4rem 0; }
.product-intro .chips{ display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 0; }
.product-intro .chip{
  padding:6px 10px; border-radius:999px; font-weight:600; font-size:.9rem;
  background:#0b1017; color:#cfe3ff; border:1px solid rgba(255,255,255,.1);
}
.product-intro .cta-row{ margin-top:14px; display:flex; gap:10px; flex-wrap:wrap; }
.product-intro .btn-primary{
  padding:10px 16px; border-radius:10px; font-weight:700; text-decoration:none;
  background:#660000; color:#fff; display:inline-block;
}
.product-intro .btn-primary:hover{ filter:brightness(1.05); transform: translateY(-1px); }

/* Gallery pro (Swiper main + thumbs) */
.gallery-pro{ display:grid; gap:14px; }
.gallery-main{
  background: var(--bg-2, #0f1420); border-radius: 20px; padding: 10px;
  box-shadow: 0 10px 40px rgba(0,0,0,.35);
}
.gallery-main .swiper-wrapper{ align-items: stretch; }
.gallery-main .swiper-slide a{ display:block; width:100%; aspect-ratio:16/9; border-radius:16px; overflow:hidden; background:#0b1017; }
.gallery-main img{ width:100% !important; height:100% !important; object-fit:cover; display:block; }

.gallery-thumbs{ padding: 6px 2px; }
.gallery-thumbs .swiper-slide{
  width:auto; max-width:260px; aspect-ratio:16/9;
  border-radius:14px; overflow:hidden; background:#0b1017;
  opacity:.7; transition:opacity .2s, transform .2s, box-shadow .2s;
}
.gallery-thumbs .swiper-slide-thumb-active{
  opacity:1; transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.gallery-thumbs img{ width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width: 640px){
  .gallery-main .swiper-slide a{ aspect-ratio:4/3; }
}

/* Advantages tabs */
.advantages-tabs{ margin-top:56px; }
.advantages-tabs .tab-buttons{
  display:flex; gap:10px; flex-wrap:wrap;
}
.advantages-tabs .tab-btn{
  padding:10px 14px; border-radius:10px; border:1px solid #d8dfef;
  background:#fff; font-weight:700; cursor:pointer;
}
.advantages-tabs .tab-btn.active{ background:#0f1420; color:#fff; border-color:#0f1420; }
.tab-divider{ margin:12px 0 16px; border-color:#edf1f8; }
.tab-content{ display:none; }
.tab-content.active{ display:block; animation: fadeIn .3s ease; }
@keyframes fadeIn{ from{opacity:.6; transform:translateY(4px);} to{opacity:1; transform:none;} }

/* PDF grid */
.pdf-grid{ display:grid; gap:14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pdf-card{
  display:flex; gap:12px; align-items:center; padding:12px 14px; border-radius:12px;
  background:#fff; background-color: #0e0e13 !important; border:1px solid #e3e9f5;
}
.pdf-card:hover{ box-shadow:0 12px 24px rgba(0,0,0,.08); transform: translateY(-1px); }
.pdf-card .pdf-icon{ width:28px; height:28px; }

/* Tokens */
#contact-dark{
  --bg:#0b0c10; --panel:#0f1116; --ink:#e9eef6; --muted:#c9cfda; --stroke:rgba(255,255,255,.10);
  --shadow:0 12px 30px rgba(0,0,0,.35); --glow:0 0 0 3px rgba(253,236,29,.18);
  --g1:#fdec1d; --g2:#dbb709; --rad:18px;
  --s1:8px; --s2:12px; --s3:16px; --s4:22px; --s5:32px; --s6:48px;
  font-family:"Sora","Poppins",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans";
  color:var(--ink); background:var(--bg); isolation:isolate;
}
#contact-dark *{box-sizing:border-box}

/* Shared layout */
#contact-dark .hr-wrap{width:min(1140px,92%);margin-inline:auto;display:grid;gap:var(--s5);grid-template-columns:420px 1fr;align-items:start;padding:var(--s6) 0}
#contact-dark .breadcrumb-glass{position:sticky;top:0;z-index:2;backdrop-filter:blur(8px);background:rgba(15,17,22,.5);border-bottom:1px solid var(--stroke)}
#contact-dark .breadcrumb-bar{width:min(1140px,92%);margin-inline:auto;display:flex;gap:.6rem;padding:10px 0;align-items:center;color:var(--ink)}
#contact-dark .breadcrumb-bar a{color:var(--ink);text-decoration:none;opacity:.9}
#contact-dark .breadcrumb-sep{opacity:.5}

/* HERO same DNA as IK */
#contact-dark .hr-hero{
  min-height:46vh; display:grid; place-items:center; position:relative; overflow:hidden;
  background: radial-gradient(1200px 520px at 80% -10%, rgba(253,236,29,.14), transparent 60%),
              radial-gradient(900px 400px at 10% -20%, rgba(219,183,9,.10), transparent 55%),
              linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.55)),
              var(--hero, url('image/iletisim.png')) center/cover no-repeat;
}
#contact-dark .hero-inner{text-align:center;padding:32px 12px}
#contact-dark .hero-kicker{display:inline-block;opacity:.85;margin-bottom:10px}
#contact-dark .hero-title{margin:0;font-size:clamp(34px,6vw,56px);font-weight:800;letter-spacing:-.02em}
#contact-dark .hero-underline{width:88px;height:6px;margin:14px auto 0;border-radius:999px;background:linear-gradient(90deg,var(--g1),var(--g2))}

/* Cards (glass) */
#contact-dark .info-card,
#contact-dark .c-form,
#contact-dark .c-map-card{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid var(--stroke); border-radius:var(--rad); box-shadow:var(--shadow)
}

/* Left info */
#contact-dark .info-card{padding:18px}
#contact-dark .info-title{font-size:20px;font-weight:800;margin-bottom:8px}
#contact-dark .hint{color:var(--muted);margin:.2rem 0 .8rem}
#contact-dark .c-badges{display:flex;gap:.5rem;flex-wrap:wrap;margin:.6rem 0}
#contact-dark .badge{
  display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .7rem;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid var(--stroke)
}
#contact-dark .c-list{margin:10px 0 0;padding-left:1rem;display:grid;gap:.4rem}
#contact-dark .c-list li{color:var(--ink)}

/* Form */
#contact-dark .c-form{padding:20px}
#contact-dark .c-form h2{margin:0 0 10px;font-size:22px}
#contact-dark .progress{height:6px;background:rgba(255,255,255,.06);border:1px solid var(--stroke);border-radius:999px;margin:10px 0 6px;overflow:hidden}
#contact-dark .progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--g1),var(--g2))}
#contact-dark .progress-hint{display:flex;justify-content:space-between;color:var(--muted);font-size:.9rem;margin-bottom:8px}

#contact-dark .form-grid{display:grid;gap:var(--s3);grid-template-columns:1fr 1fr}
#contact-dark .field{display:grid;gap:6px}
#contact-dark label{font-weight:600}
#contact-dark .input,#contact-dark .textarea{
  background:#0f1116;border:1px solid var(--stroke);border-radius:12px;color:var(--ink);
  padding:12px 14px; outline:none; transition:border-color .12s ease, box-shadow .12s ease;
}
#contact-dark .input:focus,#contact-dark .textarea:focus{border-color:#e7d000; box-shadow:var(--glow)}
#contact-dark .textarea{resize:vertical}

#contact-dark .actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:2px}
#contact-dark .btn, #contact-dark .btn-submit{
  display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border-radius:12px;
  font-weight:800;cursor:pointer;text-decoration:none;border:1px solid var(--stroke);color:var(--ink);
  background:rgba(255,255,255,.06);transition:.15s ease
}
#contact-dark .btn:hover, #contact-dark .btn-submit:hover{transform:translateY(-1px)}
#contact-dark .btn.wa{background:#25D366;color:#0b0c10;border:none}
#contact-dark .btn.ghost{background:rgba(255,255,255,.06)}
#contact-dark .btn-submit{background:linear-gradient(90deg,var(--g1),var(--g2));border:none;color:#0b0c10}

/* Map */
#contact-dark .c-map-wrap{width:min(1140px,92%);margin:0 auto var(--s6)}
#contact-dark .c-map-card{padding:12px}
#contact-dark .map-ratio{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:12px}
#contact-dark .map-ratio iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Responsive */
@media (max-width:991.98px){
  #contact-dark .hr-wrap{grid-template-columns:1fr}
  #contact-dark .form-grid{grid-template-columns:1fr}
}