:root{color-scheme:dark}.skip-link{position:fixed;top:10px;left:12px;z-index:10000;max-width:calc(100vw - 24px);padding:11px 16px;border:1px solid rgba(124,92,255,.72);border-radius:11px;background:#14171d;color:#fff;font:600 14px/1.2 "Space Grotesk",system-ui,sans-serif;box-shadow:0 16px 42px -18px rgba(124,92,255,.9);transform:translateY(-150%);opacity:0;transition:transform .18s ease,opacity .18s ease}.skip-link:focus{transform:translateY(0);opacity:1;outline:none}:where(a,button,summary,input,textarea,select,[tabindex]):focus-visible{outline:2px solid #8f75ff!important;outline-offset:3px!important}:where(input,textarea,select):focus-visible{border-color:#8f75ff!important;box-shadow:0 0 0 3px rgba(124,92,255,.18)}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.table-scroll{position:relative;width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;border-radius:14px;scrollbar-width:thin;scrollbar-color:rgba(124,92,255,.55) transparent}.table-scroll>table{margin:0;min-width:340px}.table-scroll:focus-visible{outline:2px solid #8f75ff;outline-offset:3px}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media(forced-colors:active){.skip-link,:where(a,button,summary,input,textarea,select,[tabindex]):focus-visible{outline:2px solid CanvasText}}
/* WCAG 2.2 AA 2.5.8 — dokunmatik/işaretçi hedefi en az 24x24 CSS px.
   Üst menü bağlantıları 13px metinden 20-22px yükseklik alıyordu. Cümle içi
   metin bağlantıları standardın "inline" istisnasına girdiği için kapsam
   dışıdır; bu kural yalnızca menü çubuklarını hedefler. */
.nav-links a,.nl-group a,.foot-links a,.blog-nav a{display:inline-flex;align-items:center;min-height:24px}
/* WCAG 2.2 AA 2.5.8 kapsamının tamamlanması. Önceki kural yalnızca menü
   çubuklarını kapsıyordu; bölüm CTA'ları ve blog/hukuki sayfa bağlantıları
   farklı sınıflar kullandığı için 15-23px yükseklikte kalmıştı.
   Paragraf içi metin bağlantıları standardın inline istisnasına girer ve
   bilinçli olarak kapsam dışıdır. */
.web-actions a,.ai-actions a,.seo-text-link,.faq-contact,nav .link,.legal-related a,.article-promo-link,.related-post-link{display:inline-flex;align-items:center;min-height:24px}
/* Hero sektör sekmelerinde hiç hover kuralı yoktu: sayfanın en etkileşimli
   bileşeni fareye tepki vermiyordu. */
.tabs .tab{transition:background-color .18s ease,border-color .18s ease,color .18s ease}
.tabs .tab:hover:not([aria-selected="true"]){background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.22);color:#f2f1ec}
@media(prefers-reduced-motion:reduce){.tabs .tab{transition:none}}

.ai-widget{position:fixed;right:20px;bottom:20px;z-index:70;font-family:Inter,system-ui,sans-serif}.ai-fab{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#4DD9C9,#7C5CFF);border:none;cursor:pointer;display:grid;place-items:center;box-shadow:0 14px 34px -8px rgba(124,92,255,.55);position:relative;transition:transform .18s ease}.ai-fab:hover{transform:translateY(-2px) scale(1.03)}.ai-fab svg{width:26px;height:26px;stroke:#04211d;fill:none;stroke-width:2}.ai-fab .fab-x{display:none}.ai-fab .fab-badge{position:absolute;top:-3px;right:-3px;width:15px;height:15px;border-radius:50%;background:#FF5B4A;border:2px solid #0C0E12}.ai-fab::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #4DD9C9;opacity:0;animation:owsPulse 2.6s ease-out infinite}@keyframes owsPulse{0%{opacity:.6;transform:scale(1)}70%{opacity:0;transform:scale(1.5)}100%{opacity:0;transform:scale(1.5)}}.ai-widget.open .ai-fab .fab-chat{display:none}.ai-widget.open .ai-fab .fab-x{display:block}.ai-widget.open .ai-fab .fab-badge{display:none}.ai-widget.open .ai-fab::after{display:none}.ai-panel{position:absolute;right:0;bottom:74px;width:352px;max-width:calc(100vw - 32px);height:480px;max-height:calc(100vh - 120px);background:#0C0E12;border:1px solid rgba(255,255,255,.16);border-radius:18px;box-shadow:0 30px 70px -20px rgba(0,0,0,.7);display:flex;flex-direction:column;overflow:hidden;opacity:0;transform:translateY(14px) scale(.97);pointer-events:none;visibility:hidden;transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}.ai-widget.open .ai-panel{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition:opacity .2s ease,transform .2s ease,visibility 0s}.ai-head{display:flex;align-items:center;gap:11px;padding:14px 15px;border-bottom:1px solid rgba(255,255,255,.09);background:#1B1F27;flex:none}.ai-av{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#4DD9C9,#7C5CFF);display:grid;place-items:center;flex:none}.ai-av svg{width:20px;height:20px;stroke:#04211d;fill:none;stroke-width:2}.ai-who{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:13.5px;line-height:1.2;color:#F2F1EC}.ai-stat{font-size:12px;color:#25C26E;display:flex;align-items:center;gap:6px;margin-top:2px}.ai-stat::before{content:"";width:6px;height:6px;border-radius:50%;background:#25C26E}.ai-close{margin-left:auto;background:none;border:none;color:#858E9C;font-size:16px;cursor:pointer}.ai-body{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:16px 14px;display:flex;flex-direction:column;gap:10px}.ai-msg{max-width:84%;padding:10px 13px;font-size:13px;line-height:1.5;border-radius:13px}.ai-msg.bot{align-self:flex-start;background:#14171D;border:1px solid rgba(255,255,255,.09);border-bottom-left-radius:4px;color:#e7e9ee}.ai-msg.user{align-self:flex-end;background:#7C5CFF;color:#fff;border-bottom-right-radius:4px}.ai-msg a{color:#4DD9C9;text-decoration:underline}.ai-typing{align-self:flex-start;display:flex;gap:5px;padding:12px 14px;background:#14171D;border:1px solid rgba(255,255,255,.09);border-radius:13px;border-bottom-left-radius:4px}.ai-typing i{width:6px;height:6px;border-radius:50%;background:#858E9C;display:inline-block;animation:owsBlink 1.3s infinite}.ai-typing i:nth-child(2){animation-delay:.2s}.ai-typing i:nth-child(3){animation-delay:.4s}@keyframes owsBlink{0%,60%,100%{opacity:.3}30%{opacity:1}}.ai-quick{display:flex;gap:7px;flex-wrap:wrap;padding:0 14px 12px;flex:none}.ai-quick:empty{display:none}.ai-quick button{font-size:12px;color:#F2F1EC;background:#14171D;border:1px solid rgba(255,255,255,.09);border-radius:999px;padding:7px 12px;cursor:pointer;transition:border-color .15s}.ai-quick button:hover{border-color:#7C5CFF}.ai-quick button.q-primary{background:rgba(124,92,255,.14);border-color:rgba(124,92,255,.4);color:#cbbcff}.ai-row{display:flex;align-items:center;gap:8px;padding:12px 14px;border-top:1px solid rgba(255,255,255,.09);flex:none;background:#1B1F27}.ai-row input{flex:1;background:#0C0E12;border:1px solid rgba(255,255,255,.09);border-radius:999px;padding:10px 15px;color:#F2F1EC;font-size:13px;outline:none}.ai-row input:focus{border-color:#7C5CFF}.ai-send{width:36px;height:36px;border-radius:50%;background:#4DD9C9;color:#04211d;border:none;display:grid;place-items:center;font-weight:700;flex:none;cursor:pointer}.ai-row input:disabled{opacity:.72;cursor:wait}.ai-row .ai-send:disabled{opacity:.52;cursor:wait}.ai-teaser{position:absolute;right:4px;bottom:78px;width:262px;max-width:calc(100vw - 40px);background:#14171D;border:1px solid rgba(255,255,255,.16);border-radius:16px;border-bottom-right-radius:5px;padding:13px 14px 14px;box-shadow:0 22px 55px -18px rgba(0,0,0,.72);opacity:0;transform:translateY(12px) scale(.96);pointer-events:none;visibility:hidden;transition:opacity .32s cubic-bezier(.2,.9,.3,1),transform .32s cubic-bezier(.2,.9,.3,1),visibility 0s linear .32s}.ai-teaser.show{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition:opacity .32s cubic-bezier(.2,.9,.3,1),transform .32s cubic-bezier(.2,.9,.3,1),visibility 0s}.ai-teaser-h{display:flex;align-items:center;gap:9px;margin-bottom:9px}.ai-teaser-av{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,#4DD9C9,#7C5CFF);display:grid;place-items:center;flex:none}.ai-teaser-av svg{width:18px;height:18px;stroke:#04211d;fill:none;stroke-width:2}.ai-teaser-n{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:12.5px;color:#F2F1EC;line-height:1.2}.ai-teaser-n span{display:block;font-weight:500;font-size:12px;color:#25C26E;margin-top:2px}.ai-teaser p{font-size:12.5px;line-height:1.5;color:#e7e9ee;margin:0 0 11px}.ai-teaser-cta{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:12.5px;color:#04211d;background:#4DD9C9;border:none;border-radius:10px;padding:9px 12px;cursor:pointer;width:100%}.ai-teaser-x{position:absolute;top:7px;right:9px;background:none;border:none;color:#858E9C;cursor:pointer;font-size:15px}.ows-cta{position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;gap:10px;padding:9px 12px calc(9px + env(safe-area-inset-bottom));background:rgba(9,11,15,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid rgba(255,255,255,.16)}.ows-cta a{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:14.5px;padding:13px 10px;border-radius:12px;text-decoration:none}.ows-cta a:active{transform:scale(.97)}.ows-cta .c-wa{background:#25D366;color:#06301A}.ows-cta .c-q{background:#7C5CFF;color:#fff}.ows-cta svg{flex:none}@media(max-width:900px){.ows-cta{backdrop-filter:none;-webkit-backdrop-filter:none;background:#0a0c10}}@media(max-width:720px){.ows-cta{display:flex}.ai-widget{bottom:calc(76px + env(safe-area-inset-bottom))}body{padding-bottom:calc(74px + env(safe-area-inset-bottom))}.ai-panel{max-height:calc(100vh - 250px - env(safe-area-inset-bottom))}}@supports (height:100dvh){.ai-panel{max-height:calc(100dvh - 120px)}@media(max-width:720px){.ai-panel{max-height:calc(100dvh - 250px - env(safe-area-inset-bottom))}}}@media(pointer:coarse),(max-width:820px){.ai-close{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;padding:0;flex:none}.ai-teaser-x{width:36px;height:36px;display:grid;place-items:center;top:2px;right:3px;padding:0}.ai-teaser-cta{min-height:42px}.ai-send{width:40px;height:40px}.foot-links{gap:4px 18px}.foot-links a{display:inline-block;min-height:40px;line-height:40px;padding:0 4px}}@media(hover:none){.ai-fab:hover{transform:none}.ows-cta a:active{transform:scale(.97)}}@media(prefers-reduced-motion:reduce){.ai-fab::after,.ai-typing i{animation:none}}

.service-page{ --service-accent-rgb: 124, 92, 255; --service-accent-2-rgb: 77, 217, 201; background: radial-gradient(900px circle at 82% 7%, rgba(var(--service-accent-rgb), .13), transparent 38%),
    radial-gradient(760px circle at 10% 24%, rgba(var(--service-accent-2-rgb), .07), transparent 38%),
    linear-gradient(180deg, #07090d 0%, #0b0e13 48%, #07090d 100%); }.service-graphic .logo,.service-cloud .logo{ position: relative; isolation: isolate; padding: 5px 8px; border-radius: 14px; }@media (max-width: 900px){.service-graphic .logo,.service-cloud .logo{ overflow: hidden; }}.service-hero-grid{ gap: clamp(38px, 5vw, 62px); }.service-page .service-hero-copy{ padding-left: 6px; }.service-page .service-hero p,.service-page .sec-h p,.service-page .g-card p,.service-page .process-step p,.service-page details.faq div{ text-wrap: pretty; }.service-page .sec-h{ max-width: 790px; margin-bottom: 36px; }.service-page .g-card{ padding: 29px 28px 27px; }.service-page .process-step{ padding-right: 27px; padding-left: 27px; }.service-page .price-band{ padding-right: 44px; padding-left: 44px; }.service-page .cta-final{ padding-right: 44px; padding-left: 44px; }.service-page .rel a{ padding-right: 20px; padding-left: 20px; }.service-graphic .sec-head{ grid-template-columns: minmax(0px, 0.92fr) minmax(0px, 1.08fr); gap: 30px; align-items: center; }.service-graphic .sec-head > p{ max-width: 54ch; }@media (max-width: 760px){.service-page .service-hero-copy{ padding-left: 0px; }.service-page .g-card{ padding: 25px 23px; }.service-page .price-band,.service-page .cta-final{ padding-right: 24px; padding-left: 24px; }.service-graphic .sec-head{ grid-template-columns: 1fr; gap: 16px; }}.service-web{ --service-accent-rgb: 124, 92, 255; --service-accent-2-rgb: 77, 217, 201; }.service-ai{ --service-accent-rgb: 77, 217, 201; --service-accent-2-rgb: 124, 92, 255; }.service-commerce{ --service-accent-rgb: 255, 91, 74; --service-accent-2-rgb: 201, 162, 75; }.service-seo{ --service-accent-rgb: 37, 194, 110; --service-accent-2-rgb: 77, 141, 245; }.service-graphic{ --service-accent-rgb: 244, 95, 208; --service-accent-2-rgb: 124, 92, 255; }.service-cloud{ --service-accent-rgb: 201, 162, 75; --service-accent-2-rgb: 77, 217, 201; }.service-page main{ overflow: hidden; }.service-page header.nav{ background: rgba(7, 9, 13, 0.8); border-color: rgba(255, 255, 255, 0.08); }.service-page .nav-in{ height: 78px; }.service-page .service-hero{ position: relative; max-width: 1180px; padding-top: 86px; padding-bottom: 36px; isolation: isolate; }.service-page .service-hero::before{ content: ""; position: absolute; z-index: -1; width: 760px; height: 760px; right: -320px; top: -340px; border-radius: 50%; background: radial-gradient(circle, rgba(var(--service-accent-rgb), .16), transparent 68%); filter: blur(8px); pointer-events: none; }.service-hero-grid{ display: grid; grid-template-columns: minmax(0px, 1.08fr) minmax(350px, 0.82fr); align-items: center; gap: clamp(42px, 7vw, 84px); }.service-hero-copy{ min-width: 0px; }.service-page .service-hero .eyebrow{ color: rgb(156, 163, 175); }.service-page .service-hero .eyebrow::before{ display: none; }.service-page .service-hero h1{ max-width: 11.5ch; margin: 21px 0px 23px; color: rgb(244, 243, 239); font-size: clamp(45px, 5.7vw, 72px); font-weight: 600; line-height: 0.98; letter-spacing: -0.055em; text-wrap: balance; }.service-page .service-hero h1 em{ font-style: normal; font-weight: 600; color: rgb(var(--service-accent-rgb)); }.service-page .service-hero p{ max-width: 58ch; margin: 0px 0px 29px; color: rgb(174, 184, 200); font-size: 17px; line-height: 1.72; letter-spacing: -0.012em; text-wrap: pretty; }.service-page .service-hero .hero-actions{ margin: 0px; }.service-page .service-hero .btn-ghost{ background: rgba(255, 255, 255, 0.02); }.service-page .live-hint{ display: inline-flex; align-items: center; gap: 8px; margin: -7px 0px 18px; padding: 8px 11px; border: 1px solid rgba(var(--service-accent-rgb), .24); border-radius: 999px; background: rgba(var(--service-accent-rgb), .065); color: rgb(199, 213, 223); font: 500 12px var(--disp); }.service-page .live-hint::before{ content: ""; width: 7px; height: 7px; border-radius: 50%; background: rgb(var(--service-accent-rgb)); box-shadow: 0 0 16px rgba(var(--service-accent-rgb), .75); }.service-visual{ position: relative; min-height: 430px; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 28px; background: linear-gradient(145deg, rgba(var(--service-accent-rgb), .12), rgba(255, 255, 255, .02) 42%, rgba(7, 9, 13, .75)),
    #11151c; box-shadow: rgba(0, 0, 0, 0.95) 0px 46px 90px -54px, rgba(255, 255, 255, 0.04) 0px 1px inset; }.service-visual::before{ content: ""; position: absolute; inset: auto -20% -45% 5%; height: 75%; border-radius: 50%; background: radial-gradient(circle, rgba(var(--service-accent-2-rgb), .16), transparent 64%); pointer-events: none; }.visual-top{ display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); color: rgb(220, 226, 235); font: 600 12px var(--disp); letter-spacing: 0.02em; }.visual-status{ display: inline-flex; align-items: center; gap: 7px; color: rgb(143, 154, 171); font: 500 12px var(--body); }.visual-status::before{ content: ""; width: 6px; height: 6px; border-radius: 50%; background: rgb(var(--service-accent-rgb)); box-shadow: 0 0 12px rgba(var(--service-accent-rgb), .75); }.visual-window{ position: absolute; inset: 78px 34px 34px; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 18px; background: rgba(7, 9, 13, 0.72); box-shadow: rgba(0, 0, 0, 0.9) 0px 28px 60px -36px; }.web-window-bar{ display: flex; align-items: center; gap: 6px; padding: 12px 14px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }.web-window-bar i{ width: 7px; height: 7px; border-radius: 50%; background: rgba(255, 255, 255, 0.16); }.web-window-hero{ padding: 34px 28px 20px; }.web-window-hero span{ display: block; width: 48%; height: 7px; margin-bottom: 13px; border-radius: 999px; background: rgba(var(--service-accent-rgb), .75); }.web-window-hero strong{ display: block; max-width: 9ch; color: rgb(243, 243, 239); font: 600 29px/1.04 var(--disp); letter-spacing: -0.04em; }.web-window-hero small{ display: block; max-width: 30ch; margin-top: 11px; color: rgb(120, 131, 149); font: 400 12px/1.5 var(--body); }.web-window-cards{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 0px 28px; }.web-window-cards i{ height: 58px; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 10px; background: linear-gradient(145deg, rgba(var(--service-accent-rgb), .11), rgba(255, 255, 255, .02)); }.web-phone{ position: absolute; right: 18px; bottom: 18px; width: 92px; height: 178px; padding: 9px; border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 22px; background: rgb(10, 12, 17); box-shadow: rgba(0, 0, 0, 0.9) 0px 20px 42px -22px; }.web-phone::before{ content: ""; display: block; width: 30px; height: 5px; margin: 0px auto 10px; border-radius: 999px; background: rgba(255, 255, 255, 0.13); }.web-phone i{ display: block; height: 9px; margin: 8px 3px; border-radius: 999px; background: rgba(var(--service-accent-rgb), .26); }.web-phone i:nth-child(2){ width: 70%; }.web-phone i:nth-child(3){ width: 86%; background: rgba(255, 255, 255, 0.08); }.web-phone i:nth-child(4){ height: 52px; border-radius: 10px; background: rgba(255, 255, 255, 0.055); }.ai-chat-card{ position: absolute; inset: 80px 30px 30px; display: flex; flex-direction: column; gap: 13px; padding: 26px 22px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 20px; background: rgba(7, 9, 13, 0.73); }.ai-msg{ max-width: 82%; padding: 12px 14px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 14px; color: rgb(185, 195, 210); font: 400 12px/1.5 var(--body); }.ai-msg.user{ align-self: flex-end; border-color: rgba(var(--service-accent-rgb), .28); background: rgba(var(--service-accent-rgb), .14); color: rgb(231, 251, 248); }.ai-msg.bot{ background: rgba(255, 255, 255, 0.035); }.ai-msg.bot strong{ color: rgb(var(--service-accent-rgb)); }.ai-typing{ display: flex; align-items: center; gap: 5px; width: max-content; padding: 10px 12px; border-radius: 999px; background: rgba(255, 255, 255, 0.04); }.ai-typing i{ width: 5px; height: 5px; border-radius: 50%; background: rgb(105, 117, 136); }.shop-metric{ position: absolute; left: 28px; top: 82px; right: 28px; display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 10px; }.shop-total,.shop-orders{ padding: 20px; border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 16px; background: rgba(7, 9, 13, 0.7); }.shop-total span,.shop-orders span{ display: block; color: rgb(132, 144, 162); font: 500 12px var(--disp); letter-spacing: 0.08em; text-transform: uppercase; }.shop-total strong,.shop-orders strong{ display: block; margin-top: 8px; color: rgb(244, 242, 238); font: 600 27px var(--disp); }.shop-total strong{ color: rgb(var(--service-accent-rgb)); }.shop-list{ position: absolute; inset: 202px 28px 28px; display: grid; gap: 9px; }.shop-row{ display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 12px; background: rgba(255, 255, 255, 0.024); }.shop-row i{ width: 42px; height: 34px; border-radius: 8px; background: linear-gradient(145deg, rgba(var(--service-accent-rgb), .35), rgba(var(--service-accent-2-rgb), .13)); }.shop-row span{ color: rgb(185, 194, 207); font: 500 12px var(--body); }.shop-row b{ color: rgb(115, 222, 161); font: 600 12px var(--disp); }.seo-search{ position: absolute; inset: 82px 28px auto; display: flex; align-items: center; gap: 10px; padding: 13px 15px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 999px; background: rgba(7, 9, 13, 0.78); color: rgb(203, 211, 223); font: 500 12px var(--body); }.seo-search::before{ content: ""; width: 13px; height: 13px; border: 2px solid rgb(119, 131, 150); border-radius: 50%; }.seo-rank-card{ position: absolute; inset: 150px 28px auto; padding: 18px; border: 1px solid rgba(var(--service-accent-rgb), .3); border-radius: 16px; background: rgba(7, 9, 13, 0.72); }.seo-rank{ float: right; padding: 6px 9px; border-radius: 999px; background: rgba(var(--service-accent-rgb), .14); color: rgb(var(--service-accent-rgb)); font: 700 12px var(--disp); }.seo-rank-card small{ color: rgb(112, 128, 148); font: 500 12px var(--body); }.seo-rank-card strong{ display: block; max-width: 25ch; margin: 7px 0px; color: rgb(116, 167, 255); font: 600 14px/1.35 var(--disp); }.seo-rank-card p{ margin: 0px; color: rgb(142, 154, 172); font-size: 12px; line-height: 1.5; }.seo-chart{ position: absolute; inset: 285px 28px 28px; display: flex; align-items: flex-end; gap: 9px; padding: 18px 16px 12px; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 16px; background: repeating-linear-gradient(rgba(255, 255, 255, 0.05) 0px, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 34px), rgba(255, 255, 255, 0.02); }.seo-chart i{ flex: 1 1 0%; height: var(--h); min-height: 16px; border-radius: 7px 7px 2px 2px; background: linear-gradient(180deg, rgba(var(--service-accent-rgb), .9), rgba(var(--service-accent-rgb), .2)); }.service-page .service-hero .hero-trust{ display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 0px; margin-top: 54px; padding: 21px 0px 0px; border-top: 1px solid rgba(255, 255, 255, 0.094); color: rgb(119, 130, 149); }.service-page .service-hero .hero-trust span{ min-width: 0px; padding: 0px 22px; border-left: 1px solid rgba(255, 255, 255, 0.075); font-size: 12px; line-height: 1.55; }.service-page .service-hero .hero-trust span:first-child{ padding-left: 0px; border-left: 0px; }.service-page .service-hero .hero-trust b{ display: block; margin-bottom: 2px; color: rgb(237, 240, 244); font: 600 15px var(--disp); }.service-page section.blk{ max-width: 1180px; padding-top: 78px; padding-bottom: 78px; }.service-page .sec-h{ max-width: 720px; margin-bottom: 40px; }.service-page .sec-h::before{ content: attr(data-kicker); display: block; min-height: 14px; margin-bottom: 13px; color: rgb(var(--service-accent-rgb)); font: 600 12px var(--disp); letter-spacing: 0.16em; text-transform: uppercase; }.service-page .sec-h h2{ color: rgb(242, 241, 236); font-size: clamp(29px, 3.7vw, 43px); line-height: 1.06; letter-spacing: -0.038em; }.service-page .sec-h p{ margin-top: 13px; color: rgb(156, 168, 185); font-size: 16px; line-height: 1.68; }.service-page .grid{ gap: 16px; }.service-page .g-card{ min-height: 236px; padding: 25px 24px 23px; border-color: rgba(255, 255, 255, 0.086); border-radius: 19px; background: linear-gradient(155deg, rgba(255, 255, 255, 0.043), rgba(255, 255, 255, 0.01) 56%), rgb(13, 16, 21); }.service-page .g-card .ic{ width: 46px; height: 46px; margin-bottom: 25px; border-radius: 13px; }.service-page .g-card h3{ margin-bottom: 10px; color: rgb(240, 242, 245); font-size: 18px; }.service-page .g-card p{ color: rgb(143, 155, 173); font-size: 13.5px; line-height: 1.65; }.service-page .service-process{ position: relative; }.process-grid{ display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); border-top: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.08); }.process-step{ min-width: 0px; padding: 26px 22px 28px; border-left: 1px solid rgba(255, 255, 255, 0.075); }.process-step:first-child{ padding-left: 0px; border-left: 0px; }.process-step .num{ display: block; margin-bottom: 29px; color: rgb(var(--service-accent-rgb)); font: 600 12px var(--disp); letter-spacing: 0.09em; }.process-step h3{ margin-bottom: 8px; color: rgb(241, 242, 245); font-size: 17px; }.process-step p{ color: rgb(132, 144, 161); font-size: 13px; line-height: 1.62; }.service-page .price-band{ position: relative; overflow: hidden; padding: 40px 38px; border-color: rgba(var(--service-accent-rgb), .26); border-radius: 24px; background: radial-gradient(520px circle at 85% 0%, rgba(var(--service-accent-rgb), .16), transparent 64%),
    linear-gradient(135deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .014)); }.service-page .price-band::after{ content: "ÖLÇER / 2026"; position: absolute; right: 34px; top: 20px; color: rgba(255, 255, 255, 0.18); font: 600 12px var(--disp); letter-spacing: 0.18em; }.service-page .price-band .p-txt{ max-width: 700px; }.service-page .price-band .p-txt h3{ font-size: 25px; }.service-page .price-band .p-txt p{ max-width: 64ch; color: rgb(154, 166, 183); line-height: 1.65; }.service-page .price-band .p-num{ color: rgb(var(--service-accent-rgb)); font-size: 34px; text-align: right; }.service-page details.faq{ padding: 0px; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgba(255, 255, 255, 0.09); border-image: none; border-radius: 0px; background: transparent; }.service-page details.faq summary{ padding: 21px 3px; font-size: 16px; }.service-page details.faq summary::after{ color: rgb(var(--service-accent-rgb)); }.service-page details.faq div{ max-width: 74ch; padding: 0px 3px 22px; color: rgb(149, 161, 178); line-height: 1.7; }.service-page .cta-final{ padding: 52px 38px; border-color: rgba(var(--service-accent-rgb), .2); border-radius: 26px; background: radial-gradient(580px circle at 50% -25%, rgba(var(--service-accent-rgb), .24), transparent 64%),
    linear-gradient(145deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .012)),
    #0d1015; margin-top: 54px !important; }.service-page .cta-final h2{ font-size: clamp(27px, 3vw, 36px); letter-spacing: -0.035em; }.service-page .cta-final p{ color: rgb(156, 168, 185); line-height: 1.7; }.service-page .rel{ display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; padding-top: 31px; margin-top: 54px !important; }.service-page .rel h3{ grid-column: 1 / -1; margin-bottom: 3px; color: rgb(121, 133, 151); }.service-page .rel a{ min-height: 66px; align-items: center; margin: 0px; padding: 17px 18px; border-radius: 14px; background: rgba(255, 255, 255, 0.02); }.service-page .rel a span{ color: rgb(var(--service-accent-rgb)); }.service-page footer{ margin-top: 30px; background: rgba(5, 7, 10, 0.48); }.service-graphic .hero,.service-cloud .hero{ padding-top: 82px; }.service-graphic .hero-grid,.service-cloud .hero-grid{ gap: clamp(40px, 6vw, 78px); }.service-graphic .hero-notes,.service-cloud .hero-notes{ border-top: 1px solid rgba(255, 255, 255, 0.09); border-bottom: 1px solid rgba(255, 255, 255, 0.07); background: linear-gradient(90deg, rgba(var(--service-accent-rgb), .055), transparent); }.service-graphic .hero-notes span,.service-cloud .hero-notes span{ border-color: rgba(255, 255, 255, 0.07); }.service-graphic .cta,.service-cloud .cta{ border-color: rgba(var(--service-accent-rgb), .22); background: radial-gradient(560px circle at 50% -30%, rgba(var(--service-accent-rgb), .2), transparent 64%),
    #11141a; }@media (max-width: 900px){.service-hero-grid{ grid-template-columns: 1fr; gap: 42px; }.service-page .service-hero h1{ max-width: 13ch; }.service-visual{ width: min(100%, 560px); min-height: 400px; margin: 0px auto; }.service-page .service-hero .hero-trust{ grid-template-columns: repeat(2, minmax(0px, 1fr)); row-gap: 22px; }.service-page .service-hero .hero-trust span:nth-child(2n+1){ padding-left: 0px; border-left: 0px; }.process-grid{ grid-template-columns: repeat(2, minmax(0px, 1fr)); }.process-step:nth-child(3){ padding-left: 0px; border-left: 0px; }}@media (max-width: 560px){.service-page .service-hero{ padding-top: 54px; }.service-page .service-hero h1{ font-size: clamp(40px, 12vw, 56px); }.service-page .service-hero p{ font-size: 15.5px; }.service-visual{ min-height: 400px; border-radius: 22px; }.visual-window,.ai-chat-card{ left: 18px; right: 18px; }.service-page .service-hero .hero-trust{ margin-top: 38px; }.service-page .service-hero .hero-trust span{ padding: 0px 12px; }.service-page section.blk{ padding-top: 60px; padding-bottom: 60px; }.service-page .g-card{ min-height: 0px; }.process-grid{ grid-template-columns: 1fr; }.process-step,.process-step:nth-child(3){ padding: 22px 0px; border-left: 0px; border-top: 1px solid rgba(255, 255, 255, 0.07); }.process-step:first-child{ border-top: 0px; }.process-step .num{ margin-bottom: 15px; }.service-page .price-band{ padding: 34px 24px; }.service-page .price-band .p-num{ text-align: left; }.service-page .rel{ grid-template-columns: 1fr; }}
/* Hizmet başlıkları: konuya göre ortak premium vurgu sistemi */
.service-page {
  --service-accent: #7c5cff;
  --service-accent-hi: #c2b8ff;
  --service-heading-accent: var(--service-accent);
}

.service-page.service-ai {
  --service-accent: #4dd9c9;
  --service-accent-hi: #b9fff5;
}

.service-page.service-seo {
  --service-accent: #63d394;
  --service-accent-hi: #c4f5d5;
}

.service-page.service-commerce {
  --service-accent: #ff5b4a;
  --service-accent-hi: #ffc0b8;
}

.service-page.service-graphic {
  --service-accent: #ec4aa5;
  --service-accent-hi: #ffb1dc;
}

.service-page.service-cloud {
  --service-accent: #c9a24b;
  --service-accent-hi: #ffe4a1;
  --service-heading-accent: #4dd9c9;
}

.service-page .hero .eyebrow {
  color: var(--service-accent);
}

.service-page .hero .eyebrow::before {
  background: var(--service-accent);
}

.service-page .hero h1 em {
  display: inline-block;
  background: linear-gradient(105deg, var(--service-heading-accent), var(--service-accent-hi) 46%, var(--service-heading-accent));
  background-size: 220% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  animation: serviceAccentShine 7s linear infinite;
}

@keyframes serviceAccentShine {
  to { background-position: 220% center; }
}

@media (prefers-reduced-motion: reduce) {
  .service-page .hero h1 em { animation: none; }
}

/* Ölçer Web Tasarım — unified brand assets */
.logo,
.premium-footer-logo {
  display: inline-flex;
  align-items: center;
  gap: 0;
  width: auto;
  min-width: 0;
  padding: 0;
  margin-left: 0;
  margin-right: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  isolation: auto;
}

.logo::before,
.logo::after,
.premium-footer-logo::before,
.premium-footer-logo::after {
  display: none;
  content: none;
  animation: none;
}

.logo .brand-wordmark,
.premium-footer-logo .brand-wordmark {
  display: block;
  width: 158px;
  max-width: none;
  height: auto;
  object-fit: contain;
  filter: none;
  transform: none;
}

.blog-footer-inner .logo .brand-wordmark,
footer .premium-footer-logo .brand-wordmark {
  width: 178px;
}

.brand-wordmark--standalone {
  display: block;
  width: min(260px, 76vw);
  height: auto;
  margin: 0 auto;
  object-fit: contain;
}

@media (max-width: 560px) {
  .logo .brand-wordmark,
  .premium-footer-logo .brand-wordmark {
    width: 142px;
  }

  .blog-footer-inner .logo .brand-wordmark,
  footer .premium-footer-logo .brand-wordmark {
    width: 160px;
  }
}
/* Keep the pointer-following hero ambience covering the section at every edge. */
.hero > .ambient {
  inset: -32px;
}

.hero {
  overflow: clip;
}

@supports not (overflow: clip) {
  .hero {
    overflow: hidden;
  }
}

/* Remove the decorative gradient rules below homepage section headings. */
.sec-head h2::after {
  content: none;
  display: none;
}

/* Give homepage section labels a distinct, non-purple editorial tone. */
body.home-page#top .eyebrow,
body.home-page#top .eyebrow.cy {
  color: #b9c8d8;
  font-family: var(--disp);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-shadow: 0 0 18px rgba(77, 217, 201, 0.18);
}

/* Extend the same editorial tone to homepage proof and supporting labels. */
body.home-page#top .process-note > span,
body.home-page#top .reference-proof span,
body.home-page#top .about-code,
body.home-page#top .about-footer > span,
body.home-page#top .contact-premium .cta-actions small {
  color: #b9c8d8;
  font-family: var(--disp);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-shadow: 0 0 18px rgba(77, 217, 201, 0.16);
}

/* Supporting explanations stay comfortable to read while gaining contrast. */
body.home-page#top .tech-heading > p,
body.home-page#top .plans-premium .plan-note,
body.home-page#top .faq-premium .sec-head p {
  color: #aebdcb;
  font-weight: 500;
}

body.home-page#top .plans-premium .plan-note strong {
  color: #d8e1e9;
  font-weight: 700;
}

/* Shared professional system for all primary service pages */
.service-page {
  --service-accent: #7ed9ce;
  --service-accent-2: #9fb1c6;
  --service-accent-rgb: 126, 217, 206;
  --service-surface: rgba(18, 22, 30, 0.92);
  --service-surface-strong: rgba(22, 27, 36, 0.97);
  --service-line: rgba(255, 255, 255, 0.09);
  --service-line-strong: rgba(185, 200, 216, 0.2);
  --service-copy: #afbdcc;
  --service-soft: #8e9dad;
  --maxw: 1120px;
  background:
    radial-gradient(880px circle at 84% 0%, rgba(var(--service-accent-rgb), 0.085), transparent 44%),
    radial-gradient(720px circle at 5% 25%, rgba(75, 112, 170, 0.065), transparent 42%),
    linear-gradient(180deg, #080a0e 0%, #0b0e13 50%, #080a0e 100%);
}

.service-web {
  --service-accent: #8f79ef;
  --service-accent-2: #60d9cd;
  --service-accent-rgb: 126, 109, 232;
}

.service-ai {
  --service-accent: #68d9ce;
  --service-accent-2: #8d83e9;
  --service-accent-rgb: 77, 217, 201;
}

.service-commerce {
  --service-accent: #e38963;
  --service-accent-2: #d9b567;
  --service-accent-rgb: 227, 137, 99;
}

.service-seo {
  --service-accent: #6ed399;
  --service-accent-2: #75d9ce;
  --service-accent-rgb: 110, 211, 153;
}

.service-graphic {
  --service-accent: #b49ae8;
  --service-accent-2: #71d8cf;
  --service-accent-rgb: 180, 154, 232;
}

.service-cloud {
  --service-accent: #d9b565;
  --service-accent-2: #76d8cf;
  --service-accent-rgb: 217, 181, 101;
}

.service-page header.nav {
  background: rgba(8, 10, 14, 0.87);
  border-bottom-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 12px 38px rgba(0, 0, 0, 0.14);
}

.service-page .nav-in {
  width: 100%;
  max-width: var(--maxw);
  height: 74px;
}

.service-page .nav-links {
  color: #a8b4c1;
  font-size: 13px;
}

.service-page .nav-links > a:not(.btn):hover {
  color: #edf0f2;
}

body.service-page#top .eyebrow,
body.service-page#top .kicker {
  color: #b9c8d8;
  font-family: var(--disp);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-shadow: 0 0 18px rgba(77, 217, 201, 0.13);
}

.service-page .eyebrow::before {
  display: none;
}

.service-page .service-hero,
.service-graphic .hero,
.service-cloud .hero {
  position: relative;
  overflow: visible;
  padding-top: clamp(72px, 8vw, 112px);
  padding-bottom: clamp(66px, 7vw, 94px);
}

.service-page .service-hero::after,
.service-graphic .hero::after,
.service-cloud .hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  right: 24px;
  left: 24px;
  height: 100%;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  pointer-events: none;
}

.service-page .service-hero-grid,
.service-graphic .hero-grid,
.service-cloud .hero-grid {
  grid-template-columns: minmax(0, 1.06fr) minmax(350px, 0.84fr);
  gap: clamp(48px, 7vw, 88px);
  align-items: center;
}

.service-page .service-hero-copy,
.service-graphic .hero-copy,
.service-cloud .hero-copy {
  min-width: 0;
}

.service-page .service-hero h1,
.service-graphic .hero h1,
.service-cloud .hero h1 {
  max-width: 13ch;
  margin: 20px 0 23px;
  color: #f0f2f3;
  font: 600 clamp(47px, 5.4vw, 70px) / 0.99 var(--disp);
  letter-spacing: -0.06em;
  text-wrap: balance;
}

.service-page .service-hero h1 em,
.service-graphic .hero h1 em,
.service-cloud .hero h1 em {
  background: linear-gradient(90deg, var(--service-accent) 0%, var(--service-accent-2) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  font-style: normal;
  font-weight: inherit;
}

.service-page .service-hero p,
.service-graphic .hero-copy > p,
.service-cloud .hero-copy > p {
  max-width: 61ch;
  margin: 0;
  color: var(--service-copy);
  font-size: 17px;
  line-height: 1.76;
}

.service-page .hero-actions,
.service-page .actions {
  gap: 11px;
  margin-top: 29px;
}

.service-page .hero-actions .btn,
.service-page .actions .btn,
.service-page .cta-acts .btn,
.service-page .cta-actions .btn {
  min-height: 49px;
  padding: 13px 20px;
  border-radius: 10px;
}

.service-page .btn-primary {
  border: 1px solid rgba(var(--service-accent-rgb), 0.7);
  background: var(--service-accent);
  color: #07110f;
  box-shadow: 0 14px 34px -22px rgba(var(--service-accent-rgb), 0.85);
}

.service-page .btn-ghost {
  border-color: rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.02);
  color: #e1e6ea;
}

.service-page .btn-ghost:hover {
  border-color: rgba(var(--service-accent-rgb), 0.5);
}

.service-page .service-visual,
.service-graphic .design-board,
.service-cloud .cloud-visual {
  min-height: 420px;
  border-color: var(--service-line-strong);
  border-radius: 23px;
  background:
    radial-gradient(280px circle at 78% 12%, rgba(var(--service-accent-rgb), 0.13), transparent 68%),
    linear-gradient(155deg, rgba(24, 30, 39, 0.97), rgba(10, 13, 18, 0.98));
  box-shadow: 0 34px 80px -44px rgba(0, 0, 0, 0.96), inset 0 1px rgba(255, 255, 255, 0.04);
}

/* The AI demo contains four complete messages and a typing state. Give that
   conversation its own vertical rhythm so the final response never escapes
   the browser frame. */
.service-ai .service-visual-ai {
  min-height: 480px;
}

.service-ai .ai-chat-card {
  inset: 80px 30px 28px;
  gap: 11px;
  padding: 22px 20px;
  overflow: hidden;
}

.service-ai .ai-msg,
.service-ai .ai-typing {
  flex: 0 0 auto;
}

.service-ai .ai-msg {
  padding: 10px 13px;
  line-height: 1.45;
}

.service-page .visual-top,
.service-page .visual-label,
.service-graphic .board-label {
  color: #8998a9;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.service-page .visual-status {
  color: #83d9b2;
}

.service-commerce .service-visual::after,
.service-seo .service-visual::after {
  position: absolute;
  right: 18px;
  bottom: 17px;
  z-index: 4;
  padding: 6px 9px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 8px;
  background: rgba(8, 10, 14, 0.78);
  color: #8090a1;
  font: 700 12px var(--disp);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.service-commerce .service-visual::after {
  content: "Temsili operasyon ekranı";
}

.service-seo .service-visual::after {
  content: "Temsili rapor görünümü";
}

.service-page .service-hero .hero-trust,
.service-graphic .hero-notes,
.service-cloud .hero-notes {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 48px;
  padding: 17px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.service-graphic .hero-notes,
.service-cloud .hero-notes {
  grid-template-columns: repeat(3, 1fr);
}

.service-page .service-hero .hero-trust span,
.service-graphic .hero-notes span,
.service-cloud .hero-notes span {
  min-height: 46px;
  padding: 0 18px;
  border-left: 1px solid rgba(255, 255, 255, 0.085);
  color: #7e8c9d;
  font-size: 12px;
  line-height: 1.45;
}

.service-page .service-hero .hero-trust span:first-child,
.service-graphic .hero-notes span:first-child,
.service-cloud .hero-notes span:first-child {
  padding-left: 0;
  border-left: 0;
}

.service-page .service-hero .hero-trust b {
  margin-bottom: 4px;
  color: #cfd6dd;
  font-size: 12px;
  letter-spacing: 0.02em;
}

.service-graphic .hero-notes span::before,
.service-cloud .hero-notes span::before {
  width: 5px;
  height: 5px;
  background: var(--service-accent-2);
}

.service-page section.blk {
  padding-top: clamp(72px, 8vw, 104px);
  padding-bottom: clamp(72px, 8vw, 104px);
}

.service-page section.blk + section.blk {
  border-top: 1px solid rgba(255, 255, 255, 0.065);
}

.service-page .sec-h,
.service-page .sec-head {
  max-width: none;
  margin-bottom: 40px;
}

.service-page .sec-h::before,
.service-page .sec-h::after {
  display: none;
}

.service-page .sec-h[data-kicker]::before {
  content: attr(data-kicker);
  display: block;
  position: static;
  width: auto;
  height: auto;
  margin-bottom: 13px;
  color: #b9c8d8;
  background: none;
  font: 700 12px var(--disp);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.service-page .sec-h h2,
.service-page .sec-head h2 {
  max-width: 18ch;
  margin: 0 0 12px;
  color: #edf0f2;
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.05em;
  text-wrap: balance;
}

.service-page .sec-h p,
.service-page .sec-head > p {
  max-width: 66ch;
  color: var(--service-copy);
  font-size: 15px;
  line-height: 1.73;
}

.service-graphic .sec-head,
.service-cloud .sec-head {
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 0.75fr);
  gap: clamp(40px, 7vw, 88px);
}

.service-page .grid,
.service-cloud .grid {
  gap: 13px;
}

.service-page .g-card,
.service-cloud .service {
  min-height: 290px;
  padding: 24px;
  border-color: rgba(255, 255, 255, 0.085);
  border-radius: 16px;
  background: linear-gradient(155deg, rgba(22, 27, 36, 0.95), rgba(10, 13, 18, 0.98));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.025);
}

.service-page .g-card:hover,
.service-cloud .service:hover {
  border-color: rgba(var(--service-accent-rgb), 0.36);
  box-shadow: 0 25px 48px -36px rgba(0, 0, 0, 0.96), inset 0 1px rgba(255, 255, 255, 0.035);
}

.service-page .g-card:hover .ic {
  transform: translateY(-2px);
}

.service-page .g-card .ic,
.service-cloud .service .ic {
  width: 46px;
  height: 46px;
  margin-bottom: 25px;
  border: 1px solid rgba(var(--service-accent-rgb), 0.24);
  border-radius: 12px;
  background: rgba(var(--service-accent-rgb), 0.075);
  color: var(--service-accent);
}

.service-page .g-card .ic svg,
.service-cloud .service .ic svg {
  stroke: currentColor;
}

.service-page .g-card h3,
.service-cloud .service h3 {
  margin-bottom: 10px;
  color: #e9edf0;
  font-size: 19px;
  line-height: 1.2;
}

.service-page .g-card p,
.service-cloud .service p {
  color: #9eacbb;
  font-size: 13.5px;
  line-height: 1.68;
}

.service-cloud .service small {
  color: var(--service-accent);
  font-size: 12px;
}

.service-graphic .services-grid {
  gap: 13px;
  align-items: start;
}

.service-graphic details.service-card {
  overflow: hidden;
  border-color: rgba(255, 255, 255, 0.085);
  border-radius: 16px;
  background: linear-gradient(155deg, rgba(22, 27, 36, 0.95), rgba(10, 13, 18, 0.98));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.025);
}

.service-graphic details.service-card:hover {
  border-color: rgba(var(--service-accent-rgb), 0.34);
}

.service-graphic details.service-card summary {
  padding: 24px;
}

.service-graphic .service-no > span:first-child {
  color: #8391a2;
  font-size: 12px;
  letter-spacing: 0.13em;
}

.service-graphic .service-icon {
  border-color: rgba(var(--service-accent-rgb), 0.24);
  background: rgba(var(--service-accent-rgb), 0.075);
  color: var(--service-accent);
}

.service-graphic details.service-card h3 {
  color: #e9edf0;
}

.service-graphic details.service-card .intro,
.service-graphic details.service-card .service-body {
  color: #9eacbb;
}

.service-graphic details.service-card .service-body {
  border-top-color: rgba(255, 255, 255, 0.075);
  background: rgba(255, 255, 255, 0.012);
}

.service-page .service-process {
  padding-top: clamp(72px, 8vw, 104px);
}

.service-page .process-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.service-page .process-step {
  min-height: 248px;
  padding: 27px 24px 24px;
  border: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 0;
  background: transparent;
}

.service-page .process-step:first-child {
  border-left: 0;
}

.service-page .process-step .num {
  color: var(--service-accent);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.service-page .process-step h3 {
  margin: 42px 0 11px;
  color: #e9edf0;
  font-size: 19px;
}

.service-page .process-step p {
  color: #94a3b3;
  font-size: 13px;
  line-height: 1.65;
}

.service-page .price-band {
  position: relative;
  overflow: hidden;
  padding: 34px;
  border-color: rgba(var(--service-accent-rgb), 0.22);
  border-radius: 17px;
  background:
    radial-gradient(360px circle at 100% 0%, rgba(var(--service-accent-rgb), 0.1), transparent 70%),
    linear-gradient(145deg, rgba(21, 27, 35, 0.97), rgba(10, 13, 18, 0.98));
  box-shadow: none;
}

.service-page .price-band::after {
  display: none;
}

.service-page .price-band .p-txt h3 {
  color: #edf0f2;
  font-size: 22px;
}

.service-page .price-band .p-txt p {
  color: #9eacbb;
}

.service-page .price-band .p-num {
  color: #eef1f3;
  font-size: 36px;
}

.service-page details.faq {
  margin-bottom: 9px;
  padding: 18px 20px;
  border-color: rgba(255, 255, 255, 0.085);
  border-radius: 12px;
  background: linear-gradient(150deg, rgba(20, 25, 33, 0.9), rgba(10, 13, 18, 0.95));
}

.service-page details.faq[open] {
  border-color: rgba(var(--service-accent-rgb), 0.25);
}

.service-page details.faq summary {
  min-height: 34px;
  align-items: center;
  color: #dce2e7;
  font-size: 14.5px;
}

.service-page details.faq summary::after {
  color: var(--service-accent);
}

.service-page details.faq div {
  max-width: 82ch;
  color: #9eacbb;
  line-height: 1.7;
}

.service-page .cta-final,
.service-graphic .cta,
.service-cloud .cta {
  padding: clamp(42px, 6vw, 62px) clamp(24px, 6vw, 66px);
  border-color: rgba(var(--service-accent-rgb), 0.2);
  border-radius: 20px;
  background:
    radial-gradient(480px circle at 50% -35%, rgba(var(--service-accent-rgb), 0.13), transparent 67%),
    linear-gradient(145deg, rgba(21, 27, 35, 0.97), rgba(10, 13, 18, 0.98));
  box-shadow: none;
}

.service-page .cta-final::before,
.service-graphic .cta::before,
.service-cloud .cta::before {
  display: none;
}

.service-page .cta-final h2,
.service-graphic .cta h2,
.service-cloud .cta h2 {
  color: #eef1f3;
  font-size: clamp(27px, 3.4vw, 38px);
  letter-spacing: -0.045em;
}

.service-page .cta-final p,
.service-graphic .cta p,
.service-cloud .cta p {
  color: #a8b6c5;
  line-height: 1.7;
}

.service-page .rel {
  padding-top: 38px;
  border-top-color: rgba(255, 255, 255, 0.08);
}

.service-page .rel h3 {
  color: #8f9eaf;
  font-size: 12px;
  font-weight: 700;
}

.service-page .rel a {
  padding: 18px 19px;
  border-color: rgba(255, 255, 255, 0.085);
  border-radius: 12px;
  background: linear-gradient(150deg, rgba(20, 25, 33, 0.88), rgba(10, 13, 18, 0.94));
  color: #d8dfe5;
  font-size: 13px;
}

.service-page .rel a:hover {
  border-color: rgba(var(--service-accent-rgb), 0.32);
  background: rgba(var(--service-accent-rgb), 0.035);
  transform: translateY(-1px);
}

.service-page .rel a span {
  color: var(--service-accent);
}

.service-page footer {
  margin-top: 20px;
  border-top-color: rgba(255, 255, 255, 0.08);
}

@media (max-width: 900px) {
  .service-page .service-hero-grid,
  .service-graphic .hero-grid,
  .service-cloud .hero-grid {
    grid-template-columns: 1fr;
  }

  .service-page .service-visual,
  .service-graphic .design-board,
  .service-cloud .cloud-visual {
    max-width: 650px;
  }

  .service-page .service-hero .hero-trust {
    grid-template-columns: repeat(2, 1fr);
  }

  .service-page .service-hero .hero-trust span:nth-child(3) {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.075);
    padding-top: 15px;
  }

  .service-page .service-hero .hero-trust span:nth-child(4) {
    border-top: 1px solid rgba(255, 255, 255, 0.075);
    padding-top: 15px;
  }

  .service-graphic .sec-head,
  .service-cloud .sec-head {
    grid-template-columns: 1fr;
    gap: 17px;
  }

  .service-page .process-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .service-page .process-step:nth-child(3) {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.085);
  }

  .service-page .process-step:nth-child(4) {
    border-top: 1px solid rgba(255, 255, 255, 0.085);
  }
}

@media (max-width: 620px) {
  .service-page .service-hero,
  .service-graphic .hero,
  .service-cloud .hero {
    padding-top: 54px;
    padding-bottom: 55px;
  }

  .service-page .service-hero h1,
  .service-graphic .hero h1,
  .service-cloud .hero h1 {
    font-size: clamp(40px, 12vw, 54px);
  }

  .service-page .hero-actions .btn,
  .service-page .actions .btn,
  .service-page .cta-acts .btn,
  .service-page .cta-actions .btn {
    width: 100%;
  }

  .service-page .service-visual,
  .service-graphic .design-board,
  .service-cloud .cloud-visual {
    min-height: 330px;
    border-radius: 18px;
  }

  .service-ai .service-visual-ai {
    min-height: 500px;
  }

  .service-ai .ai-chat-card {
    inset: 72px 14px 18px;
    gap: 10px;
    padding: 18px 14px;
  }

  .service-ai .ai-msg {
    max-width: 88%;
    padding: 9px 11px;
    font-size: 11.5px;
  }

  .service-page .service-hero .hero-trust,
  .service-graphic .hero-notes,
  .service-cloud .hero-notes {
    grid-template-columns: 1fr;
  }

  .service-page .service-hero .hero-trust span,
  .service-graphic .hero-notes span,
  .service-cloud .hero-notes span,
  .service-page .service-hero .hero-trust span:nth-child(3),
  .service-page .service-hero .hero-trust span:nth-child(4) {
    min-height: 0;
    padding: 10px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.075);
    border-left: 0;
  }

  .service-page .service-hero .hero-trust span:first-child,
  .service-graphic .hero-notes span:first-child,
  .service-cloud .hero-notes span:first-child {
    border-top: 0;
  }

  .service-page section.blk {
    padding-top: 62px;
    padding-bottom: 62px;
  }

  .service-page .grid,
  .service-cloud .grid {
    grid-template-columns: 1fr;
  }

  .service-page .g-card,
  .service-cloud .service {
    min-height: 270px;
  }

  .service-page .process-grid {
    grid-template-columns: 1fr;
  }

  .service-page .process-step,
  .service-page .process-step:nth-child(3),
  .service-page .process-step:nth-child(4) {
    min-height: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.085);
    border-left: 0;
  }

  .service-page .process-step:first-child {
    border-top: 0;
  }

  .service-page .process-step h3 {
    margin-top: 24px;
  }

  .service-page .price-band {
    padding: 27px 21px;
  }

  .service-page .cta-final,
  .service-graphic .cta,
  .service-cloud .cta {
    padding: 36px 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .service-page .g-card,
  .service-page .rel a,
  .service-page .btn {
    transition: none;
  }
}

/* Ortak erişilebilirlik katmanı: klavye odağı ve hareket tercihleri. */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid #4dd9c9;
  outline-offset:3px;
}

.skip-link{
  background:#4dd9c9;
  border-radius:0 0 10px 0;
  color:#071017;
  font-weight:700;
  left:0;
  padding:.75rem 1rem;
  position:fixed;
  top:0;
  transform:translateY(-120%);
  transition:transform .16s ease-out;
  z-index:10000;
}
.skip-link:focus-visible{transform:translateY(0)}

.nav-links a[aria-current="page"],.nav-cta a[aria-current="page"]{
  color:#fff;
  text-decoration-color:#4dd9c9;
  text-decoration-thickness:2px;
  text-underline-offset:.45em;
}

/* WCAG AA: beyaz metinle 4.5:1 üzerinde kontrast. */
.btn-primary{background:#6b4be3}
.btn-primary:hover{background:#7558e8}
.ows-cta .c-q,.mobile-cta .mc-quote{background:#5637ce}
.demo.restoran .d-btn{color:#1a0805}
.mm-p{color:#c7cfdb;font-size:11px}
.mm-btn{background:#6b4be3;font-size:11px}
.phone .mm-btn{font-size:10px}

/* Dokunmatik kontrollerde en az 44x44 px hedef alanı. */
:where(.menu-btn,.rev-nav,.tab,.sc-tab,.ai-teaser-close,.ai-quick button){
  align-items:center;
  display:inline-flex;
  justify-content:center;
  min-height:44px;
  min-width:44px;
}

.premium-footer a,.blog-footer-inner a{
  align-items:center;
  display:inline-flex;
  min-height:44px;
  min-width:44px;
}

.premium-footer-bottom{font-size:13px}

@media (max-width:900px){
  .nav-links a{
    align-items:center;
    display:flex;
    min-height:44px;
  }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
}

.service-page .rel {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.service-page .rel h3 { grid-column: 1 / -1; }
.service-page .rel a {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  min-height: 118px;
  margin: 0;
  padding: 18px 18px 16px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
}
.service-page .rel a b {
  display: block;
  font: 500 17px/1.25 Outfit, "Space Grotesk", sans-serif;
  letter-spacing: -.02em;
}
.service-page .rel a em {
  display: block;
  margin-top: 6px;
  color: #8b95a6;
  font: 400 13px/1.45 Inter, sans-serif;
  font-style: normal;
}
.service-page .rel a span { margin-top: 16px; }
@media (max-width: 800px) {
  .service-page .rel { grid-template-columns: 1fr; }
}