/* TEMA 2 · KUANTUM AĞ — gece mavisi, mor-camgöbeği geçiş, cam paneller, canlı ağ */
:root{--bg:#060818;--c1:#38bdf8;--c2:#a78bfa;--c3:#f472b6;--t:#cbd2e6;--m:#8a93b2;--cam:rgba(255,255,255,.045);--kenar:rgba(255,255,255,.09);--grad:linear-gradient(100deg,var(--c1),var(--c2) 55%,var(--c3))}
body{background:var(--bg);color:var(--t);font:16px/1.75 Inter,system-ui,sans-serif}
h1,h2,h3,h4,.btn,.logo-ad,.etiket,.kart-no,.adim-no,.deger-harf{font-family:'Space Grotesk',sans-serif}
::selection{background:var(--c2);color:#060818}
#ag-tuval{position:fixed;inset:0;z-index:0;pointer-events:none}
.isilti{position:fixed;width:700px;height:700px;border-radius:50%;filter:blur(120px);opacity:.22;z-index:0;pointer-events:none}
.isilti.a{background:var(--c2);top:-250px;right:-200px}.isilti.b{background:var(--c1);bottom:-300px;left:-250px}

.ust{padding-top:14px}
.ust-ic{background:rgba(10,14,35,.62);backdrop-filter:blur(16px);border:1px solid var(--kenar);border-radius:18px;max-width:1160px;padding:0 14px 0 18px}
.logo img{height:40px;border-radius:8px;box-shadow:0 0 22px rgba(238,62,54,.35)}
.logo-ad{font-weight:700;font-size:19px;color:#fff}
.menu{font-size:14px}
.menu a{color:var(--m)}
.menu a:hover,.menu a.aktif{color:#fff}
.menu a.aktif:not(.btn){background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:1000px){.ust{padding:10px 10px 0}.menu{background:rgba(10,14,35,.96);border:1px solid var(--kenar);border-radius:18px;margin-top:8px}}

.btn{padding:12px 22px;border-radius:12px;font-weight:600;font-size:14px;color:#fff;border:1px solid var(--kenar);background:var(--cam)}
.btn:hover{border-color:var(--c1);box-shadow:0 0 30px rgba(56,189,248,.25)}
.btn-dolu{background:var(--grad);color:#060818;border:0}
.btn-dolu:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(167,139,250,.45)}

/* Hero */
.hero{min-height:calc(100vh - 84px);display:flex;align-items:center}
.hero-ic{display:grid;grid-template-columns:1.15fr 1fr;gap:40px;align-items:center;padding:50px 20px 60px}
.rozet{display:inline-flex;gap:9px;align-items:center;padding:7px 14px;border-radius:99px;border:1px solid var(--kenar);background:var(--cam);font-size:13px;margin-bottom:24px}
.rozet b{width:8px;height:8px;border-radius:50%;background:#34d399;box-shadow:0 0 12px #34d399}
.hero h1{font-size:clamp(38px,5.6vw,74px);line-height:1.04;color:#fff;letter-spacing:-2px;font-weight:700}
.hero h1 em,.sayfa-baslik h1{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{font-size:19px;margin:24px 0 36px;max-width:580px}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.orb{position:relative;aspect-ratio:1;max-width:480px;width:100%;margin:auto}
.orb .halka{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(167,139,250,.35);animation:don 18s linear infinite}
.orb .halka:nth-child(2){inset:9%;border-color:rgba(56,189,248,.35);animation-duration:12s;animation-direction:reverse}
.orb .halka:nth-child(3){inset:18%;border-color:rgba(244,114,182,.35);animation-duration:22s}
.orb .halka::after{content:"";position:absolute;top:-5px;left:50%;width:10px;height:10px;border-radius:50%;background:var(--c1);box-shadow:0 0 18px var(--c1)}
.orb .halka:nth-child(2)::after{background:var(--c2);box-shadow:0 0 18px var(--c2)}.orb .halka:nth-child(3)::after{background:var(--c3);box-shadow:0 0 18px var(--c3)}
@keyframes don{to{transform:rotate(360deg)}}
.orb .cekirdek{position:absolute;inset:32%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,var(--c1) 25%,var(--c2) 60%,#1e1b4b);box-shadow:0 0 90px rgba(167,139,250,.6),inset -10px -20px 40px rgba(0,0,0,.4);animation:nefes 4s ease-in-out infinite}
@keyframes nefes{50%{transform:scale(1.05);box-shadow:0 0 130px rgba(56,189,248,.7)}}
.orb .orb-logo{position:absolute;inset:39%;width:22%;height:22%;object-fit:contain;filter:drop-shadow(0 6px 20px rgba(0,0,0,.5));animation:nefes2 4s ease-in-out infinite}
@keyframes nefes2{50%{transform:scale(1.05)}}
.orb .yazi{position:absolute;font:600 12px 'Space Grotesk';padding:7px 12px;border-radius:10px;background:rgba(10,14,35,.75);border:1px solid var(--kenar);backdrop-filter:blur(8px);color:#fff;white-space:nowrap;text-decoration:none}
.orb .yazi:hover{border-color:var(--c1)}

/* Bölümler */
.etiket{font-weight:600;font-size:13px;letter-spacing:3px;text-transform:uppercase;margin-bottom:14px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block}
.baslik{font-size:clamp(30px,3.8vw,50px);line-height:1.1;color:#fff;letter-spacing:-1px;font-weight:700}
.giris{color:#e6e9f5}
.deger-serit li{padding:8px 16px;border-radius:99px;background:var(--cam);border:1px solid var(--kenar);font:600 14px 'Space Grotesk';color:#fff}

.kart,.deger,.yan-kutu,.cta-bant,.form-kutu,.vurgu-kutu,.bilgi,.adim{background:var(--cam);border:1px solid var(--kenar);border-radius:22px;backdrop-filter:blur(14px)}
.kart{padding:32px;overflow:hidden}
.kart::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:var(--grad);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:.35s;pointer-events:none}
.kart:hover{transform:translateY(-6px)}.kart:hover::before{opacity:1}
.kart h3{color:#fff;font-size:21px;line-height:1.3}
.kart-oz{color:var(--c1);font-size:14px}
.kart p{font-size:15px}
.kart-ikon{border-radius:14px;background:linear-gradient(135deg,rgba(56,189,248,.2),rgba(167,139,250,.2));color:#fff}
.kart-no{font-weight:700;font-size:14px;color:var(--m)}
.kart-link{color:var(--c1)}
.maddeler{font-size:14px}
.maddeler li::before{content:"";flex:none;width:14px;height:14px;margin-top:6px;border-radius:5px;background:var(--grad)}

.deger{padding:30px;text-align:center;transition:.3s}
.deger:hover{transform:translateY(-6px)}
.deger-harf{display:block;font-weight:700;font-size:64px;line-height:1;margin-bottom:12px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.deger-no{display:none}
.deger h3{color:#fff;font-size:20px;margin-bottom:8px}
.deger p{font-size:14.5px}
.surec{gap:30px}
.adim{text-align:center;padding:30px 22px;background:none;border:0;backdrop-filter:none}
.adim-no{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 18px;border-radius:50%;background:var(--bg);border:2px solid var(--c2);font-weight:700;font-size:18px;color:#fff;box-shadow:0 0 30px rgba(167,139,250,.4)}
.adim h3{color:#fff;font-size:19px;margin-bottom:6px}
.adim p{font-size:14.5px}

.vurgu-kutu{padding:36px}
.vurgu-kutu span{display:block;font:700 34px/1.3 'Space Grotesk';color:#fff}
.vurgu-kutu em{font-style:normal;color:var(--c1)}
.vurgu-kutu p{margin-top:16px;color:var(--m)}
.yan-kutu{padding:28px}
.yan-kutu h3{color:#fff;font-size:19px;margin-bottom:14px}
.yan-kutu.vurgu{background:linear-gradient(135deg,rgba(56,189,248,.12),rgba(167,139,250,.12))}
.cta-bant{padding:50px}

.sayfa-baslik{padding:70px 0 40px}
.sayfa-baslik h1{font-size:clamp(36px,5vw,64px);line-height:1.05;letter-spacing:-1.5px;display:table}
.yol{color:var(--m)}
.yol a:hover,.yol b{color:#fff}

.bilgi{color:#fff;border-radius:16px}
.bilgi:hover{border-color:var(--c1)}
.bilgi .ikon{color:var(--c1)}
.harita{border-radius:18px;overflow:hidden;border:1px solid var(--kenar)}
.harita iframe{filter:invert(.92) hue-rotate(200deg) saturate(.7)}
.form-kutu{padding:44px}
.alan input,.alan select,.alan textarea{background:rgba(255,255,255,.05);border:1px solid var(--kenar);border-radius:12px;color:#fff}
.alan select option{background:#0d1230}
.alan input:focus,.alan select:focus,.alan textarea:focus{border-color:var(--c1);box-shadow:0 0 0 3px rgba(56,189,248,.18)}
.basari{border-radius:12px}

.alt{border-top:1px solid var(--kenar);background:rgba(6,8,24,.7);backdrop-filter:blur(10px)}
.alt .logo-ad{color:#fff}
.alt-menu h4{color:#fff}
.alt-menu a,.alt-marka p{color:var(--m)}
.alt-menu a:hover{color:#fff}
.alt-cizgi{border-top:1px solid var(--kenar);color:var(--m)}

@media (max-width:1000px){.hero-ic{grid-template-columns:1fr}.orb{max-width:340px}.cta-bant,.form-kutu{padding:28px}}
@media (max-width:600px){.orb .yazi{display:none}}