/* ================================
   FDS POLİMER — Tema (Logo uyumlu, açık tonlar)
   ================================ */
:root{
  /* Arka planlar (birkaç ton açıldı) */
  --bg:#141820;
  --bg-soft:#1b2029;
  --card:#222c3a;         /* #222834'e yakın ama logoyla daha uyumlu mavi-gri */

  /* Metinler */
  --text:#e8edf6;
  --muted:#b7c4d8;

  /* Logo uyumlu vurgu renkleri (mavi → camgöbeği geçiş) */
  --accent:#1e74d6;       /* ana mavi (logo ile uyumlu) */
  --accent-2:#23b3ff;     /* açık/camgöbeği mavi (gradient ikinci renk) */

  /* RGBA için RGB karşılıkları (çerçeve/arka plan şeffaflıklarında kullanılıyor) */
  --accent-rgb:30,116,214;   /* #1e74d6 */
  --accent2-rgb:35,179,255;  /* #23b3ff */

  /* Ek renkler */
  --success:#49d57b;

  --radius:16px;
  --radius-sm:12px;
  --maxw:1440px;
  --shadow:0 10px 30px rgba(0,0,0,.25);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background:var(--bg); color:var(--text); line-height:1.6;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
a{color:var(--accent); text-decoration:none}
a:hover{opacity:.9}
img{max-width:100%; display:block}
.container{width:100%; max-width:var(--maxw); margin:0 auto; padding:0 20px}

/* ================================
   HEADER / NAV
   ================================ */
.fds-header{position:sticky; top:0; z-index:50; background:rgba(11,14,19,.7); backdrop-filter:saturate(140%) blur(10px); border-bottom:1px solid rgba(255,255,255,.05)}
.fds-nav{display:flex; align-items:center; justify-content:space-between; padding:14px 0}
.fds-brand{display:flex; align-items:center; gap:10px}
.site-logo{width:250px; height:100px; border-radius:10px; object-fit:contain}
.brand-text{font-size:18px; letter-spacing:.2px}
.fds-menu{display:flex; align-items:center; gap:16px}
.fds-menu a{color:var(--text); opacity:.9; font-size:14px; display:inline-flex; align-items:center; gap:6px}
.fds-cta{padding:10px 14px; background:linear-gradient(135deg, var(--accent), var(--accent-2)); border-radius:12px; color:#001018; font-weight:600}
.fds-burger{display:none; width:44px; height:44px; border:1px solid rgba(255,255,255,.1); border-radius:12px; align-items:center; justify-content:center; color:var(--text); background:transparent}
@media (max-width:980px){
  .fds-menu{display:none}
  .fds-burger{display:flex}
  .fds-menu.open{
    display:flex; position:absolute; top:66px; left:0; right:0;
    background:var(--bg-soft); border-bottom:1px solid rgba(255,255,255,.06);
    padding:12px 20px; gap:14px; flex-direction:column;
  }
}

/* ================================
   HERO
   ================================ */
.fds-hero{position:relative; overflow:hidden; background:radial-gradient(80% 100% at 0% 0%, #13202e 0%, #0b0e13 60%)}
.fds-hero-inner{display:grid; gap:28px; grid-template-columns:1.2fr 1fr; align-items:center; min-height:72vh; padding:56px 0}
.fds-hero h2{font-size:42px; line-height:1.15; margin:0 0 10px}
.fds-hero .lead{font-size:18px; color:var(--muted); margin:0 0 16px}
.fds-hero-cta{display:flex; gap:12px; flex-wrap:wrap}
.btn{display:inline-flex; align-items:center; gap:8px; padding:12px 16px; border-radius:14px; border:1px solid rgba(255,255,255,.12); color:var(--text)}
.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-2)); color:#031821; border:0; font-weight:700}
.btn-soft{background:rgba(255,255,255,.04)}
.fds-hero-badges{display:flex; gap:14px; flex-wrap:wrap; margin-top:12px}
.badge{font-size:12px; padding:8px 12px; border:1px solid rgba(255,255,255,.12); border-radius:999px; color:var(--muted); background:rgba(255,255,255,.03)}

/* logo mavisine göre transparan vurgular */
.fds-hero-card{
  background:linear-gradient(180deg, rgba(var(--accent-rgb), .12), rgba(255,255,255,.02));
  border:1px solid rgba(var(--accent-rgb), .28);
  border-radius:20px; padding:18px; box-shadow:var(--shadow)
}
.fds-hero-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:12px}
.stat{background:var(--card); border:1px solid rgba(255,255,255,.06); border-radius:16px; padding:14px}
.stat .kpi{font-size:18px; font-weight:800}
.stat .kpl{font-size:12px; color:var(--muted)}
.kicker{font-size:12px; color:var(--muted)}
@media (max-width:980px){
  .fds-hero-inner{grid-template-columns:1fr}
  .fds-hero h2{font-size:32px}
}

/* ================================
   GENEL BÖLÜM
   ================================ */
section.fds-section{padding:64px 0; border-top:1px solid rgba(255,255,255,.06)}
.section-head{margin:0 0 26px}
.eyebrow{color:var(--accent-2); font-size:12px; letter-spacing:.35em; text-transform:uppercase}
.section-title{font-size:28px; margin:8px 0 8px}
.section-intro{color:var(--muted); max-width:900px}

/* ================================
   ÜRÜNLER
   ================================ */
.product-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:24px}
.product-card{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:18px; display:flex; flex-direction:column; gap:14px}
.product-card h3{margin:0; font-size:18px}
.product-card p{margin:0; color:var(--muted)}
.product-list{margin:4px 0 0; padding:0; list-style:none; display:grid; gap:8px}
.product-list a{display:inline-flex; align-items:center; gap:8px}
.product-list a::before{content:"›"; opacity:.6}
.product-thumb{height:220px; border-radius:14px; overflow:hidden; border:1px solid rgba(255,255,255,.06)}
.product-thumb img{width:100%; height:100%; object-fit:cover}
.product-cta{margin-top:auto; display:flex; gap:10px}
@media (max-width:1100px){.product-grid{grid-template-columns:1fr 1fr}}
@media (max-width:680px){.product-grid{grid-template-columns:1fr}}

/* ================================
   ENDÜSTRİLER
   ================================ */
.industry-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin-top:20px}
.industry{background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.06); border-radius:16px; padding:14px}
.industry h4{margin:0 0 6px; font-size:14px}
.industry p{margin:0; color:var(--muted); font-size:13px}
@media (max-width:1200px){.industry-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:700px){.industry-grid{grid-template-columns:repeat(2,1fr)}}

/* ================================
   KALİTE & SERTİFİKASYON
   ================================ */
.quality{display:grid; grid-template-columns:1.2fr 1fr; gap:18px; margin-top:20px}
.quality .card{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:18px}
.steps{display:grid; gap:10px}
.step{display:flex; gap:12px; align-items:flex-start}
.step .no{
  width:28px; height:28px; 
  background:rgba(var(--accent-rgb), .14);
  color:var(--accent);
  border:1px solid rgba(var(--accent-rgb), .35);
  border-radius:8px; display:flex; align-items:center; justify-content:center; font-weight:800
}
.certs, .certs .chip, .footer-badges .chip{display:inline-flex; align-items:center; gap:8px}
.certs{flex-wrap:wrap; gap:10px; margin-top:10px}
.chip{border:1px solid rgba(255,255,255,.14); color:var(--muted); border-radius:999px; padding:8px 12px; background:rgba(255,255,255,.03)}
@media (max-width:980px){.quality{grid-template-columns:1fr}}

/* ================================
   ÜRETİM & TEKNOLOJİ
   ================================ */
.capacity{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:12px}
.capacity .card{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:18px}
.capacity ul{margin:0; padding-left:18px}
@media (max-width:980px){.capacity{grid-template-columns:1fr}}

/* ================================
   AR-GE
   ================================ */
.rnd{display:grid; grid-template-columns:1.1fr 1fr; gap:18px; margin-top:16px}
.rnd .card{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:18px}
@media (max-width:980px){.rnd{grid-template-columns:1fr}}

/* ================================
   SÜRDÜRÜLEBİLİRLİK
   ================================ */
.sustain{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:18px}
.sustain .card{
  background:linear-gradient(180deg, rgba(var(--accent2-rgb), .10), rgba(255,255,255,.02));
  border:1px solid rgba(var(--accent2-rgb), .28);
  border-radius:18px; padding:18px
}
@media (max-width:980px){.sustain{grid-template-columns:1fr}}

/* ================================
   DOCS CTA
   ================================ */
.docs-cta{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  background:linear-gradient(180deg, rgba(var(--accent-rgb), .10), rgba(255,255,255,.02));
  border:1px solid rgba(var(--accent-rgb), .28);
  border-radius:18px; padding:18px; margin-top:20px
}
.docs-cta p{margin:0; color:var(--muted)}
@media (max-width:780px){.docs-cta{flex-direction:column; align-items:flex-start}}

/* ================================
   BLOG
   ================================ */
.blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 20px;
}

.post {
  border-radius: 18px;
  overflow: hidden;
  background: transparent; /* kartı şeffaf yapıyoruz */
  display: flex;
  flex-direction: column;
}

.post .thumb {
  height: 300px;
  overflow: hidden;
  border-radius: 18px 18px 0 0;
}

.post .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.post .content {
  background: var(--card); /* yazılar okunabilir bir zeminde */
  border: 1px solid rgba(255,255,255,.08);
  border-top: none;
  border-radius: 0 0 18px 18px;
  padding: 16px;
}

.post h4 {
  margin: 0 0 6px;
}

.post h4 a {
  color: #fff;
  text-decoration: none;
  transition: color 0.3s;
}

.post h4 a:hover {
  color: var(--accent, #4da3ff);
}

.post p {
  margin: 0;
  color: var(--muted);
  font-size: 0.95rem;
}

@media (max-width: 1100px) {
  .blog-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 680px) {
  .blog-grid {
    grid-template-columns: 1fr;
  }
}

/* ================================
   SSS
   ================================ */
.faq{max-width:1000px; margin-top:18px}
.faq-item{border:1px solid rgba(255,255,255,.08); background:var(--card); border-radius:16px; margin-bottom:12px; overflow:hidden}
.faq-q{display:flex; justify-content:space-between; align-items:center; padding:14px 16px; cursor:pointer}
.faq-q h5{margin:0; font-size:16px}
.faq-a{display:none; padding:0 16px 16px; color:var(--muted)}

/* ================================
   İLETİŞİM
   ================================ */
.contact-wrap{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.contact-card{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:18px}
.contact-list{display:grid; gap:12px}
.contact-item{display:flex; gap:12px}
.ico{width:36px; height:36px; border-radius:10px; background:rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; font-weight:800; color:var(--accent)}
.contact-card form{display:grid; gap:10px}
.field{display:grid; gap:6px}
.field input,.field textarea{width:100%; background:#0f131a; border:1px solid rgba(255,255,255,.10); color:var(--text); border-radius:12px; padding:12px}
.field textarea{min-height:120px; resize:vertical}
.map{height:300px; border-radius:16px; overflow:hidden; border:1px solid rgba(255,255,255,.08)}
iframe{width:100%; height:100%; border:0}
@media (max-width:980px){.contact-wrap{grid-template-columns:1fr}}

/* ================================
   FOOTER
   ================================ */
.fds-footer{margin-top:40px; border-top:1px solid rgba(255,255,255,.06); background:var(--bg-soft)}
.footer-top{padding:26px 0; display:grid; grid-template-columns:2fr 1fr 1fr; gap:20px}
.footer-top h6{margin:0 0 10px; font-size:14px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.footer-top a{display:block; color:var(--text); opacity:.85; margin:6px 0}
.footer-bottom{padding:14px 0; border-top:1px solid rgba(255,255,255,.06); display:flex; justify-content:space-between; gap:10px; font-size:13px; color:var(--muted)}
.footer-badges{display:flex; flex-wrap:wrap; gap:8px; margin-top:8px}
@media (max-width:900px){.footer-top{grid-template-columns:1fr}}

/* ================================
   FOOTER — Mobil Uyum
   ================================ */

/* Tablet */
@media (max-width: 900px){
  .footer-top{
    grid-template-columns: 1fr 1fr;  /* 3 sütundan 2 sütuna */
    gap: 16px;
    padding: 22px 0;
  }
  .footer-top h6{ font-size: 13px; letter-spacing: .12em }
  .footer-top a{ margin: 5px 0; font-size: 14px }

  .footer-bottom{
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    font-size: 12.5px;
  }
}

/* Telefon (geniş) */
@media (max-width: 680px){
  .fds-footer{ margin-top: 32px }
  .footer-top{
    grid-template-columns: 1fr;      /* tek sütun */
    text-align: left;                 /* istersen center yapabilirsin */
    gap: 14px;
    padding: 18px 0;
  }
  .footer-top > div{
    background: var(--bg);           /* kart hissi için hafif zemin */
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 12px;
    padding: 12px;
  }
  .footer-top h6{ margin-bottom: 8px }
  .footer-top a{ padding: 6px 0 }     /* dokunmatik için daha büyük hedef */
  .footer-badges{ gap: 6px }

  .footer-bottom{
    align-items: flex-start;
    gap: 6px;
    padding: 12px 0;
  }
}

/* Küçük telefon */
@media (max-width: 480px){
  .footer-top{
    padding: 16px 0;
  }
  .footer-top > div{ padding: 10px }
  .footer-top h6{ font-size: 12px; letter-spacing: .1em }
  .footer-top a{ font-size: 13.5px }
  .footer-bottom{ font-size: 12px }
}

/* İnteraktif durumlar (dokunmatik rahatlığı) */
.footer-top a:hover{ opacity: 1 }
.footer-top a:active{ transform: translateY(1px) }

/* Karanlık zeminde ayrımın biraz daha okunur olması için ince ayar */
.fds-footer{
  background: linear-gradient(180deg, var(--bg-soft), rgba(0,0,0,.2));
}

/* ================================
   Animasyonlar
   ================================ */
.in{transform:translateY(0)!important; opacity:1!important}
.anim-target{transform:translateY(12px); opacity:.001; transition:all .5s ease}

/* ================================
   HAKKIMIZDA SAYFASI
   ================================ */

/* Breadcrumb */
.breadcrumbs{
  display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted);
  padding:18px 0 0;
}
.breadcrumbs a{ color:var(--text); opacity:.85; display:inline-flex; gap:6px; align-items:center }
.breadcrumbs span{ opacity:.5 }

/* About Hero */
.about-grid{
  display:grid; grid-template-columns:1.1fr 1fr; gap:24px; align-items:start;
}
.about-copy .about-bullets{
  margin:16px 0 0; padding:0; list-style:none; display:grid; gap:10px;
}
.about-bullets li{ display:flex; gap:10px; align-items:flex-start; color:var(--muted) }
.about-bullets i{ color:var(--accent) }
.about-ctas{ margin-top:14px; display:flex; gap:10px; flex-wrap:wrap }

.about-media .about-figure{
  background:linear-gradient(180deg, rgba(var(--accent-rgb), .12), rgba(255,255,255,.02));
  border:1px solid rgba(var(--accent-rgb), .28);
  border-radius:18px; overflow:hidden; margin:0;
}
.about-figure img{ width:100%; width:100%; object-fit:cover }
.about-figure figcaption{ padding:10px 12px; font-size:13px; color:var(--muted) }

.about-kpis{
  display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:10px;
}
.about-kpis .kpi{ background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:12px }
.kpi-value{ font-size:18px; font-weight:800 }
.kpi-label{ font-size:12px; color:var(--muted) }
.kicker{ font-size:12px; color:var(--muted); margin-top:6px }

@media (max-width:980px){
  .about-grid{ grid-template-columns:1fr }
  .about-figure img{ height:240px }
}

/* Vision & Mission */
.vm-section .vm-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:18px;
}
.vm-card{
  background:var(--card); border:1px solid rgba(255,255,255,.08);
  border-radius:18px; padding:18px;
}
.vm-card h3{ display:flex; gap:8px; align-items:center; margin:0 0 8px }
.vm-card i{ color:var(--accent) }
@media (max-width:900px){
  .vm-section .vm-grid{ grid-template-columns:1fr }
}

/* Features (alternating rows) */
.features .feature-row{
  display:grid; grid-template-columns:1fr 1.1fr; gap:22px; align-items:center; margin-bottom:22px;
}
.feature-row.reverse{ grid-template-columns:1.1fr 1fr }
.feature-row .feature-img img{
  width:480px; height:270px; object-fit:cover; border-radius:16px; border:1px solid rgba(255,255,255,.08);
}
.feature-copy{
  background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:18px;
}
.feature-copy h3{ display:flex; align-items:center; gap:8px; margin:0 0 8px }
.feature-copy p{ color:var(--muted); margin:0 }
@media (max-width:980px){
  .features .feature-row,
  .features .feature-row.reverse{ grid-template-columns:1fr }
}

/* Certifications */
.certs-section .certs-wrap{
  display:grid; grid-template-columns:1.1fr 1fr; gap:18px; align-items:start;
}
.certs-copy p{ color:var(--muted) }
.cert-list{ list-style:none; margin:12px 0 0; padding:0; display:grid; gap:8px; color:var(--text) }
.cert-list li{ display:flex; gap:10px; align-items:flex-start }
.cert-list i{ color:var(--accent) }

.certs-cards{
  display:grid; grid-template-columns:repeat(2,1fr); gap:10px;
}
.certs-cards .card{
  background:linear-gradient(180deg, rgba(var(--accent2-rgb), .10), rgba(255,255,255,.02));
  border:1px solid rgba(var(--accent2-rgb), .28); color:var(--text);
  border-radius:14px; padding:12px; display:flex; gap:8px; align-items:center;
}
.certs-cards .card i{ color:var(--accent) }
@media (max-width:900px){
  .certs-section .certs-wrap{ grid-template-columns:1fr }
  .certs-cards{ grid-template-columns:1fr 1fr }
}
@media (max-width:560px){
  .certs-cards{ grid-template-columns:1fr }
}

/* ================================
   ÜRÜNLER SAYFASI (Hero + Filtre + Grid)
   ================================ */

/* Products hero */
.products-hero{ background: radial-gradient(80% 100% at 0% 0%, #172536 0%, var(--bg) 60%) }
.products-hero-inner{
  display:grid; grid-template-columns:1.1fr 1fr; gap:24px; align-items:center; padding:48px 0;
}
.products-hero .hero-copy .hero-badges{ display:flex; gap:10px; flex-wrap:wrap; margin-top:10px }
.products-hero .about-figure{ margin:0; border-radius:18px; overflow:hidden; border:1px solid rgba(var(--accent-rgb), .28) }
.products-hero .about-figure img{ height:300px; width:100%; object-fit:cover }
.products-hero .about-figure figcaption{ padding:10px 12px; font-size:13px; color:var(--muted) }
@media (max-width:980px){ .products-hero-inner{ grid-template-columns:1fr } }

/* Filter bar */
.products-filter .filter-bar{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.filter-bar .chips{ display:flex; gap:10px; flex-wrap:wrap }
.chip{
  display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:999px;
  border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.03); color:var(--text); font-size:13px;
}
.chip.active{ border-color: rgba(var(--accent-rgb), .35); background: rgba(var(--accent-rgb), .12); color: var(--text) }
.filter-bar .search{ display:flex; gap:8px }
.filter-bar .search input{
  background:var(--bg-soft); color:var(--text); border:1px solid rgba(255,255,255,.12); border-radius:12px; padding:10px 12px; width:260px;
}
@media (max-width:700px){ .filter-bar .search input{ width:100% } }

/* Product cards: küçük dokunuşlar */
.product-card h3{ display:flex; align-items:center; gap:8px }
.product-card .product-thumb{ height:200px } /* ürün sayfasında biraz daha dengeli */
.product-card .product-cta .btn{ white-space:nowrap }

/* bölüm arası sıkılaştırma */
#komodite .product-thumb,
#ozel .product-thumb { height:200px }

/* ================================
   ÜRÜN DETAY SAYFASI (HTML'e dokunmadan)
   ================================ */

.product-page{
  padding: 42px 0 64px;
  border-top: 1px solid rgba(255,255,255,.06);
  background:
    radial-gradient(70% 120% at 0% 0%, rgba(var(--accent-rgb), .08), transparent 55%),
    linear-gradient(180deg, transparent, rgba(255,255,255,.01));
}

/* Başlık */
.product-page h1{
  margin: 0 0 18px;
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.25;
}

/* Giriş bölümü (görsel + açıklama) */
.product-intro{
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 22px;
  align-items: start;
  margin-top: 14px;
}
.product-intro .product-img{
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(var(--accent-rgb), .28);
  background: linear-gradient(180deg, rgba(var(--accent-rgb), .12), rgba(255,255,255,.02));
}
.product-intro .product-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.product-intro .product-description{
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 18px;
  color: var(--text);
}
.product-intro .product-description p{
  margin: 0 0 10px;
  color: var(--muted);
}

/* Kart benzeri bölüm iskeleti */
.product-details,
.application,
.product-advantages,
.product-info{
  margin-top: 22px;
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 18px;
}

/* Bölüm başlıkları */
.product-details h2,
.application h2,
.product-advantages h2,
.product-info h2{
  margin: 0 0 12px;
  font-size: clamp(18px, 1.8vw, 22px);
  display:flex; align-items:center; gap:10px;
  position: relative;
}
.product-details h2::after,
.application h2::after,
.product-advantages h2::after,
.product-info h2::after{
  content:"";
  flex:1 1 auto;
  height:1px;
  background: linear-gradient(90deg, rgba(var(--accent-rgb), .35), rgba(255,255,255,.06));
  margin-left: 10px;
  border-radius: 2px;
}

/* Liste görünümü (ikonlu ok işareti) */
.product-details ul,
.application ul,
.product-advantages ul{
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.product-details li,
.application li,
.product-advantages li{
  position: relative;
  padding-left: 18px;
  color: var(--muted);
}
.product-details li::before,
.application li::before,
.product-advantages li::before{
  content: "›";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--accent);
  opacity: .9;
  line-height: 1.2;
}

/* Metin blokları */
.product-details p,
.application p,
.product-advantages p,
.product-info p{
  color: var(--muted);
  margin: 0 0 10px;
}

/* Görseller küçük ekranlar için */
@media (max-width: 1080px){
  .product-intro{
    grid-template-columns: 1fr;
  }
  .product-intro .product-img img{
    height: 100%;
  }
}

/* Tipografi ve boşluklar */
.product-page h1 + .product-intro{ margin-top: 18px; }
.product-page .container > *:last-child{ margin-bottom: 0; }

/* Vurgu satırları / infolar */
.product-info{
  background:
    linear-gradient(180deg, rgba(var(--accent2-rgb), .10), rgba(255,255,255,.02));
  border: 1px solid rgba(var(--accent2-rgb), .28);
}

/* Küçük rozet stili (istenirse metinde span.badge kullanılınca) */
.product-page .badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.03);
  color: var(--text);
  font-size: 12px;
}

/* Görsel alt yazı isterse .img-caption kullan (HTML’e dokunmadan) */
.product-page .img-caption{
  display:block; margin-top:8px; font-size:12px; color:var(--muted);
}

/* Linkler ve CTA uyumu */
.product-page a{
  color: var(--accent);
}
.product-page a:hover{
  opacity:.9;
}

/* Font Awesome (sayfada ekli) ile ikon hizası — FA kullanılmışsa */
.product-page .fas, .product-page .far, .product-page .fal, .product-page .fab{
  width: 1.1em; display: inline-block; text-align: center;
  color: var(--accent);
}

/* ================================
   404 SAYFASI
   ================================ */
.notfound-hero{
  background:
    radial-gradient(80% 120% at 0% 0%, rgba(var(--accent-rgb), .10), transparent 55%),
    linear-gradient(180deg, transparent, rgba(255,255,255,.01));
  padding-top: 34px;
}
.nf-grid{
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 24px;
  align-items: center;
}
.nf-title{
  margin: 6px 0 10px;
  font-size: clamp(22px, 2.4vw, 32px);
  line-height: 1.15;
}
.nf-title span{
  font-size: clamp(46px, 6vw, 72px);
  font-weight: 900;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.nf-search{
  margin-top: 14px;
  display: flex; gap: 8px; flex-wrap: wrap;
}
.nf-search input{
  flex: 1 1 260px;
  min-width: 220px;
  background: var(--bg-soft);
  color: var(--text);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  padding: 10px 12px;
}
.nf-quicklinks{
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.nf-quicklinks .card{
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px;
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  color: var(--text);
}
.nf-quicklinks .card i{ color: var(--accent) }
.nf-quicklinks .card:hover{ border-color: rgba(var(--accent-rgb), .35) }

.nf-visual{ display: grid; gap: 10px; align-content: start }
.nf-blob{
  position: relative;
  aspect-ratio: 1 / 1;
  width: min(420px, 100%);
  margin: 0 auto;
  filter: drop-shadow(0 10px 30px rgba(0,0,0,.25));
  animation: float 6s ease-in-out infinite;
}
.nf-blob svg{ width:100%; height:100%; display:block; opacity:.9 }
.nf-icon{
  position: absolute;
  right: 14%;
  top: 18%;
  font-size: clamp(24px, 3.6vw, 42px);
  color: #0b1621;
  text-shadow: 0 2px 16px rgba(0,0,0,.25);
}
.nf-caption{ text-align:center; color: var(--muted) }

@keyframes float{
  0%,100%{ transform: translateY(0) rotate(0.2deg) }
  50%{ transform: translateY(-8px) rotate(-0.4deg) }
}

/* Erişilebilirlik */
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }

/* Responsive */
@media (max-width: 980px){
  .nf-grid{ grid-template-columns: 1fr }
  .nf-quicklinks{ grid-template-columns: repeat(2, 1fr) }
}
@media (max-width: 560px){
  .nf-quicklinks{ grid-template-columns: 1fr }
}

/* BLOG DETAY */
.blog-detail{ display:grid; gap:16px }
.blog-detail h2{ margin:10px 0 6px }
.blog-detail ul{ margin:8px 0 0; padding:0; list-style:none; display:grid; gap:6px }
.blog-detail li{ padding-left:16px; position:relative; color:var(--muted) }
.blog-detail li::before{ content:"›"; position:absolute; left:0; color:var(--accent) }
.blog-detail blockquote.chip{ margin-top:8px }

/* ==========================================
   FIXY DIGITAL • Credit Component (v1.0)
   ========================================== */
.fx-credit{
  --fxc-bg-dark: #0c1118;
  --fxc-text-dark: #cfd6e4;
  --fxc-line-dark: rgba(255,255,255,.08);

  --fxc-bg-light: #f7f8fb;
  --fxc-text-light: #2a3442;
  --fxc-line-light: rgba(0,0,0,.08);

  --fxc-accent: #3aa1ff; /* Dilersen Fixy rengiyle değiştir */

  width: 100%;
  border-top: 1px solid var(--fxc-line-dark);
  background: var(--fxc-bg-dark);
  color: var(--fxc-text-dark);
  font: 500 14px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

.fx-credit[data-theme="light"]{
  background: var(--fxc-bg-light);
  color: var(--fxc-text-light);
  border-top-color: var(--fxc-line-light);
}

.fx-credit__wrap{
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  justify-content: center;        /* ortalı görünüm */
  text-wrap: balance;
}

.fx-credit__brand{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: inherit;
  text-decoration: none;
  transition: opacity .2s ease;
  white-space: nowrap;
}
.fx-credit__brand:hover{ opacity: .85; }

.fx-credit__logo{
  display: inline-flex;
  width: 40px;
  height: 40px;
  color: var(--fxc-accent);
}

.fx-credit__text strong{
  font-weight: 700;
  letter-spacing: .2px;
}

.fx-credit__sep{ opacity: .5; }

.fx-credit__meta{
  opacity: .8;
  display: inline-flex;
  gap: 6px;
  white-space: nowrap;
}

/* Küçük ekran uyumu */
@media (max-width: 520px){
  .fx-credit__wrap{
    flex-wrap: wrap;
    gap: 8px 12px;
    padding: 12px 16px;
  }
  .fx-credit__sep{ display:none; }
}

/* ================================
   LEGAL PAGES
   ================================ */
.fds-page h1 {
  font-size: 28px;
  margin-bottom: 14px;
}
.fds-page .lead {
  font-size: 16px;
  color: var(--muted);
  margin-bottom: 22px;
}
.fds-legal h2 {
  font-size: 18px;
  margin: 20px 0 8px;
  color: var(--accent);
}
.fds-legal p, 
.fds-legal ul {
  font-size: 15px;
  color: var(--text);
  line-height: 1.6;
}
.fds-legal ul {
  padding-left: 18px;
  list-style: disc;
}