/* ========================================================================== RENK TOKEN'LARI Sitedeki bütün renkler buradaki değişkenlerden gelir. Buradaki değerler varsayılan "Grafit & Sarı" paletidir (tasarımın özgün renkleri). Panelden başka bir palet seçildiğinde SitePalet aynı adları içinde yeniden tanımlar; blok zemini (Görünüm > Arka plan) seçilen bölümlerde .zk-* kapsamları ton ailelerini yeniden eşler. Yeni kural yazarken sabit renk kullanmayın; açık zeminde --metin/--metin2/--cizgi, koyu zeminde --metinKoyuUstu/--metinKoyuUstu2, düğmede --dugme/--dugmeUstu, vurguda --vurgu/--vurguUstu kullanın. ========================================================================== */ :root{ /* açık zeminler, çizgi ve metin */ --kart:#ffffff;--kartRgb:255 255 255;--zemin:#fbfbfa;--zemin2:#efefec;--zemin3:#e7e7e4;--cizgi:#dedfdd;--metin3:#8b8e90;--metin2:#5f6264; --metin:#161719;--metinGuclu:#0e1312;--metinGucluRgb:14 19 18; /* koyu zeminler ve üstlerindeki metin */ --metinKoyuUstu:#ffffff;--metinKoyuUstuRgb:255 255 255;--metinKoyuUstu2:#a8b0af;--metinKoyuUstu3:#8d9695;--panel:#1b2221;--koyu3:#171c1b; --koyu2:#141a19;--koyu:#0e1312; /* fotoğraf ve görsel yer tutucular (blok zemini değişse de sabit) */ --fotoMetin:#ffffff;--fotoMetinRgb:255 255 255;--fotoZemin:#1b2221;--fotoPerde:#0a0e0d; /* düğmeler */ --dugme:#0e1312;--dugmeUstu:#ffffff;--dugmeUstuRgb:255 255 255;--dugmeAcik:#ffffff;--dugmeAcikRgb:255 255 255;--dugmeAcikUstu:#0e1312; /* vurgu */ --vurgu:#f2c400;--vurguRgb:242 196 0;--vurguUstu:#0e1312;--vurguKoyu:#c9a300;--vurguMetin:#f2c400;--vurguAcik:#f2c400;--odakHalka:#f2c400; /* gölge */ --golge:#0e1312;--golgeRgb:14 19 18;--vinyet:#000000;--vinyetRgb:0 0 0; /* durum */ --hata:#9a3a26;--hata2:#b3402c;--hataMetin:#7d2e1f;--hataZemin:#f9eeeb;--basari:#2f7d54;--basariMetin:#1f5c3c;--basariZemin:#eef6f1;--uyari:#8a5a00; --uyariNokta:#c28a12; /* tasarım imzası (telif satırındaki ajans bağlantısı; kendi rengi, koyu zeminde okunaklılığı korunur) */ --imza:#6f93aa;--imzaRgb:111 147 170;--imzaAcik:#8fb6cd; /* ara tonlar: adı varsayılan paletteki değeri taşır (a- açık, k- koyu, f- fotoğraf, d- düğme merdiveni) */ --a-111111:#111111;--a-14211f:#14211f;--a-1c2322:#1c2322;--a-222222:#222222;--a-27292a:#27292a;--a-2c3031:#2c3031;--a-3a3d3f:#3a3d3f; --a-44474a:#44474a;--a-4a4e50:#4a4e50;--a-4c4f51:#4c4f51;--a-555555:#555555;--a-5c5f61:#5c5f61;--a-666666:#666666;--a-66696b:#66696b; --a-686b6d:#686b6d;--a-6b6d6f:#6b6d6f;--a-696c6e:#696c6e;--a-6d7573:#6d7573;--a-707070:#707070;--a-717375:#717375;--a-737373:#737373; --a-7d8082:#7d8082;--a-7d8385:#7d8385;--a-888888:#888888;--a-8a8f90:#8a8f90;--a-8b8f8e:#8b8f8e;--a-999999:#999999;--a-9a9d9f:#9a9d9f; --a-a9adae:#a9adae;--a-aaaaaa:#aaaaaa;--a-b9bcbe:#b9bcbe;--a-cfd0cd:#cfd0cd;--a-d1d2cf:#d1d2cf;--a-d9dcdb:#d9dcdb;--a-dadbd8:#dadbd8; --a-dbdcd9:#dbdcd9;--a-dededb:#dededb;--a-e0e0db:#e0e0db;--a-e4e4e1:#e4e4e1;--a-e6e6e2:#e6e6e2;--a-e6e6e3:#e6e6e3;--a-ececea:#ececea; --a-eceeed:#eceeed;--a-ededeb:#ededeb;--a-eef0ee:#eef0ee;--a-f0f0ed:#f0f0ed;--a-f2f2ef:#f2f2ef;--a-f3f3f0:#f3f3f0;--a-f3f3f1:#f3f3f1; --a-f4f4f1:#f4f4f1;--a-fafaf8:#fafaf8;--a-fafafa:#fafafa; --k-111111:#111111;--k-121817:#121817;--k-161d1c:#161d1c;--k-161d1cRgb:22 29 28;--k-171919:#171919;--k-181a1b:#181a1b;--k-555555:#555555; --k-6b6e70:#6b6e70;--k-6f7877:#6f7877;--k-777777:#777777;--k-7f8988:#7f8988;--k-8b8e90:#8b8e90;--k-98a1a0:#98a1a0;--k-999999:#999999; --k-9aa3a2:#9aa3a2;--k-a9acad:#a9acad;--k-a9b0af:#a9b0af;--k-aaaaaa:#aaaaaa;--k-aab4b1:#aab4b1;--k-b6bdbc:#b6bdbc;--k-bbbbbb:#bbbbbb; --k-c2c9c8:#c2c9c8;--k-c9cbcc:#c9cbcc;--k-c9d0cf:#c9d0cf;--k-cfd6d4:#cfd6d4;--k-d2d4d5:#d2d4d5;--k-dcdedf:#dcdedf;--k-dedfdd:#dedfdd; --k-efefec:#efefec; --f-0e1312:#0e1312;--f-111111:#111111;--f-141a19:#141a19;--f-151a19:#151a19;--f-1c1e1f:#1c1e1f;--f-1c2221:#1c2221;--f-2b2d2e:#2b2d2e; --f-666666:#666666;--f-8a8f90:#8a8f90;--f-999999:#999999;--f-9a9a97:#9a9a97;--f-a1a29f:#a1a29f;--f-d5d7d8:#d5d7d8;--f-dbdbd8:#dbdbd8; --f-dddddd:#dddddd;--f-dededb:#dededb;--f-dfdfdc:#dfdfdc;--f-e1e1de:#e1e1de;--f-ecece9:#ecece9;--f-f8f8f6:#f8f8f6; --perde:#0a0e0d;--perdeRgb:10 14 13;--perde2:#0c0e0f;--perde2Rgb:12 14 15;--perde3:#0a0c0d;--perde3Rgb:10 12 13; --perde4:#0a0b0c;--perde4Rgb:10 11 12; --d-111111:#111111;--d-131a19:#131a19;--d-181a1b:#181a1b;--d-1d1e20:#1d1e20; /* doku (Ayarlar > Site renkleri); yokken saydam tek katman */ --dokuKoyu:linear-gradient(transparent,transparent);--dokuKoyuBoyut:auto;--dokuAcik:linear-gradient(transparent,transparent);--dokuAcikBoyut:auto; /* eski adlar (panelden girilmiş özel HTML için) */ --black:var(--koyu);--black2:var(--koyu2);--dark:var(--k-181a1b);--ink:var(--metin);--muted:var(--a-6b6d6f);--line:var(--cizgi);--grey:var(--zemin2); --grey2:var(--zemin3);--soft:var(--zemin);--yellow:var(--vurgu);--white:var(--kart);--bg:var(--zemin);--lineD:rgb(var(--metinKoyuUstuRgb) / .12); } *{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--kart);color:var(--metin);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden} a{text-decoration:none;color:inherit} button,input,textarea,select{font:inherit} button{cursor:pointer} img{display:block;max-width:100%} .header{ height:72px;padding:0 4vw;position:fixed;top:0;left:0;width:100%;z-index:100; display:flex;align-items:center;background:rgb(var(--kartRgb) / .30); -webkit-backdrop-filter:blur(22px) saturate(175%);backdrop-filter:blur(22px) saturate(175%); border-bottom:1px solid rgb(var(--kartRgb) / .58);box-shadow:0 10px 36px rgba(0,0,0,.08); } .header.scrolled{background:rgb(var(--kartRgb) / .80)} .header>*{position:relative;z-index:1} .logo{display:flex;align-items:center;font-size:20px;font-weight:800;letter-spacing:-1.25px;white-space:nowrap} .nav{margin-left:auto;display:flex;gap:2.1vw;font-size:12px;color:var(--a-27292a)} .hero{width:100%;height:calc(100vh - 72px);min-height:540px;background:var(--k-efefec);position:relative;overflow:hidden} .heroImage{position:absolute;inset:0;background:linear-gradient(120deg,var(--f-ecece9),var(--f-f8f8f6) 55%,var(--f-dfdfdc))} .heroImage:after{content:"HERO / VIDEO";position:absolute;inset:0;display:grid;place-items:center;color:var(--f-a1a29f);font-size:12px;letter-spacing:2.4px} .heroShade{position:absolute;inset:0} .heroText{position:absolute;z-index:2;left:5.9vw;top:50%;transform:translateY(-47%);max-width:650px} .kicker{font-size:12px;letter-spacing:1.9px;color:var(--a-696c6e);text-transform:uppercase;margin-bottom:12px} .hero h1{font-size:5vw;line-height:.84;letter-spacing:-.075em;margin:0;font-weight:800} .hero p{font-size:13px;line-height:1.5;color:var(--k-555555);max-width:390px;margin:18px 0 0} .heroActions{display:flex;align-items:center;gap:14px;margin-top:25px;font-size:12px}.play{width:40px;height:40px;border:1px solid var(--a-222222);border-radius:50%;display:grid;place-items:center}.play:after{content:"";border-left:7px solid var(--a-111111);border-top:5px solid transparent;border-bottom:5px solid transparent;margin-left:2px} .heroMeta{position:absolute;right:4vw;bottom:30px;font-size:12px;line-height:1.35}.heroMeta b{display:block;font-size:17px} .stats{display:grid;grid-template-columns:repeat(5,1fr);height:78px;background:var(--a-ededeb);border-bottom:1px solid var(--a-dbdcd9)}.stat{padding:0 5.9vw;display:flex;flex-direction:column;justify-content:center;border-right:1px solid var(--a-dadbd8)}.stat:last-child{border:0}.stat strong{font-size:22px;letter-spacing:-1px}.stat span{font-size:12px;color:var(--a-686b6d);margin-top:5px} .section{padding:72px 5.9vw}.sectionHead{display:grid;grid-template-columns:1fr 1.25fr auto;gap:4vw;align-items:end;margin-bottom:27px}.sectionHead h2{font-size:32px;line-height:.9;letter-spacing:-.06em;margin:0}.sectionDesc{font-size:12px;line-height:1.55;color:var(--a-666666);max-width:430px} .btn{border:1px solid var(--d-1d1e20);background:var(--dugmeUstu);color:var(--d-111111);padding:12px 15px;font-size:12px;white-space:nowrap}.btn.dark{background:var(--d-181a1b);color:var(--dugmeUstu);border-color:var(--d-181a1b);padding:12px 15px;display:inline-flex;align-items:center;width:max-content} .productGrid{display:grid;grid-template-columns:repeat(5,1fr);border-left:1px solid var(--cizgi);border-top:1px solid var(--cizgi)}.productCard{border-right:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);background:var(--kart)}.mediaPlaceholder{height:178px;background:var(--f-dbdbd8);display:grid;place-items:center;color:var(--f-999999);font-size:12px;letter-spacing:1.8px}.productInfo{height:104px;background:var(--zemin2);padding:14px;position:relative}.productInfo strong{font-size:12px}.productInfo span{display:block;color:var(--a-696c6e);font-size:12px;margin-top:5px}.arrow{position:absolute;right:13px;bottom:12px;font-size:14px} .dark{background:var(--k-171919);color:var(--metinKoyuUstu);padding:72px 5.9vw}.dark .kicker{color:var(--k-aaaaaa)}.dark .sectionDesc{color:var(--k-aaaaaa)}.dark .btn{background:transparent;color:var(--dugmeUstu);border-color:var(--a-737373)} .sectorGrid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.sectorCard{height:175px;background:var(--f-2b2d2e);position:relative;display:flex;align-items:flex-end;padding:12px}.sectorCard:before{content:"IMAGE";position:absolute;inset:0;display:grid;place-items:center;color:var(--f-666666);font-size:12px;letter-spacing:2px}.sectorCard span{position:relative;z-index:2;font-size:12px} .refCarousel{display:flex;align-items:center;gap:10px}.refViewport{overflow:hidden;flex:1}.refTrack{display:flex;gap:9px;transition:transform .45s ease}.refLogo{flex:0 0 calc((100% - 45px)/6);height:66px;background:var(--a-f0f0ed);display:grid;place-items:center;font-size:15px;font-weight:800}.refArrow{width:30px;height:30px;border:1px solid var(--a-cfd0cd);background:var(--kart)} .split{display:grid;grid-template-columns:1.15fr .85fr}.split.reverse{grid-template-columns:.85fr 1.15fr}.splitVisual{min-height:320px;background:var(--f-dededb);display:grid;place-items:center;color:var(--f-999999);font-size:12px;letter-spacing:2px}.splitCopy{min-height:320px;padding:55px 5.9vw;background:var(--k-181a1b);color:var(--metinKoyuUstu);display:flex;flex-direction:column;justify-content:center}.splitCopy.light{background:var(--zemin2);color:var(--a-111111)}.splitCopy .kicker{color:var(--k-aaaaaa)}.splitCopy.light .kicker{color:var(--a-666666)}.splitCopy h3{font-size:34px;line-height:.9;letter-spacing:-.06em;margin:0 0 14px}.splitCopy p{font-size:12px;line-height:1.55;color:var(--k-aaaaaa);max-width:430px}.splitCopy.light p{color:var(--a-666666)} .faq{padding:67px 5.9vw}.faqTop{display:flex;justify-content:space-between;align-items:end;margin-bottom:25px}.faqTop h2{font-size:31px;line-height:.9;letter-spacing:-.06em;margin:0}.faqGrid{display:grid;grid-template-columns:1fr 1fr;gap:0 4vw}.faqItem{min-height:48px;border-top:1px solid var(--cizgi);display:flex;align-items:center;justify-content:space-between;font-size:12px}.faqPanel{display:none;padding:0 0 13px;color:var(--a-737373);font-size:12px;line-height:1.6}.faqPanel.open{display:block} .contact{padding:68px 5.9vw;display:grid;grid-template-columns:.82fr 1.18fr;gap:7vw;background:var(--kart);border-top:1px solid var(--a-ececea)}.contactInfo h2{font-size:34px;line-height:.9;letter-spacing:-.06em;margin:0 0 14px}.contactLead{font-size:12px;line-height:1.55;color:var(--a-666666);max-width:400px}.contactList{border-top:1px solid var(--cizgi);margin-top:26px}.contactList div{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--cizgi)}.contactList span{font-size:12px;letter-spacing:1.2px;color:var(--a-888888)}.contactList strong{font-size:12px}.formWrap{background:var(--zemin2);padding:24px}.form{display:flex;flex-direction:column;gap:12px}.formRow{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form label{font-size:12px;letter-spacing:1px;color:var(--a-555555);display:flex;flex-direction:column;gap:6px}.form input,.form textarea,.form select{border:1px solid var(--a-d1d2cf);background:var(--kart);padding:11px 12px;font-size:12px;outline:none}.form textarea{resize:vertical}.submit{border:1px solid var(--d-111111);background:var(--d-181a1b);color:var(--dugmeUstu);padding:12px 16px;font-size:12px;align-self:flex-start} .cta{width:100%;padding:30px 5.9vw;background:var(--k-181a1b);color:var(--metinKoyuUstu);display:flex;align-items:center;justify-content:space-between}.cta h3{margin:0;font-size:30px;line-height:.9;letter-spacing:-.05em}.cta p{font-size:12px;color:var(--k-aaaaaa);margin:7px 0 0}.cta .btn{background:transparent;color:var(--dugmeUstu);border-color:var(--a-737373)} .footer{padding:45px 5.9vw 18px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:4vw;border-bottom:1px solid var(--k-dedfdd)}.footer p,.footer a{font-size:12px;color:var(--k-777777);display:block;line-height:1.8;margin:0}.footer b{color:var(--k-111111)}.copyright{padding:10px 5.9vw 20px;display:flex;justify-content:space-between;font-size:12px;color:var(--k-999999)} .pageHero{padding:126px 5.9vw 42px;background:var(--zemin2);border-bottom:1px solid var(--cizgi)}.pageHero h1{font-size:52px;line-height:.88;letter-spacing:-.065em;margin:0 0 14px}.pageHero p{font-size:12px;line-height:1.55;color:var(--a-666666);max-width:650px} .filterLayout{display:grid;grid-template-columns:230px 1fr;gap:42px}.filters{border-right:1px solid var(--cizgi);padding-right:24px}.filterTitle{font-size:12px;letter-spacing:1.2px;text-transform:uppercase;margin-bottom:13px}.filterGroup{border-top:1px solid var(--cizgi);padding:15px 0}.filterGroup strong{font-size:12px;display:block;margin-bottom:10px}.filterGroup label{display:flex;gap:7px;align-items:center;font-size:12px;color:var(--a-666666);margin:8px 0}.filterGroup input{accent-color:var(--a-111111)}.fleetTop{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.fleetTop h2{font-size:35px;line-height:.9;letter-spacing:-.06em;margin:0}.count{font-size:12px;color:var(--a-737373)}.fleetGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.fleetCard{border:1px solid var(--cizgi);background:var(--kart)}.fleetImage{height:165px;background:var(--f-dddddd);display:grid;place-items:center;color:var(--f-999999);font-size:12px;letter-spacing:1.8px}.fleetBody{padding:14px}.fleetBody h3{margin:0;font-size:12px}.fleetBody p{margin:6px 0 14px;color:var(--a-737373);font-size:12px;line-height:1.45}.fleetMeta{display:flex;justify-content:space-between;font-size:12px;color:var(--a-666666);border-top:1px solid var(--cizgi);padding-top:10px}.pager{display:flex;justify-content:center;gap:6px;margin-top:26px}.pager button{width:29px;height:29px;border:1px solid var(--cizgi);background:var(--kart);font-size:12px}.pager .active{background:var(--d-111111);color:var(--dugmeUstu);border-color:var(--d-111111)} .detailHero{margin-top:0;width:100%;height:300px;background:var(--f-dddddd);display:grid;place-items:center;color:var(--f-999999);font-size:12px;letter-spacing:2px}.detailIntro{padding:28px 5.9vw 25px;background:var(--kart)}.detailIntro h1{font-size:42px;line-height:.9;letter-spacing:-.06em;margin:0 0 9px}.detailIntro p{max-width:620px;font-size:12px;line-height:1.55;color:var(--a-666666);margin:0}.detailTabs{height:43px;display:flex;align-items:center;gap:30px;padding:0 5.9vw;border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);overflow:auto}.detailTabs a{font-size:12px;height:100%;display:flex;align-items:center;white-space:nowrap}.detailTabs a.active{font-weight:700;border-bottom:2px solid var(--a-111111)}.detailOverview{display:grid;grid-template-columns:1fr .95fr;gap:5vw;padding:37px 5.9vw}.detailOverview h2{font-size:25px;line-height:.9;letter-spacing:-.055em;margin:0 0 12px}.detailOverview p{font-size:12px;line-height:1.65;color:var(--a-666666)}.detailMedia{height:190px;background:var(--f-dddddd);display:grid;place-items:center;color:var(--f-999999);font-size:12px;letter-spacing:1.6px}.detailsSection{padding:0 5.9vw 32px}.detailsSection h2{font-size:20px;line-height:.9;letter-spacing:-.05em;margin:0 0 14px}.specGrid{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--cizgi);border-top:1px solid var(--cizgi)}.spec{min-height:74px;background:var(--a-fafaf8);padding:13px;border-right:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi)}.spec strong{font-size:12px;display:block;margin-bottom:5px}.spec span{font-size:12px;color:var(--a-696c6e)}.configGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.configCard{padding:14px;background:var(--a-f2f2ef);border:1px solid var(--a-e6e6e3)}.configCard h3{font-size:12px;margin:0 0 5px}.configCard p{font-size:12px;color:var(--a-717375);margin:0 0 9px}.configMedia{height:95px;background:var(--f-dddddd);display:grid;place-items:center;color:var(--f-999999);font-size:12px;letter-spacing:1.3px}.projectGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.projectCard{border:1px solid var(--cizgi);background:var(--a-fafaf8)}.projectImg{height:88px;background:var(--f-dddddd);display:grid;place-items:center;color:var(--f-999999);font-size:12px}.projectBody{padding:9px}.projectBody strong{font-size:12px}.projectBody span,.projectBody small{display:block;font-size:12px;color:var(--a-717375);margin-top:4px} .serviceGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.serviceCard{border:1px solid var(--cizgi);padding:22px;background:var(--kart)}.serviceNo{font-size:12px;color:var(--a-999999);margin-bottom:25px}.serviceCard h3{font-size:16px;margin:0 0 8px}.serviceCard p{font-size:12px;line-height:1.55;color:var(--a-666666)}.process{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--cizgi);border-left:1px solid var(--cizgi)}.process>div{padding:20px;border-right:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);min-height:120px}.process strong{display:block;font-size:12px;margin-bottom:9px}.process span{font-size:12px;color:var(--a-666666);line-height:1.5} .solutionHeroGrid{display:grid;grid-template-columns:1.15fr .85fr}.solutionBlock{min-height:310px;background:var(--f-dddddd);display:grid;place-items:center;color:var(--f-999999);font-size:12px;letter-spacing:2px}.solutionCopy{padding:55px;background:var(--k-181a1b);color:var(--metinKoyuUstu)}.solutionCopy h2{font-size:36px;line-height:.9;letter-spacing:-.06em;margin:0 0 13px}.solutionCopy p{font-size:12px;line-height:1.6;color:var(--k-aaaaaa)}.solutionCards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.solutionCard{padding:20px;background:var(--a-f2f2ef);border:1px solid var(--a-e4e4e1)}.solutionCard h3{font-size:13px;margin:0 0 7px}.solutionCard p{font-size:12px;color:var(--a-666666);line-height:1.5} .refStats{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--cizgi);border-top:1px solid var(--cizgi)}.refStat{padding:22px;border-right:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);background:var(--a-f3f3f0)}.refStat strong{font-size:22px;display:block}.refStat span{font-size:12px;color:var(--a-666666)}.refMosaic{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.refTile{min-height:180px;background:var(--f-dddddd);display:grid;place-items:center;color:var(--f-999999);font-size:12px}.refTile.big{grid-row:span 2;min-height:368px}.refTableWrap{padding-top:25px}.refTable{width:100%;border-collapse:collapse;font-size:12px}.refTable th,.refTable td{padding:12px;border-bottom:1px solid var(--cizgi);text-align:left}.refTable th{background:var(--zemin2);font-size:12px;letter-spacing:.8px} .blogGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.article{border:1px solid var(--cizgi);background:var(--kart)}.articleImg{height:190px;background:var(--f-dddddd);display:grid;place-items:center;color:var(--f-999999);font-size:12px;letter-spacing:1.7px}.articleBody{padding:17px}.articleMeta{font-size:12px;letter-spacing:1px;color:var(--a-888888);text-transform:uppercase}.article h3{font-size:15px;line-height:1.08;margin:9px 0}.article p{font-size:12px;line-height:1.55;color:var(--a-666666);margin:0 0 12px}.article .read{font-size:12px} .blogFeature{display:grid;grid-template-columns:1.15fr .85fr;margin-bottom:30px}.blogFeature .articleImg{height:330px}.blogFeature .featureCopy{background:var(--k-181a1b);color:var(--metinKoyuUstu);padding:38px}.blogFeature h2{font-size:34px;line-height:.9;letter-spacing:-.06em;margin:10px 0 15px}.blogFeature p{font-size:12px;line-height:1.6;color:var(--k-aaaaaa)} @media(max-width:900px){ .header{height:60px;padding:0 20px}.nav{display:none} .hero{height:520px;min-height:520px}.heroText{left:22px;top:48%;max-width:82%}.hero h1{font-size:9vw}.hero p{font-size:12px}.heroMeta{right:18px;bottom:18px} .stats{height:auto;grid-template-columns:repeat(5,130px);overflow-x:auto}.stat{padding:16px} .section,.dark,.faq,.contact,.footer,.pageHero,.detailsSection,.configGrid,.application,.projects{padding-left:20px;padding-right:20px} .sectionHead{grid-template-columns:1fr;gap:15px} .productGrid{grid-template-columns:1fr 1fr}.sectorGrid{grid-template-columns:1fr 1fr}.refLogo{flex-basis:calc((100% - 10px)/2)} .split,.split.reverse,.solutionHeroGrid{grid-template-columns:1fr}.splitVisual,.splitCopy{min-height:260px}.splitCopy{padding:40px 24px} .faqTop{display:block}.faqGrid{grid-template-columns:1fr}.contact{grid-template-columns:1fr;gap:28px}.formRow{grid-template-columns:1fr} .cta{display:block}.cta .btn{display:inline-block;margin-top:18px}.footer{grid-template-columns:1fr 1fr}.footer>div:first-child{grid-column:1/-1}.copyright{display:block} .filterLayout{grid-template-columns:1fr}.filters{border-right:0;border-bottom:1px solid var(--cizgi);padding:0 0 18px}.fleetGrid{grid-template-columns:1fr 1fr} .detailOverview{grid-template-columns:1fr;padding:30px 20px}.specGrid{grid-template-columns:1fr 1fr}.projectGrid{grid-template-columns:1fr 1fr}.serviceGrid,.process,.solutionCards{grid-template-columns:1fr 1fr}.refStats{grid-template-columns:1fr 1fr}.refMosaic{grid-template-columns:1fr 1fr}.blogGrid{grid-template-columns:1fr 1fr}.blogFeature{grid-template-columns:1fr}.blogFeature .articleImg{height:240px}.detailHero{height:230px}.detailIntro{padding:25px 20px}.detailTabs{padding:0 20px} } @media(max-width:520px){ .hero h1{font-size:11vw}.productGrid,.fleetGrid,.serviceGrid,.process,.solutionCards,.blogGrid{grid-template-columns:1fr}.sectorGrid,.projectGrid,.refMosaic{grid-template-columns:1fr 1fr}.specGrid,.refStats{grid-template-columns:1fr}.footer{grid-template-columns:1fr 1fr} } /* Product landing CTA safety: avoid .dark section collision */ /* V5 readability & hub pages */ :root{--read:12px;--small:12px} .sectionDesc,.hero p,.pageHero p,.contactLead,.splitCopy p,.featureCopy p,.article p,.fleetBody p,.product-heading p,.detailIntro p,.detailOverview p{font-size:12px!important;line-height:1.65!important} .faqItem{font-size:12px!important}.faqPanel{font-size:12px!important;line-height:1.65!important} .productInfo strong,.productInfo span,.fleetBody h3,.fleetMeta,.contactList strong,.contactList span,.footer p,.footer a,.copyright,.articleMeta,.read,.form label,.form input,.form textarea,.form select{font-size:12px!important} .footer{padding-top:52px!important;padding-bottom:28px!important}.footer p,.footer a{line-height:2!important}.footer b{font-size:13px!important}.copyright{font-size:12px!important} .kicker{font-size:12px!important}.btn,.submit{font-size:12px!important} /* category hubs */ .hubHero{padding:126px 5.9vw 44px;background:var(--zemin2);border-bottom:1px solid var(--cizgi)} .hubHero h1{font-size:52px;line-height:.9;letter-spacing:-.065em;margin:0 0 14px}.hubHero p{font-size:12px;line-height:1.65;color:var(--a-666666);max-width:760px} .subGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.subCard{display:block;border:1px solid var(--cizgi);background:var(--kart);transition:.2s}.subCard:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.06)}.subImg{height:190px;background:var(--f-dededb);display:grid;place-items:center;color:var(--f-9a9a97);font-size:12px;letter-spacing:1.5px}.subBody{padding:16px}.subBody h3{font-size:18px;margin:0 0 8px}.subBody p{font-size:12px;line-height:1.55;color:var(--a-666666);margin:0 0 12px}.subMeta{display:flex;justify-content:space-between;font-size:12px;color:var(--a-666666);border-top:1px solid var(--cizgi);padding-top:10px} .categoryNav{display:flex;gap:9px;flex-wrap:wrap;margin-top:22px}.categoryNav a{padding:9px 12px;border:1px solid var(--cizgi);font-size:12px;background:var(--kart)}.categoryNav a:hover{background:var(--d-111111);color:var(--dugmeUstu)} .article{transition:.2s}.article.hide{display:none} .sectorIntro{display:grid;grid-template-columns:1fr 1fr;gap:10px}.sectorPanel{min-height:240px;background:var(--a-dededb);padding:28px;display:flex;flex-direction:column;justify-content:end}.sectorPanel.darkPanel{background:var(--k-181a1b);color:var(--metinKoyuUstu)}.sectorPanel h3{font-size:28px;line-height:.95;letter-spacing:-.04em;margin:0 0 10px}.sectorPanel p{font-size:12px;line-height:1.6;margin:0;color:var(--a-666666)}.darkPanel p{color:var(--k-bbbbbb)}.sectorCards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.sectorBig{min-height:210px;background:var(--f-e1e1de);padding:20px;display:flex;align-items:end}.sectorBig h3{font-size:22px;margin:0}.sectorBig p{font-size:12px;color:var(--f-666666)} @media(max-width:900px){.subGrid,.sectorCards{grid-template-columns:1fr 1fr}.sectorIntro{grid-template-columns:1fr}.hubHero{padding-left:20px;padding-right:20px}.hubHero h1{font-size:42px}.subBody h3{font-size:16px}} @media(max-width:520px){.subGrid,.sectorCards{grid-template-columns:1fr}.subImg{height:165px}} /* V6 PRODUCT LANDING / REFERENCE FIXES */ .landing-projects{padding:0 5.9vw 38px;background:var(--kart)} .landing-projects .kicker{margin-bottom:7px} .landing-title{font-size:25px;line-height:.95;letter-spacing:-.05em;margin:0 0 16px} .landing-project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px} .lp{border:1px solid var(--cizgi);background:var(--a-fafaf8);min-width:0} .lp-img{height:110px;background:var(--f-dededb);display:grid;place-items:center;color:var(--f-999999);font-size:12px;letter-spacing:1.5px} .lp-body{padding:11px} .lp-body strong{font-size:12px;display:block} .lp-body span,.lp-body small{display:block;font-size:12px;color:var(--a-717375);margin-top:4px} .fleetLink{display:block;color:inherit;height:100%} .fleetLink .fleetCard{height:100%} .fleetLink:hover .fleetCard{box-shadow:0 12px 28px rgba(0,0,0,.07);transform:translateY(-2px)} .fleetLink .fleetCard{transition:transform .2s,box-shadow .2s} .filterTree{display:flex;flex-direction:column;gap:0} .filterTree details{border-top:1px solid var(--cizgi);padding:10px 0} .filterTree details:last-child{border-bottom:1px solid var(--cizgi)} .filterTree summary{cursor:pointer;list-style:none;font-size:12px;font-weight:700;display:flex;justify-content:space-between;align-items:center} .filterTree summary::-webkit-details-marker{display:none} .filterTree summary:after{content:"+";font-size:13px;font-weight:400} .filterTree details[open] summary:after{content:"−"} .filterChildren{padding:7px 0 0 8px} .filterChildren label{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--a-666666);margin:8px 0} .filterChildren input{accent-color:var(--a-111111)} .filterClear{margin-top:14px;font-size:12px;border:0;background:none;text-decoration:underline;padding:0} .fleetTop .count{font-size:12px} .fleetGrid{align-items:stretch} .blogGrid .article.hide{display:none} .blogFilters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 26px} .blogFilter{border:1px solid var(--cizgi);background:var(--kart);padding:10px 14px;font-size:12px} .blogFilter.active{background:var(--d-181a1b);color:var(--dugmeUstu);border-color:var(--d-181a1b)} @media(max-width:900px){ .landing-project-grid{grid-template-columns:1fr 1fr} .filterTree{display:grid;grid-template-columns:1fr 1fr;gap:0 18px} } @media(max-width:520px){ .landing-project-grid{grid-template-columns:1fr} .filterTree{grid-template-columns:1fr} } .detailIntro .btn.dark{background:var(--d-181a1b)!important;color:var(--dugmeUstu)!important;border-color:var(--d-181a1b)!important;padding:12px 15px!important;width:max-content!important;display:inline-flex!important;align-items:center!important} /* =========================================================== GERÇEK GÖRSELLER — V7 Yer tutucular gerçek fotoğraflarla değiştirildi. Token, font ve punto değerlerine dokunulmadı. =========================================================== */ /* logo: CSS çubukları yerine gerçek marka logosu */ .logo{gap:0} .logo img{height:26px;width:auto;display:block} .logo .logoText{display:none} .footer .logo img{height:24px} .dark .logo img,.splitCopy .logo img{filter:brightness(0) invert(1)} /* --- hero: video + poster --- */ .heroImage{background:var(--f-1c1e1f)} .heroImage:after{display:none} .heroImage video,.heroImage img{width:100%;height:100%;object-fit:cover;display:block} .heroShade{background: linear-gradient(90deg,rgb(var(--perde2Rgb) / .78),rgb(var(--perde2Rgb) / .45) 46%,rgb(var(--perde2Rgb) / .12) 78%), linear-gradient(0deg,rgb(var(--perde2Rgb) / .62),rgb(var(--perde2Rgb) / 0) 42%)} .hero h1,.hero .kicker,.heroMeta b{color:var(--metinKoyuUstu)} .hero p{color:var(--k-dcdedf)} .hero .kicker{color:var(--k-d2d4d5)} .heroActions{color:var(--metinKoyuUstu)} .heroMeta{color:var(--k-c9cbcc)} .hero .play{width:58px;height:58px;border:1px solid rgb(var(--metinKoyuUstuRgb) / .65);border-radius:50%;display:grid;place-items:center;background:rgb(var(--metinKoyuUstuRgb) / .08);cursor:pointer;padding:0;transition:background .2s ease,border-color .2s ease} .hero .play:after{content:"";border-left:12px solid var(--metinKoyuUstu);border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:4px;transition:border-left-color .2s ease} .hero .play:hover{background:var(--vurgu);border-color:var(--vurgu)} .hero .play:hover:after{border-left-color:var(--vurguUstu)} /* --- ürün kartları --- */ .mediaPlaceholder{padding:0;overflow:hidden;background:var(--f-dbdbd8)} .mediaPlaceholder img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1)} .productCard:hover .mediaPlaceholder img{transform:scale(1.045)} /* --- sektör kartları --- */ .sectorCard{overflow:hidden} .sectorCard:before{display:none} .sectorCard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62;transition:transform .8s cubic-bezier(.2,.7,.2,1),opacity .35s ease} .sectorCard:hover img{transform:scale(1.06);opacity:.5} .sectorCard:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgb(var(--perde3Rgb) / .86),rgb(var(--perde3Rgb) / 0) 62%)} .sectorCard span{z-index:3;color:var(--fotoMetin);font-weight:600} /* --- split görselleri --- */ .splitVisual{padding:0;overflow:hidden;background:var(--f-dededb);color:transparent;font-size:0} .splitVisual img{width:100%;height:100%;min-height:320px;object-fit:cover;display:block} /* --- alt ürün / filo / detay / proje / makale görselleri --- */ .subImg,.fleetImage,.detailMedia,.projectImg,.articleImg{padding:0;overflow:hidden;color:transparent;font-size:0} .subImg img,.fleetImage img,.detailMedia img,.projectImg img,.articleImg img{ width:100%;height:100%;object-fit:cover;display:block; transition:transform .8s cubic-bezier(.2,.7,.2,1); } .subCard:hover .subImg img,.fleetCard:hover .fleetImage img,.projectCard:hover .projectImg img{transform:scale(1.045)} .detailMedia{min-height:300px} .detailMedia img{min-height:300px} .articleImg{min-height:170px} .projectImg{min-height:130px} /* --- referans logoları --- */ .refLogo{letter-spacing:-.4px;color:var(--a-44474a);transition:background .25s ease,color .25s ease} .refLogo:hover{background:var(--zemin3);color:var(--a-111111)} /* --- sektör sayfası panelleri --- */ .sectorBig{position:relative;overflow:hidden;color:var(--fotoMetin)} .sectorBig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.6} .sectorBig:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgb(var(--perde3Rgb) / .85),rgb(var(--perde3Rgb) / 0) 66%)} .sectorBig h3,.sectorBig p{position:relative;z-index:2} .sectorBig h3{color:var(--fotoMetin)} .sectorBig p{color:var(--f-d5d7d8)} @media(prefers-reduced-motion:reduce){*{transition-duration:.001ms!important;animation-duration:.001ms!important}} /* =========================================================== V8 — ekran görüntüsündeki bölüm düzeni =========================================================== */ /* fotoğraf + koyu panel, tek satır */ .duo{display:grid;grid-template-columns:1.32fr .68fr;gap:10px;padding:10px 5.9vw 0} .duoPhoto{position:relative;display:block;min-height:330px;overflow:hidden;background:var(--f-dededb)} .duoPhoto img{width:100%;height:100%;min-height:330px;object-fit:cover;display:block;transition:transform .9s cubic-bezier(.2,.7,.2,1)} .duoPhoto:hover img{transform:scale(1.04)} .duoPhoto:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgb(var(--perde4Rgb) / .82),rgb(var(--perde4Rgb) / .32) 62%,rgb(var(--perde4Rgb) / .08))} .duoPhotoCopy{position:absolute;left:34px;bottom:34px;right:34px;z-index:2;color:var(--fotoMetin)} .duoPhotoCopy h3{font-size:clamp(20px,2.1vw,30px);line-height:1.08;letter-spacing:-.05em;margin:0 0 18px;font-weight:800;color:var(--fotoMetin)} .duoDark{background:var(--k-171919);color:var(--metinKoyuUstu);padding:clamp(30px,3vw,46px);display:flex;flex-direction:column;justify-content:center;min-height:330px} .duoDark h3{font-size:clamp(22px,2.3vw,32px);line-height:1.06;letter-spacing:-.05em;margin:0 0 16px;font-weight:800;color:var(--metinKoyuUstu)} .duoDark p{font-size:12px;line-height:1.7;color:var(--k-a9acad);margin:0 0 24px;max-width:38ch} .duoDark .ghostBtn,.duoPhotoCopy .ghostBtn{align-self:flex-start;width:auto} .ghostBtn{display:inline-flex;align-items:center;background:transparent;border:1px solid rgb(var(--metinKoyuUstuRgb) / .55);color:var(--metinKoyuUstu); padding:12px 16px;font-size:12px;letter-spacing:1.1px;font-weight:600;transition:background .2s ease,color .2s ease,border-color .2s ease} .ghostBtn:hover{background:var(--metinKoyuUstu);color:var(--vurguUstu);border-color:var(--metinKoyuUstu)} @media(max-width:900px){ .duo{grid-template-columns:1fr;padding:10px 20px 0} .duoPhoto,.duoPhoto img,.duoDark{min-height:250px} .duoPhotoCopy{left:20px;right:20px;bottom:22px} } /* sektör şeridi göstergesi */ .railNav{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:18px} .railCount{font-size:12px;letter-spacing:1.4px;color:var(--k-8b8e90)} .railCount b{color:var(--metinKoyuUstu);font-weight:700} .railLine{width:120px;height:1px;background:rgb(var(--metinKoyuUstuRgb) / .22);position:relative;display:block} .railLine i{position:absolute;left:0;top:0;height:1px;width:34%;background:var(--vurgu);display:block;transition:left .35s ease} .railBtn{width:28px;height:28px;border:1px solid rgb(var(--metinKoyuUstuRgb) / .3);background:transparent;color:var(--metinKoyuUstu);font-size:12px; display:grid;place-items:center;transition:background .2s ease,color .2s ease} .railBtn:hover{background:var(--metinKoyuUstu);color:var(--k-111111);border-color:var(--metinKoyuUstu)} /* SSS kutuları — ekran görüntüsündeki çerçeveli satırlar */ .faq{background:var(--a-fafafa)} .faqGrid{column-gap:14px} .faqItem{border:1px solid var(--cizgi);border-top:1px solid var(--cizgi);background:var(--kart);padding:0 16px;height:52px; margin-bottom:10px;font-size:12px;transition:border-color .2s ease,background .2s ease} .faqItem:last-child{border-bottom:1px solid var(--cizgi)} .faqItem:hover{border-color:var(--a-b9bcbe)} .faqItem b{font-size:15px;font-weight:400;color:var(--a-7d8082)} .faqPanel.open{border:1px solid var(--cizgi);border-top:0;background:var(--kart);margin:-10px 0 10px;padding:0 16px 15px} /* koyu CTA bandı */ .ctaBand{width:100%;background:var(--k-171919);color:var(--metinKoyuUstu);padding:clamp(28px,3vw,42px) 5.9vw;margin:0; display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap} .ctaBand h3{font-size:clamp(22px,2.2vw,30px);line-height:1.04;letter-spacing:-.05em;margin:0 0 8px;font-weight:800;color:var(--metinKoyuUstu)} .ctaBand p{font-size:12px;color:var(--k-a9acad);margin:0} @media(max-width:900px){.ctaBand{margin:0;padding:30px 5.9vw;width:100%}} /* yeni kategori sayfalarındaki teknik künye kutuları */ .specItem{min-height:76px;background:var(--a-fafaf8);padding:14px;border-right:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi)} .specItem strong{display:block;font-size:12px;line-height:1.4;margin-bottom:5px;color:var(--a-111111)} .specItem span{display:block;font-size:12px;line-height:1.6;color:var(--a-696c6e)} .subCard{display:block} /* ========================================================================== ASR VİNÇ — V9 Doku: 08 ışık düşümü · Koyu: var(--koyu) / var(--koyu2) / kart var(--panel) Logo hariç görsel yok; tüm alanlar panelden doldurulacak. ========================================================================== */ :root{ --ez:cubic-bezier(.2,.7,.2,1); } /* --- doku 08: ışık düşümü --- */ body{background:var(--zemin)} .dark,.sectors,.cta,.ctaBand,.duoDark,.splitCopy,.footer,.pageTop{position:relative} .dark,.sectors,.cta,.ctaBand,.duoDark,.splitCopy:not(.light),.footer,.pageTop{ background-color:var(--koyu) !important; background-image:var(--dokuKoyu),radial-gradient(130% 90% at 14% 0%,rgb(var(--metinKoyuUstuRgb) / .085),transparent 56%), radial-gradient(90% 75% at 94% 100%,rgb(var(--vinyetRgb) / .55),transparent 62%) !important; background-size:var(--dokuKoyuBoyut),auto,auto; } .section,.faq,.references,.contact-section,.contact{ background-image:var(--dokuAcik),radial-gradient(120% 80% at 10% 0%,rgb(var(--kartRgb) / .9),transparent 55%), radial-gradient(85% 70% at 95% 100%,rgb(var(--golgeRgb) / .05),transparent 60%); background-size:var(--dokuAcikBoyut),auto,auto; } .stats{background:var(--a-f3f3f0)} /* ==================== ÜST ŞERİT ==================== */ .topbar{background:var(--koyu);color:var(--k-98a1a0);font-size:12.5px;padding:0 4vw} .tbin{display:flex;align-items:center;gap:22px;height:40px;max-width:1500px;margin:0 auto} .topbar a,.topbar span{display:inline-flex;align-items:center;gap:7px;color:var(--k-c2c9c8);white-space:nowrap} .topbar a:hover{color:var(--metinKoyuUstu)} .topbar svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto} .topbar svg.fill,.topbar .fill{fill:currentColor;stroke:none} .tbsep{flex:1} .tbsoc{display:flex;gap:15px} .tbsoc a svg{width:15px;height:15px} @media(max-width:900px){.topbar .hideSm{display:none}.tbin{gap:14px}} /* ==================== HEADER ==================== */ .header{position:sticky;top:0;z-index:100;height:auto;padding:0; background:rgb(var(--kartRgb) / .9);-webkit-backdrop-filter:blur(20px) saturate(170%);backdrop-filter:blur(20px) saturate(170%); border-bottom:1px solid rgb(var(--golgeRgb) / .09);box-shadow:0 10px 30px -22px rgb(var(--golgeRgb) / .5)} .hin{display:flex;align-items:center;gap:3vw;height:80px;padding:0 4vw;max-width:1500px;margin:0 auto} .header .logo{display:flex;align-items:center;flex:0 0 auto;font-size:0} .header .logo img{height:38px;width:auto} .nav{display:none;margin-left:auto;align-items:center;gap:clamp(2px,1vw,18px);list-style:none;padding:0} @media(min-width:1240px){.nav{display:flex}} .nav>li{list-style:none;position:static} .nav>li>a{display:inline-flex;align-items:center;gap:6px;padding:12px 10px;position:relative; font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--a-1c2322);white-space:nowrap; transition:color .18s var(--ez)} .nav>li>a:after{content:"";position:absolute;left:10px;right:100%;bottom:6px;height:2px;background:var(--vurgu);transition:right .28s var(--ez)} .nav>li>a:hover:after,.nav>li[data-open="true"]>a:after{right:10px} .nav .chev{width:10px;height:10px;opacity:.45;transition:transform .25s var(--ez)} .nav>li[data-open="true"] .chev{transform:rotate(180deg)} .hend{display:flex;align-items:center;gap:12px;margin-left:auto} @media(min-width:1240px){.hend{margin-left:8px}} /* dil seçici */ .langBtn{position:relative;display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid var(--cizgi); background:var(--kart);font-size:12.5px;font-weight:700;letter-spacing:.04em;cursor:pointer} .langBtn .fl{width:20px;height:14px;overflow:hidden;flex:0 0 auto;display:block} .langBtn .fl svg{width:20px;height:14px;display:block} .langMenu{position:absolute;top:calc(100% + 6px);right:0;min-width:158px;background:var(--kart);border:1px solid var(--cizgi); box-shadow:0 18px 40px -20px rgb(var(--golgeRgb) / .45);opacity:0;visibility:hidden;transform:translateY(-6px); transition:.2s var(--ez);z-index:130;text-align:left} .langBtn[aria-expanded="true"] .langMenu{opacity:1;visibility:visible;transform:none} .langMenu a{display:flex;align-items:center;gap:9px;padding:11px 13px;font-size:13px;font-weight:600;color:var(--a-1c2322)} .langMenu a:hover{background:var(--zemin2)} .quote{display:none;align-items:center;background:var(--dugme);color:var(--dugmeUstu);padding:14px 20px; font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;transition:background .2s var(--ez),color .2s var(--ez)} .quote:hover{background:var(--vurgu);color:var(--vurguUstu)} @media(min-width:1440px){.quote{display:inline-flex}} @media(min-width:1240px) and (max-width:1439px){ .hin{gap:1.4vw}.nav{gap:1px} .nav>li>a{font-size:12px;padding:12px 7px;letter-spacing:.05em} .nav>li>a:after{left:7px}.nav>li>a:hover:after,.nav>li[data-open="true"]>a:after{right:7px} } /* mega menü */ .mega{position:absolute;top:calc(100% + 1px);left:50%;transform:translate(-50%,-8px);width:min(1080px,94vw); background:var(--kart);border:1px solid var(--cizgi);box-shadow:0 34px 64px -30px rgb(var(--golgeRgb) / .5); padding:26px;opacity:0;visibility:hidden;transition:opacity .2s var(--ez),transform .2s var(--ez),visibility .2s;z-index:120} .mega:before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px} .nav>li[data-open="true"] .mega{opacity:1;visibility:visible;transform:translate(-50%,0)} .megaGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:4px 28px} .megaSmall{width:min(430px,94vw)} .megaSmall .megaGrid{grid-template-columns:1fr} .megaCol h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--a-9a9d9f);font-weight:700; margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid var(--cizgi)} .megaCol a{display:flex;align-items:center;gap:10px;padding:9px 8px;margin-left:-8px;font-size:13.5px;font-weight:600;color:var(--a-1c2322);transition:background .18s var(--ez)} .megaCol a:hover{background:var(--zemin2)} .megaCol a svg{width:19px;height:19px;flex:0 0 auto;color:var(--a-8b8f8e);fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round} .megaCol a:hover svg{color:var(--vurguMetin)} .megaCol a small{display:block;font-size:12px;font-weight:400;color:var(--a-8b8f8e);margin-top:2px} .megaFoot{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:22px;padding-top:18px;border-top:1px solid var(--cizgi)} .megaFoot p{font-size:12.5px;color:var(--a-6b6d6f);margin:0} .megaFoot a{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase} /* burger + mobil çekmece */ .burger{display:grid;place-items:center;width:44px;height:44px;margin-right:-8px;border:0;background:none} @media(min-width:1240px){.burger{display:none}} .burger i,.burger i:before,.burger i:after{display:block;width:22px;height:2px;background:var(--metinGuclu);transition:transform .3s var(--ez),top .3s var(--ez),opacity .2s} .burger i{position:relative} .burger i:before,.burger i:after{content:"";position:absolute;left:0} .burger i:before{top:-7px}.burger i:after{top:7px} .burger[aria-expanded="true"] i{transform:rotate(45deg)} .burger[aria-expanded="true"] i:before{top:0;transform:rotate(-90deg)} .burger[aria-expanded="true"] i:after{opacity:0} .mdrawer{position:fixed;top:120px;left:0;right:0;bottom:0;z-index:98;background:var(--kart);padding:10px 4vw 50px; overflow-y:auto;opacity:0;visibility:hidden;transition:.25s var(--ez)} .mdrawer[data-open="true"]{opacity:1;visibility:visible} .mdrawer>a,.mgroup>button{display:flex;width:100%;justify-content:space-between;align-items:center; padding:16px 0;border-bottom:1px solid var(--cizgi);font-size:14px;font-weight:700;letter-spacing:.06em; text-transform:uppercase;color:var(--metinGuclu);background:none;border-left:0;border-right:0;border-top:0;text-align:left} .mgroup .msub{display:none;padding:4px 0 12px 12px} .mgroup[data-open="true"] .msub{display:block} .mgroup .msub a{display:block;padding:11px 0;font-size:13.5px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--a-6b6d6f)} .quoteM{justify-content:center !important;margin-top:20px;background:var(--dugme);color:var(--dugmeUstu);border:0 !important;padding:16px !important} @media(min-width:1240px){.mdrawer{display:none}} /* ==================== SAYFA BAŞLIĞI ALANI ==================== */ .pageTop{position:relative;overflow:hidden;color:var(--metinKoyuUstu);padding:0} .ptMedia{position:absolute;inset:0;display:grid;place-items:center} .ptIn{position:relative;z-index:2;max-width:1500px;margin:0 auto;padding:clamp(46px,5.4vw,80px) 4vw clamp(50px,5.8vw,86px)} .crumbs{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:12.5px;color:var(--k-9aa3a2)} .crumbs a{color:var(--k-9aa3a2)} .crumbs a:hover{color:var(--metinKoyuUstu)} .crumbs svg{width:12px;height:12px;opacity:.45;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} .crumbs span{color:var(--metinKoyuUstu)} .pageTop .kicker{color:var(--metinKoyuUstu2);margin-top:30px;margin-bottom:10px} .pageTop h1{font-size:clamp(30px,3.6vw,52px);line-height:1;letter-spacing:-.05em;font-weight:800;margin:26px 0 0;color:var(--metinKoyuUstu);max-width:20ch} .pageTop .kicker + h1{margin-top:0} .ptLead{font-size:13.5px;line-height:1.8;color:var(--metinKoyuUstu2);margin:18px 0 0;max-width:66ch} .ptCta{margin-top:26px} .ptCta .btn{background:transparent;border:1px solid rgb(var(--dugmeAcikRgb) / .5);color:var(--dugmeAcik)} .ptCta .btn:hover{background:var(--dugmeAcik);color:var(--dugmeAcikUstu)} .navRow{padding-top:26px !important;padding-bottom:0 !important} /* ==================== GÖRSEL YER TUTUCULARI ==================== */ .phLabel{ position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center; gap:6px;background:var(--fotoZemin);color:rgb(var(--fotoMetinRgb) / .42); background-image:radial-gradient(120% 90% at 16% 0%,rgb(var(--fotoMetinRgb) / .07),transparent 58%), radial-gradient(90% 75% at 92% 100%,rgba(0,0,0,.45),transparent 62%); font-size:12px;letter-spacing:.16em;font-weight:700;text-align:center;padding:14px;line-height:1.5; } .phLabel small{display:block;font-size:12px;letter-spacing:.03em;font-weight:400;color:rgb(var(--fotoMetinRgb) / .3);text-transform:none} /* yer tutucu kapsayıcıları konumlanabilir olmalı */ .mediaPlaceholder,.subImg,.fleetImage,.detailMedia,.projectImg,.articleImg,.splitVisual, .duoPhoto,.heroImage,.sectorCard,.refTile,.solutionBlock,.configMedia,.sectorBig,.ph16{position:relative;overflow:hidden} .mediaPlaceholder,.subImg,.fleetImage,.detailMedia,.projectImg,.articleImg,.configMedia{background:var(--fotoZemin)} .splitVisual,.duoPhoto{background:var(--fotoZemin);min-height:340px} .duoPhoto:after{display:none} .duoPhotoCopy{z-index:3} .sectorCard:after{background:linear-gradient(0deg,rgb(var(--perde3Rgb) / .55),rgb(var(--perde3Rgb) / 0) 70%)} .sectorCard:hover .phLabel{color:rgb(var(--fotoMetinRgb) / .55)} .heroImage .phLabel{font-size:12px} /* ==================== TİPOGRAFİ DÜZELTMELERİ ==================== */ .stat strong{font-size:clamp(24px,2.4vw,34px);letter-spacing:-.035em;line-height:1.05} .stat span{font-size:13px !important;color:var(--metin2) !important;margin-top:10px;line-height:1.5} .stats{border-bottom:1px solid var(--cizgi)} .process .step h4,.process h4{font-size:15px !important} .process p,.processStep p{font-size:13px !important;line-height:1.7 !important} .processStep b,.process b{font-size:13px !important} .sectionDesc,.hero p,.contactLead,.splitCopy p,.featureCopy p,.article p,.fleetBody p, .product-heading p,.detailIntro p,.subBody p,.ptLead{font-size:13.5px !important;line-height:1.8 !important} .faqItem{font-size:13px !important;height:auto;min-height:56px;padding:14px 16px} .faqPanel{font-size:13px !important;line-height:1.8 !important} .specItem strong{font-size:13px} .specItem span{font-size:13px} .spec strong{font-size:12.5px !important} .spec span{font-size:12.5px !important} .footer p,.footer a{font-size:13px} .copyright{font-size:12px} .productInfo strong{font-size:14px} .productInfo span{font-size:12.5px !important;color:var(--a-696c6e)} .fleetBody h3,.subBody h3{font-size:16px} /* ürün kartı alt satırı: solda etiket, sağda ok */ .productInfo{display:flex;flex-direction:column;height:auto;min-height:118px;padding:16px} .productMeta{margin-top:auto;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:10px} .productMeta em{font-style:normal;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--a-696c6e)} .productCard:hover .productMeta em{color:var(--metinGuclu)} .productInfo .arrow{position:static;font-size:15px} /* ==================== FOOTER (KOYU) ==================== */ .footer{background:var(--koyu);color:var(--k-98a1a0);border-bottom:0;padding:clamp(48px,5.4vw,78px) 4vw clamp(30px,3vw,44px); max-width:none;display:grid;gap:4vw;grid-template-columns:2.1fr 1fr 1fr 1fr 1fr} .footer>div{min-width:0} .footer .logo{display:inline-flex;font-size:0;margin-bottom:18px} .footer .logo img{height:32px;width:auto} .footer p,.footer a{color:var(--k-98a1a0);font-size:13px;line-height:1.85;display:block;margin:0} .footer a:hover{color:var(--metinKoyuUstu)} .footer b{color:var(--metinKoyuUstu);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;display:block;margin-bottom:10px} .ftContact{margin-top:16px !important} .ftContact a{color:var(--metinKoyuUstu) !important;font-weight:600} .ftLang{margin-top:22px !important} .ftSoc{display:flex;gap:14px;margin-top:22px} .ftSoc a{width:36px;height:36px;border:1px solid rgb(var(--metinKoyuUstuRgb) / .12);display:grid;place-items:center;transition:background .2s var(--ez),border-color .2s var(--ez)} .ftSoc a:hover{background:var(--metinKoyuUstu);border-color:var(--metinKoyuUstu)} .ftSoc svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7} .ftSoc svg.fill,.ftSoc .fill{fill:currentColor;stroke:none} .ftSoc a:hover svg{color:var(--koyu)} .copyright{background:var(--koyu);color:var(--k-6f7877);padding:18px 4vw 26px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;border-top:1px solid rgb(var(--metinKoyuUstuRgb) / .12)} @media(max-width:1000px){.footer{grid-template-columns:1fr 1fr}.footer>div:first-child{grid-column:1/-1}} @media(max-width:620px){.footer{grid-template-columns:1fr}} /* koyu bölüm kartları */ .sectors .sectorCard,.dark .fleetCard,.dark .card{background:var(--fotoZemin)} .cta,.ctaBand{border-top:1px solid rgb(var(--metinKoyuUstuRgb) / .12)} /* sektör kartı: aşırı beyaz hover kaldırıldı */ .sectorCard:hover{background:var(--fotoZemin)} .sectorCard span{color:var(--fotoMetin);font-size:13px;font-weight:600;letter-spacing:.01em} /* hero yer tutucusu */ .hero{background:var(--panel)} .heroImage{background:var(--fotoZemin) !important; background-image:radial-gradient(130% 90% at 14% 0%,rgb(var(--fotoMetinRgb) / .08),transparent 56%), radial-gradient(90% 75% at 94% 100%,rgba(0,0,0,.5),transparent 62%) !important;z-index:0} .heroImage:after{display:none !important} /* ana sayfa hero: görselin üstü net kalır, yalnız yazı alanında geçiş olur */ .heroShade{z-index:1;top:auto;bottom:0;height:58%; background:linear-gradient(180deg,rgb(var(--golgeRgb) / 0) 0%,rgb(var(--golgeRgb) / .78) 100%)} .heroText{z-index:2} .heroMeta{z-index:2} .heroImage .phLabel{background:transparent;background-image:none;color:rgb(var(--fotoMetinRgb) / .34)} .gridMore{display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding:26px 0 0} .gridMore p{font-size:13px;color:var(--a-6b6d6f);margin:0;max-width:52ch;line-height:1.7} /* --- düz metin sayfaları (yasal) --- */ .prose,.legal{max-width:78ch;padding:0} .legal h2{font-size:20px;line-height:1.25;letter-spacing:-.03em;margin:34px 0 12px;font-weight:800} .legal h2:first-child{margin-top:0} .legal p{font-size:14px;line-height:1.85;color:var(--a-5c5f61);margin:0 0 12px} /* sayfa başlığı arka plan yer tutucusu köşeye çekildi */ .ptMedia .phLabel{align-items:flex-end;justify-content:flex-end;padding:20px 24px;text-align:right; background:transparent;background-image:none;color:rgb(var(--fotoMetinRgb) / .26);letter-spacing:.14em} .ptMedia .phLabel small{color:rgb(var(--fotoMetinRgb) / .2)} .pageTop .ptIn{padding-bottom:clamp(58px,6.4vw,96px)} /* sektör panelleri: arka plan alanı */ .sectorPanel{position:relative;overflow:hidden} .sectorPanel .panelIn{position:relative;z-index:2} .sectorPanel.darkPanel{background:var(--koyu)} .sectorPanel.lightPanel{background:var(--panel);color:var(--metinKoyuUstu)} .sectorPanel.lightPanel h3{color:var(--metinKoyuUstu)} .sectorPanel.lightPanel p{color:var(--metinKoyuUstu2)} .sectorPanel .phLabel{align-items:flex-end;justify-content:flex-end;padding:18px;text-align:right; background:transparent;background-image:none;color:rgb(var(--fotoMetinRgb) / .22)} .sectorPanel p{font-size:13.5px !important;line-height:1.8 !important} /* çözümler süreç adımları büyütüldü */ .processBig div{padding:20px 0} .processBig strong{font-size:15px !important;letter-spacing:-.01em;display:block;margin-bottom:7px} .processBig span{font-size:13.5px !important;line-height:1.8 !important;color:var(--k-6b6e70)} /* terminoloji bilgi şeridi */ .infoStrip{padding-top:0 !important} .infoStripIn{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap; background:var(--panel);color:var(--metinKoyuUstu);padding:clamp(26px,3vw,40px); background-image:radial-gradient(120% 90% at 14% 0%,rgb(var(--metinKoyuUstuRgb) / .07),transparent 58%),radial-gradient(90% 75% at 92% 100%,rgb(var(--vinyetRgb) / .45),transparent 62%)} .infoStripIn h2{color:var(--metinKoyuUstu);font-size:clamp(22px,2.2vw,30px);line-height:1.05;letter-spacing:-.045em;margin:10px 0 8px} .infoStripIn .kicker{color:var(--metinKoyuUstu3)} .infoStripIn p{color:var(--metinKoyuUstu2) !important;max-width:62ch} .infoStripIn .btn{background:var(--dugmeAcik);color:var(--dugmeAcikUstu);border-color:var(--dugmeAcik)} .infoStripIn .btn:hover{background:var(--vurgu);border-color:var(--vurgu)} /* ==================== YEDEK PARÇA — KATALOG ==================== */ .shopBar{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:20px} .shopChips{display:flex;gap:8px;flex-wrap:wrap} .shopChip{padding:10px 16px;border:1px solid var(--cizgi);background:var(--kart);font-size:12.5px;font-weight:600; letter-spacing:.02em;color:var(--a-3a3d3f);transition:background .2s var(--ez),color .2s var(--ez),border-color .2s var(--ez)} .shopChip:hover{border-color:var(--metinGuclu)} .shopChip.on{background:var(--dugme);color:var(--dugmeUstu);border-color:var(--dugme)} .shopCount{font-size:12.5px;color:var(--a-6b6d6f)} .shopGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px} @media(max-width:1100px){.shopGrid{grid-template-columns:repeat(2,1fr)}} @media(max-width:620px){.shopGrid{grid-template-columns:1fr}} .shopCard{display:flex;flex-direction:column;border:1px solid var(--cizgi);background:var(--kart); transition:border-color .25s var(--ez),box-shadow .3s var(--ez),transform .3s var(--ez)} .shopCard:hover{border-color:var(--metinGuclu);box-shadow:0 20px 44px -30px rgb(var(--golgeRgb) / .45);transform:translateY(-2px)} .shopCard.hide{display:none} .shopImg{position:relative;height:150px;overflow:hidden;background:var(--fotoZemin)} .shopBody{padding:16px;display:flex;flex-direction:column;gap:7px;flex:1} .shopCat{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--a-9a9d9f)} .shopBody h3{font-size:15px;line-height:1.3;letter-spacing:-.02em;margin:0} .shopBody p{font-size:12.5px;line-height:1.7;color:var(--a-6b6d6f);margin:0} .shopFoot{margin-top:auto;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--cizgi)} .shopSpec{font-size:12px;color:var(--a-3a3d3f);font-weight:600} .shopBtn{border:1px solid var(--dugme);background:transparent;color:var(--dugme);padding:9px 13px; font-size:12px;font-weight:700;letter-spacing:.04em;transition:background .2s var(--ez),color .2s var(--ez)} .shopBtn:hover{background:var(--dugme);color:var(--dugmeUstu)} .shopBtn.added{background:var(--vurgu);border-color:var(--vurgu);color:var(--vurguUstu)} .shopNote{margin-top:22px;padding:18px 20px;background:var(--zemin2);border-left:3px solid var(--vurgu);font-size:13.5px;line-height:1.8;color:var(--a-4c4f51)} .shopNote b{color:var(--metinGuclu)} /* teklif listesi */ .shopCartFab{position:fixed;right:20px;bottom:20px;z-index:96;background:var(--dugme);color:var(--dugmeUstu); padding:14px 20px;font-size:12.5px;font-weight:700;letter-spacing:.05em;display:inline-flex;align-items:center;gap:10px; box-shadow:0 16px 34px -16px rgb(var(--golgeRgb) / .7)} .shopCartFab span{background:var(--vurgu);color:var(--vurguUstu);min-width:22px;height:22px;display:grid;place-items:center;font-size:12px} .shopCart{position:fixed;right:20px;bottom:76px;z-index:97;width:min(330px,88vw);background:var(--kart);border:1px solid var(--cizgi); box-shadow:0 26px 50px -22px rgb(var(--golgeRgb) / .5);padding:16px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.24s var(--ez)} .shopCart[data-open="true"]{opacity:1;visibility:visible;transform:none} .shopCartHead{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--cizgi);padding-bottom:10px;margin-bottom:10px} .shopCartHead b{font-size:13px;letter-spacing:.04em;text-transform:uppercase} .shopCartX{font-size:20px;line-height:1;color:var(--a-6b6d6f)} .shopCartList{list-style:none;margin:0;padding:0;max-height:240px;overflow:auto} .shopCartList li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--cizgi);font-size:12.5px} .shopCartList li button{color:var(--a-6b6d6f);font-size:15px;line-height:1} .shopCartList li button:hover{color:var(--hata2)} .shopCartList .empty{color:var(--a-6b6d6f);justify-content:center;border:0} .shopCartBtn{display:flex;justify-content:center;margin-top:14px;width:100%} /* ========================================================================== V10 — yüzen kapsül menü, 12px taban, genel düzeltmeler ========================================================================== */ /* ---- 12 px taban: hiçbir metin bunun altına düşmez ---- */ body,p,span,li,td,th,dd,dt,small,label,a,div,b,strong,em,input,select,textarea,button{font-size:inherit} .kicker,.sectionDesc,.fleetBody p,.subBody p,.productInfo span,.specItem span,.spec span, .faqItem,.faqPanel,.footer p,.footer a,.copyright,.crumbs,.ptLead,.shopBody p,.shopCat,.shopSpec, .projectBody span,.projectBody small,.articleBody p,.timelineItem span,.infoCard span,.tag,.chip, .megaCol a small,.topbar,.stat span,.process span,.processBig span,.sectorPanel p,.blogCat, .cardMeta,.metaRow span,.tabs a,.tab{font-size:12px} .kicker{letter-spacing:.16em} /* ---- üst şerit: 10 px, estetik ---- */ .topbar{height:10px;background:var(--panel);padding:0;display:block} .tbin{display:none} /* ---- yüzen kapsül header ---- */ .header{position:sticky;top:0;z-index:100;background:transparent;border:0;box-shadow:none; padding:16px clamp(14px,2vw,26px) 0} .hin{max-width:1500px;margin:0 auto;height:80px;padding:0 26px;gap:3vw;border-radius:16px; background:rgb(var(--kartRgb) / .62); -webkit-backdrop-filter:blur(30px) saturate(190%);backdrop-filter:blur(30px) saturate(190%); box-shadow:inset 0 0 0 1px rgb(var(--kartRgb) / .55),0 22px 44px -26px rgb(var(--golgeRgb) / .8)} @supports not (backdrop-filter: blur(2px)){.hin{background:rgb(var(--kartRgb) / .95);backdrop-filter:blur(2px)}} .header[data-stuck="true"] .hin{background:rgb(var(--kartRgb) / .8)} .header .logo img{height:50px} .nav{margin-left:auto} .nav>li>a{font-size:13.5px;font-weight:600;letter-spacing:-.005em;text-transform:none;color:var(--a-1c2322);padding:11px 9px} .nav>li>a:after{bottom:3px} @media(min-width:1240px) and (max-width:1439px){.nav>li>a{font-size:13px;padding:11px 7px;letter-spacing:-.005em}} .hend{gap:16px} .quote{border-radius:999px;padding:14px 22px;letter-spacing:.09em} /* dil: sadece bayrak + TR | EN */ .langBtn{border:0;background:transparent;padding:0;gap:8px;font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--a-1c2322)} .langBtn .langMenu{display:none} .langPipe{opacity:.35;margin:0 2px} .langOff{opacity:.38;font-weight:500} .langOn{color:var(--a-1c2322)} /* mega: kapsülün altında, kapsülle aynı genişlikte */ .mega{top:calc(100% + 12px);left:0;right:0;transform:translateY(-8px);width:auto;border-radius:16px;border:0; background:rgb(var(--kartRgb) / .97);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px); box-shadow:inset 0 0 0 1px rgb(var(--golgeRgb) / .1),0 34px 60px -30px rgb(var(--golgeRgb) / .7)} .nav>li[data-open="true"] .mega{transform:none} .mega.megaSmall{left:auto;right:0;width:min(330px,80vw)} .megaCol h4{font-size:12px;color:var(--a-4a4e50);font-weight:800;letter-spacing:.13em} .megaCol a{font-size:13.5px;border-radius:8px} .megaCol a small{font-size:12px;color:var(--a-696c6e);font-weight:500} .megaSmall .megaCol a{padding:11px 12px} /* mobil çekmece kapsülün altından başlasın */ .mdrawer{top:116px;border-radius:16px;left:clamp(14px,2vw,26px);right:clamp(14px,2vw,26px);bottom:16px; box-shadow:inset 0 0 0 1px rgb(var(--golgeRgb) / .08),0 26px 50px -24px rgb(var(--golgeRgb) / .6)} /* hero kapsülün altından başladığı için üstten pay */ .hero{margin-top:-106px;padding-top:106px} .pageTop{margin-top:-106px;padding-top:106px} /* ---- rakam şeridi: başlıklar küçültüldü, bölümden ayrıldı ---- */ .stats{border-bottom:1px solid var(--cizgi);margin-bottom:0} .stat{padding:26px 3vw;justify-content:flex-start} .stat strong{font-size:clamp(18px,1.55vw,22px) !important;letter-spacing:-.025em;line-height:1.15;white-space:nowrap} .stat span{font-size:12px !important;margin-top:8px;line-height:1.55;color:var(--metin2) !important} @media(max-width:900px){.stat strong{white-space:normal}} /* ürün bölümü rakam şeridine yapışmasın */ .stats + .section,.stats + section{padding-top:clamp(46px,5vw,76px) !important} /* ---- ana sayfa ürün gridi 4 + 4 ---- */ .productGrid{grid-template-columns:repeat(4,1fr) !important} @media(max-width:1100px){.productGrid{grid-template-columns:repeat(2,1fr) !important}} @media(max-width:620px){.productGrid{grid-template-columns:1fr !important}} /* ---- blog kategori etiketleri kontrast ---- */ .articleBody .kicker,.blogCat,.articleCat{color:var(--a-4a4e50) !important;font-weight:700} /* ---- sektör panelleri: 12px / 1.3 ve çakışma yok ---- */ .sectorPanel p{font-size:12px !important;line-height:1.3 !important} .sectorPanel{padding:clamp(28px,3vw,44px)} .sectorPanel .panelIn{max-width:52ch} .sectorPanel .phLabel{inset:auto 0 0 auto;width:auto;height:auto;padding:10px 14px;font-size:12px;opacity:.5} /* ---- çözümler: çözüm alanı kartları 12px ---- */ .solutionCard p,.solutionItem p,.cardGrid p,.solutionGrid p{font-size:12px !important;line-height:1.6 !important} /* ---- hakkımızda: milat kartları ---- */ .timelineItem strong,.milestone strong{font-size:15px !important;letter-spacing:-.01em} .timelineItem span,.milestone span,.timelineItem p,.milestone p{font-size:12px !important;line-height:1.7 !important;color:var(--metin2) !important} /* ---- sertifika kart açıklamaları ---- */ .projectBody span,.projectBody small{font-size:12px !important;line-height:1.6 !important} /* milat / süreç kutuları (hakkımızda dahil) */ .process div strong{font-size:15px !important;letter-spacing:-.01em;display:block;margin-bottom:8px} .process div span{font-size:12px !important;line-height:1.7 !important;color:var(--metin2) !important} /* blog kart etiketi kontrast */ .articleMeta{font-size:12px !important;color:var(--a-4a4e50) !important;font-weight:700;letter-spacing:.13em} .articleBody p{font-size:12px !important;line-height:1.7 !important} .read{font-size:12px !important;font-weight:700;letter-spacing:.1em} /* çözüm kartları */ .solutionCard p{font-size:12px !important;line-height:1.65 !important} .solutionCard h3,.solutionCard strong{font-size:15px !important} /* ---- tam genişlik arka planlı yaklaşım bölümü ---- */ .approach{position:relative;overflow:hidden;color:var(--metinKoyuUstu);background:var(--panel)} .approachBg{position:absolute;inset:0} .approachBg .phLabel{align-items:flex-end;justify-content:flex-end;padding:18px 22px;text-align:right; background:transparent;background-image:none;color:rgb(var(--fotoMetinRgb) / .26)} .approachIn{position:relative;z-index:2;max-width:1500px;margin:0 auto;padding:clamp(56px,6.4vw,110px) 4vw} .approachIn .kicker{color:var(--metinKoyuUstu3)} .approachIn h2{color:var(--metinKoyuUstu);font-size:clamp(26px,3.2vw,46px);line-height:1.02;letter-spacing:-.05em;margin:14px 0 0;font-weight:800} .approachIn p{font-size:12px !important;line-height:1.8 !important;color:var(--metinKoyuUstu2);margin:18px 0 0;max-width:62ch} .approachIn .btn{margin-top:26px;background:var(--dugmeAcik);color:var(--dugmeAcikUstu);border-color:var(--dugmeAcik)} .approachIn .btn:hover{background:var(--vurgu);border-color:var(--vurgu)} /* ---- hizmetler: satış sonrası ---- */ .svcSec{position:relative;overflow:hidden;color:var(--metinKoyuUstu); background:var(--koyu3); background-image: repeating-linear-gradient(90deg,rgb(var(--metinKoyuUstuRgb) / .035) 0 1px,transparent 1px 3px), linear-gradient(100deg,rgb(var(--metinKoyuUstuRgb) / .07),transparent 42%,rgb(var(--metinKoyuUstuRgb) / .05)), radial-gradient(120% 90% at 12% 0%,rgb(var(--metinKoyuUstuRgb) / .07),transparent 58%)} .svcIn{position:relative;z-index:2;max-width:1500px;margin:0 auto;padding:clamp(52px,6vw,96px) 4vw} .svcIn .kicker{color:var(--metinKoyuUstu3)} .svcIn h2{color:var(--metinKoyuUstu)} .svcIn .sectionDesc{color:var(--metinKoyuUstu2) !important} .svcGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:clamp(28px,3vw,46px)} @media(max-width:1100px){.svcGrid{grid-template-columns:repeat(2,1fr)}} @media(max-width:620px){.svcGrid{grid-template-columns:1fr}} .svcCard{position:relative;padding:24px 20px 22px;background:rgb(var(--metinKoyuUstuRgb) / .045); border-top:2px solid rgb(var(--metinKoyuUstuRgb) / .18);transition:background .25s var(--ez),border-color .25s var(--ez)} .svcCard:hover{background:rgb(var(--metinKoyuUstuRgb) / .075);border-top-color:var(--vurgu)} .svcNo{position:absolute;right:18px;top:16px;font-size:12px;font-weight:700;letter-spacing:.12em;color:rgb(var(--metinKoyuUstuRgb) / .28)} .svcIcon{width:28px;height:28px;color:var(--vurguAcik);margin-bottom:16px} .svcCard h3{font-size:16px;font-weight:800;letter-spacing:-.02em;color:var(--metinKoyuUstu);margin:0 0 6px} .svcCard b{display:block;font-size:12px;font-weight:600;color:var(--k-c9d0cf);margin-bottom:8px} .svcCard p{font-size:12px;line-height:1.7;color:var(--k-9aa3a2);margin:0} /* ---- footer öncesi koyu bölüm: fırçalanmış titanyum ---- */ .titanium{ background-color:var(--koyu3) !important; background-image: repeating-linear-gradient(90deg,rgb(var(--metinKoyuUstuRgb) / .035) 0 1px,transparent 1px 3px), linear-gradient(100deg,rgb(var(--metinKoyuUstuRgb) / .075),transparent 44%,rgb(var(--metinKoyuUstuRgb) / .05)), radial-gradient(120% 90% at 12% 0%,rgb(var(--metinKoyuUstuRgb) / .06),transparent 58%) !important; } /* ---- referans logo alanları ---- */ .refLogo{position:relative;display:grid;place-items:center;gap:4px;min-height:84px;background:var(--zemin2); color:var(--a-696c6e);font-size:12px;font-weight:700;letter-spacing:.02em;transition:background .25s var(--ez)} .refLogo:hover{background:var(--zemin3)} .refPh{font-size:12px;letter-spacing:.18em;color:var(--a-a9adae);font-weight:700} .refName{font-size:13px;font-weight:800;letter-spacing:-.01em;color:var(--a-44474a)} /* ---- adtouchlabs imzası ---- */ .sig{display:inline-flex;align-items:center;gap:7px;font-size:12px;letter-spacing:.02em; color:#5b7f96;opacity:.6;transition:opacity .25s var(--ez),color .25s var(--ez)} .sig b{font-weight:700;color:var(--imza)} .sig:hover{opacity:1;color:var(--imzaAcik)} .sigDot{width:5px;height:5px;border-radius:50%;background:#4d7f9e} .copyright{align-items:center} /* ========================================================================== ANA KATEGORİ LANDING SAYFALARI ========================================================================== */ .lpHero{position:relative;height:clamp(240px,30vw,420px);overflow:hidden;background:var(--panel); margin-top:-106px;padding-top:106px} .lpHeroBg{position:absolute;inset:0} .lpHeroBg .phLabel{align-items:flex-end;justify-content:flex-end;padding:18px 22px;text-align:right; background:transparent;background-image:none;color:rgb(var(--fotoMetinRgb) / .26)} .lpHead{background:var(--kart);border-bottom:1px solid var(--cizgi)} .lpHeadIn{max-width:1500px;margin:0 auto;padding:clamp(26px,3vw,42px) 4vw clamp(28px,3.2vw,44px)} .lpHead .crumbs{color:var(--metin3)} .lpHead .crumbs a{color:var(--metin3)} .lpHead .crumbs a:hover{color:var(--metinGuclu)} .lpHead .crumbs span{color:var(--metinGuclu)} .lpHead .crumbs svg{stroke:currentColor} .lpHead .kicker{display:block;margin:22px 0 10px;color:var(--metin3)} .lpHead h1{font-size:clamp(28px,3.4vw,46px);line-height:1.02;letter-spacing:-.05em;font-weight:800;margin:0} .lpLead{font-size:12px !important;line-height:1.85 !important;color:var(--metin2);margin:16px 0 22px;max-width:74ch} .lpHead .btn{display:inline-flex} .lpTabs{position:sticky;top:112px;z-index:60;display:flex;gap:26px;overflow-x:auto;white-space:nowrap; padding:0 4vw;background:rgb(var(--kartRgb) / .92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px); border-bottom:1px solid var(--cizgi)} .lpTabs a{display:inline-flex;align-items:center;height:52px;font-size:12px;font-weight:600;color:var(--a-696c6e); border-bottom:2px solid transparent;transition:color .2s var(--ez),border-color .2s var(--ez)} .lpTabs a:hover{color:var(--metinGuclu)} .lpTabs a.on{color:var(--metinGuclu);border-bottom-color:var(--metinGuclu);font-weight:700} .lpBody{display:grid;grid-template-columns:232px minmax(0,1fr);gap:clamp(24px,3vw,52px);align-items:start} @media(max-width:1000px){.lpBody{grid-template-columns:1fr}} .lpFilter{position:sticky;top:180px;border:1px solid var(--cizgi);background:var(--kart)} @media(max-width:1000px){.lpFilter{position:static;display:flex;flex-wrap:wrap;gap:6px;border:0;padding:0}} .lpFilterHead{padding:14px 16px;border-bottom:1px solid var(--cizgi);font-size:12px;font-weight:800; letter-spacing:.12em;text-transform:uppercase;color:var(--a-4a4e50)} @media(max-width:1000px){.lpFilterHead{display:none}} .lpFilterItem{display:block;padding:12px 16px;border-bottom:1px solid var(--cizgi);font-size:13px;font-weight:600;color:var(--a-2c3031);transition:background .2s var(--ez)} .lpFilterItem small{display:block;font-size:12px;font-weight:400;color:var(--metin3);margin-top:2px} .lpFilterItem:hover{background:var(--zemin2)} .lpFilterItem.on{background:var(--dugme);color:var(--dugmeUstu)} .lpFilterItem.on small{color:rgb(var(--dugmeUstuRgb) / .6)} @media(max-width:1000px){ .lpFilterItem{border:1px solid var(--cizgi);padding:9px 13px;font-size:12px} .lpFilterItem small{display:none} } .lpFilterAll{display:block;padding:13px 16px;font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--metinGuclu);background:var(--zemin2)} .lpFilterAll:hover{background:var(--zemin3)} .lpOverview{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:clamp(24px,3vw,48px);align-items:center} @media(max-width:860px){.lpOverview{grid-template-columns:1fr}} .lpOverview h2{font-size:clamp(22px,2.4vw,32px);line-height:1.06;letter-spacing:-.045em;font-weight:800;margin:10px 0 14px} .lpOverview p{font-size:12px !important;line-height:1.9 !important;color:var(--metin2)} .lpVideo{position:relative;min-height:250px;overflow:hidden;background:var(--fotoZemin)} .lpPlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%; background:rgb(var(--fotoMetinRgb) / .92);display:grid;place-items:center;z-index:3;box-shadow:0 10px 26px -10px rgba(0,0,0,.6)} .lpPlay:after{content:"";border-left:13px solid var(--f-0e1312);border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:4px} .lpBlock{margin-top:clamp(34px,4vw,60px)} .lpBlock h3{font-size:clamp(19px,2vw,25px);line-height:1.1;letter-spacing:-.04em;font-weight:800;margin:0 0 18px} .lpCards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px} @media(max-width:900px){.lpCards{grid-template-columns:repeat(2,1fr)}} @media(max-width:560px){.lpCards{grid-template-columns:1fr}} .lpCard{border:1px solid var(--cizgi);background:var(--kart);padding:18px;transition:border-color .25s var(--ez),box-shadow .3s var(--ez)} .lpCard:hover{border-color:var(--metinGuclu);box-shadow:0 18px 40px -30px rgb(var(--golgeRgb) / .5)} .lpCard svg{width:24px;height:24px;color:var(--metinGuclu);margin-bottom:14px} .lpCard strong{display:block;font-size:14px;letter-spacing:-.015em;margin-bottom:5px} .lpCard span{display:block;font-size:12px;line-height:1.6;color:var(--a-696c6e)} .lpProjects{display:grid;grid-template-columns:repeat(4,1fr);gap:10px} @media(max-width:900px){.lpProjects{grid-template-columns:repeat(2,1fr)}} .lpProj{border:1px solid var(--cizgi);background:var(--kart);overflow:hidden} .lpProjImg{position:relative;height:130px;background:var(--fotoZemin)} .lpProjB{padding:14px} .lpProjB strong{display:block;font-size:13px;letter-spacing:.02em} .lpProjB span{display:block;font-size:12px;color:var(--a-696c6e);margin-top:4px} .lpProjB small{display:block;font-size:12px;font-weight:700;color:var(--metinGuclu);margin-top:8px} .lpSubs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px} @media(max-width:900px){.lpSubs{grid-template-columns:repeat(2,1fr)}} @media(max-width:560px){.lpSubs{grid-template-columns:1fr}} .lpSub{display:flex;flex-direction:column;gap:5px;padding:18px;border:1px solid var(--cizgi);background:var(--kart); transition:border-color .25s var(--ez),transform .3s var(--ez)} .lpSub:hover{border-color:var(--metinGuclu);transform:translateY(-2px)} .lpSubT{font-size:15px;font-weight:800;letter-spacing:-.02em;color:var(--metinGuclu)} .lpSubM{font-size:12px;color:var(--a-696c6e)} .lpSubGo{margin-top:10px;font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--metinGuclu)} /* ---- yedek parça: e-ticaret ---- */ .shopSpecRow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:12px} .shopStock{font-size:12px;font-weight:700;color:var(--basari);display:inline-flex;align-items:center;gap:6px} .shopStock:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--basari)} .shopFoot{flex-direction:column;align-items:stretch;gap:10px;border-top:1px solid var(--cizgi);padding-top:12px;margin-top:10px} .shopPrice{font-size:13px;font-weight:800;color:var(--metinGuclu);letter-spacing:-.01em} .shopQty{display:flex;align-items:center;border:1px solid var(--cizgi)} .shopQty button{width:34px;height:34px;font-size:16px;color:var(--a-3a3d3f);transition:background .2s var(--ez)} .shopQty button:hover{background:var(--zemin2)} .shopQty input{width:42px;height:34px;border:0;border-left:1px solid var(--cizgi);border-right:1px solid var(--cizgi); text-align:center;font:inherit;font-size:13px;font-weight:700;color:var(--metinGuclu);outline:none} .shopFoot .shopBtn{width:100%;background:var(--dugme);color:var(--dugmeUstu);border-color:var(--dugme);padding:11px 13px} .shopFoot .shopBtn:hover{background:var(--vurgu);color:var(--vurguUstu);border-color:var(--vurgu)} .shopFoot .shopBtn.added{background:var(--vurgu);color:var(--vurguUstu);border-color:var(--vurgu)} .shopQtyRow{display:flex;gap:10px;align-items:center} .shopCartFoot{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 0;border-top:1px solid var(--cizgi);font-size:12px;color:var(--a-6b6d6f)} .shopCartFoot b{font-size:13px;color:var(--metinGuclu)} .shopCartNote{font-size:12px;color:var(--a-6b6d6f);margin:10px 0 0;line-height:1.6} .shopCartFab svg{width:16px;height:16px} .shopCartList li em{font-style:normal;color:var(--a-6b6d6f);font-size:12px;margin-left:6px} /* ========================================================================== 12 PX TABAN — hiçbir metin bunun altına düşmez ========================================================================== */ html{font-size:16px} body{font-size:15px} .kicker,.btn,.tab,.tabs a,.blogFilter,.chip,.tag,.refPh,.phLabel,.phLabel small, .copyright,.copyright span,.sig,.footer p,.footer a,.footer b,.crumbs,.crumbs a,.crumbs span, .shopCat,.shopSpec,.shopStock,.shopPrice,.shopCartNote,.shopCartFoot,.shopCount,.shopChip, .lpTabs a,.lpFilterItem,.lpFilterItem small,.lpFilterAll,.lpCard span,.lpProjB span,.lpProjB small, .lpSubM,.lpSubGo,.lpLead,.ptLead,.sectionDesc,.stat span,.process div span,.specItem span,.spec span, .faqItem,.faqPanel,.articleMeta,.articleBody p,.read,.svcCard p,.svcCard b,.svcNo,.approachIn p, .sectorPanel p,.megaCol a small,.productInfo span,.productMeta em,.fleetBody p,.fleetMeta span, .subBody p,.subMeta span,.projectBody span,.projectBody small,.solutionCard p,.legal p, .contactList span,.contactList strong,.contact-form label,.formMsg,.gridMore p,.infoStripIn p, .shopBody p,.shopCartList li,.shopCartList li em,.lpOverview p,.lpHead .kicker,.refName{ font-size:12px !important; } .btn,.lpTabs a,.shopChip,.tab{letter-spacing:.06em} .phLabel{letter-spacing:.14em} .phLabel small{letter-spacing:.02em} .footer b{letter-spacing:.08em} /* referans tablosu dar ekranda yatay kaydırılsın */ @media(max-width:620px){ .refTable{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch} .refTable table,.refTable thead,.refTable tbody{min-width:520px} } @media(max-width:620px){ .refTableWrap{overflow-x:auto;-webkit-overflow-scrolling:touch} .refTableWrap .refTable{min-width:560px;display:table} } /* ========================================================================== V11 düzeltmeleri ========================================================================== */ /* 2 — sticky menünün arkasındaki gri blok kaldırıldı */ .header,.header[data-stuck="true"]{ background:transparent !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important; border:0 !important;box-shadow:none !important; } /* 1 — Kurumsal açılır menüsü kendi başlığının altında */ .nav>li.ddRight{position:relative} .nav>li.ddRight .mega.megaSmall{left:0;right:auto;width:min(320px,80vw)} /* 15 — butonlar siyah, hover sarı */ .btn,.small-btn,.shopChip.on,.form-submit{background:var(--dugme) !important;border-color:var(--dugme) !important;color:var(--dugmeUstu) !important} .btn:hover,.small-btn:hover,.form-submit:hover{background:var(--vurgu) !important;border-color:var(--vurgu) !important;color:var(--vurguUstu) !important} .btn.light,.approachIn .btn,.infoStripIn .btn,.ptCta .btn{background:var(--dugmeAcik) !important;color:var(--dugmeAcikUstu) !important;border-color:var(--dugmeAcik) !important} .btn.light:hover,.approachIn .btn:hover,.infoStripIn .btn:hover,.ptCta .btn:hover{background:var(--vurgu) !important;border-color:var(--vurgu) !important;color:var(--vurguUstu) !important} .quote{background:var(--dugme) !important;color:var(--dugmeUstu) !important} .quote:hover{background:var(--vurgu) !important;color:var(--vurguUstu) !important} .ghostBtn{background:transparent !important;border-color:rgb(var(--metinKoyuUstuRgb) / .55) !important;color:var(--metinKoyuUstu) !important} .ghostBtn:hover{background:var(--vurgu) !important;border-color:var(--vurgu) !important;color:var(--vurguUstu) !important} .shopBtn{background:var(--dugme) !important;border-color:var(--dugme) !important;color:var(--dugmeUstu) !important} .shopBtn:hover,.shopBtn.added{background:var(--vurgu) !important;border-color:var(--vurgu) !important;color:var(--vurguUstu) !important} /* 7 + 8 — yaklaşım bölümünde buton metnin üstüne binmesin */ .approachIn{display:flex;flex-direction:column;align-items:flex-start} .approachIn h2,.approachIn p{position:static} .approachIn .btn{position:static;margin-top:28px;align-self:flex-start} /* 12 + 14 — sektör kartlarında arka plan tam kaplasın */ .sectorCard{display:flex;align-items:flex-end;min-height:220px} .sectorCard .phLabel{inset:0;justify-content:center;align-items:center;z-index:1; background:var(--fotoZemin);background-image:radial-gradient(120% 90% at 16% 0%,rgb(var(--fotoMetinRgb) / .07),transparent 58%), radial-gradient(90% 75% at 92% 100%,rgba(0,0,0,.5),transparent 62%)} .sectorCard:after{z-index:2} .sectorCard span:not(.phLabel){position:relative;z-index:3;padding:18px} .sectorCard .phLabel small{font-size:12px} /* 13 — bölüm arka planı (panelden) */ .dark,.sectors{position:relative;isolation:isolate} .secBg{position:absolute;inset:0;z-index:0;overflow:hidden} .secBg .phLabel{align-items:flex-end;justify-content:flex-end;padding:16px 20px;text-align:right; background:transparent;background-image:none;color:rgb(var(--fotoMetinRgb) / .2)} .dark>*:not(.secBg),.sectors>*:not(.secBg){position:relative;z-index:1} /* 3 — başlık bloğu hero görselin üzerinde */ .lpHero{height:auto;min-height:clamp(340px,38vw,520px);display:flex;align-items:flex-end} .lpHeroIn{position:relative;z-index:3;max-width:1500px;margin:0 auto;width:100%; padding:clamp(40px,5vw,72px) 4vw clamp(34px,4vw,56px);color:var(--metinKoyuUstu)} .lpHero:before{content:"";position:absolute;inset:0;z-index:2; background:linear-gradient(0deg,rgb(var(--perdeRgb) / .92),rgb(var(--perdeRgb) / .45) 52%,rgb(var(--perdeRgb) / .2))} .lpHeroIn .crumbs{color:var(--k-9aa3a2)} .lpHeroIn .crumbs a{color:var(--k-9aa3a2)} .lpHeroIn .crumbs a:hover{color:var(--metinKoyuUstu)} .lpHeroIn .crumbs span{color:var(--metinKoyuUstu)} .lpHeroIn .kicker{display:block;margin:26px 0 12px;color:var(--metinKoyuUstu3)} .lpHeroIn h1{font-size:clamp(30px,3.6vw,50px);line-height:1;letter-spacing:-.05em;font-weight:800;margin:0;color:var(--metinKoyuUstu)} .lpHeroIn .lpLead{color:var(--k-b6bdbc);margin:18px 0 24px;max-width:70ch} .lpHeroIn .btn{background:var(--dugmeAcik) !important;color:var(--dugmeAcikUstu) !important;border-color:var(--dugmeAcik) !important} .lpHeroIn .btn:hover{background:var(--vurgu) !important;border-color:var(--vurgu) !important;color:var(--vurguUstu) !important} .lpHeroBg .phLabel{color:rgb(var(--fotoMetinRgb) / .2)} .lpTabs{top:112px} /* 5 — alt ürün kartlarında görsel */ .lpSub{padding:0;overflow:hidden} .lpSubImg{position:relative;display:block;height:132px;background:var(--fotoZemin)} .lpSub .lpSubT{padding:16px 16px 0} .lpSub .lpSubM{padding:0 16px} .lpSub .lpSubGo{padding:0 16px 16px;margin-top:10px} /* ==================== SEPET SAYFASI ==================== */ .cartWrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(20px,2.4vw,36px);align-items:start} @media(max-width:1000px){.cartWrap{grid-template-columns:1fr}} .cartHead{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:16px} .cartHead h2{font-size:clamp(20px,2vw,26px);letter-spacing:-.04em;font-weight:800;margin:0} .cartCount{font-size:12px;color:var(--a-6b6d6f)} .cartList{border-top:1px solid var(--cizgi)} .cartItem{display:grid;grid-template-columns:76px minmax(0,1fr) auto auto auto;gap:16px;align-items:center; padding:16px 0;border-bottom:1px solid var(--cizgi)} @media(max-width:700px){.cartItem{grid-template-columns:64px minmax(0,1fr) auto;row-gap:12px} .cartItem .cartPrice{grid-column:2/4;text-align:left}} .cartThumb{position:relative;height:66px;background:var(--fotoZemin);overflow:hidden} .cartThumb .phLabel{font-size:12px;letter-spacing:.1em;padding:6px} .cartName{font-size:14px;font-weight:700;letter-spacing:-.015em;color:var(--metinGuclu)} .cartCat{display:block;font-size:12px;color:var(--a-6b6d6f);margin-top:3px} .cartPrice{font-size:13px;font-weight:700;color:var(--metinGuclu);white-space:nowrap} .cartPrice small{display:block;font-size:12px;font-weight:400;color:var(--a-6b6d6f)} .cartDel{width:32px;height:32px;font-size:17px;color:var(--a-6b6d6f);border:1px solid var(--cizgi)} .cartDel:hover{border-color:var(--hata);color:var(--hata)} .cartEmpty{padding:34px 0;display:none;flex-direction:column;gap:16px;align-items:flex-start} .cartEmpty p{font-size:13px;color:var(--a-6b6d6f);margin:0} .cartEmpty[data-on="true"]{display:flex} .cartForm{margin-top:clamp(28px,3vw,46px);padding-top:clamp(24px,2.6vw,36px);border-top:1px solid var(--cizgi)} .cartForm h2{font-size:clamp(18px,1.8vw,23px);letter-spacing:-.035em;font-weight:800;margin:0 0 8px} .cartNote{font-size:12px;color:var(--a-6b6d6f);margin:0 0 20px;line-height:1.7} .cartForm .fg{display:grid;gap:16px} @media(min-width:620px){.cartForm .fg--2{grid-template-columns:repeat(2,1fr)}} .cartForm .fl{display:flex;flex-direction:column;gap:7px} .cartForm .fl.full{grid-column:1/-1} .cartForm label{font-size:12px;font-weight:600;color:var(--a-3a3d3f)} .cartForm input,.cartForm textarea{font:inherit;font-size:13px;color:var(--metinGuclu);padding:12px 13px; background:var(--kart);border:1px solid var(--cizgi);outline:none;transition:border-color .2s var(--ez)} .cartForm input:focus,.cartForm textarea:focus{border-color:var(--metinGuclu)} .cartForm textarea{min-height:90px;resize:vertical} .cartForm .fl.bad input,.cartForm .fl.bad textarea{border-color:var(--hata)} .cartForm .consent{display:flex;gap:11px;align-items:flex-start;margin-top:18px} .cartForm .consent input{width:17px;height:17px;flex:0 0 17px;margin-top:3px;accent-color:var(--metinGuclu)} .cartForm .consent label{font-size:12px;color:var(--a-6b6d6f);line-height:1.6} .cartSide{position:sticky;top:180px;display:grid;gap:14px} @media(max-width:1000px){.cartSide{position:static}} .cartBox{border:1px solid var(--cizgi);background:var(--kart);padding:20px} .cartBox h3{font-size:14px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin:0 0 16px} .cartRow{display:flex;justify-content:space-between;gap:12px;padding:9px 0;font-size:12px;color:var(--a-6b6d6f);border-bottom:1px solid var(--cizgi)} .cartRow b{color:var(--metinGuclu);font-size:13px} .cartRow.total{border-bottom:0;padding-top:14px;font-size:13px;color:var(--metinGuclu)} .cartRow.total b{font-size:17px;letter-spacing:-.02em} .cartHint{font-size:12px;color:var(--a-6b6d6f);line-height:1.7;margin:14px 0 0} .payBtn{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:14px;border:1px solid var(--cizgi); background:var(--kart);margin-bottom:10px;transition:border-color .2s var(--ez),background .2s var(--ez)} .payBtn:hover{border-color:var(--metinGuclu);background:var(--zemin2)} .payBtn.wa:hover{border-color:#25D366;background:#f2fbf5} .payIcon{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;background:var(--dugme);color:var(--dugmeUstu)} .payBtn.wa .payIcon{background:#25D366} .payIcon svg{width:19px;height:19px} .payTxt b{display:block;font-size:13px;font-weight:700;color:var(--metinGuclu)} .payTxt small{display:block;font-size:12px;color:var(--a-6b6d6f);margin-top:3px;line-height:1.5} .modal{position:fixed;inset:0;z-index:200;background:rgb(var(--perdeRgb) / .72);display:grid;place-items:center;padding:20px; opacity:0;visibility:hidden;transition:.24s var(--ez)} .modal[data-open="true"]{opacity:1;visibility:visible} .modalBox{position:relative;background:var(--kart);max-width:520px;width:100%;padding:clamp(24px,3vw,38px)} .modalX{position:absolute;right:14px;top:10px;font-size:22px;color:var(--a-6b6d6f)} .modalBox h3{font-size:22px;letter-spacing:-.035em;font-weight:800;margin:0 0 10px} .modalBox p{font-size:13px;line-height:1.75;color:var(--a-6b6d6f);margin:0 0 16px} .modalBank{border-top:1px solid var(--cizgi)} .modalBank div{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--cizgi);font-size:12px;color:var(--a-6b6d6f)} .modalBank b{color:var(--metinGuclu);font-size:13px;text-align:right} /* sektör kartı yer tutucusu tam kaplasın (position override) */ .sectorCard>.phLabel{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important; display:flex !important;align-items:center !important;justify-content:center !important;z-index:1} .sectorCard>span:not(.phLabel){position:relative;z-index:3;width:100%;padding:18px;font-size:13px;font-weight:700;color:var(--fotoMetin)} /* imza: nokta yok, kredi cümlesi */ .sigDot{display:none !important} .sigWrap{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--k-6f7877)} .sig{display:inline;font-size:12px;letter-spacing:.04em;font-weight:700;color:#5b7f96;opacity:.85; border-bottom:1px solid rgba(91,127,150,.35);padding-bottom:1px;transition:color .25s var(--ez),border-color .25s var(--ez),opacity .25s var(--ez)} .sig:hover{color:var(--imzaAcik);border-bottom-color:var(--imzaAcik);opacity:1} .copyright{justify-content:space-between} /* form: konu ve ürün alanları */ .form select{width:100%;font:inherit;font-size:13px;color:var(--metinGuclu);padding:12px 13px;background:var(--kart); border:1px solid var(--cizgi);outline:none;transition:border-color .2s var(--ez);appearance:none;-webkit-appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--metin3) 50%),linear-gradient(135deg,var(--metin3) 50%,transparent 50%); background-position:calc(100% - 16px) 1.25em,calc(100% - 11px) 1.25em;background-size:5px 5px;background-repeat:no-repeat;padding-right:34px} .form select:focus{border-color:var(--metinGuclu)} .form .opt{color:var(--metin3);font-weight:400} /* header sepet bağlantısı */ .cartLink{position:relative;display:grid;place-items:center;width:40px;height:40px;color:var(--metinGuclu); transition:color .2s var(--ez)} .cartLink:hover{color:var(--vurguMetin)} .cartLink svg{width:20px;height:20px} .cartBadge{position:absolute;top:2px;right:0;min-width:17px;height:17px;padding:0 4px;border-radius:99px; background:var(--dugme);color:var(--dugmeUstu);font-size:12px;font-weight:700;display:none;place-items:center;line-height:1} .cartBadge[data-on="true"]{display:grid} /* 1 — hero menüye yapışmasın, başlık 4vw */ .hero__in,.heroText{padding-top:0} .hero .heroText{top:52%} .heroText h1,.hero h1{font-size:clamp(34px,4vw,74px) !important;line-height:.92} .hero{padding-top:150px} @media(max-width:900px){.hero{padding-top:124px}.heroText h1,.hero h1{font-size:clamp(30px,8vw,46px) !important}} /* dar ekranda header sağ blok sığsın */ @media(max-width:560px){ .hin{padding:0 16px;gap:10px} .hend{gap:6px} .langBtn{gap:5px;font-size:12px} .cartLink{width:34px;height:34px} .cartLink svg{width:18px;height:18px} .burger{width:38px;height:38px;margin-right:-6px} .header .logo img{height:38px} } @media(max-width:400px){ .langBtn .fl{display:none} } .formRow.one{grid-template-columns:1fr} /* ===================================================================== PANEL TARAFINDAN ÜRETİLEN BLOKLAR İÇİN EK STİLLER ===================================================================== */ .previewBar{position:sticky;top:0;z-index:200;background:var(--vurgu);color:var(--vurguUstu); text-align:center;padding:8px 14px;font-size:12px;font-weight:700;letter-spacing:.04em} .hpField{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0} .bosAlan{background:var(--fotoZemin);min-height:180px} /* metin blokları */ .proseDar{max-width:70ch;margin:0 auto} .proseOrta{max-width:86ch} .proseGenis{max-width:none} .prose p{font-size:12px;line-height:1.9;color:var(--metin2);margin:0 0 14px} .prose h3{font-size:18px;letter-spacing:-.03em;margin:22px 0 10px} .prose ul,.prose ol{margin:0 0 14px;padding-left:20px} .prose li{list-style:disc;font-size:12px;line-height:1.9;color:var(--metin2);margin:4px 0} .prose ol li{list-style:decimal} .prose a{color:inherit;text-decoration:underline} .dark .prose p,.dark .prose li{color:var(--metinKoyuUstu2)} /* metin + görsel */ .metinGorsel .mgGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,48px);align-items:center} @media(max-width:860px){.metinGorsel .mgGrid{grid-template-columns:1fr}} .mgMedia img{width:100%;height:auto;display:block} .metinGorsel.dark h2,.metinGorsel.dark .kicker{color:var(--metinKoyuUstu)} /* kart ızgarası sütunları */ .lpCards.s2{grid-template-columns:repeat(2,1fr)} .lpCards.s3{grid-template-columns:repeat(3,1fr)} .lpCards.s4{grid-template-columns:repeat(4,1fr)} .lpCards.s5{grid-template-columns:repeat(5,1fr)} @media(max-width:900px){.lpCards.s3,.lpCards.s4,.lpCards.s5{grid-template-columns:repeat(2,1fr)}} @media(max-width:560px){.lpCards.s2,.lpCards.s3,.lpCards.s4,.lpCards.s5{grid-template-columns:1fr}} a.lpCard{display:block} /* sektör ızgarası */ .sectorGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px} /* referans şeridi */ .refStrip{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px} .refStrip .refLogo{display:grid;place-items:center;min-height:84px;background:var(--zemin2);padding:14px} .refStrip .refLogo img{max-height:52px;width:auto;object-fit:contain} /* SSS stilleri sitenin kendi kuralları tarafından yönetilir */ /* galeri */ .galGrid{display:grid;gap:10px} .galGrid.s2{grid-template-columns:repeat(2,1fr)} .galGrid.s3{grid-template-columns:repeat(3,1fr)} .galGrid.s4{grid-template-columns:repeat(4,1fr)} @media(max-width:700px){.galGrid.s3,.galGrid.s4{grid-template-columns:repeat(2,1fr)}} .galItem img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;display:block} /* iletişim bloğu */ .contactGrid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(20px,3vw,44px);align-items:start} @media(max-width:860px){.contactGrid{grid-template-columns:1fr}} .contactRow{display:flex;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid var(--cizgi);font-size:12px} .contactRow span{letter-spacing:.1em;text-transform:uppercase;color:var(--metin3)} .contactRow strong{text-align:right} /* özel html bloğu */ .customHtml iframe{max-width:100%;border:0} /* hero metni ile buton arası */ .heroText p{margin:14px 0 0;max-width:46ch} .heroBtns{margin-top:26px;display:flex;gap:10px;flex-wrap:wrap} .hero.heroOrta{min-height:52vh} .hero.heroBuyuk{min-height:72vh} .hero.heroTam{min-height:92vh} /* ===================================================================== REVİZYON — süreç şeridi, mobil düzeltmeler ===================================================================== */ /* 4 · proje süreci: daha sık, numara öne çıkar */ .process.processBig{grid-template-columns:repeat(5,1fr);border:0;gap:1px;background:rgb(var(--metinKoyuUstuRgb) / .12)} .process.processBig>div{ min-height:0;padding:16px 16px 18px;border:0;background:var(--koyu); display:flex;flex-direction:column;gap:6px;position:relative } .process.processBig strong{ font-size:11px;letter-spacing:.1em;text-transform:uppercase;margin:0; color:var(--vurguAcik);font-weight:700 } .process.processBig span{font-size:12px;line-height:1.55;color:var(--k-a9b0af)} @media(max-width:1000px){.process.processBig{grid-template-columns:repeat(2,1fr)}} @media(max-width:560px){.process.processBig{grid-template-columns:1fr}} /* 6 · mobilde S.S.S. başlığı ile buton üst üste binmesin */ @media(max-width:700px){ .faq .faqTop{display:flex;flex-direction:column;align-items:flex-start;gap:14px} .faq .faqTop > div{width:100%} .faq .faqTop .btn{align-self:flex-start;position:static;margin:0} .faq .faqTop h2{margin-bottom:0} } /* 10 · mobilde hero daha ferah */ @media(max-width:700px){ .hero{height:auto;min-height:0;padding:104px 0 34px;display:block} .hero .heroText{ position:static;left:auto;top:auto;transform:none; max-width:none;padding:0 22px;margin:0 } .hero .heroText h1{font-size:clamp(32px,10.5vw,48px);line-height:.96;margin:10px 0 0} .hero .heroText p{font-size:13px;line-height:1.6;max-width:36ch;margin:14px 0 0} .hero .heroActions{margin-top:24px} .hero .heroMeta{ position:static;right:auto;bottom:auto; margin:28px 22px 0;text-align:left;opacity:.75;font-size:11.5px } .hero .heroMeta b{font-size:15px} } /* 9 · mobil çekmecede sütun başlıkları */ .mgroup .msubBaslik{ display:block;padding:14px 0 6px;font-size:10.5px;font-weight:800; letter-spacing:.16em;text-transform:uppercase;color:var(--vurguMetin);opacity:.9 } .mgroup .msubBaslik:first-child{padding-top:4px} /* ===================================================================== BANNER, BELGE LİSTESİ, ARKA PLANLI ÇAĞRI BANDI ===================================================================== */ .duo.bannerBlok{display:grid;gap:0} .duo.bannerBlok.s1{grid-template-columns:1fr} .duo.bannerBlok.s2{grid-template-columns:1fr 1fr} .duo.bannerBlok.s3{grid-template-columns:repeat(3,1fr)} @media(max-width:900px){.duo.bannerBlok.s2,.duo.bannerBlok.s3{grid-template-columns:1fr}} .belgeGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px} .belgeKart{ display:flex;align-items:center;gap:14px;padding:16px 18px; border:1px solid var(--cizgi);background:var(--kart);transition:border-color .2s ease } a.belgeKart:hover{border-color:var(--metinGuclu)} .belgeIkon{flex:0 0 38px;height:38px;display:grid;place-items:center; border:1px solid var(--cizgi);color:var(--metinGuclu)} .belgeIkon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6} .belgeAd{display:flex;flex-direction:column;gap:3px;min-width:0} .belgeAd strong{font-size:13px;font-weight:700;color:var(--metinGuclu)} .belgeAd span{font-size:11.5px;color:var(--a-6d7573)} .belgeAc{margin-left:auto;font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--metinGuclu)} .ctaBand.ctaGorselli{position:relative;overflow:hidden} .ctaBand .ctaBg{position:absolute;inset:0;z-index:0} .ctaBand .ctaBg img{width:100%;height:100%;object-fit:cover;opacity:.32} .ctaBand.ctaGorselli > div:not(.ctaBg),.ctaBand.ctaGorselli > a{position:relative;z-index:1} .shopPrice .kdvNot{display:block;font-size:10.5px;font-weight:500;color:var(--a-7d8385);margin-top:2px;letter-spacing:.02em} /* ===================================================================== MOBİL BAR — dört tasarım, paneldeki çizimlerle birebir ===================================================================== */ .mobilBar{ position:fixed;left:0;right:0;bottom:0;z-index:90;display:none; grid-auto-flow:column;grid-auto-columns:1fr; background:var(--koyu2);border-top:1px solid rgb(var(--metinKoyuUstuRgb) / .12); padding-bottom:env(safe-area-inset-bottom) } .mobilBar a{ display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px; padding:9px 3px;color:var(--k-aab4b1);text-decoration:none;font-size:10px;font-weight:600; letter-spacing:.01em;text-align:center;line-height:1.2;min-height:56px } .mobilBar a span{display:block;white-space:nowrap} .mobilBar svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7; stroke-linecap:round;stroke-linejoin:round} .mobilBar a[aria-current="page"],.mobilBar a.aktif{color:var(--vurguAcik)} /* 1 · yüzen kapsül */ .mobilBar.tasarim1{ left:12px;right:12px;bottom:12px;border-radius:18px; border:1px solid rgb(var(--metinKoyuUstuRgb) / .14); background:rgb(var(--k-161d1cRgb) / .9);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px); box-shadow:0 20px 40px -22px rgba(0,0,0,.85);overflow:hidden } /* 2 · ortada WhatsApp */ .mobilBar.tasarim2{background:var(--kart);border-top-color:var(--a-e6e6e2)} .mobilBar.tasarim2 a{color:var(--a-6d7573)} .mobilBar.tasarim2 a[aria-current="page"],.mobilBar.tasarim2 a.aktif{color:var(--a-14211f)} .mobilBar.tasarim2 a.waBtn{ background:#25D366;color:#fff;border-radius:50%;width:54px;height:54px;min-height:0; justify-content:center;align-self:center;margin:-22px auto 0; box-shadow:0 12px 24px -10px rgba(37,211,102,.8),0 0 0 4px var(--kart) } .mobilBar.tasarim2 a.waBtn span{display:none} .mobilBar.tasarim2 a.waBtn svg{width:25px;height:25px} /* 3 · sarı hap */ .mobilBar.tasarim3{ left:10px;right:10px;bottom:10px;border-radius:16px;padding:5px;gap:3px; border:1px solid rgb(var(--metinKoyuUstuRgb) / .12);background:var(--k-121817); box-shadow:0 18px 38px -22px rgba(0,0,0,.9) } .mobilBar.tasarim3 a{flex-direction:column;border-radius:12px;min-height:48px;padding:7px 2px;font-size:9.5px} .mobilBar.tasarim3 a[aria-current="page"],.mobilBar.tasarim3 a.aktif{ background:var(--vurgu);color:var(--vurguUstu) } /* 4 · iki büyük eylem */ .mobilBar.tasarim4{ grid-template-columns:1fr 1fr;grid-auto-flow:row;gap:7px;padding:9px 11px; background:var(--kart);border-top-color:var(--a-e6e6e2) } .mobilBar.tasarim4 a{ flex-direction:row;gap:8px;min-height:48px;border-radius:12px; background:var(--d-131a19);color:var(--dugmeUstu);font-size:12px;font-weight:700 } .mobilBar.tasarim4 a{display:none} .mobilBar.tasarim4 a.eylem{display:flex} .mobilBar.tasarim4 a.waBtn{background:#25D366;color:#fff} .mobilBar.tasarim4 a.waBtn svg{fill:currentColor;stroke:none} .mobilBar svg.fill{fill:currentColor;stroke:none} /* mobil bar açık renk sürümü */ .mobilBar.renk-acik{background:var(--kart);border-top-color:var(--a-e6e6e2)} .mobilBar.renk-acik a{color:var(--a-6d7573)} .mobilBar.renk-acik a[aria-current="page"],.mobilBar.renk-acik a.aktif{color:var(--a-14211f)} .mobilBar.tasarim1.renk-acik{background:rgb(var(--kartRgb) / .92);border-color:var(--a-e6e6e2); box-shadow:0 18px 38px -24px rgb(var(--golgeRgb) / .5)} .mobilBar.tasarim3.renk-acik{background:var(--a-f4f4f1);border-color:var(--a-e0e0db)} .mobilBar.tasarim3.renk-acik a[aria-current="page"],.mobilBar.tasarim3.renk-acik a.aktif{ background:var(--vurgu);color:var(--vurguUstu)} .mobilBar.tasarim4.renk-acik a{background:var(--d-131a19);color:var(--dugmeUstu)} /* ===================================================================== MOBİL HEADER — ferah düzen Logo, sepet ve menü düğmesi arasında nefes payı; dil seçimi hamburger menünün içine taşındı. ===================================================================== */ @media(max-width:900px){ header .hin{padding:0 18px;min-height:72px;gap:12px} .logo img{height:34px} .hend{gap:10px;margin-left:auto;align-items:center} .hend .langBtn{display:flex;align-items:center;gap:5px} .hend .langBtn .fl{width:22px;height:15px;border-radius:2px;overflow:hidden} .hend .langBtn a{font-size:12px;font-weight:700;letter-spacing:.04em} .hend .langBtn .langPipe{opacity:.4;font-size:11px} .cartLink{width:40px;height:40px;display:flex;align-items:center;justify-content:center} .cartLink svg{width:21px;height:21px} .cartBadge{top:3px;right:3px} .burger{width:40px;height:40px;display:flex;align-items:center;justify-content:center} .navLang{display:none} } @media(max-width:400px){ header .hin{padding:0 14px;gap:8px} .logo img{height:30px} .hend{gap:6px} .hend .langBtn .fl{display:none} .hend .langBtn a{font-size:11.5px} .cartLink,.burger{width:36px;height:36px} } /* menü içindeki dil seçimi */ .navLang{ display:none;align-items:center;gap:12px;margin-top:22px;padding-top:20px; border-top:1px solid rgb(var(--metinKoyuUstuRgb) / .14) } @media(max-width:900px){.navLang{display:flex}} .navLang .fl{width:26px;height:18px;display:block;border-radius:3px;overflow:hidden} .navLang .fl svg{width:100%;height:100%;display:block} .navLang a{ font-size:13px;font-weight:700;letter-spacing:.06em;padding:7px 13px;border-radius:9px; border:1px solid rgb(var(--metinKoyuUstuRgb) / .2);color:var(--k-cfd6d4);text-decoration:none } .navLang a.langOn{background:var(--vurgu);border-color:var(--vurgu);color:var(--vurguUstu)} /* ===================================================================== GÖRSEL OTURTMA — tek elden ölçü sistemi Her görsel alanı kendi oranını bilir; yüklenen dosya ne olursa olsun alana taşmadan, boşluk bırakmadan oturur. ===================================================================== */ .ptMedia,.heroImage,.detailMedia,.lpSubImg,.lpProjImg,.projectImg, .splitVisual,.duoPhoto,.galItem,.shopThumb,.articleImg,.secBg,.ctaBg{ position:relative;overflow:hidden;background:var(--f-1c2221) } .ptMedia img,.ptMedia video, .heroImage img,.heroImage video, .detailMedia img,.detailMedia video, .lpSubImg img,.lpProjImg img,.projectImg img, .splitVisual img,.duoPhoto img,.galItem img, .shopThumb img,.articleImg img,.secBg img,.ctaBg img{ position:absolute;inset:0;width:100%;height:100%; object-fit:cover;object-position:center;display:block;max-width:none } /* alan başına oran */ .pageTop{position:relative;overflow:hidden;isolation:isolate} .ptMedia{position:absolute;inset:0;aspect-ratio:auto;z-index:0} .ptMedia:after{ content:"";position:absolute;inset:0; /* yazıların durduğu sol taraf her fotoğrafta (beyaz fonlu ürün görseli dahil) okunur kalsın; sağda fotoğraf görünür */ background: linear-gradient(180deg,rgb(var(--perdeRgb) / 0) 40%,rgb(var(--perdeRgb) / .55) 100%), linear-gradient(90deg,rgb(var(--perdeRgb) / .86) 0%,rgb(var(--perdeRgb) / .74) 38%,rgb(var(--perdeRgb) / .30) 72%,rgb(var(--perdeRgb) / .12) 100%) } .pageTop .ptIn{position:relative;z-index:1} @media(max-width:900px){ .ptMedia:after{background:linear-gradient(180deg,rgb(var(--perdeRgb) / .8) 0%,rgb(var(--perdeRgb) / .84) 60%,rgb(var(--perdeRgb) / .9) 100%)} } .detailMedia{aspect-ratio:16/9;min-height:0;height:auto} .lpSubImg{aspect-ratio:4/3;display:block;height:auto} .lpProjImg{aspect-ratio:4/3;height:auto;min-height:0} .projectImg{aspect-ratio:4/3;height:auto;min-height:0} .splitVisual{aspect-ratio:4/3;min-height:0} @media(max-width:900px){.splitVisual{aspect-ratio:16/9}} .splitVisual img{min-height:0} .duoPhoto{aspect-ratio:4/3} .galItem{aspect-ratio:4/3} .shopThumb{aspect-ratio:1/1} .articleImg{aspect-ratio:16/9} /* tam ekran hero ve zemin görselleri oranla değil yükseklikle çalışır */ .heroImage,.secBg,.ctaBg{position:absolute;inset:0;aspect-ratio:auto} /* yer tutucu yazısı görsel gelince kaybolur */ .ptMedia:has(img) .phLabel,.detailMedia:has(img) .phLabel, .lpSubImg:has(img) .phLabel,.lpProjImg:has(img) .phLabel, .projectImg:has(img) .phLabel,.splitVisual:has(img) .phLabel, .duoPhoto:has(img) .phLabel{display:none} /* kayan referans şeridi: kutunun dışına taşmasın */ .refCarousel{overflow:hidden;max-width:100%;min-width:0} /* şeridin kendisi kırpılan bir pencere içinde kalır */ .refViewport{overflow:hidden;min-width:0;flex:1 1 auto} .refTrack{will-change:transform;min-width:0;position:relative} .refCarousel{position:relative} /* ürün sayfası hero görseli: tüm alanı kaplar */ .lpHero{position:relative;overflow:hidden;isolation:isolate} .lpHeroBg{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--f-141a19)} .lpHeroBg img,.lpHeroBg video{ position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center; display:block;max-width:none } /* görselin üstünde yalnız yazıların okunduğu alt kısımda hafif bir geçiş kalır */ .lpHeroBg:after{ content:"";position:absolute;left:0;right:0;bottom:0;height:52%; background:linear-gradient(180deg,rgb(var(--perdeRgb) / 0) 0%,rgb(var(--perdeRgb) / .72) 100%) } .lpHeroIn{position:relative;z-index:1} @media(max-width:900px){ .lpHeroBg:after{height:70%;background:linear-gradient(180deg,rgb(var(--perdeRgb) / 0) 0%,rgb(var(--perdeRgb) / .88) 100%)} } /* ürün ve kategori hero görseli: üzerinde karartma katmanı bırakılmaz */ .lpHero .lpHeroBg,.lpHero .lpHeroBg img,.lpHero .lpHeroBg video{opacity:1;filter:none} .lpHero:before,.lpHero:after{content:none} /* ===================================================================== SİTE KABUĞU — erişilebilirlik, taşma ve düzen düzeltmeleri (görünüm aynı kalır; yalnız hatalar giderilir) ===================================================================== */ /* ---- yardımcı sınıflar ---- */ .blk{display:contents} [hidden]{display:none !important} @media(max-width:900px){.gizleMobil,.gizliMobil{display:none !important}} @media(min-width:901px){.gizleMasaustu,.gizliMasaustu{display:none !important}} /* editör önizlemesi: gizli blok soluk, boş görsel alanı kesikli çerçeveli */ .blokGizli{opacity:.35;filter:grayscale(.6)} .blokGizli:hover{opacity:.6} .onizlemePh{outline:1px dashed rgb(var(--fotoMetinRgb) / .38);outline-offset:-10px;color:rgb(var(--fotoMetinRgb) / .55) !important} .onizlemePh small{color:rgb(var(--fotoMetinRgb) / .42) !important} .gorselGizli{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap} /* ---- içeriğe geç bağlantısı ---- */ .atla{position:fixed;left:12px;top:-60px;z-index:1000;background:var(--dugme);color:var(--dugmeUstu);padding:12px 18px; font-size:13px;font-weight:700;border-radius:8px;transition:top .15s ease} .atla:focus,.atla:focus-visible{top:12px} main#icerik{display:block;outline:0} /* ---- görünür odak halkası (WCAG 2.4.7) — açık ve koyu zeminde görünür ---- */ a:focus-visible,button:focus-visible,summary:focus-visible,[role="button"]:focus-visible,[tabindex]:not([tabindex="-1"]):focus-visible{ outline:2px solid var(--metinGuclu);outline-offset:2px;box-shadow:0 0 0 4px var(--odakHalka)} .dark a:focus-visible,.dark button:focus-visible,.footer a:focus-visible,.copyright a:focus-visible,.copyright button:focus-visible, .mobilBar a:focus-visible,.ctaBand a:focus-visible,.duo a:focus-visible,.hero a:focus-visible,.hero button:focus-visible, .pageTop a:focus-visible,.lpHero a:focus-visible,.approach a:focus-visible,.svcSec a:focus-visible,.cerezBant a:focus-visible,.cerezBant button:focus-visible{ outline-color:var(--metinKoyuUstu)} input:focus-visible,select:focus-visible,textarea:focus-visible{ outline:2px solid var(--metinGuclu) !important;outline-offset:1px;border-color:var(--metinGuclu) !important;box-shadow:0 0 0 4px rgb(var(--vurguRgb) / .55)} input[type="checkbox"]:focus-visible,input[type="radio"]:focus-visible{outline-offset:2px} .mega a:focus-visible,.mdrawer a:focus-visible,.mdrawer button:focus-visible{outline-offset:-2px;box-shadow:inset 0 0 0 4px var(--odakHalka)} /* ---- iOS'ta odakta yakınlaştırma olmasın: dokunmatik genişlikte form yazısı ≥ 16 px ---- */ @media(max-width:900px){ html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),html body select,html body textarea{font-size:16px !important} } /* ---- yatay taşma: oran (aspect-ratio) + min-height taşıyan ızgara öğeleri daralabilsin ---- */ .duo>*,.blogGrid>*,.blogFeature>*,.split>*,.lpOverview>*,.contactGrid>*,.metinGorsel .mgGrid>*,.sectorIntro>*,.galGrid>*{min-width:0} .duoPhoto,.articleImg,.splitVisual,.galItem,.detailMedia{min-width:0;max-width:100%} /* kendi kabında kayan şeritler (sayfa taşmaz) */ .stats{max-width:100%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch} .lpTabs,.detailTabs,.categoryNav,.shopChips,.blogFilters{max-width:100%;min-width:0} .categoryNav a,.shopChip,.blogFilter{max-width:100%;overflow-wrap:anywhere} .lpTabs,.detailTabs{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin} .lpTabs a,.detailTabs a{flex:0 0 auto} @media(max-width:900px){.refTableWrap{overflow-x:auto}} .refTable td,.refTable th{overflow-wrap:anywhere} .prose,.legal,.customHtml{overflow-wrap:break-word} .customHtml img,.customHtml video,.customHtml table{max-width:100%} /* ---- header: menü sarmalı (nav landmark) düzeni değiştirmez ---- */ .anaNav{display:none;margin-left:auto;min-width:0} @media(min-width:1240px){.anaNav{display:flex;align-items:center}} .anaNav .nav{margin-left:0} /* etkin sayfa: tasarımdaki hover çizgisi */ .nav>li>a.aktif:after,.nav>li>a[aria-current="page"]:after{right:10px} @media(min-width:1240px) and (max-width:1439px){.nav>li>a.aktif:after,.nav>li>a[aria-current="page"]:after{right:7px}} .megaCol a[aria-current="page"]{background:var(--zemin2)} .megaCol a[aria-current="page"] svg{color:var(--vurguMetin)} .mdrawer a[aria-current="page"]{color:var(--metinGuclu);font-weight:700} .mdrawer .msub a[aria-current="page"]{color:var(--metinGuclu)} /* logo yükseklikleri panelden (--logoH / --logoFH) */ .header .logo img{height:var(--logoH,50px)} .footer .logo img{height:var(--logoFH,32px)} @media(max-width:560px){.header .logo img{height:calc(var(--logoH,50px) * .76)}} .header .logo img,.footer .logo img{width:auto} /* açılışta görünürlük hemen gelsin (klavye odağı aynı karede içeri girebilsin); kapanışta solma korunur */ .nav>li[data-open="true"] .mega{transition:opacity .2s var(--ez),transform .2s var(--ez)} .mdrawer[data-open="true"]{transition:opacity .25s var(--ez)} /* çekmece açıkken sayfa kaymasın */ html.kilitli{overflow:hidden}html.kilitli body{overflow:visible} .mdrawer{overscroll-behavior:contain} /* ---- duyuru çubuğu (header.duyuru) — üst şeridin yerini alır ---- */ .topbar.duyuru{height:auto;position:relative;z-index:101;background:var(--panel);color:var(--k-c2c9c8);padding:9px 4vw;text-align:center} .duyuruIn{margin:0;font-size:12px;line-height:1.5;letter-spacing:.02em} .duyuruIn a{color:var(--metinKoyuUstu);font-weight:600;border-bottom:1px solid rgb(var(--vurguRgb) / .6);padding-bottom:1px} .duyuruIn a:hover{color:var(--vurguAcik)} .duyuruIn a span{color:var(--vurguAcik)} /* ---- header eylem düğmesi (header.cta) ---- */ @media(min-width:1240px) and (max-width:1439px){.quote{display:inline-flex;padding:12px 16px;font-size:12px}} .quote{white-space:nowrap} .mdrawer .quoteM{background:var(--dugme);color:var(--dugmeUstu);border-radius:12px;letter-spacing:.08em} .mdrawer .quoteM:hover{background:var(--vurgu);color:var(--vurguUstu)} /* ---- mobil bar: burger menünün göründüğü her genişlikte (≤1239 px) ---- */ @media(max-width:1239px){.mobilBar{display:grid}} @media(min-width:901px) and (max-width:1239px){ .mobilBar,.mobilBar.tasarim1,.mobilBar.tasarim3{left:50%;right:auto;width:min(560px,calc(100% - 32px));transform:translateX(-50%);bottom:14px;border-radius:18px; border:1px solid rgb(var(--metinKoyuUstuRgb) / .14);box-shadow:0 20px 40px -22px rgba(0,0,0,.85)} } .mobilBar a{min-width:0} /* bar içeriğin son satırını örtmesin: koyu telif satırı barın altına kadar uzar */ @media(max-width:1239px){ body.mobilBarVar .copyright{padding-bottom:calc(18px + 64px + env(safe-area-inset-bottom))} body.mobilBarVar .cerezBant{bottom:calc(76px + env(safe-area-inset-bottom))} } /* ---- telif satırındaki çerez ayarları bağlantısı ---- */ .cerezAc{background:none;border:0;padding:0;margin-left:10px;font:inherit;font-size:12px;color:var(--k-98a1a0); text-decoration:underline;text-underline-offset:3px;cursor:pointer} .cerezAc:hover{color:var(--metinKoyuUstu)} /* ---- çerez bandı (KVKK) ---- */ .cerezBant{position:fixed;left:clamp(12px,2vw,26px);bottom:clamp(12px,2vw,26px);z-index:150;width:min(440px,calc(100% - 24px)); background:var(--koyu);color:var(--k-c2c9c8);padding:20px 20px 18px;border-radius:16px; background-image:radial-gradient(130% 90% at 14% 0%,rgb(var(--metinKoyuUstuRgb) / .085),transparent 56%); box-shadow:inset 0 0 0 1px rgb(var(--metinKoyuUstuRgb) / .1),0 30px 60px -28px rgba(0,0,0,.85)} .cerezBaslik{margin:0 0 8px;font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--metinKoyuUstu);outline:0} .cerezMetin{margin:0;font-size:12px;line-height:1.7;color:var(--metinKoyuUstu2)} .cerezMetin a{color:var(--metinKoyuUstu);text-decoration:underline;text-underline-offset:3px} .cerezDugmeler{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px} .cerezB{flex:1 1 auto;min-height:40px;padding:10px 14px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase; border:1px solid rgb(var(--metinKoyuUstuRgb) / .35);background:transparent;color:var(--metinKoyuUstu);border-radius:999px;transition:background .2s var(--ez),color .2s var(--ez),border-color .2s var(--ez)} .cerezB:hover{background:var(--metinKoyuUstu);color:var(--koyu);border-color:var(--metinKoyuUstu)} .cerezB.cerezKabul{background:var(--vurgu);border-color:var(--vurgu);color:var(--vurguUstu)} .cerezB.cerezKabul:hover{background:var(--metinKoyuUstu);border-color:var(--metinKoyuUstu);color:var(--koyu)} .cerezPanel{margin-top:14px;border-top:1px solid rgb(var(--metinKoyuUstuRgb) / .12)} .cerezSecenek{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;padding:11px 0;border-bottom:1px solid rgb(var(--metinKoyuUstuRgb) / .12)} .cerezSecenek input{width:18px;height:18px;margin:0;accent-color:var(--vurgu)} .cerezSecenek label{font-size:12.5px;font-weight:700;color:var(--metinKoyuUstu)} .cerezSecenek small{grid-column:2;font-size:12px;line-height:1.55;color:var(--metinKoyuUstu3)} @media(max-width:560px){.cerezBant{left:10px;right:10px;width:auto;padding:16px}.cerezB{flex:1 1 40%}} /* ---- footer sarmalı (contentinfo) + tasarım rengine en yakın AA kontrast ---- */ .siteAlt{display:block} .copyright,.sigWrap{color:var(--k-7f8988)} .sig{color:var(--imza);opacity:1;border-bottom-color:rgb(var(--imzaRgb) / .4)} .langOff{opacity:.82} .lpFilterItem small{color:var(--a-696c6e)} .lpFilterItem.on small{color:rgb(var(--dugmeUstuRgb) / .7)} .featureCopy .articleMeta,.dark .articleMeta{color:var(--metinKoyuUstu2) !important} .productInfo span,.productMeta em{color:var(--a-66696b) !important} .fleetBody p{color:var(--a-707070)} /* ---- mobil hero: yazı, mutlak konumlu görsel katmanının altında kalmasın ---- */ @media(max-width:700px){ .hero .heroText,.hero .heroMeta{position:relative;z-index:2} .hero{padding-top:128px} } /* ---- SSS: düğme olarak basıldığında tasarımdaki satır görünümü ---- */ button.faqItem{width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer;gap:14px} .faqItem[role="button"]{cursor:pointer} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}} /* ===================================================================== BLOK ZEMİNİ — editörde Görünüm > Arka plan (BlokZemin, SitePalet::kapsamCss) .zb.zk- bölümün zeminini ve içindeki bütün renk token'larını değiştirir; kapsamın değerleri sayfanın bölümünde basılır. Varsayılan seçenekte sınıf yoktur. ===================================================================== */ .zb{color:var(--metin)} .zbGorsel{position:relative;isolation:isolate} .zbGorsel>.zbKatman{position:absolute !important;inset:0 !important;z-index:-1 !important;overflow:hidden;pointer-events:none; margin:0 !important;padding:0 !important;width:auto !important;height:auto !important;min-height:0 !important;border:0 !important} .zbKatman>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;display:block} .zbKatman::after{content:"";position:absolute;inset:0;pointer-events:none} /* kapsam içinde tarayıcının varsayılan düğme renkleri de zemine uysun */ .zb .filterClear{color:inherit} .zb .shopQty button{background-color:var(--zemin2)} .zb input,.zb textarea,.zb select{color:var(--metinGuclu)} /* blok zemini seçilince bloğun kendi zemin görseli katmanı yerini ona bırakır; fotoğraf kartındaki düğme hep fotoğraf üstü renkte */ .zb>.secBg,.zb>.ctaBg,.zb>.svcBg{display:none !important} .duoPhotoCopy .ghostBtn{border-color:rgb(var(--fotoMetinRgb) / .55) !important;color:var(--fotoMetin) !important} .duoPhotoCopy .ghostBtn:hover{border-color:var(--vurgu) !important;color:var(--vurguUstu) !important} /* site dokusu: görseli yüklenmemiş bölüm zemini katmanında da görünsün (doku yokken saydam katman) */ .secBg{background-image:var(--dokuKoyu);background-size:var(--dokuKoyuBoyut)} .zb .payBtn.wa:hover{background-color:var(--zemin3)} /* ---- okunurluk (WCAG AA): özgün tasarımda eşiğin altında kalan küçük öğeler; paletle birlikte ayarlanır ---- */ .nav .chev{opacity:.75} .railBtn{border-color:rgb(var(--metinKoyuUstuRgb) / .75)} .shopCat,.contactList span{color:var(--metin2)} .form input,.form textarea,.form select,.asrForm input,.asrForm textarea,.asrForm select{border-color:color-mix(in srgb,var(--metin3) 55%,var(--metin2))} .titanium .kicker,.cta.titanium .kicker{color:var(--metinKoyuUstu2)} .process.processBig>div>span{color:var(--metinKoyuUstu2) !important} .cartLink:hover{color:var(--vurguUstu);background:var(--vurgu)} .cartDel,.payBtn,.fg .fl input,.fg .fl textarea,.fg .fl select{border-color:color-mix(in srgb,var(--metin3) 55%,var(--metin2))} .payBtn.wa:hover{border-color:#128c4a} .svcNo{color:var(--metinKoyuUstu2)} .svcCard:hover b,.svcCard:hover .svcNo{color:var(--metinKoyuUstu)} .svcCard:hover p{color:rgb(var(--metinKoyuUstuRgb) / .86)} .serviceNo,.projectBody span{color:var(--metin2)} .solutionCard p{color:color-mix(in srgb,var(--metin2) 65%,var(--metin))} .sectorPanel .kicker{color:var(--metinKoyuUstu2)} .sectorBig:after{background:linear-gradient(0deg,rgb(var(--perde3Rgb) / .9),rgb(var(--perde3Rgb) / .62) 45%,rgb(var(--perde3Rgb) / .12) 85%)} .sectorBig p{color:var(--fotoMetin)} .cartForm .fl input:focus,.cartForm .fl textarea:focus,.form input:focus,.form textarea:focus,.form select:focus{border-color:var(--metinGuclu)} .cartForm .fl.bad input,.cartForm .fl.bad textarea{border-color:var(--hata)} /* mobil header: tam genişlik kapsül (kenarlardan 12 px) */ @media(max-width:900px){.header{padding:12px 12px 0}.header .hin{width:100%;max-width:none;flex:1 1 auto;min-height:64px}} /* ---- referans kartlı carousel (Referans logoları > Görünüm: Kartlı carousel) — "Ürün grubu" kartlarının düzeni ---- */ .refKartCar{position:relative} .refKartPencere{overflow:hidden} .refKartIz{display:flex;transition:transform .6s var(--ez)} .refKartSayfa{flex:0 0 100%;display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--cizgi);border-top:1px solid var(--cizgi)} .refKart{border-right:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);background:var(--kart);display:flex;flex-direction:column} .refKartLogo{aspect-ratio:2/1;display:grid;place-items:center;padding:0;background:var(--kart);border-bottom:1px solid var(--cizgi);overflow:hidden} .refKartLogo img{width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;filter:grayscale(1);opacity:.9;transition:filter .3s,opacity .3s} .refKart:hover .refKartLogo img{filter:none;opacity:1} .refKartAd{font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--metin2);text-align:center;line-height:1.15} .refKartBilgi{background:var(--zemin2);padding:14px 16px;min-height:72px;display:flex;flex-direction:column;justify-content:flex-start;gap:4px} .refKartBilgi strong{font-size:13px;letter-spacing:.02em;color:var(--metinGuclu)} .refKartBilgi span{font-size:12px;color:var(--metin2)} .refKartNav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:22px} .refKartNav .refArrow{position:static;transform:none} .refKartNoktalar{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:min(60vw,520px)} .refKartSayac{display:none;font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--metin2);min-width:56px;text-align:center} .refKartNav{scroll-margin-bottom:96px} .refKartNokta{width:22px;height:4px;border:0;padding:0;background:var(--metin3);cursor:pointer;position:relative;transition:width .3s,background .3s} .refKartNokta::before{content:"";position:absolute;inset:-10px -2px} .refKartNokta[aria-current="true"]{background:var(--metinGuclu);width:40px} @media(max-width:620px){.refKartNoktalar{display:none}.refKartSayac{display:block}} @media(max-width:900px){.refKartSayfa{grid-template-columns:repeat(2,1fr)}.refKartAd{font-size:15px}.refKartBilgi{padding:10px 12px;min-height:58px}} @media(prefers-reduced-motion:reduce){.refKartIz{transition:none}} /* proje kartında görsel yoksa firma logosu (beyaz zemin, ortalı) */ .lp-img,.projectImg,.lpProjImg{position:relative} .projLogo{position:absolute;inset:0;display:grid;place-items:center;background:var(--kart);overflow:hidden} .projLogo img{position:static;inset:auto;max-width:78%;max-height:72%;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.9;transition:filter .3s,opacity .3s} .projectCard:hover .projLogo img,.lpProj:hover .projLogo img,.lp:hover .projLogo img{filter:none;opacity:1} /* logolu proje kartı: görsel alanı yayvan, logo biraz daha büyük */ .projectCard.logolu .projectImg{aspect-ratio:2/1;min-height:0} .projectCard.logolu .projLogo img,.lpProj.logolu .projLogo img{max-width:88%;max-height:82%} /* ===================================================================== GALERİ — ızgara / kaydırmalı carousel, görsel altı ad, büyük görüntüleyici ===================================================================== */ .galFig{margin:0;min-width:0;display:flex;flex-direction:column} .galFig .galItem{display:block;width:100%} a.galItem{cursor:zoom-in} a.galItem img{transition:transform .5s var(--ez)} a.galItem:hover img{transform:scale(1.035)} a.galItem:focus-visible{outline:3px solid var(--metinGuclu);outline-offset:3px;box-shadow:0 0 0 3px var(--kart)} .galFig figcaption{font-size:12.5px;line-height:1.45;color:var(--metin2);padding:8px 2px 0} @media(max-width:700px){.galGrid.s2,.galGrid.s3,.galGrid.s4{grid-template-columns:repeat(2,1fr)}.galFig figcaption{font-size:12px}} /* carousel: tek satır, yatay kaydırma (dokunmatikte parmakla), oklar masaüstünde */ .galCarKap{position:relative} .galGrid.galCar{display:grid;grid-auto-flow:column;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory; scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain} .galGrid.galCar::-webkit-scrollbar{display:none} .galGrid.galCar>.galFig{scroll-snap-align:start} .galGrid.galCar.s2{grid-auto-columns:calc((100% - 10px)/2)} .galGrid.galCar.s3{grid-auto-columns:calc((100% - 20px)/3)} .galGrid.galCar.s4{grid-auto-columns:calc((100% - 30px)/4)} @media(max-width:700px){.galGrid.galCar.s2,.galGrid.galCar.s3,.galGrid.galCar.s4{grid-auto-columns:44%}} .galCarKap .refArrow{position:absolute;top:calc(50% - 16px);z-index:2;width:36px;height:36px;background:rgb(var(--kartRgb) / .92); color:var(--metinGuclu);border:1px solid var(--cizgi);box-shadow:0 6px 18px -8px rgb(var(--golgeRgb) / .5)} .galCarKap.galYaziVar .refArrow{top:calc(50% - 30px)} .galCarKap .galOnceki{left:-14px}.galCarKap .galSonraki{right:-14px} .galCarKap .refArrow[disabled]{opacity:0;pointer-events:none} @media(max-width:700px){.galCarKap .refArrow{display:none}} /* büyük görüntüleyici */ .lb{position:fixed;inset:0;z-index:300;background:rgb(10 12 13 / .94);display:none;align-items:center;justify-content:center; padding:56px 64px;touch-action:pan-y} .lb[data-acik="true"]{display:flex} .lb figure{margin:0;display:flex;flex-direction:column;align-items:center;max-width:100%;max-height:100%} .lb img{max-width:100%;max-height:calc(100vh - 150px);object-fit:contain;display:block;background:#111} .lb figcaption{color:#e8ecec;font-size:13px;margin-top:12px;text-align:center} .lbSayac{position:absolute;top:18px;left:22px;color:#c9d0cf;font-size:12px;letter-spacing:.08em} .lbBtn{position:absolute;border:0;background:rgb(255 255 255 / .1);color:#fff;width:46px;height:46px;display:grid;place-items:center; font-size:20px;cursor:pointer;transition:background .2s} .lbBtn:hover{background:rgb(255 255 255 / .22)} .lbBtn:focus-visible{outline:3px solid var(--odakHalka);outline-offset:2px} .lbKapat{top:10px;right:12px}.lbOnceki{left:10px;top:calc(50% - 23px)}.lbSonraki{right:10px;top:calc(50% - 23px)} @media(max-width:700px){.lb{padding:52px 8px 20px}.lbOnceki,.lbSonraki{top:auto;bottom:14px}.lbOnceki{left:calc(50% - 56px)}.lbSonraki{right:calc(50% - 56px)} .lb img{max-height:calc(100vh - 170px)}} /* blog kartı görseli kartın tamamını kaplasın (sabit yükseklik + 16:9 oranı genişliği daraltıyordu) */ .articleImg{width:100%;height:auto;min-height:0} /* öne çıkan blog kartı: görsel 16:9 ve 330 px yüksekliğinde kalır (seçilen görünüm: B); mobilde tam genişlik */ .blogFeature .articleImg{height:330px;min-height:0;aspect-ratio:16/9;width:auto;max-width:100%} @media(max-width:900px){.blogFeature .articleImg{width:100%;height:auto;aspect-ratio:16/9}} /* ===================================================================== BÜYÜK GÖRSEL (tek görsel, yazısız) — kenardan kenara ya da içerik genişliğinde ===================================================================== */ .tekGorsel{margin:0;padding:0} .tekGorsel.tgIcerik{padding:0 5.9vw} .tgBosluk-az{padding-top:clamp(16px,2vw,28px) !important;padding-bottom:clamp(16px,2vw,28px) !important} .tgBosluk-normal{padding-top:clamp(36px,4.5vw,72px) !important;padding-bottom:clamp(36px,4.5vw,72px) !important} .tekGorsel .tgKutu{position:relative;display:block;width:100%;overflow:hidden;background:var(--fotoZemin)} .tgOran-3-1 .tgKutu{aspect-ratio:3/1} .tgOran-21-9 .tgKutu{aspect-ratio:21/9} .tgOran-16-9 .tgKutu{aspect-ratio:16/9} .tgOran-4-3 .tgKutu{aspect-ratio:4/3} .tekGorsel .tgKutu img{position:absolute;inset:0;width:100%;height:100%;max-width:none;display:block} .tgOran-dogal .tgKutu{background:transparent} .tgOran-dogal .tgKutu img{position:static;height:auto} .tgMasa,.tgMobil{position:absolute;inset:0;display:block} .tgMobil{display:none} a.tgKutu img{transition:transform .8s var(--ez),opacity .3s} a.tgKutu:hover img{transform:scale(1.02)} a.tgKutu:focus-visible{outline:3px solid var(--metinGuclu);outline-offset:3px} .tgBos{padding:40px 5.9vw} @media(max-width:700px){ .tekGorsel.tgIcerik{padding-left:20px;padding-right:20px} .tgOran-3-1 .tgKutu{aspect-ratio:2/1} .tgOran-21-9 .tgKutu{aspect-ratio:16/9} .tgMobilVar .tgKutu{aspect-ratio:4/3} .tgMobilVar .tgMasa{display:none} .tgMobilVar .tgMobil{display:block} .tgOran-dogal.tgMobilVar .tgKutu{aspect-ratio:auto} .tgOran-dogal.tgMobilVar .tgMobil{position:static} } /* kart içinde belge (PDF): görsel yoksa belge simgesi, altta "Belgeyi aç" */ .projectImg.belgeImg{display:grid;place-items:center;background:var(--zemin2)} .belgeKutu{position:relative;display:grid;place-items:center;color:var(--metin2)} .belgeKutu svg{width:56px;height:70px} .belgeKutu b{position:absolute;bottom:14px;font-size:11px;letter-spacing:.12em;color:var(--metinGuclu);background:var(--vurgu);padding:2px 6px} .kartBelgeAc{display:block;margin-top:10px;font-style:normal;font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--metinGuclu);text-transform:uppercase} .kartBelge:hover .kartBelgeAc{text-decoration:underline;text-underline-offset:3px} a.projectCard{display:block;color:inherit;text-decoration:none}