/* b23 (2026-10-07): yazı tipleri Google'dan @import yerine kendi sunucudan (fonts-1/, yalnız latin + latin-ext; font-display:swap). PageSpeed: @import zinciri mobilde 2,7 sn gecikme + 2 ek bağlantı üretiyordu. Lisans: SIL OFL (Libre Franklin, IBM Plex). */ @font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts-1/ibm-plex-mono-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts-1/ibm-plex-mono-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts-1/ibm-plex-mono-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts-1/ibm-plex-mono-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts-1/ibm-plex-sans-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts-1/ibm-plex-sans-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Libre Franklin';font-style:normal;font-weight:500 800;font-display:swap;src:url(fonts-1/libre-franklin-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'Libre Franklin';font-style:normal;font-weight:500 800;font-display:swap;src:url(fonts-1/libre-franklin-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} /* Be Theme'in #Wrapper'ında overflow:hidden var; bu, hero'nun position:sticky'sini öldürür. overflow-x:clip aynı yatay kırpmayı yapar ama kaydırma konteyneri yaratmaz, sticky çalışır. Bu CSS yalnız bu sayfada yüklendiği için site geneline dokunmaz. */ #Wrapper{overflow-x:clip;overflow-y:visible} /* ============================================================================ CE DANISMANI — ANASAYFA v12 (2026-09-27) Hero: hero-KESIN.html (varyant 9 + "Yeni Makine Yonetmeligi" ust satiri) Bolumler: v11'den tasindi; "robot" CTA'lari WhatsApp/on gorusme ile degisti (arac henuz yok — karar 2026-09-27). Yeni bolum: Yeni Makine Yonetmeligi. Header/footer YOK — Be Theme sarar. Tum seciciler #ce altinda. ========================================================================== */ /* ============================================================================ CE DANIŞMANI — ANASAYFA v11 Plan: açık indigo (lineaprompt ritmi) · Space Grotesk + IBM Plex Sans/Mono İmza: CE işaretinin resmî yapım geometrisi (765/2008 Ek II) Header/footer YOK — Be Theme sarar. Tüm seçiciler #ce altında. ========================================================================== */ #ce{ --paper:#EDF2F9; --card:#FFFFFF; --ink:#0D1420; --seal:#2E3A8C; --seal-lt:#4B57C4; --conform:#16815F; --notice:#A84A07; --mu:#54617A; --mu2:#5F6B80; --rule:rgba(61,77,99,.14); --disp:'Libre Franklin',system-ui,sans-serif; --body:'IBM Plex Sans',system-ui,sans-serif; --mono:'IBM Plex Mono',ui-monospace,monospace; --e:cubic-bezier(.2,.7,.3,1); --sh:0 1px 2px rgba(13,20,32,.04),0 18px 46px -28px rgba(34,48,80,.35); font-family:var(--body); background:var(--paper); color:var(--ink); font-size:16px; line-height:1.62; -webkit-font-smoothing:antialiased; } #ce *{box-sizing:border-box;margin:0;padding:0} #ce a{color:inherit;text-decoration:none} #ce img{display:block;max-width:100%} #ce .wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,44px)} #ce .band{padding:clamp(70px,8.5vw,124px) 0;position:relative} /* ---- tipografi ---- */ #ce h1,#ce h2,#ce h3{font-family:var(--disp);font-weight:700;letter-spacing:-.03em;line-height:1.06;color:var(--ink)} #ce h1{font-size:clamp(36px,4.6vw,62px);letter-spacing:-.035em} #ce h2{font-size:clamp(28px,3.5vw,46px)} #ce h3{font-size:clamp(17px,1.45vw,20px);letter-spacing:-.02em;line-height:1.3} #ce p{color:var(--mu);font-size:clamp(15px,1.05vw,17px);max-width:56ch} #ce .kbd{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mu2)} /* ---- pill etiket ---- */ #ce .pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10.5px;font-weight:500; letter-spacing:.13em;text-transform:uppercase;color:var(--seal);background:rgba(46,58,140,.07); border:1px solid rgba(46,58,140,.16);border-radius:100px;padding:6px 13px} /* ---- butonlar ---- */ #ce .btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-size:14.5px;font-weight:600; padding:13px 22px;border-radius:11px;border:1px solid transparent;cursor:pointer;transition:.18s var(--e)} #ce .btn-p{background:var(--seal);color:#fff;box-shadow:0 10px 24px -14px rgba(46,58,140,.9)} #ce .btn-p:hover{background:#26307a;transform:translateY(-1px);box-shadow:0 14px 30px -14px rgba(46,58,140,.95)} #ce .btn-s{background:var(--card);color:var(--ink);border-color:var(--rule);box-shadow:0 1px 2px rgba(13,20,32,.05)} #ce .btn-s:hover{border-color:rgba(46,58,140,.4);transform:translateY(-1px)} #ce .btn .ar{transition:transform .25s var(--e)} #ce .btn:hover .ar{transform:translateX(4px)} /* ---- İMZA: CE yapım geometrisi ---- */ #ce .ce-mark{pointer-events:none;max-width:100%;height:auto} #ce .proc-head{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center} /* NOT: fill/stroke değerleri SVG'de inline verilir — CSS'ten fill vermek inline fill="none"ı ezip yayı doldurur (2026-08-01'de yaşandı). */ /* çizim animasyonu */ #ce .draw .guide,#ce .draw .dim{stroke-dasharray:340;stroke-dashoffset:340;transition:stroke-dashoffset 1.6s var(--e)} #ce .draw.in .guide,#ce .draw.in .dim{stroke-dashoffset:0} #ce .draw .glyph{opacity:0;transform:translateY(6px);transition:opacity .9s var(--e) .5s,transform .9s var(--e) .5s} #ce .draw.in .glyph{opacity:1;transform:none} /* ---- HERO ---- */ #ce .hero{position:relative;overflow:hidden;padding:clamp(56px,7vw,96px) 0 clamp(60px,7vw,100px)} #ce .hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none; background-image:linear-gradient(rgba(46,58,140,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(46,58,140,.045) 1px,transparent 1px); background-size:58px 58px; mask-image:radial-gradient(105% 72% at 50% 0%,#000 22%,transparent 78%); -webkit-mask-image:radial-gradient(105% 72% at 50% 0%,#000 22%,transparent 78%)} #ce .hero .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.02fr 1fr;gap:clamp(32px,4vw,54px);align-items:center} #ce .hero h1{margin:20px 0 18px} #ce .hero .lead b{color:var(--ink);font-weight:600} #ce .acts{display:flex;flex-wrap:wrap;gap:11px;margin-top:28px} #ce .specs{display:flex;flex-wrap:wrap;gap:7px;margin-top:24px} #ce .spec{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;color:var(--mu2);background:var(--card); border:1px solid var(--rule);border-radius:7px;padding:5px 10px} /* ---- ÜRÜN UI PANELİ (lineaprompt deseni, açık tema) ---- */ #ce .panel{background:var(--card);border:1px solid var(--rule);border-radius:15px;box-shadow:var(--sh);overflow:hidden} #ce .p-top{display:flex;align-items:center;gap:9px;padding:12px 15px;border-bottom:1px solid var(--rule);background:#FBFCFE} #ce .p-top .dot{width:8px;height:8px;border-radius:50%;background:rgba(61,77,99,.18)} #ce .p-top .ttl{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mu2);margin-left:5px} #ce .p-body{padding:16px} #ce .p-in{display:flex;align-items:center;gap:9px;background:#F6F8FC;border:1px solid var(--rule);border-radius:10px;padding:12px 13px;margin-bottom:13px} #ce .p-in .q{font-size:14.5px;font-weight:600;color:var(--ink)} #ce .p-in .caret{width:1.5px;height:15px;background:var(--seal);animation:blink 1.15s steps(1) infinite} @keyframes blink{50%{opacity:0}} #ce .p-in .esc{margin-left:auto;font-family:var(--mono);font-size:9.5px;text-transform:uppercase;color:var(--mu2); border:1px solid var(--rule);border-radius:5px;padding:3px 7px;background:var(--card)} #ce .verdict{display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:10px;margin-bottom:14px; background:rgba(22,129,95,.08);border:1px solid rgba(22,129,95,.22)} #ce .verdict .tk{width:18px;height:18px;border-radius:50%;background:var(--conform);color:#fff;display:flex; align-items:center;justify-content:center;font-size:11px;font-weight:700;flex:none} #ce .verdict b{font-family:var(--body);font-size:13px;font-weight:600;color:var(--conform)} #ce .p-lab{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mu2);margin-bottom:8px} #ce .r{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:9px;background:#FAFBFD; border:1px solid var(--rule);margin-bottom:6px;opacity:0;transform:translateX(9px); transition:opacity .5s var(--e),transform .5s var(--e)} #ce .panel.on .r{opacity:1;transform:none} #ce .r.sel{background:var(--seal);border-color:var(--seal)} #ce .r.sel .nm,#ce .r.sel .meta{color:#fff} #ce .r.sel .tag{background:rgba(255,255,255,.2);color:#fff} #ce .r .tag{font-family:var(--mono);font-size:8.5px;letter-spacing:.05em;padding:3px 6px;border-radius:4px; background:rgba(46,58,140,.1);color:var(--seal);flex:none} #ce .r .nm{font-size:12.5px;font-weight:500;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #ce .r .code{font-family:var(--mono);font-size:11.5px;color:var(--ink)} #ce .r .meta{margin-left:auto;font-family:var(--mono);font-size:9.5px;color:var(--mu2);flex:none} #ce .p-foot{margin-top:12px;padding-top:11px;border-top:1px solid var(--rule);display:flex;justify-content:space-between; font-family:var(--mono);font-size:9.5px;color:var(--mu2)} /* ---- GÜVEN ŞERİDİ ---- */ #ce .strip{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:rgba(255,255,255,.55)} #ce .strip .wrap{display:flex;flex-wrap:wrap;gap:14px 40px;justify-content:center;padding-top:20px;padding-bottom:20px} #ce .strip span{font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--mu2)} #ce .strip b{color:var(--ink);font-weight:500} /* ---- ÖZELLİK BLOKLARI (dönüşümlü) ---- */ #ce .feat .wrap{display:grid;grid-template-columns:1fr 1.06fr;gap:clamp(32px,4.5vw,64px);align-items:center} #ce .feat.rev .wrap{grid-template-columns:1.06fr 1fr} #ce .feat.rev .ftx{order:2} #ce .feat h2{margin:18px 0 16px} #ce .checks{margin-top:20px;display:grid;gap:10px} #ce .checks .ck{width:17px;height:17px;flex:none;border-radius:50%;background:rgba(22,129,95,.12);color:var(--conform); display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;margin-top:3px} /* ---- SÜREÇ ---- */ #ce .proc{background:var(--card);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)} #ce .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:clamp(34px,4vw,52px)} #ce .step{position:relative;padding-top:24px;border-top:2px solid var(--rule);transition:border-color .5s var(--e)} #ce .step.on{border-top-color:var(--seal)} #ce .step .sn{font-family:var(--mono);font-size:11px;color:var(--seal);display:block;margin-bottom:12px} #ce .step h3{margin-bottom:8px} #ce .step p{font-size:13.5px;line-height:1.55} /* ---- HİZMETLER ---- */ #ce .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px} #ce .card{background:var(--card);border:1px solid var(--rule);border-radius:13px;padding:20px;transition:.22s var(--e)} #ce .card:hover{border-color:rgba(46,58,140,.34);transform:translateY(-3px);box-shadow:var(--sh)} #ce .card h3{margin-bottom:8px;font-size:16.5px} #ce .card p{font-size:13px;line-height:1.55} #ce .card .tg{display:flex;flex-wrap:wrap;gap:5px;margin-top:13px} #ce .card .tg span{font-family:var(--mono);font-size:8.5px;letter-spacing:.05em;color:var(--mu2); border:1px solid var(--rule);border-radius:5px;padding:3px 6px} /* ---- AKORDEON ---- */ #ce .req .wrap{display:grid;grid-template-columns:.4fr .6fr;gap:clamp(28px,4vw,60px);align-items:start} #ce .acc{border-bottom:1px solid var(--rule)} #ce .acc:first-of-type{border-top:1px solid var(--rule)} #ce .acc summary{list-style:none;cursor:pointer;padding:16px 0;display:flex;align-items:center;justify-content:space-between; gap:14px;font-family:var(--disp);font-size:16px;font-weight:600;letter-spacing:-.02em;transition:color .2s var(--e)} #ce .acc summary::-webkit-details-marker{display:none} #ce .acc summary:hover{color:var(--seal)} #ce .acc summary::after{content:"+";font-family:var(--mono);font-size:16px;color:var(--mu2);transition:transform .3s var(--e)} #ce .acc[open] summary::after{transform:rotate(45deg);color:var(--seal)} #ce .acc .ab{padding:0 0 17px;font-size:14px;color:var(--mu);max-width:52ch} #ce .acc .ab a{color:var(--seal);font-weight:600;border-bottom:1px solid rgba(46,58,140,.3)} #ce .acc-h{font-family:var(--mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--mu2);margin-bottom:8px} /* ---- REHBERLER ---- */ #ce .posts{display:grid;grid-template-columns:repeat(3,1fr);gap:15px} #ce .post{background:var(--card);border:1px solid var(--rule);border-radius:13px;overflow:hidden;transition:.22s var(--e)} #ce .post:hover{border-color:rgba(46,58,140,.34);transform:translateY(-3px);box-shadow:var(--sh)} #ce .post .ph{aspect-ratio:16/9;overflow:hidden;background:#E4EAF3} #ce .post .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--e)} #ce .post:hover .ph img{transform:scale(1.05)} #ce .post .pb{padding:17px} #ce .post h3{margin-top:9px;font-size:16.5px} /* ---- CTA ---- */ #ce .cta .cegeo{position:absolute;left:-6%;bottom:-38%;width:44%;opacity:.09} #ce .cta .cegeo .glyph{fill:#fff}#ce .cta .cegeo .guide{stroke:#fff;stroke-opacity:.5}#ce .cta .cegeo .dim{stroke:#fff} #ce .note{margin-top:clamp(30px,4vw,48px);padding-top:20px;border-top:1px solid var(--rule);font-size:12.5px; color:var(--mu2);max-width:72ch;margin-left:auto;margin-right:auto;line-height:1.6} /* ============================================================================ TEMA OVERRIDE GUARD — Be Theme global font/spacing kuralları tasarımı eziyor (canlıda tespit: h1 → Poppins, .pill → IBM Plex Sans). #ce özgüllüğü yeterli değil çünkü tema da benzer özgüllükte kural yazıyor → !important şart. ========================================================================== */ /* Be Theme'i ezmek icin !important sart, AMA: - yazi tipi artik var(--disp) (Libre Franklin). Eski 'Space Grotesk' sabit yaziliydi ve font linkinden kaldirildigi icin tum H2'ler sistem fontuna dusuyordu. - margin-top:0 !important kaldirildi; rozet ile baslik arasindaki bosluk onun yuzunden her bolumde sifirlaniyordu. */ #ce h1{font-family:var(--disp) !important;font-weight:800 !important;letter-spacing:-.022em;line-height:1.08;text-transform:none !important} #ce h2{font-family:var(--disp) !important;font-weight:700 !important;letter-spacing:-.028em;line-height:1.08;text-transform:none !important} #ce h3{font-family:var(--disp) !important;font-weight:700 !important;letter-spacing:-.02em;line-height:1.3;text-transform:none !important} #ce .acc summary{font-weight:600 !important;font-size:16px !important;letter-spacing:-.02em !important} /* TEMIZLIK: font yalnizca kokte zorlanir, kalani mirasla gelir. Eski hali p/li/a/div/span/.btn uzerinde !important ile duruyordu ve sayfadaki TUM mono detaylari (kodlar, tarihler, numaralar) ve sayacin baslik fontunu eziyordu. */ #ce{font-family:var(--body) !important} #ce .pill,#ce .kbd,#ce .spec,#ce .p-lab,#ce .p-top .ttl,#ce .r .code,#ce .r .meta,#ce .r .tag, #ce .p-in .esc,#ce .step .sn,#ce .acc-h,#ce .p-foot,#ce .p-foot span,#ce .strip span,#ce .card .tg span{ font-family:var(--mono) !important} #ce .pill,#ce .kbd,#ce .p-lab,#ce .p-top .ttl,#ce .acc-h,#ce .card .tg span,#ce .p-in .esc{ text-transform:uppercase !important} /* TEMIZLIK: margin ve line-height kilidi kaldirildi — bilesenler kendi bosluk/satir yuksekligini yazabilsin. text-transform kalsin (tema bazi yerlerde buyuk harfe ceviriyor). */ #ce p{line-height:1.62;margin:0;text-transform:none !important} #ce .hero .lead{margin-top:0 !important} /* TEMIZLIK: kose ve harf araligi kilidi kaldirildi (bilesenler kendi olcusunu yazabilsin); tema ile gercekten cakisan donusum ve satir yuksekligi kilitli kaldi. */ #ce .btn{border-radius:11px;text-transform:none !important;letter-spacing:0;line-height:1.2 !important} #ce .btn-p{background:var(--seal) !important;color:#fff !important;border:1px solid var(--seal) !important} #ce .btn-p:hover{background:#26307a !important} #ce .btn-s{background:var(--card) !important;color:var(--ink) !important;border:1px solid var(--rule) !important} #ce ul,#ce li{list-style:none;margin:0;padding:0;background:none} #ce .checks li{display:flex !important} /* TEMIZLIK: box-shadow:none artik butonlari kapsamiyor — hero ve CTA birincil butonlarinin golgesini siliyordu. */ #ce a{text-decoration:none !important;border:0} #ce a:not(.btn):not(.svc):not(.c4-k):not(.yon-k){box-shadow:none !important} #ce .acc .ab a{border-bottom:1px solid rgba(46,58,140,.3) !important} /* TEMIZLIK: gorsel bilesenleri kendi kosesini/golgesini yazabilsin. */ #ce img{border-radius:0;box-shadow:none;margin:0 !important} #ce .wrap{max-width:1180px !important;margin:0 auto !important;padding:0 clamp(20px,4vw,44px) !important} #ce .band{padding:clamp(58px,6.6vw,96px) 0 !important} #ce svg{max-width:100% !important} /* ---- reveal (sade) ---- */ #ce .rv{opacity:0;transform:translateY(16px);transition:opacity .7s var(--e),transform .7s var(--e)} #ce .rv.in{opacity:1;transform:none} #ce :focus-visible{outline:2px solid var(--seal);outline-offset:3px;border-radius:4px} @media (prefers-reduced-motion:reduce){ #ce .rv{opacity:1;transform:none;transition:none} #ce .p-in .caret{animation:none} #ce .draw .guide,#ce .draw .dim{stroke-dashoffset:0} #ce .draw .glyph{opacity:1;transform:none} #ce .r{opacity:1;transform:none} } @media(max-width:1000px){ #ce .hero .wrap,#ce .feat .wrap,#ce .feat.rev .wrap,#ce .req .wrap{grid-template-columns:1fr;gap:34px} #ce .proc-head{grid-template-columns:1fr;gap:26px} #ce .proc-head .ce-mark{width:200px;order:-1} #ce .feat.rev .ftx{order:0} #ce .grid,#ce .steps{grid-template-columns:repeat(2,1fr)} #ce .posts{grid-template-columns:1fr 1fr} #ce .ce-watermark{display:none} } @media(max-width:620px){ #ce .grid,#ce .steps,#ce .posts{grid-template-columns:1fr} #ce .acts .btn{width:100%;justify-content:center} #ce .r .meta{display:none} } /* ============ HERO (kesin surum, #ce .hero-e kapsaminda) ============ */ #ce .hero-e *{box-sizing:border-box;margin:0;padding:0} #ce{ --paper:#EDF2F9;--card:#fff;--ink:#0D1420;--seal:#2E3A8C;--conform:#16815F;--notice:#A84A07; --mu:#54617A;--mu2:#5F6B80;--rule:rgba(61,77,99,.14); --disp:'Libre Franklin',system-ui,sans-serif;--body:'IBM Plex Sans',system-ui,sans-serif; --mono:'IBM Plex Mono',monospace;--e:cubic-bezier(.2,.7,.3,1); } /* DIKKAT: #ce'ye overflow-x:hidden KOYMA — ustteki bir ata overflow tasirsa position:sticky calismaz ve hero animasyonu olur. Duvar zaten .pin'in overflow:hidden'i ile kirpiliyor. */ #ce{font-family:var(--body);background:var(--paper);color:var(--ink)} #ce .hero-e .track{height:660svh;position:relative} #ce .hero-e .pin{position:sticky;top:0;height:100svh;overflow:hidden;display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.14fr);grid-template-rows:minmax(0,1fr); gap:44px;align-items:center;max-width:1360px;margin:0 auto;padding:0 44px} #ce .hero-e .wall{position:absolute;top:0;bottom:0;left:-34vw;right:-34vw;display:flex;flex-direction:column; justify-content:center;align-items:center;gap:clamp(9px,1.5vw,20px);z-index:1;will-change:transform,opacity; -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 11%,#000 89%,transparent 100%); mask-image:linear-gradient(180deg,transparent 0,#000 11%,#000 89%,transparent 100%)} #ce .hero-e .wall{transform-origin:66% 50%} #ce .hero-e .wall .line{display:flex;gap:clamp(10px,1.2vw,20px);white-space:nowrap;will-change:transform} #ce .hero-e .code{font-family:var(--mono);font-size:clamp(13px,1.3vw,19px);color:#B9C2D4;letter-spacing:-.01em; transition:color .62s var(--e),opacity .62s var(--e),font-weight .62s var(--e);opacity:var(--of,.6)} #ce .hero-e .code.hit{color:var(--seal);opacity:var(--oh,1);font-weight:500} #ce .hero-e .code.hit::after{content:"\25CF";font-size:.5em;vertical-align:middle;margin-left:.45em;color:var(--conform)} /* Bolumun ustundeki beyaz->paper rampasi boyunca scrim de sonuyor; yoksa beyaz bandin uzerine paper rengi binip solda gorunur bir dikey kenar olusuyor. */ #ce .hero-e .scrim{-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,rgba(0,0,0,0) 38%,#000 100%); mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,rgba(0,0,0,0) 38%,#000 100%); -webkit-mask-size:100% clamp(104px,12.5vw,205px);mask-size:100% clamp(104px,12.5vw,205px); -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat} #ce .hero-e .scrim{position:absolute;inset:0;z-index:2;pointer-events:none; background:linear-gradient(90deg,var(--paper) 0%,rgba(237,242,249,.88) 9%,rgba(237,242,249,.62) 23%, rgba(237,242,249,.34) 37%,rgba(237,242,249,.12) 50%,rgba(237,242,249,0) 62%)} #ce .hero-e .tx{position:relative;grid-column:1;grid-row:1;z-index:4;isolation:isolate} #ce .hero-e .tx::before{content:"";position:absolute;inset:-44px -96px -44px -70px;z-index:-1;pointer-events:none; background:radial-gradient(64% 72% at 40% 50%,var(--paper) 0%,var(--paper) 44%, rgba(237,242,249,.86) 68%,rgba(237,242,249,0) 100%)} #ce .hero-e .eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em; text-transform:uppercase;color:var(--seal);background:rgba(46,58,140,.07);border:1px solid rgba(46,58,140,.16); border-radius:100px;padding:6px 13px} #ce .hero-e .eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--notice)} #ce .hero-e h1{font-family:var(--disp);font-weight:800;font-size:clamp(30px,3.5vw,48px);letter-spacing:-.022em; line-height:1.08;margin:18px 0 16px} #ce .hero-e h1 em{font-style:normal;color:var(--seal)} #ce .hero-e .leads{position:relative;min-height:112px;max-width:44ch} #ce .hero-e .lead{position:absolute;inset:0;font-size:16.5px;line-height:1.62;color:var(--mu); transition:opacity .45s var(--e),transform .45s var(--e)} #ce .hero-e .lead b{color:var(--ink);font-weight:600} #ce .hero-e .lead.off{opacity:0;transform:translateY(8px);pointer-events:none} #ce .hero-e .doc{margin:2px 0 22px;max-width:44ch;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)} #ce .hero-e .doc>div{display:flex;align-items:baseline;gap:12px;padding:8px 0} #ce .hero-e .doc>div+div{border-top:1px dashed rgba(61,77,99,.17)} #ce .hero-e .doc dt{flex:0 0 106px;font-family:var(--mono);font-size:9.5px;letter-spacing:.13em; text-transform:uppercase;color:var(--mu2)} #ce .hero-e .doc dd{font-family:var(--mono);font-size:11.5px;line-height:1.4;color:var(--ink)} #ce .hero-e .doc dd.uyari{color:var(--notice)} #ce .hero-e .acts{display:flex;flex-wrap:wrap;gap:11px;margin-top:8px} #ce .hero-e .btn{display:inline-flex;align-items:center;gap:9px;font-size:14.5px;font-weight:600;padding:14px 22px; border-radius:11px;border:1px solid transparent;cursor:pointer;text-decoration:none;font-family:var(--body); transition:.2s var(--e)} #ce .hero-e .btn-p{background:var(--seal);color:#fff;box-shadow:0 12px 26px -16px rgba(46,58,140,.95)} #ce .hero-e .btn-p:hover{background:#26307a;transform:translateY(-1px)} #ce .hero-e .btn-s{background:var(--card);color:var(--ink);border-color:var(--rule)} #ce .hero-e .counter{grid-column:2;grid-row:1;justify-self:center;align-self:center;z-index:4;pointer-events:none; display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:34px 54px; width:clamp(300px,22vw,430px);box-sizing:border-box; /* b18: sabit kutu — makine adı/sayı değişince blok kaymaz */ background:radial-gradient(66% 74% at 50% 50%,var(--paper) 0%,var(--paper) 56%,rgba(237,242,249,.88) 76%,rgba(237,242,249,0) 100%); transition:opacity .45s var(--e),transform .45s var(--e);will-change:opacity,transform} #ce .hero-e .counter .big{font-family:var(--disp);font-size:clamp(52px,6vw,84px);font-weight:700;letter-spacing:-.05em; line-height:.9;color:var(--seal);font-variant-numeric:tabular-nums;min-width:2ch} #ce .hero-e .counter .lab{font-family:var(--mono);font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:var(--mu2);margin-top:6px} #ce .hero-e .counter .nm{font-family:var(--disp);font-size:clamp(17px,1.5vw,22px);font-weight:600;color:var(--ink);letter-spacing:-.012em; white-space:nowrap;line-height:1.6;max-width:100%;overflow:hidden;text-overflow:ellipsis} #ce .hero-e .counter .dir{font-family:var(--mono);font-size:10.5px;letter-spacing:.03em;color:var(--mu2);opacity:.88;white-space:nowrap;line-height:1.6;max-width:100%;overflow:hidden;text-overflow:ellipsis} #ce .hero-e .counter .nm, #ce .hero-e .counter .dir{transition:opacity .3s var(--e)} #ce .hero-e .counter.pulse{animation:ce-cpulse .5s var(--e)} @keyframes ce-cpulse{0%{transform:scale(1)}34%{transform:scale(1.045)}100%{transform:scale(1)}} @media (prefers-reduced-motion:reduce){ #ce .hero-e .counter.pulse{animation:none} } #ce .hero-e .stage{position:relative;grid-column:2;grid-row:1;z-index:3;overflow:hidden;container-type:inline-size; background:linear-gradient(158deg,#F7FAFE 0%,#F3F8FD 38%,#E8EFF8 100%); border:0;border-radius:22px;padding:26px; -webkit-mask-image:radial-gradient(128% 124% at 50% 46%,#000 54%,rgba(0,0,0,.78) 80%,transparent 100%); mask-image:radial-gradient(128% 124% at 50% 46%,#000 54%,rgba(0,0,0,.78) 80%,transparent 100%); box-shadow:0 34px 88px -60px rgba(34,48,80,.34); opacity:0;will-change:opacity} #ce .hero-e .stage::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none; background-image:linear-gradient(rgba(46,58,140,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(46,58,140,.055) 1px,transparent 1px); background-size:36px 36px; -webkit-mask-image:radial-gradient(104% 100% at 50% 44%,#000 44%,transparent 96%); mask-image:radial-gradient(104% 100% at 50% 44%,#000 44%,transparent 96%)} #ce .hero-e .stage::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none; background:radial-gradient(128% 86% at 50% -8%,rgba(255,255,255,.55) 0%,rgba(255,255,255,0) 56%), radial-gradient(96% 74% at 50% 112%,rgba(34,48,80,.085) 0%,rgba(34,48,80,0) 64%)} #ce .hero-e .cap{position:relative;z-index:2;display:flex;align-items:center;gap:10px;flex-wrap:nowrap;margin-bottom:10px} #ce .hero-e .captxt{flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; font-family:var(--mono);font-size:clamp(9px,1.92cqw,11px);letter-spacing:.09em;text-transform:uppercase;color:var(--mu2)} #ce .hero-e .capdl{flex:0 0 auto;margin-left:auto;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;text-decoration:none; font-family:var(--mono);font-size:clamp(9px,1.8cqw,10.5px);letter-spacing:.05em;text-transform:uppercase;color:var(--seal); border:1px solid rgba(46,58,140,.24);background:rgba(46,58,140,.05);border-radius:8px;padding:5px 10px; transition:background .2s var(--e),border-color .2s var(--e)} #ce .hero-e .capdl:hover{background:rgba(46,58,140,.12);border-color:rgba(46,58,140,.44)} #ce .hero-e svg.ce{display:block;width:100%;height:auto;position:relative;z-index:1} #ce .hero-e .guide{fill:none;stroke:var(--seal);stroke-width:2.2;opacity:.34;stroke-dasharray:var(--gl);stroke-dashoffset:var(--gl)} #ce .hero-e .letter-outline{fill:none;stroke:var(--ink);stroke-width:5;stroke-linejoin:round;stroke-dasharray:var(--ll);stroke-dashoffset:var(--ll)} #ce .hero-e .letter-fill{fill:var(--ink);opacity:0} #ce .hero-e .step{position:absolute;z-index:2;right:26px;bottom:22px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em; text-transform:uppercase;color:var(--mu2);background:#fff;border:1px solid var(--rule);padding:6px 11px;border-radius:8px} #ce .hero-e .prog{position:fixed;right:18px;top:50%;transform:translateY(-50%);width:3px;height:180px;background:var(--rule);border-radius:99px;z-index:9} #ce .hero-e .prog i{display:block;width:100%;background:var(--seal);border-radius:99px;height:0%} @media(max-width:980px){ #ce .hero-e .track{height:580svh} #ce .hero-e .pin{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr); gap:14px;padding:calc(22px + env(safe-area-inset-top)) 18px 20px;align-items:stretch;max-width:none} #ce .hero-e .tx{grid-row:1;grid-column:1;z-index:4} #ce .hero-e .tx::before{display:none} #ce .hero-e .wall{position:relative;grid-row:2;grid-column:1;top:auto;bottom:auto;left:auto;right:auto;transform-origin:50% 50%; -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 7%,#000 93%,transparent 100%); mask-image:linear-gradient(180deg,transparent 0,#000 7%,#000 93%,transparent 100%); align-self:stretch;justify-self:stretch;width:200vw;margin-left:-50vw;height:auto;overflow:hidden} #ce .hero-e .stage{grid-row:2;grid-column:1;align-self:center;padding:18px;border-radius:18px;z-index:3} #ce .hero-e .scrim{background:linear-gradient(180deg,var(--paper) 0%,rgba(237,242,249,.86) 6%,rgba(237,242,249,0) 22%)} #ce .hero-e .code{font-size:12px} #ce .hero-e .eyebrow{font-size:9.5px;padding:5px 11px} #ce .hero-e h1{font-size:clamp(27px,7.6vw,34px);margin:14px 0 12px} #ce .hero-e .leads{min-height:92px;max-width:54ch} #ce .hero-e .lead{font-size:14.5px;line-height:1.55} #ce .hero-e .doc{margin:0 0 16px;max-width:none} #ce .hero-e .doc>div{padding:6px 0;gap:10px} #ce .hero-e .doc dt{flex:0 0 92px;font-size:8.5px;letter-spacing:.11em} #ce .hero-e .doc dd{font-size:10.5px} #ce .hero-e .acts{gap:9px;margin-top:2px} #ce .hero-e .btn{padding:13px 18px;font-size:14px;border-radius:10px} #ce .hero-e .counter{grid-row:2;grid-column:1;padding:26px 34px;width:min(340px,86vw)} #ce .hero-e .counter .big{font-size:clamp(46px,14vw,62px)} #ce .hero-e .counter .lab{font-size:9px;letter-spacing:.14em;margin-top:4px} #ce .hero-e .counter .nm{font-size:17px} #ce .hero-e .counter .dir{font-size:9.5px} #ce .hero-e .cap{margin-bottom:7px;gap:7px} #ce .hero-e .captxt{letter-spacing:.03em} #ce .hero-e .capdl{padding:4px 8px;gap:5px} #ce .hero-e .step{right:18px;bottom:14px;font-size:9.5px;padding:5px 8px} #ce .hero-e .prog{display:none} } @container (max-width:600px){ #ce .hero-e .capdl .d2{display:none} } @container (max-width:420px){ #ce .hero-e .captxt .cd1{display:none} } @container (max-width:380px){ #ce .hero-e .capdl .d1{display:none} } @container (max-width:330px){ #ce .hero-e .captxt .cdesc{display:none} } @media(max-width:560px){ #ce .hero-e .acts{flex-direction:column;align-items:stretch} #ce .hero-e .btn{width:100%;justify-content:center} } @media(max-width:980px) and (max-height:800px){ #ce .hero-e .doc{display:none} #ce .hero-e .leads{min-height:72px} #ce .hero-e .lead{font-size:13.5px} #ce .hero-e h1{font-size:25px;margin:10px 0 9px} #ce .hero-e .counter{padding:12px 22px} #ce .hero-e .counter .big{font-size:44px} } @media (prefers-reduced-motion:reduce){ #ce .hero-e .track{height:auto} #ce .hero-e .pin{position:static;height:auto;grid-template-rows:auto auto} #ce .hero-e .wall{position:relative;top:auto;bottom:auto;left:auto;right:auto;height:auto;opacity:1!important;filter:none!important} #ce .hero-e .wall .line{transform:none!important} #ce .hero-e .scrim{display:none} #ce .hero-e .leads{position:static;min-height:0} #ce .hero-e .lead{position:static;opacity:1!important;transform:none!important} #ce .hero-e .lead+.lead{margin-top:10px} #ce .hero-e .stage{opacity:1!important;transform:none!important} #ce .hero-e .counter{opacity:1!important;transform:none!important} #ce .hero-e .guide{stroke-dashoffset:0!important} #ce .hero-e .letter-outline{display:none} #ce .hero-e .letter-fill{opacity:1!important} #ce .hero-e .step{display:none} } /* ---- YENİ YÖNETMELİK bölümü ---- */ #ce .nyy-dot{width:6px;height:6px;border-radius:50%;background:var(--notice);display:block} #ce .nyy-top{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(24px,4vw,56px); align-items:end;margin:18px 0 clamp(30px,4vw,48px)} #ce .nyy-top h2 em{font-style:normal;color:var(--notice)} #ce .nyy-lead{color:var(--mu);font-size:clamp(15px,1.15vw,17px);max-width:56ch} #ce .nyy-lead b{color:var(--ink);font-weight:600} #ce .nyy-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px} #ce .nyy-card{background:var(--paper);border:1px solid var(--rule);border-radius:13px;padding:20px; transition:.22s var(--e)} #ce .nyy-card:hover{border-color:rgba(168,74,7,.34);transform:translateY(-3px);box-shadow:var(--sh)} #ce .nyy-n{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--notice);display:block;margin-bottom:11px} #ce .nyy-card h3{font-size:16.5px;margin-bottom:8px} #ce .nyy-card p{font-size:13px;line-height:1.55;color:var(--mu)} #ce .nyy-card p b{color:var(--ink);font-weight:600} #ce .nyy-not{margin-top:clamp(22px,3vw,32px);padding:18px 20px;border-radius:13px; background:rgba(168,74,7,.055);border:1px solid rgba(168,74,7,.2)} #ce .nyy-not p{font-size:13.5px;line-height:1.62;color:var(--mu);margin:0} #ce .nyy-not b{color:var(--notice);font-weight:600} #ce .nyy .acts{margin-top:clamp(24px,3vw,34px)} @media(max-width:1000px){ #ce .nyy-top{grid-template-columns:1fr;align-items:start;gap:16px} #ce .nyy-grid{grid-template-columns:repeat(2,1fr)} } @media(max-width:640px){ #ce .nyy-grid{grid-template-columns:1fr} } /* ---- CTA: fonda gercek CE isareti (harflerle degil, resmi vektorle) ---- */ /* ---- AKORDİYON: üretim öncesi solda / sonrası sağda ---- */ #ce .req .wrap{display:block} #ce .req-head{max-width:620px;margin-bottom:clamp(30px,4vw,48px)} #ce .req-gorsel{margin:0} #ce .req-gorsel img{width:100%;height:auto;border-radius:16px;display:block; box-shadow:0 24px 60px -34px rgba(34,48,80,.5)} #ce .req-gorsel figcaption{margin-top:11px;font-family:var(--mono);font-size:10.5px;line-height:1.5; letter-spacing:.02em;color:var(--mu2)} #ce .acc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3.4vw,46px);position:relative} /* dikey ayraç ızgaranın TAM ortasında (önce sağ sütunun sol kenarındaydı, üstteki CE işaretiyle hizasızdı; 2026-10-06) */ #ce .acc-grid::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--rule)} #ce .acc-col{position:relative} #ce .acc-col+.acc-col{padding-left:0;border-left:0} #ce .acc-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:4px} #ce .acc-head .acc-h{margin:0;color:var(--seal)} #ce .acc-say{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mu2)} #ce .acc-alt{font-size:12.5px;color:var(--mu2);margin:0 0 14px;line-height:1.5} #ce .req .acc-alt{font-family:var(--mono);font-size:11px;letter-spacing:.02em;margin-bottom:16px} #ce .acc summary{gap:12px} #ce .acc-n{font-family:var(--mono);font-size:11px;color:var(--seal);opacity:.65;flex:0 0 auto} #ce .acc-t{flex:1;min-width:0} #ce .acc summary::after{margin-left:auto} #ce .acc[open]{background:linear-gradient(90deg,rgba(46,58,140,.035),rgba(46,58,140,0) 70%)} #ce .acc[open] summary{color:var(--seal)} #ce .acc .ab{padding:0 0 17px 34px;max-width:46ch} @media(max-width:900px){ #ce .req-head{grid-template-columns:1fr;gap:22px} #ce .req-gorsel{max-width:340px} #ce .acc-grid{grid-template-columns:1fr;gap:30px} #ce .acc-grid::before{display:none} #ce .acc-col+.acc-col{padding-left:0;border-left:0;padding-top:26px;border-top:1px solid var(--rule)} } /* ---- HİZMETLER: ikonlu 3 sütun + kapanışta CTA karosu ---- */ #ce .svc-band{background:var(--paper)} #ce .svc-head{max-width:620px;margin-bottom:clamp(30px,4vw,48px)} #ce .svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} #ce .svc{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--rule); border-radius:15px;padding:22px 22px 20px;transition:border-color .22s var(--e),transform .22s var(--e),box-shadow .22s var(--e)} #ce .svc:hover{border-color:rgba(46,58,140,.36);transform:translateY(-3px);box-shadow:var(--sh)} #ce .svc-ik{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px; border-radius:11px;background:rgba(46,58,140,.075);color:var(--seal);margin-bottom:15px} #ce .svc-i{width:22px;height:22px} #ce .svc h3{font-size:16.5px;margin-bottom:7px;letter-spacing:-.02em} #ce .svc p{font-size:13.2px;line-height:1.56;color:var(--mu);margin:0} #ce .svc .tg{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto;padding-top:15px} #ce .svc .tg span{font-family:var(--mono);font-size:8.5px;letter-spacing:.05em;text-transform:uppercase; color:var(--mu2);border:1px solid var(--rule);border-radius:5px;padding:3px 6px} #ce .svc-cta{background:var(--seal);border-color:var(--seal);color:#fff} #ce .svc-cta:hover{background:#26307a;border-color:#26307a} #ce .svc-cta .svc-ik{background:rgba(255,255,255,.16);color:#fff} #ce .svc-cta p{color:rgba(255,255,255,.82)} #ce .svc-git{margin-top:auto;padding-top:16px;display:inline-flex;align-items:center;gap:8px; font-size:14px;font-weight:600} #ce .svc-cta .ar{transition:transform .25s var(--e)} #ce .svc-cta:hover .ar{transform:translateX(4px)} @media(max-width:980px){ #ce .svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:600px){ #ce .svc-grid{grid-template-columns:1fr} } /* ---- SÜREÇ: üstte ray, adımlar rayın üzerinde duraklar ---- */ #ce .steps{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(18px,2.4vw,32px);position:relative;margin:0;padding:0} #ce .steps::before{content:"";position:absolute;left:0;right:0;top:5px;height:2px; background:linear-gradient(90deg,var(--rule),var(--rule));border-radius:2px} #ce .step{position:relative;padding-top:26px;border-top:0} #ce .step-nokta{position:absolute;top:0;left:0;width:12px;height:12px;border-radius:50%; background:var(--paper);border:2px solid var(--rule);transition:.45s var(--e)} #ce .step.on .step-nokta{border-color:var(--seal);background:var(--seal); box-shadow:0 0 0 5px rgba(46,58,140,.13)} #ce .step .sn{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--mu2); display:block;margin-bottom:9px;transition:color .45s var(--e)} #ce .step.on .sn{color:var(--seal)} #ce .step h3{font-size:17px;margin-bottom:7px;letter-spacing:-.02em} #ce .step p{font-size:13.4px;line-height:1.56;color:var(--mu);margin:0} #ce .step-et{display:inline-block;margin-top:13px;font-family:var(--mono);font-size:9px; letter-spacing:.07em;text-transform:uppercase;color:var(--mu2); border:1px solid var(--rule);border-radius:5px;padding:3px 7px} #ce .step.on .step-et{color:var(--seal);border-color:rgba(46,58,140,.3)} @media(max-width:980px){ #ce .steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:30px} #ce .steps::before{display:none} #ce .step{padding-top:0;padding-left:26px} #ce .step-nokta{top:4px} } @media(max-width:560px){ #ce .steps{grid-template-columns:1fr} } /* ---- ORTAK BÖLÜM BAŞLIĞI (tüm bölümlerde aynı ritim) ---- */ #ce .bolum-bas{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap; margin-bottom:clamp(28px,3.6vw,46px)} #ce .bolum-bas>div{max-width:620px} #ce .bolum-bas h2{margin:18px 0 12px} #ce .bolum-bas p{color:var(--mu)} #ce .bolum-tum{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600; color:var(--seal);padding-bottom:3px;border-bottom:1px solid rgba(46,58,140,.28);transition:.2s var(--e)} #ce .bolum-tum:hover{border-bottom-color:var(--seal)} #ce .bolum-tum .ar{transition:transform .25s var(--e)} #ce .bolum-tum:hover .ar{transform:translateX(4px)} /* ---- YÖNETMELİKLER: 4+4, rehber kartlarının zarafetinde ---- */ #ce .yon-band{background:var(--card);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)} #ce .yon-k{position:relative;display:flex;flex-direction:column;background:var(--paper); border:1px solid var(--rule);border-radius:14px;padding:20px 20px 18px;overflow:hidden; transition:border-color .22s var(--e),transform .22s var(--e),box-shadow .22s var(--e)} #ce .yon-k::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--seal); opacity:0;transition:opacity .22s var(--e)} #ce .yon-k:hover{border-color:rgba(46,58,140,.32);transform:translateY(-3px);box-shadow:var(--sh)} #ce .yon-k:hover::before{opacity:1} #ce .yon-kod{font-family:var(--mono);font-size:10px;letter-spacing:.07em;color:var(--seal); display:block;margin-bottom:11px} #ce .yon-k h3{font-size:16px;line-height:1.2;letter-spacing:-.02em;margin-bottom:7px} #ce .yon-k p{font-size:12.6px;line-height:1.5;color:var(--mu);margin:0} #ce .yon-ok{margin-top:16px;font-size:15px;color:var(--seal);opacity:.4;transition:.22s var(--e)} #ce .yon-k:hover .yon-ok{opacity:1;transform:translateX(3px)} @media(max-width:1000px){ #ce .c4-grid.yon-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:560px){ #ce .c4-grid.yon-grid{grid-template-columns:1fr} } /* ---- SAYFA RİTMİ: bölümler açık/beyaz sırayla, ayraçlar tek kural ---- */ /* Bölüm geçişleri: keskin çizgi yok. Her bölüm komşusunun renginden kendi rengine yumuşak bir rampayla giriyor ve çıkıyor. */ /* Dikişsiz geçiş kuralı: bölüm SADECE üstten rampalanır ve rampa KOMŞUNUN rengiyle başlar. Böylece bir bölümün alt kenarı kendi rengi, sonraki bölümün üst kenarı da o renk olur → dikişte iki taraf aynı. (Alt rampa da eklenince renkler dikişte ters düşüyor ve çizgi gibi görünüyordu — 2026-09-28 düzeltmesi.) */ #ce .zemin-acik{background:linear-gradient(180deg,var(--card) 0,var(--paper) clamp(90px,11vw,180px)) no-repeat,var(--paper)} #ce .zemin-beyaz{background:linear-gradient(180deg,var(--paper) 0,var(--card) clamp(90px,11vw,180px)) no-repeat,var(--card)} #ce .zemin-acik,#ce .zemin-beyaz{border-top:0;border-bottom:0} #ce .yon-k{background:var(--card)} #ce .nyy-card{background:var(--paper)} #ce .ar{transition:transform .25s var(--e);display:inline-block} #ce a:hover .ar{transform:translateX(4px)} /* ===== A1 · zaman ekseni ===== */ #ce .tl{position:relative;margin:6px 0 clamp(30px,4vw,44px)} #ce .tl-ray{position:relative;height:3px;background:var(--rule);border-radius:3px;margin:0 0 16px} #ce .tl-dolgu{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--seal);border-radius:3px;transition:width 1.4s var(--e)} #ce .tl.akti .tl-dolgu{width:62%} /* b16: bölüm görünür olunca dolar */ #ce .tl-duraklar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;position:relative} /* b20: geri sayım rozeti (Bugün ↔ 20 Ocak 2027 arasında, rayın üstünde) */ #ce .tl-geri{position:absolute;top:-46px;left:var(--x,81%);transform:translateX(-50%);font-family:var(--mono);font-size:10.5px;letter-spacing:.06em; color:var(--notice);background:var(--card);border:1px solid rgba(168,74,7,.3);border-radius:100px;padding:4px 10px;white-space:nowrap; opacity:0;transition:opacity .6s var(--e) .9s} #ce .tl.akti .tl-geri{opacity:1} #ce .tl-geri b{font-weight:600;font-variant-numeric:tabular-nums} /* b20: hedef noktası nabız + sağ üstte "YENİ" rozeti (üzerine gelince/dokununca yeni tüzüğün 3 başlığı) */ #ce .tl-d.hedef.acik::after{content:"";position:absolute;top:-25px;left:0;width:13px;height:13px;border-radius:50%;border:2px solid var(--notice); animation:ce-tl-nabiz 2.6s ease-out infinite;pointer-events:none} @keyframes ce-tl-nabiz{0%{transform:scale(.7);opacity:.9}100%{transform:scale(3.2);opacity:0}} #ce .tl-yeni{position:absolute;top:-60px;left:14px;display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em; text-transform:uppercase;color:#fff;background:var(--notice);border-radius:100px;padding:4px 9px;text-decoration:none;opacity:0;transform:translateY(6px); transition:opacity .5s var(--e) 1.3s,transform .5s var(--e) 1.3s;z-index:3} #ce .tl.akti .tl-yeni{opacity:1;transform:none} #ce .tl-yeni i{width:6px;height:6px;border-radius:50%;background:#fff;animation:ce-tl-yanip 1.4s ease-in-out infinite} @keyframes ce-tl-yanip{0%,100%{opacity:1}50%{opacity:.25}} #ce .tl-yeni-k{position:absolute;left:0;top:calc(100% + 8px);width:min(260px,70vw);background:var(--card);color:var(--ink);border:1px solid var(--rule);border-radius:12px; padding:12px 14px;box-shadow:var(--sh);font-family:var(--body);font-size:12.5px;line-height:1.5;letter-spacing:0;text-transform:none; opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .25s var(--e),transform .25s var(--e),visibility .25s} #ce .tl-yeni:hover .tl-yeni-k,#ce .tl-yeni:focus-visible .tl-yeni-k,#ce .tl-yeni.acik .tl-yeni-k{opacity:1;visibility:visible;transform:none} #ce .tl-yeni-k b{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--notice);margin-bottom:6px} #ce .tl-yeni-k span{display:block;color:var(--mu)} #ce .tl-yeni-k em{display:block;margin-top:8px;font-style:normal;color:var(--seal);font-weight:600} @media (prefers-reduced-motion:reduce){#ce .tl-d.hedef.acik::after,#ce .tl-yeni i{animation:none}} #ce .tl-d{position:relative;padding-top:2px} #ce .tl-d::before{content:"";position:absolute;top:-25px;left:0;width:13px;height:13px;border-radius:50%; background:var(--card);border:3px solid var(--rule)} #ce .tl-d::before{transition:border-color .4s var(--e),background .4s var(--e),box-shadow .4s var(--e)} #ce .tl-d.acik.gecmis::before{border-color:var(--seal);background:var(--seal)} #ce .tl-d.acik.simdi::before{border-color:var(--seal);background:var(--card);box-shadow:0 0 0 5px rgba(46,58,140,.14)} #ce .tl-d.acik.hedef::before{border-color:var(--notice);background:var(--notice);box-shadow:0 0 0 5px rgba(168,74,7,.14)} #ce .tl-t{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--ink);font-weight:500} #ce .tl-d.hedef .tl-t{color:var(--notice)} #ce .tl-l{display:block;font-size:12.4px;line-height:1.45;color:var(--mu2);margin-top:4px} #ce .tl-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px} /* Kaldırılan not kutusunun sol vurgu çizgisi burada yaşıyor: kartlara gelindiğinde beliriyor. Aynı jest yönetmelik kartlarında da var. */ #ce .tl-k{position:relative;overflow:hidden;background:var(--paper);border:1px solid var(--rule); border-radius:13px;padding:18px; transition:border-color .22s var(--e),transform .22s var(--e),box-shadow .22s var(--e)} #ce .tl-k::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px; background:var(--notice);opacity:0;transform:scaleY(.4);transform-origin:center; transition:opacity .22s var(--e),transform .3s var(--e)} #ce .tl-k:hover,#ce .tl-k.yan{border-color:rgba(168,74,7,.34);transform:translateY(-3px);box-shadow:var(--sh)} #ce .tl-k:hover::before,#ce .tl-k.yan::before{opacity:1;transform:scaleY(1)} #ce .tl-k.yan{box-shadow:0 0 0 4px rgba(168,74,7,.14),var(--sh);transition-duration:.35s} /* b16: bir kez, sırayla parlar */ #ce .tl-k.yan .tl-n{color:var(--notice)} #ce .tl-n{transition:color .35s var(--e)} #ce .tl-n{font-family:var(--mono);font-size:10px;color:var(--seal);display:block;margin-bottom:9px} #ce .tl-k h4{font-size:15px;margin-bottom:6px;letter-spacing:-.02em} #ce .tl-k p{font-size:12.6px;line-height:1.5;color:var(--mu)} #ce .tl-k p b{color:var(--ink)} /* ===== B4 · B1+B3 melez ===== */ #ce .b4-kap{display:grid;grid-template-columns:minmax(0,.74fr) minmax(0,1.26fr);gap:clamp(26px,3.6vw,54px);align-items:start} #ce .b4-bas h2{margin:16px 0 12px} #ce .b4-bas p{color:var(--mu);margin-bottom:20px} #ce .b4-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(16px,2vw,24px);position:relative} #ce .b4-a{position:relative;padding-left:26px} #ce .b4-a::before{content:"";position:absolute;left:5px;top:16px;bottom:-24px;width:2px;background:var(--rule)} #ce .b4-a:nth-child(3)::before,#ce .b4-a:nth-child(4)::before{display:none} #ce .b4-d{position:absolute;left:0;top:4px;width:12px;height:12px;border-radius:50%; background:var(--seal);box-shadow:0 0 0 4px rgba(46,58,140,.13)} #ce .b4-n{font-family:var(--mono);font-size:10.5px;color:var(--seal);margin-right:10px} /* b16: zincir — JS .zincir ekler; adımlar .on ile sırayla açılır, .nabiz ile noktadan halka yayılır */ #ce .b4-l.zincir .b4-d{box-sizing:border-box;border:2px solid var(--rule);background:var(--paper);box-shadow:none;transition:border-color .45s var(--e),background .45s var(--e),box-shadow .45s var(--e)} #ce .b4-l.zincir .b4-a.on .b4-d{border-color:var(--seal);background:var(--seal);box-shadow:0 0 0 5px rgba(46,58,140,.13)} #ce .b4-l.zincir .b4-a::before{background:linear-gradient(var(--seal),var(--seal)) no-repeat 0 0/100% 0%,var(--rule);transition:background-size .9s var(--e) .25s} #ce .b4-l.zincir .b4-a.on::before{background-size:100% 100%} #ce .b4-l.zincir .b4-ic{transition:opacity .6s var(--e)} #ce .b4-l.zincir .b4-a:not(.on) .b4-ic{opacity:.45} #ce .b4-l.zincir .b4-a::after{content:"";position:absolute;left:-2px;top:2px;width:16px;height:16px;border-radius:50%;border:2px solid var(--seal);opacity:0;pointer-events:none} #ce .b4-l.zincir .b4-a.nabiz::after{animation:ce-nabiz 1s ease-out 1} @keyframes ce-nabiz{0%{transform:scale(.6);opacity:.9}100%{transform:scale(3.4);opacity:0}} #ce .b4-s{font-family:var(--mono);font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:var(--mu2)} #ce .b4-ic h4{font-size:17px;margin:9px 0 6px;letter-spacing:-.02em} #ce .b4-ic p{font-size:13.2px;line-height:1.55;color:var(--mu);margin:0 0 12px} #ce .b4-t{display:block;font-size:12.6px;color:var(--ink);padding:10px 12px;background:var(--paper); border:1px solid var(--rule);border-radius:10px} #ce .b4-t b{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.07em;text-transform:uppercase; color:var(--mu2);margin-bottom:3px;font-weight:400} /* ===== C4 · mevcut görsellerle (olduğu gibi) ===== */ #ce .c4-k{background:var(--paper)} #ce .c4-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px} #ce .c4-k{display:block;background:var(--card);border:1px solid var(--rule);border-radius:14px; overflow:hidden;transition:.22s var(--e)} #ce .c4-k:hover{border-color:rgba(46,58,140,.34);transform:translateY(-3px);box-shadow:var(--sh)} #ce .c4-g{aspect-ratio:16/9;overflow:hidden;background:#E4EAF3} #ce .c4-g img{width:100%;height:100%;object-fit:cover} #ce .c4-b{padding:17px} #ce .c4-b h4{font-size:16.5px;margin-bottom:6px;letter-spacing:-.02em} #ce .c4-b p{font-size:13px;line-height:1.5;color:var(--mu);margin:0} @media(max-width:1000px){ #ce .tl-duraklar,#ce .tl-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px} #ce .tl-ray{display:none} #ce .tl-d::before{top:-2px;position:relative;display:inline-block;margin-right:8px} #ce .tl-geri{position:static;transform:none;grid-column:1/-1;justify-self:start} #ce .tl-d.hedef.acik::after{display:none} #ce .tl-yeni{position:static;margin-top:8px;transform:none} #ce .tl-yeni-k{display:none} /* b21: telefonda kart yok, rozet doğrudan rehbere gider */ #ce .b4-kap{grid-template-columns:1fr;gap:26px} #ce .c4-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:620px){ #ce .tl-duraklar,#ce .tl-grid,#ce .b4-l,#ce .c4-grid{grid-template-columns:1fr} #ce .b4-a::before{display:none} } /* yönetmelik kartları = hizmet kartlarıyla aynı anatomi (kardeş ızgaralar) */ #ce .yon-grid .c4-b .yon-kod{display:block;margin-bottom:6px} #ce .yon-grid .c4-b h4{margin-bottom:5px} @media(max-width:1000px){ #ce .c4-grid.yon-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:560px){ #ce .c4-grid.yon-grid{grid-template-columns:1fr} } /* ===== FOOTER (önizleme maketi) — renk sayfayla aynı aileye çekildi ===== Canlı: #3B3B62 (desatüre mor) · Önerilen: #2B3269 (aynı hue, doygun indigo) Sayfanın son bölümü açık; footer'a gradyanla bağlanıyor, keskin kesim yok. */ /* v11'den gelen "#ce li{padding:0 !important}" reseti süreç adımlarının sol boşluğunu eziyordu → numara noktanın altında kalıyordu. Aynı reset .b4-bas içindeki p'nin alt boşluğunu da sıfırlıyor. */ #ce .b4-l .b4-a{padding-left:30px !important} #ce .b4-bas p{margin-bottom:24px !important} #ce .b4-bas .btn{margin-top:2px} #ce .b4-n{margin-right:12px} /* ---- Bölüm başlığı dikey ritmi (tek kaynak) ---- rozet → 16px → H2 → 12px → açıklama → (başlık bloğu) → 44px → içerik */ #ce .pill{margin-bottom:0} #ce .bolum-bas h2,#ce .svc-head h2,#ce .b4-bas h2,#ce .c5-sag h2, #ce .req-head h2,#ce .cta .box h2{margin-top:16px !important;margin-bottom:12px !important} #ce .bolum-bas>div>p,#ce .svc-head p,#ce .b4-bas p,#ce .req-head p{margin-bottom:0} #ce .bolum-bas,#ce .svc-head,#ce .req-head{margin-bottom:clamp(30px,3.4vw,44px) !important} #ce .b4-bas p{margin-bottom:24px !important} /* CTA'daki CE işareti: bölüm görününce önce konturu çizilir, sonra içi dolar. Hero'daki jestin sayfa sonundaki yankısı — açılış ve kapanış aynı hareketle bağlanıyor. */ /* footer: marka sütunu + başa dön */ /* CTA fonunda 10 küçük CE işareti yavaşça süzülüyor. NOT: işaretler döndürülmüyor/eğilmiyor — CE işaretinin oranı ve duruşu 765/2008 Ek II ile belirlidir; dekoratif amaçla bile deforme edilmez. Hareket yalnızca konum ve opaklıkta. */ /* DIKKAT: ce-bel yalnizca OPAKLIGA dokunur. Transform'a da dokununca "both" dolgu kipiyle bitip surekli calisan ce-suzul'u eziyordu ve isaretler hic hareket etmiyordu. */ to{opacity:var(--o)}} 50%{transform:translate3d(var(--dx),var(--dy),0)} 100%{transform:translate3d(0,0,0)}} /* ---- CTA: K3 (gradyan bant, kutu kenarı yok) + H3 (tarama) ---- Kutu sayfada tek patlayan nokta oluyordu. Artık kenar yok: bölüm kâğıttan yumuşak maviye iniyor ve footer'a bağlanıyor. İşaretler sırayla kısa süre parlıyor — hero'daki standart taramasının yankısı. */ #ce .cta-k3{position:relative;overflow:hidden;text-align:center; background:linear-gradient(180deg,var(--paper) 0,#DEE6F3 44%,#C4D0E8 100%)} #ce .cta-alan{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden; -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 16%,#000 84%,transparent 100%),linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%); mask-image:linear-gradient(to bottom,transparent 0,#000 16%,#000 84%,transparent 100%),linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%); -webkit-mask-composite:source-in;mask-composite:intersect} /* b20: akan işaretler kenarda kesilmesin, yumuşakça silinsin */ #ce .cta-k{position:absolute;left:var(--x);top:var(--y);width:var(--s); opacity:calc(var(--o)*.5);will-change:opacity} #ce .cta-k svg{width:100%;height:auto;display:block;fill:var(--seal)} #ce .cta.ce-ciz .cta-k{animation:ce-tara 9s linear infinite;animation-delay:calc(var(--i)*.8s)} @keyframes ce-tara{0%,88%,100%{opacity:calc(var(--o)*.5)}92%{opacity:calc(var(--o)*2.7)}} #ce .cta .box{position:relative;z-index:1;background:none;border:0;box-shadow:none;padding:0;overflow:visible} #ce .cta .box h2{margin:16px auto 12px !important;max-width:19ch;text-align:center} #ce .cta .box p{max-width:52ch;margin:0 auto 24px !important;text-align:center;color:var(--mu)} #ce .cta .box .pill{background:rgba(46,58,140,.08);border-color:rgba(46,58,140,.2);color:var(--seal)} /* Rozet ve buton sırası ortada dursun: tema ortamında .box'a miras gelen text-align:center yok, bu yüzden açıkça yazılıyor. (.acts zaten ayrıca ortalanıyor) */ #ce .cta .box{text-align:center} #ce .cta .acts{justify-content:center} @media (prefers-reduced-motion:reduce){ #ce .cta.ce-ciz .cta-k{animation:none;opacity:var(--o)} } /* footer artık beyazdan değil, CTA'nın bittiği renkten açılıyor */ /* CTA artık açık zeminde (K3): koyu kutudan kalan beyaz metinli düğme kuralları kaldırıldı, düğmeler sayfanın normal haline döndü. */ #ce .cta .btn-p{background:var(--seal) !important;color:#fff !important;border-color:var(--seal) !important; box-shadow:0 12px 26px -16px rgba(46,58,140,.95) !important} #ce .cta .btn-p:hover{background:#26307a !important;border-color:#26307a !important} #ce .cta .btn-s{background:var(--card) !important;color:var(--ink) !important;border-color:var(--rule) !important} #ce .cta .btn-s:hover{border-color:rgba(46,58,140,.4) !important} /* ---- D3: piyasaya arz ekseni (gerçek CE işareti) ---- */ #ce .d3-eksen{display:grid;grid-template-columns:1fr auto 1fr;align-items:center; gap:clamp(14px,2vw,26px);margin-bottom:clamp(30px,3.6vw,46px)} #ce .d3-yan{position:relative;padding:15px 0 16px} #ce .d3-yan:before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--rule)} #ce .d3-sag{text-align:right} #ce .d3-et{display:block;font-family:var(--body);font-size:14px;font-weight:600;line-height:1.3;color:var(--ink)} #ce .d3-alt{display:block;margin-top:3px;font-family:var(--mono);font-size:11.5px; letter-spacing:.07em;color:var(--mu2)} #ce .d3-orta{display:grid;justify-items:center;gap:7px;padding:0 clamp(6px,1.4vw,16px)} #ce .d3-ce{width:48px;height:34px;display:block;color:var(--seal)} #ce .d3-not{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.08em; text-transform:uppercase;color:var(--seal)} #ce .d3-not2{font-family:var(--body);font-size:12px;line-height:1.3;color:var(--mu2);text-align:center} /* ---- akordeon: açık hâl ---- */ #ce .req .acc{position:relative;transition:background .3s var(--e)} #ce .req .acc:before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:2px;border-radius:2px; background:var(--seal);opacity:0;transform:scaleY(.35);transform-origin:top; transition:opacity .3s var(--e),transform .38s var(--e)} #ce .req .acc[open]:before{opacity:1;transform:scaleY(1)} #ce .req .acc[open]{background:linear-gradient(90deg,rgba(46,58,140,.055),rgba(46,58,140,0) 74%)} #ce .req .acc summary,#ce .req .acc .ab{transition:padding-left .34s var(--e)} #ce .req .acc[open] summary{padding-left:15px} #ce .req .acc[open] .ab{padding-left:49px} #ce .req .acc[open] .acc-n{opacity:1} #ce .req .acc .ab{overflow:hidden} @media(prefers-reduced-motion:reduce){ #ce .req .acc,#ce .req .acc:before,#ce .req .acc summary,#ce .req .acc .ab{transition:none} } @media(max-width:860px){ #ce .d3-eksen{grid-template-columns:1fr;gap:2px;text-align:center} #ce .d3-yan,#ce .d3-sag{text-align:center} #ce .d3-yan:before{left:18%;right:18%} #ce .d3-orta{padding:18px 0} } /* ============================================================================ WORDPRESS YERLEŞİMİ (mu-plugin'in eklediği body.ce-tam sınıfına dayanır) Be Theme içeriği 940 px'lik bir sütuna sıkıştırıyor; tam genişlik şart, çünkü bölüm zeminleri kenardan kenara akmalı. Konum bilgisi (Subheader) anasayfada olmaz. ========================================================================== */ /* #Subheader artik mu-plugin ile DOM'dan kaldiriliyor (mfn-post-hide-title) — CSS gizlemesi yetmiyordu, icindeki

Ana Sayfa

HTML'de kaliyordu. */ body.ce-tam #Content{padding-top:0 !important;padding-bottom:0 !important} body.ce-tam .section.the_content{padding:0 !important;margin:0 !important} body.ce-tam .section.the_content>.section_wrapper{max-width:none !important;width:100% !important; margin:0 !important;padding:0 !important} body.ce-tam .the_content_wrapper{width:100% !important;margin:0 !important;float:none !important} /* FOOTER paleti artik site geneli: wiki/site/footer-palet.css (mu-plugin her sayfada yukler) */ /* ---- KAPANIŞ ŞERİDİ ARKA PLANI (b13, 2026-10-06): bütün işaret alanı en alttan en üste, saat 2 yönüne doğrusal akar; 12×6'lık blok 2×2 döşenir ve bir blok kadar kaydırılıp başa sarılır (dikişsiz). Her işaret ayrıca kendi zamanında parlayıp büyür. ---- */ #ce .cta{min-height:720px;display:flex;flex-direction:column;justify-content:center} #ce .cta>.wrap{width:100%} #ce .cta .box{position:relative;z-index:1} #ce .cta .box::before{content:"";position:absolute;inset:-14px -26px;z-index:-1;border-radius:50%;background:radial-gradient(ellipse at center,rgba(238,241,248,.96) 42%,rgba(238,241,248,.75) 62%,rgba(238,241,248,0) 100%)} /* b14: hale küçültüldü (kullanıcı 2026-10-06) */ #ce .cta-alan{color:var(--seal)} #ce .cta-akis{position:absolute;left:-1920px;top:0;width:3840px;height:1500px;display:grid;grid-template-columns:repeat(24,160px);grid-auto-rows:125px;animation:mk-akis 70s linear infinite;will-change:transform} @keyframes mk-akis{from{transform:translate(0,0)}to{transform:translate(1920px,-750px)}} #ce .cta-alan .m{display:flex;align-items:center;justify-content:center;opacity:.05;animation:mk-parla var(--d,12s) ease-in-out infinite;animation-delay:calc(var(--i,0s) * -1)} #ce .cta-alan .m svg{display:block;height:var(--h,58px);width:var(--w);fill:currentColor} @keyframes mk-parla{0%,42%{opacity:.05;transform:scale(.92)}50%{opacity:.36;transform:scale(1.14)}58%,100%{opacity:.05;transform:scale(.92)}} @media (prefers-reduced-motion:reduce){#ce .tl-dolgu,#ce .tl.akti .tl-dolgu{width:62%;transition:none} #ce .b4-l.zincir .b4-a::before,#ce .b4-l.zincir .b4-a::after{transition:none;animation:none} #ce .kure-kutu{cursor:default}} @media (prefers-reduced-motion:reduce){#ce .cta-akis{animation:none;left:-960px;top:-375px}#ce .cta-alan .m{animation:none;opacity:.14;transform:none}} @media (max-width:640px){#ce .cta{min-height:0}#ce .cta .box::before{inset:-20px -24px}#ce .cta-akis{transform-origin:0 0;zoom:.6}} /* ---- HİZMETLER: başlık solda, uygunluk işaretlerinden dönen küre sağda (b15, 2026-10-06; betik kure-b15.js) ---- */ #ce #hizmetler .bolum-bas{display:grid;grid-template-columns:1.05fr .95fr;gap:24px 40px;align-items:center} #ce #hizmetler .svc-sol{display:flex;flex-direction:column;align-items:flex-start;gap:18px} #ce #hizmetler .kure-kutu{justify-self:end;width:min(100%,420px);aspect-ratio:1;position:relative;-webkit-tap-highlight-color:transparent} #ce .kure-kutu use{cursor:pointer} /* b16: işarete tıklanınca kürenin içine girip patlar */ #ce #hizmetler .kure-kutu svg{width:100%;height:100%;display:block;overflow:visible} #ce #hizmetler{overflow:visible} @media (max-width:900px){#ce #hizmetler .bolum-bas{grid-template-columns:1fr}#ce #hizmetler .kure-kutu{justify-self:center;width:min(100%,300px)}}