/* BP Savunma: sayfa stilleri. data-page değerleriyle mevcut tasarımlar korunur. */

/* Önceki PHP şablonları için mevcut stiller. */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Poppins:wght@200;300;400;500;600&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');
html:where(:not([data-page])){
    font-family:'Poppins',sans-serif;
    overflow-x: hidden !important;
}
:where(html:not([data-page])) body{
    min-height:100vh !important;
    font-family:'Poppins',sans-serif;
    overflow-x:hidden !important;
}
:where(html:not([data-page])) .pad0{
    padding:0px !important;
}
:where(html:not([data-page])) .bin{
    width:1400px;
    margin:auto !important;
}
:where(html:not([data-page])) a{
    text-decoration:none !important;
}
:where(html:not([data-page])) *:focus{
    outline:none !important;
    box-shadow:none !important;
}
:where(html:not([data-page])) .Referanslar{
    margin-top:50px;
    margin-bottom:50px;
}
:where(html:not([data-page])) .Referanslar h2{
    font-size:20px;
    color:#000;
    font-weight:500;
    margin-bottom:25px;
}
:where(html:not([data-page])) .Referanslar p{
    margin-bottom:20px;
    font-size:13.6px;
    color:#1C1C1C;
    line-height:28px;
    font-weight:300;
}
:where(html:not([data-page])) .imgbox2{
    width:170px;
    height:50px;
}
:where(html:not([data-page])) .imgbox2 img{
    width:100%;
    height:100%;
    object-fit:contain;
}
:where(html:not([data-page])) .imgbox{
    width:200px;
    height:70px;
}
:where(html:not([data-page])) .imgbox img{
    width:100%;
    height:100%;
    object-fit:contain;
}
:where(html:not([data-page])) .Blogdetay{
    margin-top:50px;
    margin-bottom:50px;
}
:where(html:not([data-page])) .Blogdetay h1{
    font-size:20px;
    color:#122E45;
    font-weight:500;
    margin-bottom:25px;
}
:where(html:not([data-page])) .Blogdetay p{
    margin-bottom:20px;
    font-size:13.6px;
    color:#1C1C1C;
    line-height:28px;
    font-weight:300;
}
:where(html:not([data-page])) .Cozumlerimiz{
    margin-top:50px;
    margin-bottom:50px;
}
:where(html:not([data-page])) .Cozumlerimiz h3{
    font-size:20px;
    color:#000;
    font-weight:500;
    margin-bottom:25px;
}
:where(html:not([data-page])) .Cozumlerimiz p{
    margin-bottom:20px;
    font-size:13.6px;
    color:#1C1C1C;
    line-height:28px;
    font-weight:300;
}
:where(html:not([data-page])) .Cozumlerimiz h2{
    font-size:16px;
    font-weight:400;
    color:#122E45;
    margin-bottom:20px;
    margin-top:15px;
}
:where(html:not([data-page])) .cozbox{
    border:1px solid rgba(28,28,28,0.3);
    padding:15px;
    min-height:170px;
}
:where(html:not([data-page])) .Hakkimizda{
    background-color:#122E45;
    padding-top:50px;
    padding-bottom:50px;
}
:where(html:not([data-page])) .Hakkimizda p{
    margin-bottom:20px;
    font-size:13.6px;
    color:#FFF;
    line-height:28px;
    font-weight:300;
}
:where(html:not([data-page])) .Hakkimizda h3{
    font-size:20px;
    color:#FFF;
    font-weight:500;
    margin-bottom:35px;
}
:where(html:not([data-page])) .Blog{
    margin-top:50px;
    margin-bottom:50px;
}
:where(html:not([data-page])) .Blog h3{
    font-size:20px;
    color:#000;
    font-weight:500;
    margin-bottom:60px;
}
:where(html:not([data-page])) .Blog p{
    margin-bottom:20px;
    font-size:13.6px;
    color:#1C1C1C;
    line-height:28px;
    font-weight:300;
}
:where(html:not([data-page])) .Blog h1{
    font-size:16px;
    font-weight:500;
    color:#122E45;
    margin-bottom:20px;
}
:where(html:not([data-page])) .Blog hr{
    border:none;
    margin-top:12px;
    width:100%;
    height:1px;
    background-color:rgba(28,28,28,0.1);
}
:where(html:not([data-page])) .Iletisim h6{
    font-family:'Poppins',sans-serif;
    font-size:13px;
    color:#122E45;
    margin-bottom:24px;
    font-weight:400;
}
:where(html:not([data-page])) .Iletisim h1{
    font-family:'Poppins',sans-serif;
    color:#FFF;
    font-size:25px;
    font-weight:500;
    margin-bottom:24px;
}
:where(html:not([data-page])) .Iletisim{
    margin-top: 30px;
}
:where(html:not([data-page])) .Iletisim2{
    margin-top: 30px;
}
:where(html:not([data-page])) .Iletisim2 iframe{
    border:none !important;
    width:100%;
    min-height:300px;
    height:100%;
}
:where(html:not([data-page])) .Iletisim2 h4{
    font-family: 'Poppins',sans-serif;
    font-size:16px;
    font-weight: 400;
    margin-bottom: 20px;
    color:#FFF !important;
}
:where(html:not([data-page])) .formkutusu{
    padding:30px !important;
}
:where(html:not([data-page])) .Iletisim2 input{
    width:100%;
    height:45px;
    border:none;
    font-family: 'Poppins',sans-serif;
    font-size:13.6px;
    padding-left: 10px;
}
:where(html:not([data-page])) .Iletisim2 textarea{
    width:100%;
    height:150px;
    border:none;
    font-family: 'Poppins',sans-serif;
    font-size:13.6px;
    padding-left: 10px;
    padding-top: 10px;
}
:where(html:not([data-page])) .Iletisim2 button{
    background-color: #FFF;
    color:#000;
    border:none;
    width:100%;
    height:45px;
    font-weight:500;
    font-size:13.6px;
    text-align: center;
    margin-top:10px;
}
:where(html:not([data-page])) ::placeholder{
    font-family: 'Poppins',sans-serif;
    font-size:13.4px;
    color:#000;
}
:where(html:not([data-page])) .Iletisim2 input:focus{
    background-color: #FFF;
}
:where(html:not([data-page])) .Iletisim2 textarea:focus{
    background-color: #FFF;
}
:where(html:not([data-page])) .bgcolor{
    background-color: #122E45;
}
:where(html:not([data-page])) .kutu-3{
    background-color: #FAFAFA;
    min-height:200px;
    width:100% !important;
    border:1px solid rgba(28,28,28,0.2);
    border-radius: 5px !important;
    position:relative !important;
}
:where(html:not([data-page])) .kutu-3 a{
    font-family: 'Poppins',sans-serif;
    font-size:14px;
    color:#1C1C1C;
    display:block !important;
    font-weight:normal;
    margin-top:15px;
}
:where(html:not([data-page])) .kutu-3 .white{
    width:75px;
    border:1px solid rgba(28,28,28,0.1);
    height:75px;
    background-color:#FFF;
    border-radius:50%;
    display: block !important;
    text-align: center;
    margin:auto !important;
    margin-top:15px !important;
    position:relative !important;
}
:where(html:not([data-page])) .kutu-3 .i1 i{
    font-size:25px;
    color:#122E45;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 30.3%;
    transform: translate(30.3%, -50%);
}
:where(html:not([data-page])) .kutu-3 .i2 i{
    font-size:25px;
    color:#122E45;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 25%;
    transform: translate(23%, -50%);
}
:where(html:not([data-page])) .kutu-3 .i3 i{
    font-size:25px;
    color:#122E45;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 27%;
    transform: translate(23%, -50%);
}
:where(html:not([data-page])) .footer{
    background-color:#122E45;
    padding-top:45px;
    padding-bottom:10px;
    border-top:1px solid rgba(255,255,255,0.3);
}
:where(html:not([data-page])) .footer img{
    width:250px;
    height:auto;
    object-fit:contain;
    margin-bottom:30px;
}
:where(html:not([data-page])) .footer a{
    font-size:14px;
    font-weight:400;
    display:block;
    margin-bottom:16px;
    color:#FFF;
}
:where(html:not([data-page])) .footer h6{
    font-size:13px;
    font-weight:300;
    display:block;
    line-height:40px;
    margin-bottom:0px;
    color:#FFF;
}
:where(html:not([data-page])) .footer span{
    font-weight:500;
}
:where(html:not([data-page])) .footer hr{
    width:100%;
    border:none;
    height:1px;
    background-color:rgba(255,255,255,0.3);
    margin-top:12px;
    margin-bottom:12px;
}
:where(html:not([data-page])) .footer p{
    color:#FFF;
    font-size:13px;
    width:60%;
    font-weight:300;
    line-height:27px;
}
:where(html:not([data-page])) .Menu1{
    position:absolute;
    z-index:9;
    top:0;
    left:0;
    right:0;
    width:100%;
}
:where(html:not([data-page])) .Menu1 .nav a{
    font-size:14px;
    font-weight:400;
    margin-left:20px;
    color:#FFF;
    line-height:60px;
    display:inline-block;
}
:where(html:not([data-page])) .nav{
    text-align:right !important;
}
:where(html:not([data-page])) .Ustgorsel{
    width:100%;
    height:350px;
}
:where(html:not([data-page])) .ustilet a{
    font-size:13.6px;
    color:#FFF;
    font-weight:300;
    line-height:50px;
    margin-right:12px;
}
:where(html:not([data-page])) .katalog a{
    display:block;
    line-height:50px;
    padding-left:30px;
    padding-right:30px;
    text-align:center;
    background-color:#122E45;
    font-size:13.6px;
    color:#FFF;
}
:where(html:not([data-page])) .Ustgorsel img{
    width:100%;
    height:100%;
    object-fit:cover;
}
:where(html:not([data-page])) .Menu1 hr{
    width:100%;
    margin-top:0px !important;
    height:1px;
    border:none;
    background-color:rgba(255,255,255,0.3);
}
:where(html:not([data-page])) .Menu1 img{
    width:220px;
    max-width:100%;
    height:55px;
    object-fit:contain;
}
:where(html:not([data-page])) .pozrel{
    position:relative !important;
}
:where(html:not([data-page])) .Bread h3{
    position:absolute;
    bottom:0;
    left:0;
    margin-left:20px;
    margin-bottom:40px;
    font-size:30px;
    color:#FFF;
    z-index:99 !important;
    font-weight:400;
}
:where(html:not([data-page])) .block992{
    display:none !important;
}
:where(html:not([data-page])) .fa-bars{
    color:#FFF;
    margin-top:14px;
    font-size:20px;
}
:where(html:not([data-page])) .pushy{
    background-color:#FFF;
}
:where(html:not([data-page])) .pushy a{
    color:#1C1C1C;
    font-size:18px;
    display:block;
    font-weight:300;
    margin-top:12px;
    margin-bottom:12px;
}
:where(html:not([data-page])) .ilet{
    margin-top:24px;
}
:where(html:not([data-page])) .ilet a{
    font-size:15px !important;
    margin-top:11px !important;
    margin-bottom:11px !important;
}
:where(html:not([data-page])) .pushy img{
    margin-top:5px;
    height:40px;
    width:170px;
    object-fit:contain;
}
:where(html:not([data-page])) *:focus{
    outline:none !important;
    box-shadow:none !important;
}
:where(html:not([data-page])) .Urunalt{
    background-color:#122e45;
    text-align:center;
}
:where(html:not([data-page])) .Urunalt h3{
    font-size:19px;
    text-align:center;
    color:#FFF;
    font-weight:400;
    padding-top:30px;
    padding-bottom:25px;
}
:where(html:not([data-page])) .urunbox{
    border:1px solid rgba(28,28,28,0.1);
    padding:13px;
    background-color:#FFF;
    text-align:center;
}
:where(html:not([data-page])) .urunbox img{
    margin-top:20px;
    height:60px;
    width:60px;
    margin-bottom:30px;
    object-fit:contain;
}
:where(html:not([data-page])) .urunbox h2{
    font-size:15.5px;
    font-weight:400;
    color:#122e45;
    text-align:center;
}
:where(html:not([data-page])) .Urunler{
    margin-top:50px;
    margin-bottom:50px;
}
:where(html:not([data-page])) .carousel-item{
    width:100%;
    height:90vh;
}
:where(html:not([data-page])) .carousel-item img{
    width:100%;
    height:100%;
    object-fit:cover;
}
:where(html:not([data-page])) .kucukfoto{
    display:none;
}
:where(html:not([data-page])) .Hakkimizda img{
    width:100%;
    height:auto;
    max-height:360px;
    object-fit:contain;
}
:where(html:not([data-page])) .yazbox{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    margin:auto !important;
    width:1350px;
}
:where(html:not([data-page])) .carousel-item{
    position:relative !important;
}
:where(html:not([data-page])) .yazbox p{
    margin-bottom:60px;
    font-size:14.5px;
    color:#FFF;
    line-height:28px;
    font-weight:400;
}
:where(html:not([data-page])) .yazbox h3{
    font-size:65px;
    font-weight:500;
    color:#FFF;
    margin-bottom:10px;
}
@media screen and (max-width: 1430px){:where(html:not([data-page])) .yazbox{
        width:92%;
    }
:where(html:not([data-page])) .bin{
        width:96% !important;
    }

}
@media screen and (max-width: 992px){:where(html:not([data-page])) .yazbox p{
        margin-bottom:40px;
    }
:where(html:not([data-page])) .yazbox h3{
        font-size:52px;
        font-weight:500;
        color:#FFF;
        margin-bottom:10px;
    }
:where(html:not([data-page])) .carousel-item{
        width:100%;
        height:80vh;
    }
:where(html:not([data-page])) .Menu1 img{
        width:220px !important;
        height:55px;
        object-fit:contain;
    }
:where(html:not([data-page])) .block992{
        display:block !important;
    }
:where(html:not([data-page])) .disnon992{
        display:none !important;
    }

}
@media screen and (max-width: 767px){:where(html:not([data-page])) .yazbox p{
        margin-bottom:30px;
    }
:where(html:not([data-page])) .yazbox h3{
        font-size:45px;
        font-weight:500;
        color:#FFF;
        margin-bottom:10px;
    }
:where(html:not([data-page])) .carousel-item{
        width:100%;
        height:70vh;
    }
:where(html:not([data-page])) .imgbox2{
        text-align:center;
        margin:auto !important;
        width:140px;
        height:50px;
    }
:where(html:not([data-page])) .Menu1 img{
        width:190px !important;
        height:50px;
        object-fit:contain;
    }
:where(html:not([data-page])) .Bread h3{
        font-size:25px;
    }
:where(html:not([data-page])) .disnon767{
        display:none !important;
    }
:where(html:not([data-page])) .footer p{
        width:100%;
        margin-top:10px;
        margin-bottom:20px;
    }
:where(html:not([data-page])) .footer img{
        margin-bottom:15px;
    }
:where(html:not([data-page])) .imgbox{
        width:150px;
        height:60px;
    }

}
@media screen and (max-width: 576px){:where(html:not([data-page])) .yazbox h3{
        font-size:35px;
        font-weight:500;
        color:#FFF;
        margin-bottom:10px;
    }
:where(html:not([data-page])) .carousel-item{
        width:100%;
        height:60vh;
    }
:where(html:not([data-page])) .kucukfoto{
        display:block;
    }
:where(html:not([data-page])) .buyukfoto{
        display:none !important;
    }
:where(html:not([data-page])) .imgbox{
        width:100%;
        height:60px;
    }

}


/* haber-detay.html */
:root:where([data-page="haber-detay"]){
  --navy-900:#061B36;--navy-700:#0B3A75;--steel-500:#5A6B80;--steel-200:#D5DFEB;
  --paper:#F1F5FA;--white:#fff;--accent:#2F80ED;
  --head:'Barlow Condensed','Rajdhani',sans-serif;--body:'Poppins',Inter,sans-serif;
  --r:4px;--wrap:1320px;
}
:where(html[data-page="haber-detay"]), :where(html[data-page="haber-detay"]) *{box-sizing:border-box;margin:0;padding:0}
html:where([data-page="haber-detay"]){scroll-behavior:smooth}
:where(html[data-page="haber-detay"]) body{font:400 16px/28px var(--body);color:var(--navy-900);background:var(--white)}
:where(html[data-page="haber-detay"]) a{color:inherit;text-decoration:none}
:where(html[data-page="haber-detay"]) .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:where(html[data-page="haber-detay"]) h1, :where(html[data-page="haber-detay"]) h2, :where(html[data-page="haber-detay"]) h3, :where(html[data-page="haber-detay"]) .num{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
:where(html[data-page="haber-detay"]) h1{font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="haber-detay"]) h2{font-size:clamp(30px,4vw,44px);line-height:1.1}
:where(html[data-page="haber-detay"]) h3{font-size:24px;line-height:32px}
:where(html[data-page="haber-detay"]) section{padding:96px 0}
:where(html[data-page="haber-detay"]) :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* header */
:where(html[data-page="haber-detay"]) .topbar{background:var(--navy-900);color:#a9bdd6;font-size:13px;line-height:20px;padding:6px 0}
:where(html[data-page="haber-detay"]) .topbar .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
:where(html[data-page="haber-detay"]) .lang a{margin-left:12px}
:where(html[data-page="haber-detay"]) .lang a.on{color:var(--accent)}
:where(html[data-page="haber-detay"]) header.main{background:var(--navy-700);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08)}
:where(html[data-page="haber-detay"]) header.main .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
:where(html[data-page="haber-detay"]) .logo{font-family:var(--head);font-size:26px;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
:where(html[data-page="haber-detay"]) .logo span{color:var(--accent)}
:where(html[data-page="haber-detay"]) nav ul{display:flex;gap:28px;list-style:none}
:where(html[data-page="haber-detay"]) nav a{color:#dbe4ec;font-size:14px;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .18s,color .18s}
:where(html[data-page="haber-detay"]) nav a:hover{color:#fff;border-color:var(--accent)}
:where(html[data-page="haber-detay"]) .btn{display:inline-block;font:600 14px/1 var(--body);padding:14px 24px;border-radius:var(--r);border:1px solid var(--accent);background:var(--accent);color:#fff;transition:background .18s,color .18s;cursor:pointer}
:where(html[data-page="haber-detay"]) .btn:hover{background:#1f6bd4}
:where(html[data-page="haber-detay"]) .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
:where(html[data-page="haber-detay"]) .btn.ghost:hover{border-color:#fff;background:transparent}
:where(html[data-page="haber-detay"]) .menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:8px 12px;font:500 14px var(--body)}
/* hero carousel */
:where(html[data-page="haber-detay"]) .hero{position:relative;background:var(--navy-900);color:#fff;overflow:hidden}
:where(html[data-page="haber-detay"]) .hero-slide{position:relative;padding:120px 0 128px;background:var(--navy-900);overflow:hidden}
:where(html[data-page="haber-detay"]) .hero-slide .bg{position:absolute;inset:0;background-image:var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="haber-detay"]) .hero-slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,27,54,.9) 0%,rgba(6,27,54,.62) 55%,rgba(6,27,54,.3) 100%)}
:where(html[data-page="haber-detay"]) .hero-slide::after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 78% 40%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="haber-detay"]) .hero-slide .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
:where(html[data-page="haber-detay"]) .h1{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="haber-detay"]) .hero-slide p.lead{color:#b7c4d0;max-width:560px;margin:24px 0 36px}
:where(html[data-page="haber-detay"]) .hero-slide .cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="haber-detay"]) .hero-carousel .owl-dots{position:absolute;bottom:36px;left:max(24px,calc((100% - var(--wrap))/2 + 24px));z-index:3;display:flex;gap:8px}
:where(html[data-page="haber-detay"]) .hero-carousel .owl-dot{background:none;border:0;padding:8px 0;cursor:pointer}
:where(html[data-page="haber-detay"]) .hero-carousel .owl-dot span{display:block;width:36px;height:3px;background:rgba(255,255,255,.35);transition:background .2s}
:where(html[data-page="haber-detay"]) .hero-carousel .owl-dot.active span{background:var(--accent)}
:where(html[data-page="haber-detay"]) .layers{border-left:2px solid var(--accent);padding-left:24px;font-size:14px;line-height:24px;color:#b7c4d0}
:where(html[data-page="haber-detay"]) .layers b{display:block;font:600 13px/20px var(--body);color:#fff;margin-bottom:4px}
:where(html[data-page="haber-detay"]) .layers div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="haber-detay"]) .layers div:last-child{border:0}
/* stats */
:where(html[data-page="haber-detay"]) .stats{background:var(--navy-700);color:#fff;padding:0}
:where(html[data-page="haber-detay"]) .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
:where(html[data-page="haber-detay"]) .stat{padding:32px 24px;border-right:1px solid rgba(255,255,255,.1)}
:where(html[data-page="haber-detay"]) .stat:last-child{border:0}
:where(html[data-page="haber-detay"]) .stat .num{font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
:where(html[data-page="haber-detay"]) .stat small{display:block;color:#9fb0c0;font-size:13px;margin-top:6px}
/* shared */
:where(html[data-page="haber-detay"]) .sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
:where(html[data-page="haber-detay"]) .sec-head p{color:var(--steel-500);max-width:480px}
:where(html[data-page="haber-detay"]) .paper{background:var(--paper)}
/* categories */
:where(html[data-page="haber-detay"]) .cats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="haber-detay"]) .cat{position:relative;min-height:240px;border-radius:var(--r);background:var(--navy-700);color:#fff;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--navy-700)}
:where(html[data-page="haber-detay"]) .cat::before{content:"";position:absolute;inset:0;opacity:.1;background:repeating-radial-gradient(circle at 85% 15%,transparent 0 22px,#fff 22px 23px)}
:where(html[data-page="haber-detay"]) .cat::after{content:"";position:absolute;left:28px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="haber-detay"]) .cat:hover::after{width:calc(100% - 56px)}
:where(html[data-page="haber-detay"]) .cat > *{position:relative}
:where(html[data-page="haber-detay"]) .cat span{color:#9fb0c0;font-size:13px}
:where(html[data-page="haber-detay"]) .cat.alt{background:var(--navy-900)}
/* products */
:where(html[data-page="haber-detay"]) .prods{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="haber-detay"]) .card{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="haber-detay"]) .thumb{aspect-ratio:4/3;background:var(--navy-700);position:relative;display:flex;align-items:center;justify-content:center;color:#7f93a6;font-size:12px;border-bottom:1px solid var(--steel-200);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px}
:where(html[data-page="haber-detay"]) .card .body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
:where(html[data-page="haber-detay"]) .brand{font-size:12px;color:var(--steel-500);display:flex;justify-content:space-between}
:where(html[data-page="haber-detay"]) .badge{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:0 8px;font-size:11px;line-height:20px;color:var(--navy-700)}
:where(html[data-page="haber-detay"]) .card p{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="haber-detay"]) .specs{display:flex;gap:24px;margin:8px 0;padding:12px 0;border-top:1px solid var(--steel-200);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="haber-detay"]) .specs div{font-size:12px;line-height:16px;color:var(--steel-500)}
:where(html[data-page="haber-detay"]) .specs .num{display:block;font-size:26px;line-height:30px;color:var(--navy-700);font-variant-numeric:tabular-nums}
:where(html[data-page="haber-detay"]) .more{margin-top:auto;font-weight:600;font-size:14px;border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="haber-detay"]) .card:hover .more{border-color:var(--accent)}
/* brands */
:where(html[data-page="haber-detay"]) .brand-carousel .item{display:block;border:1px solid var(--steel-200);border-radius:var(--r);padding:28px 12px;text-align:center;font:700 20px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--steel-500);transition:color .18s,border-color .18s;background:var(--white)}
:where(html[data-page="haber-detay"]) .brand-carousel .item small{display:block;font:400 12px/18px var(--body);letter-spacing:0;text-transform:none;margin-top:4px}
:where(html[data-page="haber-detay"]) .brand-carousel .item:hover{color:var(--navy-700);border-color:var(--accent)}
/* kataloglar */
:where(html[data-page="haber-detay"]) .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="haber-detay"]) .chip{font:500 14px/1 var(--body);padding:10px 18px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="haber-detay"]) .chip:hover{border-color:var(--accent)}
:where(html[data-page="haber-detay"]) .chip[aria-pressed=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="haber-detay"]) .catalogs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
:where(html[data-page="haber-detay"]) .cat-doc{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="haber-detay"]) .cat-doc[hidden]{display:none}
:where(html[data-page="haber-detay"]) .cover{aspect-ratio:3/4;background:var(--navy-700);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="haber-detay"]) .cover::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-radial-gradient(circle at 90% 8%,transparent 0 20px,#fff 20px 21px)}
:where(html[data-page="haber-detay"]) .cover>*{position:relative}
:where(html[data-page="haber-detay"]) .cover b{font:700 28px/1.05 var(--head);text-transform:uppercase;letter-spacing:.04em}
:where(html[data-page="haber-detay"]) .cover span{font-size:12px;color:#a9bdd6}
:where(html[data-page="haber-detay"]) .pdf-tag{align-self:flex-start;background:var(--accent);color:#fff;font:600 11px/20px var(--body);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="haber-detay"]) .cat-doc .body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
:where(html[data-page="haber-detay"]) .cat-doc h3{font-size:20px;line-height:26px}
:where(html[data-page="haber-detay"]) .cat-doc p{font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="haber-detay"]) .dl{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--navy-700);border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="haber-detay"]) .cat-doc:hover .dl{border-color:var(--accent)}
/* haber görseli */
:where(html[data-page="haber-detay"]) .news img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--steel-200);border-radius:var(--r) var(--r) 0 0}
/* cta band */
:where(html[data-page="haber-detay"]) .band{background:var(--navy-900);color:#fff;padding:72px 0}
:where(html[data-page="haber-detay"]) .band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
:where(html[data-page="haber-detay"]) .band p{color:#9fb0c0;margin-top:8px}
/* footer */
:where(html[data-page="haber-detay"]) footer{background:var(--navy-900);color:#9fb0c0;font-size:14px;line-height:24px;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}
:where(html[data-page="haber-detay"]) .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
:where(html[data-page="haber-detay"]) footer h4{font:600 14px var(--body);color:#fff;margin-bottom:12px}
:where(html[data-page="haber-detay"]) footer li{list-style:none}
:where(html[data-page="haber-detay"]) footer a:hover{color:#fff}
:where(html[data-page="haber-detay"]) .legal{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:12px;line-height:20px}
/* hızlı katalog menüsü */
:where(html[data-page="haber-detay"]) .qc{position:fixed;left:24px;bottom:24px;z-index:40}
:where(html[data-page="haber-detay"]) .qc-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(6,27,54,.35);transition:background .18s}
:where(html[data-page="haber-detay"]) .qc-btn:hover, :where(html[data-page="haber-detay"]) .qc-btn[aria-expanded=true]{background:var(--navy-700)}
:where(html[data-page="haber-detay"]) .qc-panel{position:absolute;left:0;bottom:68px;width:340px;max-width:calc(100vw - 48px);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);box-shadow:0 12px 32px rgba(6,27,54,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}
:where(html[data-page="haber-detay"]) .qc.open .qc-panel{opacity:1;visibility:visible;transform:none}
:where(html[data-page="haber-detay"]) .qc-head{padding:14px 18px;background:var(--navy-700);color:#fff;font:700 18px/24px var(--head);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--r) var(--r) 0 0}
:where(html[data-page="haber-detay"]) .qc-list{list-style:none;max-height:min(55vh,360px);overflow:auto}
:where(html[data-page="haber-detay"]) .qc-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px;transition:background .15s}
:where(html[data-page="haber-detay"]) .qc-list a:hover{background:var(--paper)}
:where(html[data-page="haber-detay"]) .qc-list small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="haber-detay"]) .qc-list .pdf{flex:none;font:600 11px/20px var(--body);color:#fff;background:var(--accent);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="haber-detay"]) .qc-all{display:block;padding:12px 18px;font:600 14px var(--body);color:var(--navy-700)}
:where(html[data-page="haber-detay"]) .qc-all:hover{background:var(--paper)}
/* mobile sticky */
:where(html[data-page="haber-detay"]) .sticky-cta{display:none}
@media (max-width:1024px){:where(html[data-page="haber-detay"]) .hero-slide .wrap{grid-template-columns:1fr}
:where(html[data-page="haber-detay"]) .cats, :where(html[data-page="haber-detay"]) .prods{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="haber-detay"]) .catalogs{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="haber-detay"]) .fgrid{grid-template-columns:repeat(2,1fr)}

}
@media (max-width:760px){:where(html[data-page="haber-detay"]) section{padding:56px 0}
:where(html[data-page="haber-detay"]) .hero-slide{padding:72px 0 88px}
:where(html[data-page="haber-detay"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:16px 24px 24px}
:where(html[data-page="haber-detay"]) nav.open{display:block}
:where(html[data-page="haber-detay"]) nav ul{flex-direction:column;gap:4px}
:where(html[data-page="haber-detay"]) .menu-btn{display:block}
:where(html[data-page="haber-detay"]) header.main .btn{display:none}
:where(html[data-page="haber-detay"]) .cats, :where(html[data-page="haber-detay"]) .prods, :where(html[data-page="haber-detay"]) .fgrid{grid-template-columns:1fr}
:where(html[data-page="haber-detay"]) .catalogs{grid-template-columns:repeat(2,1fr);gap:16px}
:where(html[data-page="haber-detay"]) .stats .wrap{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="haber-detay"]) .stat:nth-child(2){border-right:0}
:where(html[data-page="haber-detay"]) .stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="haber-detay"]) .sticky-cta{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--navy-900);padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
:where(html[data-page="haber-detay"]) .sticky-cta .btn{display:block;text-align:center;width:100%}
:where(html[data-page="haber-detay"]) body{padding-bottom:68px}
:where(html[data-page="haber-detay"]) .qc{left:16px;bottom:84px}

}
@media (prefers-reduced-motion:reduce){:where(html[data-page="haber-detay"]), :where(html[data-page="haber-detay"]) *{transition:none!important;scroll-behavior:auto!important}}
:where(html[data-page="haber-detay"]) nav a[aria-current=page]{color:#fff;border-color:var(--accent)}
:where(html[data-page="haber-detay"]) .page-hero{position:relative;background:var(--navy-900);color:#fff;padding:72px 0 64px;overflow:hidden}
:where(html[data-page="haber-detay"]) .page-hero::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;background:repeating-radial-gradient(circle at 85% 30%,transparent 0 38px,#fff 38px 39px),linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="haber-detay"]) .page-hero .wrap{position:relative;z-index:1}
:where(html[data-page="haber-detay"]) .page-hero p{color:#b7c4d0;max-width:600px;margin-top:16px}
:where(html[data-page="haber-detay"]) .crumb{font-size:13px;line-height:20px;color:#a9bdd6;margin-bottom:20px}
:where(html[data-page="haber-detay"]) .crumb a:hover{color:#fff}
:where(html[data-page="haber-detay"]) .crumb span{margin:0 8px}
:where(html[data-page="haber-detay"]) .toolbar{margin-bottom:32px}
:where(html[data-page="haber-detay"]) .toolbar .chips{margin:0}
:where(html[data-page="haber-detay"]) .prods.news .feature{grid-column:1/-1;flex-direction:row}
:where(html[data-page="haber-detay"]) .prods.news .feature>a{flex:0 0 58%;display:block}
:where(html[data-page="haber-detay"]) .prods.news .feature img{height:100%;border-radius:var(--r) 0 0 var(--r);border-bottom:0;border-right:1px solid var(--steel-200)}
:where(html[data-page="haber-detay"]) .prods.news .feature .body{justify-content:center;padding:32px}
:where(html[data-page="haber-detay"]) .prods.news .feature h3{font-size:34px;line-height:40px}
:where(html[data-page="haber-detay"]) .prods.news .card[hidden]{display:none}
:where(html[data-page="haber-detay"]) .prods.news .card h3 a:hover{color:var(--navy-700)}
:where(html[data-page="haber-detay"]) .art{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
:where(html[data-page="haber-detay"]) .art-img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);border:1px solid var(--steel-200);margin:28px 0 32px}
:where(html[data-page="haber-detay"]) .art-meta{display:flex;gap:12px;align-items:center;font-size:13px;color:#a9bdd6;margin-bottom:16px}
:where(html[data-page="haber-detay"]) .art-meta .badge{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
:where(html[data-page="haber-detay"]) .art-body{max-width:720px}
:where(html[data-page="haber-detay"]) .art-body h2{font-size:30px;margin:36px 0 12px;color:var(--navy-700)}
:where(html[data-page="haber-detay"]) .art-body p{margin-bottom:16px}
:where(html[data-page="haber-detay"]) .art-body ul{margin:0 0 16px 20px}
:where(html[data-page="haber-detay"]) .art-body li{margin-bottom:4px}
:where(html[data-page="haber-detay"]) .art-body .note{font-size:13px;line-height:20px;color:var(--steel-500);border-left:3px solid var(--accent);padding-left:12px;margin-top:28px}
:where(html[data-page="haber-detay"]) .side{position:sticky;top:96px;display:flex;flex-direction:column;gap:32px}
:where(html[data-page="haber-detay"]) .side h3{font-size:22px;margin-bottom:12px}
:where(html[data-page="haber-detay"]) .recent a{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px}
:where(html[data-page="haber-detay"]) .recent img{flex:none;width:96px;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r)}
:where(html[data-page="haber-detay"]) .recent small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="haber-detay"]) .recent a:hover b{color:var(--navy-700)}
:where(html[data-page="haber-detay"]) .side-cta{background:var(--navy-700);color:#fff;padding:24px;border-radius:var(--r)}
:where(html[data-page="haber-detay"]) .side-cta p{font-size:14px;line-height:22px;color:#b7c4d0;margin:8px 0 16px}
@media (max-width:1024px){:where(html[data-page="haber-detay"]) .art{grid-template-columns:1fr}
:where(html[data-page="haber-detay"]) .side{position:static}
:where(html[data-page="haber-detay"]) .prods.news .feature{flex-direction:column}
:where(html[data-page="haber-detay"]) .prods.news .feature>a{flex:none}
:where(html[data-page="haber-detay"]) .prods.news .feature img{border-radius:var(--r) var(--r) 0 0;border-right:0;border-bottom:1px solid var(--steel-200)}}




/* haberler.html */
:root:where([data-page="haberler"]){
  --navy-900:#061B36;--navy-700:#0B3A75;--steel-500:#5A6B80;--steel-200:#D5DFEB;
  --paper:#F1F5FA;--white:#fff;--accent:#2F80ED;
  --head:'Barlow Condensed','Rajdhani',sans-serif;--body:'Poppins',Inter,sans-serif;
  --r:4px;--wrap:1320px;
}
:where(html[data-page="haberler"]), :where(html[data-page="haberler"]) *{box-sizing:border-box;margin:0;padding:0}
html:where([data-page="haberler"]){scroll-behavior:smooth}
:where(html[data-page="haberler"]) body{font:400 16px/28px var(--body);color:var(--navy-900);background:var(--white)}
:where(html[data-page="haberler"]) a{color:inherit;text-decoration:none}
:where(html[data-page="haberler"]) .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:where(html[data-page="haberler"]) h1, :where(html[data-page="haberler"]) h2, :where(html[data-page="haberler"]) h3, :where(html[data-page="haberler"]) .num{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
:where(html[data-page="haberler"]) h1{font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="haberler"]) h2{font-size:clamp(30px,4vw,44px);line-height:1.1}
:where(html[data-page="haberler"]) h3{font-size:24px;line-height:32px}
:where(html[data-page="haberler"]) section{padding:96px 0}
:where(html[data-page="haberler"]) :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* header */
:where(html[data-page="haberler"]) .topbar{background:var(--navy-900);color:#a9bdd6;font-size:13px;line-height:20px;padding:6px 0}
:where(html[data-page="haberler"]) .topbar .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
:where(html[data-page="haberler"]) .lang a{margin-left:12px}
:where(html[data-page="haberler"]) .lang a.on{color:var(--accent)}
:where(html[data-page="haberler"]) header.main{background:var(--navy-700);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08)}
:where(html[data-page="haberler"]) header.main .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
:where(html[data-page="haberler"]) .logo{font-family:var(--head);font-size:26px;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
:where(html[data-page="haberler"]) .logo span{color:var(--accent)}
:where(html[data-page="haberler"]) nav ul{display:flex;gap:28px;list-style:none}
:where(html[data-page="haberler"]) nav a{color:#dbe4ec;font-size:14px;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .18s,color .18s}
:where(html[data-page="haberler"]) nav a:hover{color:#fff;border-color:var(--accent)}
:where(html[data-page="haberler"]) .btn{display:inline-block;font:600 14px/1 var(--body);padding:14px 24px;border-radius:var(--r);border:1px solid var(--accent);background:var(--accent);color:#fff;transition:background .18s,color .18s;cursor:pointer}
:where(html[data-page="haberler"]) .btn:hover{background:#1f6bd4}
:where(html[data-page="haberler"]) .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
:where(html[data-page="haberler"]) .btn.ghost:hover{border-color:#fff;background:transparent}
:where(html[data-page="haberler"]) .menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:8px 12px;font:500 14px var(--body)}
/* hero carousel */
:where(html[data-page="haberler"]) .hero{position:relative;background:var(--navy-900);color:#fff;overflow:hidden}
:where(html[data-page="haberler"]) .hero-slide{position:relative;padding:120px 0 128px;background:var(--navy-900);overflow:hidden}
:where(html[data-page="haberler"]) .hero-slide .bg{position:absolute;inset:0;background-image:var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="haberler"]) .hero-slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,27,54,.9) 0%,rgba(6,27,54,.62) 55%,rgba(6,27,54,.3) 100%)}
:where(html[data-page="haberler"]) .hero-slide::after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 78% 40%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="haberler"]) .hero-slide .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
:where(html[data-page="haberler"]) .h1{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="haberler"]) .hero-slide p.lead{color:#b7c4d0;max-width:560px;margin:24px 0 36px}
:where(html[data-page="haberler"]) .hero-slide .cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="haberler"]) .hero-carousel .owl-dots{position:absolute;bottom:36px;left:max(24px,calc((100% - var(--wrap))/2 + 24px));z-index:3;display:flex;gap:8px}
:where(html[data-page="haberler"]) .hero-carousel .owl-dot{background:none;border:0;padding:8px 0;cursor:pointer}
:where(html[data-page="haberler"]) .hero-carousel .owl-dot span{display:block;width:36px;height:3px;background:rgba(255,255,255,.35);transition:background .2s}
:where(html[data-page="haberler"]) .hero-carousel .owl-dot.active span{background:var(--accent)}
:where(html[data-page="haberler"]) .layers{border-left:2px solid var(--accent);padding-left:24px;font-size:14px;line-height:24px;color:#b7c4d0}
:where(html[data-page="haberler"]) .layers b{display:block;font:600 13px/20px var(--body);color:#fff;margin-bottom:4px}
:where(html[data-page="haberler"]) .layers div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="haberler"]) .layers div:last-child{border:0}
/* stats */
:where(html[data-page="haberler"]) .stats{background:var(--navy-700);color:#fff;padding:0}
:where(html[data-page="haberler"]) .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
:where(html[data-page="haberler"]) .stat{padding:32px 24px;border-right:1px solid rgba(255,255,255,.1)}
:where(html[data-page="haberler"]) .stat:last-child{border:0}
:where(html[data-page="haberler"]) .stat .num{font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
:where(html[data-page="haberler"]) .stat small{display:block;color:#9fb0c0;font-size:13px;margin-top:6px}
/* shared */
:where(html[data-page="haberler"]) .sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
:where(html[data-page="haberler"]) .sec-head p{color:var(--steel-500);max-width:480px}
:where(html[data-page="haberler"]) .paper{background:var(--paper)}
/* categories */
:where(html[data-page="haberler"]) .cats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="haberler"]) .cat{position:relative;min-height:240px;border-radius:var(--r);background:var(--navy-700);color:#fff;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--navy-700)}
:where(html[data-page="haberler"]) .cat::before{content:"";position:absolute;inset:0;opacity:.1;background:repeating-radial-gradient(circle at 85% 15%,transparent 0 22px,#fff 22px 23px)}
:where(html[data-page="haberler"]) .cat::after{content:"";position:absolute;left:28px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="haberler"]) .cat:hover::after{width:calc(100% - 56px)}
:where(html[data-page="haberler"]) .cat > *{position:relative}
:where(html[data-page="haberler"]) .cat span{color:#9fb0c0;font-size:13px}
:where(html[data-page="haberler"]) .cat.alt{background:var(--navy-900)}
/* products */
:where(html[data-page="haberler"]) .prods{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="haberler"]) .card{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="haberler"]) .thumb{aspect-ratio:4/3;background:var(--navy-700);position:relative;display:flex;align-items:center;justify-content:center;color:#7f93a6;font-size:12px;border-bottom:1px solid var(--steel-200);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px}
:where(html[data-page="haberler"]) .card .body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
:where(html[data-page="haberler"]) .brand{font-size:12px;color:var(--steel-500);display:flex;justify-content:space-between}
:where(html[data-page="haberler"]) .badge{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:0 8px;font-size:11px;line-height:20px;color:var(--navy-700)}
:where(html[data-page="haberler"]) .card p{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="haberler"]) .specs{display:flex;gap:24px;margin:8px 0;padding:12px 0;border-top:1px solid var(--steel-200);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="haberler"]) .specs div{font-size:12px;line-height:16px;color:var(--steel-500)}
:where(html[data-page="haberler"]) .specs .num{display:block;font-size:26px;line-height:30px;color:var(--navy-700);font-variant-numeric:tabular-nums}
:where(html[data-page="haberler"]) .more{margin-top:auto;font-weight:600;font-size:14px;border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="haberler"]) .card:hover .more{border-color:var(--accent)}
/* brands */
:where(html[data-page="haberler"]) .brand-carousel .item{display:block;border:1px solid var(--steel-200);border-radius:var(--r);padding:28px 12px;text-align:center;font:700 20px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--steel-500);transition:color .18s,border-color .18s;background:var(--white)}
:where(html[data-page="haberler"]) .brand-carousel .item small{display:block;font:400 12px/18px var(--body);letter-spacing:0;text-transform:none;margin-top:4px}
:where(html[data-page="haberler"]) .brand-carousel .item:hover{color:var(--navy-700);border-color:var(--accent)}
/* kataloglar */
:where(html[data-page="haberler"]) .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="haberler"]) .chip{font:500 14px/1 var(--body);padding:10px 18px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="haberler"]) .chip:hover{border-color:var(--accent)}
:where(html[data-page="haberler"]) .chip[aria-pressed=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="haberler"]) .catalogs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
:where(html[data-page="haberler"]) .cat-doc{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="haberler"]) .cat-doc[hidden]{display:none}
:where(html[data-page="haberler"]) .cover{aspect-ratio:3/4;background:var(--navy-700);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="haberler"]) .cover::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-radial-gradient(circle at 90% 8%,transparent 0 20px,#fff 20px 21px)}
:where(html[data-page="haberler"]) .cover>*{position:relative}
:where(html[data-page="haberler"]) .cover b{font:700 28px/1.05 var(--head);text-transform:uppercase;letter-spacing:.04em}
:where(html[data-page="haberler"]) .cover span{font-size:12px;color:#a9bdd6}
:where(html[data-page="haberler"]) .pdf-tag{align-self:flex-start;background:var(--accent);color:#fff;font:600 11px/20px var(--body);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="haberler"]) .cat-doc .body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
:where(html[data-page="haberler"]) .cat-doc h3{font-size:20px;line-height:26px}
:where(html[data-page="haberler"]) .cat-doc p{font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="haberler"]) .dl{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--navy-700);border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="haberler"]) .cat-doc:hover .dl{border-color:var(--accent)}
/* haber görseli */
:where(html[data-page="haberler"]) .news img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--steel-200);border-radius:var(--r) var(--r) 0 0}
/* cta band */
:where(html[data-page="haberler"]) .band{background:var(--navy-900);color:#fff;padding:72px 0}
:where(html[data-page="haberler"]) .band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
:where(html[data-page="haberler"]) .band p{color:#9fb0c0;margin-top:8px}
/* footer */
:where(html[data-page="haberler"]) footer{background:var(--navy-900);color:#9fb0c0;font-size:14px;line-height:24px;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}
:where(html[data-page="haberler"]) .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
:where(html[data-page="haberler"]) footer h4{font:600 14px var(--body);color:#fff;margin-bottom:12px}
:where(html[data-page="haberler"]) footer li{list-style:none}
:where(html[data-page="haberler"]) footer a:hover{color:#fff}
:where(html[data-page="haberler"]) .legal{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:12px;line-height:20px}
/* hızlı katalog menüsü */
:where(html[data-page="haberler"]) .qc{position:fixed;left:24px;bottom:24px;z-index:40}
:where(html[data-page="haberler"]) .qc-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(6,27,54,.35);transition:background .18s}
:where(html[data-page="haberler"]) .qc-btn:hover, :where(html[data-page="haberler"]) .qc-btn[aria-expanded=true]{background:var(--navy-700)}
:where(html[data-page="haberler"]) .qc-panel{position:absolute;left:0;bottom:68px;width:340px;max-width:calc(100vw - 48px);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);box-shadow:0 12px 32px rgba(6,27,54,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}
:where(html[data-page="haberler"]) .qc.open .qc-panel{opacity:1;visibility:visible;transform:none}
:where(html[data-page="haberler"]) .qc-head{padding:14px 18px;background:var(--navy-700);color:#fff;font:700 18px/24px var(--head);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--r) var(--r) 0 0}
:where(html[data-page="haberler"]) .qc-list{list-style:none;max-height:min(55vh,360px);overflow:auto}
:where(html[data-page="haberler"]) .qc-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px;transition:background .15s}
:where(html[data-page="haberler"]) .qc-list a:hover{background:var(--paper)}
:where(html[data-page="haberler"]) .qc-list small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="haberler"]) .qc-list .pdf{flex:none;font:600 11px/20px var(--body);color:#fff;background:var(--accent);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="haberler"]) .qc-all{display:block;padding:12px 18px;font:600 14px var(--body);color:var(--navy-700)}
:where(html[data-page="haberler"]) .qc-all:hover{background:var(--paper)}
/* mobile sticky */
:where(html[data-page="haberler"]) .sticky-cta{display:none}
@media (max-width:1024px){:where(html[data-page="haberler"]) .hero-slide .wrap{grid-template-columns:1fr}
:where(html[data-page="haberler"]) .cats, :where(html[data-page="haberler"]) .prods{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="haberler"]) .catalogs{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="haberler"]) .fgrid{grid-template-columns:repeat(2,1fr)}

}
@media (max-width:760px){:where(html[data-page="haberler"]) section{padding:56px 0}
:where(html[data-page="haberler"]) .hero-slide{padding:72px 0 88px}
:where(html[data-page="haberler"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:16px 24px 24px}
:where(html[data-page="haberler"]) nav.open{display:block}
:where(html[data-page="haberler"]) nav ul{flex-direction:column;gap:4px}
:where(html[data-page="haberler"]) .menu-btn{display:block}
:where(html[data-page="haberler"]) header.main .btn{display:none}
:where(html[data-page="haberler"]) .cats, :where(html[data-page="haberler"]) .prods, :where(html[data-page="haberler"]) .fgrid{grid-template-columns:1fr}
:where(html[data-page="haberler"]) .catalogs{grid-template-columns:repeat(2,1fr);gap:16px}
:where(html[data-page="haberler"]) .stats .wrap{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="haberler"]) .stat:nth-child(2){border-right:0}
:where(html[data-page="haberler"]) .stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="haberler"]) .sticky-cta{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--navy-900);padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
:where(html[data-page="haberler"]) .sticky-cta .btn{display:block;text-align:center;width:100%}
:where(html[data-page="haberler"]) body{padding-bottom:68px}
:where(html[data-page="haberler"]) .qc{left:16px;bottom:84px}

}
@media (prefers-reduced-motion:reduce){:where(html[data-page="haberler"]), :where(html[data-page="haberler"]) *{transition:none!important;scroll-behavior:auto!important}}
:where(html[data-page="haberler"]) nav a[aria-current=page]{color:#fff;border-color:var(--accent)}
:where(html[data-page="haberler"]) .page-hero{position:relative;background:var(--navy-900);color:#fff;padding:72px 0 64px;overflow:hidden}
:where(html[data-page="haberler"]) .page-hero::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;background:repeating-radial-gradient(circle at 85% 30%,transparent 0 38px,#fff 38px 39px),linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="haberler"]) .page-hero .wrap{position:relative;z-index:1}
:where(html[data-page="haberler"]) .page-hero p{color:#b7c4d0;max-width:600px;margin-top:16px}
:where(html[data-page="haberler"]) .crumb{font-size:13px;line-height:20px;color:#a9bdd6;margin-bottom:20px}
:where(html[data-page="haberler"]) .crumb a:hover{color:#fff}
:where(html[data-page="haberler"]) .crumb span{margin:0 8px}
:where(html[data-page="haberler"]) .toolbar{margin-bottom:32px}
:where(html[data-page="haberler"]) .toolbar .chips{margin:0}
:where(html[data-page="haberler"]) .prods.news .feature{grid-column:1/-1;flex-direction:row}
:where(html[data-page="haberler"]) .prods.news .feature>a{flex:0 0 58%;display:block}
:where(html[data-page="haberler"]) .prods.news .feature img{height:100%;border-radius:var(--r) 0 0 var(--r);border-bottom:0;border-right:1px solid var(--steel-200)}
:where(html[data-page="haberler"]) .prods.news .feature .body{justify-content:center;padding:32px}
:where(html[data-page="haberler"]) .prods.news .feature h3{font-size:34px;line-height:40px}
:where(html[data-page="haberler"]) .prods.news .card[hidden]{display:none}
:where(html[data-page="haberler"]) .prods.news .card h3 a:hover{color:var(--navy-700)}
:where(html[data-page="haberler"]) .art{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
:where(html[data-page="haberler"]) .art-img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);border:1px solid var(--steel-200);margin:28px 0 32px}
:where(html[data-page="haberler"]) .art-meta{display:flex;gap:12px;align-items:center;font-size:13px;color:#a9bdd6;margin-bottom:16px}
:where(html[data-page="haberler"]) .art-meta .badge{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
:where(html[data-page="haberler"]) .art-body{max-width:720px}
:where(html[data-page="haberler"]) .art-body h2{font-size:30px;margin:36px 0 12px;color:var(--navy-700)}
:where(html[data-page="haberler"]) .art-body p{margin-bottom:16px}
:where(html[data-page="haberler"]) .art-body ul{margin:0 0 16px 20px}
:where(html[data-page="haberler"]) .art-body li{margin-bottom:4px}
:where(html[data-page="haberler"]) .art-body .note{font-size:13px;line-height:20px;color:var(--steel-500);border-left:3px solid var(--accent);padding-left:12px;margin-top:28px}
:where(html[data-page="haberler"]) .side{position:sticky;top:96px;display:flex;flex-direction:column;gap:32px}
:where(html[data-page="haberler"]) .side h3{font-size:22px;margin-bottom:12px}
:where(html[data-page="haberler"]) .recent a{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px}
:where(html[data-page="haberler"]) .recent img{flex:none;width:96px;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r)}
:where(html[data-page="haberler"]) .recent small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="haberler"]) .recent a:hover b{color:var(--navy-700)}
:where(html[data-page="haberler"]) .side-cta{background:var(--navy-700);color:#fff;padding:24px;border-radius:var(--r)}
:where(html[data-page="haberler"]) .side-cta p{font-size:14px;line-height:22px;color:#b7c4d0;margin:8px 0 16px}
@media (max-width:1024px){:where(html[data-page="haberler"]) .art{grid-template-columns:1fr}
:where(html[data-page="haberler"]) .side{position:static}
:where(html[data-page="haberler"]) .prods.news .feature{flex-direction:column}
:where(html[data-page="haberler"]) .prods.news .feature>a{flex:none}
:where(html[data-page="haberler"]) .prods.news .feature img{border-radius:var(--r) var(--r) 0 0;border-right:0;border-bottom:1px solid var(--steel-200)}}




/* hakkimizda.html */
:root:where([data-page="hakkimizda"]){
  --navy-900:#061B36;--navy-700:#0B3A75;--steel-500:#5A6B80;--steel-200:#D5DFEB;
  --paper:#F1F5FA;--white:#fff;--accent:#2F80ED;
  --head:'Barlow Condensed','Rajdhani',sans-serif;--body:'Poppins',Inter,sans-serif;
  --r:4px;--wrap:1320px;
}
:where(html[data-page="hakkimizda"]), :where(html[data-page="hakkimizda"]) *{box-sizing:border-box;margin:0;padding:0}
html:where([data-page="hakkimizda"]){scroll-behavior:smooth}
:where(html[data-page="hakkimizda"]) body{font:400 16px/28px var(--body);color:var(--navy-900);background:var(--white)}
:where(html[data-page="hakkimizda"]) a{color:inherit;text-decoration:none}
:where(html[data-page="hakkimizda"]) .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:where(html[data-page="hakkimizda"]) h1, :where(html[data-page="hakkimizda"]) h2, :where(html[data-page="hakkimizda"]) h3, :where(html[data-page="hakkimizda"]) .num{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
:where(html[data-page="hakkimizda"]) h1{font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="hakkimizda"]) h2{font-size:clamp(30px,4vw,44px);line-height:1.1}
:where(html[data-page="hakkimizda"]) h3{font-size:24px;line-height:32px}
:where(html[data-page="hakkimizda"]) section{padding:96px 0}
:where(html[data-page="hakkimizda"]) :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* header */
:where(html[data-page="hakkimizda"]) .topbar{background:var(--navy-900);color:#a9bdd6;font-size:13px;line-height:20px;padding:6px 0}
:where(html[data-page="hakkimizda"]) .topbar .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
:where(html[data-page="hakkimizda"]) .lang a{margin-left:12px}
:where(html[data-page="hakkimizda"]) .lang a.on{color:var(--accent)}
:where(html[data-page="hakkimizda"]) header.main{background:var(--navy-700);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08)}
:where(html[data-page="hakkimizda"]) header.main .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
:where(html[data-page="hakkimizda"]) .logo{font-family:var(--head);font-size:26px;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
:where(html[data-page="hakkimizda"]) .logo span{color:var(--accent)}
:where(html[data-page="hakkimizda"]) nav ul{display:flex;gap:28px;list-style:none}
:where(html[data-page="hakkimizda"]) nav a{color:#dbe4ec;font-size:14px;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .18s,color .18s}
:where(html[data-page="hakkimizda"]) nav a:hover{color:#fff;border-color:var(--accent)}
:where(html[data-page="hakkimizda"]) .btn{display:inline-block;font:600 14px/1 var(--body);padding:14px 24px;border-radius:var(--r);border:1px solid var(--accent);background:var(--accent);color:#fff;transition:background .18s,color .18s;cursor:pointer}
:where(html[data-page="hakkimizda"]) .btn:hover{background:#1f6bd4}
:where(html[data-page="hakkimizda"]) .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
:where(html[data-page="hakkimizda"]) .btn.ghost:hover{border-color:#fff;background:transparent}
:where(html[data-page="hakkimizda"]) .menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:8px 12px;font:500 14px var(--body)}
/* hero carousel */
:where(html[data-page="hakkimizda"]) .hero{position:relative;background:var(--navy-900);color:#fff;overflow:hidden}
:where(html[data-page="hakkimizda"]) .hero-slide{position:relative;padding:120px 0 128px;background:var(--navy-900);overflow:hidden}
:where(html[data-page="hakkimizda"]) .hero-slide .bg{position:absolute;inset:0;background-image:var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="hakkimizda"]) .hero-slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,27,54,.9) 0%,rgba(6,27,54,.62) 55%,rgba(6,27,54,.3) 100%)}
:where(html[data-page="hakkimizda"]) .hero-slide::after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 78% 40%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="hakkimizda"]) .hero-slide .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
:where(html[data-page="hakkimizda"]) .h1{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="hakkimizda"]) .hero-slide p.lead{color:#b7c4d0;max-width:560px;margin:24px 0 36px}
:where(html[data-page="hakkimizda"]) .hero-slide .cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="hakkimizda"]) .hero-carousel .owl-dots{position:absolute;bottom:36px;left:max(24px,calc((100% - var(--wrap))/2 + 24px));z-index:3;display:flex;gap:8px}
:where(html[data-page="hakkimizda"]) .hero-carousel .owl-dot{background:none;border:0;padding:8px 0;cursor:pointer}
:where(html[data-page="hakkimizda"]) .hero-carousel .owl-dot span{display:block;width:36px;height:3px;background:rgba(255,255,255,.35);transition:background .2s}
:where(html[data-page="hakkimizda"]) .hero-carousel .owl-dot.active span{background:var(--accent)}
:where(html[data-page="hakkimizda"]) .layers{border-left:2px solid var(--accent);padding-left:24px;font-size:14px;line-height:24px;color:#b7c4d0}
:where(html[data-page="hakkimizda"]) .layers b{display:block;font:600 13px/20px var(--body);color:#fff;margin-bottom:4px}
:where(html[data-page="hakkimizda"]) .layers div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="hakkimizda"]) .layers div:last-child{border:0}
/* stats */
:where(html[data-page="hakkimizda"]) .stats{background:var(--navy-700);color:#fff;padding:0}
:where(html[data-page="hakkimizda"]) .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
:where(html[data-page="hakkimizda"]) .stat{padding:32px 24px;border-right:1px solid rgba(255,255,255,.1)}
:where(html[data-page="hakkimizda"]) .stat:last-child{border:0}
:where(html[data-page="hakkimizda"]) .stat .num{font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
:where(html[data-page="hakkimizda"]) .stat small{display:block;color:#9fb0c0;font-size:13px;margin-top:6px}
/* shared */
:where(html[data-page="hakkimizda"]) .sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
:where(html[data-page="hakkimizda"]) .sec-head p{color:var(--steel-500);max-width:480px}
:where(html[data-page="hakkimizda"]) .paper{background:var(--paper)}
/* categories */
:where(html[data-page="hakkimizda"]) .cats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="hakkimizda"]) .cat{position:relative;min-height:240px;border-radius:var(--r);background:var(--navy-700);color:#fff;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--navy-700)}
:where(html[data-page="hakkimizda"]) .cat::before{content:"";position:absolute;inset:0;opacity:.1;background:repeating-radial-gradient(circle at 85% 15%,transparent 0 22px,#fff 22px 23px)}
:where(html[data-page="hakkimizda"]) .cat::after{content:"";position:absolute;left:28px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="hakkimizda"]) .cat:hover::after{width:calc(100% - 56px)}
:where(html[data-page="hakkimizda"]) .cat > *{position:relative}
:where(html[data-page="hakkimizda"]) .cat span{color:#9fb0c0;font-size:13px}
:where(html[data-page="hakkimizda"]) .cat.alt{background:var(--navy-900)}
/* products */
:where(html[data-page="hakkimizda"]) .prods{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="hakkimizda"]) .card{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="hakkimizda"]) .thumb{aspect-ratio:4/3;background:var(--navy-700);position:relative;display:flex;align-items:center;justify-content:center;color:#7f93a6;font-size:12px;border-bottom:1px solid var(--steel-200);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px}
:where(html[data-page="hakkimizda"]) .card .body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
:where(html[data-page="hakkimizda"]) .brand{font-size:12px;color:var(--steel-500);display:flex;justify-content:space-between}
:where(html[data-page="hakkimizda"]) .badge{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:0 8px;font-size:11px;line-height:20px;color:var(--navy-700)}
:where(html[data-page="hakkimizda"]) .card p{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="hakkimizda"]) .specs{display:flex;gap:24px;margin:8px 0;padding:12px 0;border-top:1px solid var(--steel-200);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="hakkimizda"]) .specs div{font-size:12px;line-height:16px;color:var(--steel-500)}
:where(html[data-page="hakkimizda"]) .specs .num{display:block;font-size:26px;line-height:30px;color:var(--navy-700);font-variant-numeric:tabular-nums}
:where(html[data-page="hakkimizda"]) .more{margin-top:auto;font-weight:600;font-size:14px;border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="hakkimizda"]) .card:hover .more{border-color:var(--accent)}
/* brands */
:where(html[data-page="hakkimizda"]) .brand-carousel .item{display:block;border:1px solid var(--steel-200);border-radius:var(--r);padding:28px 12px;text-align:center;font:700 20px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--steel-500);transition:color .18s,border-color .18s;background:var(--white)}
:where(html[data-page="hakkimizda"]) .brand-carousel .item small{display:block;font:400 12px/18px var(--body);letter-spacing:0;text-transform:none;margin-top:4px}
:where(html[data-page="hakkimizda"]) .brand-carousel .item:hover{color:var(--navy-700);border-color:var(--accent)}
/* kataloglar */
:where(html[data-page="hakkimizda"]) .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="hakkimizda"]) .chip{font:500 14px/1 var(--body);padding:10px 18px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="hakkimizda"]) .chip:hover{border-color:var(--accent)}
:where(html[data-page="hakkimizda"]) .chip[aria-pressed=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="hakkimizda"]) .catalogs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
:where(html[data-page="hakkimizda"]) .cat-doc{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="hakkimizda"]) .cat-doc[hidden]{display:none}
:where(html[data-page="hakkimizda"]) .cover{aspect-ratio:3/4;background:var(--navy-700);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="hakkimizda"]) .cover::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-radial-gradient(circle at 90% 8%,transparent 0 20px,#fff 20px 21px)}
:where(html[data-page="hakkimizda"]) .cover>*{position:relative}
:where(html[data-page="hakkimizda"]) .cover b{font:700 28px/1.05 var(--head);text-transform:uppercase;letter-spacing:.04em}
:where(html[data-page="hakkimizda"]) .cover span{font-size:12px;color:#a9bdd6}
:where(html[data-page="hakkimizda"]) .pdf-tag{align-self:flex-start;background:var(--accent);color:#fff;font:600 11px/20px var(--body);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="hakkimizda"]) .cat-doc .body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
:where(html[data-page="hakkimizda"]) .cat-doc h3{font-size:20px;line-height:26px}
:where(html[data-page="hakkimizda"]) .cat-doc p{font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="hakkimizda"]) .dl{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--navy-700);border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="hakkimizda"]) .cat-doc:hover .dl{border-color:var(--accent)}
/* haber görseli */
:where(html[data-page="hakkimizda"]) .news img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--steel-200);border-radius:var(--r) var(--r) 0 0}
/* cta band */
:where(html[data-page="hakkimizda"]) .band{background:var(--navy-900);color:#fff;padding:72px 0}
:where(html[data-page="hakkimizda"]) .band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
:where(html[data-page="hakkimizda"]) .band p{color:#9fb0c0;margin-top:8px}
/* footer */
:where(html[data-page="hakkimizda"]) footer{background:var(--navy-900);color:#9fb0c0;font-size:14px;line-height:24px;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}
:where(html[data-page="hakkimizda"]) .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
:where(html[data-page="hakkimizda"]) footer h4{font:600 14px var(--body);color:#fff;margin-bottom:12px}
:where(html[data-page="hakkimizda"]) footer li{list-style:none}
:where(html[data-page="hakkimizda"]) footer a:hover{color:#fff}
:where(html[data-page="hakkimizda"]) .legal{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:12px;line-height:20px}
/* hızlı katalog menüsü */
:where(html[data-page="hakkimizda"]) .qc{position:fixed;left:24px;bottom:24px;z-index:40}
:where(html[data-page="hakkimizda"]) .qc-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(6,27,54,.35);transition:background .18s}
:where(html[data-page="hakkimizda"]) .qc-btn:hover, :where(html[data-page="hakkimizda"]) .qc-btn[aria-expanded=true]{background:var(--navy-700)}
:where(html[data-page="hakkimizda"]) .qc-panel{position:absolute;left:0;bottom:68px;width:340px;max-width:calc(100vw - 48px);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);box-shadow:0 12px 32px rgba(6,27,54,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}
:where(html[data-page="hakkimizda"]) .qc.open .qc-panel{opacity:1;visibility:visible;transform:none}
:where(html[data-page="hakkimizda"]) .qc-head{padding:14px 18px;background:var(--navy-700);color:#fff;font:700 18px/24px var(--head);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--r) var(--r) 0 0}
:where(html[data-page="hakkimizda"]) .qc-list{list-style:none;max-height:min(55vh,360px);overflow:auto}
:where(html[data-page="hakkimizda"]) .qc-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px;transition:background .15s}
:where(html[data-page="hakkimizda"]) .qc-list a:hover{background:var(--paper)}
:where(html[data-page="hakkimizda"]) .qc-list small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="hakkimizda"]) .qc-list .pdf{flex:none;font:600 11px/20px var(--body);color:#fff;background:var(--accent);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="hakkimizda"]) .qc-all{display:block;padding:12px 18px;font:600 14px var(--body);color:var(--navy-700)}
:where(html[data-page="hakkimizda"]) .qc-all:hover{background:var(--paper)}
/* mobile sticky */
:where(html[data-page="hakkimizda"]) .sticky-cta{display:none}
@media (max-width:1024px){:where(html[data-page="hakkimizda"]) .hero-slide .wrap{grid-template-columns:1fr}
:where(html[data-page="hakkimizda"]) .cats, :where(html[data-page="hakkimizda"]) .prods{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="hakkimizda"]) .catalogs{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="hakkimizda"]) .fgrid{grid-template-columns:repeat(2,1fr)}

}
@media (max-width:760px){:where(html[data-page="hakkimizda"]) section{padding:56px 0}
:where(html[data-page="hakkimizda"]) .hero-slide{padding:72px 0 88px}
:where(html[data-page="hakkimizda"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:16px 24px 24px}
:where(html[data-page="hakkimizda"]) nav.open{display:block}
:where(html[data-page="hakkimizda"]) nav ul{flex-direction:column;gap:4px}
:where(html[data-page="hakkimizda"]) .menu-btn{display:block}
:where(html[data-page="hakkimizda"]) header.main .btn{display:none}
:where(html[data-page="hakkimizda"]) .cats, :where(html[data-page="hakkimizda"]) .prods, :where(html[data-page="hakkimizda"]) .fgrid{grid-template-columns:1fr}
:where(html[data-page="hakkimizda"]) .catalogs{grid-template-columns:repeat(2,1fr);gap:16px}
:where(html[data-page="hakkimizda"]) .stats .wrap{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="hakkimizda"]) .stat:nth-child(2){border-right:0}
:where(html[data-page="hakkimizda"]) .stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="hakkimizda"]) .sticky-cta{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--navy-900);padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
:where(html[data-page="hakkimizda"]) .sticky-cta .btn{display:block;text-align:center;width:100%}
:where(html[data-page="hakkimizda"]) body{padding-bottom:68px}
:where(html[data-page="hakkimizda"]) .qc{left:16px;bottom:84px}

}
@media (prefers-reduced-motion:reduce){:where(html[data-page="hakkimizda"]), :where(html[data-page="hakkimizda"]) *{transition:none!important;scroll-behavior:auto!important}}
:where(html[data-page="hakkimizda"]) nav a[aria-current=page]{color:#fff;border-color:var(--accent)}
:where(html[data-page="hakkimizda"]) .page-hero{position:relative;background:var(--navy-900);color:#fff;padding:72px 0 64px;overflow:hidden}
:where(html[data-page="hakkimizda"]) .page-hero::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;background:repeating-radial-gradient(circle at 85% 30%,transparent 0 38px,#fff 38px 39px),linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="hakkimizda"]) .page-hero .wrap{position:relative;z-index:1}
:where(html[data-page="hakkimizda"]) .page-hero p{color:#b7c4d0;max-width:600px;margin-top:16px}
:where(html[data-page="hakkimizda"]) .crumb{font-size:13px;line-height:20px;color:#a9bdd6;margin-bottom:20px}
:where(html[data-page="hakkimizda"]) .crumb a:hover{color:#fff}
:where(html[data-page="hakkimizda"]) .crumb span{margin:0 8px}
:where(html[data-page="hakkimizda"]) .toolbar{margin-bottom:32px}
:where(html[data-page="hakkimizda"]) .toolbar .chips{margin:0}
:where(html[data-page="hakkimizda"]) .prods.news .feature{grid-column:1/-1;flex-direction:row}
:where(html[data-page="hakkimizda"]) .prods.news .feature>a{flex:0 0 58%;display:block}
:where(html[data-page="hakkimizda"]) .prods.news .feature img{height:100%;border-radius:var(--r) 0 0 var(--r);border-bottom:0;border-right:1px solid var(--steel-200)}
:where(html[data-page="hakkimizda"]) .prods.news .feature .body{justify-content:center;padding:32px}
:where(html[data-page="hakkimizda"]) .prods.news .feature h3{font-size:34px;line-height:40px}
:where(html[data-page="hakkimizda"]) .prods.news .card[hidden]{display:none}
:where(html[data-page="hakkimizda"]) .prods.news .card h3 a:hover{color:var(--navy-700)}
:where(html[data-page="hakkimizda"]) .art{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
:where(html[data-page="hakkimizda"]) .art-img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);border:1px solid var(--steel-200);margin:28px 0 32px}
:where(html[data-page="hakkimizda"]) .art-meta{display:flex;gap:12px;align-items:center;font-size:13px;color:#a9bdd6;margin-bottom:16px}
:where(html[data-page="hakkimizda"]) .art-meta .badge{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
:where(html[data-page="hakkimizda"]) .art-body{max-width:720px}
:where(html[data-page="hakkimizda"]) .art-body h2{font-size:30px;margin:36px 0 12px;color:var(--navy-700)}
:where(html[data-page="hakkimizda"]) .art-body p{margin-bottom:16px}
:where(html[data-page="hakkimizda"]) .art-body ul{margin:0 0 16px 20px}
:where(html[data-page="hakkimizda"]) .art-body li{margin-bottom:4px}
:where(html[data-page="hakkimizda"]) .art-body .note{font-size:13px;line-height:20px;color:var(--steel-500);border-left:3px solid var(--accent);padding-left:12px;margin-top:28px}
:where(html[data-page="hakkimizda"]) .side{position:sticky;top:96px;display:flex;flex-direction:column;gap:32px}
:where(html[data-page="hakkimizda"]) .side h3{font-size:22px;margin-bottom:12px}
:where(html[data-page="hakkimizda"]) .recent a{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px}
:where(html[data-page="hakkimizda"]) .recent img{flex:none;width:96px;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r)}
:where(html[data-page="hakkimizda"]) .recent small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="hakkimizda"]) .recent a:hover b{color:var(--navy-700)}
:where(html[data-page="hakkimizda"]) .side-cta{background:var(--navy-700);color:#fff;padding:24px;border-radius:var(--r)}
:where(html[data-page="hakkimizda"]) .side-cta p{font-size:14px;line-height:22px;color:#b7c4d0;margin:8px 0 16px}
@media (max-width:1024px){:where(html[data-page="hakkimizda"]) .art{grid-template-columns:1fr}
:where(html[data-page="hakkimizda"]) .side{position:static}
:where(html[data-page="hakkimizda"]) .prods.news .feature{flex-direction:column}
:where(html[data-page="hakkimizda"]) .prods.news .feature>a{flex:none}
:where(html[data-page="hakkimizda"]) .prods.news .feature img{border-radius:var(--r) var(--r) 0 0;border-right:0;border-bottom:1px solid var(--steel-200)}}
:where(html[data-page="hakkimizda"]) .logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}
:where(html[data-page="hakkimizda"]) .logo-card{position:relative;display:flex;align-items:center;justify-content:center;height:200px;background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);padding:32px;transition:border-color .18s}
:where(html[data-page="hakkimizda"]) .logo-card::after{content:"";position:absolute;left:24px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="hakkimizda"]) .logo-card:hover{border-color:var(--accent)}
:where(html[data-page="hakkimizda"]) .logo-card:hover::after{width:calc(100% - 48px)}
:where(html[data-page="hakkimizda"]) .logo-card img{max-width:72%;max-height:84px;object-fit:contain}
:where(html[data-page="hakkimizda"]) .logo-card .wm{font:700 30px/1.1 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--navy-700);text-align:center}
:where(html[data-page="hakkimizda"]) .logo-card .badge{position:absolute;top:12px;left:12px}
:where(html[data-page="hakkimizda"]) .logo-card .ctry{position:absolute;bottom:12px;right:16px;font-size:12px;color:var(--steel-500)}
:where(html[data-page="hakkimizda"]) .about{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
:where(html[data-page="hakkimizda"]) .about p{color:var(--steel-500);margin-top:16px}
:where(html[data-page="hakkimizda"]) .flow{display:flex;flex-direction:column;gap:0}
:where(html[data-page="hakkimizda"]) .flow>div{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:20px 24px}
:where(html[data-page="hakkimizda"]) .flow>div b{display:block;font:700 22px/28px var(--head);text-transform:uppercase;letter-spacing:.04em;color:var(--navy-700)}
:where(html[data-page="hakkimizda"]) .flow>div span{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="hakkimizda"]) .flow>div.mid{background:var(--navy-700);border-color:var(--navy-700)}
:where(html[data-page="hakkimizda"]) .flow>div.mid b{color:#fff}
:where(html[data-page="hakkimizda"]) .flow>div.mid span{color:#b7c4d0}
:where(html[data-page="hakkimizda"]) .flow i{display:block;text-align:center;font-style:normal;color:var(--accent);font-size:20px;line-height:28px}
:where(html[data-page="hakkimizda"]) .caps{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
:where(html[data-page="hakkimizda"]) .caps div{border-top:2px solid var(--navy-700);padding-top:20px}
:where(html[data-page="hakkimizda"]) .caps p{font-size:14px;line-height:22px;color:var(--steel-500);margin-top:8px}
:where(html[data-page="hakkimizda"]) .steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:s}
:where(html[data-page="hakkimizda"]) .steps li{counter-increment:s;background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);padding:24px}
:where(html[data-page="hakkimizda"]) .steps li::before{content:counter(s);display:block;font:700 40px/1 var(--head);color:var(--accent);margin-bottom:12px}
:where(html[data-page="hakkimizda"]) .steps p{font-size:14px;line-height:22px;color:var(--steel-500);margin-top:6px}
:where(html[data-page="hakkimizda"]) .custom{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
:where(html[data-page="hakkimizda"]) .custom p{color:var(--steel-500);margin-top:16px}
:where(html[data-page="hakkimizda"]) .needs{list-style:none;border-top:1px solid var(--steel-200)}
:where(html[data-page="hakkimizda"]) .needs li{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--steel-200);font-size:15px;line-height:24px}
:where(html[data-page="hakkimizda"]) .needs li span{color:var(--steel-500);text-align:right}
:where(html[data-page="hakkimizda"]) .legal-box{background:var(--navy-700);color:#fff;border-radius:var(--r);padding:32px 36px;max-width:900px}
:where(html[data-page="hakkimizda"]) .legal-box h3{margin-bottom:8px}
:where(html[data-page="hakkimizda"]) .legal-box p{color:#b7c4d0;font-size:15px}
@media (max-width:1024px){:where(html[data-page="hakkimizda"]) .about, :where(html[data-page="hakkimizda"]) .custom{grid-template-columns:1fr}
:where(html[data-page="hakkimizda"]) .caps, :where(html[data-page="hakkimizda"]) .steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){:where(html[data-page="hakkimizda"]) .caps, :where(html[data-page="hakkimizda"]) .steps{grid-template-columns:1fr}
:where(html[data-page="hakkimizda"]) .needs li{flex-direction:column;gap:2px}
:where(html[data-page="hakkimizda"]) .needs li span{text-align:left}}
:where(html[data-page="hakkimizda"]) .page-hero .bg{position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(6,27,54,.92),rgba(6,27,54,.5)),var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="hakkimizda"]) .world{background:var(--navy-900);color:#fff;overflow:hidden}
:where(html[data-page="hakkimizda"]) .world .top{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap;margin-bottom:24px}
:where(html[data-page="hakkimizda"]) .world .top p{color:#a9bdd6;max-width:480px}
:where(html[data-page="hakkimizda"]) .mapsvg{display:block;width:100%;height:auto}
:where(html[data-page="hakkimizda"]) .mapsvg text{paint-order:stroke;stroke:#061b36;stroke-width:4px}
:where(html[data-page="hakkimizda"]) .pulse{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:no-preference){:where(html[data-page="hakkimizda"]) .pulse{animation:pulse 2.6s ease-out infinite}}
@keyframes pulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(3.2);opacity:0}}
:where(html[data-page="hakkimizda"]) .legend{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
:where(html[data-page="hakkimizda"]) .legend span{font-size:13px;color:#cfe0f5;border:1px solid rgba(255,255,255,.22);padding:6px 14px;border-radius:var(--r)}
:where(html[data-page="hakkimizda"]) .legend i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:8px}
:where(html[data-page="hakkimizda"]) .caps svg{display:block;width:32px;height:32px;stroke:var(--accent);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-bottom:12px}
:where(html[data-page="hakkimizda"]) .strip{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="hakkimizda"]) .strip figure img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r);border:1px solid var(--steel-200)}
:where(html[data-page="hakkimizda"]) .strip figcaption{padding-top:12px;font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="hakkimizda"]) .strip figcaption b{display:block;font:700 22px/28px var(--head);text-transform:uppercase;letter-spacing:.04em;color:var(--navy-700)}
@media (max-width:760px){:where(html[data-page="hakkimizda"]) .strip{grid-template-columns:1fr}
:where(html[data-page="hakkimizda"]) .mapsvg text{display:none}}




/* iletisim.html */
:root:where([data-page="iletisim"]){
  --navy-900:#061B36;--navy-700:#0B3A75;--steel-500:#5A6B80;--steel-200:#D5DFEB;
  --paper:#F1F5FA;--white:#fff;--accent:#2F80ED;
  --head:'Barlow Condensed','Rajdhani',sans-serif;--body:'Poppins',Inter,sans-serif;
  --r:4px;--wrap:1320px;
}
:where(html[data-page="iletisim"]), :where(html[data-page="iletisim"]) *{box-sizing:border-box;margin:0;padding:0}
html:where([data-page="iletisim"]){scroll-behavior:smooth}
:where(html[data-page="iletisim"]) body{font:400 16px/28px var(--body);color:var(--navy-900);background:var(--white)}
:where(html[data-page="iletisim"]) a{color:inherit;text-decoration:none}
:where(html[data-page="iletisim"]) .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:where(html[data-page="iletisim"]) h1, :where(html[data-page="iletisim"]) h2, :where(html[data-page="iletisim"]) h3, :where(html[data-page="iletisim"]) .num{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
:where(html[data-page="iletisim"]) h1{font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="iletisim"]) h2{font-size:clamp(30px,4vw,44px);line-height:1.1}
:where(html[data-page="iletisim"]) h3{font-size:24px;line-height:32px}
:where(html[data-page="iletisim"]) section{padding:96px 0}
:where(html[data-page="iletisim"]) :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* header */
:where(html[data-page="iletisim"]) .topbar{background:var(--navy-900);color:#a9bdd6;font-size:13px;line-height:20px;padding:6px 0}
:where(html[data-page="iletisim"]) .topbar .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
:where(html[data-page="iletisim"]) .lang a{margin-left:12px}
:where(html[data-page="iletisim"]) .lang a.on{color:var(--accent)}
:where(html[data-page="iletisim"]) header.main{background:var(--navy-700);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08)}
:where(html[data-page="iletisim"]) header.main .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
:where(html[data-page="iletisim"]) .logo{font-family:var(--head);font-size:26px;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
:where(html[data-page="iletisim"]) .logo span{color:var(--accent)}
:where(html[data-page="iletisim"]) nav ul{display:flex;gap:28px;list-style:none}
:where(html[data-page="iletisim"]) nav a{color:#dbe4ec;font-size:14px;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .18s,color .18s}
:where(html[data-page="iletisim"]) nav a:hover{color:#fff;border-color:var(--accent)}
:where(html[data-page="iletisim"]) .btn{display:inline-block;font:600 14px/1 var(--body);padding:14px 24px;border-radius:var(--r);border:1px solid var(--accent);background:var(--accent);color:#fff;transition:background .18s,color .18s;cursor:pointer}
:where(html[data-page="iletisim"]) .btn:hover{background:#1f6bd4}
:where(html[data-page="iletisim"]) .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
:where(html[data-page="iletisim"]) .btn.ghost:hover{border-color:#fff;background:transparent}
:where(html[data-page="iletisim"]) .menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:8px 12px;font:500 14px var(--body)}
/* hero carousel */
:where(html[data-page="iletisim"]) .hero{position:relative;background:var(--navy-900);color:#fff;overflow:hidden}
:where(html[data-page="iletisim"]) .hero-slide{position:relative;padding:120px 0 128px;background:var(--navy-900);overflow:hidden}
:where(html[data-page="iletisim"]) .hero-slide .bg{position:absolute;inset:0;background-image:var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="iletisim"]) .hero-slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,27,54,.9) 0%,rgba(6,27,54,.62) 55%,rgba(6,27,54,.3) 100%)}
:where(html[data-page="iletisim"]) .hero-slide::after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 78% 40%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="iletisim"]) .hero-slide .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
:where(html[data-page="iletisim"]) .h1{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="iletisim"]) .hero-slide p.lead{color:#b7c4d0;max-width:560px;margin:24px 0 36px}
:where(html[data-page="iletisim"]) .hero-slide .cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="iletisim"]) .hero-carousel .owl-dots{position:absolute;bottom:36px;left:max(24px,calc((100% - var(--wrap))/2 + 24px));z-index:3;display:flex;gap:8px}
:where(html[data-page="iletisim"]) .hero-carousel .owl-dot{background:none;border:0;padding:8px 0;cursor:pointer}
:where(html[data-page="iletisim"]) .hero-carousel .owl-dot span{display:block;width:36px;height:3px;background:rgba(255,255,255,.35);transition:background .2s}
:where(html[data-page="iletisim"]) .hero-carousel .owl-dot.active span{background:var(--accent)}
:where(html[data-page="iletisim"]) .layers{border-left:2px solid var(--accent);padding-left:24px;font-size:14px;line-height:24px;color:#b7c4d0}
:where(html[data-page="iletisim"]) .layers b{display:block;font:600 13px/20px var(--body);color:#fff;margin-bottom:4px}
:where(html[data-page="iletisim"]) .layers div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="iletisim"]) .layers div:last-child{border:0}
/* stats */
:where(html[data-page="iletisim"]) .stats{background:var(--navy-700);color:#fff;padding:0}
:where(html[data-page="iletisim"]) .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
:where(html[data-page="iletisim"]) .stat{padding:32px 24px;border-right:1px solid rgba(255,255,255,.1)}
:where(html[data-page="iletisim"]) .stat:last-child{border:0}
:where(html[data-page="iletisim"]) .stat .num{font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
:where(html[data-page="iletisim"]) .stat small{display:block;color:#9fb0c0;font-size:13px;margin-top:6px}
/* shared */
:where(html[data-page="iletisim"]) .sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
:where(html[data-page="iletisim"]) .sec-head p{color:var(--steel-500);max-width:480px}
:where(html[data-page="iletisim"]) .paper{background:var(--paper)}
/* categories */
:where(html[data-page="iletisim"]) .cats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="iletisim"]) .cat{position:relative;min-height:240px;border-radius:var(--r);background:var(--navy-700);color:#fff;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--navy-700)}
:where(html[data-page="iletisim"]) .cat::before{content:"";position:absolute;inset:0;opacity:.1;background:repeating-radial-gradient(circle at 85% 15%,transparent 0 22px,#fff 22px 23px)}
:where(html[data-page="iletisim"]) .cat::after{content:"";position:absolute;left:28px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="iletisim"]) .cat:hover::after{width:calc(100% - 56px)}
:where(html[data-page="iletisim"]) .cat > *{position:relative}
:where(html[data-page="iletisim"]) .cat span{color:#9fb0c0;font-size:13px}
:where(html[data-page="iletisim"]) .cat.alt{background:var(--navy-900)}
/* products */
:where(html[data-page="iletisim"]) .prods{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="iletisim"]) .card{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="iletisim"]) .thumb{aspect-ratio:4/3;background:var(--navy-700);position:relative;display:flex;align-items:center;justify-content:center;color:#7f93a6;font-size:12px;border-bottom:1px solid var(--steel-200);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px}
:where(html[data-page="iletisim"]) .card .body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
:where(html[data-page="iletisim"]) .brand{font-size:12px;color:var(--steel-500);display:flex;justify-content:space-between}
:where(html[data-page="iletisim"]) .badge{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:0 8px;font-size:11px;line-height:20px;color:var(--navy-700)}
:where(html[data-page="iletisim"]) .card p{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="iletisim"]) .specs{display:flex;gap:24px;margin:8px 0;padding:12px 0;border-top:1px solid var(--steel-200);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="iletisim"]) .specs div{font-size:12px;line-height:16px;color:var(--steel-500)}
:where(html[data-page="iletisim"]) .specs .num{display:block;font-size:26px;line-height:30px;color:var(--navy-700);font-variant-numeric:tabular-nums}
:where(html[data-page="iletisim"]) .more{margin-top:auto;font-weight:600;font-size:14px;border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="iletisim"]) .card:hover .more{border-color:var(--accent)}
/* brands */
:where(html[data-page="iletisim"]) .brand-carousel .item{display:block;border:1px solid var(--steel-200);border-radius:var(--r);padding:28px 12px;text-align:center;font:700 20px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--steel-500);transition:color .18s,border-color .18s;background:var(--white)}
:where(html[data-page="iletisim"]) .brand-carousel .item small{display:block;font:400 12px/18px var(--body);letter-spacing:0;text-transform:none;margin-top:4px}
:where(html[data-page="iletisim"]) .brand-carousel .item:hover{color:var(--navy-700);border-color:var(--accent)}
/* kataloglar */
:where(html[data-page="iletisim"]) .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="iletisim"]) .chip{font:500 14px/1 var(--body);padding:10px 18px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="iletisim"]) .chip:hover{border-color:var(--accent)}
:where(html[data-page="iletisim"]) .chip[aria-pressed=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="iletisim"]) .catalogs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
:where(html[data-page="iletisim"]) .cat-doc{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="iletisim"]) .cat-doc[hidden]{display:none}
:where(html[data-page="iletisim"]) .cover{aspect-ratio:3/4;background:var(--navy-700);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="iletisim"]) .cover::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-radial-gradient(circle at 90% 8%,transparent 0 20px,#fff 20px 21px)}
:where(html[data-page="iletisim"]) .cover>*{position:relative}
:where(html[data-page="iletisim"]) .cover b{font:700 28px/1.05 var(--head);text-transform:uppercase;letter-spacing:.04em}
:where(html[data-page="iletisim"]) .cover span{font-size:12px;color:#a9bdd6}
:where(html[data-page="iletisim"]) .pdf-tag{align-self:flex-start;background:var(--accent);color:#fff;font:600 11px/20px var(--body);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="iletisim"]) .cat-doc .body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
:where(html[data-page="iletisim"]) .cat-doc h3{font-size:20px;line-height:26px}
:where(html[data-page="iletisim"]) .cat-doc p{font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="iletisim"]) .dl{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--navy-700);border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="iletisim"]) .cat-doc:hover .dl{border-color:var(--accent)}
/* haber görseli */
:where(html[data-page="iletisim"]) .news img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--steel-200);border-radius:var(--r) var(--r) 0 0}
/* cta band */
:where(html[data-page="iletisim"]) .band{background:var(--navy-900);color:#fff;padding:72px 0}
:where(html[data-page="iletisim"]) .band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
:where(html[data-page="iletisim"]) .band p{color:#9fb0c0;margin-top:8px}
/* footer */
:where(html[data-page="iletisim"]) footer{background:var(--navy-900);color:#9fb0c0;font-size:14px;line-height:24px;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}
:where(html[data-page="iletisim"]) .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
:where(html[data-page="iletisim"]) footer h4{font:600 14px var(--body);color:#fff;margin-bottom:12px}
:where(html[data-page="iletisim"]) footer li{list-style:none}
:where(html[data-page="iletisim"]) footer a:hover{color:#fff}
:where(html[data-page="iletisim"]) .legal{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:12px;line-height:20px}
/* hızlı katalog menüsü */
:where(html[data-page="iletisim"]) .qc{position:fixed;left:24px;bottom:24px;z-index:40}
:where(html[data-page="iletisim"]) .qc-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(6,27,54,.35);transition:background .18s}
:where(html[data-page="iletisim"]) .qc-btn:hover, :where(html[data-page="iletisim"]) .qc-btn[aria-expanded=true]{background:var(--navy-700)}
:where(html[data-page="iletisim"]) .qc-panel{position:absolute;left:0;bottom:68px;width:340px;max-width:calc(100vw - 48px);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);box-shadow:0 12px 32px rgba(6,27,54,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}
:where(html[data-page="iletisim"]) .qc.open .qc-panel{opacity:1;visibility:visible;transform:none}
:where(html[data-page="iletisim"]) .qc-head{padding:14px 18px;background:var(--navy-700);color:#fff;font:700 18px/24px var(--head);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--r) var(--r) 0 0}
:where(html[data-page="iletisim"]) .qc-list{list-style:none;max-height:min(55vh,360px);overflow:auto}
:where(html[data-page="iletisim"]) .qc-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px;transition:background .15s}
:where(html[data-page="iletisim"]) .qc-list a:hover{background:var(--paper)}
:where(html[data-page="iletisim"]) .qc-list small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="iletisim"]) .qc-list .pdf{flex:none;font:600 11px/20px var(--body);color:#fff;background:var(--accent);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="iletisim"]) .qc-all{display:block;padding:12px 18px;font:600 14px var(--body);color:var(--navy-700)}
:where(html[data-page="iletisim"]) .qc-all:hover{background:var(--paper)}
/* mobile sticky */
:where(html[data-page="iletisim"]) .sticky-cta{display:none}
@media (max-width:1024px){:where(html[data-page="iletisim"]) .hero-slide .wrap{grid-template-columns:1fr}
:where(html[data-page="iletisim"]) .cats, :where(html[data-page="iletisim"]) .prods{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="iletisim"]) .catalogs{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="iletisim"]) .fgrid{grid-template-columns:repeat(2,1fr)}

}
@media (max-width:760px){:where(html[data-page="iletisim"]) section{padding:56px 0}
:where(html[data-page="iletisim"]) .hero-slide{padding:72px 0 88px}
:where(html[data-page="iletisim"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:16px 24px 24px}
:where(html[data-page="iletisim"]) nav.open{display:block}
:where(html[data-page="iletisim"]) nav ul{flex-direction:column;gap:4px}
:where(html[data-page="iletisim"]) .menu-btn{display:block}
:where(html[data-page="iletisim"]) header.main .btn{display:none}
:where(html[data-page="iletisim"]) .cats, :where(html[data-page="iletisim"]) .prods, :where(html[data-page="iletisim"]) .fgrid{grid-template-columns:1fr}
:where(html[data-page="iletisim"]) .catalogs{grid-template-columns:repeat(2,1fr);gap:16px}
:where(html[data-page="iletisim"]) .stats .wrap{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="iletisim"]) .stat:nth-child(2){border-right:0}
:where(html[data-page="iletisim"]) .stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="iletisim"]) .sticky-cta{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--navy-900);padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
:where(html[data-page="iletisim"]) .sticky-cta .btn{display:block;text-align:center;width:100%}
:where(html[data-page="iletisim"]) body{padding-bottom:68px}
:where(html[data-page="iletisim"]) .qc{left:16px;bottom:84px}

}
@media (prefers-reduced-motion:reduce){:where(html[data-page="iletisim"]), :where(html[data-page="iletisim"]) *{transition:none!important;scroll-behavior:auto!important}}
:where(html[data-page="iletisim"]) nav a[aria-current=page]{color:#fff;border-color:var(--accent)}
:where(html[data-page="iletisim"]) .page-hero{position:relative;background:var(--navy-900);color:#fff;padding:72px 0 64px;overflow:hidden}
:where(html[data-page="iletisim"]) .page-hero::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 85% 30%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="iletisim"]) .page-hero .wrap{position:relative;z-index:1}
:where(html[data-page="iletisim"]) .page-hero p{color:#b7c4d0;max-width:600px;margin-top:16px}
:where(html[data-page="iletisim"]) .crumb{font-size:13px;line-height:20px;color:#a9bdd6;margin-bottom:20px}
:where(html[data-page="iletisim"]) .crumb a:hover{color:#fff}
:where(html[data-page="iletisim"]) .crumb span{margin:0 8px}
:where(html[data-page="iletisim"]) .toolbar{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="iletisim"]) .toolbar .chips{margin:0}
:where(html[data-page="iletisim"]) .search{font:400 14px/1 var(--body);padding:12px 16px;border:1px solid var(--steel-200);border-radius:var(--r);min-width:260px;background:var(--white);color:var(--navy-900)}
:where(html[data-page="iletisim"]) .search:focus{border-color:var(--accent)}
:where(html[data-page="iletisim"]) .count{font-size:13px;color:var(--steel-500);margin-bottom:16px}
:where(html[data-page="iletisim"]) .empty{padding:48px 0;color:var(--steel-500)}
:where(html[data-page="iletisim"]) .tags{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 8px}
/* ürünler sayfası */
:where(html[data-page="iletisim"]) nav a[aria-current]{color:#fff;border-color:var(--accent)}
:where(html[data-page="iletisim"]) .sol{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding:72px 0;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="iletisim"]) .sol:last-of-type{border:0}
:where(html[data-page="iletisim"]) .sol.flip .sol-img{order:2}
:where(html[data-page="iletisim"]) .sol-img img{width:100%;display:block;border-radius:var(--r);border:1px solid var(--steel-200);background:var(--paper)}
:where(html[data-page="iletisim"]) .sol-img.tall img{max-height:520px;object-fit:cover}
:where(html[data-page="iletisim"]) .sol h2{margin-bottom:16px}
:where(html[data-page="iletisim"]) .sol p{color:var(--steel-500);margin-bottom:20px}
:where(html[data-page="iletisim"]) .chain{display:flex;flex-wrap:wrap;gap:0;margin:8px 0 24px;border:1px solid var(--steel-200);border-radius:var(--r);overflow:hidden}
:where(html[data-page="iletisim"]) .chain li{flex:1 1 90px;list-style:none;padding:12px 10px;text-align:center;font:600 13px/18px var(--body);color:var(--navy-700);background:var(--white);border-right:1px solid var(--steel-200)}
:where(html[data-page="iletisim"]) .chain li:last-child{border:0;background:var(--navy-700);color:#fff}
:where(html[data-page="iletisim"]) .pts{list-style:none;margin-bottom:28px}
:where(html[data-page="iletisim"]) .pts li{padding:10px 0 10px 20px;border-bottom:1px solid var(--steel-200);font-size:15px;line-height:24px;position:relative}
:where(html[data-page="iletisim"]) .pts li::before{content:"";position:absolute;left:0;top:19px;width:8px;height:2px;background:var(--accent)}
:where(html[data-page="iletisim"]) .pts b{font-weight:600}
:where(html[data-page="iletisim"]) .tabs-note{color:var(--steel-500);font-size:14px;margin-bottom:24px}
:where(html[data-page="iletisim"]) .thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:12px}
:where(html[data-page="iletisim"]) .thumb.cover img{object-fit:cover;padding:0}
:where(html[data-page="iletisim"]) .thumb{background:var(--paper);background-image:none}
:where(html[data-page="iletisim"]) .card[hidden]{display:none}
:where(html[data-page="iletisim"]) .card details{border-top:1px solid var(--steel-200);margin-top:4px;padding-top:12px}
:where(html[data-page="iletisim"]) .card summary{cursor:pointer;font:600 14px/20px var(--body);color:var(--navy-700)}
:where(html[data-page="iletisim"]) .card dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin-top:12px;font-size:13px;line-height:20px}
:where(html[data-page="iletisim"]) .card dt{color:var(--steel-500)}
:where(html[data-page="iletisim"]) .card dd{color:var(--navy-900);text-align:right}
:where(html[data-page="iletisim"]) .acts{display:flex;gap:16px;align-items:center;margin-top:auto;padding-top:8px;flex-wrap:wrap}
:where(html[data-page="iletisim"]) .acts .more{margin:0}
:where(html[data-page="iletisim"]) .acts .dl{font-size:13px;color:var(--steel-500);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="iletisim"]) .acts .dl:hover{color:var(--navy-700)}
:where(html[data-page="iletisim"]) .cta-band{background:var(--navy-900);color:#fff;padding:56px 0}
:where(html[data-page="iletisim"]) .cta-band .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
:where(html[data-page="iletisim"]) .cta-band p{color:#b7c4d0;max-width:560px;margin-top:8px}
@media (max-width:900px){:where(html[data-page="iletisim"]) .sol{grid-template-columns:1fr;gap:28px;padding:48px 0}
:where(html[data-page="iletisim"]) .sol.flip .sol-img{order:0}}
:where(html[data-page="iletisim"]) a.thumb{display:block}
:where(html[data-page="iletisim"]) .card h3 a:hover{color:var(--accent)}
:where(html[data-page="iletisim"]) .sol h2 a:hover{color:var(--navy-700)}
:where(html[data-page="iletisim"]) .btn.ghost-d{background:transparent;color:var(--navy-700);border-color:var(--steel-200)}
:where(html[data-page="iletisim"]) .btn.ghost-d:hover{border-color:var(--navy-700);background:transparent}
/* kart eşitleme */
:where(html[data-page="iletisim"]) .prods{align-items:stretch}
:where(html[data-page="iletisim"]) a.thumb, :where(html[data-page="iletisim"]) .thumb{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;flex:none;width:100%;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="iletisim"]) .card{height:100%}
:where(html[data-page="iletisim"]) .card .body{flex:1}
:where(html[data-page="iletisim"]) .card details{margin-top:auto}
:where(html[data-page="iletisim"]) .acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;padding:0}
:where(html[data-page="iletisim"]) .abtn{display:flex;align-items:center;justify-content:center;height:44px;padding:0 12px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);font:600 14px/1 var(--body);text-align:center;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="iletisim"]) .abtn:hover{border-color:var(--navy-700)}
:where(html[data-page="iletisim"]) .abtn.main{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="iletisim"]) .abtn.main:hover{background:var(--accent);border-color:var(--accent)}
:where(html[data-page="iletisim"]) .ct{display:grid;grid-template-columns:1.4fr .8fr;gap:56px;align-items:start}
:where(html[data-page="iletisim"]) .form{display:grid;grid-template-columns:1fr 1fr;gap:20px}
:where(html[data-page="iletisim"]) .form .full{grid-column:1/-1}
:where(html[data-page="iletisim"]) .form label{display:block;font:500 14px/20px var(--body);margin-bottom:6px}
:where(html[data-page="iletisim"]) .form label i{color:var(--accent);font-style:normal}
:where(html[data-page="iletisim"]) .form input, :where(html[data-page="iletisim"]) .form select, :where(html[data-page="iletisim"]) .form textarea{width:100%;font:400 15px/24px var(--body);color:var(--navy-900);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);padding:12px 14px;transition:border-color .18s}
:where(html[data-page="iletisim"]) .form textarea{min-height:150px;resize:vertical}
:where(html[data-page="iletisim"]) .form input:hover, :where(html[data-page="iletisim"]) .form select:hover, :where(html[data-page="iletisim"]) .form textarea:hover{border-color:var(--steel-500)}
:where(html[data-page="iletisim"]) .form input:focus, :where(html[data-page="iletisim"]) .form select:focus, :where(html[data-page="iletisim"]) .form textarea:focus{outline:2px solid var(--accent);outline-offset:0;border-color:var(--accent)}
:where(html[data-page="iletisim"]) .form .hint{font-size:12px;line-height:18px;color:var(--steel-500);margin-top:6px}
:where(html[data-page="iletisim"]) .chk{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="iletisim"]) .chk input{width:18px;height:18px;margin-top:3px;flex:none}
:where(html[data-page="iletisim"]) .hp{position:absolute;left:-9999px}
:where(html[data-page="iletisim"]) .send{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
:where(html[data-page="iletisim"]) .send .btn{padding:16px 32px;font-size:15px}
:where(html[data-page="iletisim"]) .send .btn[disabled]{opacity:.6;cursor:wait}
:where(html[data-page="iletisim"]) .msg{padding:14px 16px;border-radius:var(--r);font-size:14px;line-height:22px;border:1px solid}
:where(html[data-page="iletisim"]) .msg.ok{background:#EAF6EE;border-color:#9FD3AE;color:#14532D}
:where(html[data-page="iletisim"]) .msg.err{background:#FDEDED;border-color:#F0A8A8;color:#7F1D1D}
:where(html[data-page="iletisim"]) .msg[hidden]{display:none}
:where(html[data-page="iletisim"]) .info{background:var(--navy-900);color:#fff;border-radius:var(--r);padding:32px;position:sticky;top:96px}
:where(html[data-page="iletisim"]) .info h2{font-size:28px;margin-bottom:20px}
:where(html[data-page="iletisim"]) .info dl{display:grid;gap:18px}
:where(html[data-page="iletisim"]) .info dt{font:600 13px/20px var(--body);color:#9fb0c0}
:where(html[data-page="iletisim"]) .info dd{font-size:15px;line-height:24px}
:where(html[data-page="iletisim"]) .info a:hover{color:var(--accent)}
:where(html[data-page="iletisim"]) .info .note{margin-top:24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);font-size:13px;line-height:20px;color:#9fb0c0}
:where(html[data-page="iletisim"]) .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:0}
:where(html[data-page="iletisim"]) .steps div{border-left:2px solid var(--accent);padding:4px 0 4px 20px}
:where(html[data-page="iletisim"]) .steps b{display:block;font:600 15px/24px var(--body);margin-bottom:4px}
:where(html[data-page="iletisim"]) .steps span{font-size:14px;line-height:22px;color:var(--steel-500)}
@media (max-width:900px){:where(html[data-page="iletisim"]) .ct{grid-template-columns:1fr;gap:32px}
:where(html[data-page="iletisim"]) .info{position:static}
:where(html[data-page="iletisim"]) .steps{grid-template-columns:1fr}}
@media (max-width:600px){:where(html[data-page="iletisim"]) .form{grid-template-columns:1fr}}




/* index.html */
:root:where([data-page="index"]){
  --navy-900:#061B36;--navy-700:#0B3A75;--steel-500:#5A6B80;--steel-200:#D5DFEB;
  --paper:#F1F5FA;--white:#fff;--accent:#2F80ED;
  --head:'Barlow Condensed','Rajdhani',sans-serif;--body:'Poppins',Inter,sans-serif;
  --r:4px;--wrap:1320px;
}
:where(html[data-page="index"]), :where(html[data-page="index"]) *{box-sizing:border-box;margin:0;padding:0}
html:where([data-page="index"]){scroll-behavior:smooth}
:where(html[data-page="index"]) body{font:400 16px/28px var(--body);color:var(--navy-900);background:var(--white)}
:where(html[data-page="index"]) a{color:inherit;text-decoration:none}
:where(html[data-page="index"]) .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:where(html[data-page="index"]) h1, :where(html[data-page="index"]) h2, :where(html[data-page="index"]) h3, :where(html[data-page="index"]) .num{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
:where(html[data-page="index"]) h1{font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="index"]) h2{font-size:clamp(30px,4vw,44px);line-height:1.1}
:where(html[data-page="index"]) h3{font-size:24px;line-height:32px}
:where(html[data-page="index"]) section{padding:96px 0}
:where(html[data-page="index"]) :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* header */
:where(html[data-page="index"]) .topbar{background:var(--navy-900);color:#a9bdd6;font-size:13px;line-height:20px;padding:6px 0}
:where(html[data-page="index"]) .topbar .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
:where(html[data-page="index"]) .lang a{margin-left:12px}
:where(html[data-page="index"]) .lang a.on{color:var(--accent)}
:where(html[data-page="index"]) header.main{background:var(--navy-700);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08)}
:where(html[data-page="index"]) header.main .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
:where(html[data-page="index"]) .logo{font-family:var(--head);font-size:26px;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
:where(html[data-page="index"]) .logo span{color:var(--accent)}
:where(html[data-page="index"]) nav ul{display:flex;gap:28px;list-style:none}
:where(html[data-page="index"]) nav a{color:#dbe4ec;font-size:14px;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .18s,color .18s}
:where(html[data-page="index"]) nav a:hover{color:#fff;border-color:var(--accent)}
:where(html[data-page="index"]) .btn{display:inline-block;font:600 14px/1 var(--body);padding:14px 24px;border-radius:var(--r);border:1px solid var(--accent);background:var(--accent);color:#fff;transition:background .18s,color .18s;cursor:pointer}
:where(html[data-page="index"]) .btn:hover{background:#1f6bd4}
:where(html[data-page="index"]) .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
:where(html[data-page="index"]) .btn.ghost:hover{border-color:#fff;background:transparent}
:where(html[data-page="index"]) .menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:8px 12px;font:500 14px var(--body)}
/* hero carousel */
:where(html[data-page="index"]) .hero{position:relative;background:var(--navy-900);color:#fff;overflow:hidden;padding:0}
:where(html[data-page="index"]) .hero-slide{position:relative;padding:120px 0 128px;background:var(--navy-900);overflow:hidden}
:where(html[data-page="index"]) .hero-slide .bg{position:absolute;inset:0;background-image:var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="index"]) .hero-slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,27,54,.9) 0%,rgba(6,27,54,.62) 55%,rgba(6,27,54,.3) 100%)}
:where(html[data-page="index"]) .hero-slide::after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 78% 40%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="index"]) .hero-slide .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
:where(html[data-page="index"]) .h1{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="index"]) .hero-slide p.lead{color:#b7c4d0;max-width:560px;margin:24px 0 36px}
:where(html[data-page="index"]) .hero-slide .cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="index"]) .hero-carousel .owl-dots{position:absolute;bottom:36px;left:max(24px,calc((100% - var(--wrap))/2 + 24px));z-index:3;display:flex;gap:8px}
:where(html[data-page="index"]) .hero-carousel .owl-dot{background:none;border:0;padding:8px 0;cursor:pointer}
:where(html[data-page="index"]) .hero-carousel .owl-dot span{display:block;width:36px;height:3px;background:rgba(255,255,255,.35);transition:background .2s}
:where(html[data-page="index"]) .hero-carousel .owl-dot.active span{background:var(--accent)}
:where(html[data-page="index"]) .layers{border-left:2px solid var(--accent);padding-left:24px;font-size:14px;line-height:24px;color:#b7c4d0}
:where(html[data-page="index"]) .layers b{display:block;font:600 13px/20px var(--body);color:#fff;margin-bottom:4px}
:where(html[data-page="index"]) .layers div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="index"]) .layers div:last-child{border:0}
/* stats */
:where(html[data-page="index"]) .stats{background:var(--navy-700);color:#fff;padding:0}
:where(html[data-page="index"]) .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
:where(html[data-page="index"]) .stat{padding:32px 24px;border-right:1px solid rgba(255,255,255,.1)}
:where(html[data-page="index"]) .stat:last-child{border:0}
:where(html[data-page="index"]) .stat .num{font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
:where(html[data-page="index"]) .stat small{display:block;color:#9fb0c0;font-size:13px;margin-top:6px}
/* shared */
:where(html[data-page="index"]) .sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
:where(html[data-page="index"]) .sec-head p{color:var(--steel-500);max-width:480px}
:where(html[data-page="index"]) .paper{background:var(--paper)}
/* categories */
:where(html[data-page="index"]) .cats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="index"]) .cat{position:relative;min-height:240px;border-radius:var(--r);background:var(--navy-700);color:#fff;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--navy-700)}
:where(html[data-page="index"]) .cat::before{content:"";position:absolute;inset:0;opacity:.1;background:repeating-radial-gradient(circle at 85% 15%,transparent 0 22px,#fff 22px 23px)}
:where(html[data-page="index"]) .cat::after{content:"";position:absolute;left:28px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="index"]) .cat:hover::after{width:calc(100% - 56px)}
:where(html[data-page="index"]) .cat > *{position:relative}
:where(html[data-page="index"]) .cat span{color:#9fb0c0;font-size:13px}
:where(html[data-page="index"]) .cat.alt{background:var(--navy-900)}
/* products */
:where(html[data-page="index"]) .prods{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="index"]) .card{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="index"]) .thumb{aspect-ratio:4/3;background:var(--navy-700);position:relative;display:flex;align-items:center;justify-content:center;color:#7f93a6;font-size:12px;border-bottom:1px solid var(--steel-200);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px}
:where(html[data-page="index"]) .card .body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
:where(html[data-page="index"]) .brand{font-size:12px;color:var(--steel-500);display:flex;justify-content:space-between}
:where(html[data-page="index"]) .badge{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:0 8px;font-size:11px;line-height:20px;color:var(--navy-700)}
:where(html[data-page="index"]) .card p{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="index"]) .specs{display:flex;gap:24px;margin:8px 0;padding:12px 0;border-top:1px solid var(--steel-200);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="index"]) .specs div{font-size:12px;line-height:16px;color:var(--steel-500)}
:where(html[data-page="index"]) .specs .num{display:block;font-size:26px;line-height:30px;color:var(--navy-700);font-variant-numeric:tabular-nums}
:where(html[data-page="index"]) .more{margin-top:auto;font-weight:600;font-size:14px;border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="index"]) .card:hover .more{border-color:var(--accent)}
/* brands */
:where(html[data-page="index"]) .brand-carousel .item{display:block;border:1px solid var(--steel-200);border-radius:var(--r);padding:28px 12px;text-align:center;font:700 20px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--steel-500);transition:color .18s,border-color .18s;background:var(--white)}
:where(html[data-page="index"]) .brand-carousel .item small{display:block;font:400 12px/18px var(--body);letter-spacing:0;text-transform:none;margin-top:4px}
:where(html[data-page="index"]) .brand-carousel .item:hover{color:var(--navy-700);border-color:var(--accent)}
/* kataloglar */
:where(html[data-page="index"]) .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="index"]) .chip{font:500 14px/1 var(--body);padding:10px 18px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="index"]) .chip:hover{border-color:var(--accent)}
:where(html[data-page="index"]) .chip[aria-pressed=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="index"]) .catalogs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
:where(html[data-page="index"]) .cat-doc{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="index"]) .cat-doc[hidden]{display:none}
:where(html[data-page="index"]) .cover{aspect-ratio:3/4;background:var(--navy-700);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="index"]) .cover::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-radial-gradient(circle at 90% 8%,transparent 0 20px,#fff 20px 21px)}
:where(html[data-page="index"]) .cover>*{position:relative}
:where(html[data-page="index"]) .cover b{font:700 28px/1.05 var(--head);text-transform:uppercase;letter-spacing:.04em}
:where(html[data-page="index"]) .cover span{font-size:12px;color:#a9bdd6}
:where(html[data-page="index"]) .pdf-tag{align-self:flex-start;background:var(--accent);color:#fff;font:600 11px/20px var(--body);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="index"]) .cat-doc .body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
:where(html[data-page="index"]) .cat-doc h3{font-size:20px;line-height:26px}
:where(html[data-page="index"]) .cat-doc p{font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="index"]) .dl{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--navy-700);border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="index"]) .cat-doc:hover .dl{border-color:var(--accent)}
/* haber görseli */
:where(html[data-page="index"]) .news img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--steel-200);border-radius:var(--r) var(--r) 0 0}
/* cta band */
:where(html[data-page="index"]) .band{background:var(--navy-900);color:#fff;padding:72px 0}
:where(html[data-page="index"]) .band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
:where(html[data-page="index"]) .band p{color:#9fb0c0;margin-top:8px}
/* footer */
:where(html[data-page="index"]) footer{background:var(--navy-900);color:#9fb0c0;font-size:14px;line-height:24px;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}
:where(html[data-page="index"]) .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
:where(html[data-page="index"]) footer h4{font:600 14px var(--body);color:#fff;margin-bottom:12px}
:where(html[data-page="index"]) footer li{list-style:none}
:where(html[data-page="index"]) footer a:hover{color:#fff}
:where(html[data-page="index"]) .legal{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:12px;line-height:20px}
/* hızlı katalog menüsü */
:where(html[data-page="index"]) .qc{position:fixed;left:24px;bottom:24px;z-index:40}
:where(html[data-page="index"]) .qc-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(6,27,54,.35);transition:background .18s}
:where(html[data-page="index"]) .qc-btn:hover, :where(html[data-page="index"]) .qc-btn[aria-expanded=true]{background:var(--navy-700)}
:where(html[data-page="index"]) .qc-panel{position:absolute;left:0;bottom:68px;width:340px;max-width:calc(100vw - 48px);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);box-shadow:0 12px 32px rgba(6,27,54,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}
:where(html[data-page="index"]) .qc.open .qc-panel{opacity:1;visibility:visible;transform:none}
:where(html[data-page="index"]) .qc-head{padding:14px 18px;background:var(--navy-700);color:#fff;font:700 18px/24px var(--head);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--r) var(--r) 0 0}
:where(html[data-page="index"]) .qc-list{list-style:none;max-height:min(55vh,360px);overflow:auto}
:where(html[data-page="index"]) .qc-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px;transition:background .15s}
:where(html[data-page="index"]) .qc-list a:hover{background:var(--paper)}
:where(html[data-page="index"]) .qc-list small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="index"]) .qc-list .pdf{flex:none;font:600 11px/20px var(--body);color:#fff;background:var(--accent);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="index"]) .qc-all{display:block;padding:12px 18px;font:600 14px var(--body);color:var(--navy-700)}
:where(html[data-page="index"]) .qc-all:hover{background:var(--paper)}
/* mobile sticky */
:where(html[data-page="index"]) .sticky-cta{display:none}
@media (max-width:1024px){:where(html[data-page="index"]) .hero-slide .wrap{grid-template-columns:1fr}
:where(html[data-page="index"]) .cats, :where(html[data-page="index"]) .prods{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="index"]) .catalogs{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="index"]) .fgrid{grid-template-columns:repeat(2,1fr)}

}
@media (max-width:760px){:where(html[data-page="index"]) section{padding:56px 0}
:where(html[data-page="index"]) .hero-slide{padding:72px 0 88px}
:where(html[data-page="index"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:16px 24px 24px}
:where(html[data-page="index"]) nav.open{display:block}
:where(html[data-page="index"]) nav ul{flex-direction:column;gap:4px}
:where(html[data-page="index"]) .menu-btn{display:block}
:where(html[data-page="index"]) header.main .btn{display:none}
:where(html[data-page="index"]) .cats, :where(html[data-page="index"]) .prods, :where(html[data-page="index"]) .fgrid{grid-template-columns:1fr}
:where(html[data-page="index"]) .catalogs{grid-template-columns:repeat(2,1fr);gap:16px}
:where(html[data-page="index"]) .stats .wrap{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="index"]) .stat:nth-child(2){border-right:0}
:where(html[data-page="index"]) .stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="index"]) .sticky-cta{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--navy-900);padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
:where(html[data-page="index"]) .sticky-cta .btn{display:block;text-align:center;width:100%}
:where(html[data-page="index"]) body{padding-bottom:68px}
:where(html[data-page="index"]) .qc{left:16px;bottom:84px}

}
@media (prefers-reduced-motion:reduce){:where(html[data-page="index"]), :where(html[data-page="index"]) *{transition:none!important;scroll-behavior:auto!important}}
:where(html[data-page="index"]) .thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:12px}
:where(html[data-page="index"]) .thumb.cover img{object-fit:cover;padding:0}
:where(html[data-page="index"]) .card h3 a:hover{color:var(--accent)}
:where(html[data-page="index"]) .card[hidden]{display:none}
:where(html[data-page="index"]) .card details{border-top:1px solid var(--steel-200);padding-top:12px}
:where(html[data-page="index"]) .card summary{cursor:pointer;font:600 14px/20px var(--body);color:var(--navy-700)}
:where(html[data-page="index"]) .card dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin-top:12px;font-size:13px;line-height:20px}
:where(html[data-page="index"]) .card dt{color:var(--steel-500)}
:where(html[data-page="index"]) .card dd{color:var(--navy-900);text-align:right}
:where(html[data-page="index"]) .all-link{margin-top:40px;text-align:center}
:where(html[data-page="index"]) a.thumb, :where(html[data-page="index"]) .thumb{background:var(--paper);background-image:none;color:transparent}
/* kart eşitleme */
:where(html[data-page="index"]) .prods{align-items:stretch}
:where(html[data-page="index"]) a.thumb, :where(html[data-page="index"]) .thumb{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;flex:none;width:100%;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="index"]) .card{height:100%}
:where(html[data-page="index"]) .card .body{flex:1}
:where(html[data-page="index"]) .card details{margin-top:auto}
:where(html[data-page="index"]) .acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;padding:0}
:where(html[data-page="index"]) .abtn{display:flex;align-items:center;justify-content:center;height:44px;padding:0 12px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);font:600 14px/1 var(--body);text-align:center;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="index"]) .abtn:hover{border-color:var(--navy-700)}
:where(html[data-page="index"]) .abtn.main{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="index"]) .abtn.main:hover{background:var(--accent);border-color:var(--accent)}




/* kataloglar.html */
:root:where([data-page="kataloglar"]){
  --navy-900:#061B36;--navy-700:#0B3A75;--steel-500:#5A6B80;--steel-200:#D5DFEB;
  --paper:#F1F5FA;--white:#fff;--accent:#2F80ED;
  --head:'Barlow Condensed','Rajdhani',sans-serif;--body:'Poppins',Inter,sans-serif;
  --r:4px;--wrap:1320px;
}
:where(html[data-page="kataloglar"]), :where(html[data-page="kataloglar"]) *{box-sizing:border-box;margin:0;padding:0}
html:where([data-page="kataloglar"]){scroll-behavior:smooth}
:where(html[data-page="kataloglar"]) body{font:400 16px/28px var(--body);color:var(--navy-900);background:var(--white)}
:where(html[data-page="kataloglar"]) a{color:inherit;text-decoration:none}
:where(html[data-page="kataloglar"]) .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:where(html[data-page="kataloglar"]) h1, :where(html[data-page="kataloglar"]) h2, :where(html[data-page="kataloglar"]) h3, :where(html[data-page="kataloglar"]) .num{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
:where(html[data-page="kataloglar"]) h1{font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="kataloglar"]) h2{font-size:clamp(30px,4vw,44px);line-height:1.1}
:where(html[data-page="kataloglar"]) h3{font-size:24px;line-height:32px}
:where(html[data-page="kataloglar"]) section{padding:96px 0}
:where(html[data-page="kataloglar"]) :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* header */
:where(html[data-page="kataloglar"]) .topbar{background:var(--navy-900);color:#a9bdd6;font-size:13px;line-height:20px;padding:6px 0}
:where(html[data-page="kataloglar"]) .topbar .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
:where(html[data-page="kataloglar"]) .lang a{margin-left:12px}
:where(html[data-page="kataloglar"]) .lang a.on{color:var(--accent)}
:where(html[data-page="kataloglar"]) header.main{background:var(--navy-700);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08)}
:where(html[data-page="kataloglar"]) header.main .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
:where(html[data-page="kataloglar"]) .logo{font-family:var(--head);font-size:26px;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
:where(html[data-page="kataloglar"]) .logo span{color:var(--accent)}
:where(html[data-page="kataloglar"]) nav ul{display:flex;gap:28px;list-style:none}
:where(html[data-page="kataloglar"]) nav a{color:#dbe4ec;font-size:14px;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .18s,color .18s}
:where(html[data-page="kataloglar"]) nav a:hover{color:#fff;border-color:var(--accent)}
:where(html[data-page="kataloglar"]) .btn{display:inline-block;font:600 14px/1 var(--body);padding:14px 24px;border-radius:var(--r);border:1px solid var(--accent);background:var(--accent);color:#fff;transition:background .18s,color .18s;cursor:pointer}
:where(html[data-page="kataloglar"]) .btn:hover{background:#1f6bd4}
:where(html[data-page="kataloglar"]) .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
:where(html[data-page="kataloglar"]) .btn.ghost:hover{border-color:#fff;background:transparent}
:where(html[data-page="kataloglar"]) .menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:8px 12px;font:500 14px var(--body)}
/* hero carousel */
:where(html[data-page="kataloglar"]) .hero{position:relative;background:var(--navy-900);color:#fff;overflow:hidden}
:where(html[data-page="kataloglar"]) .hero-slide{position:relative;padding:120px 0 128px;background:var(--navy-900);overflow:hidden}
:where(html[data-page="kataloglar"]) .hero-slide .bg{position:absolute;inset:0;background-image:var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="kataloglar"]) .hero-slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,27,54,.9) 0%,rgba(6,27,54,.62) 55%,rgba(6,27,54,.3) 100%)}
:where(html[data-page="kataloglar"]) .hero-slide::after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 78% 40%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="kataloglar"]) .hero-slide .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
:where(html[data-page="kataloglar"]) .h1{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="kataloglar"]) .hero-slide p.lead{color:#b7c4d0;max-width:560px;margin:24px 0 36px}
:where(html[data-page="kataloglar"]) .hero-slide .cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="kataloglar"]) .hero-carousel .owl-dots{position:absolute;bottom:36px;left:max(24px,calc((100% - var(--wrap))/2 + 24px));z-index:3;display:flex;gap:8px}
:where(html[data-page="kataloglar"]) .hero-carousel .owl-dot{background:none;border:0;padding:8px 0;cursor:pointer}
:where(html[data-page="kataloglar"]) .hero-carousel .owl-dot span{display:block;width:36px;height:3px;background:rgba(255,255,255,.35);transition:background .2s}
:where(html[data-page="kataloglar"]) .hero-carousel .owl-dot.active span{background:var(--accent)}
:where(html[data-page="kataloglar"]) .layers{border-left:2px solid var(--accent);padding-left:24px;font-size:14px;line-height:24px;color:#b7c4d0}
:where(html[data-page="kataloglar"]) .layers b{display:block;font:600 13px/20px var(--body);color:#fff;margin-bottom:4px}
:where(html[data-page="kataloglar"]) .layers div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="kataloglar"]) .layers div:last-child{border:0}
/* stats */
:where(html[data-page="kataloglar"]) .stats{background:var(--navy-700);color:#fff;padding:0}
:where(html[data-page="kataloglar"]) .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
:where(html[data-page="kataloglar"]) .stat{padding:32px 24px;border-right:1px solid rgba(255,255,255,.1)}
:where(html[data-page="kataloglar"]) .stat:last-child{border:0}
:where(html[data-page="kataloglar"]) .stat .num{font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
:where(html[data-page="kataloglar"]) .stat small{display:block;color:#9fb0c0;font-size:13px;margin-top:6px}
/* shared */
:where(html[data-page="kataloglar"]) .sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
:where(html[data-page="kataloglar"]) .sec-head p{color:var(--steel-500);max-width:480px}
:where(html[data-page="kataloglar"]) .paper{background:var(--paper)}
/* categories */
:where(html[data-page="kataloglar"]) .cats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="kataloglar"]) .cat{position:relative;min-height:240px;border-radius:var(--r);background:var(--navy-700);color:#fff;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--navy-700)}
:where(html[data-page="kataloglar"]) .cat::before{content:"";position:absolute;inset:0;opacity:.1;background:repeating-radial-gradient(circle at 85% 15%,transparent 0 22px,#fff 22px 23px)}
:where(html[data-page="kataloglar"]) .cat::after{content:"";position:absolute;left:28px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="kataloglar"]) .cat:hover::after{width:calc(100% - 56px)}
:where(html[data-page="kataloglar"]) .cat > *{position:relative}
:where(html[data-page="kataloglar"]) .cat span{color:#9fb0c0;font-size:13px}
:where(html[data-page="kataloglar"]) .cat.alt{background:var(--navy-900)}
/* products */
:where(html[data-page="kataloglar"]) .prods{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="kataloglar"]) .card{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="kataloglar"]) .thumb{aspect-ratio:4/3;background:var(--navy-700);position:relative;display:flex;align-items:center;justify-content:center;color:#7f93a6;font-size:12px;border-bottom:1px solid var(--steel-200);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px}
:where(html[data-page="kataloglar"]) .card .body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
:where(html[data-page="kataloglar"]) .brand{font-size:12px;color:var(--steel-500);display:flex;justify-content:space-between}
:where(html[data-page="kataloglar"]) .badge{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:0 8px;font-size:11px;line-height:20px;color:var(--navy-700)}
:where(html[data-page="kataloglar"]) .card p{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="kataloglar"]) .specs{display:flex;gap:24px;margin:8px 0;padding:12px 0;border-top:1px solid var(--steel-200);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="kataloglar"]) .specs div{font-size:12px;line-height:16px;color:var(--steel-500)}
:where(html[data-page="kataloglar"]) .specs .num{display:block;font-size:26px;line-height:30px;color:var(--navy-700);font-variant-numeric:tabular-nums}
:where(html[data-page="kataloglar"]) .more{margin-top:auto;font-weight:600;font-size:14px;border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="kataloglar"]) .card:hover .more{border-color:var(--accent)}
/* brands */
:where(html[data-page="kataloglar"]) .brand-carousel .item{display:block;border:1px solid var(--steel-200);border-radius:var(--r);padding:28px 12px;text-align:center;font:700 20px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--steel-500);transition:color .18s,border-color .18s;background:var(--white)}
:where(html[data-page="kataloglar"]) .brand-carousel .item small{display:block;font:400 12px/18px var(--body);letter-spacing:0;text-transform:none;margin-top:4px}
:where(html[data-page="kataloglar"]) .brand-carousel .item:hover{color:var(--navy-700);border-color:var(--accent)}
/* kataloglar */
:where(html[data-page="kataloglar"]) .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="kataloglar"]) .chip{font:500 14px/1 var(--body);padding:10px 18px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="kataloglar"]) .chip:hover{border-color:var(--accent)}
:where(html[data-page="kataloglar"]) .chip[aria-pressed=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="kataloglar"]) .catalogs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
:where(html[data-page="kataloglar"]) .cat-doc{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="kataloglar"]) .cat-doc[hidden]{display:none}
:where(html[data-page="kataloglar"]) .cover{aspect-ratio:3/4;background:var(--navy-700);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="kataloglar"]) .cover::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-radial-gradient(circle at 90% 8%,transparent 0 20px,#fff 20px 21px)}
:where(html[data-page="kataloglar"]) .cover>*{position:relative}
:where(html[data-page="kataloglar"]) .cover b{font:700 28px/1.05 var(--head);text-transform:uppercase;letter-spacing:.04em}
:where(html[data-page="kataloglar"]) .cover span{font-size:12px;color:#a9bdd6}
:where(html[data-page="kataloglar"]) .pdf-tag{align-self:flex-start;background:var(--accent);color:#fff;font:600 11px/20px var(--body);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="kataloglar"]) .cat-doc .body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
:where(html[data-page="kataloglar"]) .cat-doc h3{font-size:20px;line-height:26px}
:where(html[data-page="kataloglar"]) .cat-doc p{font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="kataloglar"]) .dl{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--navy-700);border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="kataloglar"]) .cat-doc:hover .dl{border-color:var(--accent)}
/* haber görseli */
:where(html[data-page="kataloglar"]) .news img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--steel-200);border-radius:var(--r) var(--r) 0 0}
/* cta band */
:where(html[data-page="kataloglar"]) .band{background:var(--navy-900);color:#fff;padding:72px 0}
:where(html[data-page="kataloglar"]) .band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
:where(html[data-page="kataloglar"]) .band p{color:#9fb0c0;margin-top:8px}
/* footer */
:where(html[data-page="kataloglar"]) footer{background:var(--navy-900);color:#9fb0c0;font-size:14px;line-height:24px;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}
:where(html[data-page="kataloglar"]) .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
:where(html[data-page="kataloglar"]) footer h4{font:600 14px var(--body);color:#fff;margin-bottom:12px}
:where(html[data-page="kataloglar"]) footer li{list-style:none}
:where(html[data-page="kataloglar"]) footer a:hover{color:#fff}
:where(html[data-page="kataloglar"]) .legal{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:12px;line-height:20px}
/* hızlı katalog menüsü */
:where(html[data-page="kataloglar"]) .qc{position:fixed;left:24px;bottom:24px;z-index:40}
:where(html[data-page="kataloglar"]) .qc-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(6,27,54,.35);transition:background .18s}
:where(html[data-page="kataloglar"]) .qc-btn:hover, :where(html[data-page="kataloglar"]) .qc-btn[aria-expanded=true]{background:var(--navy-700)}
:where(html[data-page="kataloglar"]) .qc-panel{position:absolute;left:0;bottom:68px;width:340px;max-width:calc(100vw - 48px);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);box-shadow:0 12px 32px rgba(6,27,54,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}
:where(html[data-page="kataloglar"]) .qc.open .qc-panel{opacity:1;visibility:visible;transform:none}
:where(html[data-page="kataloglar"]) .qc-head{padding:14px 18px;background:var(--navy-700);color:#fff;font:700 18px/24px var(--head);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--r) var(--r) 0 0}
:where(html[data-page="kataloglar"]) .qc-list{list-style:none;max-height:min(55vh,360px);overflow:auto}
:where(html[data-page="kataloglar"]) .qc-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px;transition:background .15s}
:where(html[data-page="kataloglar"]) .qc-list a:hover{background:var(--paper)}
:where(html[data-page="kataloglar"]) .qc-list small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="kataloglar"]) .qc-list .pdf{flex:none;font:600 11px/20px var(--body);color:#fff;background:var(--accent);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="kataloglar"]) .qc-all{display:block;padding:12px 18px;font:600 14px var(--body);color:var(--navy-700)}
:where(html[data-page="kataloglar"]) .qc-all:hover{background:var(--paper)}
/* mobile sticky */
:where(html[data-page="kataloglar"]) .sticky-cta{display:none}
@media (max-width:1024px){:where(html[data-page="kataloglar"]) .hero-slide .wrap{grid-template-columns:1fr}
:where(html[data-page="kataloglar"]) .cats, :where(html[data-page="kataloglar"]) .prods{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="kataloglar"]) .catalogs{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="kataloglar"]) .fgrid{grid-template-columns:repeat(2,1fr)}

}
@media (max-width:760px){:where(html[data-page="kataloglar"]) section{padding:56px 0}
:where(html[data-page="kataloglar"]) .hero-slide{padding:72px 0 88px}
:where(html[data-page="kataloglar"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:16px 24px 24px}
:where(html[data-page="kataloglar"]) nav.open{display:block}
:where(html[data-page="kataloglar"]) nav ul{flex-direction:column;gap:4px}
:where(html[data-page="kataloglar"]) .menu-btn{display:block}
:where(html[data-page="kataloglar"]) header.main .btn{display:none}
:where(html[data-page="kataloglar"]) .cats, :where(html[data-page="kataloglar"]) .prods, :where(html[data-page="kataloglar"]) .fgrid{grid-template-columns:1fr}
:where(html[data-page="kataloglar"]) .catalogs{grid-template-columns:repeat(2,1fr);gap:16px}
:where(html[data-page="kataloglar"]) .stats .wrap{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="kataloglar"]) .stat:nth-child(2){border-right:0}
:where(html[data-page="kataloglar"]) .stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="kataloglar"]) .sticky-cta{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--navy-900);padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
:where(html[data-page="kataloglar"]) .sticky-cta .btn{display:block;text-align:center;width:100%}
:where(html[data-page="kataloglar"]) body{padding-bottom:68px}
:where(html[data-page="kataloglar"]) .qc{left:16px;bottom:84px}

}
@media (prefers-reduced-motion:reduce){:where(html[data-page="kataloglar"]), :where(html[data-page="kataloglar"]) *{transition:none!important;scroll-behavior:auto!important}}
:where(html[data-page="kataloglar"]) nav a[aria-current=page]{color:#fff;border-color:var(--accent)}
:where(html[data-page="kataloglar"]) .page-hero{position:relative;background:var(--navy-900);color:#fff;padding:72px 0 64px;overflow:hidden}
:where(html[data-page="kataloglar"]) .page-hero::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 85% 30%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="kataloglar"]) .page-hero .wrap{position:relative;z-index:1}
:where(html[data-page="kataloglar"]) .page-hero p{color:#b7c4d0;max-width:600px;margin-top:16px}
:where(html[data-page="kataloglar"]) .crumb{font-size:13px;line-height:20px;color:#a9bdd6;margin-bottom:20px}
:where(html[data-page="kataloglar"]) .crumb a:hover{color:#fff}
:where(html[data-page="kataloglar"]) .crumb span{margin:0 8px}
:where(html[data-page="kataloglar"]) .toolbar{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="kataloglar"]) .toolbar .chips{margin:0}
:where(html[data-page="kataloglar"]) .search{font:400 14px/1 var(--body);padding:12px 16px;border:1px solid var(--steel-200);border-radius:var(--r);min-width:260px;background:var(--white);color:var(--navy-900)}
:where(html[data-page="kataloglar"]) .search:focus{border-color:var(--accent)}
:where(html[data-page="kataloglar"]) .count{font-size:13px;color:var(--steel-500);margin-bottom:16px}
:where(html[data-page="kataloglar"]) .empty{padding:48px 0;color:var(--steel-500)}
:where(html[data-page="kataloglar"]) .tags{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 8px}




/* markalar.html */
:root:where([data-page="markalar"]){
  --navy-900:#061B36;--navy-700:#0B3A75;--steel-500:#5A6B80;--steel-200:#D5DFEB;
  --paper:#F1F5FA;--white:#fff;--accent:#2F80ED;
  --head:'Barlow Condensed','Rajdhani',sans-serif;--body:'Poppins',Inter,sans-serif;
  --r:4px;--wrap:1320px;
}
:where(html[data-page="markalar"]), :where(html[data-page="markalar"]) *{box-sizing:border-box;margin:0;padding:0}
html:where([data-page="markalar"]){scroll-behavior:smooth}
:where(html[data-page="markalar"]) body{font:400 16px/28px var(--body);color:var(--navy-900);background:var(--white)}
:where(html[data-page="markalar"]) a{color:inherit;text-decoration:none}
:where(html[data-page="markalar"]) .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:where(html[data-page="markalar"]) h1, :where(html[data-page="markalar"]) h2, :where(html[data-page="markalar"]) h3, :where(html[data-page="markalar"]) .num{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
:where(html[data-page="markalar"]) h1{font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="markalar"]) h2{font-size:clamp(30px,4vw,44px);line-height:1.1}
:where(html[data-page="markalar"]) h3{font-size:24px;line-height:32px}
:where(html[data-page="markalar"]) section{padding:96px 0}
:where(html[data-page="markalar"]) :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* header */
:where(html[data-page="markalar"]) .topbar{background:var(--navy-900);color:#a9bdd6;font-size:13px;line-height:20px;padding:6px 0}
:where(html[data-page="markalar"]) .topbar .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
:where(html[data-page="markalar"]) .lang a{margin-left:12px}
:where(html[data-page="markalar"]) .lang a.on{color:var(--accent)}
:where(html[data-page="markalar"]) header.main{background:var(--navy-700);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08)}
:where(html[data-page="markalar"]) header.main .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
:where(html[data-page="markalar"]) .logo{font-family:var(--head);font-size:26px;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
:where(html[data-page="markalar"]) .logo span{color:var(--accent)}
:where(html[data-page="markalar"]) nav ul{display:flex;gap:28px;list-style:none}
:where(html[data-page="markalar"]) nav a{color:#dbe4ec;font-size:14px;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .18s,color .18s}
:where(html[data-page="markalar"]) nav a:hover{color:#fff;border-color:var(--accent)}
:where(html[data-page="markalar"]) .btn{display:inline-block;font:600 14px/1 var(--body);padding:14px 24px;border-radius:var(--r);border:1px solid var(--accent);background:var(--accent);color:#fff;transition:background .18s,color .18s;cursor:pointer}
:where(html[data-page="markalar"]) .btn:hover{background:#1f6bd4}
:where(html[data-page="markalar"]) .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
:where(html[data-page="markalar"]) .btn.ghost:hover{border-color:#fff;background:transparent}
:where(html[data-page="markalar"]) .menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:8px 12px;font:500 14px var(--body)}
/* hero carousel */
:where(html[data-page="markalar"]) .hero{position:relative;background:var(--navy-900);color:#fff;overflow:hidden}
:where(html[data-page="markalar"]) .hero-slide{position:relative;padding:120px 0 128px;background:var(--navy-900);overflow:hidden}
:where(html[data-page="markalar"]) .hero-slide .bg{position:absolute;inset:0;background-image:var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="markalar"]) .hero-slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,27,54,.9) 0%,rgba(6,27,54,.62) 55%,rgba(6,27,54,.3) 100%)}
:where(html[data-page="markalar"]) .hero-slide::after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 78% 40%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="markalar"]) .hero-slide .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
:where(html[data-page="markalar"]) .h1{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="markalar"]) .hero-slide p.lead{color:#b7c4d0;max-width:560px;margin:24px 0 36px}
:where(html[data-page="markalar"]) .hero-slide .cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="markalar"]) .hero-carousel .owl-dots{position:absolute;bottom:36px;left:max(24px,calc((100% - var(--wrap))/2 + 24px));z-index:3;display:flex;gap:8px}
:where(html[data-page="markalar"]) .hero-carousel .owl-dot{background:none;border:0;padding:8px 0;cursor:pointer}
:where(html[data-page="markalar"]) .hero-carousel .owl-dot span{display:block;width:36px;height:3px;background:rgba(255,255,255,.35);transition:background .2s}
:where(html[data-page="markalar"]) .hero-carousel .owl-dot.active span{background:var(--accent)}
:where(html[data-page="markalar"]) .layers{border-left:2px solid var(--accent);padding-left:24px;font-size:14px;line-height:24px;color:#b7c4d0}
:where(html[data-page="markalar"]) .layers b{display:block;font:600 13px/20px var(--body);color:#fff;margin-bottom:4px}
:where(html[data-page="markalar"]) .layers div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="markalar"]) .layers div:last-child{border:0}
/* stats */
:where(html[data-page="markalar"]) .stats{background:var(--navy-700);color:#fff;padding:0}
:where(html[data-page="markalar"]) .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
:where(html[data-page="markalar"]) .stat{padding:32px 24px;border-right:1px solid rgba(255,255,255,.1)}
:where(html[data-page="markalar"]) .stat:last-child{border:0}
:where(html[data-page="markalar"]) .stat .num{font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
:where(html[data-page="markalar"]) .stat small{display:block;color:#9fb0c0;font-size:13px;margin-top:6px}
/* shared */
:where(html[data-page="markalar"]) .sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
:where(html[data-page="markalar"]) .sec-head p{color:var(--steel-500);max-width:480px}
:where(html[data-page="markalar"]) .paper{background:var(--paper)}
/* categories */
:where(html[data-page="markalar"]) .cats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="markalar"]) .cat{position:relative;min-height:240px;border-radius:var(--r);background:var(--navy-700);color:#fff;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--navy-700)}
:where(html[data-page="markalar"]) .cat::before{content:"";position:absolute;inset:0;opacity:.1;background:repeating-radial-gradient(circle at 85% 15%,transparent 0 22px,#fff 22px 23px)}
:where(html[data-page="markalar"]) .cat::after{content:"";position:absolute;left:28px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="markalar"]) .cat:hover::after{width:calc(100% - 56px)}
:where(html[data-page="markalar"]) .cat > *{position:relative}
:where(html[data-page="markalar"]) .cat span{color:#9fb0c0;font-size:13px}
:where(html[data-page="markalar"]) .cat.alt{background:var(--navy-900)}
/* products */
:where(html[data-page="markalar"]) .prods{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="markalar"]) .card{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="markalar"]) .thumb{aspect-ratio:4/3;background:var(--navy-700);position:relative;display:flex;align-items:center;justify-content:center;color:#7f93a6;font-size:12px;border-bottom:1px solid var(--steel-200);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px}
:where(html[data-page="markalar"]) .card .body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
:where(html[data-page="markalar"]) .brand{font-size:12px;color:var(--steel-500);display:flex;justify-content:space-between}
:where(html[data-page="markalar"]) .badge{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:0 8px;font-size:11px;line-height:20px;color:var(--navy-700)}
:where(html[data-page="markalar"]) .card p{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="markalar"]) .specs{display:flex;gap:24px;margin:8px 0;padding:12px 0;border-top:1px solid var(--steel-200);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="markalar"]) .specs div{font-size:12px;line-height:16px;color:var(--steel-500)}
:where(html[data-page="markalar"]) .specs .num{display:block;font-size:26px;line-height:30px;color:var(--navy-700);font-variant-numeric:tabular-nums}
:where(html[data-page="markalar"]) .more{margin-top:auto;font-weight:600;font-size:14px;border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="markalar"]) .card:hover .more{border-color:var(--accent)}
/* brands */
:where(html[data-page="markalar"]) .brand-carousel .item{display:block;border:1px solid var(--steel-200);border-radius:var(--r);padding:28px 12px;text-align:center;font:700 20px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--steel-500);transition:color .18s,border-color .18s;background:var(--white)}
:where(html[data-page="markalar"]) .brand-carousel .item small{display:block;font:400 12px/18px var(--body);letter-spacing:0;text-transform:none;margin-top:4px}
:where(html[data-page="markalar"]) .brand-carousel .item:hover{color:var(--navy-700);border-color:var(--accent)}
/* kataloglar */
:where(html[data-page="markalar"]) .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="markalar"]) .chip{font:500 14px/1 var(--body);padding:10px 18px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="markalar"]) .chip:hover{border-color:var(--accent)}
:where(html[data-page="markalar"]) .chip[aria-pressed=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="markalar"]) .catalogs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
:where(html[data-page="markalar"]) .cat-doc{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="markalar"]) .cat-doc[hidden]{display:none}
:where(html[data-page="markalar"]) .cover{aspect-ratio:3/4;background:var(--navy-700);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="markalar"]) .cover::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-radial-gradient(circle at 90% 8%,transparent 0 20px,#fff 20px 21px)}
:where(html[data-page="markalar"]) .cover>*{position:relative}
:where(html[data-page="markalar"]) .cover b{font:700 28px/1.05 var(--head);text-transform:uppercase;letter-spacing:.04em}
:where(html[data-page="markalar"]) .cover span{font-size:12px;color:#a9bdd6}
:where(html[data-page="markalar"]) .pdf-tag{align-self:flex-start;background:var(--accent);color:#fff;font:600 11px/20px var(--body);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="markalar"]) .cat-doc .body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
:where(html[data-page="markalar"]) .cat-doc h3{font-size:20px;line-height:26px}
:where(html[data-page="markalar"]) .cat-doc p{font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="markalar"]) .dl{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--navy-700);border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="markalar"]) .cat-doc:hover .dl{border-color:var(--accent)}
/* haber görseli */
:where(html[data-page="markalar"]) .news img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--steel-200);border-radius:var(--r) var(--r) 0 0}
/* cta band */
:where(html[data-page="markalar"]) .band{background:var(--navy-900);color:#fff;padding:72px 0}
:where(html[data-page="markalar"]) .band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
:where(html[data-page="markalar"]) .band p{color:#9fb0c0;margin-top:8px}
/* footer */
:where(html[data-page="markalar"]) footer{background:var(--navy-900);color:#9fb0c0;font-size:14px;line-height:24px;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}
:where(html[data-page="markalar"]) .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
:where(html[data-page="markalar"]) footer h4{font:600 14px var(--body);color:#fff;margin-bottom:12px}
:where(html[data-page="markalar"]) footer li{list-style:none}
:where(html[data-page="markalar"]) footer a:hover{color:#fff}
:where(html[data-page="markalar"]) .legal{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:12px;line-height:20px}
/* hızlı katalog menüsü */
:where(html[data-page="markalar"]) .qc{position:fixed;left:24px;bottom:24px;z-index:40}
:where(html[data-page="markalar"]) .qc-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(6,27,54,.35);transition:background .18s}
:where(html[data-page="markalar"]) .qc-btn:hover, :where(html[data-page="markalar"]) .qc-btn[aria-expanded=true]{background:var(--navy-700)}
:where(html[data-page="markalar"]) .qc-panel{position:absolute;left:0;bottom:68px;width:340px;max-width:calc(100vw - 48px);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);box-shadow:0 12px 32px rgba(6,27,54,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}
:where(html[data-page="markalar"]) .qc.open .qc-panel{opacity:1;visibility:visible;transform:none}
:where(html[data-page="markalar"]) .qc-head{padding:14px 18px;background:var(--navy-700);color:#fff;font:700 18px/24px var(--head);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--r) var(--r) 0 0}
:where(html[data-page="markalar"]) .qc-list{list-style:none;max-height:min(55vh,360px);overflow:auto}
:where(html[data-page="markalar"]) .qc-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px;transition:background .15s}
:where(html[data-page="markalar"]) .qc-list a:hover{background:var(--paper)}
:where(html[data-page="markalar"]) .qc-list small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="markalar"]) .qc-list .pdf{flex:none;font:600 11px/20px var(--body);color:#fff;background:var(--accent);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="markalar"]) .qc-all{display:block;padding:12px 18px;font:600 14px var(--body);color:var(--navy-700)}
:where(html[data-page="markalar"]) .qc-all:hover{background:var(--paper)}
/* mobile sticky */
:where(html[data-page="markalar"]) .sticky-cta{display:none}
@media (max-width:1024px){:where(html[data-page="markalar"]) .hero-slide .wrap{grid-template-columns:1fr}
:where(html[data-page="markalar"]) .cats, :where(html[data-page="markalar"]) .prods{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="markalar"]) .catalogs{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="markalar"]) .fgrid{grid-template-columns:repeat(2,1fr)}

}
@media (max-width:760px){:where(html[data-page="markalar"]) section{padding:56px 0}
:where(html[data-page="markalar"]) .hero-slide{padding:72px 0 88px}
:where(html[data-page="markalar"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:16px 24px 24px}
:where(html[data-page="markalar"]) nav.open{display:block}
:where(html[data-page="markalar"]) nav ul{flex-direction:column;gap:4px}
:where(html[data-page="markalar"]) .menu-btn{display:block}
:where(html[data-page="markalar"]) header.main .btn{display:none}
:where(html[data-page="markalar"]) .cats, :where(html[data-page="markalar"]) .prods, :where(html[data-page="markalar"]) .fgrid{grid-template-columns:1fr}
:where(html[data-page="markalar"]) .catalogs{grid-template-columns:repeat(2,1fr);gap:16px}
:where(html[data-page="markalar"]) .stats .wrap{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="markalar"]) .stat:nth-child(2){border-right:0}
:where(html[data-page="markalar"]) .stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="markalar"]) .sticky-cta{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--navy-900);padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
:where(html[data-page="markalar"]) .sticky-cta .btn{display:block;text-align:center;width:100%}
:where(html[data-page="markalar"]) body{padding-bottom:68px}
:where(html[data-page="markalar"]) .qc{left:16px;bottom:84px}

}
@media (prefers-reduced-motion:reduce){:where(html[data-page="markalar"]), :where(html[data-page="markalar"]) *{transition:none!important;scroll-behavior:auto!important}}
:where(html[data-page="markalar"]) nav a[aria-current=page]{color:#fff;border-color:var(--accent)}
:where(html[data-page="markalar"]) .page-hero{position:relative;background:var(--navy-900);color:#fff;padding:72px 0 64px;overflow:hidden}
:where(html[data-page="markalar"]) .page-hero::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;background:repeating-radial-gradient(circle at 85% 30%,transparent 0 38px,#fff 38px 39px),linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="markalar"]) .page-hero .wrap{position:relative;z-index:1}
:where(html[data-page="markalar"]) .page-hero p{color:#b7c4d0;max-width:600px;margin-top:16px}
:where(html[data-page="markalar"]) .crumb{font-size:13px;line-height:20px;color:#a9bdd6;margin-bottom:20px}
:where(html[data-page="markalar"]) .crumb a:hover{color:#fff}
:where(html[data-page="markalar"]) .crumb span{margin:0 8px}
:where(html[data-page="markalar"]) .toolbar{margin-bottom:32px}
:where(html[data-page="markalar"]) .toolbar .chips{margin:0}
:where(html[data-page="markalar"]) .prods.news .feature{grid-column:1/-1;flex-direction:row}
:where(html[data-page="markalar"]) .prods.news .feature>a{flex:0 0 58%;display:block}
:where(html[data-page="markalar"]) .prods.news .feature img{height:100%;border-radius:var(--r) 0 0 var(--r);border-bottom:0;border-right:1px solid var(--steel-200)}
:where(html[data-page="markalar"]) .prods.news .feature .body{justify-content:center;padding:32px}
:where(html[data-page="markalar"]) .prods.news .feature h3{font-size:34px;line-height:40px}
:where(html[data-page="markalar"]) .prods.news .card[hidden]{display:none}
:where(html[data-page="markalar"]) .prods.news .card h3 a:hover{color:var(--navy-700)}
:where(html[data-page="markalar"]) .art{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
:where(html[data-page="markalar"]) .art-img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);border:1px solid var(--steel-200);margin:28px 0 32px}
:where(html[data-page="markalar"]) .art-meta{display:flex;gap:12px;align-items:center;font-size:13px;color:#a9bdd6;margin-bottom:16px}
:where(html[data-page="markalar"]) .art-meta .badge{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
:where(html[data-page="markalar"]) .art-body{max-width:720px}
:where(html[data-page="markalar"]) .art-body h2{font-size:30px;margin:36px 0 12px;color:var(--navy-700)}
:where(html[data-page="markalar"]) .art-body p{margin-bottom:16px}
:where(html[data-page="markalar"]) .art-body ul{margin:0 0 16px 20px}
:where(html[data-page="markalar"]) .art-body li{margin-bottom:4px}
:where(html[data-page="markalar"]) .art-body .note{font-size:13px;line-height:20px;color:var(--steel-500);border-left:3px solid var(--accent);padding-left:12px;margin-top:28px}
:where(html[data-page="markalar"]) .side{position:sticky;top:96px;display:flex;flex-direction:column;gap:32px}
:where(html[data-page="markalar"]) .side h3{font-size:22px;margin-bottom:12px}
:where(html[data-page="markalar"]) .recent a{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px}
:where(html[data-page="markalar"]) .recent img{flex:none;width:96px;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r)}
:where(html[data-page="markalar"]) .recent small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="markalar"]) .recent a:hover b{color:var(--navy-700)}
:where(html[data-page="markalar"]) .side-cta{background:var(--navy-700);color:#fff;padding:24px;border-radius:var(--r)}
:where(html[data-page="markalar"]) .side-cta p{font-size:14px;line-height:22px;color:#b7c4d0;margin:8px 0 16px}
@media (max-width:1024px){:where(html[data-page="markalar"]) .art{grid-template-columns:1fr}
:where(html[data-page="markalar"]) .side{position:static}
:where(html[data-page="markalar"]) .prods.news .feature{flex-direction:column}
:where(html[data-page="markalar"]) .prods.news .feature>a{flex:none}
:where(html[data-page="markalar"]) .prods.news .feature img{border-radius:var(--r) var(--r) 0 0;border-right:0;border-bottom:1px solid var(--steel-200)}}
:where(html[data-page="markalar"]) .logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}
:where(html[data-page="markalar"]) .logo-card{position:relative;display:flex;align-items:center;justify-content:center;height:200px;background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);padding:32px;transition:border-color .18s}
:where(html[data-page="markalar"]) .logo-card::after{content:"";position:absolute;left:24px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="markalar"]) .logo-card:hover{border-color:var(--accent)}
:where(html[data-page="markalar"]) .logo-card:hover::after{width:calc(100% - 48px)}
:where(html[data-page="markalar"]) .logo-card img{max-width:72%;max-height:84px;object-fit:contain}
:where(html[data-page="markalar"]) .logo-card .wm{font:700 30px/1.1 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--navy-700);text-align:center}
:where(html[data-page="markalar"]) .logo-card .badge{position:absolute;top:12px;left:12px}
:where(html[data-page="markalar"]) .logo-card .ctry{position:absolute;bottom:12px;right:16px;font-size:12px;color:var(--steel-500)}




/* urun-detay.html */
:root:where([data-page="urun-detay"]){
  --navy-900:#061B36;--navy-700:#0B3A75;--steel-500:#5A6B80;--steel-200:#D5DFEB;
  --paper:#F1F5FA;--white:#fff;--accent:#2F80ED;
  --head:'Barlow Condensed','Rajdhani',sans-serif;--body:'Poppins',Inter,sans-serif;
  --r:4px;--wrap:1320px;
}
:where(html[data-page="urun-detay"]), :where(html[data-page="urun-detay"]) *{box-sizing:border-box;margin:0;padding:0}
html:where([data-page="urun-detay"]){scroll-behavior:smooth}
:where(html[data-page="urun-detay"]) body{font:400 16px/28px var(--body);color:var(--navy-900);background:var(--white)}
:where(html[data-page="urun-detay"]) a{color:inherit;text-decoration:none}
:where(html[data-page="urun-detay"]) .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:where(html[data-page="urun-detay"]) h1, :where(html[data-page="urun-detay"]) h2, :where(html[data-page="urun-detay"]) h3, :where(html[data-page="urun-detay"]) .num{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
:where(html[data-page="urun-detay"]) h1{font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="urun-detay"]) h2{font-size:clamp(30px,4vw,44px);line-height:1.1}
:where(html[data-page="urun-detay"]) h3{font-size:24px;line-height:32px}
:where(html[data-page="urun-detay"]) section{padding:96px 0}
:where(html[data-page="urun-detay"]) :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* header */
:where(html[data-page="urun-detay"]) .topbar{background:var(--navy-900);color:#a9bdd6;font-size:13px;line-height:20px;padding:6px 0}
:where(html[data-page="urun-detay"]) .topbar .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
:where(html[data-page="urun-detay"]) .lang a{margin-left:12px}
:where(html[data-page="urun-detay"]) .lang a.on{color:var(--accent)}
:where(html[data-page="urun-detay"]) header.main{background:var(--navy-700);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08)}
:where(html[data-page="urun-detay"]) header.main .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
:where(html[data-page="urun-detay"]) .logo{font-family:var(--head);font-size:26px;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
:where(html[data-page="urun-detay"]) .logo span{color:var(--accent)}
:where(html[data-page="urun-detay"]) nav ul{display:flex;gap:28px;list-style:none}
:where(html[data-page="urun-detay"]) nav a{color:#dbe4ec;font-size:14px;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .18s,color .18s}
:where(html[data-page="urun-detay"]) nav a:hover{color:#fff;border-color:var(--accent)}
:where(html[data-page="urun-detay"]) .btn{display:inline-block;font:600 14px/1 var(--body);padding:14px 24px;border-radius:var(--r);border:1px solid var(--accent);background:var(--accent);color:#fff;transition:background .18s,color .18s;cursor:pointer}
:where(html[data-page="urun-detay"]) .btn:hover{background:#1f6bd4}
:where(html[data-page="urun-detay"]) .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
:where(html[data-page="urun-detay"]) .btn.ghost:hover{border-color:#fff;background:transparent}
:where(html[data-page="urun-detay"]) .menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:8px 12px;font:500 14px var(--body)}
/* hero carousel */
:where(html[data-page="urun-detay"]) .hero{position:relative;background:var(--navy-900);color:#fff;overflow:hidden}
:where(html[data-page="urun-detay"]) .hero-slide{position:relative;padding:120px 0 128px;background:var(--navy-900);overflow:hidden}
:where(html[data-page="urun-detay"]) .hero-slide .bg{position:absolute;inset:0;background-image:var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="urun-detay"]) .hero-slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,27,54,.9) 0%,rgba(6,27,54,.62) 55%,rgba(6,27,54,.3) 100%)}
:where(html[data-page="urun-detay"]) .hero-slide::after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 78% 40%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="urun-detay"]) .hero-slide .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
:where(html[data-page="urun-detay"]) .h1{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="urun-detay"]) .hero-slide p.lead{color:#b7c4d0;max-width:560px;margin:24px 0 36px}
:where(html[data-page="urun-detay"]) .hero-slide .cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="urun-detay"]) .hero-carousel .owl-dots{position:absolute;bottom:36px;left:max(24px,calc((100% - var(--wrap))/2 + 24px));z-index:3;display:flex;gap:8px}
:where(html[data-page="urun-detay"]) .hero-carousel .owl-dot{background:none;border:0;padding:8px 0;cursor:pointer}
:where(html[data-page="urun-detay"]) .hero-carousel .owl-dot span{display:block;width:36px;height:3px;background:rgba(255,255,255,.35);transition:background .2s}
:where(html[data-page="urun-detay"]) .hero-carousel .owl-dot.active span{background:var(--accent)}
:where(html[data-page="urun-detay"]) .layers{border-left:2px solid var(--accent);padding-left:24px;font-size:14px;line-height:24px;color:#b7c4d0}
:where(html[data-page="urun-detay"]) .layers b{display:block;font:600 13px/20px var(--body);color:#fff;margin-bottom:4px}
:where(html[data-page="urun-detay"]) .layers div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="urun-detay"]) .layers div:last-child{border:0}
/* stats */
:where(html[data-page="urun-detay"]) .stats{background:var(--navy-700);color:#fff;padding:0}
:where(html[data-page="urun-detay"]) .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
:where(html[data-page="urun-detay"]) .stat{padding:32px 24px;border-right:1px solid rgba(255,255,255,.1)}
:where(html[data-page="urun-detay"]) .stat:last-child{border:0}
:where(html[data-page="urun-detay"]) .stat .num{font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
:where(html[data-page="urun-detay"]) .stat small{display:block;color:#9fb0c0;font-size:13px;margin-top:6px}
/* shared */
:where(html[data-page="urun-detay"]) .sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
:where(html[data-page="urun-detay"]) .sec-head p{color:var(--steel-500);max-width:480px}
:where(html[data-page="urun-detay"]) .paper{background:var(--paper)}
/* categories */
:where(html[data-page="urun-detay"]) .cats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="urun-detay"]) .cat{position:relative;min-height:240px;border-radius:var(--r);background:var(--navy-700);color:#fff;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--navy-700)}
:where(html[data-page="urun-detay"]) .cat::before{content:"";position:absolute;inset:0;opacity:.1;background:repeating-radial-gradient(circle at 85% 15%,transparent 0 22px,#fff 22px 23px)}
:where(html[data-page="urun-detay"]) .cat::after{content:"";position:absolute;left:28px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="urun-detay"]) .cat:hover::after{width:calc(100% - 56px)}
:where(html[data-page="urun-detay"]) .cat > *{position:relative}
:where(html[data-page="urun-detay"]) .cat span{color:#9fb0c0;font-size:13px}
:where(html[data-page="urun-detay"]) .cat.alt{background:var(--navy-900)}
/* products */
:where(html[data-page="urun-detay"]) .prods{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="urun-detay"]) .card{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="urun-detay"]) .thumb{aspect-ratio:4/3;background:var(--navy-700);position:relative;display:flex;align-items:center;justify-content:center;color:#7f93a6;font-size:12px;border-bottom:1px solid var(--steel-200);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px}
:where(html[data-page="urun-detay"]) .card .body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
:where(html[data-page="urun-detay"]) .brand{font-size:12px;color:var(--steel-500);display:flex;justify-content:space-between}
:where(html[data-page="urun-detay"]) .badge{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:0 8px;font-size:11px;line-height:20px;color:var(--navy-700)}
:where(html[data-page="urun-detay"]) .card p{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="urun-detay"]) .specs{display:flex;gap:24px;margin:8px 0;padding:12px 0;border-top:1px solid var(--steel-200);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="urun-detay"]) .specs div{font-size:12px;line-height:16px;color:var(--steel-500)}
:where(html[data-page="urun-detay"]) .specs .num{display:block;font-size:26px;line-height:30px;color:var(--navy-700);font-variant-numeric:tabular-nums}
:where(html[data-page="urun-detay"]) .more{margin-top:auto;font-weight:600;font-size:14px;border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="urun-detay"]) .card:hover .more{border-color:var(--accent)}
/* brands */
:where(html[data-page="urun-detay"]) .brand-carousel .item{display:block;border:1px solid var(--steel-200);border-radius:var(--r);padding:28px 12px;text-align:center;font:700 20px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--steel-500);transition:color .18s,border-color .18s;background:var(--white)}
:where(html[data-page="urun-detay"]) .brand-carousel .item small{display:block;font:400 12px/18px var(--body);letter-spacing:0;text-transform:none;margin-top:4px}
:where(html[data-page="urun-detay"]) .brand-carousel .item:hover{color:var(--navy-700);border-color:var(--accent)}
/* kataloglar */
:where(html[data-page="urun-detay"]) .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="urun-detay"]) .chip{font:500 14px/1 var(--body);padding:10px 18px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="urun-detay"]) .chip:hover{border-color:var(--accent)}
:where(html[data-page="urun-detay"]) .chip[aria-pressed=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="urun-detay"]) .catalogs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
:where(html[data-page="urun-detay"]) .cat-doc{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="urun-detay"]) .cat-doc[hidden]{display:none}
:where(html[data-page="urun-detay"]) .cover{aspect-ratio:3/4;background:var(--navy-700);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="urun-detay"]) .cover::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-radial-gradient(circle at 90% 8%,transparent 0 20px,#fff 20px 21px)}
:where(html[data-page="urun-detay"]) .cover>*{position:relative}
:where(html[data-page="urun-detay"]) .cover b{font:700 28px/1.05 var(--head);text-transform:uppercase;letter-spacing:.04em}
:where(html[data-page="urun-detay"]) .cover span{font-size:12px;color:#a9bdd6}
:where(html[data-page="urun-detay"]) .pdf-tag{align-self:flex-start;background:var(--accent);color:#fff;font:600 11px/20px var(--body);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="urun-detay"]) .cat-doc .body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
:where(html[data-page="urun-detay"]) .cat-doc h3{font-size:20px;line-height:26px}
:where(html[data-page="urun-detay"]) .cat-doc p{font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="urun-detay"]) .dl{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--navy-700);border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="urun-detay"]) .cat-doc:hover .dl{border-color:var(--accent)}
/* haber görseli */
:where(html[data-page="urun-detay"]) .news img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--steel-200);border-radius:var(--r) var(--r) 0 0}
/* cta band */
:where(html[data-page="urun-detay"]) .band{background:var(--navy-900);color:#fff;padding:72px 0}
:where(html[data-page="urun-detay"]) .band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
:where(html[data-page="urun-detay"]) .band p{color:#9fb0c0;margin-top:8px}
/* footer */
:where(html[data-page="urun-detay"]) footer{background:var(--navy-900);color:#9fb0c0;font-size:14px;line-height:24px;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}
:where(html[data-page="urun-detay"]) .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
:where(html[data-page="urun-detay"]) footer h4{font:600 14px var(--body);color:#fff;margin-bottom:12px}
:where(html[data-page="urun-detay"]) footer li{list-style:none}
:where(html[data-page="urun-detay"]) footer a:hover{color:#fff}
:where(html[data-page="urun-detay"]) .legal{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:12px;line-height:20px}
/* hızlı katalog menüsü */
:where(html[data-page="urun-detay"]) .qc{position:fixed;left:24px;bottom:24px;z-index:40}
:where(html[data-page="urun-detay"]) .qc-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(6,27,54,.35);transition:background .18s}
:where(html[data-page="urun-detay"]) .qc-btn:hover, :where(html[data-page="urun-detay"]) .qc-btn[aria-expanded=true]{background:var(--navy-700)}
:where(html[data-page="urun-detay"]) .qc-panel{position:absolute;left:0;bottom:68px;width:340px;max-width:calc(100vw - 48px);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);box-shadow:0 12px 32px rgba(6,27,54,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}
:where(html[data-page="urun-detay"]) .qc.open .qc-panel{opacity:1;visibility:visible;transform:none}
:where(html[data-page="urun-detay"]) .qc-head{padding:14px 18px;background:var(--navy-700);color:#fff;font:700 18px/24px var(--head);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--r) var(--r) 0 0}
:where(html[data-page="urun-detay"]) .qc-list{list-style:none;max-height:min(55vh,360px);overflow:auto}
:where(html[data-page="urun-detay"]) .qc-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px;transition:background .15s}
:where(html[data-page="urun-detay"]) .qc-list a:hover{background:var(--paper)}
:where(html[data-page="urun-detay"]) .qc-list small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="urun-detay"]) .qc-list .pdf{flex:none;font:600 11px/20px var(--body);color:#fff;background:var(--accent);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="urun-detay"]) .qc-all{display:block;padding:12px 18px;font:600 14px var(--body);color:var(--navy-700)}
:where(html[data-page="urun-detay"]) .qc-all:hover{background:var(--paper)}
/* mobile sticky */
:where(html[data-page="urun-detay"]) .sticky-cta{display:none}
@media (max-width:1024px){:where(html[data-page="urun-detay"]) .hero-slide .wrap{grid-template-columns:1fr}
:where(html[data-page="urun-detay"]) .cats, :where(html[data-page="urun-detay"]) .prods{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="urun-detay"]) .catalogs{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="urun-detay"]) .fgrid{grid-template-columns:repeat(2,1fr)}

}
@media (max-width:760px){:where(html[data-page="urun-detay"]) section{padding:56px 0}
:where(html[data-page="urun-detay"]) .hero-slide{padding:72px 0 88px}
:where(html[data-page="urun-detay"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:16px 24px 24px}
:where(html[data-page="urun-detay"]) nav.open{display:block}
:where(html[data-page="urun-detay"]) nav ul{flex-direction:column;gap:4px}
:where(html[data-page="urun-detay"]) .menu-btn{display:block}
:where(html[data-page="urun-detay"]) header.main .btn{display:none}
:where(html[data-page="urun-detay"]) .cats, :where(html[data-page="urun-detay"]) .prods, :where(html[data-page="urun-detay"]) .fgrid{grid-template-columns:1fr}
:where(html[data-page="urun-detay"]) .catalogs{grid-template-columns:repeat(2,1fr);gap:16px}
:where(html[data-page="urun-detay"]) .stats .wrap{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="urun-detay"]) .stat:nth-child(2){border-right:0}
:where(html[data-page="urun-detay"]) .stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="urun-detay"]) .sticky-cta{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--navy-900);padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
:where(html[data-page="urun-detay"]) .sticky-cta .btn{display:block;text-align:center;width:100%}
:where(html[data-page="urun-detay"]) body{padding-bottom:68px}
:where(html[data-page="urun-detay"]) .qc{left:16px;bottom:84px}

}
@media (prefers-reduced-motion:reduce){:where(html[data-page="urun-detay"]), :where(html[data-page="urun-detay"]) *{transition:none!important;scroll-behavior:auto!important}}
:where(html[data-page="urun-detay"]) nav a[aria-current=page]{color:#fff;border-color:var(--accent)}
:where(html[data-page="urun-detay"]) .page-hero{position:relative;background:var(--navy-900);color:#fff;padding:72px 0 64px;overflow:hidden}
:where(html[data-page="urun-detay"]) .page-hero::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 85% 30%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="urun-detay"]) .page-hero .wrap{position:relative;z-index:1}
:where(html[data-page="urun-detay"]) .page-hero p{color:#b7c4d0;max-width:600px;margin-top:16px}
:where(html[data-page="urun-detay"]) .crumb{font-size:13px;line-height:20px;color:#a9bdd6;margin-bottom:20px}
:where(html[data-page="urun-detay"]) .crumb a:hover{color:#fff}
:where(html[data-page="urun-detay"]) .crumb span{margin:0 8px}
:where(html[data-page="urun-detay"]) .toolbar{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="urun-detay"]) .toolbar .chips{margin:0}
:where(html[data-page="urun-detay"]) .search{font:400 14px/1 var(--body);padding:12px 16px;border:1px solid var(--steel-200);border-radius:var(--r);min-width:260px;background:var(--white);color:var(--navy-900)}
:where(html[data-page="urun-detay"]) .search:focus{border-color:var(--accent)}
:where(html[data-page="urun-detay"]) .count{font-size:13px;color:var(--steel-500);margin-bottom:16px}
:where(html[data-page="urun-detay"]) .empty{padding:48px 0;color:var(--steel-500)}
:where(html[data-page="urun-detay"]) .tags{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 8px}
/* ürünler sayfası */
:where(html[data-page="urun-detay"]) nav a[aria-current]{color:#fff;border-color:var(--accent)}
:where(html[data-page="urun-detay"]) .sol{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding:72px 0;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="urun-detay"]) .sol:last-of-type{border:0}
:where(html[data-page="urun-detay"]) .sol.flip .sol-img{order:2}
:where(html[data-page="urun-detay"]) .sol-img img{width:100%;display:block;border-radius:var(--r);border:1px solid var(--steel-200);background:var(--paper)}
:where(html[data-page="urun-detay"]) .sol-img.tall img{max-height:520px;object-fit:cover}
:where(html[data-page="urun-detay"]) .sol h2{margin-bottom:16px}
:where(html[data-page="urun-detay"]) .sol p{color:var(--steel-500);margin-bottom:20px}
:where(html[data-page="urun-detay"]) .chain{display:flex;flex-wrap:wrap;gap:0;margin:8px 0 24px;border:1px solid var(--steel-200);border-radius:var(--r);overflow:hidden}
:where(html[data-page="urun-detay"]) .chain li{flex:1 1 90px;list-style:none;padding:12px 10px;text-align:center;font:600 13px/18px var(--body);color:var(--navy-700);background:var(--white);border-right:1px solid var(--steel-200)}
:where(html[data-page="urun-detay"]) .chain li:last-child{border:0;background:var(--navy-700);color:#fff}
:where(html[data-page="urun-detay"]) .pts{list-style:none;margin-bottom:28px}
:where(html[data-page="urun-detay"]) .pts li{padding:10px 0 10px 20px;border-bottom:1px solid var(--steel-200);font-size:15px;line-height:24px;position:relative}
:where(html[data-page="urun-detay"]) .pts li::before{content:"";position:absolute;left:0;top:19px;width:8px;height:2px;background:var(--accent)}
:where(html[data-page="urun-detay"]) .pts b{font-weight:600}
:where(html[data-page="urun-detay"]) .tabs-note{color:var(--steel-500);font-size:14px;margin-bottom:24px}
:where(html[data-page="urun-detay"]) .thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:12px}
:where(html[data-page="urun-detay"]) .thumb.cover img{object-fit:cover;padding:0}
:where(html[data-page="urun-detay"]) .thumb{background:var(--paper);background-image:none}
:where(html[data-page="urun-detay"]) .card[hidden]{display:none}
:where(html[data-page="urun-detay"]) .card details{border-top:1px solid var(--steel-200);margin-top:4px;padding-top:12px}
:where(html[data-page="urun-detay"]) .card summary{cursor:pointer;font:600 14px/20px var(--body);color:var(--navy-700)}
:where(html[data-page="urun-detay"]) .card dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin-top:12px;font-size:13px;line-height:20px}
:where(html[data-page="urun-detay"]) .card dt{color:var(--steel-500)}
:where(html[data-page="urun-detay"]) .card dd{color:var(--navy-900);text-align:right}
:where(html[data-page="urun-detay"]) .acts{display:flex;gap:16px;align-items:center;margin-top:auto;padding-top:8px;flex-wrap:wrap}
:where(html[data-page="urun-detay"]) .acts .more{margin:0}
:where(html[data-page="urun-detay"]) .acts .dl{font-size:13px;color:var(--steel-500);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="urun-detay"]) .acts .dl:hover{color:var(--navy-700)}
:where(html[data-page="urun-detay"]) .cta-band{background:var(--navy-900);color:#fff;padding:56px 0}
:where(html[data-page="urun-detay"]) .cta-band .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
:where(html[data-page="urun-detay"]) .cta-band p{color:#b7c4d0;max-width:560px;margin-top:8px}
@media (max-width:900px){:where(html[data-page="urun-detay"]) .sol{grid-template-columns:1fr;gap:28px;padding:48px 0}
:where(html[data-page="urun-detay"]) .sol.flip .sol-img{order:0}}
:where(html[data-page="urun-detay"]) a.thumb{display:block}
:where(html[data-page="urun-detay"]) .card h3 a:hover{color:var(--accent)}
:where(html[data-page="urun-detay"]) .sol h2 a:hover{color:var(--navy-700)}
:where(html[data-page="urun-detay"]) .btn.ghost-d{background:transparent;color:var(--navy-700);border-color:var(--steel-200)}
:where(html[data-page="urun-detay"]) .btn.ghost-d:hover{border-color:var(--navy-700);background:transparent}
:where(html[data-page="urun-detay"]) .d-hero{position:relative;background:var(--navy-900);color:#fff;padding:64px 0 56px;overflow:hidden}
:where(html[data-page="urun-detay"]) .d-hero .wrap{position:relative}
:where(html[data-page="urun-detay"]) .d-hero p.sub{color:#b7c4d0;margin-top:12px;max-width:640px}
:where(html[data-page="urun-detay"]) .d-hero .badge{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.25);margin-left:12px;vertical-align:middle}
:where(html[data-page="urun-detay"]) .d-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:start}
:where(html[data-page="urun-detay"]) .gal img.main{width:100%;display:block;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--paper);max-height:560px;object-fit:contain}
:where(html[data-page="urun-detay"]) .gal .th{display:flex;gap:12px;margin-top:12px}
:where(html[data-page="urun-detay"]) .gal .th button{border:1px solid var(--steel-200);border-radius:var(--r);padding:0;width:96px;height:72px;background:var(--paper);cursor:pointer;overflow:hidden}
:where(html[data-page="urun-detay"]) .gal .th button[aria-pressed=true]{border-color:var(--accent);outline:1px solid var(--accent)}
:where(html[data-page="urun-detay"]) .gal .th img{width:100%;height:100%;object-fit:cover;display:block}
:where(html[data-page="urun-detay"]) .d-body .lead{color:var(--steel-500);margin-bottom:24px}
:where(html[data-page="urun-detay"]) .bigs{display:grid;grid-template-columns:repeat(2,1fr);border:1px solid var(--steel-200);border-radius:var(--r);margin-bottom:28px}
:where(html[data-page="urun-detay"]) .bigs div{padding:16px 18px;font-size:13px;line-height:18px;color:var(--steel-500);border-bottom:1px solid var(--steel-200);border-right:1px solid var(--steel-200)}
:where(html[data-page="urun-detay"]) .bigs div:nth-child(2n){border-right:0}
:where(html[data-page="urun-detay"]) .bigs div:nth-last-child(-n+2){border-bottom:0}
:where(html[data-page="urun-detay"]) .bigs .num{display:block;font-size:28px;line-height:32px;color:var(--navy-700)}
:where(html[data-page="urun-detay"]) .d-cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="urun-detay"]) .tbl{width:100%;border-collapse:collapse;font-size:15px}
:where(html[data-page="urun-detay"]) .tbl th, :where(html[data-page="urun-detay"]) .tbl td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--steel-200);vertical-align:top}
:where(html[data-page="urun-detay"]) .tbl th{width:36%;font-weight:500;color:var(--steel-500)}
:where(html[data-page="urun-detay"]) .two{display:grid;grid-template-columns:1fr 1fr;gap:56px}
:where(html[data-page="urun-detay"]) .two h2, :where(html[data-page="urun-detay"]) .rel h2{margin-bottom:24px}
:where(html[data-page="urun-detay"]) .note{margin-top:20px;font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="urun-detay"]) .rel .prods{grid-template-columns:repeat(3,1fr)}
:where(html[data-page="urun-detay"]) .rel a.r{display:block;background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);overflow:hidden}
:where(html[data-page="urun-detay"]) .rel a.r img{width:100%;aspect-ratio:4/3;object-fit:contain;background:var(--paper);display:block;padding:12px}
:where(html[data-page="urun-detay"]) .rel a.r div{padding:16px 20px}
:where(html[data-page="urun-detay"]) .rel a.r small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="urun-detay"]) .rel a.r:hover h3{color:var(--accent)}
@media (max-width:900px){:where(html[data-page="urun-detay"]) .d-grid, :where(html[data-page="urun-detay"]) .two{grid-template-columns:1fr;gap:32px}
:where(html[data-page="urun-detay"]) .rel .prods{grid-template-columns:1fr 1fr}}




/* urunler.html */
:root:where([data-page="urunler"]){
  --navy-900:#061B36;--navy-700:#0B3A75;--steel-500:#5A6B80;--steel-200:#D5DFEB;
  --paper:#F1F5FA;--white:#fff;--accent:#2F80ED;
  --head:'Barlow Condensed','Rajdhani',sans-serif;--body:'Poppins',Inter,sans-serif;
  --r:4px;--wrap:1320px;
}
:where(html[data-page="urunler"]), :where(html[data-page="urunler"]) *{box-sizing:border-box;margin:0;padding:0}
html:where([data-page="urunler"]){scroll-behavior:smooth}
:where(html[data-page="urunler"]) body{font:400 16px/28px var(--body);color:var(--navy-900);background:var(--white)}
:where(html[data-page="urunler"]) a{color:inherit;text-decoration:none}
:where(html[data-page="urunler"]) .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:where(html[data-page="urunler"]) h1, :where(html[data-page="urunler"]) h2, :where(html[data-page="urunler"]) h3, :where(html[data-page="urunler"]) .num{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
:where(html[data-page="urunler"]) h1{font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="urunler"]) h2{font-size:clamp(30px,4vw,44px);line-height:1.1}
:where(html[data-page="urunler"]) h3{font-size:24px;line-height:32px}
:where(html[data-page="urunler"]) section{padding:96px 0}
:where(html[data-page="urunler"]) :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* header */
:where(html[data-page="urunler"]) .topbar{background:var(--navy-900);color:#a9bdd6;font-size:13px;line-height:20px;padding:6px 0}
:where(html[data-page="urunler"]) .topbar .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
:where(html[data-page="urunler"]) .lang a{margin-left:12px}
:where(html[data-page="urunler"]) .lang a.on{color:var(--accent)}
:where(html[data-page="urunler"]) header.main{background:var(--navy-700);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.08)}
:where(html[data-page="urunler"]) header.main .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
:where(html[data-page="urunler"]) .logo{font-family:var(--head);font-size:26px;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
:where(html[data-page="urunler"]) .logo span{color:var(--accent)}
:where(html[data-page="urunler"]) nav ul{display:flex;gap:28px;list-style:none}
:where(html[data-page="urunler"]) nav a{color:#dbe4ec;font-size:14px;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .18s,color .18s}
:where(html[data-page="urunler"]) nav a:hover{color:#fff;border-color:var(--accent)}
:where(html[data-page="urunler"]) .btn{display:inline-block;font:600 14px/1 var(--body);padding:14px 24px;border-radius:var(--r);border:1px solid var(--accent);background:var(--accent);color:#fff;transition:background .18s,color .18s;cursor:pointer}
:where(html[data-page="urunler"]) .btn:hover{background:#1f6bd4}
:where(html[data-page="urunler"]) .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
:where(html[data-page="urunler"]) .btn.ghost:hover{border-color:#fff;background:transparent}
:where(html[data-page="urunler"]) .menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:8px 12px;font:500 14px var(--body)}
/* hero carousel */
:where(html[data-page="urunler"]) .hero{position:relative;background:var(--navy-900);color:#fff;overflow:hidden}
:where(html[data-page="urunler"]) .hero-slide{position:relative;padding:120px 0 128px;background:var(--navy-900);overflow:hidden}
:where(html[data-page="urunler"]) .hero-slide .bg{position:absolute;inset:0;background-image:var(--bg,none);background-size:cover;background-position:center}
:where(html[data-page="urunler"]) .hero-slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,27,54,.9) 0%,rgba(6,27,54,.62) 55%,rgba(6,27,54,.3) 100%)}
:where(html[data-page="urunler"]) .hero-slide::after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 78% 40%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="urunler"]) .hero-slide .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end}
:where(html[data-page="urunler"]) .h1{font-family:var(--head);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(40px,6vw,64px);line-height:1.05}
:where(html[data-page="urunler"]) .hero-slide p.lead{color:#b7c4d0;max-width:560px;margin:24px 0 36px}
:where(html[data-page="urunler"]) .hero-slide .cta{display:flex;gap:12px;flex-wrap:wrap}
:where(html[data-page="urunler"]) .hero-carousel .owl-dots{position:absolute;bottom:36px;left:max(24px,calc((100% - var(--wrap))/2 + 24px));z-index:3;display:flex;gap:8px}
:where(html[data-page="urunler"]) .hero-carousel .owl-dot{background:none;border:0;padding:8px 0;cursor:pointer}
:where(html[data-page="urunler"]) .hero-carousel .owl-dot span{display:block;width:36px;height:3px;background:rgba(255,255,255,.35);transition:background .2s}
:where(html[data-page="urunler"]) .hero-carousel .owl-dot.active span{background:var(--accent)}
:where(html[data-page="urunler"]) .layers{border-left:2px solid var(--accent);padding-left:24px;font-size:14px;line-height:24px;color:#b7c4d0}
:where(html[data-page="urunler"]) .layers b{display:block;font:600 13px/20px var(--body);color:#fff;margin-bottom:4px}
:where(html[data-page="urunler"]) .layers div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="urunler"]) .layers div:last-child{border:0}
/* stats */
:where(html[data-page="urunler"]) .stats{background:var(--navy-700);color:#fff;padding:0}
:where(html[data-page="urunler"]) .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
:where(html[data-page="urunler"]) .stat{padding:32px 24px;border-right:1px solid rgba(255,255,255,.1)}
:where(html[data-page="urunler"]) .stat:last-child{border:0}
:where(html[data-page="urunler"]) .stat .num{font-size:48px;line-height:1;font-variant-numeric:tabular-nums}
:where(html[data-page="urunler"]) .stat small{display:block;color:#9fb0c0;font-size:13px;margin-top:6px}
/* shared */
:where(html[data-page="urunler"]) .sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
:where(html[data-page="urunler"]) .sec-head p{color:var(--steel-500);max-width:480px}
:where(html[data-page="urunler"]) .paper{background:var(--paper)}
/* categories */
:where(html[data-page="urunler"]) .cats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="urunler"]) .cat{position:relative;min-height:240px;border-radius:var(--r);background:var(--navy-700);color:#fff;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--navy-700)}
:where(html[data-page="urunler"]) .cat::before{content:"";position:absolute;inset:0;opacity:.1;background:repeating-radial-gradient(circle at 85% 15%,transparent 0 22px,#fff 22px 23px)}
:where(html[data-page="urunler"]) .cat::after{content:"";position:absolute;left:28px;bottom:0;height:3px;width:0;background:var(--accent);transition:width .2s}
:where(html[data-page="urunler"]) .cat:hover::after{width:calc(100% - 56px)}
:where(html[data-page="urunler"]) .cat > *{position:relative}
:where(html[data-page="urunler"]) .cat span{color:#9fb0c0;font-size:13px}
:where(html[data-page="urunler"]) .cat.alt{background:var(--navy-900)}
/* products */
:where(html[data-page="urunler"]) .prods{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
:where(html[data-page="urunler"]) .card{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="urunler"]) .thumb{aspect-ratio:4/3;background:var(--navy-700);position:relative;display:flex;align-items:center;justify-content:center;color:#7f93a6;font-size:12px;border-bottom:1px solid var(--steel-200);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px}
:where(html[data-page="urunler"]) .card .body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
:where(html[data-page="urunler"]) .brand{font-size:12px;color:var(--steel-500);display:flex;justify-content:space-between}
:where(html[data-page="urunler"]) .badge{background:var(--paper);border:1px solid var(--steel-200);border-radius:var(--r);padding:0 8px;font-size:11px;line-height:20px;color:var(--navy-700)}
:where(html[data-page="urunler"]) .card p{font-size:14px;line-height:22px;color:var(--steel-500)}
:where(html[data-page="urunler"]) .specs{display:flex;gap:24px;margin:8px 0;padding:12px 0;border-top:1px solid var(--steel-200);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="urunler"]) .specs div{font-size:12px;line-height:16px;color:var(--steel-500)}
:where(html[data-page="urunler"]) .specs .num{display:block;font-size:26px;line-height:30px;color:var(--navy-700);font-variant-numeric:tabular-nums}
:where(html[data-page="urunler"]) .more{margin-top:auto;font-weight:600;font-size:14px;border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="urunler"]) .card:hover .more{border-color:var(--accent)}
/* brands */
:where(html[data-page="urunler"]) .brand-carousel .item{display:block;border:1px solid var(--steel-200);border-radius:var(--r);padding:28px 12px;text-align:center;font:700 20px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase;color:var(--steel-500);transition:color .18s,border-color .18s;background:var(--white)}
:where(html[data-page="urunler"]) .brand-carousel .item small{display:block;font:400 12px/18px var(--body);letter-spacing:0;text-transform:none;margin-top:4px}
:where(html[data-page="urunler"]) .brand-carousel .item:hover{color:var(--navy-700);border-color:var(--accent)}
/* kataloglar */
:where(html[data-page="urunler"]) .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="urunler"]) .chip{font:500 14px/1 var(--body);padding:10px 18px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="urunler"]) .chip:hover{border-color:var(--accent)}
:where(html[data-page="urunler"]) .chip[aria-pressed=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="urunler"]) .catalogs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
:where(html[data-page="urunler"]) .cat-doc{background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);display:flex;flex-direction:column}
:where(html[data-page="urunler"]) .cat-doc[hidden]{display:none}
:where(html[data-page="urunler"]) .cover{aspect-ratio:3/4;background:var(--navy-700);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="urunler"]) .cover::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-radial-gradient(circle at 90% 8%,transparent 0 20px,#fff 20px 21px)}
:where(html[data-page="urunler"]) .cover>*{position:relative}
:where(html[data-page="urunler"]) .cover b{font:700 28px/1.05 var(--head);text-transform:uppercase;letter-spacing:.04em}
:where(html[data-page="urunler"]) .cover span{font-size:12px;color:#a9bdd6}
:where(html[data-page="urunler"]) .pdf-tag{align-self:flex-start;background:var(--accent);color:#fff;font:600 11px/20px var(--body);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="urunler"]) .cat-doc .body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
:where(html[data-page="urunler"]) .cat-doc h3{font-size:20px;line-height:26px}
:where(html[data-page="urunler"]) .cat-doc p{font-size:13px;line-height:20px;color:var(--steel-500)}
:where(html[data-page="urunler"]) .dl{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;color:var(--navy-700);border-bottom:2px solid transparent;align-self:flex-start;transition:border-color .18s}
:where(html[data-page="urunler"]) .cat-doc:hover .dl{border-color:var(--accent)}
/* haber görseli */
:where(html[data-page="urunler"]) .news img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--steel-200);border-radius:var(--r) var(--r) 0 0}
/* cta band */
:where(html[data-page="urunler"]) .band{background:var(--navy-900);color:#fff;padding:72px 0}
:where(html[data-page="urunler"]) .band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
:where(html[data-page="urunler"]) .band p{color:#9fb0c0;margin-top:8px}
/* footer */
:where(html[data-page="urunler"]) footer{background:var(--navy-900);color:#9fb0c0;font-size:14px;line-height:24px;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}
:where(html[data-page="urunler"]) .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
:where(html[data-page="urunler"]) footer h4{font:600 14px var(--body);color:#fff;margin-bottom:12px}
:where(html[data-page="urunler"]) footer li{list-style:none}
:where(html[data-page="urunler"]) footer a:hover{color:#fff}
:where(html[data-page="urunler"]) .legal{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:12px;line-height:20px}
/* hızlı katalog menüsü */
:where(html[data-page="urunler"]) .qc{position:fixed;left:24px;bottom:24px;z-index:40}
:where(html[data-page="urunler"]) .qc-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(6,27,54,.35);transition:background .18s}
:where(html[data-page="urunler"]) .qc-btn:hover, :where(html[data-page="urunler"]) .qc-btn[aria-expanded=true]{background:var(--navy-700)}
:where(html[data-page="urunler"]) .qc-panel{position:absolute;left:0;bottom:68px;width:340px;max-width:calc(100vw - 48px);background:var(--white);border:1px solid var(--steel-200);border-radius:var(--r);box-shadow:0 12px 32px rgba(6,27,54,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}
:where(html[data-page="urunler"]) .qc.open .qc-panel{opacity:1;visibility:visible;transform:none}
:where(html[data-page="urunler"]) .qc-head{padding:14px 18px;background:var(--navy-700);color:#fff;font:700 18px/24px var(--head);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--r) var(--r) 0 0}
:where(html[data-page="urunler"]) .qc-list{list-style:none;max-height:min(55vh,360px);overflow:auto}
:where(html[data-page="urunler"]) .qc-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--steel-200);font-size:14px;line-height:20px;transition:background .15s}
:where(html[data-page="urunler"]) .qc-list a:hover{background:var(--paper)}
:where(html[data-page="urunler"]) .qc-list small{display:block;color:var(--steel-500);font-size:12px}
:where(html[data-page="urunler"]) .qc-list .pdf{flex:none;font:600 11px/20px var(--body);color:#fff;background:var(--accent);padding:0 8px;border-radius:var(--r)}
:where(html[data-page="urunler"]) .qc-all{display:block;padding:12px 18px;font:600 14px var(--body);color:var(--navy-700)}
:where(html[data-page="urunler"]) .qc-all:hover{background:var(--paper)}
/* mobile sticky */
:where(html[data-page="urunler"]) .sticky-cta{display:none}
@media (max-width:1024px){:where(html[data-page="urunler"]) .hero-slide .wrap{grid-template-columns:1fr}
:where(html[data-page="urunler"]) .cats, :where(html[data-page="urunler"]) .prods{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="urunler"]) .catalogs{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="urunler"]) .fgrid{grid-template-columns:repeat(2,1fr)}

}
@media (max-width:760px){:where(html[data-page="urunler"]) section{padding:56px 0}
:where(html[data-page="urunler"]) .hero-slide{padding:72px 0 88px}
:where(html[data-page="urunler"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:16px 24px 24px}
:where(html[data-page="urunler"]) nav.open{display:block}
:where(html[data-page="urunler"]) nav ul{flex-direction:column;gap:4px}
:where(html[data-page="urunler"]) .menu-btn{display:block}
:where(html[data-page="urunler"]) header.main .btn{display:none}
:where(html[data-page="urunler"]) .cats, :where(html[data-page="urunler"]) .prods, :where(html[data-page="urunler"]) .fgrid{grid-template-columns:1fr}
:where(html[data-page="urunler"]) .catalogs{grid-template-columns:repeat(2,1fr);gap:16px}
:where(html[data-page="urunler"]) .stats .wrap{grid-template-columns:repeat(2,1fr)}
:where(html[data-page="urunler"]) .stat:nth-child(2){border-right:0}
:where(html[data-page="urunler"]) .stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}
:where(html[data-page="urunler"]) .sticky-cta{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--navy-900);padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
:where(html[data-page="urunler"]) .sticky-cta .btn{display:block;text-align:center;width:100%}
:where(html[data-page="urunler"]) body{padding-bottom:68px}
:where(html[data-page="urunler"]) .qc{left:16px;bottom:84px}

}
@media (prefers-reduced-motion:reduce){:where(html[data-page="urunler"]), :where(html[data-page="urunler"]) *{transition:none!important;scroll-behavior:auto!important}}
:where(html[data-page="urunler"]) nav a[aria-current=page]{color:#fff;border-color:var(--accent)}
:where(html[data-page="urunler"]) .page-hero{position:relative;background:var(--navy-900);color:#fff;padding:72px 0 64px;overflow:hidden}
:where(html[data-page="urunler"]) .page-hero::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;
  background:repeating-radial-gradient(circle at 85% 30%,transparent 0 38px,#fff 38px 39px),
  linear-gradient(#fff 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/64px 64px}
:where(html[data-page="urunler"]) .page-hero .wrap{position:relative;z-index:1}
:where(html[data-page="urunler"]) .page-hero p{color:#b7c4d0;max-width:600px;margin-top:16px}
:where(html[data-page="urunler"]) .crumb{font-size:13px;line-height:20px;color:#a9bdd6;margin-bottom:20px}
:where(html[data-page="urunler"]) .crumb a:hover{color:#fff}
:where(html[data-page="urunler"]) .crumb span{margin:0 8px}
:where(html[data-page="urunler"]) .toolbar{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-bottom:32px}
:where(html[data-page="urunler"]) .toolbar .chips{margin:0}
:where(html[data-page="urunler"]) .search{font:400 14px/1 var(--body);padding:12px 16px;border:1px solid var(--steel-200);border-radius:var(--r);min-width:260px;background:var(--white);color:var(--navy-900)}
:where(html[data-page="urunler"]) .search:focus{border-color:var(--accent)}
:where(html[data-page="urunler"]) .count{font-size:13px;color:var(--steel-500);margin-bottom:16px}
:where(html[data-page="urunler"]) .empty{padding:48px 0;color:var(--steel-500)}
:where(html[data-page="urunler"]) .tags{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 8px}
/* ürünler sayfası */
:where(html[data-page="urunler"]) nav a[aria-current]{color:#fff;border-color:var(--accent)}
:where(html[data-page="urunler"]) .sol{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding:72px 0;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="urunler"]) .sol:last-of-type{border:0}
:where(html[data-page="urunler"]) .sol.flip .sol-img{order:2}
:where(html[data-page="urunler"]) .sol-img img{width:100%;display:block;border-radius:var(--r);border:1px solid var(--steel-200);background:var(--paper)}
:where(html[data-page="urunler"]) .sol-img.tall img{max-height:520px;object-fit:cover}
:where(html[data-page="urunler"]) .sol h2{margin-bottom:16px}
:where(html[data-page="urunler"]) .sol p{color:var(--steel-500);margin-bottom:20px}
:where(html[data-page="urunler"]) .chain{display:flex;flex-wrap:wrap;gap:0;margin:8px 0 24px;border:1px solid var(--steel-200);border-radius:var(--r);overflow:hidden}
:where(html[data-page="urunler"]) .chain li{flex:1 1 90px;list-style:none;padding:12px 10px;text-align:center;font:600 13px/18px var(--body);color:var(--navy-700);background:var(--white);border-right:1px solid var(--steel-200)}
:where(html[data-page="urunler"]) .chain li:last-child{border:0;background:var(--navy-700);color:#fff}
:where(html[data-page="urunler"]) .pts{list-style:none;margin-bottom:28px}
:where(html[data-page="urunler"]) .pts li{padding:10px 0 10px 20px;border-bottom:1px solid var(--steel-200);font-size:15px;line-height:24px;position:relative}
:where(html[data-page="urunler"]) .pts li::before{content:"";position:absolute;left:0;top:19px;width:8px;height:2px;background:var(--accent)}
:where(html[data-page="urunler"]) .pts b{font-weight:600}
:where(html[data-page="urunler"]) .tabs-note{color:var(--steel-500);font-size:14px;margin-bottom:24px}
:where(html[data-page="urunler"]) .thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:12px}
:where(html[data-page="urunler"]) .thumb.cover img{object-fit:cover;padding:0}
:where(html[data-page="urunler"]) .thumb{background:var(--paper);background-image:none}
:where(html[data-page="urunler"]) .card[hidden]{display:none}
:where(html[data-page="urunler"]) .card details{border-top:1px solid var(--steel-200);margin-top:4px;padding-top:12px}
:where(html[data-page="urunler"]) .card summary{cursor:pointer;font:600 14px/20px var(--body);color:var(--navy-700)}
:where(html[data-page="urunler"]) .card dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin-top:12px;font-size:13px;line-height:20px}
:where(html[data-page="urunler"]) .card dt{color:var(--steel-500)}
:where(html[data-page="urunler"]) .card dd{color:var(--navy-900);text-align:right}
:where(html[data-page="urunler"]) .acts{display:flex;gap:16px;align-items:center;margin-top:auto;padding-top:8px;flex-wrap:wrap}
:where(html[data-page="urunler"]) .acts .more{margin:0}
:where(html[data-page="urunler"]) .acts .dl{font-size:13px;color:var(--steel-500);border-bottom:1px solid var(--steel-200)}
:where(html[data-page="urunler"]) .acts .dl:hover{color:var(--navy-700)}
:where(html[data-page="urunler"]) .cta-band{background:var(--navy-900);color:#fff;padding:56px 0}
:where(html[data-page="urunler"]) .cta-band .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
:where(html[data-page="urunler"]) .cta-band p{color:#b7c4d0;max-width:560px;margin-top:8px}
@media (max-width:900px){:where(html[data-page="urunler"]) .sol{grid-template-columns:1fr;gap:28px;padding:48px 0}
:where(html[data-page="urunler"]) .sol.flip .sol-img{order:0}}
:where(html[data-page="urunler"]) a.thumb{display:block}
:where(html[data-page="urunler"]) .card h3 a:hover{color:var(--accent)}
:where(html[data-page="urunler"]) .sol h2 a:hover{color:var(--navy-700)}
:where(html[data-page="urunler"]) .btn.ghost-d{background:transparent;color:var(--navy-700);border-color:var(--steel-200)}
:where(html[data-page="urunler"]) .btn.ghost-d:hover{border-color:var(--navy-700);background:transparent}
/* kart eşitleme */
:where(html[data-page="urunler"]) .prods{align-items:stretch}
:where(html[data-page="urunler"]) a.thumb, :where(html[data-page="urunler"]) .thumb{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;flex:none;width:100%;border-bottom:1px solid var(--steel-200)}
:where(html[data-page="urunler"]) .card{height:100%}
:where(html[data-page="urunler"]) .card .body{flex:1}
:where(html[data-page="urunler"]) .card details{margin-top:auto}
:where(html[data-page="urunler"]) .acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;padding:0}
:where(html[data-page="urunler"]) .abtn{display:flex;align-items:center;justify-content:center;height:44px;padding:0 12px;border:1px solid var(--steel-200);border-radius:var(--r);background:var(--white);color:var(--navy-700);font:600 14px/1 var(--body);text-align:center;transition:background .18s,color .18s,border-color .18s}
:where(html[data-page="urunler"]) .abtn:hover{border-color:var(--navy-700)}
:where(html[data-page="urunler"]) .abtn.main{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
:where(html[data-page="urunler"]) .abtn.main:hover{background:var(--accent);border-color:var(--accent)}




/* HTML style özniteliklerinden taşınan ortak sınıflar. */

:where(html[data-page]) .inline-style-1{font-weight:400 !important;}

:where(html[data-page]) .inline-style-2{max-width:900px !important;}

:where(html[data-page]) .inline-style-3{margin-top:12px !important;}

:where(html[data-page]) .inline-style-4{padding-top:56px !important;}

:where(html[data-page]) .inline-style-5{--bg:url('../../img/hero-2.svg') !important;}

:where(html[data-page]) .inline-style-6{padding:72px 0 56px !important;}

:where(html[data-page]) .inline-style-7{font-weight:400 !important;margin:0 !important;}

:where(html[data-page]) .inline-style-8{text-decoration:underline !important;}

:where(html[data-page]) .inline-style-9{padding:56px 0 !important;}

:where(html[data-page]) .inline-style-10{margin-bottom:32px !important;}

:where(html[data-page]) .inline-style-11{--bg:url('../../img/hero-1.svg') !important;}

:where(html[data-page]) .inline-style-12{--bg:url('../../img/hero-3.svg') !important;}

:where(html[data-page]) .inline-style-13{padding:64px 0 32px !important;}

:where(html[data-page]) .inline-style-14{padding:32px 0 64px !important;}

:where(html[data-page]) .inline-style-15{padding:0 !important;}

:where(html[data-page]) .inline-style-16{margin:0 !important;}

/* Ortak PHP üst ve alt alanındaki admin logosu. */
:where(html[data-page]) .logo img{display:block;max-width:180px;max-height:48px;object-fit:contain}

:where(html[data-page="index"]) .brand-carousel .item img{height:64px;max-width:100%;object-fit:contain;margin:0 auto}
.logo img{
    width:170px !important;
    height:auto !important;
}
/* Admin ürünleri: tek görsel ve açıklama. */
:where(html[data-page="urun-detay"]) .product-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:2rem;align-items:start}
:where(html[data-page="urun-detay"]) .product-layout>*{min-width:0}
:where(html[data-page="urun-detay"]) .product-image{border:1px solid var(--steel-200);border-radius:var(--r);background:var(--paper);padding:1rem}
:where(html[data-page="urun-detay"]) .product-image img{display:block;width:100%;height:clamp(18rem,60vw,38rem);object-fit:contain}
:where(html[data-page="urun-detay"]) .product-description{overflow-wrap:anywhere;margin-bottom:1.5rem}
:where(html[data-page="urun-detay"]) .product-description img{max-width:100%;height:auto}
:where(html[data-page="urun-detay"]) .product-description table{display:block;max-width:100%;overflow-x:auto}
:where(html[data-page="index"]) .cat .category-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3}
:where(html[data-page="index"]) .cat h3,:where(html[data-page="index"]) .cat span{position:relative}
:where(html[data-page="index"]) .specs>div,:where(html[data-page="urunler"]) .specs>div{min-width:0;overflow-wrap:anywhere}
@media(min-width:1024px){:where(html[data-page="urun-detay"]) .product-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:3rem}}

:where(html[data-page="urun-detay"]) .product-layout.product-no-image{grid-template-columns:minmax(0,1fr)}
@media(min-width:761px) and (max-width:1023px){
:where(html[data-page="urun-detay"]) nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy-700);padding:1rem 1.5rem 1.5rem}
:where(html[data-page="urun-detay"]) nav.open{display:block}
:where(html[data-page="urun-detay"]) nav ul{flex-direction:column;gap:.25rem}
:where(html[data-page="urun-detay"]) .menu-btn{display:block;min-height:44px}
:where(html[data-page="urun-detay"]) header.main .btn{display:none}
}

:where(html[data-page="index"]) .hero-slide img.slide-background{width:100%;height:100%;object-fit:cover;object-position:center}
:where(html[data-page="index"]) .hero-slide .h1,:where(html[data-page="index"]) .hero-slide .lead,:where(html[data-page="index"]) .hero-slide .layers{overflow-wrap:anywhere}