/* eBattery · ultra.css — v5 "Ultra" katmanı. Mevcut dosyaları değiştirmez; sayfalardaki iki satırı silince tamamen geri alınır. */
:root{--ub-grad:linear-gradient(110deg,#2f6bff,#8359e9 55%,#28b68a)}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,.ub-num,.eyebrow{font-family:"Space Grotesk",Inter,system-ui,sans-serif}
::selection{background:#2f6bff;color:#fff}
:focus-visible{outline:2px solid #2f6bff;outline-offset:3px;border-radius:6px}
::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:#2f6bff55;border-radius:9px;border:2px solid transparent;background-clip:content-box}
@view-transition{navigation:auto}
::view-transition-old(root){animation:ub-out .28s ease both}::view-transition-new(root){animation:ub-in .5s cubic-bezier(.22,.8,.25,1) both}
@keyframes ub-out{to{opacity:0;transform:translateY(-8px)}}@keyframes ub-in{from{opacity:0;transform:translateY(14px)}}

/* film greni: düz gradyanlara doku katar */
body::after{content:"";position:fixed;inset:0;z-index:9990;pointer-events:none;opacity:.045;mix-blend-mode:multiply;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
html[data-theme=dark] body::after{mix-blend-mode:screen;opacity:.05}

/* açılış perdesi */
.ub-loader{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;background:#f6f9ff;transition:clip-path .9s cubic-bezier(.76,0,.24,1),opacity .3s .7s;clip-path:inset(0 0 0 0)}
html[data-theme=dark] .ub-loader{background:#070d19}
.ub-loader.out{clip-path:inset(0 0 100% 0);opacity:0;pointer-events:none}
.ub-bat{width:112px;height:56px;border:4px solid #2f6bff;border-radius:14px;position:relative;padding:5px}
.ub-bat::after{content:"";position:absolute;right:-12px;top:16px;width:7px;height:20px;border-radius:0 5px 5px 0;background:#2f6bff}
.ub-bat i{display:block;height:100%;width:0;border-radius:6px;background:var(--ub-grad);animation:ub-fill 1s cubic-bezier(.6,0,.2,1) forwards}
@keyframes ub-fill{to{width:100%}}
.ub-loader small{display:block;margin-top:22px;text-align:center;letter-spacing:.28em;font-weight:700;font-size:11px;color:#718198;font-family:"Space Grotesk",sans-serif}

/* imleç halkası */
.ub-ring,.ub-dot{position:fixed;left:0;top:0;z-index:99998;pointer-events:none;border-radius:50%;opacity:0;transition:opacity .3s,width .3s,height .3s,background .3s,border-color .3s}
.ub-ring{width:38px;height:38px;margin:-19px 0 0 -19px;border:1.5px solid #2f6bff88}
.ub-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:#2f6bff}
.ub-cur-on .ub-ring,.ub-cur-on .ub-dot{opacity:1}
.ub-cur-link .ub-ring{width:64px;height:64px;margin:-32px 0 0 -32px;background:#2f6bff1a;border-color:#2f6bff}
@media (hover:none),(pointer:coarse){.ub-ring,.ub-dot{display:none}}

/* şarj simülatörü */
.ub-sim{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(24px,4vw,56px);border-radius:36px;
 background:linear-gradient(135deg,#eef3ff,#f5f0ff 55%,#eafaf4);border:1px solid #dfe8fb;overflow:hidden}
html[data-theme=dark] .ub-sim{background:linear-gradient(135deg,#0e1a33,#17143a 55%,#0c2630);border-color:#26354f}
.ub-sim h3{font:700 clamp(28px,3.6vw,46px)/1.05 "Space Grotesk",sans-serif;letter-spacing:-.03em;margin:.3em 0 .4em}
.ub-sim p.lead{color:var(--muted);margin:0 0 22px;max-width:46ch}
.ub-ctl{display:grid;gap:16px}
.ub-ctl label{display:grid;grid-template-columns:1fr auto;gap:8px 12px;align-items:center;font-size:13px;font-weight:600;color:var(--muted)}
.ub-ctl label input{grid-column:1/-1}
.ub-ctl label b{color:var(--ink);font-family:"Space Grotesk",sans-serif;font-size:15px}
.ub-ctl input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:9px;background:linear-gradient(90deg,#2f6bff var(--v,50%),#2f6bff22 0);outline-offset:6px}
.ub-ctl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:5px solid #2f6bff;box-shadow:0 4px 14px #2f6bff55;cursor:grab;transition:transform .2s}
.ub-ctl input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:5px solid #2f6bff;cursor:grab}
.ub-ctl input[type=range]:active::-webkit-slider-thumb{transform:scale(1.2);cursor:grabbing}
.ub-chips{display:flex;gap:8px;flex-wrap:wrap}
.ub-chips button{font:600 13px Inter,sans-serif;padding:9px 14px;border-radius:99px;border:1px solid #cfdcf7;background:#ffffffaa;color:var(--ink);cursor:pointer;transition:all .25s}
html[data-theme=dark] .ub-chips button{background:#ffffff0d;border-color:#33466a}
.ub-chips button[aria-pressed=true]{background:#2f6bff;border-color:#2f6bff;color:#fff;box-shadow:0 8px 22px #2f6bff55;transform:translateY(-2px)}
.ub-stage{display:grid;justify-items:center;gap:22px}
.ub-big{position:relative;width:min(100%,340px);aspect-ratio:1.9;border:5px solid #2f6bff;border-radius:30px;padding:10px;background:#ffffff66}
html[data-theme=dark] .ub-big{background:#ffffff08}
.ub-big::after{content:"";position:absolute;right:-18px;top:34%;width:12px;height:32%;border-radius:0 8px 8px 0;background:#2f6bff}
.ub-lvl{position:relative;height:100%;border-radius:18px;overflow:hidden;background:#2f6bff14}
.ub-fill{position:absolute;inset:0 auto 0 0;width:var(--to,80%);border-radius:18px;background:var(--ub-grad);transition:width .9s cubic-bezier(.22,.8,.25,1);overflow:hidden}
.ub-fill::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,#ffffff00 0 14px,#ffffff2e 14px 28px);animation:ub-flow 1.2s linear infinite}
.ub-start{position:absolute;inset:0 auto 0 0;width:var(--from,10%);background:#0b1a3a55;border-right:2px dashed #fff;transition:width .6s}
@keyframes ub-flow{to{background-position:56px 0}}
.ub-pct{position:absolute;inset:0;display:grid;place-items:center;font:700 clamp(30px,5vw,48px) "Space Grotesk",sans-serif;color:#fff;text-shadow:0 2px 18px #0b1a3a88;letter-spacing:-.03em}
.ub-out{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%}
.ub-out div{padding:14px 10px;border-radius:20px;background:#ffffffb3;text-align:center;border:1px solid #e3eaf4}
html[data-theme=dark] .ub-out div{background:#ffffff0d;border-color:#26354f}
.ub-out b{display:block;font:700 clamp(20px,2.4vw,28px) "Space Grotesk",sans-serif;letter-spacing:-.03em}
.ub-out small{color:var(--muted);font-size:12px}
.ub-note{font-size:12px;color:var(--muted);max-width:52ch}
@media (max-width:900px){.ub-sim{grid-template-columns:1fr;border-radius:28px}}

/* AI sohbet demosu (bento-ai kartı) */
.ub-chat{display:grid;gap:8px;margin-top:14px;font-size:12.5px;line-height:1.4}
.ub-chat div{max-width:92%;padding:9px 13px;border-radius:16px;animation:ub-pop .45s cubic-bezier(.34,1.56,.64,1) both}
.ub-chat .me{justify-self:end;background:#2f6bff;color:#fff;border-bottom-right-radius:5px}
.ub-chat .ai{background:#ffffffcc;color:#11243b;border-bottom-left-radius:5px;box-shadow:0 6px 18px #2f6bff1a}
.ub-chat .dots{display:inline-flex;gap:4px}.ub-chat .dots i{width:6px;height:6px;border-radius:50%;background:#8359e9;animation:ub-bounce 1s infinite}
.ub-chat .dots i:nth-child(2){animation-delay:.15s}.ub-chat .dots i:nth-child(3){animation-delay:.3s}
@keyframes ub-pop{from{opacity:0;transform:translateY(8px) scale(.9)}}@keyframes ub-bounce{50%{transform:translateY(-5px);opacity:.4}}

/* hero canlı şarj çipi */
.ub-live{position:absolute;left:-2%;top:52%;z-index:6;display:flex;align-items:center;gap:12px;padding:12px 18px 12px 12px;border-radius:22px;background:#ffffffe6;backdrop-filter:blur(14px);box-shadow:0 18px 50px #2f6bff2e;border:1px solid #ffffffaa;animation:ub-bob 6s ease-in-out infinite}
html[data-theme=dark] .ub-live{background:#111c33e6;border-color:#26354f}
.ub-ringp{--p:40;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#28b68a calc(var(--p)*1%),#2f6bff1f 0);position:relative;font:700 12px "Space Grotesk",sans-serif}
.ub-ringp::before{content:"";position:absolute;inset:5px;border-radius:50%;background:#fff}
html[data-theme=dark] .ub-ringp::before{background:#111c33}
.ub-ringp span{position:relative}
.ub-live b{display:block;font-size:13px}.ub-live small{color:var(--muted);font-size:11.5px}
@keyframes ub-bob{50%{transform:translateY(-10px)}}
@media (max-width:900px){.ub-live{display:none}}

/* bölüm rayı */
.ub-rail{position:fixed;right:18px;top:50%;translate:0 -50%;z-index:60;display:grid;gap:12px}
.ub-rail a{position:relative;width:10px;height:10px;border-radius:50%;background:#2f6bff33;transition:all .3s}
.ub-rail a::after{content:attr(data-l);position:absolute;right:20px;top:50%;translate:8px -50%;white-space:nowrap;font:600 12px Inter,sans-serif;padding:5px 10px;border-radius:99px;background:#11243b;color:#fff;opacity:0;pointer-events:none;transition:all .25s}
.ub-rail a:hover::after{opacity:1;translate:0 -50%}
.ub-rail a.on{background:#2f6bff;scale:1.5;box-shadow:0 0 0 5px #2f6bff22}
@media (max-width:1100px){.ub-rail{display:none}}

/* dev altlık yazısı */
.ub-mega{font:700 clamp(64px,19vw,300px)/.8 "Space Grotesk",sans-serif;letter-spacing:-.06em;text-align:center;padding:40px 0 0;overflow:hidden;user-select:none;
 background:linear-gradient(180deg,#2f6bff55,transparent 85%);-webkit-background-clip:text;background-clip:text;color:transparent;
 background-size:100% 100%}
.ub-mega b{background:var(--ub-grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* küçük dokunuşlar */
.eyebrow::before{content:"";display:inline-block;width:8px;height:8px;margin-right:9px;border-radius:50%;background:#28b68a;box-shadow:0 0 0 0 #28b68a88;animation:ub-ping 2.4s infinite;vertical-align:1px}
@keyframes ub-ping{70%,100%{box-shadow:0 0 0 9px #28b68a00}}
.button{position:relative;overflow:hidden}
.button::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#ffffff55 50%,transparent 70%);translate:-120% 0;transition:translate .7s}
.button:hover::after{translate:120% 0}
.home-hero h1 span{background-size:200% auto;animation:ub-shine 6s linear infinite}
@keyframes ub-shine{to{background-position:200% center}}
@supports (animation-timeline:view()){
 .bento-screen,.gallery-item .screen-frame{animation:ub-par linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
 @keyframes ub-par{from{translate:0 36px}to{translate:0 -36px}}
 .ub-mega{animation:ub-mg linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
 .ub-sim{animation:ub-mg linear both;animation-timeline:view();animation-range:entry 0% entry 70%}
 @keyframes ub-mg{from{opacity:0;translate:0 60px}to{opacity:1;translate:0}}
}
@media (prefers-reduced-motion:reduce){.ub-row,.ub-loader,.ub-live,.eyebrow::before,.ub-fill::after{animation:none!important}.ub-loader{display:none}::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}html{scroll-behavior:auto}}
html[data-theme=dark] .ub-chips button[aria-pressed=true]{background:#2f6bff;border-color:#2f6bff;color:#fff}
@media (max-width:560px){.ub-out{gap:6px}.ub-out div{padding:12px 4px;border-radius:16px}.ub-out b{font-size:17px}.ub-big{width:88%}.ub-chips button{padding:8px 11px;font-size:12px}}
