/* Sociopack — WordPress teması: yeni menü yapısı, müşterinin istediği ana sayfa bölümleri,
   form, müşteri hikâyeleri ve içerik düzenleyicisinden gelen metinler. c.css ve c-pages.css'ten sonra yüklenir. */

/* ---------- genel ---------- */
.skip{position:absolute;left:16px;top:-60px;z-index:100;padding:12px 18px;border-radius:99px;background:var(--ink);color:#fff;font-weight:700}
.skip:focus{top:16px}
.tagx{font-style:normal}
.more{display:flex;justify-content:center;margin-top:40px}

/* ---------- header: yedi menü öğesi + dil seçici ---------- */
.pill nav a.pl,.cdd > button{padding:0 11px;font-size:14.5px}
.pill .logo img{height:24px;width:auto}
.lang{display:inline-flex;align-items:center;gap:6px;height:52px;padding:0 16px;border-radius:99px;background:rgba(255,255,255,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 30px -16px rgba(14,26,68,.35);font:700 14px/1 var(--f-b);color:var(--ink)}
.lang b{font-weight:800}
.lang a{color:var(--ink-2);transition:color .25s}
.lang a:hover{color:var(--p3)}
.lang i{font-style:normal;color:#B6C3E2}
.lang .off{color:#B6C3E2;cursor:default}
/* mobil menü kendi içinde kaydırılır; sayfaya taşmaz (Lenis durduğunda da: header.php data-lenis-prevent) */
.mnav{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
/* kayan menü içeriği sabit header'ın arasından görünmesin */
.mnav::before{content:"";position:fixed;inset:0 0 auto;height:84px;background:var(--pale);z-index:1;pointer-events:none}
.mnav .lang--m{justify-self:center;box-shadow:none;background:#fff}
@media (max-width:1280px){
  .pill nav{display:none}
  .pill{padding-right:20px}
  .top .r .burger{display:inline-flex}
  .top .r a.btn--glass{display:none}
}
@media (max-width:640px){
  .top .r .lang{display:none}
}

/* ---------- ana sayfa: üst başlık ---------- */
.intro h1{font-size:clamp(36px,3.9vw,58px)}
.intro .ctas{margin-top:28px}
.intro .ctas .btn--glass .ico{width:20px;height:20px}
.legend a:last-child:nth-child(odd){grid-column:1/-1}
@media (max-width:640px){
  .intro h1{font-size:clamp(32px,8.6vw,42px)}
  .intro .ctas{margin-top:18px}
  .intro .ctas .btn{height:48px;padding:0 18px;font-size:14.5px}
}

/* ---------- 1 · yükü azaltın ---------- */
.yuklist{display:grid;gap:12px;list-style:none}
.yuklist li{display:grid;grid-template-columns:52px minmax(0,1fr) 44px minmax(0,1.25fr) auto;gap:18px;align-items:center;padding:18px 22px;border-radius:28px;background:#fff;box-shadow:0 30px 60px -48px rgba(14,26,68,.5)}
.yuklist .pt{height:52px}
.yuklist small{display:block;font:700 12px/1 var(--f-b);letter-spacing:.06em;text-transform:uppercase;color:#8A97B4;margin-bottom:6px}
.yuklist .once s{position:relative;text-decoration:none;color:var(--ink-2);font-size:16.5px}
.yuklist .once s::after{content:"";position:absolute;left:0;right:0;top:55%;height:2px;border-radius:2px;background:var(--pc);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.yuklist li.on .once s::after{transform:scaleX(1)}
.yuklist .ok{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--pale);color:var(--pc)}
.yuklist .ok svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2}
.yuklist .sonra b{font:800 19px/1.25 var(--f-d);letter-spacing:-.01em}
.yuklist .mod{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:99px;background:var(--pale);font-weight:700;font-size:14px;white-space:nowrap;transition:background .3s,color .3s}
.yuklist .mod i{width:10px;height:10px;border-radius:3px 3px 3px 0;rotate:45deg;background:var(--pc)}
.yuklist .mod:hover{background:var(--ink);color:#fff}
@media (max-width:980px){
  .yuklist li{grid-template-columns:44px minmax(0,1fr);gap:10px 16px}
  .yuklist .pt{height:44px;grid-row:span 2}
  .yuklist .ok{display:none}
  .yuklist .sonra,.yuklist .mod{grid-column:2}
  .yuklist .mod{justify-self:start}
}

/* ---------- 2 · müşterilerimiz ---------- */
.logos-sec{padding:clamp(40px,5vw,72px) 0}
.logos-sec .lh{display:grid;justify-items:center;gap:14px;text-align:center;margin-bottom:28px}
.logos-sec .kick{color:var(--p3)}
.logos-sec h2{font-size:clamp(22px,2vw,28px);letter-spacing:-.02em;line-height:1.15;max-width:28em}
.marq{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)}
.marq .track{display:flex;gap:16px;width:max-content;will-change:transform}
.marq .lg{display:grid;place-items:center;width:200px;height:96px;padding:18px 28px;border-radius:24px;background:#fff;box-shadow:0 20px 50px -44px rgba(14,26,68,.6)}
.marq .lg img{max-height:52px;width:auto;max-width:100%;filter:grayscale(1);opacity:.7;transition:filter .4s,opacity .4s}
.marq .lg:hover img{filter:none;opacity:1}
@media (prefers-reduced-motion:reduce){.marq .track{flex-wrap:wrap;width:auto;justify-content:center}.marq{-webkit-mask-image:none;mask-image:none}}

/* ---------- 3 · kime uygun? ---------- */
.solg.three{grid-template-columns:repeat(3,1fr)}
.solg.three .solc b{font-size:clamp(26px,2.2vw,32px)}
@media (max-width:980px){.solg.three{grid-template-columns:1fr}}

/* ---------- 4 · ürünü yakından görün ---------- */
.chap h2{font-size:clamp(44px,5.6vw,80px)}
.urun-head{padding-bottom:clamp(36px,5vw,64px)}
.urun-nav{margin-top:0}

/* ---------- 5 · müşteri hikâyeleri ---------- */
.stg{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.stc{position:relative;display:grid;gap:10px;align-content:start;padding:14px 14px 26px;border-radius:32px;background:#fff;box-shadow:0 30px 60px -48px rgba(14,26,68,.5);transition:translate .45s var(--ease)}
.stc .img{position:relative;display:block;aspect-ratio:4/3;border-radius:22px 22px 22px 6px;overflow:hidden;margin-bottom:6px;background:var(--pc)}
.stc .img img{width:100%;height:100%;object-fit:cover;transition:scale .8s var(--ease)}
.stc .res{position:absolute;left:12px;bottom:12px;right:12px;display:grid;gap:2px;padding:12px 16px;border-radius:18px;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);font-size:13.5px;font-weight:600;color:var(--ink-2)}
.stc .res b{font:800 30px/1 var(--f-d);letter-spacing:-.03em;color:var(--ink)}
.stc .cat,.stc > b,.stc .mus{padding:0 10px}
.stc > b{font:800 22px/1.15 var(--f-d);letter-spacing:-.015em;padding-right:60px}
.stc .mus{font-size:14.5px;color:var(--ink-2)}
.stc .go{position:absolute;right:22px;bottom:22px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--pale);transition:background .3s,color .3s}
.stc .go svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.stc:hover{translate:0 -6px}
.stc:hover .img img{scale:1.05}
.stc:hover .go{background:var(--pc);color:#fff}
.stc[hidden]{display:none}
@media (max-width:980px){.stg{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.stg{grid-template-columns:minmax(0,1fr)}}

/* ---------- 6 · neden sociopack? ---------- */
.fgrid.three{grid-template-columns:repeat(3,1fr)}
.fcard .fi{display:grid;place-items:center;width:52px;height:52px;border-radius:50% 50% 50% 14%;background:var(--pc);color:#fff}
.fcard .fi .ico{width:24px;height:24px}
@media (max-width:1100px){.fgrid.three{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.fgrid.three{grid-template-columns:1fr}}

/* ---------- 7 · başarılarımız ---------- */
.basari .facts b{font-size:clamp(46px,4.6vw,64px)}

/* ---------- 8 · fiyatlandırma ---------- */
.plans-sec .more{margin-top:28px}
.vat{margin-top:18px;text-align:center;color:var(--ink-2);font-size:14.5px}

/* ---------- 9 · demo ---------- */
.demo-sec{position:relative;overflow:hidden;background:var(--night);color:#fff;padding:clamp(90px,10vw,140px) 0}
.demo-sec > .mk{position:absolute;right:-8vw;top:-10vw;width:auto;height:min(620px,70vw);opacity:.3;pointer-events:none}
.demo-sec .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,6vw,96px);align-items:center}
.demo-sec .kick{color:var(--p1)}
.demo-sec h2{font-size:clamp(40px,5vw,76px);margin-top:18px}
.demo-sec .txt > p{margin-top:20px;color:#C3D0EE;max-width:30em}
.demo-sec .flow li{background:rgba(255,255,255,.07)}
.demo-sec .flow span{color:#C3D0EE;opacity:1}
@media (max-width:980px){.demo-sec .wrap{grid-template-columns:minmax(0,1fr)}}

/* ---------- ürün turu penceresi ---------- */
.tour{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:24px;background:rgba(6,12,32,.82);backdrop-filter:blur(6px)}
.tour[hidden]{display:none}
.tour-box{position:relative;width:min(1100px,100%)}
.tour-frame{aspect-ratio:16/9;border-radius:24px;overflow:hidden;background:#000;box-shadow:0 40px 100px -30px rgba(0,0,0,.7)}
.tour-frame iframe,.tour-frame video{display:block;width:100%;height:100%;border:0}
.tour-x{position:absolute;right:0;top:-56px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--ink)}
.tour-x .ico{width:20px;height:20px}
.tour-open{overflow:hidden}

/* ---------- formlar ---------- */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form-err{padding:12px 16px;border-radius:16px;background:#FDECEA;color:#9B1C12;font-weight:600;font-size:14.5px}
.form-note{padding:10px 14px;border-radius:14px;background:var(--pale);font-size:14.5px}
.cform small{font-weight:500;color:var(--ink-2)}
.cform fieldset.opts{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.cform fieldset.opts legend{width:100%;margin-bottom:8px;font-weight:600;font-size:14.5px}
.cform select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E1A44' stroke-width='2.2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:16px;padding-right:44px}
.cform .btn.is-loading{opacity:.6;pointer-events:none}
.recaptcha-note{font-size:12px;color:var(--ink-2)}
.recaptcha-note a{color:var(--p3)}
.c-hero .vis .cform{width:100%}

/* ---------- özellikler ---------- */
.feat-row .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,6vw,96px);align-items:center}
.feat-row.rev .txt{order:2}
.feat-row .kick{color:var(--ink)}
.feat-row .kick .fi{display:grid;place-items:center;width:40px;height:40px;border-radius:50% 50% 50% 14%;background:var(--pc);color:#fff}
.feat-row .kick .fi .ico{width:20px;height:20px}
.feat-row h2{font-size:clamp(32px,3.6vw,54px);margin-top:18px}
.feat-row .txt > p{margin-top:18px;color:var(--ink-2);max-width:32em}
.chk{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.chk li{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px;border-radius:99px;background:#fff;font-weight:600;font-size:14.5px}
.chk li svg{width:16px;height:16px;fill:none;stroke:var(--p3);stroke-width:2.4}
.feat-row .chap-link{color:var(--ink)}
.feat-row .fig{position:relative;padding:clamp(18px,3vw,40px);border-radius:36px;background:var(--pc)}
.feat-row .fig .mock{padding:18px;display:grid;gap:14px;box-shadow:0 50px 90px -40px rgba(5,14,40,.55)}
.c-hero .h-in.pills{margin-top:26px}
@media (max-width:980px){.feat-row .wrap{grid-template-columns:minmax(0,1fr)}.feat-row.rev .txt{order:0}}

/* ---------- çözümler karşılaştırması ---------- */
.cmpx{border-radius:32px;background:#fff;overflow-x:auto;box-shadow:0 30px 60px -48px rgba(14,26,68,.5)}
.cmpx table{width:100%;min-width:680px;border-collapse:collapse}
.cmpx th,.cmpx td{padding:16px 20px;text-align:center;border-top:1px solid #E6EDF6;font-size:15px}
.cmpx thead th{border-top:0;font:800 18px/1.2 var(--f-d)}
.cmpx thead th:first-child,.cmpx th[scope=row]{text-align:left}
.cmpx th[scope=row]{font-weight:700}
.cmpx th[scope=row] a:hover{color:var(--p3)}
.cmpx .yes{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--p1);color:#fff}
.cmpx .yes .ico{width:16px;height:16px;stroke-width:2.6}
.cmpx .soft{font-size:13px;color:#8A97B4;font-weight:600}
.cmpx .pr th,.cmpx .pr td{font:800 18px/1.2 var(--f-d)}

/* ---------- kaynaklar ---------- */
.hcg.kay{grid-template-columns:repeat(4,1fr)}
.hcg.kay .hcc{position:relative;padding-bottom:80px;transition:translate .45s var(--ease)}
.hcg.kay .hcc:hover{translate:0 -6px}
.hcg.kay .go{position:absolute;left:24px;bottom:24px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--pale);transition:background .3s,color .3s}
.hcg.kay .go svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.hcg.kay .hcc:hover .go{background:var(--pc);color:#fff}
@media (max-width:1100px){.hcg.kay{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.hcg.kay{grid-template-columns:minmax(0,1fr)}}

/* ---------- tek müşteri hikâyesi ---------- */
.facts.res b{font-size:clamp(40px,4vw,56px)}
.story-c{display:grid;grid-template-columns:270px minmax(0,740px);gap:clamp(32px,5vw,88px);justify-content:center;align-items:start}
.story-c .side-c .v{display:block;padding:2px 10px 8px;font-weight:700}
.story-c .side-c .slogo{display:grid;place-items:center;padding:14px;border-radius:20px;background:var(--pale)}
.story-c .side-c .slogo img{max-height:56px;width:auto}
.quote-c{position:relative;margin:36px 0;padding:30px 30px 26px;border-radius:32px;background:var(--ink);color:#fff}
.quote-c > .ico{width:36px;height:36px;color:var(--p1)}
.quote-c blockquote p{margin-top:12px;font:700 clamp(20px,1.8vw,24px)/1.4 var(--f-d)}
.quote-c figcaption{margin-top:16px;font-size:15px;color:#C3D0EE}
.quote-c figcaption b{display:block;color:#fff}
@media (max-width:980px){.story-c{grid-template-columns:minmax(0,1fr)}.story-c .side-c{position:static}}

/* ---------- düzenleyiciden gelen metin ---------- */
.prose-c.narrow{max-width:760px;margin:0 auto}
.prose-c h3{margin:32px 0 10px;font-size:clamp(22px,2vw,28px);line-height:1.15;color:var(--ink)}
.prose-c a{color:var(--p3);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.prose-c ol{display:grid;gap:10px;margin:18px 0;padding-left:24px}
.prose-c img{border-radius:24px;margin:24px 0}
.prose-c figure{margin:24px 0}
.prose-c figcaption{font-size:14px;color:var(--ink-2);margin-top:8px}
.prose-c blockquote{margin:28px 0;padding:22px 26px;border-radius:28px;background:#fff;font:700 20px/1.45 var(--f-d);color:var(--ink)}
.prose-c table{width:100%;border-collapse:collapse;margin:24px 0;font-size:15.5px}
.prose-c th,.prose-c td{padding:12px 14px;border-bottom:1px solid #E1EAF5;text-align:left}
.prose-c strong{color:var(--ink)}
.prose-c .note-c p{margin:0}
.panel .body p a{text-decoration:underline}

/* ---------- kartların üst satırı: header'ın .top kuralını almasın ---------- */
.hubc .top,.hcc .top{position:relative;left:auto;right:auto;top:auto;z-index:auto;padding:0;pointer-events:auto}
.hubc:not(:first-child){min-height:300px}

/* ---------- iletişim ---------- */
.social.dark a{background:var(--pale);color:var(--ink)}
.social.dark a:hover{background:var(--p1);color:var(--ink)}
.cc.soc{gap:12px}
.cc small.muted{font-size:14px;margin-top:4px}

/* ---------- ana sayfadaki sahne olmadan açılan iç sayfa başı ---------- */
.c-hero .ctas .btn--glass{box-shadow:0 10px 30px -16px rgba(14,26,68,.35)}