/* ================= Crantum ================= */
:root{
  /* Buton rengi (sadece butonlarda) */
  --btn:#3034FF;
  --btn-h:#2125E6;
  /* Diğer vurgular nötr: eski turkuaz değişkenleri artık siyah/gri tonda */
  --teal:#0E1116;
  --teal-d:#2B313B;
  --teal-50:#ECEEF2;
  --ink:#0E1116;
  --ink-2:#1F242C;
  --text:#3A414C;
  --muted:#6B7380;
  --line:#E6E8EC;
  --soft:#F5F5F3;
  --soft-2:#ECECE8;
  --r-sm:10px;
  --r:16px;
  --r-lg:22px;
  --sh:0 1px 2px rgba(14,17,22,.05),0 8px 24px -10px rgba(14,17,22,.12);
  --sh-lg:0 24px 48px -18px rgba(14,17,22,.25);
  --font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:var(--font);color:var(--text);background:#fff;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4{color:var(--ink);font-weight:500;letter-spacing:-.03em;line-height:1.15}
svg{flex:none}
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* ---------- small parts ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border:1px solid transparent;border-radius:8px;font-size:15px;font-weight:600;letter-spacing:-.005em;white-space:nowrap;transition:background .2s,border-color .2s,color .2s,box-shadow .2s}
.btn--lg{height:52px;padding:0 26px;font-size:16px}
.btn--dark,.btn--primary{background:var(--btn);border-color:#4A4EFF;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 1px 2px rgba(16,24,40,.14),0 4px 12px -4px rgba(48,52,255,.45)}
.btn--dark:hover,.btn--primary:hover{background:var(--btn-h);border-color:#3A3EFF;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 1px 2px rgba(16,24,40,.14),0 8px 18px -6px rgba(48,52,255,.55)}
.btn--dark:active,.btn--primary:active{background:#1B1FCC}
.btn:focus-visible{outline:2px solid var(--btn);outline-offset:2px}
.btn--outline{border:1px solid #D5D9DF;background:#fff;color:var(--ink)}
.btn--outline:hover{border-color:var(--ink)}
.btn--block{width:100%;height:50px}
.btn .arr{transition:transform .2s}
.btn:hover .arr{transform:translateX(3px)}
.arr{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--muted);margin-bottom:16px}
.eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--teal)}
.up{color:#14804A}

/* ---------- topbar ---------- */
.topbar{position:relative;overflow:hidden;background:#000;color:#fff;font-size:15px;font-weight:500;isolation:isolate}
.topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;height:52px}
.topbar__msg{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .2s}
.topbar__msg:hover{opacity:.85}
.topbar__gift{display:inline-block}
@keyframes wiggle{0%,80%,100%{transform:rotate(0)}85%{transform:rotate(-14deg)}90%{transform:rotate(12deg)}95%{transform:rotate(-6deg)}}
.topbar__right{display:flex;align-items:center;gap:14px}
.topbar__phone{font-weight:600;letter-spacing:.01em}
.topbar__sep{width:1px;height:16px;background:rgba(255,255,255,.25)}
.topbar__right a:hover{opacity:.75}
.topbar__call{display:flex;align-items:center;gap:6px;white-space:nowrap}
.topbar__msg{min-width:0}
.topbar__call svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
@keyframes ring{0%,88%,100%{transform:rotate(0)}91%{transform:rotate(-15deg)}94%{transform:rotate(15deg)}97%{transform:rotate(-8deg)}}

/* nav buttons (kutu tipi) */
.btn--box{border-radius:8px;height:46px;padding:0 18px;font-weight:600}
.btn--ghostbox{border:1px solid var(--line);background:#fff;color:var(--ink)}
.btn--ghostbox:hover{border-color:#cfd4da;background:var(--soft)}
.nav__pill{position:relative;overflow:hidden;display:inline-flex;align-items:center;height:42px;padding:0 16px;margin-left:12px;border-radius:8px;background:#EEF0FF;border:1px solid #DADDFF;color:var(--btn);font-size:15px;font-weight:600;transition:background .2s,border-color .2s}
.nav__pill:hover{background:#E2E5FF;border-color:#C7CBFF}
.nav__pill::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.85),transparent);transform:skewX(-20deg);display:none}
@keyframes shine{0%,60%{left:-60%}100%{left:130%}}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .2s}
.nav.is-scrolled{border-color:var(--line)}
.nav__inner{display:flex;align-items:center;height:84px;gap:52px}
.nav__logo img{height:24px;width:auto}
.nav__menu{display:flex;align-items:center;gap:4px;flex:1}
.nav__link{position:relative;display:inline-flex;align-items:center;gap:4px;height:40px;padding:0 14px;font-size:16px;font-weight:500;color:var(--ink);transition:color .2s}
.nav__link::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:1.5px;background:var(--ink);transform:scaleX(0);transform-origin:right;transition:transform .3s}
.nav__link:hover::after{transform:scaleX(1);transform-origin:left}
.dd__btn::after{display:none}
.chev{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;transition:transform .2s}
.nav__actions{display:flex;align-items:center;gap:10px}
.nav__toggle{display:none;width:40px;height:40px;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.nav__toggle span{width:20px;height:2px;border-radius:2px;background:var(--ink);transition:transform .25s}
.nav.open .nav__toggle span:first-child{transform:translateY(3.5px) rotate(45deg)}
.nav.open .nav__toggle span:last-child{transform:translateY(-3.5px) rotate(-45deg)}

/* ---------- mega menu ---------- */
.dd{position:static;align-self:stretch;display:flex;align-items:center}
.nav__menu{align-self:stretch}
.dd.open .chev{transform:rotate(180deg)}
/* Açılış: yumuşak iniş + içerik sırayla gelir */
.mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:0 30px 50px -30px rgba(14,17,22,.28);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .22s ease,transform .3s cubic-bezier(.2,.7,.2,1),visibility 0s .3s}
.dd.open .mega{opacity:1;visibility:visible;transform:none;transition:opacity .3s ease,transform .45s cubic-bezier(.2,.7,.2,1),visibility 0s}
.mega__cats,.mega__link,.mega__feat{opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s}
.dd.open .mega__cats,.dd.open .mega__link,.dd.open .mega__feat{opacity:1;transform:none;transition:opacity .5s cubic-bezier(.2,.7,.2,1),transform .5s cubic-bezier(.2,.7,.2,1)}
.dd.open .mega__cats{transition-delay:.06s}
.dd.open .mega__link{transition-delay:calc(.12s + var(--i,0) * .035s)}
.dd.open .mega__feat{transition-delay:.22s}
@keyframes linkIn{from{opacity:0;transform:translateY(8px)}}

.mega__box{display:grid;grid-template-columns:256px minmax(0,1fr);padding:36px 0 40px}

/* sol: kategoriler (ikon + isim + ok) */
.mega__cats{display:flex;flex-direction:column;gap:8px;padding-right:24px}
.mega__cat{display:flex;align-items:center;gap:10px;width:100%;padding:14px 12px;border-radius:8px;text-align:left;color:var(--ink);transition:background .2s}
.mega__cico{display:grid;place-items:center;flex:none;width:20px;height:20px;color:var(--ink)}
.mega__cico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.mega__ctxt b{font-size:16px;font-weight:500;letter-spacing:-.01em}
.mega__cat>svg{flex:none;width:16px;height:16px;margin-left:auto;fill:none;stroke:#6B7280;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mega__cat:hover,.mega__cat.on{background:#F5F6F7}

/* orta: iki sütun başlık + açıklama */
.mega__panels{position:relative;min-width:0}
.mega__panel{display:none;grid-template-columns:minmax(0,1fr) 300px;height:100%}
.mega__panel.on{display:grid}
.mega__panel.on .mega__link{animation:linkIn .4s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0) * .03s)}
.mega__main{min-width:0;padding:0 36px;border-left:1px solid var(--line);border-right:1px solid var(--line)}
.mega__head{display:none}
.mega__links{display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:30px 36px;padding-top:14px}
.mega__link{display:block}
.mega__ltxt b{display:block;font-size:15px;font-weight:500;letter-spacing:-.01em;color:var(--ink);transition:color .2s}
.mega__ltxt small{display:block;margin-top:5px;font-size:13px;line-height:1.45;color:#4B5563}
.mega__link:hover b{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

/* sağ: görsel + başlık + açıklama + devamını gör */
.mega__feat{display:flex;flex-direction:column;padding:12px 0 0 36px}
.mega__fimg{display:block;aspect-ratio:264/214;overflow:hidden;border-radius:8px;background:var(--soft)}
.mega__fimg img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.mega__feat:hover .mega__fimg img{transform:scale(1.04)}
.mega__feat b{margin-top:22px;font-size:17px;font-weight:500;line-height:1.4;letter-spacing:-.01em;color:var(--ink)}
.mega__feat small{margin-top:12px;font-size:14px;line-height:1.5;color:#4B5563}
.mega__fmore{display:inline-flex;align-items:center;gap:2px;margin-top:18px;font-size:15px;font-weight:600;color:var(--ink)}
.mega__fmore svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.mega__feat:hover .mega__fmore svg{transform:translateX(3px)}
.btn--sm{height:40px;padding:0 16px;font-size:14px}

/* ---------- hero ---------- */
.hero{padding:45px 0 80px}
.hero__grid{display:grid;grid-template-columns:1fr 1.02fr;gap:64px;align-items:center}
.hero h1{font-size:clamp(40px,4.6vw,60px);letter-spacing:-.035em;line-height:1.05;text-wrap:balance}
.hero__sub{margin-top:24px;max-width:500px;font-size:18px;color:var(--muted)}
.hero__btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.hero__trust{display:flex;align-items:center;gap:14px;margin-top:44px;font-size:14px;color:var(--muted)}
.avatars{display:flex}
.avatars img{width:40px;height:40px;border-radius:50%;border:2px solid #fff;margin-left:-10px;object-fit:cover}
.avatars img:first-child{margin-left:0}
.stars{color:#F2A900;letter-spacing:1px;font-size:14px;line-height:1.2}
.stars b{color:var(--ink);letter-spacing:0;margin-left:4px;font-weight:600}

.hero__visual{display:grid;grid-template-columns:1.15fr 1fr;grid-template-rows:1fr 1fr;gap:14px;height:540px}
.tile{position:relative;overflow:hidden;border-radius:var(--r-lg);background:var(--soft)}
.tile img{width:100%;height:100%;object-fit:cover}
.tile--main{grid-row:span 2}
.tile--main img{object-position:40% center}
.note{position:absolute;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:var(--sh)}
.note--bl{left:16px;bottom:16px}
.note__ico{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--ink);color:#fff}
.note__ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.note small{display:block;font-size:12px;color:var(--muted);line-height:1.2}
.note b{font-size:16px;color:var(--ink);font-weight:600}
.rec{position:absolute;left:14px;top:14px;display:flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:rgba(14,17,22,.6);backdrop-filter:blur(6px);color:#fff;font-size:12px;font-weight:500}
.rec i{width:7px;height:7px;border-radius:50%;background:#EF4444;animation:blink 1.4s infinite}
@keyframes blink{50%{opacity:.25}}
.tile--stat{display:flex;flex-direction:column;padding:22px;background:#fff;border:1px solid var(--line)}
.tile--stat small{font-size:13px;color:var(--muted)}
.tile--stat b{margin-top:4px;font-size:34px;font-weight:600;letter-spacing:-.03em;color:var(--ink);line-height:1.1}
.tile--stat .up{font-size:13px;font-weight:600;margin-top:6px}
.tile--stat em{font-style:normal;font-weight:400;color:var(--muted);margin-left:4px}
.tile--stat svg{width:100%;height:60px;margin-top:auto}

/* ---------- logo strip ---------- */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.strip__inner{display:flex;align-items:center;gap:40px;height:96px}
.strip__inner p{flex:none;max-width:170px;font-size:14px;line-height:1.4;color:var(--muted)}
.strip__marquee{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.strip__track{display:flex;align-items:center;gap:64px;width:max-content;animation:marquee 36s linear infinite}
@keyframes marquee{to{transform:translateX(-50%)}}
.lg{color:#8C939E;white-space:nowrap;line-height:1}
.lg--serif{font-family:"DM Serif Display",serif;font-size:24px}
.lg--serif2{font-family:"DM Serif Display",serif;font-style:italic;font-size:26px}
.lg--grot{font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:22px;letter-spacing:-.03em}
.lg--grot2{font-family:"Space Grotesk",sans-serif;font-weight:500;font-size:26px;letter-spacing:-.03em}
.lg--wide{font-family:var(--font);font-weight:700;font-size:18px;letter-spacing:.32em}
.lg--wide2{font-family:var(--font);font-weight:600;font-size:17px;letter-spacing:.2em}
.lg--it{font-family:"DM Serif Display",serif;font-style:italic;font-size:24px}

/* ---------- sections ---------- */
.sec{padding:112px 0}
.sec--top0{padding-top:0}
.sec--soft{background:var(--soft)}
.head{margin-bottom:48px}
.head h2,.panel h2,.faqwrap h2{font-size:clamp(32px,3.6vw,48px);letter-spacing:-.03em}
/* sayfa yolu (hizmet ve paket sayfaları) */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:28px;font-size:13.5px;color:var(--muted);opacity:0;animation:fadeUp .7s cubic-bezier(.2,.7,.2,1) forwards}
.crumbs a:hover{color:var(--ink)}
.crumbs span{color:#C3C8CF}
.crumbs b{font-weight:500;color:var(--ink)}
@media (max-width:640px){.crumbs{margin-bottom:20px}}
.head--row{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.head__actions{display:flex;gap:8px;flex:none}
.circle{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);transition:background .2s,border-color .2s,color .2s}
.circle:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.circle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.head--split{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:end}
.head--split>p{color:var(--muted);font-size:17px;max-width:460px;justify-self:end}

/* ---------- services ---------- */
.svc{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.svc__card{display:flex;flex-direction:column;padding:10px;border-radius:var(--r-lg);background:var(--soft);border:1px solid transparent;transition:border-color .25s,background .25s}
.svc__card:hover{background:#fff;border-color:var(--line)}
.svc__card--7{grid-column:span 7}
.svc__card--5{grid-column:span 5}
.svc__card--4{grid-column:span 4}
.svc__media{position:relative;height:300px;border-radius:14px;overflow:hidden;background:#fff}
.svc__media--sm{height:200px}
.svc__media>img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.svc__card:hover .svc__media>img{transform:scale(1.04)}
.svc__media--plain{display:grid;place-items:center;padding:24px;background:#fff}
.svc__body{position:relative;padding:22px 14px 12px}
.svc__no{display:block;font-size:13px;font-weight:500;color:#A3A9B3;margin-bottom:8px;font-variant-numeric:tabular-nums}
.svc__body h3{font-size:22px;margin-bottom:8px}
.svc__body p{color:var(--muted);font-size:15px;max-width:520px}
.more{display:inline-flex;align-items:center;gap:6px;margin-top:18px;font-size:14px;font-weight:500;color:var(--ink)}
.more .arr{width:14px;height:14px;transition:transform .2s}
.more:hover .arr,.svc__card:hover .more .arr{transform:translate(2px,-2px)}

.chip{position:absolute;display:flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.96);font-size:13px;font-weight:500;color:var(--ink);box-shadow:0 6px 16px -6px rgba(0,0,0,.25)}
.chip svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chip--a{left:16px;top:16px}
.chip--b{right:16px;bottom:16px}
.dot{width:8px;height:8px;border-radius:50%}
.dot--g{background:#22C55E}
.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:rgba(255,255,255,.95);transition:transform .25s}
.svc__card:hover .play{transform:translate(-50%,-50%) scale(1.08)}
.play svg{width:22px;height:22px;fill:var(--ink);margin-left:3px}
.ads{width:100%;max-width:380px}
.ads__row{display:grid;grid-template-columns:96px 1fr 40px;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.ads__name{font-weight:500;color:var(--ink)}
.ads__bar{height:6px;border-radius:6px;background:var(--soft-2);overflow:hidden}
.ads__bar i{display:block;height:100%;border-radius:6px;background:#C3C8CF}
.ads__row--best .ads__bar i{background:var(--teal)}
.ads__row b{text-align:right;color:var(--ink);font-weight:600}
.ads__foot{display:flex;justify-content:space-between;align-items:baseline;padding-top:16px}
.ads__foot span{font-size:13px;color:var(--muted)}
.ads__foot strong{font-size:32px;font-weight:600;letter-spacing:-.03em;color:var(--ink)}
.post{position:absolute;left:16px;bottom:16px;width:230px;padding:12px;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:0 8px 20px -8px rgba(0,0,0,.3)}
.post__head{display:flex;align-items:center;gap:8px;font-size:13px}
.post__head i{width:24px;height:24px;border-radius:50%;background:var(--ink)}
.post__head b{color:var(--ink);font-weight:600}
.post__head span{margin-left:auto;font-size:11px;color:var(--muted)}
.post__stats{display:flex;justify-content:space-between;margin-top:10px;font-size:12.5px;font-weight:500;color:var(--ink)}

/* ---------- work (tabs) ---------- */
.work__tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #DADDD8;margin-bottom:32px}
.work__tab{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:0 4px 20px;text-align:left}
.work__tab .lg{color:#9AA0A9;transition:color .2s}
.work__tab small{font-size:13px;color:var(--muted)}
.work__tab::after{content:"";position:absolute;left:0;right:16px;bottom:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.work__tab:hover .lg{color:var(--ink)}
.work__tab.on .lg{color:var(--ink)}
.work__tab.on::after{transform:scaleX(1);background:var(--teal)}
.work__panel{display:none;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.work__panel.on{display:grid;animation:fade .5s ease}
@keyframes fade{from{opacity:0;transform:translateY(8px)}}
.work__img{position:relative;aspect-ratio:5/4;border-radius:var(--r-lg);overflow:hidden}
.work__img img{width:100%;height:100%;object-fit:cover}
.work__tags{position:absolute;left:16px;bottom:16px;display:flex;flex-wrap:wrap;gap:6px}
.work__tags span{padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.95);font-size:12.5px;font-weight:500;color:var(--ink)}
.work__body blockquote{font-size:clamp(20px,2vw,26px);line-height:1.4;letter-spacing:-.02em;color:var(--ink);font-weight:500}
.work__who{margin-top:20px;font-size:14px;color:var(--muted)}
.work__who b{color:var(--ink);font-weight:600}
.work__stats{display:grid;grid-template-columns:repeat(3,1fr);margin:36px 0 8px;border-top:1px solid #DADDD8}
.work__stats div{padding:20px 16px 0 0}
.work__stats div+div{padding-left:20px;border-left:1px solid #DADDD8}
.work__stats strong{display:block;font-size:clamp(28px,2.8vw,38px);font-weight:600;letter-spacing:-.03em;color:var(--ink);line-height:1}
.work__stats span{display:block;margin-top:8px;font-size:13.5px;color:var(--muted)}

/* ---------- panel ---------- */
.panel{display:grid;grid-template-columns:.9fr 1.1fr;gap:72px;align-items:center}
.panel__text>p{margin-top:20px;color:var(--muted);font-size:17px;max-width:460px}
.checks{list-style:none;display:grid;gap:12px;margin:28px 0 36px}
.checks li{display:flex;align-items:center;gap:12px;font-weight:500;color:var(--ink)}
.checks li::before{content:"";width:20px;height:20px;border-radius:50%;flex:none;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.5 2.5L14 7.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.dash{padding:24px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-lg)}
.dash__top{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line)}
.dash__brand{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--ink)}
.dash__brand img{width:24px;height:24px;mix-blend-mode:multiply}
.dash__range{padding:6px 12px;border:1px solid var(--line);border-radius:999px;font-size:13px;color:var(--muted)}
.dash__kpis{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:12px;margin:20px 0}
.dash__kpis div{padding:14px;border-radius:12px;background:var(--soft)}
.dash__kpis small{display:block;font-size:12.5px;color:var(--muted)}
.dash__kpis b{display:block;margin-top:4px;font-size:22px;font-weight:600;letter-spacing:-.03em;color:var(--ink)}
.dash__kpis em{font-style:normal;font-size:12.5px;font-weight:600;color:var(--muted)}
.dash__kpis em.up{color:#14804A}
.dash__chart svg{width:100%;height:150px}
.dash__line{stroke-dasharray:700;stroke-dashoffset:700}
.dash.in .dash__line,.panel.in .dash__line{animation:draw 2s .2s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.dash__legend{display:flex;gap:18px;margin-top:8px;font-size:12.5px;color:var(--muted)}
.dash__legend span{display:flex;align-items:center;gap:6px}
.dash__legend i{width:14px;height:2px;border-radius:2px}
.dash__legend .l1{background:var(--teal)}
.dash__legend .l2{background:#C9D2DC}
.dash__rows{margin-top:16px;border-top:1px solid var(--line)}
.dash__rows div{display:grid;grid-template-columns:100px 1fr 60px;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.dash__rows div:last-child{border:0;padding-bottom:0}
.dash__rows span:first-child{color:var(--ink);font-weight:500}
.dash__rows .bar{height:6px;border-radius:6px;background:var(--soft-2);overflow:hidden}
.dash__rows .bar i{display:block;height:100%;background:var(--ink);border-radius:6px}
.dash__rows b{text-align:right;color:var(--ink);font-weight:600}

/* ---------- neden crantum (karşılaştırma) ---------- */
.vs{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px;align-items:stretch}
.vs__card{position:relative;display:flex;flex-direction:column;padding:40px;border-radius:var(--r-lg)}
.vs__card--old{background:var(--soft);border:1px solid var(--line);color:var(--muted)}
.vs__card--new{background:#0B0D12;color:#E6E8EC;box-shadow:var(--sh-lg)}
.vs__mid{position:relative;z-index:2;align-self:center;display:grid;place-items:center;width:56px;height:56px;margin:0 -28px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);font-size:14px;font-weight:600;color:var(--ink);text-transform:uppercase;letter-spacing:.04em}
.vs__tag{display:inline-block;padding:5px 10px;border:1px solid #D9DCE1;border-radius:6px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.vs__tag--light{border-color:rgba(255,255,255,.18);color:#AEB4BE}
.vs__card h3{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:18px 0 22px;font-size:26px;letter-spacing:-.02em}
.vs__card--old h3{color:var(--ink)}
.vs__card--new h3{color:#fff}
.vs__logo{height:.78em;width:auto;transform:translateY(1px)}
.vs__agencies{display:flex;flex-wrap:wrap;gap:10px;min-height:44px;align-items:center}
.vs__agencies span{padding:8px 12px;border:1px dashed #C9CDD3;border-radius:8px;background:#fff;font-size:13px;font-weight:500;color:var(--text)}
.vs__card--old .vs__agencies span:nth-child(1){transform:rotate(-3deg)}
.vs__card--old .vs__agencies span:nth-child(2){transform:rotate(2.5deg) translateY(4px)}
.vs__card--old .vs__agencies span:nth-child(3){transform:rotate(-1.5deg) translateY(-3px)}
.vs__card--old .vs__agencies span:nth-child(4){transform:rotate(3deg)}
/* Crantum: parçalar tek bara birleşir */
.vs__agencies--one{gap:10px;transition:gap .9s cubic-bezier(.7,0,.2,1) .4s}
.vs__agencies--one span{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff;border-radius:8px;transition:border-radius .9s cubic-bezier(.7,0,.2,1) .4s,border-color .9s .4s}
.vs.in .vs__agencies--one{gap:0}
.vs.in .vs__agencies--one span{border-radius:0;border-right-color:transparent}
.vs.in .vs__agencies--one span:first-child{border-radius:8px 0 0 8px}
.vs.in .vs__agencies--one span:last-child{border-radius:0 8px 8px 0;border-right-color:rgba(255,255,255,.16)}
.vs__list{list-style:none;margin-top:28px;flex:1}
.vs__list li{position:relative;display:flex;align-items:flex-start;gap:14px;padding:15px 0;border-top:1px solid var(--line);font-size:15.5px;line-height:1.5}
.vs__card--new .vs__list li{border-color:rgba(255,255,255,.1);color:#fff}
.vs__list li::before{content:"";flex:none;width:22px;height:22px;margin-top:1px;border-radius:50%;background-position:center;background-size:12px;background-repeat:no-repeat}
.vs__card--old .vs__list li::before{background-color:#E4E6EA;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 3l6 6M9 3l-6 6' stroke='%23858C97' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E")}
.vs__card--new .vs__list li::before{background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3L9.5 3.8' fill='none' stroke='%230B0D12' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.vs__btn{align-self:flex-start;margin-top:28px}
/* maddeler sırayla gelir */
.js .vs .vs__list li{opacity:0;transform:translateX(-10px);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.js .vs.in .vs__list li{opacity:1;transform:none}
.vs.in .vs__list li:nth-child(2){transition-delay:.08s}
.vs.in .vs__list li:nth-child(3){transition-delay:.16s}
.vs.in .vs__list li:nth-child(4){transition-delay:.24s}
.vs.in .vs__list li:nth-child(5){transition-delay:.32s}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.step{padding:32px 28px 0 0}
.step+.step{padding-left:28px;border-left:1px solid var(--line)}
.step span{font-size:13px;font-weight:500;color:#A3A9B3}
.step h3{font-size:22px;margin:14px 0 8px}
.step p{font-size:15px;color:var(--muted)}

/* ---------- gallery ---------- */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:240px;gap:12px}
.gallery__item{overflow:hidden;border-radius:var(--r)}
.gallery__item img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.gallery__item:hover img{transform:scale(1.05)}
.gallery__item--0,.gallery__item--4{grid-column:span 2}
.nums{display:grid;grid-template-columns:repeat(4,1fr);margin-top:48px;border-top:1px solid #DADDD8}
.nums div{padding:28px 20px 0 0}
.nums div+div{padding-left:24px;border-left:1px solid #DADDD8}
.nums strong{display:block;font-size:48px;font-weight:600;letter-spacing:-.035em;color:var(--ink);line-height:1}
.nums span{display:block;margin-top:10px;color:var(--muted);font-size:14px}

/* ---------- faq ---------- */
.faqwrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:72px;align-items:start}
.faqwrap__side{position:sticky;top:110px}
.faqwrap__side p{margin:16px 0 28px;color:var(--muted);font-size:17px;max-width:340px}
.faq{border-top:1px solid var(--line)}
.faq__item{border-bottom:1px solid var(--line)}
.faq__item summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px 0;cursor:pointer;list-style:none;font-size:18px;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.faq__item summary::-webkit-details-marker{display:none}
.pm{position:relative;width:16px;height:16px;flex:none}
.pm::before,.pm::after{content:"";position:absolute;left:0;top:7px;width:16px;height:2px;border-radius:2px;background:var(--ink);transition:transform .25s}
.pm::after{transform:rotate(90deg)}
.faq__item[open] .pm::after{transform:rotate(0)}
.faq__item p{padding:0 40px 24px 0;color:var(--muted)}

/* ---------- iletişim ---------- */
.contact{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);border:1px solid var(--line);border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 30px 60px -40px rgba(14,17,22,.25)}
.contact__side{display:flex;flex-direction:column;padding:56px 48px;background:var(--soft);border-right:1px solid var(--line)}
.contact__side h2{font-size:clamp(36px,4vw,56px);letter-spacing:-.035em;line-height:1.05}
.contact__lead{margin:18px 0 36px;color:var(--muted);font-size:16.5px;max-width:420px}
.channels{border-top:1px solid #DFE1E5}
.channel{display:flex;align-items:center;gap:16px;padding:18px 4px;border-bottom:1px solid #DFE1E5;transition:padding .25s cubic-bezier(.2,.7,.2,1)}
.channel__ico{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:#fff;border:1px solid var(--line);color:var(--ink);transition:background .2s,color .2s,border-color .2s}
.channel__ico svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.channel__txt{flex:1;min-width:0}
.channel__txt small{display:block;font-size:13px;color:var(--muted)}
.channel__txt b{display:block;font-size:16px;font-weight:500;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.channel__arr{width:18px;height:18px;fill:none;stroke:#A3A9B3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s,transform .25s}
.channel:hover{padding-left:10px}
.channel:hover .channel__ico{background:var(--ink);border-color:var(--ink);color:#fff}
.channel:hover .channel__arr{stroke:var(--ink);transform:translate(2px,-2px)}
.advisor{display:flex;align-items:center;gap:14px;margin-top:auto;padding:16px;border-radius:14px;background:#fff;border:1px solid var(--line)}
.advisor__img{position:relative;flex:none}
.advisor__img img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.advisor__img i{position:absolute;right:0;bottom:1px;width:13px;height:13px;border-radius:50%;background:#22C55E;border:2.5px solid #fff}
.advisor__txt b{display:block;font-size:14.5px;font-weight:600;color:var(--ink)}
.advisor__txt small{display:block;font-size:13px;color:var(--muted)}
.contact__side .advisor{margin-top:40px}

.contact__main{padding:48px 56px}
.pform__pkg{display:flex;align-items:center;gap:12px;margin-bottom:28px;padding:12px 12px 12px 14px;border:1.5px solid var(--btn);border-radius:12px;background:#F4F5FF}
.pform__pkg[hidden]{display:none}
.pform__hp{position:absolute!important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.pform__pkg.flash{animation:pkgFlash .9s ease}
@keyframes pkgFlash{0%{box-shadow:0 0 0 0 rgba(48,52,255,.35)}100%{box-shadow:0 0 0 12px rgba(48,52,255,0)}}
.pform__pkgico{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--btn);color:#fff;flex:none}
.pform__pkgico svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pform__pkgtxt{flex:1;min-width:0}
.pform__pkgtxt small{display:block;font-size:12px;color:var(--muted)}
.pform__pkgtxt b{display:block;font-size:15px;font-weight:600;color:var(--ink)}
.pform__pkgx{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;color:var(--muted);transition:background .2s,color .2s}
.pform__pkgx:hover{background:#fff;color:var(--ink)}
.pform__pkgx svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.btn--ghost-light{border-color:rgba(255,255,255,.25);background:transparent;color:#fff}
.btn--ghost-light:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.nav__link.is-active::after{transform:scaleX(1)}
.pform__group{border:0;padding:0;margin:0 0 32px;min-width:0}
.pform__group legend{display:flex;align-items:center;gap:10px;margin-bottom:16px;padding:0;font-size:17px;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.pform__group legend span{padding:3px 7px;border:1px solid var(--line);border-radius:6px;font-size:12px;font-weight:600;color:#A3A9B3;font-variant-numeric:tabular-nums}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip2{position:relative}
.chip2 input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.chip2 span{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 15px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:14.5px;font-weight:500;color:var(--text);cursor:pointer;user-select:none;transition:background .18s,border-color .18s,color .18s}
.chip2 input[type=checkbox]+span::before{content:"";width:14px;height:14px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 2.5v9M2.5 7h9' stroke='%23A3A9B3' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.chip2 input[type=checkbox]:checked+span::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2.5 7.3l3 3 6-6.3' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.chip2 span:hover{border-color:#C3C8CF}
.chip2 input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.chip2 input:focus-visible+span{outline:2px solid var(--btn);outline-offset:2px}

.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fld{position:relative;display:block}
.fld input,.fld textarea{display:block;width:100%;height:58px;padding:24px 16px 8px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:15px;color:var(--ink);background:#fff;outline:0;resize:vertical;transition:border-color .2s,box-shadow .2s}
.fld textarea{height:auto;min-height:104px;padding-top:28px;line-height:1.5}
.fld span{position:absolute;left:17px;top:19px;font-size:15px;color:var(--muted);pointer-events:none;transition:top .18s,font-size .18s,color .18s}
.fld input:focus+span,.fld input:not(:placeholder-shown)+span,.fld textarea:focus+span,.fld textarea:not(:placeholder-shown)+span{top:9px;font-size:12px;color:var(--text)}
.fld input:focus,.fld textarea:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(14,17,22,.06)}
.fld--full{grid-column:1/-1}
.fld.err input{border-color:#E5484D;box-shadow:0 0 0 3px rgba(229,72,77,.1)}
.pform__foot{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:24px;border-top:1px solid var(--line)}
.kvkk{display:flex;align-items:flex-start;gap:10px;max-width:360px;font-size:13.5px;line-height:1.5;color:var(--muted);cursor:pointer}
.kvkk input{flex:none;width:18px;height:18px;margin-top:1px;accent-color:var(--ink);cursor:pointer}
.kvkk a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.kvkk.err{color:#D93036}
.pform__btn{height:52px;padding:0 24px;flex:none}
.pform__err{margin-top:12px;font-size:14px;color:#D93036}
.pform__err:empty{display:none}

.pdone[hidden]{display:none}
.pdone{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:100%;animation:fadeUp .6s cubic-bezier(.2,.7,.2,1) both}
.pdone__ico{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--ink);color:#fff;margin-bottom:24px}
.pdone__ico svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:30;stroke-dashoffset:30;animation:drawS .6s .3s forwards}
.pdone h3{font-size:32px;letter-spacing:-.03em}
.pdone p{margin:12px 0 28px;max-width:440px;color:var(--muted);font-size:16.5px}

/* ---------- footer ---------- */
.ft{position:relative;overflow:hidden;margin-top:24px;background:#0B0D12;color:#9CA3AF;font-size:15px}
.ft__top{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.25fr);gap:72px;padding:88px 0 64px}
.ft__logo img{height:28px;width:auto}
.ft__desc{margin-top:22px;max-width:400px;font-size:16px;line-height:1.65;color:#A7ADB7}
.ft__news{margin-top:36px;max-width:440px}
.ft__news label{display:block;margin-bottom:12px;font-size:14px;font-weight:500;color:#fff}
.ft__newsrow{display:flex;gap:8px;padding:6px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(255,255,255,.04);transition:border-color .2s}
.ft__newsrow:focus-within{border-color:rgba(255,255,255,.35)}
.ft__newsrow input{flex:1;min-width:0;height:44px;padding:0 12px;border:0;background:transparent;font:inherit;font-size:15px;color:#fff;outline:0}
.ft__newsrow input::placeholder{color:#6B7280}
.ft__newsrow .btn{height:44px;flex:none}
.ft__newsmsg{margin-top:10px;font-size:13.5px;min-height:20px;color:#A7ADB7}
.ft__newsmsg.ok{color:#4ADE80}
.ft__newsmsg.bad{color:#F87171}

.ft__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.ft__col h4{margin-bottom:20px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#6B7280}
.ft__col a{position:relative;display:table;padding:6px 0;color:#D1D5DB;font-size:15px;transition:color .2s}
.ft__col a::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:1px;background:#fff;transform:scaleX(0);transform-origin:right;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.ft__col a:hover{color:#fff}
.ft__col a:hover::after{transform:scaleX(1);transform-origin:left}

.ft__info{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
.ft__item{position:relative;display:block;padding:26px 24px 26px 0;transition:background .2s}
.ft__item+.ft__item{padding-left:24px;border-left:1px solid rgba(255,255,255,.1)}
.ft__item small{display:block;margin-bottom:6px;font-size:13px;color:#6B7280}
.ft__item b{display:block;font-size:16px;font-weight:500;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ft__item svg{position:absolute;right:20px;top:26px;width:16px;height:16px;fill:none;stroke:#6B7280;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s,transform .25s}
a.ft__item:hover svg{stroke:#fff;transform:translate(2px,-2px)}

.ft__big{position:relative;height:clamp(80px,13vw,190px);margin-top:56px;overflow:hidden;pointer-events:none}
.ft__big img{width:100%;height:auto;opacity:.09;transform:translateY(8%);transition:transform 1.4s cubic-bezier(.2,.7,.2,1),opacity 1.4s}
.js .ft__big:not(.in) img{transform:translateY(60%);opacity:0}

.ft__bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px 32px;padding:24px 0 28px;border-top:1px solid rgba(255,255,255,.1);font-size:13.5px;color:#6B7280}
.ft__legal{display:flex;flex-wrap:wrap;gap:8px 24px}
.ft__legal a{transition:color .2s}
.ft__legal a:hover{color:#fff}
.ft__social{display:flex;gap:8px}
.ft__social a{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.12);color:#D1D5DB;transition:background .2s,color .2s,border-color .2s}
.ft__social a:hover{background:#fff;border-color:#fff;color:#0B0D12}
.ft__social svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}

/* ---------- animations ---------- */
/* WhatsApp butonu (sabit, sağ alt) */
.wa{position:fixed;right:24px;bottom:24px;z-index:80;display:flex;align-items:center;gap:12px}
.wa__btn{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;box-shadow:0 10px 24px -8px rgba(0,0,0,.35),0 2px 6px rgba(0,0,0,.12);transition:background .2s,box-shadow .2s}
.wa__btn svg{width:30px;height:30px;fill:currentColor}
.wa:hover .wa__btn{background:#1EBE5A;box-shadow:0 12px 28px -8px rgba(0,0,0,.4),0 2px 6px rgba(0,0,0,.12)}
.wa__label{padding:9px 14px;border-radius:8px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
.wa:hover .wa__label,.wa:focus-visible .wa__label{opacity:1;visibility:visible}
.wa:focus-visible{outline:none}
.wa:focus-visible .wa__btn{outline:2px solid var(--ink);outline-offset:3px}
@media (max-width:640px){.wa{right:16px;bottom:16px}.wa__btn{width:52px;height:52px}.wa__btn svg{width:27px;height:27px}.wa__label{display:none}}

/* hero giriş */
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.w>span{display:inline-block}
.hero .w>span{transform:translateY(105%);animation:wordUp .9s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.08s * var(--i) + .1s)}
@keyframes wordUp{to{transform:none}}
/* bölüm başlıkları: görününce kelime kelime */
.js .split-s .w>span{transform:translateY(105%);transition:transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(.06s * var(--i) + .1s)}
.js .in .split-s .w>span,.js .split-s.in .w>span{transform:none}

/* dönen kelime */
.rot{position:relative;display:inline-block;vertical-align:bottom;white-space:nowrap;color:var(--teal);overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em;transition:width .5s cubic-bezier(.7,0,.2,1)}
.rot>span{display:inline-block;background:linear-gradient(currentColor,currentColor) 0 94%/100% .07em no-repeat;transition:transform .45s cubic-bezier(.7,0,.2,1),opacity .45s}
.rot>span.out{transform:translateY(-100%);opacity:0}
.rot>span.pre{transform:translateY(100%);opacity:0;transition:none}
.rot__m{position:absolute;left:0;top:0;visibility:hidden}

/* sayfa açılışında üst kısım */
.topbar{animation:slideDown .6s cubic-bezier(.2,.7,.2,1) both}
.nav{animation:slideDown .7s .08s cubic-bezier(.2,.7,.2,1) both}
@keyframes slideDown{from{transform:translateY(-100%);opacity:0}}

/* görsel perde açılışı */
.svc__media,.work__img,.gallery__item{transition:clip-path 1.2s cubic-bezier(.77,0,.18,1)}
.js .svc__card.rv:not(.in) .svc__media{clip-path:inset(100% 0 0 0 round 14px)}
.js .svc__card .svc__media{clip-path:inset(0 0 0 0 round 14px)}
.js .svc__card.rv:not(.in) .svc__media>img{transform:scale(1.25)}
.svc__media>img{transition:transform 1.3s cubic-bezier(.2,.7,.2,1)}
.js .work.rv:not(.in) .work__img{clip-path:inset(100% 0 0 0 round 22px)}
.js .work .work__img{clip-path:inset(0 0 0 0 round 22px)}
.js .gallery.rv:not(.in) .gallery__item{clip-path:inset(100% 0 0 0 round 16px)}
.js .gallery .gallery__item{clip-path:inset(0 0 0 0 round 16px)}
.gallery__item:nth-child(2){transition-delay:.08s}.gallery__item:nth-child(3){transition-delay:.16s}.gallery__item:nth-child(4){transition-delay:.24s}.gallery__item:nth-child(5){transition-delay:.32s}.gallery__item:nth-child(6){transition-delay:.4s}
.gallery__item img,.work__img img{scale:1.14}
.js .gallery.rv:not(.in) .gallery__item img{transform:scale(1.2)}
.gallery__item img{transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}

/* adımlar: çizgi dolar */
.steps{position:relative}
.steps::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform 1.6s cubic-bezier(.7,0,.2,1) .1s}
.steps.in::before{transform:scaleX(1)}
.step span{display:inline-grid;place-items:center;width:30px;height:30px;border:1px solid var(--line);transition:background .4s,color .4s,border-color .4s}
.step.in span{background:var(--ink);color:#fff;border-color:var(--ink);transition-delay:calc(var(--d,0s) + .5s)}

/* kayan büyük yazı bandı */
.band{padding:72px 0;overflow:hidden;border-top:1px solid var(--line)}
.band__row{overflow:hidden;white-space:nowrap}
.band__row+.band__row{margin-top:6px}
.band__track{display:inline-flex;align-items:center;gap:40px;will-change:transform}
.band__track span{font-size:clamp(44px,7vw,96px);font-weight:600;letter-spacing:-.04em;line-height:1.1;color:var(--ink)}
.band__track i{flex:none;width:18px;height:18px;background:var(--teal);transform:rotate(45deg)}
.band__row--outline span{color:transparent;-webkit-text-stroke:1.5px #C9CDD3}
.band__row--outline i{background:transparent;border:1.5px solid #C9CDD3}
.band.rv{transform:none}

/* manyetik butonlar */

/* fareyi takip eden ışık */
.spot{position:relative}
.spot::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(14,17,22,.05),transparent 60%);z-index:0}
.spot:hover::after{opacity:1}
.svc__card>*{position:relative;z-index:1}

.hero .eyebrow,.hero__sub,.hero__btns,.hero__trust{opacity:0;transform:translateY(16px);animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) forwards}
.hero .eyebrow{animation-delay:0s}
.hero__sub{animation-delay:.55s}
.hero__btns{animation-delay:.7s}
.hero__trust{animation-delay:.85s}
@keyframes fadeUp{to{opacity:1;transform:none}}
.tile{opacity:0;transform:scale(.94) translateY(20px);animation:tileIn 1s cubic-bezier(.2,.7,.2,1) forwards}
.tile--main{animation-delay:.25s}
.tile--video{animation-delay:.45s}
.tile--stat{animation-delay:.6s}
@keyframes tileIn{to{opacity:1;transform:none}}
.tile--main img{animation:kenburns 18s ease-in-out infinite alternate}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.08) translate(-1.5%,-1%)}}
.note{animation:bob 5s ease-in-out infinite 1.4s}
@keyframes bob{50%{transform:translateY(-6px)}}
.tile--stat svg path{stroke-dasharray:260;stroke-dashoffset:260;animation:drawS 1.6s .9s cubic-bezier(.2,.7,.2,1) forwards}
.tile--stat svg circle{opacity:0;animation:pop .4s 2.3s forwards}
@keyframes drawS{to{stroke-dashoffset:0}}
@keyframes pop{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}
.tile--stat svg circle{transform-box:fill-box;transform-origin:center}

/* kart hover */
.svc__card{transition:opacity .8s ease var(--d,0s),border-color .25s,background .25s,transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.svc__card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg)}
.gallery__item{transition:transform .4s}
.work__img img{transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.work__panel.on .work__img img{animation:zoomOut 1.2s cubic-bezier(.2,.7,.2,1)}
@keyframes zoomOut{from{transform:scale(1.08)}}
.work__panel.on .work__stats div{animation:fadeUp .7s cubic-bezier(.2,.7,.2,1) both;opacity:0;transform:translateY(12px)}
.work__panel.on .work__stats div:nth-child(2){animation-delay:.1s}
.work__panel.on .work__stats div:nth-child(3){animation-delay:.2s}
.ads__bar i{transform:scaleX(0);transform-origin:left;transition:transform 1.2s cubic-bezier(.2,.7,.2,1) .2s}
.svc__card.in .ads__bar i{transform:scaleX(1)}
.dash__rows .bar i{transform:scaleX(0);transform-origin:left;transition:transform 1.2s cubic-bezier(.2,.7,.2,1) .5s}
.dash.in .dash__rows .bar i{transform:scaleX(1)}
.play::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,255,255,.8);animation:ripple 2.2s ease-out infinite}
@keyframes ripple{from{transform:scale(1);opacity:.9}to{transform:scale(1.7);opacity:0}}
.checks li{opacity:0;transform:translateX(-10px);transition:opacity .5s,transform .5s}
.panel__text.in .checks li{opacity:1;transform:none}
.panel__text.in .checks li:nth-child(2){transition-delay:.1s}
.panel__text.in .checks li:nth-child(3){transition-delay:.2s}
.panel__text.in .checks li:nth-child(4){transition-delay:.3s}
/* Not: Animasyonlar istek üzerine işletim sisteminin "hareketi azalt" ayarından bağımsız çalışır. */

/* ================= responsive ================= */
@media (max-width:1200px){
  .mega__box{grid-template-columns:220px minmax(0,1fr)}
  .mega__panel{grid-template-columns:minmax(0,1fr) 240px}
  .mega__main{padding:0 28px}
  .mega__feat{padding-left:28px}
}
@media (max-width:1080px){
  .nav__inner{gap:28px}
  .mega__panel{grid-template-columns:minmax(0,1fr)}
  .mega__feat{display:none}
  .mega__main{border-right:0}
  .hero__grid{grid-template-columns:1fr;gap:48px}
  .hero__visual{height:460px}
  .svc__card--7,.svc__card--5{grid-column:span 6}
  .panel{grid-template-columns:1fr;gap:48px}
  .work__panel{gap:36px}
  .contact{grid-template-columns:minmax(0,1fr)}
  .contact__side{border-right:0;border-bottom:1px solid var(--line);padding:44px 40px}
  .contact__main{padding:44px 40px}
  .ft__top{grid-template-columns:minmax(0,1fr);gap:56px;padding-top:72px}
  .ft__info{grid-template-columns:1fr 1fr}
  .ft__item:nth-child(3){padding-left:0;border-left:0}
  .ft__item:nth-child(n+3){border-top:1px solid rgba(255,255,255,.1)}
}
@media (max-width:900px){
  .nav__toggle{display:flex}
  .nav__meet{display:none}
  .nav__pill{margin:16px 0 0;justify-content:center;height:50px}
  .nav__link::after{display:none}
  .nav__menu{position:absolute;top:100%;left:0;right:0;height:calc(100vh - 84px);height:calc(100dvh - 84px);flex-direction:column;align-items:stretch;gap:0;padding:12px 20px;background:#fff;border-top:1px solid var(--line);overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
  .nav.open .nav__menu{opacity:1;visibility:visible}
  .nav__link{height:56px;width:100%;justify-content:space-between;font-size:18px;color:var(--ink);border-bottom:1px solid var(--line);padding:0 4px}
  .dd{display:block;align-self:auto}
  .mega{position:static;display:none;padding:0;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0}
  .dd.open .mega{display:block}
  .mega .container{padding:0}
  .mega__box{display:block;padding:0}
  .mega__cats,.mega__feat,.mega__foot,.mega__lico,.mega__all{display:none}
  .mega__panel,.mega__panel.on{display:block}
  .mega__panel.on .mega__link{animation:none}
  .mega__link,.mega__head{opacity:1;transform:none}
  .mega__main{padding:4px 0 8px}
  .mega__head{display:block;padding:12px 4px 4px;margin:0;border:0}
  .mega__main{border:0}
  .mega__links{grid-template-columns:1fr;gap:0}
  .mega__link{padding:11px 4px;border-radius:8px}
  .mega__ltxt small{display:none}
  .sec{padding:80px 0}
  .sec--top0{padding-top:0}
  .head--split{grid-template-columns:1fr;gap:16px}
  .head--split>p{justify-self:start}
  .svc__card--7,.svc__card--5,.svc__card--4{grid-column:1/-1}
  .work__tabs{display:flex;overflow-x:auto;scrollbar-width:none;gap:28px}
  .work__tabs::-webkit-scrollbar{display:none}
  .work__tab{flex:none}
  .work__panel{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr;row-gap:32px}
  .step:nth-child(3){padding-left:0;border-left:0}
  .gallery{grid-template-columns:1fr 1fr;grid-auto-rows:170px;gap:8px}
  .gallery__item--4{grid-column:auto}
  .gallery__item--5{display:none}
  .nums{grid-template-columns:1fr 1fr;row-gap:28px}
  .nums div:nth-child(3){padding-left:0;border-left:0}
  .faqwrap{grid-template-columns:1fr;gap:32px}
  .faqwrap__side{position:static}
  .vs{grid-template-columns:minmax(0,1fr)}
  .vs__mid{justify-self:center;margin:-28px 0}
}
@media (max-width:640px){
  .container{padding:0 18px}
  .vs__card{padding:26px 20px}
  .vs__card h3{font-size:22px}
  .vs__btn{align-self:stretch}
  .vs.in .vs__agencies--one{gap:6px}
  .vs.in .vs__agencies--one span,.vs.in .vs__agencies--one span:first-child,.vs.in .vs__agencies--one span:last-child{border-radius:8px;border-right-color:rgba(255,255,255,.16)}
  .topbar{font-size:13px}
  .topbar__inner{height:44px}
  .topbar__phone,.topbar__sep{display:none}
  .nav__inner{height:64px;justify-content:space-between;gap:12px}
  .nav__menu{height:calc(100dvh - 64px)}
  .nav__logo img{height:21px}
  .nav__actions{gap:8px}
  .nav__actions .btn{height:38px;padding:0 16px;font-size:14px}
  .hero{padding:44px 0 56px}
  .hero h1{font-size:40px}
  .hero h1 br{display:none}
  .hero__sub{font-size:16px}
  .hero__btns .btn{flex:1}
  .hero__visual{height:auto;grid-template-columns:1fr 1fr;grid-template-rows:280px 170px}
  .tile--main{grid-row:auto;grid-column:1/-1}
  .tile--stat{padding:16px}
  .tile--stat b{font-size:26px}
  .strip__inner{flex-direction:column;align-items:flex-start;justify-content:center;gap:14px;height:auto;padding-top:24px;padding-bottom:24px}
  .strip__inner p{max-width:none}
  .strip__marquee{width:100%}
  .svc__media{height:230px}
  .svc__body h3{font-size:20px}
  .post{width:200px}
  .work__stats div{padding-right:10px}
  .work__stats div+div{padding-left:12px}
  .dash{padding:16px}
  .dash__kpis{grid-template-columns:1fr 1fr}
  .dash__kpis div:first-child{grid-column:1/-1}
  .steps{grid-template-columns:1fr}
  .step,.step+.step{padding:24px 0 0;border-left:0}
  .nums strong{font-size:36px}
  .contact{border-radius:22px}
  .contact__side,.contact__main{padding:30px 20px}
  .contact__side h2{font-size:36px}
  .fields{grid-template-columns:1fr}
  .pform__foot{flex-direction:column;align-items:stretch}
  .pform__btn{width:100%}
  .chip2 span{height:40px;padding:0 13px;font-size:14px}
  .ft__top{padding:56px 0 44px;gap:44px}
  .ft__cols{grid-template-columns:1fr 1fr;gap:32px 16px}
  .ft__col:last-child{grid-column:1/-1}
  .ft__info{grid-template-columns:1fr}
  .ft__item,.ft__item+.ft__item{padding:20px 0;border-left:0}
  .ft__item+.ft__item{border-top:1px solid rgba(255,255,255,.1)}
  .ft__item svg{right:0;top:22px}
  .ft__big{margin-top:36px}
  .ft__bottom{flex-direction:column;align-items:flex-start;padding-bottom:90px}
}